2010 年の集計結果

去年もやった ので、今年もしてみます。

◆◆Google Analytics による集計（2010/01/01〜2010/12/30）
◆タイトル別のコンテンツ

1. (5.64%) Just Metal, Just Baroque.
2. (3.17%) PHP4.x で XML を読み込み、データを利用する (2009/08/15)
3. (2.91%) Mac 版 Google Chrome でのブックマークを編集・削除する (2009/11/26)
4. (2.64%) html5 の Canvas を使ってみる (2009/12/16)
5. (2.48%) 現在ページの URL を取得する php を用いての ssi (2009/11/06)
6. (2.39%) 連想配列のキーによるソート (Javascript / php) (2009/09/30)
7. (1.77%) Mac で Diff を使いたい場合 (2010/02/22)
8. (1.63%) Opera 10 での RSS 表示 (2009/10/03)
9. (1.59%) 重ねた画像の表示の仕方を指定する(globalCompositeOperation) [html5 の Canvas を使ってみる：第卌一回] (2010/04/11)
10. (1.47%) 読み込んだ画像にマスクをかける(clip) [html5 の Canvas を使ってみる：第卅一回] (2010/03/15)

こんな感じでした。なにかお役に立ったエントリーはありましたでしょうか？


◆キーワード

1. php4 xml 読み込み
2. mac diff
3. php xml 読み込み
4. myspace 重い
5. safari スキン
6. php 現在のページ
7. opera rss
8. javascript 連想配列 ソート
9. cms 自作
10. javascript ラジオボタン チェックされているか

なんと 1 位の「php4 xml 読み込み」は、去年もキーワードで 1 位でした。


◆ブラウザと OS

1. (24.84%) Firefox / Windows
2. (23.73%) Internet Explorer / Windows
3. (16.57%) Chrome / Windows
4. (13.28%) Safari / Macintosh
5. (6.31%) Firefox / Macintosh
6. (5.46%) Chrome / Macintosh
7. (3.45%) Opera / Windows
8. (1.43%) Safari / Windows
9. (0.95%) Safari / iPhone
10. (0.82%) Firefox / Linux

去年は IE が 1 位でしたが、今年は Firefox が 1 位でした。9 位に iPhone からのアクセスが入っているのが興味深いですね。


◆全ての参照先

1. (82.99%) google / organic
2. (10.19%) (direct) / (none)
3. (2.31%) yahoo / organic
4. (1.61%) blogger.com / referral
5. (0.32%) search / organic
6. (0.25%) d.hatena.ne.jp / referral
7. (0.25%) s.luna.tv / referral
8. (0.22%) d.aoikujira.com / referral
9. (0.18%) search.goo.ne.jp / referral
10. (0.15%) twitter.com / referral

今年も Google が圧倒的ですね。そしてなんだか Yahoo! が票を伸ばし、twitter が 10 位に入ってます。


◆画面の解像度

1. (21.94%) 1280 x 1024
2. (16.57%) 1280 x 800
3. (10.22%) 1920 x 1200
4. (9.63%) 1680 x 1050
5. (9.56%) 1024 x 768
6. (8.52%) 1920 x 1080
7. (6.17%) 1440 x 900
8. (3.26%) 1366 x 768
9. (3.18%) 1600 x 1200
10. (1.09%) 1400 x 1050

去年よりも大画面化が確実に進んでいますね。しかし横が 1366px とか縦が 1050px とか見たことないです。

今年もこうやって、無事一年を振り返ることができました。みなさんありがとうございます。
来年もどうぞ宜しくお願い申し上げます。

goSearchForYou に自分で検索エンジンを追加できるようにしてみた

先日、リニューアルした goSearchForYou（Safari / Chrome 拡張）を 2.1.0.0 にアップデートしてみました。

主な変更点は次の通りです。

• ウェブサービスを追加できるように変更
• ウェブサービスの並び替えや削除をできるように変更
• ウェブサービスの名称変更をできるように変更

ウェブサービスの追加は、対象とする検索フォームのテキストボックスをクリックした上で（情報を取得するため、クリックの必要があります）、F9 キー（OPTION 画面で変更可）を押すと、追加画面が出てくるので、名前を入力し（最大全角 12 文字）、挿入箇所を指定して、「追加」ボタンを押します。


一度追加したサービスの場合は、上記の操作で名称変更をすることができます。

追加できるウェブサービスは、以下の通りです。

• クリックしたテキストボックスが <form> 要素内に含まれている
• <form> の実行先が Javascript ではない
• 実行先のソースから文字コードを取得でき、かつUTF-8・EUC-JP・Shift_JIS である

もし 2 回、追加画面を表示させる操作を行っても追加できない場合、上記のいずれかに該当していると思われます。

ウェブサービスの並び替えは、ドラッグ & ドロップの操作でできます。


ウェブサービスの削除は、「ゴミ箱」エリアへドロップします。ゴミ箱から出したいときは、「ゴミ箱から出す」ボタンを押してください。


ウェブサービスの名称変更は、最大全角 12 文字で名前を付けることができます。


良かったら、下記からどうぞ。

Chrome Extensions:
goSearchForYou - Google Chrome 拡張機能ギャラリー

Safari Extensions:
goSearchForYou | Prime Design Works | Webサイト制作・開発 | 京都市内・京都府

連想配列の、あるキーごと消したい時は delete

連想配列で、キーごと消したい場合は delete を使うだけでいいって、とても簡単。

var test = {browser: "safari", version: "5.0.3"};
// 上記の version を消したいとする
delete test.version;

フォームの部品を取得する時は、elements と options

フォームの部品を洗いざらい取得したい場合には、elements と options を使えば簡単に取得できる。

例えば、「id=test」を持つ form 要素があったとして、部品の name と value を取得したい、ついでに、セレクトボックスの option 要素に定義している　textContent も取得したいとすると、こんな感じになる。

// 変数 thisForm に form 要素を定義
var thisForm = document.getElementById("test");
// 格納庫として変数 formElms を定義
var formElms = {names: new Array(), values: new Array(), texts: new Array()};
// form 要素内の部品を順に取得
for (var x = 0; x < thisForm.elements.length; x++) {
// それぞれを格納
  formElms.names.push(thisForm.elements[x].name);
  formElms.values.push(thisForm.elements[x].value);
// 部品のタグ名が select だった場合
  if (thisForm.elements[x].tagName == "SELECT") {
// select 要素内の option 要素を順に取得
    for (var y = 0; y < thisForm.elements[x].options.length; y++) {
      formElms.texts.push(thisForm.elements[x].options[y].textContent);
    }
  }
}

クリックした要素を取得する時には srcElement

クリックした要素のタグ名やら id やらを取得したいとき、srcElement が活躍してくれる。

document.onclick = function(evt) {
var thisTag = evt.srcElement.tagName;
};

クリックした event から srcElement で要素を取得し、tagName でタグ名を取得している。ただ、この時 tagName で取得できる文字列は大文字なので、好みにより「evt.srcElement.tagName.toLowerCase()」で小文字にしてもいい。

ちなみにクリックした要素の「階層上」上の要素を取得したい場合は、「evt.srcElement.parentElement.tagName」にすれば良い。

Safari/Chrome Extension でデータを渡す際は new Object() で

Safari/Chrome 機能拡張で、ウェブページ側で読み込んでいる Javascript とバックグラウンドで働く Javascript 間でデータを受け渡しすることがあると思うけど、それに連想配列のような複数データを持たせるときは、new Object() で定義したものでないと読み込めない。

例えば連想配列として、 var keys = []; で定義したものに色々値を設定して渡しても、undefined となってしまう。そこで、var keys = new Object(); と定義し、同じように設定すれば、キチンとデータを渡してくれる。

私はクセで前述のようにしてしまうので、結構難儀した。

Safari/Chrome Extension を作るときは location.href でなく document.URL

Safari/Chrome 拡張を開発する際、表示しているウェブページの URL を取得する場面があるかもしれないけど、この時は location.href ではなく document.URL で取得した方がよいと思う。

例えば 2 バイト文字が入っている場合、location.href では Safari と Chrome では異なる結果を返してしまう。Safari ではロケーションバーそのままの値で、Chrome ではそれがエンコードされた値で返ってくる。document.URL であれば双方ともエンコードされた値となるので、Safari/Chrome 共に同じソースでいける。

MySpace が使いづらくなった件について

先日、MySpace のユーザーページがリニューアルされた。しかし、とても使いづらくなってしまった。あまりにもそういう点が多いので、纏めてみる。

1) Twitter や Facebook を意識し過ぎて、逆に見づらくなった HOME 画面

MySpace が SNS である以上、コミュニケーションツールとして、他のユーザーの動向を見られる場所があるのは当然だと思うけど、それのエリアが広過ぎる。例えば Twitter や Facebook はこういうエリアは 1 列だけなのに対して、MySpace では 2 列もあり、視界に入り過ぎて逆に煩雑感があるように思う。

＃これはこの近況エリアの左上にアイコンがあり、それを押すことで解消できた。

2) ブログの閲覧数や Kudo が消えた

ブログの管理画面では、自分のエントリーがトータルで、週で、当日で、どれくらい閲覧されたかが表示されていたのに、これがなくなっている。さらに、Facebook の like に当たる「Kudo」もなくなっており、どれくらい押されたかも判らないし、押すこともできなくなっている。なんか、残念な感じだ。

3) アップロードした曲の場所移動ができない

これはブラウザのせいかもしれないが（それでも Safari / Chrome / Firefox / Opera で試した）、曲の移動ができそうなインターフェイスなのに、曲をドラッグできるのに、ドロップできない。なんじゃこれ。

＃「Public Songs」にしたらドロップできることが判った。。。つーかなんで「All Songs」でドロップできんのじゃ？

4) フレンド管理での AtoZ がなくなった

フレンド管理の画面では、A から Z まで（その他、記号とかも）のリンクがあり、例えば W を押すと、W から始まるフレンドに絞り込むことができたけど、このリンクがないので、絞り込めない。F から始まったけど、名前なんだっけって時に使えたんだけど。。。

5) フレンド管理でのカテゴリがなくなった

これが個人的には一番痛い。私は自分の曲をアップしたときにお知らせするフレンドを集めたカテゴリと、ただたまに挨拶を書きに行くフレンドを集めたカテゴリを作成して、そういう場面になったら活用していたけど、それが完全にできなくなってる。さっきは久しぶりに挨拶回りをしたけど、この機能がなくなっていたから、一つ一つブラウザのブックマークに突っ込みながらやっていった。かなりめんどくさい。

＃HOME 画面にはセレクトボックスみたいな UI のところにカテゴリのリンクがあったけど、
＃それを押したからと言って、カテゴリ内のフレンドを一覧で出してくれるわけではない。

もちろんリニューアルって大事なことだと思うけど、ここまで機能が削られると正直ヘコむわ。。。なんでこうなったんだろ。次回のリニューアルでは「使いやすく」なってほしいな。

goSearchForYou をアップデートしてみた（2.1.0.0）

先日、リニューアルした goSearchForYou（Safari / Chrome 拡張）を 2.1.0.0 にアップデートしてみた。

変更点は次の通り。

• 表示時のクリックアクションの対象だったキーを、Shift キーのみでしたが、Alt キーもしくは Command キー（Mac）/ Ctrl キー（Win）でも動作するように変更（OPTION 画面で設定可）
• 表示時のショートカットキー（F1～F12）を再度押せば非表示になるよう変更（OPTION 画面で設定可）
• 12 種の Web services を追加し、48 種類に増量

この変更で、「Alt キー + クリック」とかに設定しておけば、単にテキストをコピーしたい場合などに発動してしまうことがなくなり、ショートカットキーで呼び出した人が「や〜んぴっ」って非表示にしたい場合はそのまま同じキーを押すことで隠すことができるようになったので、使いやすくなったかな・・・とは思う。

追加した 12 種類は以下の通り。

• Google 書籍検索
• Google ショッピング検索
• Chrome 拡張機能検索
• Safari 機能拡張検索
• Nexco 高速道路検索
• Homes 不動産検索
• 映画.com 検索
• Facebook 検索
• 素材辞典検索
• Cosmeet 検索
• Yahoo! ニューズ検索
• Yahoo! ファイナンス検索

良かったら、下記からどうぞ。

Chrome Extensions:
goSearchForYou - Google Chrome 拡張機能ギャラリー

Safari Extensions:
goSearchForYou | Prime Design Works | Webサイト制作・開発 | 京都市内・京都府

配列内の要素の順番を取得しつつ、それを if 文で問い質す

var arraySample = new Array("s","a","m","p","l","e");

例えば上記のような配列があったとして、そこに "m" が含まれるかどうかを確かめたい、さらに配列内でその "m" がある順番を使った処理を行いたい場合、こうやっていた。

m = arraySample.indexOf("m");
if (m != -1) {
  alert(m); // 2 がアラート表示される
}

しかしこうやれば 1 行少なくて済むことが判った。

if ((m = arraySample.indexOf("m")) != -1) {
  alert(m); // 2 がアラート表示される
}

36 種の検索をする goSearchForYou が「Chrome エクステンション ナビ」に掲載されました

先日、「goSearchForYou をリニューアルしてみた」で色々と変えた goSearchForYou ですが、機能を変える前にも評価いただいていた「Chrome エクステンション ナビ」にリニューアルをお知らせしたところ、再度評価をしてくださいました。

以下が記事です。Google Chrome 内のダウンロードページにコメントいただいたことに今後対処する予定です。

Chromeエクステンション ナビ : goSearchForYou ＜更新＞

Safari/Chrome Extension "hideMySpaceAds" を公開してみた

先日、MySpace のユーザーが使用する画面がリニューアルされたけど、普段チェックする「Artist Dashboard」が下の方に追いやられてしまい、確認するのにスクロールが必要になってしまった。。。さらに、左上の「my[___]」ってロゴにカーソルをあわせると、アニメーションが始まるという遊び心も用意してくれてるけど、こんな感じで広告が邪魔。


別にアニメーションが隠れるのは大した問題じゃないけど、広告を消す機能拡張を作ってみた。これで「Artist Dashboard」がだいぶ上に来る。





良かったら、下記からどうぞ。

Chrome:
hideMySpaceAds - Google Chrome 拡張機能ギャラリー
Safari:
hideMySpaceAds | Prime Design Works | Webサイト制作・開発 | 京都市内・京都府

F1 フェテルのワールドチャンピオン確定後のチームラジオ

先日のアブダビ GP で今年の F1 のワールドチャンピオンが決定した。ゼバスティアン・フェテル。23 歳での最年少チャンピオン。本当におめでとう。

アロンソが 7 位で終えたあと、フェテルのチームラジオが流れたが、フェテルは声にならない声で答えていた。その感極まった感じに思わずグッときてしまう。

YouTube - Sebastian Vettel F1 World Champion 2010 at Abu Dhabi Grand Prix 2010
これの 1:46 くらいから始まる。

SP 野望篇

先日放送されていたドラマ「SP」を見てしまい、そして気に入ってしまったので、見事にフジテレビの罠に嵌ってしまった。しかし気に入ったのでまぁいいかと思ったけど、この「SP 野望篇」は壮大な予告編だった。ストーリーはほとんど進まず、アクションシーンの連続。なんかスッキリしたような消化不良のような、不思議な感覚。

私はアクション映画でも、ランボーのようにとにかく爆発・破壊すればいいというような類いは嫌いで、ターミネーターは観たことがない。対して、酔拳のような武術メインのものは昔から好きだった。この SP は後者に分類されると思うので、個人的には好きだけど、もう少しストーリーを進めても良かったのではないかと思う。それほど、進まない。

iPod Touch のカレンダーでも Google カレンダーと同期してくれる

Google カレンダーと同期している場合、iPhone って、外出先でカレンダーを更新するともちろん同期してくれるのは当然だけど、iPod Touch でも同じだった。

iPod Touch のカレンダーを Google カレンダーと同期させ、外出先に持って行く。もちろん Wi-Fi 環境はないので、たとえなにかを入力したりしても、iPod の中だけの更新になるけど、家に帰って Wi-Fi 環境に繋ぐと、自動的に Google カレンダーと同期してくれて便利。

iPhone いらないかもなぁ。

月額 8 円の Android 環境

京都市右京区にある京都ファミリーの電気売り場だったところに、先週金曜 29 日にミドリ電化がオープンしたので、なにかええもんないかと行ってみた。用事もないのに冷蔵庫やオーディオを見たり、マッサージチェアを座ってみて 75,000 円！？とあまりの安さに驚愕したり、iPod は売ってるが Mac は売ってないと愕然としたり。その後、au から出る新しい Android を見たいなと売り場に行くと、引っかかってしまった。

販売員が実に熱心に攻撃してくる。なんせ月額 8 円で Android が手に入りますよ旦那、と。Universal 料の 8 円だけ。残りはミドリさんに負担してもらってます、と矢継ぎ早に攻めてくる。通話とか通信とか、au の回線を使えばその分料金は発生するけど、Wi-Fi で使う分には 8 円でいけるわけですよ、と価格トークは止まらない。割引は 2 年間なので、8 円なら 2 年使っても 192 円と、ありえないでしょ？とおクチが冴え渡る。とりあえず他のお客がその販売員に話しかけたときに脱出したけど、、、気になる。Android 環境が 8 円で手に入るとは、非常に気になる。しかし、そんなつもりでミドリに来ていないので、一切の証明書を持っていない。

すると、「お取り置きしますよ」と予想された答えが返ってきた。どうやら昨日は 25 台入荷したが全て売り切れ、今日の昼に急遽 5 台入荷して、今 2 台売れているらしい。確かに、棚に貼ってある紙には 1 と 2 に「×」がしてある。まぁこれ自体促進のための虚偽かもしれないとも思いつつ、やっぱり気になるので、決断。8 円ならいいか、と。名前と電話番号を渡して、帰宅。

雨の中往復し、証明書等必要なものを持って再び来店。さっきの販売員が新しい獲物に食らいついているのでしばらく待っていると、見知らぬ番号から電話が。聞いたことのない声のお姉ちゃんだ。何かを期待したのも束の間、目の前で電話をかけている販売員だった。本当に帰ってくるか心配だったんだろうが、「あなたの後ろにいます」と言って電話を切り、カウンターへ。契約を済ませて家路につくが、慣れない靴で雨の中歩いているため靴擦れでかなり痛い。右足を引き摺りながら帰り、早速開封してみた。



はっきり言って携帯「電話」じゃないな、これ。さっきのお姉ちゃんに尋ねてみたけど、通話するときはスピーカーとマイクか、専用のヘッドセットでやるらしい。どうもヘッドセットというと怪しげなヘッドギアを思い出してしまうが、そうではないらしい。まぁ通話をする予定はないのでいいけど。

まず Wi-Fi の設定をし、「設定 -> 通信 -> モバイルネットワーク設定」でパケット通信を切る。これをしないとパケット代として請求されてしまうらしい。Google アカウントの設定も済ませ、色々と使ってみた。iPod touch ではホーム画面のスクロールは簡単にできるが、IS01 ではタイミングが必要なのか、何回かトライしてようやくできる感じ。ブラウザのスクロールも iPod touch に比べてぎこちない。Apple はこの辺をじっくりと作り込んであるなぁという印象。

画面はさすがにデカいのでとても見やすい。ブラウザもストレスない感じで使える。なによりも iPod touch にないのは物理的なキーボード。これは非常に良い。説明書を見ずに使ったが、ALT キーと一緒に押して出る文字や SHIFT キーと一緒に押して出る文字等、すぐに気づいた。それでも出ない記号は ALT キーも SHIFT キーも一緒に押したら出た。色々立ち上げて家のアイコンのボタンを押したらホーム画面に戻るけど、「起動中アプリ」には残ってしまう。はて、と思ったが、なにか起動中に家のボタンの左にある終話キーみたいなのを押したら、ちゃんと終了してくれた。

iPod touch と同じ Wi-Fi 環境であるにも関わらず、iPod touch の Safari よりも高速であると感じた。かなりサクサクと表示してくれる。それと、iPod touch では Wi-Fi を切らないと電池消耗が激しいけど、IS01 はそんなことはない気がする。

ま、新しいオモチャってことで、楽しんでみよっと。

Mac に確認用として Windows XP を Boot Camp でインストールする

先日、仲間の SOHO がかつて「販売がなくなるから余分に手に入れた」Windows XP を安価で譲ってくれた。私は 10 年の Mac ユーザだけど、当然 Windows での表示確認や動作確認が必要であり、以前から Boot Camp でのインストールに興味を持っていた。ただ、去年終わりくらいまで当方のマシンは PowerPC だったので、Intel チップが必要な Boot Camp をインストールすることはできなかった。現在は Intel ベースがメインマシンなので、環境は整っていることもあり、その XP をインストールしてみようと思った。

インストールに関する詳しい情報は「アップル - サポート - Boot Camp」から得ることができるけど、ここでは非常にシンプルに流れを記してみる。

★必要なもの

1. Intel ベースの Mac
   →「メニューバーのりんご」をクリックし、option キーを押した時に表示される「システムプロファイラ...（一番上）」をクリックする。表示された画面左側にある「ハードウェア」をクリックし、右側に表示される「プロセッサ名」に「Intel」が含まれていれば OK
2. Windows XP SP2 以降、もしくは Windows Vista、Windows 7
   →購入時に SP2 以降か確認するか、既に所有している場合、Windows CD の盤面に「Service Pack 2 適用済」と記載されているので、それを確認する。なお、SP1 をとりあえずインストールし、アップデートすることはできないみたい。

★インストール手順

1. アップデートを確認する
   →「ソフトウェアアップデート」を実行し、アップデートを行う。
2. 「Boot Camp アシスタント」でインストールを行う
   →「アプリケーション > ユーテリティ」にある「Boot Camp アシスタント」を起動し、表示される手順通りに進める。
3. Windows 用のパーティションを生成する
   →今回は確認用として記載しているので、最少の 5 GB で充分だと思う（実際、私も 5GB でのインストールを行った）。
4. Windows をインストールする
   →Windows CD を入れてインストールを行う。手順に従っていけばとりあえず再起動後、嫌なブルースクリーンが出る筈。
5. パーティションを選択する画面で「BOOTCAMP」が含まれているものを選択する
6. フォーマットを選択する
   →5GB しか区切ってないので、「FAT」を選ぶ。「クイック」が付いた項目でもちゃんとやってくれるが、「現在のファイルシステムをそのまま使用」は選んではいけない、とのこと。
7. Windows OS が起動し、とにかく表示が粗いセーフモードみたいな画面になる
8. Windows CD を取り出し、Mac OS X CD を挿入し、Boot Camp ドライバをインストールする
   →これを入れないとなんにもできない。

まぁざっくりとしているので、是非上記のアップルのサポートサイトからマニュアル等をダウンロードしてご確認をば。

Facebook に登録してみた

Facebook にとりあえず登録だけしてみた。使い方をよく見ていないので、あまり書くことはないけど、登録で生年月日を選ぶときに少し驚いた。

年のセレクトボックスは 1905 年から選べる。1905 年て。今 105 歳やんか。105 歳が Facebook するってなかなか想像し難い。1900 年ではいけなかったんだろうか。なんか中途半端だし。

全日本女子バレーボールは強いなぁ

世界バレーが始まって、昨日録画しておいたポーランド戦を今見たけど、昔に比べて随分と強くなったなぁ。私が高校の時くらいから見てきたけど、今が一番強いんじゃないだろうか。

なんと言っても竹下が凄過ぎる。世界最高のセッターというのは伊達じゃない。リベロの佐野も同じく凄過ぎる。逆に、この二人が抜けたとき、どうなってしまうんだろうかと、ちょっと不安。

goSearchForYou をリニューアルしてみた

先日アップデートした goSearchForYou をバージョン 2 にリニューアルしてみた。

主な変更点は次の通り。

• 表示方法を F12（OPTION 画面では F1〜F12 まで変更可）、Shift キーを押しながらのクリックへ変更
• 非表示方法の変更（検索ボックスから離れた位置でのクリックへ変更）
• コンテクストメニューの廃止
• 左上の固定場所からカーソルの近くでの表示へ変更
• OPTION 画面の独立化

今までは出現場所が左上に固定だったけど、カーソルの近くに表示させたり、ショートカットキーもファンクションキー単体で使えるようにしたり、隠す場合も検索ボックスから離れたところをクリックする、というように利便性を図ってみた。また、ちょっと狭かった OPTION 画面も全画面表示としたので、見やすくなったかな・・・とは思う。

ついでにスクリーンショットも貼ってみる。

検索ボックスはこんな感じ。


オプション画面


文字を選択した上での呼び出しはこんな感じ。


良かったら、下記からどうぞ。

Chrome Extensions:
goSearchForYou - Google Chrome 拡張機能ギャラリー

Safari Extensions:
goSearchForYou | Prime Design Works | Webサイト制作・開発 | 京都市内・京都府

Safari Extension "previewForBlogger" がアップル公式ギャラリーに載りました

結構ダメだろうなと思っていたし、こんなことを言ってはいけないんだろうけど、審査に通ると思ってなかった。ギャラリーは英語版しかないし、掲載されているのは海外企業が占めているし、しがない SOHO が作った機能拡張など、、、と思っていたけど、載せてくれた。

Apple - Safari - Safari Extensions Gallery

goSearchForYou に新しい機能を搭載してみた

昨日公開した goSearchForYou に新しい機能を加えてみた。

ブラウザ内でテキストを選択した状態で、ショートカットキーで goSearchForYou を呼び出すと、その選択したテキストが入力ボックスに反映される、という機能。これはかつての先輩からご提案いただいた。ありがとうございます。

なお、これは Safari/Chrome Extensions に限っての機能で、Widget 版には実装していません。

良かったら、下記からどうぞ。

Chrome Extensions:
goSearchForYou - Google Chrome 拡張機能ギャラリー

Safari Extensions:
goSearchForYou | Prime Design Works | Webサイト制作・開発 | 京都市内・京都府

Apple Dashboard Widget:
goSearchForYou | Prime Design Works | Webサイト制作・開発 | 京都市内・京都府

Safari/Chrome Extension / Apple Dashboard Widget "goSearchForYou" を公開してみた

なにかを検索するとき、いちいちそのウェブサイトに行き、検索しなければならない。Google 検索などはブラウザに検索ボックスが仕込まれてはいるけど。

で、色々な検索を一つの検索ボックスにまとめる機能拡張を Safari 用と Chrome 用に作ってみた。ショートカットキーや右クリックによるコンテクストメニューで呼び出せ、引っ込ませることができる。

それに、セレクトボックス内は、検索した頻度を計算し、よく使うものから順に並べるようにしているので、人によっては便利に感じる、、、かもしれない。

あと、普通に Return キーもしくは Enter キーもしくはボタンのクリックで検索すると、同じウィンドウに、十字キーの「↑」を一緒に押すと新しいタブで検索できるようにしている。

検索できる web service は以下の通り。

• Google検索
• Google画像検索
• Google地図検索
• Googleニューズ検索
• Googleブログ検索
• YouTube動画検索
• iTunesストア検索
• Wikipedia検索
• amazon商品検索
• 駅探乗り換え検索
• livedoor天気検索
• Ustreamライヴ検索
• Goo郵便番号検索
• Goo国語辞書検索
• Goo英和辞書検索
• Goo和英辞書検索
• Goo車検索
• Gooバイク検索
• はてなブックマーク検索
• はてなダイアリー検索
• 食べログ検索
• ぐるなび検索
• じゃらん宿泊検索
• チケットぴあ検索
• QLife病院検索
• クックパッド レシピ検索
• Twitter検索
• Vectorソフト検索
• W3C Validator
• 価格.com商品検索
• ヨドバシカメラ商品検索
• 楽天市場検索
• 楽天オークション検索
• Yahoo!ショッピング商品検索
• Yahoo!オークション商品検索
• アメーバ ブログ検索

良かったら、下記からどうぞ。

Chrome Extensions:
goSearchForYou - Google Chrome 拡張機能ギャラリー

Safari Extensions:
goSearchForYou | Prime Design Works | Webサイト制作・開発 | 京都市内・京都府

Apple Dashboard Widget:
goSearchForYou | Prime Design Works | Webサイト制作・開発 | 京都市内・京都府

ウェブページに iframe があって複数挿入されてしまう場合の対処 [Chrome Extensions を作ってみる：第九回]

Safari Extensions の場合 と同じように、読み込んだウェブページに iframe があった場合に、iframe 内の html 以下にも挿入されてしまう。

そこで、同じように content_scripts と background_page の url のやり取りで解消する。

★content_scripts

chrome.extension.sendRequest({action: "getURLofTab",}, function(rcv) {
  if (location.href == rcv) // 次の処理
});

★background_page 内の Javascript

function chkURL(req, sender, callback) {
  chrome.windows.getCurrent(function(w) {
    chrome.tabs.getSelected(w.id, function(t) {
      callback(t.url);
    });
  });
}
chrome.extension.onRequest.addListener(chkURL);

これも、manifest.json 内にタブを操作する記述を加えないといけない。

★manifest.json

...
"permissions": ["tabs"],
...

開いている全てのタブに処理を走らせる [Chrome Extensions を作ってみる：第八回]

Safari Extensions の場合 と同様に、読み込んだページに挿入したでユーザーが変更した場合、有効なのは操作しているタブに限られてしまう。そこで、ユーザーが設定を保存するタイミングで、開いている全てのタブに処理を走らせ、設定の同期を行う必要が出てくる。

記述は Safari Extension よりも長くなるけど、同じように全てのウィンドウを取得し、タブを取得し、それぞれに処理を走らせることができる。

以下は、background_page から全てのタブに chgSettings の処理を走らせる場合。

★background_page 内の Javascript

// 全てのウィンドウを取得する
chrome.windows.getAll({populate: true}, function(windows) {
  for (var w in windows) {
// 全てのタブを取得する
    var tabs = windows[w].tabs;
    for (var t in tabs) {
      chrome.tabs.sendRequest(tabs[t].id, {action: "chgSettings", text: "xxx"});
    }
  }
});

ちなみに、manifest.json 内にタブを操作する記述を加えないといけない。

★manifest.json

...
"permissions": ["tabs"],
...

独自のコンテクストメニューを生成する [Chrome Extensions を作ってみる：第七回]

Chrome 6 以降は、独自のコンテクストメニューを生成することができる。Safari Extensions の場合 とは違い、manifest.json と background_page で生成する。

下記は、コンテクストメニューに「test」と表示させ、これがクリックされたら、「recieved」とアラートを出す例。

★manifest.json

...
"permissions": ["contextMenus"],
...

★background_page

function fromContext() {
  alert("received");
}
chrome.contextMenus.create({title: "test", onclick: fromContext});

独自の要素からページ遷移を行う [Chrome Extensions を作ってみる：第六回]

Safari Extensions の場合 と同様に、Chrome Extensions でも form 要素でかつ、action や onsubmit で Javascript からページ遷移をしたい場合、content_scripts だけでは遷移できない。background_page も使ってページ遷移をさせる必要がある。

ただ、Chrome Extensions では、manifest.json にタブの操作を許可する記述を加えないといけない。

★manifest.json

...
"permissions": ["tabs"],
...

下記は Safari Extensions の場合と同様に、独自の form 要素の onsubmit で sendUrl() を指定し、その結果、入力ボックスで指定された URL にページ遷移を行う場合。

★content_scripts

// form 要素を挿入する
var testForm = document.createElement("form");
testForm.onsubmit = "test";
testForm.method = "post";
document.body.insertBefore(testForm, document.body.firstChild);
testForm.addEventListener("submit", sendUrl); // addEventListener で処理先を指定
// 入力ボックスを上記の testForm に生成する
var testInput = document.createElement("input");
testInput.type = "text";
testInput.id = "testInput";
testInput.name = "testInput";
testForm.appendChild(testInput);
// ボタンを上記の testForm に生成する
var testSubmit = document.createElement("input");
testSubmit.type = "submit";
testSubmit.value = "send";
testForm.appendChild(testSubmit);

// submit で送られてきた処理
function sendUrl() {
  chrome.extension.sendRequest({action: "open", text: testInput.value});
}

★background_page 内の Javascript

function GoTo(req, sender, callback) {
// 新規タブで開く場合
  chrome.tabs.create({url: req.text, selected: false});
// 同じタブで開く場合
  chrome.windows.getCurrent(function(w) {
    chrome.tabs.getSelected(w.id, function(t) {
      chrome.tabs.update(t.id, {url: req.text});
    });
  });
}
// content_scripts からの受信
  chrome.extension.onRequest.addListener(GoTo);

ちなみに、url に日本語が含まれる場合、このままでは遷移できないので、上記の sendUrl() 内の testInput.value をエンコードしてやる必要がある。

function sendUrl() {
  chrome.extension.sendRequest({action: "open", text: encodeURI(testInput.value)});
}

content_scripts と background_page でデータをやり取りする [Chrome Extensions を作ってみる：第五回]

Safari Extensions での「スクリプト」と「グローバルページ」でデータをやり取りするように、Chrome Extension でもやり取りが当然できる。しかも Safari Extensions よりも簡単にできる。

★content_scripts

// 変数 msg に "send" を格納
var msg = "send";
// sendRequest で background_page に送信
chrome.extension.sendRequest({action: "chgMsg", text: msg}, function(rcv) {
// function(rcv) がコールバックとして受信時に発動
  getMsg(rcv);
});
// コールバック受信により発動
function getMsg(afterMsg) {
  alert("after:" + afterMsg);
}

★background_page 内の Javascript

// request には action と text が格納されている
function getMessages(request, sender, callback) {
// コールバック用としての callback に返信用として "received" を格納
  if (request.action == "chgMsg") callback("received");
}
// content_scripts での sendRequest を受信
chrome.extension.onRequest.addListener(getMessages);

結果、「after:recieved」という文字列がアラートとして表示される。

読み込んだウェブページに CSS を適用させる [Chrome Extensions を作ってみる：第四回]

Safari Extensions の場合もやったことを、Chrome Extensions でもやってみる。

これは、Apple の背景を青にしてみるという例。

★manifest.json

{
  "content_scripts": [{
    "css": [ "apple.css" ],
    "matches": ["http://www.apple.com/*"],
    "run_at": "document_end"
  }],
  "name": "test",
  "version": "1.0.0.0"
}

★apple.css（content_scripts）

body {background: rgba(0, 102, 255, .7) !important;}

これだけで、実現できる。

読み込んだウェブページの内容を使って処理を行う [Chrome Extensions を作ってみる：第三回]

Safari Extensions の場合もやったことを、Chrome Extensions でもやってみる。

これは、Apple のトップページ右上にある検索ボックスに「Safari Extensions」という文字を放り込むような処理を作ってみるという例。

★manifest.json

{
  "content_scripts": [{
    "js": [ "apple.js" ],
    "matches": ["http://www.apple.com/*"],
    "run_at": "document_end"
  }],
  "name": "test",
  "version": "1.0.0.0"
}

★apple.js（content_scripts）

document.getElementById("sp-searchtext").value = "Chrome Extensions";

これだけで、実現できる。

Extension の定義ファイル [Chrome Extensions を作ってみる：第二回]

Safari Extension の場合「機能拡張ビルダー」で設定できるが、Chrome Extension の場合は「manifest.json」に記述するみたい。

備忘録として、下記に書き方を残しておこうと思う。とりあえず実際に自分が使ったものを記述するけど、今後も追加していく予定。

{
// ウェブページ内で動作するファイルを定義
  "content_scripts": [{
// 読み込む Javascript
    "js": [ "js/injected.js" ],
// 読み込む CSS
    "css": [ "css/injected.css" ],
// 動作する対象のドメイン等。「*」によるワイルドカードも使える
    "matches": ["http://*/*"],
// 動作するタイミング（オプションは、document_idle(デフォルト値)、document_end、document_idle
    "run_at": "document_end"
  }],
// ギャラリーに公開される説明文
  "description": "この機能拡張の説明",
// 表示されるアイコン。種類別に定義できる
  "icons": {
    "128": "icon128.png",
    "16": "icon16.png",
    "32": "icon32.png",
    "48": "icon48.png"
  },
// 機能拡張の名前
  "name": "ExtensionName",
// バックグラウンドで動かす html
  "background_page": "background.html",
// パーミッション
// tabs: 他のタブを操作したりするのに必要
// contextMenus: コンテクストメニューに項目を作ったりするのに必要（Chrome 6 以上）
  "permissions": ["tabs", "contextMenus"],
// version 表記
  "version": "1.0.0.0"
}

Safari/Chrome Extension "previewForBlogger" を公開してみた

前に、Blogger の新しい投稿画面がイマイチ というエントリーで書いたけど、Blogger が新しい UI にしてからというもの、プレビューをするのが面倒だった。いちいち新しいウィンドウが開いてしまうので、初めはなにがなんだか判らなくなってしまう。Google Product Ideas に投稿はしたけど、改造されるような感じもないので、機能拡張として作ってみた。

これは入力しているテキストエリアの下にプレビューが表示されるようにしているので、いちいちウィンドウを開かなくてもいい。あと、「ラベル」の入力エリアがなんか新 UI では非常に狭くなったので、広げてみた。

良かったら、下記からどうぞ。

Chrome:
previewForBlogger - Google Chrome 拡張機能ギャラリー
Safari:
previewForBlogger | Prime Design Works | Webサイト制作・開発 | 京都市内・京都府

Safari Extension "noticeAboutMe" の公開場所を Google サイトにした

どうも私が契約しているレンタルサーバーでは、.htaccess によるファイルタイプの追加ができない。エラーになってしまう。そもそも、「配布」を許していないらしく、ポリシー的にも現実的にも無理。

そこで、Google がサーバースペースとか供給してないかと思って見てみると、「Google サイト」というのがやっぱりあった。で、自前でウェブサイトを持っている身としては別に「Google サイト」上で構築する必要はないので、早速ファイルをアップロードできないかを色々クリックしてみると、やっぱりあった。

試しに Safari Extensions のファイルである .safariextz を置いてみる。ダウンロードしてみる。でけた。一応、利用規約とかも読んでみたけど、ポルノやら悪意あるファイルでなければ置けるっぽい、というかこういう置いてはダメという記述が見当たらない（ポルノやら悪意あるファイルは置いちゃダメってのは、もちろん書いてある）ので、とりあえずここに置いておこう。

ということで、Twitter の mentioning（@ ユーザー ID で発言された tweet）や Direct Message、Retweet があった場合にお知らせする noticeAboutMe の Safari 版も、ちゃんとダウンロードできるようになりました。

noticeAboutMe | Prime Design Works | Webサイト制作・開発 | 京都市内・京都府

ウェブページに iframe があって複数挿入されてしまう場合の対処 [Safari Extensions を作ってみる：第十三回]

読み込んだページに独自の要素を表示させる のエントリーで書いたような形では、読み込んだウェブページに iframe があった場合に、iframe 内の html 以下にも挿入されてしまい、実に困ってしまう。そんな筈じゃないのに、って思うが仕方ない。これはかなり悩んだ。むしろ、悶絶した。

ということで、「グローバルページ」で指定した html（もしくは、その html 内で指定している Javascript）で、そのタブの url を取得し、「スクリプトを終了」で指定した Javascript に送り、その Javascript で自身の url を取得し、比較して処理するかどうかを判断すれば、iframe 内の html 以下に挿入されることはなくなる。

★「スクリプトを終了」で指定した Javascript

function cmpURL(evt) {
  if (location.href == evt.message) 次の処理;
}
// 「グローバルページ」で指定した html へ送信
safari.self.tab.dispatchMessage("getURLofTab", "");
// 「グローバルページ」で指定した html からの答えを受信
safari.self.addEventListener("message", cmpURL, false);

★「グローバルページ」で指定した html 内の Javascript

function getInfo(evt) {
  var URLofTab = safari.application.activeBrowserWindow.activeTab.url;
  safari.application.activeBrowserWindow.activeTab.page.dispatchMessage("answer", URLofTab);
}
safari.application.addEventListener("message", getInfo, false);

設定内容の保存先には localStorage がいいと思う [Safari Extensions を作ってみる：第十二回]

「機能拡張ビルダー」の一番下にある「機能拡張の設定」では「非表示（input の type="hidden"）」として、ユーザーに変更させたくない項目を保存したりできるけど、例えばバグ改修などでアップデートした場合、ユーザーがインストールするとこの「機能拡張の設定」の情報に上書きされてしまう。

そこで、localStorage の出番が来る。「機能拡張ビルダー」の「スクリプトを終了」で指定した Javascript 内で localStorage を使ってしまうと、その表示しているウェブページの storage になってしまうので、「グローバルページ」で指定した html（もしくは、その html 内で指定している Javascript）内で localStorage を使う。すると、Extension の storage としてコンピュータに保存される。

ということで、「機能拡張ビルダー」内の設定情報は、localStorage がなかった場合にのみ（初めてのインストール、もしくは未使用状態、など）取得すれば良く、その他は localStorage の情報で処理すれば良いと思う。

例えば、「sample」という情報を「key」をいう storage に保存する場合は、こんな感じ。

★保存する場合（「グローバルページ」で指定した html 内の Javascript）

localStorage.setItem("key", "sample");

逆に、localStorage に情報がないときには「機能拡張ビルダー」の「機能拡張の設定」から、情報があるときは localStorage から、thisKey という変数に突っ込む場合はこんな感じ。

★取得する場合（「グローバルページ」で指定した html 内の Javascript）

if (localStorage.setItem.key) {
  var thisKey = localStorage.getItem("key");
} else {
  var thisKey = safari.extension.settings.getItem("key");
}

開いている全てのタブに処理を走らせる [Safari Extensions を作ってみる：第十一回]

「機能拡張ビルダー」の一番下に「機能拡張の設定」という項目があるけど、レイアウトを自由にはできないので、場合により美しくないレイアウトになってしまう。そこで、読み込んだページに独自の要素で設定画面を設けることもあるけど、その設定画面でユーザーが変更した場合、有効なのは操作しているタブに限られてしまう。そこで、ユーザーが設定を保存するタイミングで、開いている全てのタブに処理を走らせ、設定の同期を行う必要が出てくる。

Safari Extensions では、「グローバルページ」で記述した Javascript であれば、開いているウィンドウやタブの枚数を取得し、それぞれをターゲットにして処理を走らせることができる。

以下は、グローバルページから全てのタブに chgSettings の処理を走らせる場合。

★「グローバルページ」で指定した html 内の Javascript

<!doctype html>
<html lang="en">
<head>
<script type="text/javascript">
// 記述が長くなるので、with() でまとめる
  with (safari.application) {
// browserWindows では開いているウィンドウの枚数が判別できる
    for (var w = 0; w < browserWindows.length; w++) {
// tabs では開いているタブの枚数を判別できる
      for (var t = 0; t < browserWindows[w].tabs.length; t++) {
        tabs[t].page.dispatchMessage("chgSettings", settingValues);
      }
    }
  }
</script>
</head>
<body></body>
</html>

独自のコンテクストメニューを生成する [Safari Extensions を作ってみる：第十回]

Safari Extensions では、右クリック時に表示されるコンテクストメニューに独自のメニューを追加できる。

新規のコンテクストメニュー名が「ページタイトルを表示」とし、クリックされた場合に、そのページのタイトルをアラート表示する、という場合はこんな感じ。メニューの生成は「機能拡張ビルダー」で、メニューがクリックされた場合の処理は「グローバルページ」に記述する。

★機能拡張ビルダーでの指定

1. 「機能拡張ビルダー」の「機能拡張クローム」内「コンテクストメニュー項目」右のボタンをクリックする
2. 「タイトル」にメニューに「ページタイトルを表示」と入力する
3. 「識別子」と「コマンド」に「showTitle」と入力する（「コマンド」を省略した場合、「識別子」と同じとして扱われるので、「識別子」と同じ名称でも問題はない）

★「グローバルページ」で指定した html 内の Javascript

<!doctype html>
<html lang="en">
<head>
<script type="text/javascript">
  function fromContext(evt) {
    if (evt.command === "showTitle") {
// タイトルをアラート表示
      alert(safari.application.activeBrowserWindow.activeTab.title);
    }
  }
// コンテクストメニューがクリックされた場合
  safari.application.addEventListener("command", fromContext, false);
</script>
</head>
<body></body>
</html>

独自の要素からページ遷移を行う [Safari Extensions を作ってみる：第九回]

読み込んだページに独自の要素を表示させ、これが form 要素でかつ、action や onsubmit で Javascript からページ遷移をしたい場合、この独自の要素を挿入している「スクリプトを終了」で指定した Javascript だけでは遷移できない。これは「グローバルページ」を使うことにより、同じタブでのページ遷移や新規タブでのページ遷移を行うことができる。

独自の form 要素の onsubmit で sendUrl() を指定し、その結果、入力ボックスで指定された URL にページ遷移を行う場合はこんな感じ。もちろん、チェック等の処理は必要不可欠ではあるけど、今回は省略したいと思う。

★「スクリプトを終了」で指定した Javascript

// form 要素を挿入する
var testForm = document.createElement("form");
testForm.onsubmit = "test";
testForm.method = "post";
document.body.insertBefore(testForm, document.body.firstChild);
testForm.addEventListener("submit", sendUrl); // addEventListener で処理先を指定
// 入力ボックスを上記の testForm に生成する
var testInput = document.createElement("input");
testInput.type = "text";
testInput.id = "testInput";
testInput.name = "testInput";
testForm.appendChild(testInput);
// ボタンを上記の testForm に生成する
var testSubmit = document.createElement("input");
testSubmit.type = "submit";
testSubmit.value = "send";
testForm.appendChild(testSubmit);

// submit で送られてきた処理
function sendUrl() {
  safari.self.tab.dispatchMessage("open", testInput.value);
}

★「グローバルページ」で指定した html 内の Javascript

<!doctype html>
<html lang="en">
<head>
<script type="text/javascript">
  function GoTo(evt) {
// 新規タブで開く場合
    safari.application.activeBrowserWindow.openTab().url = evt.message;
// 同じタブで開く場合
    safari.application.activeBrowserWindow.activeTab.url = evt.message;
  }
// content_scripts からの受信
  safari.application.addEventListener("message", GoTo, false);
</script>
</head>
<body></body>
</html>

ちなみに、url に日本語が含まれる場合、このままでは遷移できないので、上記の sendUrl() 内の testInput.value をエンコードしてやる必要がある。

function sendUrl() {
    safari.self.tab.dispatchMessage("open", encodeURI(testInput.value));
}

読み込んだページに独自の要素を表示させる [Safari Extensions を作ってみる：第八回]

Safari Extensions を作っていくにあたり、読み込んだページに独自の要素を表示させたい場合は、「機能拡張ビルダー」の「スクリプトを終了」の項目に Javascript を指定し、その中で操作することができる。

とりあえず、「<p>test</p>」を表示してみるときはこんな感じで。

★test.js

var test = document.createElement("p");
test.textContent = "test";
document.body.insertBefore(test, document.body.firstChild);

あとはこれに css で position: absolute; などで整形していけば、既存のページの見た目を害せずに表示することができる。

マイク・ポートノイの DREAM THEATER 脱退の件について

Mike Portnoy leaves Dream Theater (Press Release) - Mike Portnoy's MySpace Blog

DREAM THEATER をこよなく愛する身としては、このことに対してなにも触れずにおくことはできない。先日、MySpace 上にて本件を知ったんだけど、あんまり MySpace の他人のブログを読まない身としては、発表日から遅れて知った有様だった。その時点より前に、Versaiiles のドラマー YUKI のブログ（改行が多いのは日本語文として非常に違和感があるから、なんとかしてほしい）で「マイクさんの件」とされている一文を見て、なにか判らなかったけど、なにが起こったかを知るとさすがに「マイクさんの件」の意味を理解できた。

マイクは DREAM THEATER のリーダーであり、そもそも DREAM THEATER というバンド名はそもそもマイクの父親が付けたもので、彼も今回のメッセージでは冒頭に「今まで考えたこともなかったようなことを言わなければならない」としている。

彼を含めたメンバーでヴォーカル以外は全て音楽学校を卒業しており、複雑な音楽構成ではあるけど緻密な計算によって流れるような展開を実現している。この点に私は昔からとても魅力を感じており、尊敬をしていた。ただ、ここ 2 作で言えば、マイクの好みによりラップを少しだけ入れていることからも、他のメンバーとの方向性の差異が表面化しているように感じていた。脱退については非常に驚き、落胆したけど、そう考えると仕方なかったのかもしれない。

それよりも、DREAM THEATER の骨格を成すマイクの後を埋められるドラマーを探せるのかどうかが少し不安だ。Burrn の広瀬和生は、新しいドラマーに「雇われか？」という、かつてのジェイムズ・ラブリエ（Vo.）に向けた幼い質問をするのだろうか。

Safari/Chrome Extension "noticeAboutMe" を公開してみた

Safari/Chrome Extensions を初めて作ってみた。Twitter で誰かが自分に対するツイート（@ユーザー ID でツイートしてるもの）があったりしても、いちいち見に行かないといけない。リツイートだって、見に行かないとされてるのかどうか判らない。ということで、そいつをチェックしに行く機能拡張を作ってみた。なかなかいい勉強になった。

Safari Extensions でも同じものを作ったけど、こちらは現在 Apple にて評価中。載るかどうか判らない。

良ければ使ってやってください。

Chrome:
noticeAboutMe - Google Chrome 拡張機能ギャラリー
Safari:
noticeAboutMe | Prime Design Works | Webサイト制作・開発 | 京都市内・京都府

Safari Extensions の feedback ページのお問い合わせフォームがいい感じ

お問い合わせフォームのエラー画面というのは、デザイナーではなくエンジニアの UI の活きるページだと思っている。もちろんデザイナーは素晴らしいデザインを創るけど、かつて在籍していた会社では、お問い合わせフォームなどのシステマティックなページの UI はエンジニア製だった。どのようにして判りやすくユーザー「アンタ、間違ってるよ」ってことを伝えるか、エンジニアの想像力をかき立てる場面だと思う。

この前、私がよくブログを読んでいるある人が退職し、別の会社に就職した。そこのウェブサイトにもお問い合わせフォームがあったので、「あの人が選んだ会社だ。どのようなエラー処理をしているのか」という純粋な興味で、何気なく、全ての項目を空のままで送信ボタンを押した。送信できてしまった。結構がっかりしたもんだ。

さて、Apple の Apple - Safari - Feedback というお問い合わせページがあるけど、ここはアクセスしたままの状態だと項目右の「REQUIRED」という部分がグレーのまま。しかし、例えば、名前を入力しようとしたけど「次の Email Address から入力しちゃお」とか思って項目を移動すると、Name 項目右の「REQUIRED」が怒り出して赤くなる。こういうのだと「ああ、ここ入力必須なのね」って、送信ボタンを押す前にユーザーに教えることができる。こういうページはとてもいいと思う。一つ注文をつけるなら、ページにアクセスした時に Name 項目にフォーカスを自動で合わせてほしいくらいかな。

お問い合わせフォームページって、エンジニアの腕の見せ所の一つだと思う。

自分とこのウェブサイトを英語化してみた

今後、アプリケーションを公開していくのにも、自分のウェブサイトを英語化したおいた方が便利かもしれないと思って、数日かけて英語化してみた。去年の立ち上げ時に、色々と説明しておかないとと思って文章をたくさん書いたので、難儀した。

基本的には OS の言語で日本語以外は英語版となるようにしてあるけど、ページ内の English を押すことで英語ページの表示も可能にしてある。構造としては、両言語用の文章を別に持ち、php で OS の言語を判断、またはクリックされて cookie に保存された言語切り替えリンクの内容を php で読み込み、言語を特定。html 内は ssi で php を読み込み、言語に応じた文章を返すようにしてある。

言語ごとにページを分けたりしても良かったけど、ディレクトリ構造を変えるのはめんどくさかった。あと、ページそのものを php 化してしまえば ssi は要らなかったけど、xhtml が好きな人だし、そもそも php 化するのもめんどくさかったから、これもしなかった。

今となってはこの仕組みで良かったかなとも思う。この英語化されたページが実際に役に立つ日が来るのだろうか。

Prime Design Works

Blogger の新しい投稿画面がイマイチ

なんだか「Blogger の投稿画面が新しくなったぜ」みたいな告知があったので使ってみたけど、う〜ん。

「プレビュー」ボタンを押すと新しいタブが開いてしまうため、そのタブ内にある編集ボタン（鉛筆ボタン）を押して編集を進めると、「プレビュー」ボタンを押す前のタブが残ってしまう。そして、投稿したあとにこの要らなくなった前のタブを閉じようとすると、「ホンマに消していいんでっか？」と訊かれる。正直、鬱陶しい。

あと、「Tweetmeme Retweet Badge」っちゅーのを貼ってるんだけど、プレビューページでは何故か 1 とカウントされる。なんでやろね？

とりあえず Google Product Ideas ってとこに投稿しといた。

Javascript ファイルから設定画面の情報を読み込む [Safari Extensions を作ってみる：第七回]

Safari Extensions ではメニューの「Safari -> 環境設定...」画面の「機能拡張」タブをクリックすることで現れる画面に、「機能拡張ビルダー」内の「機能拡張の設定」で指定した各種設定を表示させることができる。これの設定をどうやったら読み込めるのかを、これまたひとしきり悩んだ。公式のドキュメントである Safari Extensions Development Guide: Settings and Local Storage を見てもやり方が判らない。色々と検索した挙げ句、Safari Extension Questions - Stack Overflow でなんとか解決した。以下にやり方を書いてみたいと思う。

まず、設定を読み込むには、safari.extension.settings.getItem("xxx") で取り込めばいいんだけど、これは「機能拡張ビルダー」内の「取り込んだ機能拡張の内容」の「スクリプトを開始 or 終了」のところに入れた Javascript ファイルに記述しても機能しない。その少し上の「機能拡張グローバルページ」で指定した html ファイル内で記述しないと能力を発揮しない。先程の「スクリプトを開始 or 終了」とグローバルページとの応答でようやく取得することができる。

ついでに設定画面で変更された時にも値を Javascript に渡すようにする。ユーザーが変更した際は change event が発行される。

★「グローバルページ」で指定した html 内の Javascript

<!doctype html>
<html lang="en">
<head>
  <script type="text/javascript">
// 問い合わせ or 設定変更時に呼び出される
    function respondSetting(evt) {
// 設定の「キー」項目である「xxx」という値を変数 zzz に代入
      var zzz = safari.extension.settings.getItem("xxx");
// Javascript への返答
      safari.application.activeBrowserWindow.activeTab.page.dispatchMessage("answer", zzz);
    }

// Javascript からの問い合わせを受信
    safari.application.addEventListener("message", respondSetting, false);
// 設定が変えられた時に発行
    safari.extension.settings.addEventListener("change", respondSetting, false);
  </script>
</head>
<body></body>
</html>

★「スクリプトを終了」で指定した Javascript

// グローバルページからの返答時に呼び出される
function getMessage(evt) {
// 返答された設定画面の値を変数 sValue に代入
  var sValue = evt.message;
}
// グローバルページに設定画面の値を問い合わせを送信
safari.self.tab.dispatchMessage("settingValue", "xxx");
// グローバルページからの返答を受信
safari.self.addEventListener("message", getMessage, false);

Chrome / Firefox でキャッシュを飛び越して再読み込みする

さっき Firefox で確認することがあって、どうもキャッシュを読んでいるらしく、変更したのに変更後の表示にならない。いちいちメニューの「ツール -> 最近の履歴を消去...」を選んで消してからもう一度読み込むというかなりめんどくさい動作をしていたので、キャッシュを飛び越して再読み込みできたらいいのにと思った。昔 Windows を使っていた時代に、IE では Ctrl + F5 でできた気がしたので、似てることもできるだろうと考えて、普段再読み込みするのに Command + R を使っているけど、それに Shift キーを混ぜたらどうなるかと思ってやってみると、早々と答えが出た。これでキャッシュを飛び越して再読み込みできた。

★Chrome / Firefox でキャッシュを飛び越して再読み込みする方法

Command + Shift + R

Opera ではダメだった。Safari でもダメだった。でもあんまりこの 2 つではキャッシュで困ったことはないからいいかなと思う。

Extension のアイコンを設定する [Safari Extensions を作ってみる：第六回]

Apple - Safari - Safari Extensions Gallery でいくつかの Extensions をインストールすると、Safari の環境設定画面の「機能拡張」タブをクリックすると表示される画面で、アイコン付きで表示されている。このアイコンはどうやって設定するのだろうとひとしきり悩んだ。

「機能拡張ビルダー」をよく見てもそれらしき項目はないし、検索してもなんだか見当違いばかり出てきて役に立たない。仕方ないので、「ユーザー -> ライブラリ -> Caches -> com.apple.Safari -> Extensions」内に展開されているそれぞれの Extensions の中身を見てみた。すると、この環境設定画面で表示されているアイコンが格納されていた。名前は「icon.png」。こいつをどこで設定しているのかと、.plist ファイルを見てみたりしたけど、やっぱりない。

仕方ないので、現在テスト中の Extension のフォルダに、同じ icon.png で保存してみた。すると、表示された。なんやそれ。ま、一度判ってしまえば簡単な構造ではあるけど。

自動的にアップデートをさせるようにする [Safari Extensions を作ってみる：第五回]

Safari Extension が 1 つできたとして、それのアップデートを自動的にさせたい場合はどうしたらいいのだろう。メニューの「Safari -> 環境設定...」を選択し、「機能拡張」タブをクリックすると、環境設定画面左下に「アップデート」と表示されている。おそらくここになんらかのアクションを与えられる筈だ。「機能拡張ビルダー」には「マニフェストをアップデート」という項目があるので、ここが関係していると思って、Safari Extensions Development Guide: Updating Extensions を見に行く。すると、このページののっけから答えが書いてあった。このページには 2 種類の xml コードが紹介されている。今回のエントリーで使用するのは上のコード（以下、このエントリー内では「plist コード」と称する）。

とりあえず、マニフェストファイルを用意する。名前は「manifest.plist」とする。

1. 上述の plist コードを貼り付ける
2. 「機能拡張ビルダー」の「バンドル識別子」の文字列をコピーし、plist コードの「com.yourCompany.safari.yourExtensionName」と置き換える
3. 「機能拡張ビルダー」の上部にある「Safari Developer」の括弧内の文字列を plist コードの「YourCertificateID」と置き換える
4. 「機能拡張ビルダー」の「機能拡張のバージョン」の「バンドルのバージョン」内の文字列をコピーし、plist コードの「Your current bundle version」と置き換える
5. 「機能拡張ビルダー」の「機能拡張のバージョン」の「バージョンを表示」内の文字列をコピーし、plist コードの「Your current display version」と置き換える
6. パッケージとしてビルドした Extension ファイル（拡張子：.safariextz）をアップする予定の URL を、plist コードの「Your-.safariextz-URL」と置き換える

「3」の YourCertificateID（Safari Developer ID）は入力するのが面倒な場合は、以下の方法でコピーできる。

1. 「アプリケーション -> ユーティリティ -> キーチェーンアクセス」を起動する
2. 一覧から「Safari Developer〜」の行で右クリックして「情報を見る」を選択する
3. 表示された画面の「詳細な情報 -> サブジェクト名 -> 通称」にある括弧内の文字列を選択してコピー

なお、環境設定画面で自動アップデートとして反応するのは「バンドルのバージョン」だけで、「バージョンを表示」は関係ない。例えば配布している Extension をパッケージ化したときの「バンドルのバージョン」が「1」だとして、manifest.plist の「CFBundleVersion」が「1.1」だとアップデートを促してくれるが、パッケージ化したときの「バージョンを表示」が「1」で、manifest.plist の「CFBundleShortVersionString」が「1.1」でもアップデートは促してくれない。

あと、<dict> で一括りにして、複数の Extensions のマニフェストを 1 つのファイル（ここで言う manifest.plist）に纏められるので、このマニフェストファイルをアップロードする場所は、ある程度意味が共通する名称の方がいいと思う。

さて、このマニフェストファイルを作成し、アップロードした後の手順はこうなる。

1. manifest.plist をサーバーにアップする
2. 「機能拡張ビルダー」の「機能拡張の詳細」の「マニフェストをアップデート」に、「1」でアップした URL を入力する
3. 「機能拡張ビルダー」の「パッケージをビルド...」をクリックして、保存する
4. 保存した Extension を前述の「6」で指定した URL にアップロードする

Ben Johnson というミュージシャン

この前 YouTube を徘徊してるときに、初めて Ben Johnson というミュージシャンを認識した。以前にも一度聞いたことがあった気がするけど、「走る人と同じ名前ね」と思って大して気にしていなかった。

ところが、私が YouTube 内に Bach の BWV1043 をギターで弾いてる人がいないかなと思って見ている内に、彼の動画を目にした。圧巻とも言えるプレイだが、特筆すべきは、この BWV1043 は「2 つのヴァイオリンのための」という題が付けられているが、その 1 本をギターで、もう 1 本をキーボードで弾いているのである。同じ Ben Johnson 自身が。どちらも素晴らしいプレイだった。彼のウェブサイトによると、初めはピアノを習っていて、そのあとギターを弾けるようになったという。ギターの音のセンスや左手の動かし方（オーディエンスに対する魅せ方）も私の好みに合い、ギターを後付けで学習したようには到底思えない。もちろん、この BWV1043 をチョイスした時点で Bravo なんだけど。

百聞は一見に如かず。
Ben Johnson - "Double" Concerto in Dm by J.S. Bach, BWV 1043, 1. Vivace
BenJohnson. NET - Home

iPod touch の電池消耗を抑える

どうも家では iPod touch の電池の消耗が激しい。ずっと外にいると特にそんな気はしないのに、家では凄く減りが速いと感じている。前までは電源ボタンをポチっと押すだけの「スリープ」みたいな状態にするだけで、使っていない時は放置してたけど、きちんと毎回電源を切ってバイバイして放置するようにしたけど、なんかダメ。やっぱり消耗が激しい。

そこで、その「スリープ」にする前に、WiFi を OFF にしてみた。そしたら、結構消耗が抑えられている気がする。ずっと ON にしたままだと、「スリープ」にしてから 2 日後に再度見てみると、もう電池表示が真っ赤っかになっていたけど、WiFi を OFF にしたら、「スリープ」にしたときの電池残量のまま復帰できている気がする。ちょっとは減っているかもしれないけど、気づかないくらい。

ということで、ちょっとめんどくさいけど、最近 WiFi の ON/OFF はこまめに切り替えている。

Google 乗り換え案内（車で行く）の印刷ページが素晴らし過ぎる

ちょっと用事で車での行き方を調べることになり、Google の乗り換え案内に「車で行く」というモードがあったなと思って、やってみると、印刷ページが素晴らしい。

Google 乗り換え案内の素晴らしいインターフェイス

上のリンクをクリックして画像を見てもらうとすぐに判るけど、印刷前の検索結果の状態で細かく分けてくれているルートが、印刷画面ではそれぞれをカスタマイズできる。「ここは知ってる」というところはそのブロックにカーソルを合わせて「テキストのみ」をクリックすると、文字情報だけになって印刷部分を削ることができ、結果的には印刷枚数を減らせる。逆に知らない場所はそのブロックを「地図」にしておき、さらに「+」「-」ボタンやドラッグによる移動で自分にとって判りやすい縮尺や場所にすることができる。

印刷画面なのに、う〜ん、と唸ってしまうインターフェイスだ。

インストールした Chrome Extensions の格納場所 [Chrome Extensions を作ってみる：第一回]

Safari Extensions とは違い、Chrome Extensions を開発する際は証明書がいらないようなので、自分用に開発するだけならなんの申請もいらずにちょっと楽。

さて、他人が作った Chrome Extensions の内容を見たい場合は、どのフォルダに格納されているのだろうか。ちょっと Finder の中を漁ってみると、ここにあった。

ユーザ -> ライブラリ -> Application Support -> Google -> Chrome -> Default -> Extensions

ここにダウンロードした Chrome Extensions が格納されているので、.json ファイルの書き方を見るなどの勉強になる。

Chrome Extensions を作ってみる

Safari Extensions をやってみたので、Google Chrome Extensions も作ってみようと思う。

1. インストールした Chrome Extensions の格納場所
2. Extension の定義ファイル
3. 読み込んだウェブページの内容を使って処理を行う
4. 読み込んだウェブページに CSS を適用させる
5. content_scripts と background_page でデータをやり取りする
6. 独自の要素からページ遷移を行う
7. 独自のコンテクストメニューを生成する
8. 開いている全てのタブに処理を走らせる
9. ウェブページに iframe があって複数挿入されてしまう場合の対処
10. 拡張内に入れた画像などのファイルを読み込む
11. 現在開いているタブのスクリーンショットを撮る

Safari Extensions と同じものは、こちらを参考に。

• 読み込んだページに独自の要素を表示させる [Safari Extensions を作ってみる：第八回]
• 設定内容の保存先には localStorage がいいと思う [Safari Extensions を作ってみる：第十二回]

読み込んだウェブページに CSS を適用させる [Safari Extensions を作ってみる：第四回]

さて、Safari で読み込んだページに CSS を適用させてみる。今回は Apple の背景を青にしてみる。

とりあえず、CSS を用意する。名前は「apple.css」とする。

body {background: rgba(0, 102, 255, .7) !important;}

既に背景はスタイルで宣言されているので、!important を付けておく。

1. Safari Extensions の新規開発画面を表示する


2. Safari Extensions の新規開発画面を表示する際に保存したフォルダに、上記で作った css ファイルを保存する


3. 「機能拡張の情報」「機能拡張の詳細」「機能拡張のバージョン」の各項目に適宜な内容を入力する


4. 「機能拡張 Web サイトアクセス」の「アクセスレベル」を「すべて」にする


5. 「取り込んだ機能拡張の内容」の「スタイルシート」の「新規スタイルシート」をクリックする


6. 入力箇所が表示されるので、セレクトボックスをクリックすると 2. で保存した apple.css が表示されるので、それを選択する


7. 少し下の「ホワイトリスト」の「新規 URL パターン」をクリックする


8. 入力ボックスが表示されるので、「http://www.apple.com/*」と入力する。アスタリスクでワイルドカードを使えるので、スラッシュの後には「*」を入力する


9. 機能拡張ビルダー右上の「インストール」をクリックし、Apple にアクセスすると、背景が青くなる。

ちなみに、このホワイトリストでドメインを指定しないと、あらゆるウェブページで css が発動してしまう。ホワイトリストの説明は Safari Extensions Development Guide: Using Extension Builder に載っている。

読み込んだウェブページの内容を使って処理を行う [Safari Extensions を作ってみる：第三回]

機能拡張では、メニューバーになにかを表示したりするだけでなく、Safari で読み込んだページの内容を使って処理を行うこともできる。今回は Apple のトップページ右上にある検索ボックスに「Safari Extensions」という文字を放り込むような処理を作ってみる。

とりあえず、Javascript を用意する。名前は「apple.js」とする。この検索ボックスは、ソースを見ると id="sp-searchtext" となっている。

document.getElementById("sp-searchtext").value = "Safari Extensions";

1. Safari Extensions の新規開発画面を表示する
2. Safari Extensions の新規開発画面を表示する際に保存したフォルダに、上記で作った js ファイルを保存する
3. 「機能拡張の情報」「機能拡張の詳細」「機能拡張のバージョン」の各項目に適宜な内容を入力する
4. 「機能拡張 Web サイトアクセス」の「アクセスレベル」を「すべて」にする
5. 「取り込んだ機能拡張の内容」の「スクリプトを終了」の「新規スクリプト」をクリックする。「スクリプトを開始」のものでは動作しないので、必ず「スクリプトを終了」のものにする
6. 入力箇所が表示されるので、セレクトボックスをクリックすると 2. で保存した apple.js が表示されるので、それを選択する
7. 少し下の「ホワイトリスト」の「新規 URL パターン」をクリックする
8. 入力ボックスが表示されるので、「http://www.apple.com/*」と入力する。アスタリスクでワイルドカードを使えるので、スラッシュの後には「*」を入力する
9. 機能拡張ビルダー右上の「インストール」をクリックし、Apple にアクセスすると、検索ボックスに「Safari Extensions」と表示されるようになる

ちなみに、このホワイトリストでドメインを指定しないと、あらゆるウェブページで js が発動してしまう。ホワイトリストの説明は Safari Extensions Development Guide: Using Extension Builder に載っている。

とりあえず Hello World [Safari Extensions を作ってみる：第二回]

まずは新しくプログラムを行う基本である、Hello World の文字を Safari のメニューバーに表示するようにしてみる。

とりあえず、Hello World と表示する html ファイルを用意する。html5 で記述し、名前は「index.html」とする。

<!DOCTYPE html>
<head>
  <meta charset="UTF-8" />
  <title>タイトル</title>
</head>
<body>
Hello World
</body>
</html>

1. Safari Extensions の新規開発画面を表示する
2. Safari Extensions の新規開発画面を表示する際に保存したフォルダに、上記で作った html ファイルを保存する
3. 「機能拡張の情報」「機能拡張の詳細」「機能拡張のバージョン」の各項目に適宜な内容を入力する
4. 「機能拡張クローム」の「バー」の「新規バー」をクリックする
5. 入力箇所が表示されるので、「ラベル」には適宜な文字を入力し、「ファイル」をクリックすると 2. で保存した index.html が表示されるので、それを選択する
6. 機能拡張ビルダー右上の「インストール」をクリックすると、メニューバーに「Hello World」と表示される

とっても簡単。

Safari Extensions を作ってみる

Safari 5 から Extensions（拡張機能）を使えるようになったので、作ってみようと思う。

1. Safari Extension（機能拡張）を作る前に証明書をゲットし、Safari Developer となる
2. とりあえず Hello World
3. 読み込んだウェブページの内容を使って処理を行う
4. 読み込んだウェブページに CSS を適用させる
5. 自動的にアップデートをさせるようにする
6. Extension のアイコンを設定する
7. Javascript ファイルから設定画面の情報を読み込む
8. 読み込んだページに独自の要素を表示させる
9. 独自の要素からページ遷移を行う
10. 独自のコンテクストメニューを生成する
11. 開いている全てのタブに処理を走らせる
12. 設定内容の保存先には localStorage がいいと思う
13. ウェブページに iframe があって複数読み込まれてしまう場合の対処

iTunes 10 の違和感

昨日、ようやく iTunes 10 をインストールしたけど、どうも違和感がある。。。画面でメインとリストの部分は、なんだか OS 9 以前のデザインぽいなぁという感じはするけど、違和感の正体はこれじゃない。

左上の赤・黄・緑のボタン類が縦並びになっていることだ。何故こんな仕様に？いつ見ても違和感がある。

アップル - iTunes - あなたを楽しませるすべてのエンターテインメントが、ここに。

Mac で全角入力モードで半角スペースを打つ

私は以前勤めていた会社で、「半角英数字を打つ場合は前後に半角スペースを入れて見やすくする」ということを学習したので、今もそれはむしろ癖となって体に染み付いている。しかし正直なところ、例えば「これは 1 です」と打つ場合、モードは「全角→半角→全角」と切り替えるのはめんどくさい。テンキーの数字は半角モードにしているため、「1」はわざわざ半角モードにしなくても打てる。問題は全角モード時に半角スペースを打つことができれば、随分と楽になる。

で、先程キーの押し間違いからそれが解決した。全角モードで半角スペースを打つ方法はこれだった。

Shift キー + スペースバー

これで全角モードであっても半角スペースを打つことができた。JIS キーボードでも US キーボードでも確認済み。ただ、うちには Mac しかないから、Windows ではどうなのかと言われると、判らない。

iTunes で同じアルバムなのに 1 つにまとめられない問題の解決法

以前から気にはなっていたけど、何故だかよく判らなかったので放置していたこの問題。友人も同じことを言っていたので、結構同じ問題を抱えている人はいるんだろうなぁと思っていたけど、放置していた。で、ふと思って検索してみると、アップルのサポートに載っていた。

同じアルバムアートの曲がひとつにまとめれない理由

正式のサポートページなのに、タイトルで「ら」抜きとは如何なものかと思ったが、（今見たらタイトル直ってました）とりあえず記事を読んでみた。このページに書いてある原因は以下の 3 種類。

1. アルバム名が少し異なる
2. アルバムに収録されている曲のアーティストが異なる
3. アルバムに収録されている曲の「アルバムアーティスト」が異なる

1. と 2. は記事に書いてあるようなことはない。今では CD を挿し込むと情報を書き込んでくれるけど、昔の iTunes ではそんな便利なことをしてくれなかった。しかし CD から取り込んだ後に 1 曲だけ情報を入力して、あとは曲名だけ完全に入力し、残りの部分はサジェストで表示されるものを使っているから、間違う訳がない。3. に至っては、「アルバムアーティスト」という項目を使っていないので、全部空欄。

ということで、記事の最後に書いてある方法をやってみる。「コンピレーション」にチェックを付けるというもの。ただ、これをすると iTunes の「カラムブラウザ」欄の「アーティスト」に「コンビレーション」という謎の「アーティスト」ができてしまい、美しくない。しかし今回は「同じアルバムなのに 1 つにまとめられないという問題を解決する」という目的なので、コンビレーションを「はい」にしてみた。手順は以下の通り。

1. 本来同じアルバムとして登録される筈の曲を全部選択する
2. Command キーと i キーの同時押し、もしくは右クリックの「情報を見る」、もしくはメニューバーの「ファイル」から「情報を見る」を選択する
3. 「複数項目の情報」という画面が表示されるので、「オプション」タブをクリックする
4. 「コンビレーションの一部」の右にあるセレクトボックスを「はい」にして、「OK」をクリックする

これで確かに 1 つにまとまったけど、やっぱり「コンビレーション」という謎のアーティストができてしまう。そこで、上記の操作をもう一度やり、最後の「コンビレーションの一部」右のセレクトボックスを「いいえ」に戻す。すると、謎の「コンビレーション」というアーティストは消えるが、アルバムは 1 つにまとめられたままの状態で残る。これで美しくまとめられた。

Safari Extension（機能拡張）を作る前に証明書をゲットし、Safari Developer となる [Safari Extensions を作ってみる：第一回]

Safari Extension（機能拡張）も widget と同じように、html や Javascript、css で簡単に開発できるみたいだけど、作る前にやることが結構ある。なんか証明書というのが必要らしい。

★機能拡張を開発する画面

まずは機能拡張を有効にしていなければ、これを有効にする

• Safari を起動する
• メニューバーの「Safari」から「環境設定」を選択する
• 「機能拡張」をクリックし、バーを「入」にする

これをやっていれば、メニューバーの「開発」に「機能拡張ビルダーを表示」が表示される。これを選択すると、「機能拡張ビルダー」が起動する。

★機能拡張を新規に開発する

• 「機能拡張ビルダー」左下の「+」ボタンを押す
• 表示されたメニューから「新規機能拡張...」を選択する
• まぁ待ちなさい、まずは保存しなさいとのダイアログが出るので、場所を選んで名前を付けて保存する
• 証明書がないと、画面上から 3 行目辺りが赤くなっている

さぁ、この赤いのを取り除きたい。この手順は以下の通り。

★証明書を入手する

• 「アプリケーション -> ユーティリティ」にある「キーチェーンアクセス」を起動する
• メニューバーの「キーチェーンアクセス」から「証明書アシスタント -> 認証局に証明書を要求...」を選択する
• 「ユーザのメールアドレス」にメールアドレス、通称に名前等を入力し、「要求の処理」のチェックを「ディスクに保存」にし、「続ける」ボタンを押す
• 保存ダイアログが表示されるので、場所を選んで名前を付けて保存する
• Apple ID を持っていない場合は、ご利用ガイド - Apple ID - Apple Store (Japan) を参考に、Apple ID をゲットする
• Sign in with your Apple ID - Apple Developerにアクセスする。
• 表示されたページの「Apple ID」には ID が表示されるので、パスワードを入力し、「Sign In」をクリックする
• 「Developer Certificate Utility」をクリックする
• 「Create Certificates」をクリックする
• 「Add Certificate」をクリックする
• 「Continue」をクリックする
• 上記「4」で保存したファイルをファイル選択で指定し、「Generate」をクリックする
• ローディング画像がくるくる回り、緑色のチェックマークが表示されたら、画面右下の「Continue」をクリックする
• 表示された画面の「Download」をクリックすると、自動でダウンロードされる。
• ダウンロードされた「safari_identity.cer」をダブルクリックすると、「キーチェーンアクセス」が起動する。これで証明書の準備は OK となる

この状態で上述の「機能拡張を新規に開発する」の手順を行うと、赤かった 3 行目に「Safari Developer:〜〜」と表示され、開発できるようになる。

新しい iPod touch

アップル - iPod touch - FaceTime、Retinaディスプレイなど、魅力を満載。

やはり新しい iPod touch が出た。毎年 9 月にはモデルチェンジしているから、期待していたけど、やっぱり出た。そして、欲しい。
今までは iPhone とのざっくりした違いを、通話とカメラとどこでもネットワークへ接続ができるかどうかだと思ってたけど、そのカメラが装着されたことにより、余計に魅力的に感じる。美しい Retina ディスプレイもとっても気になる。

糞フトバンクなどにはビタ一文ともやりたくないので、iPod touch の機能拡充にはいつも期待している。そんな中今年、iPod touch を買ったのはいいけど、一番安い 8 GB モデルだから、iOS4 にアップデートしても、ほとんどの機能を使うことができない。壁紙機能すら使えない。だからなおさら、気になる。。。ま、しばらくは我慢の日々だろうなぁ。

Mac の Dashboard を再起動する

今、Dashboard の計算機を使おうとして起動したけど、いくら計算機をクリックしても active にならない。うーん、と思って他の Widget も見てみると、カレンダーの日付は昨日のままだし、時計も明後日の方向を指していた。辞書 Widget も active にならないから、こりゃ Dashboard がお亡くなりになってると思い、再起動しようとした。しかし、Finder は Mac 3 点押しの command + option + esc で強制終了メニューから強制終了させられるけど、Widget はできない。Dock の Widget アイコンの右クリックでもそんなメニューは出てこない。

ということで、「アクティビティモニタ」の出番。

★「アクティビティモニタ」の場所

起動ディスク -> アプリケーション -> ユーティリティ -> アクティビティモニタ

★Dashboard の再起動

1. アクティビティモニタを起動する


2. 「プロセス名」という欄に「DashboardClient」というのがあるので、その行をクリックする


3. 左上にあるデカい赤アイコンの「プロセスを終了」をクリックする


4. 表示されるダイアログの「終了」を選択すると、勝手に再起動する

Dashboard を再起動したので、今は普通に動いてるみたい。

携帯電話用に Google が勝手に変換するのを防ぐ

せっかく携帯版ウェブサイトを作って、パソコン版のトップページに携帯電話からのアクセス振り分けを仕込んだとしても、携帯版の Google から表示すると、携帯サイトへジャンプしない。Google が勝手に携帯電話用に変換してしまっている。確かに便利な機能ではあると思うけど、こうやってせっかく仕込んだ振り分けが機能しないのは実に困る。そこで、下記のたった 1 行をパソコン版ウェブページの <head> 内に記述するだけで、これを回避することができる。

下記は www.xxx.com というパソコン版のウェブページに、携帯版のウェブページである www.xxx.com/m/ へジャンプさせる場合。

<link rel="alternate" media="handheld" href="http://www.xxx.com/m/">

Widget で設定情報などユーザに選択させたデータを保存する/読み込む

昨日、widget でユーザに選択させた項目を保存、読み込むという記事を書いたけど、他の widget では cookie を使っていなかった。デフォルトで装備されている Weather という Widget の中身を見ていくと、データを別の保存、読み込み方法で制御していた。

デフォルトの Widget でこの手法を使っているので、おそらく cookie ではなくこちらが主流なんだろうと思い、昨日のエントリーは「cookie を使いやすいように読み込む」というタイトルに変更しておいた。併せて、widget 関連エントリーではなく、単なる cookie を連想配列に突っ込むというエントリーへと変更した。

さて、widget でのデータの保存、読み込み方法は、とても簡単にできていた。

★保存

「keyword」という項目名で、内容が「xxx」のデータを保存
widget.setPreferenceForKey("xxx", "keyword");

★読み込み

「keyword」という項目名のデータを変数 key に格納
var key = widget.preferenceForKey("keyword");

たった 1 行でできる。cookie よりも実にシンプルに管理できる。

リンクチェックには Opera が便利

レイアウトやらの確認を含まず、ただリンクのチェックをしたい場合は Opera が便利だと思う。Opera はデフォルトでマウスジェスチャー機能が備わっており、それを使うことで簡単に戻る、進むの動作をできる。

• 右クリックしながら左に動かす
  →戻る


• 右クリックしながら右に動かす
  →進む


• 右クリックしながら左クリック
  →戻る


• 左クリックしながら右クリック
  →進む

もちろん、Firefox でもアドオンでできるけど、デフォルトでできるというのは素晴らしい。Opera は覚えている限りでも 7 年くらい前からできていた。

cookie を使いやすいように読み込む

cookie の読み込みに関して検索してみると、cookie 文字列で使用する ; や = の位置を調べて値をチョン切って使うみたいなことを書いてあるページもあったが、split() を使えばもっと簡単に、連想配列を使えばさらに簡単にデータを使える。

下記では init() という function で cookie を連想配列 cookies に突っ込むことをしている。

function init() {
// 連想配列 cookies をクリア
  cookies = [];
// 変数 cookieItems に、cookie を ; ごとに区切って格納
// これで 1 項目づつに区切られる
  var cookieItems = document.cookie.split(";");

  for (var i = 0; i < cookieItems.length; i++) {
// 変数 thisCookie に 1 項目を = ごとに区切って格納
// これで 1 項目内の項目名と値を分けて格納する
    var thisCookie = cookieItems[i].split("=");
// cookies に項目名と値を同期させながら格納
    cookies[thisCookie[0]] = thisCookie[1];
  }
}

Mac の Dashboard の Widget から Safari でウェブページを開く

widget を作成する際に、Safari で URL を開くこともあると思う。このとき、location.href や window.open では開くことができない。標準で付いていたものだったと思うけど、Google という widget の中身を見てみた。この widget 内のボックスに入れてボタンを押すと Safari で結果を表示するので、おそらくやり方が書いてあるだろうという推測があった。で、やり方はこんな感じ。

★Javascript

if (window.widget) widget.openURL (url);

ここで出てくる widget は、Dashcode で作成する際には既に定義されているので、url の部分に値を入れるだけで処理してくれる。

php で携帯用に画像を自動で画像を縮小する

携帯版ウェブサイトは、表示できる 1 ページの容量がパソコン版に比べ大幅に制限されているため、画像がデカ過ぎたりするとそれだけでぐんにょりした感じになってしまう。なので、画像がデカい場合は自動で縮小し、表示できるようにするという、パソコン版ではあまり想定しないような配慮も必要となる。

そこで、php でページを自動生成する場合、自動で縮小をする処理を書いておけば大方回避できる。下記は一例として、ファイル名からサイズを取得し、100000 bytes 以上の場合に縮小画像を生成し、表示するものを書いてみる。縮小サイズの横幅は 200px としている。

// 画像ファイル名を変数 imgFile に代入
$imgFile = "./img/xxx.jpg";
// ファイルサイズを取得し、100000 bytes 以上の場合、
// 画像縮小処理の copyImgForMobile() を実行する
if (filesize($imgFile) >= 100000) {
// copyImgForMobile() で縮小画像のファイル名を imgFile に代入
  $imgFile = copyImgForMobile($imgFile);
}
// 画像を表示
  echo = "<div align='center'><img src='". $imgFile. "' width='200' alt='' title=''></div>¥n");

// 画像の縮小処理
function copyImgForMobile($imgFileName) {
// ファイルの横幅を変数 imgWidth に、高さを変数 imgHeight に代入
  list($imgWidth,$imgHeight) = getimagesize($imgFileName);
// 縮小する画像のリソースを変数 imgResource に代入
  $imgResource = @imagecreatefromjpeg($imgFileName);
// 縮小後の横幅を 200px に固定し、変数 imgWidthSmall に代入
  $imgWidthSmall = 200;
// 横幅を縮小する割合から縮小後の高さを変数 imgHeightSmall に代入
  $imgHeightSmall = ($imgWidthSmall / $imgWidth) * $imgHeight;
// TrueColor イメージを新規に作成し、変数 imgCopy に代入
  $imgCopy = imagecreatetruecolor($imgWidthSmall, $imgHeightSmall);
// 画像の縮小を実行する
  imagecopyresized($imgCopy, $imgResource, 0, 0, 0, 0, $imgWidthSmall, $imgHeightSmall, $imgWidth, $imgHeight);
// ファイル名を名称部分と拡張しに分け、変数 imgFileStr に代入
  $imgFileStr = explode(".", $imgFileName);
// ファイル名部分の最後に「携帯用」として「_m」を付け、縮小後のファイル名を生成
  $imgFileNameNew = $imgFileStr[0]. "_m". $imgFileStr[1];
// 縮小後の画像を出力する
  imagejpeg($imgCopy, $imgFileNameNew);
// 縮小後のファイル名を返す
  return $imgFileNameNew;
}

携帯サイトで外部 CSS のようにスタイル付けをする

携帯サイトはあまりにも制限が多く、Javascript を携帯サイトで使えないため、なかなか美しいサイトを Flash 抜きでは作りづらい。正直、携帯サイトってうんざりすることが多い。もしターゲットユーザに壮年以上を含める場合、壮年以上の人は携帯の機種変更を長年していないことも案外多く、最新機種に併せた作り方ではレイアウトがイカれてしまったりする。こんな場合は table だって使えないし、CSS だって使わない方が無難だろう。しかし現代のウェブページの制作に慣れてしまうと、CSS の便宜性は使いたい。できれば 1 ファイルで管理したいから外部 CSS を使いたい。そんなときはどうすれば良いのか。

まず、スタイルを CSS ファイルに書かなければならないということはない。php に書いてしまえばいい。ページも php にすれば、include で読み込み、変数をスタイルとして使えばできる。例えば、文字色の赤や大きい文字を設定する場合は、こんな風にすればできる。

★/css/css.php

<?php
  $colorRed = " color='#ff0000'";
  $fontBig = " size='+3'";
?>

★/index.php

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  <html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=shift_jis">
    <title>タイトル</title>
    <? include "css/css.php"; ?>
  </head>
  <body>
    <font<? echo $colorRed; ?>>文字色が赤</font><br>
    <font<? echo $fontBig; ?>>文字サイズ大きめ</font><br>
    <font<? echo $colorRed. $fontBig; ?>>文字色が赤で文字サイズが大きめ</font><br>
  </body>
  </html>

php を include しているので head 内に放り込む必要はないけど、css の感覚からこう表記してみた。これだったら、私のようにプログラミング能力が高くない人でもスタイルを一括管理できる。

携帯ブラウザでの真ん中のソフトキーの表記を変える

携帯サイトでウェブページを閲覧する場合、ブラウザ一番下部の場所に「決定」とか「選択」とか表示されている部分があると思う。この表記は title 属性を読み込んでおり、a 要素や input 要素等に title 属性を仕込んでおけば、「決定」とかの部分が title 属性の文字となる。

この「決定」とかはフォーカスが当たらないと表示されないので、img 要素に指定しても意味はない。私が確認した要素は下記の通り。

a 要素
input 要素
option 要素

select 要素は記述しても変わらなかった。

上記は現在、私が使っているキャリアである au 機にて確認したもの。

QR コードを自動生成する

パソコン版ウェブサイトにて、例えば多く抱えるそれぞれの店舗ページに QR コードを載せたい、みたいなことがあるかもしれない。そんな場合は、固定のトップページへ誘導する QR コードよりも、携帯サイト内のその店舗のページへ誘導する QR コードの方がユーザビリティがいいと思う。しかしその QR コードをいちいち嵌め込んでいられない。

私が作ったものではなく単なる紹介ではあるけど、これを使うと簡単にできる。
QR コード・バーコード

このウェブサイト内にある「QR コード クラス ライブラリ」を使えば本当に簡単。私は Server Side のスクリプトは php しか扱えないので、php 版を使っている。使い方は「QR コード クラス ライブラリ」内の README.txt に詳しく記載されている。

パソコン版ウェブサイトトップページで携帯からのアクセスを振り分ける

This summary is not available. Please click here to view the post.

日本でオーロラ見られるかも 4 日夜、北の空に注目

日本でオーロラ見られるかも　4 日夜、北の空に注目

果たして本当にオーロラを見られるんだろうか。実に楽しみであるけど、あまりにも不確定なので夜には忘れてしまっているかもしれない。神秘的なオーロラを見てみたいが、北欧はめっちゃ寒いし、なによりも飛行機が苦手。怖くてたまらん。しかも行った時に見られないかもしれないというオプション付き。確実に見られるクリスマス市とは訳が違う。

でも一生に一度は見てみたいなぁ。

本日のリアルスコープ

今、「容疑者室井慎次」の続きにやっていたので見ていたら、「リアルスコープ」をやっていて、南朝鮮のことをやっている。南朝鮮ではタバコのポイ捨ては「条例違反」とやっていた。そんなことを言うと、朝鮮人はポイ捨てをしない、もしくはやるとしても良心が傷むような感じに受け取られる可能性がある。

では真実はどうか。

前にも書いたが、私はドイツにいた頃、Samsung に出向していた。なので、多くの朝鮮人の行動を見ていた。そんな彼らがポイ捨てをするのかどうかと言うと、、、「なんの疑いもなく捨てる」現場を数多く見てきた。しかも特筆すべきポイントがある。

朝鮮人は火が点いたままでタバコをポイ捨てする。

良心なんてあると思えない。朝鮮人にモラルがあると今まで一度も思ったことはない。これは実体験を踏まえた上での主張である。ホテルの禁煙室に泊まっていた朝鮮人は、そんなことお構いもなく、禁煙室であろうが喫煙する。これはホテルの従業員が語っていたことだ。また、構造上少ししか開かない窓も、力づくで開けようとする。これもホテルの従業員が話していた。そうそう、私はトイレで用を済ませた後に手を洗う朝鮮人を見たことがない。これは日本で働いている朝鮮人も該当した。

朝鮮人にモラルなどない。

タクシーについて

タクシーとテレビCMと。

堀江氏の上記の記事を読んだこともあり、私がタクシーを嫌いな理由を述べたいと思う。まずは以前の体験談を 2 つほど。

もう 10 年前になるが、ある土曜日に起床したら腹に鈍痛があった。なにをやってもダメで、病院に行くことにした。土曜日なので色々と探した挙げ句、少し離れた場所が一番近いと判ったけど、歩いては行けないのでタクシーを使うことにした。その病院は「○○四丁目」にあるということなので、運転手にその地名を告げた。しかし着いた場所は「○○本町四丁目」だった。違うね、これ、違うね。しかもこっちはなにか判らない腹痛を抱えている。怒る気力がなかったため、指摘し過ぎるほど指摘するだけに止め、「○○四丁目」に向かった。しかし、さらに信じられない状況となる。普通タクシーの運転手って病院の場所くらい把握しているもんじゃないのか？結果的には「判らんからここで降りて自分で探して」と、「○○四丁目」かどうかも判らない場所で降ろされる羽目に。いや、こっちは痛いからタクシーを使ってるわけで、連れてってくれないと意味ないんやけど。ここはさっきの寄り道がなければ、おそらく走っても 15 分くらいのところ。アンタが客待ちしてた所からかなり離れた場所の病院ならまだ妥協できるが、これくらいの範囲の病院くらい覚えていないものなのか？と怒り心頭だったが、ようやく辿り着いた目的の病院の看護婦さんが「体温計持ってないならこれ持って帰って」と体温計をくれたので、良いことと悪いことが連続して起きて精神状態が戻った。ちなみに、私の病名は尿管結石だった。発症したことのある人ならツラさが判ってもらえると思う。

さて、次に、歓迎会で夜中 3 時くらいになってしまい、タクシーしか帰る手段がなかった時の話。私は 3000 円しか持っていなかったが、おそらく着くだろうということで乗り込んだけど、どうも足りないかもしれないと思って、「3000 円しかないので、途中なら途中でいいから降ろしてほしい」と運転手に伝えた。で、どこかで降ろされて、家はどこやろか、と歩いていたら、見たことのある景色が目に飛び込んできた。なんと家を過ぎ去っていた。自分の家なのでもちろん住所は正確に伝えたのに、実は運転手はよく判っていなかったという信じられない結果。こんなことがあってから、私はタクシーを使わなくなった。最寄りの駅やバス停が近ければそれを使うし、1 時間程度で急いでいなければ、歩くことにしている。

タクシーについてはこれだけではない。道路交通法というものを全く気にしていない。交差点で客を乗せたり降ろしたりするタクシーがなんて多いことか。さらに普通に走っていていきなりハザードランプを点けて止まろうとする。一般人なら取る必要のない二種免許を有しているということは、それだけ「模範たる行動」を行うべきであると思うのに、逆に危険走行を繰り返している。もっとタクシーによる違反を取り締まるべきだと思うし、これだけタクシーが溢れているのだから、敷居を上げてもいいと思う。

二種免許保有なので誰よりも安全にという心構え、そして人の命を預かっているという自覚、なによりもこれを商売にしているのだからプロという意識を、タクシー運転手は持ってほしい。

久しぶりに Yahoo! Japan で素晴らしいと感じたページ

Yahoo! JAPANトップページをホームページに設定しよう

今日、Yahoo! Japan のトップページ左上に「ホームページに設定する」というボタンを見つけた。「ホームページ」という誤用が濫用されている今の日本で、久しぶりに正しい使い方をしていた。それも、Yahoo! Japan のトップページにあるということは、非常に意味が大きいと思う。

基本的に Yahoo! Japan は在日朝鮮企業であり、反日の塊であるポータルサイトなので、良いと思うようなことは滅多にない。大きくは Yahoo! Japan の思想（コメントが操作されているので判る）から、小さくは img 要素や a 要素に title 属性を付けていない欠陥に至るまで、私は好きではない。良いと思えるものは、天気ページや競馬ページなどは使いやすくできていると思う。

この正しい「ホームページ」の表示は、そんな私の気分をぶち壊すほどの威力を持っている。私は少しだが言語を専門に学んだので、誤用や略語等に他の人よりも厳しい姿勢だと思う。日本語だろうが英語だろうがドイツ語だろうが、言語は正しく使うべきだと思っている。だからウェブサイトやウェブページ、果てはインターネットのこと自体を「ホームページ」と呼んでしまうしまうことには、嫌悪感を抱いている。この Yahoo! Japan の心意気は素晴らしいと思う。一人でも多くの人が、「ホームページに設定する」という言葉で「おや？」と思ってほしい。「ホームページ」は設定するものである、ということに。

しかしこのウェブページ、Safari や Firefox や Opera で開くと画像付きで説明しているのに、Google Chrome で開くと画像は付いていない。競合としてのささやかな反抗なのだろうか。

MySpace で考えさせられたこと

先日、MySpace でフレンドリクエストが飛んできた。その人のページを見に行って、リクエストを受け入れたけど、数時間後にその人の父親という人からメールが来た。なんだろうと思って読んでみると、「とりあえずこれを見てくれ」という内容。なんだろうと思って見ると、なんとそのページの人は去年、亡くなっていた。癌だった。まだ 20 歳にもなっていないのに、神の試練にチャレンジしていた。

私は癌家系に産まれている。知っている限りでも、胃癌、食道癌、白血病で亡くなっている。私の父も現在、癌に冒されている。小さい頃から判っていたことだが、そのうち、私も癌になるだろう。しかし、報道された中でしか知らないが、癌を克服した人だっている。また、私のような家系でも、遺伝子の病気と言われても、100% 発症するとは限らない。だから悲観していない。ただ、いつその時が来ても悔いないように、チャレンジは常にしていきたい。ドイツ語の勉強もチャレンジだと思っているし、昔から実現させたかったものの準備もしているし、今の危機的な状況にある日本を憂いているので、南朝鮮・中国・売国政党などについてここにエントリーを書いて少しでも「危ない」ということを広めようとしている。

今、五体満足であることに、感謝したい。

「ギタリスト」という定義

もうここ何年も、コードをかき鳴らすだけで「ギタリスト」とか自称してる人が多過ぎるように感じる。例えば、コードを押さえて音を出すだけの人を「ピアニスト」と呼ぶだろうか。やはり楽器でメロディーを奏でることができてこそ、ギタリストやらピアニストやらを自称できると個人的には思う。だって、それだけで自称できるなら、巷に溢れ返ってしまう。今は正に「ギタリストのインフレーション現象」となっている気がする。

私もギターは所有しているが、ただ興味があってちょろっとやっただけなので、自称なんてしないし、自分で「ギタリスト」だと思ったことは一度もない。「楽器はなにかできますか？」という問いは今まで生きていて何回かあるけど、「ピアノです」と答えている。「ギターは弾けますか？」と訊かれても、「持ってはいますが、ロクに弾けません」と言ってきた。駅でたまにみかける路上の人なんて、大概ギターを持っている。そして、大概コードをかき鳴らすだけ。メロディーとコードなんて音楽的な魅力はほとんどない。遭遇したこっちが恥ずかしいわ。まぁメロディーがある分、ヒップホップよりマシだけど。

ちなみに、こういう人をギタリストと呼ぶんだと思う。
YouTube - Destiny - Kelly SIMONZ
YouTube - Yngwie Malmsteen Acoustic Guitar Solo

韓国「日本が謝罪と文化財を返還」、日本「事実でない」

韓国「日本が謝罪と文化財を返還」、日本「事実でない」

とりあえず南朝鮮は、朝鮮文字とインフラと日本から盗んだ仏像を返してくれるか？あと、世田谷の一家虐殺の犯人も渡してほしいね。あ、それと、今まで日本から強奪した「賠償金」とやらも返してもらえるか？日本は南朝鮮に賠償を払う筋合いはない。全くない。

うーん、最近ここに書くことがないなぁ。

「止まれ」で止まらない車は、理解に苦しむ

何故、自動車は「止まれ」の標識や標示で止まらないのだろう。私はちゃんと「止まる」自動車を産まれてこのかた見たことがない。横断歩道はあるが信号がない場所で、こちらは横断歩道を自転車で渡っている。あとから自動車が接近してくる。こんな場合、仮に「止まれ」がなかったとしても、自動車は止まるべきである。強者弱者の力関係を考えても、答えは変わらない。そこで、自転車に乗りながら運転者の目線を見ていると、標示を全く気にしていない。むしろ「何故お前が止まらないんだ」と言わんばかりの表情をしている。標示が目に入らないほど視力が低いのか、「止まれ」の文字すら読めない無学極まりないモノなのかは判らない。しかしどちらにせよ、そのようなモノに運転免許証など発行する理由はない。

道路交通法は守るためにある。もし全ての人がこれを守れば、交通事故など起こる筈がない。しかし交通事故は毎日発生している。ならば交通事故が発生しないように、自動車製造の過程において厳しい規制を行ったり、法整備をして厳罰を定義すれば、交通事故は間違いなく減る。しかしこれは行われない。違反金や罰金といった収入が警察に入らなくなってしまうからだ。

ならば人々の意識改革が行われれば、とも思うが、この無秩序の現代日本において、それは有り得ない。ならばここに書いても仕方ないのだが、あまりにも一時停止を軽んじている運転手が多過ぎるため、書かざるを得ない。

一時停止をしない運転手には、懲役 3〜5 年執行猶予なしという罰が妥当であると思っている。一時停止といった極々簡単なルールも守れないような人間には、猛省してもらわなければ、秩序は保たれない。飲酒運転やスピード違反といった見た目に判りやすい違反は厳罰化されているように思えるが、こういった「基本的なルール」を守れない人間は、自動車を運転すべきではない。

我々の血税で支払われている事務所にて山鉾巡行を観る民主党員

我々の血税で支払われている事務所にて山鉾巡行を観る民主党員 on Twitpic

先日、山鉾巡行を観に行ったが、その際に御池新町の北西にある民主党事務所でこの巡行を観ていた人たちがいた。この事務所の経費は誰が払っているのか。もちろん我々国民である。我々の血税はそんなことに使われるためのものではない。「公に働く」という意識がなさ過ぎる。

光とはなにか

今週、中学の同級生が泊まりに来た。彼は工学博士になり、普段はつくばで研究をしている。そこで、私の積年の疑問であった、「光とはなにか」について尋ねてみたら、簡単に解説してくれた。以下、canvas による絵を交えながら、教えてくれたことをまとめてみたい。以下は便宜上、K 殻から M 殻までの 3 つの電子殻を持つ原子の場合の絵とする。

原子核の周りを電子が周回していて、この周回をする軌道が何本かある（原子によって数は違う）。この一番内側が K 殻で、電子が周回するにも一番安定している。逆に外側の軌道になればなるほど、不安定になる。


さて、普段は安定している K 殻で悠々自適な生活を送っている電子くんだが、外部から強いエネルギーを受けると、外側の軌道に移動する。


逆に、この外部の強いエネルギーがなくなると、安定した内側の軌道に移動する。


さて、安定した軌道を周回している時は小さなエネルギーで済むが、不安定な軌道を周回する時は大きなエネルギーを、電子は必要とする。その逆ももちろん然りなので、安定した軌道に戻る時は、不安定な軌道を周回している時ほどエネルギーは必要としなくなる。不要となったエネルギーは放出される。これが光であるという。


専門家からするとこの説明は間違いかもしれないが、私が聞いた話はこんな感じ。また今度、話を聞く機会があれば、もう少し広げて訊いてみたい。

保守新生を読んだ

Amazon.co.jp： リベラルが日本を潰す 保守新生: 櫻井 よしこ, 平沼 赳夫: 本

先日、保守新生を読み終えた。既に知っていることは多かったが、こうやって書籍として目を通すと、やはり今の日本は危ないということを再認識せざるを得ない。バラマキにより民衆の目を欺いた民主党の本来の方針、伝統や文化の神髄である天皇家を守り伝え崇めていく意識の低さ、そしてなによりも日本を愛する＝愛国＝危険思想を植え付けられている現状など、もはや日本のあるべき姿として存続させることが困難であるように感じる。

日本国憲法が日本人の手によって作成されていないから、日本人による自主憲法を作るべきだという議論（憲法作成に携わった 6 人のアメリカ人に「まだあの憲法を使っているのか」と驚かれるほど異常なこと）や、自衛隊を正式に軍と認めるということや、大東亜戦争はアジアを植民地化していた列強から独立させる戦いであったという主張などは、左翼やマスコミに左右されやすい人たちにとって「右翼だ」「軍国主義だ」「戦争をしたいのか」などと言われてしまう。しかし日本には古来より「八紘一宇」という精神がある。これは平たく言えば「世界の人々が差別なく平和に暮らす」という意味である。なので大東亜戦争では、列強によって差別されていたアジアを救うという目標があった。さらに、同盟国であったドイツから「同盟国であるから、日本もユダヤ人を排斥せよ」という命令を、「日本には八紘一宇がある。差別はできない」と言われた要求を頑に拒否し、ユダヤ人を保護した。このような日本民族が好んで戦争を仕掛ける筈がない。そもそも右翼＝危険という思想も、右翼内に結構な割合で存在する在日朝鮮人＝南北朝鮮の工作員により作り上げられた虚偽である。

先の参議院選挙では、現職の法務大臣が落選というのは、法治国家としておかしい現象だと思う。元々、かの人を法務大臣を任命したことがそもそもの間違いではあるけど。しかし、少しづつではあるけど、保守という意識が戻ってきた人が増えたように感じる。日本を取り戻せるかは、我々次第。

先人が苦労して守り抜いてきた天皇家を、これからも守っていく義務があると感じる。

対談形式で非常に読みやすい本なので、まだの人は是非ご一読を。

スペイン優勝

民主党敗北という素晴らしい余韻に浸かりつつ迎えたワールドカップ決勝戦。5/17 のエントリー W 杯選出メンバー / 非選出メンバーでの明暗 で、「ドイツ・オランダ・スペインに期待したい。」と書いたが、そのチームが 1 位〜 3 位まで昇り詰めたのは嬉しかった。その中での決勝戦。私はワクワクしながら観ていた。

結果だけを言うと、好きなイニエスタの決勝ゴール、両チームの GK と守備陣の素晴らしい働き、やっぱりコンディションが上がらずさらに具合を悪くしたかもしれないトーレス、単独得点王になれなかったヴィジャとスナイデル、そして両チーム合わせて 15 枚という異常な数のイエローカード。

得点は 1 点だけだったが、決勝戦らしい緊迫した素晴らしい試合だった。そして、この試合の第 4 審判（選手交替やアディショナルタイム掲示係等）の西村主審、第 5 審判（控え）の相楽副審が決勝の舞台に関わり、メダルを受け取ったことは、日本人としてとても誇りに思う。

しかし、タコのパオルくんは凄いな。全問正解やないか。

国民の審判、其の壱が下された

売国与党になってから初めての国政選挙、参議院選挙。土曜日からドキドキしていたが、遂に国民の審判が下った。既に知事選挙でじわじわと売国政党離れが実証されてきていたが、昨日は各地で実証された。

最も素晴らしい結果が神奈川県での千葉が落選したことだ。完全な売国奴であり死刑を全く執行しないという、死刑反対論者が何故法務大臣なのか全く理解できなかった千葉は、日本人ならどう見ても落選して当然だ。同じ民主党の金子氏へ票が流れたというだけでも、民主党支持者からも見放されたことが判る。もういっちょ山梨県の輿石も落選すべきだったが、皮一枚で残ってしまった。

さて、衆議院解散はいつだろうか。元々自滅が得意な民主党。なんとか売国政策を実行される前に、解散に追い込んでほしい。

News ZERO での「収支報告書に議員署名」

今やっている News ZERO で「収支報告書に議員署名」に賛成か反対かというのを各党の党首もしくは代表（民主党だけは幹事長）に尋ねているコーナーで、各党の代表者がフリップを持っている映像を見ていると、バックに国旗を掲げているのは自民党のみ。できれば平沼氏のたちあがれ日本も掲げてほしかったが、党を代表してモノを言う際に国旗を掲げない党など、投票するに値しないと思う。

国旗を切り刻んだ民主党などは論外である。

[ドイツ語を勉強してみる：第四回] 難しいドイツ語の不定冠詞

ドイツ語にも当然冠詞がある。英語で言う「a」とか「an」に当たるものが不定冠詞、「the」に当たるものが定冠詞。ドイツ語に比べると英語のは凄く簡単で、不定冠詞の後に続く単語の始まりが母音の場合は「an」、子音の場合が「a」となる。不定冠詞の変化はこれだけだし、定冠詞は変化しないという特典もある。しかしドイツ語はそううまくいかない。非常に難解。

前回の [ドイツ語を勉強してみる：第三回] 名詞の性 でやった男性名詞・女性名詞・中性名詞でも変化するし、1 格〜 4 格の格変化も併せて発生する。だから性の 3 種類と格の 4 種類をかけて、12 種類存在することになる。

まず、格とは以下の通り。

1 格：「〜は」「〜が」
2 格：「〜の」
3 格：「〜に」
4 格：「〜を」

では、不定冠詞「ein」の変化を見てみる。

★男性名詞の前
1 格：ein
2 格：eines
3 格：einem
4 格：einen

★女性名詞の前
1 格：eine
2 格：einer
3 格：einer
4 格：eine

★中性名詞の前
1 格：ein
2 格：eines
3 格：einem
4 格：ein

見てお判りの通り、女性名詞の 1 格と 4 格・2 格と 3 格、中性名詞の 1 格と 4 格は同じ。だから「eine」だからと言って全て「〜は」という意味にならず、キチンと文脈を解釈する必要が出てくる。とんでもなく難しい。

私はドイツ滞在前に買った「機内で覚えて現地で使えるドイツ語」に出てくる単語やフレーズを毎日書いているのだが、その中の例文で「ein」とか「einen」が同じセクションの例文にも関わらず出てきていて混乱していた。そこで調べると、ここで出てきた「ein」も全て 4 格であったことに気づいた。誰かに文法を教わっているわけではないので、疑問に感じたらその都度調べることにしている。調べて理解できたものは、あまり忘れないという体験からきている。

この自学は 9 か月続いているので、それなりに例文は吸収できているかもしれないけど、こうした文法も身につけないといけないなぁと感じる。もちろん、単語量を優先する姿勢を変えようとは思わないけど、ドイツ語の格変化には要注意だなぁと感じた。

数学

つい今しがた、毎週録画している「たけしのコマ大数学科」の問題に久しぶりに挑戦してみた。考え方はあってるけど、細かいミスで正解できず。この辺が、私が数学に弱かった理由だろうなぁ。

今更数学をやっても仕方ないかもしれないけど、死ぬまでには強くなっておきたい。強くなることでそれほど実利は伴わないけど、一度諦めたものをそのまま諦めておきたくないと思う。

西村主審、決勝の第 4 審判＝日本人で大舞台初〔W 杯〕

西村主審、決勝の第 4 審判＝日本人で大舞台初〔W 杯〕

「最後の日本代表」である西村主審と相楽副審が決勝まで残った。日本のサッカー史においてとても喜ばしい出来事。欧州勢同士の決勝なので、日本人であることが「中立」として評価されれば良かったとは思うけど、なにが基準で選ばれたかはさすがに判らないので言いようがない。

西村主審は選手交替やアディショナルタイムの電光掲示板を持つ係だから、中継でも姿を見ることができると思う。ただ、解説は西村主審のことを必要以上に言葉に出すことはないと思う。前回のオランダ対ブラジル戦では結構「西村主審が」とうるさかった。西村チャンネルでも見ているのかと思うほどに。

11 日は選挙あり、決勝ありと、画面に釘付けなんだろうなと思う。

日本大使に男が投石＝大使館員が手にけが－韓国

日本大使に男が投石＝大使館員が手にけが－韓国

何度も言うが南朝鮮は日本にとって敵国である。この事案を見ても明白。こんな国の人間に参政権を献上したり、日本人の言動を監視させる人権擁護委員にしようとしたりしている民主党や社民党や公明党はホント糞だな。

大体、韓国なんて名称も、世界共通ではない。南朝鮮に日本が踊らされているだけではないのか？ドイツが東西に分かれた際の名称は「東ドイツ」「西ドイツ」、ヴェトナムが南北に分かれたときも「北ヴェトナム」「南ヴェトナム」、そして朝鮮が分かれた後、北は「北朝鮮」となるが何故「南朝鮮」としないのか。自意識過剰ではないか。そして英語では「South Korea」なので、「南朝鮮」となる。また別の呼び方の「Republic of Korea」だって「朝鮮共和国」となる。韓国なんて名称は妄想に過ぎない。南朝鮮で充分だろう。まぁ元々、人名すらロクになかった頃に民衆が役所を襲い、戸籍を燃やした。その結果、名前のなかった人たちは、良民階級のみが使用していた「金」やら「朴」やらを挙って自称したもんだから、現在に至ってこの名前だらけになっているという歴史がある。それを考えると、朝鮮人にとって名前なんてどうでもいいんだろうな。恥も外聞もない。

それはそうと、大使への攻撃など、宣戦布告と同じである。

保守新生

先ほど買ってきた。また、読んだら感想をば。
保守再生 櫻井よしこ x 平沼赳夫
Amazon.co.jp： リベラルが日本を潰す 保守新生: 櫻井 よしこ, 平沼 赳夫: 本

国会議員を半分に

「国会議員を半分に」というのは確かに良いことだと思うが、現実的には桃源郷のような世界にしか感じない。稀にこれを標榜する政治家がいることはいるが、いきなりできるなんて誰も思っていない。ここは「3% 減らす」ことを掲げた方がいいと思う。国民の中には国会議員が多過ぎると感じている人が多いようだし、私もそう思う。だから、この「3%」というのを当面の現実目標として、標榜した方が、国民への説得力というか、期待感を持たせることができると思う。

何回か書いたかもしれないけど、私は部分的に地方分権に賛成の立場を採っている。国民の生活に関わる部分は、それぞれの自治体で責任を持って行い、個々の自治体だけでは解決できない問題は国会議員の手に委ねれば良い。それに加えて、憲法・国防・外交等の国益に関わる部分だけを、国会議員がやれば良いということ。だから、国会議員は減らしても機能すると考えている。

ただ、「半分に！」と叫んでいる政治家だと、「ホンマにできるんか？」とうさん臭い気がするけど、「まずは 3% です。いきなり半分は難しい。だから削減の足がかりとして、目標値はまだ小さいですが、減らせるんだということを証明したいと思う」って演説すれば、「できるかも」と国民に感じさせることができる、ということ。

あと、小泉進次郎氏を総裁に据え、上述のような国会議員削減案を出し、景気対策では麻生前首相と故中川金融担当大臣の実績が今効いていると訴え、民主党の売国政策を引き合いに出しながら国を守る姿勢を打ち出し、再登板の声が少なからずある安倍晋三氏を表に出して行けば、保守票は帰ってくるし、去年民主党に投票した人たちも帰ってきやすくなると思う。

時期柄、政治話題になってしまうが、選挙が近くなればなるほど、憂えずにはいられない。

Google カレンダーを iCal で読み込む

Apple は好きでもう 10 年使っているが、iCal は使ったことがなかった。ここ数年はその代わり、Google カレンダーを使っている。ある日ふと、iCal へ Google カレンダーを読み込ませることはできないのか、と iCal を起動してみた。すると、予想通り、できた。

1. 「iCal」から「環境設定...」を選ぶ


2. 表示されたウィンドウの「アカウント」タブをクリックする


3. 左側ボックスの下にある「+」ボタンを押す


4. 「アカウントの種類」を「Google」にし、Google のアカウントで使っているメールアドレスとパスワードを入力する


5. 「作成」ボタンを押す

これで Google カレンダーに登録した内容が iCal に読み込まれる。さらに「カレンダーを更新」というのがあるので、好きな間隔にセットすることもできる。

ついでに、その環境設定のウィンドウでは「アカウント」タブの「アカウント情報」が選択されているが、右端にある「委任」をクリックし、「日本の祝日」にチェックを入れると、より便利になる。

しかし残念ながら、やり方を発見できていないだけかもしれないが、iCal に登録した予定は Google カレンダーには反映されない模様。

中国人観光客への Visa 緩和

朝鮮人のネタが終わったら今度は中国人か。しかしこの緩和はさらに日本を汚くするなぁ。物理的に。どうやら中国人は富士山がお好みのようだが、そんなことをしたら我が日本国の誇りである富士山が穢される。中国人だぞ。なにするか判ったもんではない。麓で拒否、いや、もっと言えば中国人と朝鮮人は全ての入国を拒否すべきだ。もう日本の国益を守る特効薬はこれしかない。

朝っぱらから「とくダネ」で特集している朝鮮人の自殺

自殺はよくない。絶対よくない。でもな、国民の 8 割以上はどうでもいいと思っているこの事件を朝っぱらから特集を組んでやるのは勘弁してくれ。そんなもの、好きな人なら見るまでもなく知ってる。

第一、参議院選挙を控えた重要な時期にやるような話題か？もっと報道するべきことはあるように思う。折角、他よりはマシなフジなんだから、民主党の本来の目的とかを是非報道してもらいたいと思う。

選挙は大事。投票に行こう。

ありがとう、日本代表

儚く散ってしまったが、大きな夢を抱かせてくれた。駒野には気を落とすなと言いたいが、今はきっと無理だろう。だけど、駒野がいなければ決勝トーナメントにすら行けなかったかもしれない。日本代表の選手には感謝の念しかない。

ただ、最後に森本を見たかった。是非遠藤のように、この悔しさをバネに森本には次回の大会で活躍してほしい。

今はただ、ありがとう。残った日本代表は、西村主審と相楽副審。これはこれで誇りに思う。次はどの試合で笛を吹くのだろうか。

iPhone、iPad、iPod touch の User Agent と php での振り分け

自分用の備忘録として、iPhone、iPad、iPod touch の User Agent を残そうと思う。

ただ、私は iPod touch しかなく、iPhone と iPad は他所に掲載されていた情報に、iOS4 の情報を上書きして、下記に載せてみた。iPod touch の User Agent は実際に表示させた結果なので、間違いはない。「like Mac OS X;」の後に続く言語は、機器ごとに異なる。

• iPhone
  Mozilla/5.0 (iPhone; U; CPU iPhone OS 4_0 like Mac OS X; en) AppleWebKit/532.9
  (KHTML, like Gecko) Version/4.0.5 Mobile/1A543a Safari/419.3


• iPad
  Mozilla/5.0(iPad; U; CPU iPhone OS 4_0 like Mac OS X; en-us) AppleWebKit/532.9
  (KHTML, like Gecko) Version/4.0.5 Mobile/7B314 Safari/531.21.10


• iPod touch
  Mozilla/5.0 (iPod; U; CPU iPhone OS 4_0 like Mac OS X; de-de) AppleWebKit/532.9
  (KHTML, like Gecko) Version/4.0.5 Mobile/8A293 Safari/6531.22.7

おまけに、php での振り分け方も。

$agent = $_SERVER['HTTP_USER_AGENT'];
if (preg_match("/^iPhone|iPod|iPad/i", $agent)) {
// 処理
}

Canvas でローディングイメージ（読み込み中の画像）のアニメーションを作成する [html5 の Canvas を使ってみる：第卌五回]

Flash ではなく Ajax 等でのローディングイメージは画像を用いていたが、Canvas でもできるので、作ってみた。30° で 12 回転させ、その際に 12 で割っていった透明度を加えて行くと、くるくる回って見える。今回、よくあるこんな形がくるくる回るようにしてみた。


また、大きさ・色・回転の速さを自由に変えられるようにしてあるので、場面に応じて使えると思う。背景はもちろん透明にした。

★html 側

<canvas id="loading"></canvas>

★Javascript 側

function draw() {
// id: loading を変数 e に代入
  e = document.getElementById("loading");
// e で 2 次元描画を行うことの定義を変数 c に代入
  c = e.getContext('2d');
// 透明度を入れる配列を変数 alphas に定義
  alphas = new Array();
// 大きさ（Canvas のサイズ）を指定
  len = 30;
// 色を rgb 形式で指定
  color = "rgb(0, 102, 255)";
// Canvas のサイズを変更
  setCanvasSize();
// 速さをミリ秒で指定
  loadingTimer = setInterval(drawLoadingImage, 50);
}
// サイズを変えないとデフォルトの Canvas サイズが残り、たまに厄介なことになるので変更
function setCanvasSize() {
  e.width = len;
  e.height = len;
// サイズの半分を変数 r に代入
  r = len / 2;
// 1 つの形の大きさを定義
  w = Math.round(len * 0.1);
  h = Math.round(len * 0.25);
// rgb 形式で入力された色を、透明度の手前でぶった切り、変数 colorRGB へ代入
  var n = color.indexOf(")");
  colorRGB = "rgba(" + color.substr(4, (n - 4));
// rotate(); の性質上、x:0、y:0 で回転させた方が良いので、
// x:0、y:0 で描画させるものを Canvas の中央へ setTransform(); で移動
  c.setTransform(1, 0, 0, 1, r, r);
}
function drawLoadingImage() {
// 描画されているものを clearRect(); で消去
  c.clearRect(-r, -r, (r * 2), (r * 2));

  for (var i = 0; i < 12; i++) {
// alphas の値が揃っていなければ（最初の描画時）、alphas に透明度を追加
    if (alphas.length < 12) alphas.push(i / 12);
// colorRGB の後ろに透明度を付けて透明度付きの色を定義
    thisColor = colorRGB + "," + alphas[i] + ")";
// fillStyle で色を指定
    c.fillStyle = thisColor;
// strokeStyle で枠線に transparent を指定し無効化
    c.strokeStyle = "transparent";
// 描画開始
    c.beginPath();
// 上記の形を lineTo(); と quadraticCurveTo(); と closePath(); で描画
    c.moveTo((0 - w / 4), (r - h));
    c.quadraticCurveTo(0, (r - h - w / 2), (0 + w / 4), (r - h));
    c.lineTo((0 + w / 2), (r - w / 3));
    c.quadraticCurveTo(0, (r + w / 3), (0 - w / 2), (r - w / 3));
    c.closePath();
// fill(); と stroke(); で色付け
    c.fill();
    c.stroke();
// 次のために rotate(); で 30° 回転させておく
    c.rotate(30 * Math.PI / 180);
  }
// alphas の最後の要素を取得し、削除し、先頭へ追加
  alphas.splice(0, 0, alphas[11]).pop();
}
// 描画を止める処理
function stopLoading() {
  clearInterval(loadingTimer);
}

すると、こうなる。


次に大きさを 100 にしてみる。

len = 100;

次は色をグレー rgb(150, 150, 150) にしてみる。

color = "rgb(150, 150, 150)";

今度は回転の速さを 100 ミリ秒にしてみる。

loadingTimer = setInterval(drawLoadingImage, 100);

最後に、背景を黒くした上で、色を白 rgb(255, 255, 255) にしてみる。下地の黒の影響を受けないことが判る。

color = "rgb(255, 255, 255)";

確認環境：
Safari 5.0、Chrome 5.0.375.70、Firefox 3.6.3、Opera 10.53