2008 年 6 月 のアーカイブ

FireFoxのDownload Dayを支援してみる。

2008.6.9 月曜日

バナー貼ってみた。

Download Dayとは何かというと、
FireFox3の正式版のリリース日にみんなでダウンロードして、24 時間最多ダウンロードソフトの世界記録に挑戦しちゃおうぜっていうお祭りみたいなもの。

こういうの結構好き。

専用ページへ飛ぶと、「参加するぜ!」ってのを登録できるようになっていて、
なんか、世界地図に、国毎に登録者数で色分けされてる。

流石にアメリカは多いなぁって感じだけど、
なんだかポーランドがやけに頑張ってるのも印象的。
なのでちょっとググってみた。

Firefoxシェア世界一はフィンランド、45.4%で群を抜く

ヨーロッパは全体的にFirefoxのシェアが高く、ほかにポーランドやハンガリーが40%を超えている。

なるほど、シェア高いのね。

でもって、世界一のフィンランドさんはどうなんだろう、と地図で一生懸命探してみた。
(場所よく知らなかったので苦労した)

…なんだこの温度差は。

休むんじゃー!

2008.6.6 金曜日

なんだか春先からやったら忙しくなって、
GWも家に篭もって仕事用のAjaxとかFlashのActionScriptとか書いてたり、土日も会社行ってて帰りが朝3時とか4時とかになったりしてて、俗に言うデスマーチ(ソフト系のデスマほどじゃないと思うけども)

ずっと休んでなくて、というか、「代休取れるよ」と言われても、土日すら潰してる状態だし、スケジュール見るとどこにも取れそうな日がない有様。
ブログいじってる時間はあったのか、といわれると、息抜き、現実逃避と答えるほか無い。

正確には先週の土曜は一応休みではあったんだけど、
仕事から帰ったのが土曜の朝で、寝て起きたら土曜の夕方で、髪切りに行って買い物&夕飯の後またダウンして、起きたら日曜の朝だったのでまた会社にいったという…。

今月は誕生日休暇 (誕生月に一個だけ休み取れる、誕生月過ぎると消滅) もあるんだけど、こりゃ流れたな、とか思ってた矢先、
今週予定してた仕事が一つスケジュールがずれて、
「ここを逃すとチャンスはない!」と思い、ひとまず誕生日休暇の消化をすることに。

そんなわけで明日(もう今日だけど)は久々にお休み!
何事も無ければ、土日も休んで、気が向いたら家でモジュールいじる程度にしよう。

正直、「これ、休んでられる状態か?」と思うくらいの状態だったけど…。
強引にキリつけてたら終電逃したし。

ゴメン>来週の俺

Flockを使ってみる&一部日本語化

2008.6.6 金曜日

ブラウザはFireFox派ではあるんだけど、
なんだかバージョンが進むにつれ、微妙に重いような気がして…。
特に起動に時間がかかるのがちこっと気になる。
朝PCを起動してweb上の出勤ボタンを押すタイミングが遅れると死活問題。

どうも、メモリリークもしてるらしく…。
会社に居るときとか、日によっては10時出社から0時頃の退社までブラウザつけっぱなしなんてことも多いわけで。
上のリンク先で言われてるようなフリーズこそはしないものの、まぁ若干気になる。

でも、IE7とか普段使う気にならないし…。
Safariも悪くないけど、一度GoogleツールバーやFireBugの恩恵に慣れてしまうとなぁ
そんなわけで、上のリンクで見かけたFlockを入れてみることに。
事前にちょっと調べてみたら、FireFoxをベースにしたブラウザで、色々機能拡張された物らしい。

ひとまずダウンロード。
現在(2008/06/06)の最新版は1.2 Firefoxの最新版である2.0.0.14がベースになってるらしい。

どうやら英語版しかないようで、まぁFireFoxベースなら別に問題ないかな…と思ったけど、
一部日本語化する方法があった。

Flockを日本語環境でまともに使えるようにする。
ここに倣って、FireFoxの日本語言語ファイルをインストール

http://releases.mozilla.org/pub/mozilla.org/firefox/releases/
今の最新版は2.0.0.14で、ちょうどバージョンも合ってる。
/2.0.0.14/win32/xpi/と進んで、ja.xpiをクリックするとインストールが始まる。

インストールが完了したら、アドレスバーにabout:configと入れて設定エディタ画面を出し、
general.useragent.localeの項目をja-JPに変更。

あとはFlockを再起動すればOK

なんだか、昔Firefoxが英語版しか無かった頃とかにやった作業そのままで何となく懐かしい気分に。

Flockの独自機能のメニューとかは英語のままだけど、その辺はあんま使わないので特に問題なし。

Firefoxのプロファイルそのまま使えるかな、と思って、バックアップを取って試してみたら、
なんとそのまま使えた。
拡張機能なんかもそのまま移行。
そのまま使おうかとも思ったけど、どこかに何か相違あると怖いし、
折角の新しいアプリなので、結局プロファイル作り直して設定し直し。

個人的に、ゴテゴテしてるの苦手だし、使わない機能一杯だし、
インターフェイス部分は出来るだけ切り詰めて表示部分に使いたい人なので、一気に整理。

かなりスッキリした。

ソーシャルブラウザということで、そっち系の機能がかなり拡張されてるけど、
現状では日本のサービスには殆ど対応してないし、使わなさそうだなぁ。
YoutubeとかFrickrとかGmailとか、その辺よく使う人には凄く便利なのかも。

ブログエディタがWordPressやMovableTypeの個人ブログに対応してるようなので、しばらく使ってみようかと。
あと使いそうなのはwebクリップボードくらいかなぁ。
ブックマークもdel.icio.usのオンラインブックマークが組み込まれてるみたいなので、
殆どブックマーク機能目当てでGoogleツールバー入れてる俺としては、ここも使いこなせるようになるとバーが一個減らせて嬉しいかもしれない。
(現状はゴテゴテしてたからまだ殆ど触ってない。)

まぁしばらくこれを使って、
Firefox3の正式リリースを待ちますよ。

FireFox3はパフォーマンス向上を目標にしてるって公言されてるし、
こないだFedora 9入れたとき、バンドルされてたFireFox3 beta5触ったら、やたら軽くてサクサク動いたので結構期待してたり。
Download Dayの祭りにも参加すべく登録済み!

Blogged with the Flock Browser

Mozzilaのススメ

2008.6.4 水曜日

ブラウザはFirefox派です。
ずっとNetscape派だったんだけど、Netscape4からずっとバージョンアップされず、
Netscape6もちょっとガッカリな感じで、いい加減IEの軍門に下るしかないのかなぁ、と落胆してたらFirefoxが登場。
βの頃から愛用してます。
メーラも現在Thunderbird

この2つ、色々使い勝手もいいんだけど、
何より嬉しいのが、環境が全部プロファイルで管理されてる事。

仕事柄、PCの使用頻度が高いので調子悪くなってくるとよくOSのクリーンインストールするんだけど、
プロファイルフォルダを別ドライブ(DとかEとか)に作っておけば、Cドライブを初期化してもすぐに元の環境に戻せる。
複数OSのデュアルブートにしても、同じプロファイルフォルダを指定したら両方のOSでそのまま使える。
(バージョンは合わせる必要アリ)
メールの中身とか、設定とか、Googleツールバーなんかの拡張機能とかそっくりそのまま。
キャッシュとか履歴とかもそのまま。

ちょっと乱暴な例だと、WindowsXPにインストールしてあったFireFoxとThunderbirdのプロファイルを、
同じマシンに入れたFedora CoreでNTFSをマウントして指定したら、そのまま使えてしまったりしたことも。
(場合によっては文字化けが発生することもあるかもだけど…)

やり方は結構簡単。
普通にインストールした後、「ファイル名を指定して実行」で

firefox -p
thunderbird -p

と、-pオプションをつけて実行すると、プロファイルマネージャーが起動するので、
ユーザプロファイルマネージャ
「新しいプロファイルを作る」ボタンを押してウィザードを起動。
(俺は、Default Userはいつも消しちゃってます)

「プロファイル作成ウィザードの開始」はそのまま「次へ」を押して、
新規プロファイルの追加
プロファイルの名前には好きな名前を入力。

次に、下段、「ユーザ設定、ブックマークやメールの保存先」の所で
「フォルダを選択」を押して、任意の場所を選択。
(冒頭で述べたとおり、C以外のドライブにするのがオススメ)

あとは、「今後このプロファイルを使用する」にチェックを入れた状態でFirefoxを起動。

ここで作ったプロファイルフォルダをバックアップするようにすれば、PCが壊れたり、別のPCに移行したりするときも、環境が楽にそのまま移せる。

拡張機能も多いのが結構魅力だったりするんだけど、
俺は、

だけ使ってます。

殆ど趣味用のアドオンだけど、web系の作業する人にはFireBugはオススメ。
バーの下の方に常駐して、cssやJSなんかをリアルタイムでデバッグしたり、編集したりできる。
ajaxの通信ログなんかが出るのも嬉しい。
詳しくはリンク先へ。

これのおかげでJSのデバッグが凄く楽になった。
(FireFox標準のエラーコンソールも重宝してたけど)

まぁ、大概その後で、IEでのみ起こるエラーに悩まされるんだけど…(´・ω・`)

と、まぁ、FireFox&Thunderbirdをオススメしてみつつ、
最近FireFoxの重さに不満が出てきて、自分は今Flock使ってまs

Blogged with the Flock Browser

WordPress:CoolCodeプラグイン

2008.6.3 火曜日

ひとまず、blogの内容的に、ソースコード等を載せることになることは確実だと思われるので、
表示方法を考えてみる。

最初はcssで対応しようかと思っていたけど、
探してみると、コード表示補助のプラグインをいくつか発見。

ひとまずCoolCodeを導入してみる。
こちらからダウンロードして来て、解凍して/wp-content/plugins/にアップロード。
管理画面の「設定」→「プラグイン」で有効化したら使用可能。

記事を投稿する際に
<coolcode>
 [コード]
</coolcode>
と囲むとその部分に適用される。

オプションは3つあって、

  • lang=”言語名”(PHP/ACTIONSCRIPT 等)
  • linenum=”on/off” (行番号の表示/非表示)
  • download=”ファイルのパス”

例えば

  1. <coolcode lang="php">
  2. <?php
  3. echo "Hello World";
  4. ?>
  5. </coolcode>

こんな感じで使用。
言語名のオプションは、つけると、その言語に合わせてコードをカラーリングしてくれる。
無しだとそのまま表示。

現在

* actionscript
* cpp
* css
* diff
* dtd
* html
* java
* javascript
* mysql
* perl
* php
* python
* ruby
* sql
* xml

に対応してるらしい。

とりあえず、download=””のオプションをつけると、ダウンロードのリンクの文字が中国語になってるので、該当部分を探して修正。
coolcode.phpの298行目

$this->blocks[$blockID] = '<div class="hl-title">&#19979;&#36733;: <a href="'

$this->blocks[$blockID] .= '<div class="hl-title">Download: <a href="'

に変更。

段々欲が出てきた。
長いソースを貼り付けるとページがもの凄く長くなってしまうので、WP-syntaxのようにスクロールで表示できるようにしてみよう。
DIVタグで囲んで出力するようにして、overflowで制御すればいいかな、と思って軽く考えてたけど、
全部にそれを適用してしまうと、今度は短いコード貼りたいときに困るので、オプションで指定できるように変更してみる。

coolcode.phpのdo_CoolCode関数を

  1. function do_CoolCode($content, $txt, $options)
  2.     {
  3.         global $post;
  4.         $options = str_replace(array("\\\"", "\\\'"), array("\"", "\'"), $options);
  5.         if (preg_match('/lang="(\w*?)"/i', $options, $match)) {
  6.             $lang = $match[1];
  7.         }
  8.         else {
  9.             $lang = "";
  10.         }
  11.         if (preg_match('/linenum="(\w*?)"/i', $options, $match)) {
  12.             $linenum = $match[1];
  13.         }
  14.         else {
  15.             $linenum = "on";
  16.         }
  17.         if (preg_match('/download="(.*?)"/i', $options, $match)) {
  18.             $download = $match[1];
  19.         }
  20.         else {
  21.             $download = "";
  22.         }
  23.         if (preg_match('/scroll="(.*?)"/i', $options, $match)) {
  24.             $scroll = $match[1];
  25.         }
  26.         else {
  27.             $scroll = "";
  28.         }
  29.         $txt = str_replace("\\\"", "\"", $txt);
  30.         $txt = trim($txt);
  31.         $txt = str_replace("\r\n", "\n", $txt);
  32.         $txt = str_replace("\r", "\n", $txt);
  33.         $blockID = $this->getBlockID($content);
  34.         if ($download == "") {
  35.             $this->blocks[$blockID] = '';
  36.         }
  37.         else {
  38.             $this->blocks[$blockID] .= '<div class="hl-title">Download: <a href="'
  39.                 . get_settings('home')
  40.                 . '/wp-content/plugins/coolcode/coolcode.php?p=' . $post->ID
  41.                 . '&amp;download=' . htmlspecialchars($download)
  42.                 . '">' . htmlspecialchars($download) . '</a></div>';
  43.         }
  44.         if (strtolower($scroll) == 'on') {
  45.             $this->blocks[$blockID] .= '<div class="coolcode codeScroll">';
  46.         }else{
  47.             $this->blocks[$blockID] .= '<div class="coolcode">';
  48.         }
  49.  
  50.         $hackphp = false;
  51.  
  52.         if (strtolower($lang) == 'php') {
  53.             if (strpos($txt, '<' . '?') === false) {
  54.                 $txt = '<' . "?php\n" . $txt . "\n?" . '>';
  55.                 $hackphp = true;
  56.             }
  57.         }
  58.  
  59.         if ((strtolower($linenum) == 'on') or (strtolower($linenum) == 'open')) {
  60.             if(!in_array(strtolower($lang), $this->acceptable_lang)) {
  61.                 $this->blocks[$blockID] .= '<div class="hl-surround"><ol class="hl-main ln-show" '
  62.                     . 'title="Double click to hide line number." '
  63.                     . 'ondblclick = "linenumber(this)"><li class="hl-firstline">'
  64.                     . str_replace("\n", "</li>\n<li>", htmlspecialchars($txt))
  65.                     . '</li></ol></div>';
  66.                 $this->blocks[$blockID] = str_replace("<li></li>", "<li>&nbsp;</li>", $this->blocks[$blockID]);
  67.                 $this->blocks[$blockID] = str_replace('<li> ', '<li>&nbsp;', $this->blocks[$blockID]);
  68.             }
  69.             else
  70.             {
  71.                 $options = array(
  72.                     'numbers' => HL_NUMBERS_LI,
  73.                 );
  74.                 $hl =& Text_Highlighter::factory($lang, $options);
  75.                 $this->blocks[$blockID] .= '<div class="hl-surround">' . str_replace($this->hl_class, $this->hl_style, $hl->highlight($txt)) . '</div>';
  76.                 $this->blocks[$blockID] = preg_replace('/<span style=\"[^\"]*?\"><\/span>/', '', $this->blocks[$blockID]);
  77.                 $this->blocks[$blockID] = str_replace('<ol class="hl-main">',
  78.                     '<ol class="hl-main ln-show" title="Double click to hide line number." ondblclick = "linenumber(this)">',
  79.                     $this->blocks[$blockID]);
  80.                 $this->blocks[$blockID] = str_replace("\"> </span></li>", "\">&nbsp;</span></li>", $this->blocks[$blockID]);
  81.                 $this->blocks[$blockID] = preg_replace('/<li><span style=(.*?)> </si', '<li><span style=\\1>&nbsp;<', $this->blocks[$blockID]);
  82.  
  83.                 if ($hackphp) {
  84.                     $this->blocks[$blockID] = str_replace("<span style=\"color: Blue;\">&lt;?php</span></li>\n<li>", '', $this->blocks[$blockID]);
  85.                     $this->blocks[$blockID] = str_replace('<li><span style="color: Blue;">?&gt;</span></li>', '', $this->blocks[$blockID]);
  86.                 }
  87.             }
  88.         }
  89.         else {
  90.             if(!in_array(strtolower($lang), $this->acceptable_lang)) {
  91.                 $this->blocks[$blockID] .= '<div class="hl-surround"><div class="hl-main">'
  92.                     . str_replace("\n", "<br />", htmlspecialchars($txt))
  93.                     . '</div></div>';
  94.             }
  95.             else
  96.             {
  97.                 $hl =& Text_Highlighter::factory($lang);
  98.                 $this->blocks[$blockID] .= '<div class="hl-surround">' . str_replace("\n", "<br />", str_replace("</pre>", "", str_replace("<pre>", "", str_replace($this->hl_class, $this->hl_style, $hl->highlight($txt))))) . '</div>';
  99.                 
  100.                 if ($hackphp) {
  101.                     $this->blocks[$blockID] = str_replace('<span style="color: Blue;">&lt;?php</span><span style="color: Gray;"><br /></span>', '', $this->blocks[$blockID]);
  102.                     $this->blocks[$blockID] = str_replace('<br /></span><span style="color: Blue;">?&gt;</span>', '</span>', $this->blocks[$blockID]);
  103.                 }
  104.             }
  105.             $this->blocks[$blockID] = str_replace('<br /> ', '<br />&nbsp;', $this->blocks[$blockID]);
  106.         }
  107.  
  108.         // correct the indent
  109.         $this->blocks[$blockID] = str_replace("  ", '&nbsp; ', $this->blocks[$blockID]);
  110.         $this->blocks[$blockID] = str_replace("  ", ' &nbsp;', $this->blocks[$blockID]);
  111.          $this->blocks[$blockID] .= '</div>';
  112.  
  113.         return $blockID;
  114.     }

このように変更。※赤字が追加した箇所
これで、scroll=”" というオプションを認識して、囲むDIVを書き分けるようになった。

あとはcoolcode.cssに、

  1. .coolcode {
  2.     border: 1px solid #666666;
  3.     margin-bottom: 10px;
  4. }
  5. .codeScroll {
  6.     height:400px;
  7. }
  8. /* for IE */
  9. .codeScroll {
  10.   overflow: auto;
  11.   _overflow: scroll;
  12.   padding-bottom: expression(this.scrollWidth > this.offsetWidth ? 15 : 0);
  13. }
  14.  
  15. .codeScroll ol {
  16.   overflow: visible;
  17. }

と追記(部分的に、WP-syntaxのcssから拝借)
これで、<coolcode scroll=”on”>とすると、スクロールバーが表示されるようになる。

やっつけだけどひとまずこんな感じで。

一応ソース
coolcode-34-c01.zip
※cssとかコード変換の文字色とかも、このサイト用に若干いじっちゃってます。