nDiki : DiKicker

Facebook コメントボックスをつけた

最近 Facebook のコメントボックスをつけているサイトを見かけることが多くなった。Facebook にログインしている状態だと自分のアイコンがそこに表示されているので、いつもちょっとビックリする。

ということでビックリ用にここにも設置してみた。以下手順。

1. XBML コードの取得

• https://developers.facebook.com/docs/reference/plugins/comments

で Get Code を押すと XFBML コードの書かれたダイアログが表示されるのでこれをコピー。

2. アカウント認証する (まだならば)

次に同ダイアログの registering your site というリンクを選択する。

初めてなのでアカウント認証を求められる携帯電話のメールアドレスかクレジットカード番号が必要のようだ。ここではNTTドコモのメールアドレスを指定した。ケータイにメールが届いたら確認用のコードを入力して認証完了。

3. アプリ ID の取得

registering your site というリンク先の Create an App ページで[サイト名]と[サイトURL]を入力してアプリ ID を取得する。

4. XFBML コードを記事に埋め込む

先に取得した XFBML コード中の APP_ID をこの アプリ ID で書き換える。

それから fb:comments の中の xid をコメント対象毎にユニークになるようにする。 ここでは記事の permalink の URL エンコードしたものが自動的に入るようにした。

あと、コメントボックスの上部に「いいね!」ボタンが付くのだけれど、そのままだと「いいね!」した時のリンク先が閲覧しているページになる(ので1ページに複数記事が表示される場合によろしくない)。ここは記事の permalink にしたいので、fb:comments に url 属性を追加し、値として permalink の URL が自動的に入るようにする。

表示は日本語にしたいので en_US を ja_JP に書き換え。

こんな感じ。

 <div id="fb-root"></div><script src="http://connect.facebook.net/ja_JP/all.js#appId=アプリID&amp;xfbml=1"></script><fb:comments xid="$permalink_encoded" numposts="10" width="500" publish_feed="true" url="$permalink"></fb:comments>

これでコメントボックスが各記事に表示されるようになった。

5. 今まで使っていた Like Button を削除

既に設置済みの「いいね!」ボタンは重複するので削除。

自前でコメント機能を用意する必要のない手軽さ

この nDiki は DiKicker という自作のシステムで運用している。コメント関連の実装は面倒なのでスルーしてきたんだけれど、認証も含めてそこらへん Facebook 側で全部やってくれるのでお手軽にコメント機能を追加できることになった。

Facebook ユーザとしてコメントすることになるため spam も少ないと思われ、その点で運用コストも少なくてすむのではと思われる。

また「Facebookプロフィールにコメントを投稿する」がチェックされているとその友達にも口コミとして流れるのもサイトによっては嬉しいはずだ。

いいね!

CVS リポジトリを Git リポジトリに cvs2git で移す

しばらく放置していたこの nDiki のコード(DiKicker)に手を入れようと思うのだけれど、CVS で管理し続けるのもなぁと思い、これを機会に Git に移行させることにした。移行は cvs2git で。ローカルで自分だけでバージョン管理していたものだし、ブランチも切ってなくてタグを売ってあるだけなので一番ちょろいケースか。

Debian GNU/Linux sid 上に cvs2svn Debian パッケージをインストール。以下の手順でコンバートした。

オプションファイルを作る

Git リポジトリ上できちんとユーザ名とメールアドレスが入るようにしたいため、オプションファイルを使うようにする。

 zcat /usr/share/doc/cvs2svn/examples/cvs2git-example.options.gz > cvs2git.options

で雛型をコピーして以下を書き換え。

• ctx.username = 'cvs2svn' のところを naney に。
• author_transforms に 'naney' : ('WATANABE Yoshimasa', 'naney@naney.org'), を追加
• run_options.set_project で CVS リポジトリのパスを r'/home/naney/path/to/cvsroot', のように指定。

git fast-import 用のファイルを生成

以下のコマンドで。

 cvs2git --options=cvs2git.options

Git リポジトリを作成しインポート

 mkdir <プロジェクト名>
 cd <プロジェクト名>
 git init
 cat ../cvs2svn-tmp/git-blob.dat ../cvs2svn-tmp/git-dump.dat | git fast-import

で QGit や git log などで、どのようにインポートされたかを確認。trunk のラインから、タグ毎に分岐したコミットができてそこに CVSROOT/ 以下が差分として入っているという形になっているのが特徴的。CVSROOT/ は特にいらないので、数が多くないし手でタグ打ち直すかなあという感じ。

git fast-import したままだと作業ツリーが空なので git checkout して master を checkout するなりすれば、後は普通に Git 上でバージョン管理をしていくことができる。

あっさり移行できたので一安心。

Bootstrap 3 に移行して Web 日記を延命

この Web 日記(nDiki)がスマートフォンで見にくいのがずっと気になっていたので、さくっと Bootstrap 3 に移行した。CSS を Bootstrap 3.0.2 のものに変えて、navbar を使うようにコードをちょっと変更程度の軽い対応。

もともと tDiary テーマ CSS 用の HTML 構造を生成していたんだけれど、そのあたりが問題で崩れることはなく Bootstrap の CSS を当てることができた。もともと Wiki 記法で書いたソースドキュメントを HTML に変換しているので、変な構造の HTML は吐かないようになっていたというのもサクっといけた点かな。

細かいところういうと画像の回り込みに対応させなければならなかったり、テーブルなど適宜 Bootstrap のクラスを指定した方がいいところがあるけれど、まあ追い追いで。

あとそもそも iPhone や Android などのスマートフォンで見にくかったのは CSS の問題というよりは、viewport の指定がなかったからだった。Bootstrap に差し替えただけではやはりスマートフォンでは見にくくて、Bootstrap の Getting started の通り、

 <meta name="viewport" content="width=device-width, initial-scale=1.0">

と書いたら文字サイズなど見易くなった。

2004年2月22日にハイパー日記システム(hns)から自作の DiKicker に移行してからもうすぐで10年。そういえば2004年2月22日は奇しくも mixi がプレオープンした日だっとはなあ。何かの縁か。

いよいよ WiKicker から WikiEngine のコードを抜いて DiKicker のみにする

2002年10月19日から開発を始めてしばらく公開・運用をしていた WikiEngine だけれど最近は WikiEngine そのものは使っていなくて、今はそのコードをベースに作った日記システム の DiKicker 部分しか使っていない。DiKicker の方は自分自身で今後も使っていくんだけれど、さすがにいろいろ古いのでそろそろ大改修しようかなと。基盤部分的には

• Perl 5.005_03 、Perl 5.6 系との互換処理を捨てる。
• 文字列処理をバイナリ文字列ベースから(いわゆる UTF8 フラグ界隈的な)テキスト文字列ベースにする。
• CGI.pm ベースから PSGI ベースへ移行する。
• 中間管理用のストレージを Berkeley DB から SQLite にする。

などをして今後も使っていけるようにしたい。既に使っていないアプリケーションとしての WikiEngine 部分は移行させていく手間をかける必要はないと思うので、コードを削除していくことにした。WikiForum 立てるなら既にいろいろ他の選択肢があるしね。

CVS での管理もやめて Git 管理に変更。最後の公開 tarball を展開して git init して最初のコミットとし、その後に変更した作業ディレクトリを Git 側の作業ツリーに上乗せしていったんコミット。あらためて最後の公開コードの上に差分を積んでいくつもり。

howm + Markdown + Plack

Emacs の howm 上で書いたノートなどをさくっと共有したい時に、わざわざ Wiki 上や IRC 上や Google ドライブ上に転記したり更新したりするのが面倒なので、そのまま見られるようにしたいなと。

この間 howm で書く時のフォーマットを Markdown にしたので、howm-directory をそのまま Plack::App::Directory::Markdown で見られるように設定してみた。

• https://metacpan.org/pod/Plack::App::Directory::Markdown

howm で Markdown を使う設定

完全じゃないけれど今のところこんな感じ。

 (setq howm-file-name-format "%Y/%m/%Y-%m-%d-%H%M%S.md")

 (setq howm-view-title-header "#")
 (setq howm-view-title-regexp (format "^\\(%s|=\\)\\( +\\(.*\\)\\|\\)$"
                                     (regexp-quote howm-view-title-header)))
 (setq howm-view-title-regexp-pos 3)
 (setq howm-view-title-regexp-grep (format "^(%s|=) +"
                                      (regexp-quote howm-view-title-header)))

非公開用 howm-directory と公開用 howm-directory は

• http://howm.sourceforge.jp/cgi-bin/hiki/hiki.cgi?SwitchMemoDirectory

の通り下記のように設定。

 (defun my-howm-set-directory (dir &optional keyfile)
   `(lambda ()
      (interactive)
      ;; kill current keyword buffer first to avoid the error
      ;; "howm-get-buffer-for-file: Buffer name ` *howm-keys:*' is in use"
      (kill-buffer (howm-keyword-buffer))
      (setq howm-directory ,dir)
      (when ,keyfile
        (setq howm-keyword-file ,keyfile))
      (setq howm-menu-next-expiry-time (current-time))
      (message "%s" ,dir)))

 (defun my-howm-switch-directory (dir &optional keyfile)
   (funcall (my-howm-set-directory dir keyfile))
   (howm-menu))

 (global-set-key "\C-c,1" (my-howm-set-directory "~/var/howm/" "~/.howm1-keys"))
 (global-set-key "\C-c,2" (my-howm-set-directory "~/srv/howm/" "~/.howm2-keys"))

Plack::App::Directory::Markdown

cpanm でインストール。簡単に起動するなら付属の pad-markdown.pl で。

 #!/bin/sh
 PAD_MARKDOWN=$HOME/local/perl5/perlbrew/perls/perl-5.18.2/bin/pad-markdown.pl
 ROOT=$HOME/srv/howm
 PORT=9119

 $PAD_MARKDOWN --root=$ROOT --encoding=utf8 --title='howm' --port=$PORT &

これで後は C-c,2 C-c,c で howm ノートを作って保存すれば http://HOST_NAME:9119/2014/03/2014-03-17-231015.md ですぐ見られるようになる。あるいは ~/srv/howm/ 以下に適当に .md ファイルを作ってもよい。適当に楽ちん。

欲を言うと検索できるようにしたりページ間リンクを簡単に張れるようにしたりとかしたいなあと思うのだけれど、そのまま進むと(フォーマットこそ違えど)この nDiki の DiKicker と同じ機能になってくるので、今はそこまでしなくてもいいかな。その時に他人にシェアしたいのはピンポイントで1ページだけがほとんどだし、自分自身は howm 上で検索できるし。

こう考えてみると「Emacs でプレーンテキスト」で「書いて保存すれば(あるいはそしてリモートに同期すれば) 明示的な変換作業しないで勝手に公開」されて、書く場所は「年月別ディレクトリ」とか「デイリーなノートとは別のページが作れる」とか「検索も grep レベルできる」とか、まあ結局自分が欲しいものは昔から変わらないなあ。

nDiki を HTTPS に対応させる

昨日ラピッドSSLを申し込んで TLS 1.0 接続できるようになったので、ここからはコンテンツ側の対応です。

URL 処理を修正する

nDiki (DiKicker) はかなり昔に作ったので CGI.pm を使っています。CGI.pm の url メソッドで絶対 URL を取得して permalink の生成などをしています。ここでさくらのレンタルサーバでは HTTPS 用の Apache はプロキシとしてとして動いていることもあり https://www.naney.org/diki でアクセスすると CGI.pm の url メソッドが https://naney.org:80/diki を返してしまうようになってしまいました。

ここはいったん設定ファイルでスクリプトの URL を明示的に設定できるようにして対応しました。

内部リンクを修正する

http スキームで書かれた内部リンクは順次 https に修正します。結構な量があるのでおいおいという感じです。画像などのリソースを http で指定しているところは優先して対応した方が良いですね。

外部からのリンクを修正する

外部サイトのプロフィールなどで htts スキームで書いたリンクなども順次修正です。こちらもおいおいという感じで。

ようやく日記システム DiKicker のメンテナンス開始

この日記(nDiki)で使っている自作日記システム DiKicker、開発し始めたのが2003年12月末なのでもう13年物だったりします。ここ最近大きなメンテナンスはしていなかったのですが、まだこの先10年以上使えるように手を入れることにしました。一昨日から着手。

やりたいこと

• もともと WiKicker (WikiEngine) からの派生で作ったのでが WiKiEngine の方は使わなくなったので、不要なコードを削除したい。共通部分をスーパークラス化してあるけれどもここもまとめたい。
• WikiName の特別扱いをやめたい。
• Perl 5.005_03 でも動くように Perl 5.8.0 未満かどうかで処理を変えているけれども、もう 5.005_03 用のコードは消したい。
• データを Berkeley DB にトリッキーな形で入れているので SQLite あたりに変えて簡単にしたい。
• 最終的には Go で書き換えたりして。

nDiki ソースファイルの拡張子を txt に

この nDiki の記事ファイルはテキストファイルなのですが、ファイル名の拡張子を dkd/dkk にしていたのでテキストアプリでファイル一覧にでなかったり Dropbox や Google ドライブでプレビューできなかったりするなど不便でした。

なのでこの機会に nDiki (の日記システムである DiKicker)の仕様を変えて拡張子 txt でもよいように修正しました。あわせて1万以上ある記事ファイル名を修正。これで他のノート・日記系ファイルと同じように Dropbox 以下に移動 & Google ドライブに同期するようになりました。

パーソナルナレッジベースとしてのテキストファイル集約がこれでほぼ完了。

Ulysses でノート・日記が一括検索できるようになって個人的にかなり便利になりました。テキストファイル最高。

WikiName の特別扱いをついに停止

この日記の日記システム(DiKicker)は WikiEngine からの派生で作られた生い立ちをもっていて、現時点でも WikiName を特別扱いし自動的にそのキーワードへのリンクになるようになっていました。今日はコードを修正してその特別扱いをやめることにしました。

実装ですがまず WikiName を先に抽出し、そのあとに他のキーワードを AutomaticLink するようになっていました。このため例えば MacBook Pro という文字列はまず MacBook という WikiName として抽出されてしまうため MacBook Pro という文字列で自動的にリンクさせることができていませんでした(それだと困るので明示的に BracketName で書いていました)。

WikiName は WikiWiki というコンセプト的に良いものでしたが AutomaticLink を実装している日記システムではもう不要な表現です。

ようやく重い腰を上げて今回のコード修正となりました(いじったのは数行なのですけれども)。

nNote 始めました

永続的に残しておくほどではないちょっとしたノートを置いておくスペースとして nNote を始めることにしました。

• https://www.naney.org/note

nDiki と同じく自作の DiKicker を使用しています。

Medium であったり note であったりその他の Blog サービスであったりと「何か」を書いて公開しておけるサービスを触ってみるたびに「この nDiki とは別に書くとしたら何だろう? 何を書きたいんだろう?」と考えを巡らせていました。

この nDiki は長く続けてきた中で

• 永続的に残すことを前提にきちんとした URL (記事 ID) にする。
• 誤読されないように、ある程度自分なりに推敲する。
• AutomaticLink のために正確な用語で書く。
• フィードが拾われて消費されることを前提に、きちんと書けてから公開する。

といった縛りが自分の中にできてきているので、もっと自由なスペースが自分は欲しいのではと思えてきました。

• 必要が無くなったら 404 を恐れずさくっと消して良い。
• まだ自分としてこうだという結論に至っていない考えだったり何かの断片だったりを書いて良い。
• 最初から用語の正確性を追わなくて良い。
• 頻繁に更新して良い。

そういったノートを書き留めておく場所が欲しいんだなと。

そのためのサービス・プラットフォームで何がいいかと考えると、やはりテキストファイルでさっと新規作成・再編集をしてサーバに同期して公開・更新できるものがいいなぁという結論に至って、結局欲しいと思って自作して使っているこれ (DiKicker) じゃないですかと。日付有りノート中心になってしまいますが、まあいいかなと。

ということでさくっと設定だけ増やして nNote を立てるに至りました。