へぼいいいわけ このページをアンテナに追加 RSSフィード Twitter

2013年02月10日

うんかーJSでdatファイルを表示できるようになりました

ここに書いておかないと誰も存在に気が付かないような機能をうんかーJSに実装しました。


datファイルのドラッグ表示

ブラウザでうんかーJS*1を表示して、その上にdatをドロップするとそのdatを読み込んで表示できるようになりました。

ドロップしたdatはサーバなどにアップロードせずにローカルで全部処理しています。

現時点で最新のfirefoxchromeでは読み込めることを確認しています。IE9IE6では無理でした。

html5のFileAPIとかいうものを使っているのですが、それそのものではドロップされたファイルがdatであるか分からないので、ファイル名がdatファイルっぽいことを確認してから読み込んでいます。具体的には今のところ「/^\d{9,10}\.dat$/」なファイル名をdatファイルとみなしています。

うんかーJSでは元から生のdatを解析して描画していたので、簡単に表示できるようになりました。もっと前からやっておけばよかったかも。

ちなみに、datをドロップするとURLが割り当てられますが、一時的なものになるので、ブラウザを更新すると無効になります。

どーでもいい情報ですが、chromeでは平均的なdatファイルを一気に10000ファイル*2ほどドロップすると6000ファイルくらいは快調に読み込めるのですが、その後は猛烈に重くなるためやめておいたほうが良いです。どうも1つのタブで使用するメモリが1GBに近づくとメモリ使用量が激しく変動するので多分GCが動いているんだろうと思います。ウェブアプリを作る際はメモリを1GB使わないようにしたほうが安全かもしれません。


URLのドロップ

URLのドロップにも対応しました。2chっぽいリンクをうんかーJSにドロップするとうんかーJSで読み込みます。複数のタブでうんかーJSを開いてしまった時に、うんかーJSのタブをドロップしてスレッドを移動させられるので便利かもしれません。

ちょっと前まではハッシュでページの移動記録を管理していたので、うんかー同士ならイベントを仕込まないでも勝手にリンクのドロップでページを移すことができていたのですが、このごろハッシュを使用しないようにしたので、わざわざ別途に実装しました。


忘れそうなのでメモ

html5のFileAPIでdatファイルを読み込んでいるのですが、そのエンコーディングの指定をしっかりしないとブラウザごとで差が出るみたいなので書いておきます。

var reader = new FileReader();

// 読み込み完了イベント登録
reader.onload = function(ev){
	// 完了
};
// IANA名じゃないと読み込んでくれない。firefoxとか
reader.readAsText(file, 'Shift_JIS');

datファイルは普通「Shift_JIS*3」なので、FileReaderのreadAsTextにエンコーディングの指定を行う必要があるんですが、ここを「sjis」とか適当に指定するとfirefoxでは読み込みが行われないみたいです。実はfirefoxではエンコーディングの指定しないでも文字化けせずに読めるので、firefoxだけを対象とするなら指定は要らないのですが、そうするとchrome文字化けしてしまいます。

上のコードに書いてありますが、firefoxでもchromeでも読めるようにするには「sjis」の正式名称である「Shift_JIS」を指定する必要があるみたいです。


最近のうんかー

すべてのスレッドタイトルに「unkar@板名」を入れるようにしたら、うんかーをまるごとコピーして生成しているウェブサイトのタイトルにも全部unkarという文字が入るようになったみたいです。そういう自動生成ツールでページを量産するのならせめてコピー元のサイト名くらいは削るようにした方がいいと思います。

というか色々とややこしいので削って下さい。

*1:うんかーを開いてヘッダーの「うんかーJSモード」をクリック

*2嫌儲タイムスタンプ1350000000〜1350999999のうんかーに保存されていた10904ファイル(250MB程度)

*3:細かいことを言うとCP932

スパム対策のためのダミーです。もし見えても何も入力しないでください
ゲスト


画像認証

トラックバック - http://d.hatena.ne.jp/heiwaboke/20130210/1360491063
リンク元