注：一部修正しました
　2008/03/14 追記しました＋デモページを設置しました
　注：adiary Ver.2.0以降から adiary 自体に記法入力支援機能が付きました。今後はそちらを使用した方が無難です。

　発端は、ひとぅ氏のadiaryが損をしている点 - ひとぅブログというエントリの中に

編集画面で文字の装飾ができない

　という一文を見かけたのがきっかけです。実は、以前から自分用に編集画面を改造していて、記法入力をなるべく簡単にできるようにしていたのですが、どこにも今まで公開していませんでした。

　前述のエントリに対して、adiary の開発者であるなべ氏がadiaryの改善点を考える - adiary開発日誌にて

Ver2区切りで改善していきます（もともと大幅改変のためのVer2）。

　とあったので、こういう記法入力支援もサポートされるかな？ とも思いましたが、なんとなく公開することにしました。これを早い者勝ちの法則と言います。テストに出ますよ（ぇ

　

　これが実際の動作画面のイメージです。よく使うであろう記法にのみ現在は対応しています。ボタンを押すと記法が挿入されます。文字選択した状態でボタンを押すとその前後に記法が挿入されます。
　追記：デモページを設置しました。adiary_control_text Demo

　では、実際の設置方法を説明します。

　ctrltext.zip

　上記ファイルをダウンロードして解凍したら、adiary 設置ディレクトリに転送して下さい。他のファイルとの混同を避けるために今回は adiary 設置ディレクトリの下に「ctrltext」というディレクトリに全て転送したとします。

/adiary/

　という設置ディレクトリだったら

/adiary/ctrltext/

　以下に転送する、ということです。

　続いて adiary のテンプレートを修正します。テンプレートは「diary.user.skel」ディレクトリのものが「diary.skel」ディレクトリより優先されます。「diary.skel」ディレクトリ内のテンプレートファイルを弄ると、元に戻したいときに面倒なので必ず「diary.skel」から「diary.user.skel」へテンプレートファイルをコピーしてから弄るとよいでしょう。では、実際に弄るファイルですが、

　_frame.html

<script type="text/javascript" src="<@Basepath><@v.theme_dir>adiary.js"></script>

　の下に

<@ifexec(v.system_mode, begin)>
<script src="<@Basepath>ctrltext/prototype.js"></script>
<script src="<@Basepath>ctrltext/control.textarea.js"></script>
<script src="<@Basepath>ctrltext/control.textarea.markdown.js"></script>
<link type="text/css" rel="stylesheet" media="all" href="<@Basepath>ctrltext/control.textarea.css">
<$end>

　と追記します。標準テンプレートからかなり弄っているので追記元が間違っていたらすみませんすみません（汗
　追記：システムモードの場合にのみ JavaScript を読み込むように修正しました。

　続いて

　diary_edit.html

<div><textarea name="body_txt" id="editarea" cols="74" rows="16" wrap="soft" class="diary-edit"><@tag_escape_amp(d._text)></textarea></div>

　の下に

<script>
	markdown_toolbar = new Control.TextArea.ToolBar.Markdown('editarea');
	markdown_toolbar.toolbar.container.id = 'markdown_toolbar';
</script>

　と追記します。

　以上で設置は完了です。たぶん。


　とりあえずよく使うであろう記法のみ対応しています。そのうち増やすかも知れません。あと、色の指定などに関しては adiary 側の色記法対応待ちでしょうか*1。はてな記法でも色の指定は span タグを使っているので、どうしたもんかと思っているのですが。

　近いうちにまた修正すると思います。とりあえず、公開しますた。

　追記１：重要
　nonoya 氏から「LightBOX Plus を導入したら動かなくなった」との報告を受けましたので、暫定的な対処方法を。

　とりあえず考えられる理由ですが、LightBOX Plus が古いバージョンの prototype.js から関数をひっぱってきているのが原因ではないかと考えています*2。

　なので、LightBOX をシステムモード（編集画面など）で使うことは無いだろう、adiry_control_text を閲覧モード（一般訪問ユーザーが見る画面）で使うことはないだろう、と割り切ってしまえば、それぞれを切り分ければ同居が可能です。

<@ifexec(v.system_mode, begin)>
<script src="設置ディレクトリ/prototype.js"></script>
<script src="設置ディレクトリ/control.textarea.js"></script>
<script src="設置ディレクトリ/control.textarea.markdown.js"></script>
<link type="text/css" rel="stylesheet" media="all" href="設置ディレクトリ/control.textarea.css">
<$end>

<@ifexec(!v.system_mode, begin)>
<link rel="stylesheet" href="設置ディレクトリ/lightbox.css" type="text/css" />
<script type="text/javascript" src="設置ディレクトリ/spica.js"></script>
<script type="text/javascript" src="設置ディレクトリ/lightbox_plus.js"></script>
<$end>

　のように記述すれば、切り分けが可能になります。LightBOX に限らず、prototype.js から関数を切り貼りして使っている JavaScript はたくさんあるので、同じように対処していただければと思います。prototype.js 使わずに一から書き直そうか検討中だけれども正直めんどくさい。

　http://twitter.com/rob_art/statuses/767516652

ROBART：もーね、実際金八やってる最中リアルタイムで学生だったわけで。冷めた眼でしか見れん

　http://twitter.com/worstman/statuses/767518156

最低人間：@rob_art 金八がリアルタイムでなかった世代って逆に少ない気がする・・・。シリーズ長いし。

　http://twitter.com/rob_art/statuses/767518372

ROBART：@worstman ぽつんぽつんて穴はあるのでは？？何年かに一回だよね？

　http://twitter.com/worstman/statuses/767522853

最低人間：@rob_art 一回の放送で三学年はカバーできるけど、どうなんだろう。このへん調べれば、金八リアルタイム率としてブログネタになりそうだ。

　http://twitter.com/rob_art/statuses/767525836

ROBART：@worstman ぜひ、まとめてくだしあ！

　という一連の流れがあったのでまとめてみました。「放送開始」にリアルタイムで中学生だった人から始めて、現在放送中の第八シリーズ時までをまとめています。厳密に言えば「中学三年生」だけの人をまとめるべきかも知れないけどね。とりあえずわかりにくいけどこんな感じ。

第一シリーズ	1979年10月	1965年生まれ
第二シリーズ	1980年10月	1966年生まれ
		1967年生まれ
		1968年生まれ
ブランク		1969年生まれ
		1970年生まれ
		1971年生まれ
		1972年生まれ
		1973年生まれ
第三シリーズ	1988年10月	1974年生まれ
		1975年生まれ
		1976年生まれ
ブランク		1977年生まれ
		1978年生まれ
		1979年生まれ
		1980年生まれ
第四シリーズ	1995年10月	1981年生まれ
		1982年生まれ
		1983年生まれ
ブランク		1984年生まれ
第五シリーズ	1999年10月	1985年生まれ
		1986年生まれ
		1987年生まれ
第六シリーズ	2001年10月	1988年生まれ
		1989年生まれ
		1990年生まれ
第七シリーズ	2004年10月	1991年生まれ
		1992年生まれ
		1993年生まれ
第八シリーズ	2007年10月	1994年生まれ

　面白いのは最近になるほどブランクが短いという事実。んで、肝心の集計結果は1965年生まれから1994年生まれまでの30年にわたってリアルタイムに見ていた年代は

　20/30 = 約66パーセント

　という比率になりました。結構頻繁に放送しているのでもっと多いかと思っていたのでちょっと意外です。

　これがわかったからって何の役にも立ちませんが、そういうことです、はい（投げた

　Twitter で最低人間から Follow されるにはどうすればいいか書くよ！

　おいらは他の人に Follow されてもすぐに Follow しかえすわけじゃないんだ、ごめんね。世の中にはそういう Follow の仕方をしている人もいるよね。でもそういうのは別のアカウント（worstgirl）でやってるから、最低人間のアカウント（worstman）では、自分なりに決めたルールに従って Follow してるんだ。だから逆を言えば、以下に書くことをやらなければ最低人間から Follow されるのを極力回避できるってことでもあるんだよ！


１、@ 発言で最低人間の発言にツッコミを入れる

　みんな知ってると思うけど、Twitter では

@worstman ばーかばーか

　みたいに書くと、相手の Replies ページにそれが表示されるんだ。おいらは Twitter の設定を「Show me all @ replies」にしてるから、Follow していない人からの @ 付き発言でも表示される。的確なツッコミをしてくれた人はもれなく Follow しちゃうね！　そんなツッコミセンスのある人を Follow しないなんてもったいないじゃない、ね？　みんなも @ 発言は気楽にやるべきだと思うよ！


２、最低人間の発言を Favorites に追加する

　ono_matope って人が作ってるふぁぼったーってサービスがあるんだけど、このサービスを利用するとこんな感じに誰から Favorites に追加されたかわかるんだ。Favorites に追加してくれたってことはおいらのセンスと合致するって事だから Follow しちゃうよ！　もちろん、このサービスから君のアカウントが Favorites に追加しているものを調査しにきてくれないと表示されないんだけどね。きっとたくさんのクローラが動いているから大丈夫だよ！　きっとね！　10000人くらいの Favorites は調べてるんじゃないかな！　思いこみだけどね！


３、発言の中に「最低人間」って入れる

　おいらは自意識過剰だから、自分のハンドルネームが呼ばれると気になって Follow しちゃうんだ。Twitter検索を使えば、こんな感じに誰が「最低人間」って発言したかわかるんだ。例えおいらのことを指しているわけじゃなくても「最低人間」って発言すると Follow しちゃうよ！


４、発言の中に「WinMX」って入れる

　おいらはこれでも WinMX Peer Network の住人なんだ。だから Twitter 上に WinMX Peer Network の住人を見つけたら喜んで Follow しちゃうよ！　確認してる方法はさっきと同じだよ！


５、発言の中に「Winny」って入れる

　ごめん、これは嘘。おいらは WinMX Peer Network の住人であって Winny の住人ではありません。正直すまんかった。


　とりあえず 10 まで行きそうにないのでここらでやめますが、発端は「始めたばかりの人がどんな人を追加していけばいいかわからない」という話があったので、ネタにしてみました。

　Follow されたら Follow しかえす、というのが基本的なパターンなのですが、それは受動的な Follow の仕方です。受動的にがんがん追加して Timeline がカオスになっていくのも Twitter の楽しみではありますが、自分好みの Follower だけを集めるのも Twitter の楽しみだと思います。この辺、ゲームみたいな感覚ですね。自分好みに Timeline を育てていく。その為には能動的な Follow の仕方が必要になってきます。そこで能動的な Follow の仕方は無いものかと考えて自分が Follow するときの基準を書き出してみました。

　あといくつか考えられるだけ書いてみます。今度は自分目線でお読み下さい。


６、既に Follow している人に @ 発言で突っ込んでいる人を Follow する

　当たり前ですが Follow している人は何らかの形で自分とフィーリングが合うと思われるので、その人が @ 発言で突っ込んでいる人は大抵自分ともフィーリングが合うはずです。その人の Profile ページまで飛んで、確認してみるのもいいかと。


７、buzztter - find similar users を使う

　buzzter には buzztter - find similar users という「自分と似た発言をした人を探す」という機能があります。こんな感じに探してみるのもいいでしょう。


８、Your Twitter Karma を使う

　せっかく Follow してくれた人がいるので、その人達の中から探しましょう。Your Twitter Karma を使えば「自分を Follow しているがこちらからは Follow していない人」がわかります（Only Followers）。さらに最終更新時間順に並び替えてくれるので、更新頻度の高い人、低い人、自分の好みで選びましょう。
　前述までの方法だとどうしても自分の Timeline が偏りがちになるので、新しい境地を開くためにも、こういう作業は必要です。


９、どうしようやっぱり１０まで思い付かない

　というわけでおわりです（ぉぃ

　なんか「ぶっこ抜く」って使うとネトラン厨とかナウなヤングにバカウケってそそのかされたので使ってみました。


　それはさておき、先日の歌詞本文 URL の件、どうやって解析したの？というご質問が何人かから寄せられたので具体的な方法を書いておこうかと。解析ってレベルじゃないので期待されても困ります。


　材料：

　Yahoo!ミュージック　歌詞
　今回は KARSRAC でも使っているYahoo!ミュージックを使ってみましょう。

　HugFlash
　Flash を解析して中身を取り出すソフト。最近では FLV から AVI にしたりということに多く使われているようですね。

　Firebug
　HTML 解析用です。なくてもいいです。ソース読めればいいです。


　さて、材料の中からこの曲を選択。とりあえずトップにあったのでクリックしただけで他意は無いです。

http://music.yahoo.co.jp/shop/p/53/265862/Y060337

　さっそく HTML ソースを見てみます。当然のように Flash は以下のように記述されています。

<object id="lyrics" width="500" height="400" align="middle" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000">
<param value="sameDomain" name="allowScriptAccess"/>
<param value="http://music.yimg.jp/lyrics/lyrics.swf?id=Y060337&aid=265862" name="movie"/>
<param value="high" name="quality"/>
<param value="#ffffff" name="bgcolor"/>
<embed width="500" height="400" align="middle" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" allowscriptaccess="sameDomain" name="lyrics" bgcolor="#ffffff" quality="high" src="http://music.yimg.jp/lyrics/lyrics.swf?id=Y060337&aid=265862"/>
</object>

　これを見ると、Flash ファイルはソース元として

http://music.yimg.jp/lyrics/lyrics.swf?id=Y060337&aid=265862

　を呼んでいることが分かります。ここまではブラウザ上でソース開けば誰にでもわかることなので説明するまでもないですね。

　しかし

http://music.yimg.jp/lyrics/lyrics.swf?id=Y060337&aid=265862

　も Flash ファイルが表示されて実際の歌詞本文までは到達していません。そこで

http://music.yimg.jp/lyrics/lyrics.swf

　をダウンロードしてローカルに保存します。ここで Hugflash 登場。自動解析してもらいます。


　HugFlash は窓の杜などでも「画像・音声・動画が自動的に抽出されるソフト」として扱われていますが（いや実際そうなんだけど）、おいらがこのソフトを使う主目的は「ActionScript の解析」機能です。

　さきほどの swf ファイルを HugFlash に食わせると、「lyrics.txt」というログファイルが出力されます。そのログファイルの一部がこちら。

no.= 000, name: _root
no.= 001, name: cTA
no.= 002, name: html
no.= 003, name: label
no.= 004, name: selectable
no.= 005, name: borderStyle
no.= 006, name: none
no.= 007, name: editable
no.= 008, name: tabChildren
no.= 009, name: u
no.= 010, name: http://music.yimg.jp/bin/sendlyricstext?ArtistId=
no.= 011, name: aid
no.= 012, name: &Id=
no.= 013, name: id
no.= 014, name: LYRCS
no.= 015, name: _root.cTA

　Flash が外部からデータを読み込んでいる以上、そのデータの元となるアドレスやファイル名がほぼ間違いなく隠されています。要はそれを根気よく探し出してやればいいというだけ簡単なお仕事です。

　先ほどの URL

http://music.yimg.jp/lyrics/lyrics.swf?id=Y060337&aid=265862

　と

no.= 010, name: http://music.yimg.jp/bin/sendlyricstext?ArtistId=
no.= 011, name: aid
no.= 012, name: &Id=
no.= 013, name: id

　を見比べてみましょう。「aid」は「ArtistId」に、「id」は「Id」に内部で変換されていることが予想できます。

　その結果

http://music.yimg.jp/bin/sendlyricstext?ArtistId=265862&Id=Y060337

　という歌詞本文の URL を検出することが出来る、というわけです。


　解析というレベルではありませんね。こうやって披露するのがちょっと恥ずかしいくらいのレベルです。

　でも要望があったので恥を晒してみました。

　よろしければご活用下さい。

　KASRAC を作るときにいくつかの歌詞検索サイトを巡って、どこから歌詞を抽出するか考えていたときの成果をそのままメモしておきます。たぶん既出だと思うけど。Flash で呼び出しているサイトがほとんどだったので、その Flash から呼んでいる URL を勝手に調べてみました。


　うたまっぷ 歌詞を無料で検索表示

http://www.utamap.com/showtop.php?surl=A02669

　って歌詞の URL に対して

http://www.utamap.com/phpflash/flashfalsephp.php?unum=A02669

　と呼び出してやればいい。最後のパラメータだけ合わせればいいので簡単。ここを使おうかと最初は思ったけどランキングとかないのでやめた。


　歌詞検索サービス歌詞GET

　ここは少々面倒くさい。

http://lyric.kget.jp/lyric/jr/gj/

　という歌詞の URL に対して、実際に呼んでいる歌詞本文 URL は

http://lyric.kget.jp/iframe/sendlyric.aspx?sn=c81c6b58e3ca60cbdc0c41b6a0d626e5/45723

　というハッシュの様なもので生成されてる。歌詞の URL 内にパラメータが書かれているので、それを抽出するという手間がある。


　UtaTen うたてん

http://utaten.com/lyric/lyric.php?LID=jb10801525&UCSID=849081af0772916f3127717fc781189b

　という歌詞 URL に対して

　http://utaten.com/lyric/load_text.php?LID=jb10801525

　と呼び出します。LID を合わせればいいのですが、ここは「ふりがな」データも同時に返ってくるので論外でした。


　　Yahoo!ミュージック - 歌詞

　KASRAC の歌詞はここから抽出してます。

　http://music.yahoo.co.jp/shop/p/53/418345/Y059688

　という歌詞 URL に対して

　http://music.yimg.jp/bin/sendlyricstext?Id=Y059688

　と呼び出します。実は ArtistId っていうパラメータもあるんですが、あってもなくても返してくれるので安心。ランキングもあったので KASRAC はここから抽出することにしました。


　まとめ　とか言いながらたった４個ですが、４個目で望むものに出会ったんだから仕方ない。というより、他の歌詞検索サイトは単なる JavaScript 抑制だったり、POST で投げないとデータを返してくれなかったりしたので、メジャーどころだけでいいかなと思った。


　よければ何かにご活用下さい。