Software – ページ 8 – デジタル生活めも（旧アーカイブ）

JavaScript のカレンダー例

こちらのサイトでJavaScriptのカレンダーの作り方が載っていたので年間カレンダーを作ってみました。

コピペでスミマセン。センセンシャル。

http://cya.sakura.ne.jp/java/calendar.htm

window.onload = function() {
  createMonth = function(thisMonth) {
    var myDate = new Date();
    var arrWeek = new Array("日","月","火","水","木","金","土");
    var monthNum = new Array(31,28,31,30,31,30,31,31,30,31,30,31);
    myYear = myDate.getFullYear();
    if ((myYear%4 == 0 && myYear%100 != 0) || myYear%400 == 0){
      monthNum[1] = 29;
    }
    myMonth = myDate.getMonth();
    today = myDate.getDate();
    myDate.setMonth(thisMonth);
    myDate.setDate(1);
    weekDay = myDate.getDay();
    tblLine = Math.ceil((weekDay + monthNum[thisMonth])/7);
    var tblArr = new Array(7*tblLine);
    for (i = 0; i < 7*tblLine; i++) tblArr[i] = " ";
    for (i = 0; i < monthNum[thisMonth]; i++) tblArr[i + weekDay] = i + 1;
    var title = document.createElement('caption' + thisMonth);
    var divId = document.getElementById('result' + thisMonth);
    title.innerHTML = myYear + "年" + (thisMonth+1) + "月 ";
    var table = document.createElement('table');
    divId.appendChild(title);
    divId.appendChild(table);
    table.id = 'data' + (thisMonth);
   var tbody = document.createElement('tbody');
    tbody.id = 'tbodyID';
    table.appendChild(tbody);
    var tr0 = document.createElement('tr');
    for (var i = 0; i < 7; i++) {
      var td0 = document.createElement('td');
      td0.innerHTML = arrWeek[i];
      tr0.appendChild(td0);
    }
    tbody.appendChild(tr0);
    for (var i = 0; i < tblLine; i++) {
      var tr = document.createElement('tr');
      for (var j = 0; j < 7; j++) {
        var td = document.createElement('td');
        td.innerHTML = tblArr[j + i*7];
        if (myMonth == thisMonth && tblArr[j + i*7] == today) {
          td.style.backgroundColor = 'black';
          td.style.color = 'white';
        }
        tr.appendChild(td);
      }
      tbody.appendChild(tr);
    }
  }
  for (var i = 0; i < 12; i++) {
    createMonth(i);
  }  
}

<!DOCTYPE html>
<html lang="ja">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  <meta http-equiv="Content-Style-Type" content="text/css" />
  <meta http-equiv="Content-Script-Type" content="text/javascript" />
  <script type="text/javascript" src="./calendar.js"></script>
</head>
<body>
<div class="box">
<div id="result0" style="position:absolute;top:20px;left:50px"></div>
<div id="result1" style="position:absolute;top:20px;left:250px"></div>
<div id="result2" style="position:absolute;top:20px;left:450px;"></div>
<div id="result3" style="position:absolute;top:20px;left:650px;"></div>
<div id="result4" style="position:absolute;top:220px;left:50px"></div>
<div id="result5" style="position:absolute;top:220px;left:250px;"></div>
<div id="result6" style="position:absolute;top:220px;left:450px;"></div>
<div id="result7" style="position:absolute;top:220px;left:650px;"></div>
<div id="result8" style="position:absolute;top:440px;left:50px;"></div>
<div id="result9" style="position:absolute;top:440px;left:250px;"></div>
<div id="result10" style="position:absolute;top:440px;left:450px;"></div>
<div id="result11" style="position:absolute;top:440px;left:650px;"></div>
</div>
</body>
</html>

WordPress の画像編集

件のキーワードで検索したブログで解決しました。ありがたや～m(_ _)m

/pass/to/wordpress/wp-include/class-wp-image-editer-gd.php の450行 switch 文の手前に、

while(@ob_end_clean());

を追加すると画像が編集できるようになりました。

参考URL：【備忘録】WordPressの画像編集で画像が表示出来なくなった場合の対応方法 – Dream Seed

IE11のリセット

先週、Wordpress で再ログインしようとするとユーザー名とパスワードを要求されたのでいつもの通り[ログイン状態を保存する] にチェックを入れてログインできたのですが、ブラウザを終了するたび再びユーザー名とパスワードを求められるようになりました。

IE11だけで起きる不具合でEdgeではログインできました。またEPSON機のIE11でもログインできたのでVAIO機のIE11が壊れていることがわかりました。

Google 先生に訊いてみるとIEをリセットすると良いとのことで、[コントロールパネル]-[プログラムと機能]-[Windowsの機能の有効化または無効化]から、IE11のチェックを外して[OK]、再起動、再び[コントロールパネル]からチェックを入れて有効化したところ直りました。

原因は不明ですが今回は解決済みとしておきます。

Kaspersky2017のWi-Fiの通知

Kaspersky2017 でセキュアコネクションを起動しているとき、[設定]-[ファイアウォール] の[Wi-Fi ネットワークの脆弱性について通知する] チェックがグレーアウトする問題。

カスペルスキーセキュアコネクションを起動しているとなる仕様とのことです。セキュアコネクションで接続が保護されているときは問題ないそうです。（サポセン談

tableに九九を表示するメソッド

以前のエントリーで javascriptの2次元配列の生成についてwriteln()メソッドを用いて単位行列を表示するスクリプトをアップしました。

今回はその応用でcreateElement() メソッドを用いてtableに九九を表示するスクリプトを作ってみました。

Array.matrix = function (m, n, initial) {
    var a, i, j, mat = [];
      for (i=0; i < m; i += 1) {
        a = [];
        for (j = 0; j < n; j += 1) {
          a[j] = initial;
        }
        mat[i] = a;
      }
      return mat;
}

// ゼロで埋められた 10 X 10 の行列を生成する

var myMatrix = Array.matrix(10, 10, 0);

Array.multiplicative = function (n) {
    var i, j, mat = Array.matrix(n, n, 0);
    for (i=1; i < n; i += 1) {
      for (j=1; j < n; j += 1) {
        mat[i][j] = i + " x " + j + " = " + i*j;
      }
    }
    return mat;
};

// 九九が入力された配列を生成する

myMatrix = Array.multiplicative(10);

// 生成された行列を書き出すメソッド

Array.output = function (m, n) {
  window.onload = function() {
    var mat = Array.multiplicative(n);
    var divId = document.getElementById('result');
    var table = document.createElement('table');
    divId.appendChild(table);
    var tbody = document.createElement('tbody');
    table.appendChild(tbody);
    for (var i = 1; i < m; i++) {
      var tr = document.createElement('tr');
      for (var j = 1; j < n; j++) {
        var td = document.createElement('td');
        td.innerHTML = myMatrix[i][j];
        tr.appendChild(td);
      }
      tbody.appendChild(tr);
    }
    return mat;
  }
};

printMatrix = Array.output(10,10);

WordPressの再インストール

WordPress でJavaScript を動かそうとしてファイルを色々いじったらカレンダーのレイアウトが壊れたのでWordpress の再インストール経緯をメモ。

# service httpd stop
# cp /pass/to/wordpress/.htaccess /home/gusachan/
# cp /pass/to/wordpress/wp-content/uploads /home/gusachan/
# cp /pass/to/wordpress/wp-content/plugins /home/gusachan/
# cd ..
# rm -rf wordpress/
# cp -R wordpress/ /pass/to/wordpress/
# cd /home/gusachan
# cp -R uploads/ /pass/to/wordpress/wp-content/
# cp -r plugins/ /pass/to/wordpress/wp-content/
# cp .htaccess /pass/to/wordpress/
# cp wp-config-sample.php wp-config.php
# vi wp-config.php （データベース、ユーザー、パスワード編集
# chmod 400 wp-config.php
# cd ..
# chown -R apache:apache wordpress/
# service httpd start

一応、[ダッシュボード]-[ツール]-[エクスポート]からデータをエクスポート、uploads ディレクトリをバックアップしてから行いました。

[ダッシュボード]-[更新]にも[再インストール]ボタンがありましたね。(^^;

WP-Snowプラグイン

WordPress 背景に雪を降らせるJavaScript を設置しようとしましたが、canvas タグの挿入場所がわからなかったので同様の機能を持つプラグインを使いました。

WP Super Snow Plugin
https://ja.wordpress.org/plugins/wp-super-snow/installation/

zip ファイルを解凍して、wp-super-snow ディレクトリを ./wp-content/plugin/ ディレクトリに移動。ダッシュボードからプラグインを有効化します。

春は桜吹雪のプラグインを使ってみたいですね。

スタイルシートでテーブル制御

JavaScript でHTMLタグのテーブル行<tr id=”foo”>の表示、非表示を切り替えるスクリプト

document.getElementById('foo').style.display = "none";  // 非表示
document.getElementById('foo').style.display = ""; 　　   // 表示

テーブル制御するには、同じページのリンクにリロードせずに動的に(onclick)イベント処理をする関数を実装する必要がありますね。本来はPHPが得意な分野だと思った。（粉みかん

jQuery の fullcalendar

jQuery カレンダーfullcalendarを使ってみました。

参考URL: 多機能のカレンダーを実装するjQueryプラグインのFullCalendar

リンク先 Download|FullCalender からzip ファイルをダウンロード、解凍。最新版は、fullcalendar-3.2.0.zip （2017年3月7日現在）

カレントディレクトリに./fullcalendar.min.css, ./fullcalender.js, ./lib/moment.min.js, ./lib/jquery.min.js, ./lib/jquery-ui.min.js, ./fullcalendar.js, ./locale/ja.js を以下の配置でindex.html を作ります。

<html>
<head>
<meta charset='utf-8' />
<link href="./fullcalendar.min.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="./lib/moment.min.js"></script>
<script type="text/javascript" src="./lib/jquery.min.js"></script>
<script type="text/javascript" src="./lib/jquery-ui.min.js"></script>
<script type="text/javascript" src="./fullcalendar.min.js"></script>
<script type="text/javascript" src="./locale/ja.js"></script>
<script type="text/javascript">
$(document).ready(function() {
  $('#calendar').fullCalendar();
});
</script>
</head>
<body>
<div id="calendar"></div>
</body>
</html>

demos ディレクトリの selectable.html ではイベントを書き加えることができます。しかし、データとして保存するにはPHPと連携してJsonデータの受け渡しを実装しないといけないので難易度高めに感じました。
Google カレンダー、使おう！(直球)

ちなみにシェルスクリプトでは、

$ cal [-y] month year

参考URL: http://webcache.googleusercontent.com/search?q=cache:Ui3UAAmc3nMJ:sookibizviz.blog81.fc2.com/blog-entry-344.html+&cd=3&hl=ja&ct=clnk&gl=jp

小数係数の処理

前回のエントリーでは連立1次方程式の解の分数表示、分母の符号処理について冗長なコードを書いてみました。（エレガントな方法ではありませんが・・・。）

https://stuffy.mydns.jp/~gusachan/javascript/SimultaneousEquations.html

今回は、小数係数の取り扱いについて考えてみたいと思います。

  function isInteger(w) {
    w = parseFloat(w);
    return Math.round(w) === w;
  }
  var getDecimalPointLength = function(number) {
    var numbers = String(number).split('.'),
        result  = 0;
    if (numbers[1]) {
        result = numbers[1].length;
    }
    return result;
  };
  if(!(isInteger(a1) && isInteger(b1) && isInteger(p1))) {
    var s1 = getDecimalPointLength(a1);
    var t1 = getDecimalPointLength(b1);
    var u1 = getDecimalPointLength(p1);
    var v1 = Math.max(s1, t1, u1);
    var a1 = a1*Math.pow(10, v1);
    var b1 = b1*Math.pow(10, v1);
    var p1 = p1*Math.pow(10, v1);
  }
  if(!(isInteger(c1) && isInteger(d1) && isInteger(q1))) {
    var s2 = getDecimalPointLength(c1);
    var t2 = getDecimalPointLength(d1);
    var u2 = getDecimalPointLength(q1);
    var v2 = Math.max(s2, t2, u2);
    var c1 = c1*Math.pow(10, v2);
    var d1 = d1*Math.pow(10, v2);
    var q1 = q1*Math.pow(10, v2);
  }
  var x1= d1*p1-b1*q1, y1 = a1*q1-c1*p1;
  var z = a1*d1-b1*c1, z1 = Math.abs(z);

連立方程式の片方、または両方に小数係数が含まれている場合、小数点以下の桁数を取得し、方程式を10の最大桁数のべき乗倍して係数を宣言し直す方法を採りました。

また割り切れない分数の定量化として小数表示併記を追加しました。

参考URL: http://shanabrian.com/web/javascript/get-decimal-point-length.php

http://blog.at-human.com/2016/02/10/js%E6%95%B4%E6%95%B0%E3%81%8B%E3%81%A9%E3%81%86%E3%81%8B%E3%82%92%E5%88%A4%E5%88%A5%E3%81%99%E3%82%8B%E9%96%A2%E6%95%B0%EF%BC%88isinteger%EF%BC%89/

2024年11月
日	月	火	水	木	金	土
					1	2
3	4	5	6	7	8	9
10	11	12	13	14	15	16
17	18	19	20	21	22	23
24	25	26	27	28	29	30