2008年12月アーカイブ

2008年12月31日
| コメント(0) | トラックバック(0) jqueryFileTree.plを作ってみた

PHPやRubyのソースを見ながら、試行錯誤で作ってみた。
Perlということでplにしたけど、実際にはMENTAディレクトリ内での実行のため、拡張子はcgiに変更した。


久しぶりにモジュールを使わずに一から作ったらなかなか大変だった。
古いソースを引っ張り出して基本的な変換(アンエスケープ)をしたり、ファイルやディレクトリの一覧を得るのに、readdirを使ったり。
調べないと全然覚えてない。

しかし、セキュリティ的に微妙な気がする…。
とりあえず、「.」から始まるファイルやディレクトリは見せないようにはした。


さりげなく使っているけど、最近覚えたData::Dumperの技。

use Data::Dumper;sub p { print Data::Dumper::Dumper(shift) }

こうすることで、デバッグするときは

p(\@args);

というふうに簡単に出力することができる。
便利だね。

MENTAを触りはじめた時に、テンプレート内で後置型のifがちゃんと使えたのだが、少なくとも「static_file_path」と同時に使うことで、不具合が発生するようです。

ローカルでMENTAのインデックスにスタイルシートを適用しようとしたところ、タイトルがおかしくなっていました。
スタイルシートへのパスが入ってしまうようになりました。

今のところ原因はわかりませんが、普通にifブロックを使う、ということで回避はできるので大きな問題はありません。


で、コードにも書いていますが、MENTAのインデックスにjQueryを使ってファイルとディレクトリをツリー表示するライブラリである「jQueryFileTree」を使ってみました。
いずれ、ここからソースコードを見ることが出来るようにしようと思っています。

このライブラリはjQueryから(デフォルトでは)PHPを利用してファイルとディレクトリを取得して、その結果をjQueryで表示するものです。

参考
jQueryを使ってファイルツリーを表示できる『jQuery File Tree』 | IDEA*IDEA
jQuery File Tree
jQuery File Tree Demo

オフィシャルでは「jQuery Easing Plugin」というのが必要ということになっているので入れていますが、読み込んでなくても動いているようではあります。

Dependencies jQuery File Tree requires jQuery 1.2 or above. For easing effects, you will need the jQuery Easing Plugin or another jQuery easing plugin of your choice.


ローカルにPHPが入ってなかったので、それを入れるのがなかなか面倒でした。
Perlで書かれたファイルがあればそれを使ったのに…、と思いながら。
また、ローカルのテスト環境では微妙なエラーメッセージが出ているので、それもどうにかしたい…、と思いながら。
Perlで書いてみようかなぁ。

PHP Notice: Undefined variable: root in *****/jqueryFileTree.php on line 21

MENTAを追いかけ始めてからPerlだけじゃなく、Web開発に関して色々と資料を読んでいる。
資料といっても、はてなブックマークの注目エントリーや人気エントリーを中心にあれこれと読んでいるだけだが。
その中で、JavaScriptのライブラリとして最近ホットなのがjQueryだ。

それはそれとして、先ほどのエントリー参照した先のソースを見てみると、preタグにもcodeタグにも「prettyprint」が書いてなかった。
不思議に思ってソースを見てみると、prettyfy.jsを読んだ後に別のスクリプトを読んでいて、その中でどうやらクラス名を操作して、その後にprettyPrint()している事がわかった。

それと同じ事をjQueryでやってみよう、と思ってやってみた。

書いた場所は、テンプレートのフッター。
先ほどのスクリプトを読み込んだ後にjQueryを読み込んで、さらにその後にクラス名を変更するコードを書いた。
このブログでは、コードはpreの後にcodeで括っているので、その条件にあったタグにクラス名を設定することにした。
そのあたりのコードは「続き」で。

Perlのソースをブログに書くために色々と調べてみた。

参考

あなたのソースコードを彩る、Syntax Highlighterまとめ - Blog.37to.net

で、今の状況で導入が比較的簡単そうな「google-code-prettify」を試してみることにした。

A Javascript module and CSS file that allows syntax highlighting of source code snippets in an html page.

README(Javascript code prettifier)のsetupをいい加減に訳すと、

  1. ファイル一式をダウンロードします。
  2. 適用するドキュメントに、スタイルシートとJavaScriptをインクルードします。linkタグやscriptタグで指定します。
  3. bodyタグのonloadに"prettyPrint()"を書きます。
  4. スタイルシートをお好みで変更します。

という感じです。

MovableTypeに適用する場合、色々と面倒なので、テンプレートのヘッダーのスタイルシートを読み込んでいるあたりに、新しいスタイルシートを直接読み込みました。
で、スクリプトのほうは、テンプレートのフッターのbodyの閉じタグの前で読み込み、その後prettyPrint()をそのまま実行することにしました。

あとは、実際のコードを書いた部分のpreタグかcodeタグのclassを「prettyprint」に指定すれば、その部分をハイライトしてくれるようです。

とあるスクリプトを改造して使っているのですが、それをソース表示してみます。

遅々として進みませんが。

JSONを使って読み書きをすることにしたのですが。
そもそも、アプリケーションの設定をどう呼ぶか、とか、テンプレートからJSON等のモジュールをどうやって使うか、とかいう根本的なところで悪戦苦闘してました。

menta.cgiには、「あなたのアプリの設定」とされている部分があるのですが、それをどのようにして呼ぶのかをソースを見ながら試してみました。
どのように呼ぶのを想定しているのかは不明ですが、とりあえずの解決策としては、

? my $self = MENTA->config->{application}

として、$selfに入れてから使うようにしました。
設定を以下のようにした場合、

    # あなたのアプリの設定
    application => {
        limit => 30,
        member_filename => 'member.cgi',
    },

それぞれ以下のようにして使えます。

$self->{limit}           # 30
$self->{member_filename} # member.cgi


で、JSON等のモジュールをどうやって使うかですが。
とりあえず安直に考えて、

? use JSON

としてから、関数形式で使うことにしました。

しかし、ここで一つ罠がありました。

JSONで使おうとした関数は「to_json」と「from_json」なのですが、単純に書いてしまうと、それぞれ、「to.pl」と「from.pl」というプラグインを探しにいってしまうのです。
まあ、関数をそのまま呼び出せないのであれば、パッケージ名をつけてやればよい、ということで、それぞれ「JSON::to_json」と「JSON::from_json」というように呼び出して解決できました。

解決したので、それはそれでよかったのですが、なんとなくプラグイン化してみました。
関数名を「json_to」と「json_from」という名前にして、「json.pl」を呼び出すようにしました。
プラグインというには微妙ですが、とりあえず機能的には問題ないということで。

はてなスターは、ずっと不思議に思っていた機能なのだが、ブックマークにスターをもらったので調べてみた。

日々ブログを読んでいていいなと思っても、コメントを書いたりトラックバックを送るのは敷居が高く、気持ちが十分に書き手に伝わらずに終わってしまうことも多いでしょう。はてなスターは既存のブログにワンクリックで☆がつけられます。あなたのいいなと思った気持ちを☆に変えて、世界のブログに☆をつけよう!

全然不思議な機能ではなかった。

私自身はこういうものをクリックするのに何故か抵抗があったのですが。
でも、自分がもらってみると嬉しいものですね。

まあ、ちょっと共感したので、さらに調べてみるとMTのプラグインに「はてなスター」を使えるようになるものがあったので導入してみました。
さて、うまくいくかな。

参考:
MTHatenaStar作った - Kickstart my heart

ほんの少し進んだ。

「入口」では、今現在滞在中のメンバーを出力するわけですが、そのデータはファイルに保存しておく必要があります。
ファイルの読み書きは標準のプラグイン「file.pl」にあるので、それを使ってデータをやり取りすれば良さそうです。
さっくりとソースを見ると、ファイルの中身は一度に読み書きしているようです。

MENTAではextlibにJSONが入っているので、そいつを使う事にします。
JSONを使うとオブジェクトを文字列に変換できるので、データを保存するのが非常に簡単になります。
昔は色々と考えながらデータを書いていましたが、そんな作業からも開放されました。
今までは割と標準モジュールしか使えないという縛りがありましたが、今後はそれもなくなりますね。

ま、とりあえず簡単にサンプルを書いてみました。

Perlといえば、何はなくともCPANです。
で、そのCPANには沢山のモジュールがあります。

で、そのモジュールはおおよそ決まった様式にのっとって記述されています。
そのあたりのフレームワークがPerlには用意されています。

まあ、受け売りですが。

参考:
はじめてのPerlモジュール開発メモ/楽
Part1 正しいPerl/CGIの書き方:ITpro


で、この記事にしたがって、正しい作成手順でモジュールを作ってみようということで試してみました。
…が、結果的には微妙なことになってしまいました。


Module::StarterとModule::Starter::PBPのインストール、そして、Module::Starter::PBPのセットアップまでは無事終了しました。
いざ、モジュールの作成です。
サンプルどおりモジュール名だけを入力してみると「authorが必須ですよ」というエラーが出た。

C:\nqou>module-starter --module=My::First
Must specify an author
 at C:/strawberry/perl/site/lib/Module/Starter/App.pm line 97

Module::Starter::PBPのセットアップをするとホームディレクトリに「config」というファイルができて、起動時にそれを読み込んでくれるはずなのだが。

まあ、仕方なく、authorとemailを指定して実行した。
ファイルやディレクトリができたようなので中身を確認すると、なんだか数が足りない。
…Build.PLが無いですよ。

現在入っているPerlはActivePerlではないですが、念のため「Clone」をインストールしようとしましたが、すでに入っていました。

うーむ。


Module::Starterのバージョンが1.50でしたので、記事の当時(1.42とか1.47とか)からバージョンがあがっているのが原因なのかもしれません。


試してみたかったのに、残念。

一応は宣言どおり手をつけました。
最初の画面だけですが…。

インデックス - menta.nqou.net

サンプルを見ながらの手探りですが、少しは作り方がわかりました。
ソースコードを見れば、作り方も自ずとわかるのでしょうが…。

今のところ拡張子は「.mt」の物しか使っていません。
このファイルはテンプレート扱いになるようです。


今回のポイントは主に3つ。

ひとつめ。
テンプレート内では、「?」から始まった行は、Perlのコードとして解釈するようです。

header.mt line 1.

? my $title = shift


ふたつめ。
テンプレート内では、「?=」から始まった行は、Perlのコードとして解釈したあと、結果を埋め込むようです。

index.mt line 1.

?= render('header.mt', 'インデックス')


みっつめ。
行の一部で変数やコードを使うには、埋め込みが不要な場合は「<?」と「?>」、必要な場合は「<?=」と「?>」とで囲うようです。
また、これらは囲われた部分毎に、改行を含むような扱いになるようです。

header.mt line 6.

<title><? if ($title) { ?><?= "$title - " ?><? } ?>menta.nqou.net</title>

この上の文のコード部分は、すなわち、

if ($title) {
print "$title - "
}

のように解釈できるということです。

また、if文は後ろに置くことでブレースを省略できるので、

header.mt line 9.

<h1><?= "$title - " if $title ?>menta.nqou.net</h1>

このように書いても問題なく実行されました。


アップロードの仕方ですが、基本はオフィシャルのディレクトリ構造に書いてあるファイルをアップすればよいようです。
tディレクトリをアップするかどうかは微妙です。
私はアップしていませんが、ちゃんと動いています。

最終的にmentaというディレクトリを作って、その中の構成を、

  • .htaccess
  • menta.cgi
  • app/
  • extlib/
  • lib/
  • plugins/

という感じにしました。

(20090321追記:0.12は古いので、最新版を使いましょう。その理由

zipファイルは、lang_perl_MENTA_tags_release-0.12-r26594.zipになっていました。

最近、オフィシャルにアクセスしても繋がらない事が多いです。
で、珍しく繋がったと思ったら、今度はファイルをダウンロードするのにうまく繋がりません。
何度もアクセスして悪いなぁ、と思ったらようやくダウンロード完了。

誰かのために置いておきます。

lang_perl_MENTA_tags_release-0.12-r26594.zip

しかし、このMENTAですが、容量のほとんどがextlibに入っているモジュール群です。
全体が3,098,390バイトに対して、extlibの中身は2,920,326バイト。

まあ、そうやってMENTAの中ばかり見てないで、さっさと作っていきましょう。
また明日にでも…。

ゴールデンロア以来、久々に面白いゲームを見つけて、今現在はまってます。

様々なクラスにクラスチェンジできるユニットを6人までのパーティにまとめ、 さらにそのパーティを同時に最大8パーティ、ひたすらダンジョンに潜らせて、 キャラ育成・アイテム収集を行うゲームです。 ダンジョンではパーティは自動で探索を行い、敵に出会うと自動で戦闘を行います。

プレイヤーは最初のキャラクターでもありますが、実際にはキャラクターに指示を出すブルジョアみたいな感じです。
もっとも、最初はまったくお金を持っていない状態からのスタートですが。

この手のタイプのゲームだと、クラスチェンジできるレベルで、きっちりとクランスチェンジしたいので、ついつい頑張ってあーでもないこーでもない、と試行錯誤するのですが、その試行錯誤がとても楽しいです。

WindowsでPerlというと、ActivePerlしか知らなかったのですが、今日、もう一つのPerlを知りました。
それが、StrawberryPerlです。
「perl -V」した結果は続きのほうに書いておきます。

「Win32 Perl Wiki」によれば、Cコンパイラも一緒についているので、CPANが余裕で使えるとのこと。
それを知った瞬間に乗換確定でした。

If you are already experienced with Perl on Unix and it's just Windows you aren't comfortable with, then you are almost certainly going to want to use Strawberry Perl which is the closest thing you will find to Perl on Unix, and is being used on a daily basis by a number of major CPAN authors and Perl personalities when they need to work on Windows. Strawberry Perl also installs a C compiler and make (software build tools), so you can download and build all 10,000 of the latest and greatest modules from the CPAN

勝手にpathが通ってしまうので、コマンドラインからcpanすれば、すぐに使えます。
スタートメニューにも「CPAN Client」ができるので、そちらからも使えます。
あれだけ苦労したのは何なのかと思うほどですが、好きな場所にインストールできないのは少し残念です。
今まではスクリプトの1行目は「#!/usr/bin/perl」でよかったのですが、「#!perl」に変更する必要がありました。
まあ、それでもCPANが普通に使えるというのは、変えがたい魅力です。


…と書いたところで、ふと思いついて「AN HTTPD」のPerlへのパスをショートネームで入れなおしてみたところ、この問題も無事解決できました。

C:\strawb~1\perl\bin\perl.exe

「#!の行を調べる」のチェックは、忘れずにはずしておきましょう。

これで、心置きなく乗換ができますね。

zipファイルは、lang_perl_MENTA_tags_release-0.09-r25814.zipになっていました。

マニュアルとデモとが分かれています。
マニュアルのほうには、実際のサーバーで使うためのアップロード方法だけでなく、ディレクトリ構造も紹介されています。
デモのほうは、(個人的に必須な)Session管理のデモもありました。


そろそろ何か作りたくなってきました。

今見るととても恥ずかしいですが、Perlを覚えたての頃に作った、HTMLの出力にこだわったチャットがあります。
今となっては、スタイルシートでレイアウトするのは当たり前ですが、この当時はスタイルシートもブラウザの実装が中途半端で使う人も少なかったんじゃないかと思います。

まあ、そんな遺物をMENTAを使って書き直してみようかなと、ふと思いました。
使い道があるのかと訊かれれば、まずないでしょうが。
そんな昔に書いたソースコードを、恥ずかしげもなく「続き」に書いてみました。
perltidyで味付けはしましたが。
コメントが痛々しいですが、当時はこういうテーマも面白いなという思い付きだったので大目に見ましょう。

Google検索

Last.fm

このアーカイブについて

このページには、2008年12月に書かれたブログ記事が新しい順に公開されています。

前のアーカイブは2008年11月です。

次のアーカイブは2009年1月です。

最近のコンテンツはインデックスページで見られます。過去に書かれたものはアーカイブのページで見られます。

Creative Commons License
このブログのライセンスは クリエイティブ・コモンズライセンス.
Powered by Movable Type