Author Archive

1月の冷たい風とWebモーダルダイアログに潜む不具合

年が明けてしまいましたね。
 

日付に疎い私には、年がインクリメントしたところで特別おめでたがるところもありません。
 

とは言ってもやはりいろいろ周りの都合もあったりで、
うちは毎年正月になると、母親の実家(徒歩10分)へ行き寿司と酒をあおり集合写真を撮って祖母と麻雀を打つという恒例行事があるのですが、今年は年末年始連勤というやつをしまして未だに顔を出せていません。

休みは十分にとっているのですが、どこも事前に予定を入れていて後回しになっているという礼儀知らずな状態です。
 

今回の仕事で特に目立ったのがJavascriptのモーダルダイアログを多用するという点。
そもそもWebでモーダルを使っているサイトをあまり見たことがありませんでした。
 

気になったのはFireFoxでのshowModalDialogの挙動。

モーダルダイアログをネスト(入れ子)していくとウィンドウを動かしたときにフリーズしたりとかよくありました。

更にモーダルダイアログからファイルの出力をした時、FireFoxだけファイル名や操作を選択するボタンのないダイアログが表示されて、キャンセルしか選択できません。
一応、iframeを作ってそこで出力するとなんとかなりましたが。
 

あまり使われない機能はWebクライアントでもいくつもの不具合を抱えているのでしょうね。

サイズ指定子ウィンドウにframeset使った時InternetExplorerで起こる不思議空間(笑)とかもそうだし。

【JavaScript】フォーカス外れた時に消えるカレンダー

WEB上のカレンダーはマウスで枠外をクリックすると消えます。
でもタブキーでフォーカスを移した時は消えません。
googleだかのカレンダーもそうらしいです。
見てないんでよく知りませんが。

 

以前作った船宿ブログの日付入力カレンダーもそうなってたらしいです。
たしかに自分でもタブでどうのという実装をした覚えがないのでそうなのだろうと思います。

 

確認したらクリックでの非表示は実装してあった。
よかった。

 

今日違うシステムのカレンダー機能でその話になり、
船宿の方もタブで(略)がなかったので実装してみることにしました。

 

今回考えた方法はこれ。
(とは言え最初にキーで見ると言ったのは後輩だが)

 

まずカレンダー表示関数の中で

document.onkeydown = calKeyDown;

 

そして以下関数を追加

function calKeyDown(e) {
	var e = (e)? e : ((window.event)? event : null);
	if(9 == e.keyCode) {
		document.onkeyup = calKeyUp;
	}
}

function calKeyUp(e) {
	document.onkeyup = null;
	var e = (e)? e : ((window.event)? event : null);
	//フォーカスされている要素を取る(左IE,Opera、右FireFox)
	var target = (document.activeElement || window.getSelection().focusNode);
	if(!checkParentNode(target, "calendar", 0)) {
		hideCalendar();
	}
}

hideCalendar() はカレンダーを消す関数です。
必ずカレンダーを消す関数の中で document.onkeydown = null; してあげてください。

 

calKeyUp 関数の中で使っている checkParentNode 関数は
枠外クリック判定の時にも使った関数で
オブジェクトの親を遡って特定のクラス名のオブジェクトがあるかを判定します。

//(判定するオブジェクト, 判定に使うクラス名, 遡っている世代数) as boolean
function checkParentNode(pObj, pClass, pNum) {
	if (pNum>9) {
		return false;
	}
	if (pObj.className==pClass) {
		return true;
	}
	if (pObj.parentNode) {
		return checkParentNode(pObj.parentNode, pClass, pNum+1);
	}
	return false;
}

 

キーダウンですぐに消す判定をしないのは、
タブ押した直後はまだフォーカスが移ってないからです。

 

逆にキーアップのイベントだけを見るとどのキーが押されたのかわかりません。
(当然といっちゃ当然)

 

このコードはあまり汎用的とは言えませんね。
特にonkeydownを占有してるところあたり。

 

jQueryだとイベントも追加できるのでそういったもので作るといいかもしれません。

おめて゛とう! わーと゛ふ゜れすは 3.0 になりました!

なんもしてないのにブログ一覧トップになっちゃったからしょうがなく書く。

 

本当になんもしてない。ちょっと設定弄っただけ。

 
 
 

WordPressのバージョンアップをしました。

 

今までWordPress-muを使ってたけど、
3.0になって無印WordPressと統合してどちらからでも移行できるようになりました。
ちなみにmuはマルチユーザのことで複数のブログを管理できるってことです。

 

ただ日本語版をアップデートするにはちょっとコツが必要で、
一発で3.0日本語版を入れてもインストールに失敗するので、
一度英語版で3.0にアップデートしてから日本語版を入れます。

 

ただソースの中のコメントとかは英語のままみたいですね。

 

アップデートすると管理画面のアラートで
『cookie のセキュリティ向上のために wp-config.php に一行追記してください。
 /* 編集はここまで。ブログを楽しんでください */ の下だよ』
的なこと(文言忘れた)言われるけどソース中のコメントが英語だから
『/* That’s all, stop editing! Happy blogging. */』
になってます。
まぁ同ファイル内ならどこでも正常に動くはずです。

 

また
『RewriteRule が変わってます。
 wp-content/blog.php を wp-includes/ms-files.php に変更してください』
的なことも言われるので、これは .htaccess の該当箇所を変更してやればOK。

 
そしてそのままだとアラートが出っぱなしなので blog.php は削除するかリネームしておきましょう。
アプリケーションから見えなければアラートは消えます。

 

各ブログのアップデートもアラートが出ていると思うので最後にそれをやって一通り終了です。