textarea で動く劣化コピー xml-mode

まだまだバグがあるんだけど、ぶっちゃけ微妙に飽きてきたので公開 (してモチベーションあげる作戦)。Firefox でしか確認してない。IE では絶対動かないだろう。Opera でもたぶん動かないだろう。問題なのは setSelectionRange, selectionStart。綺麗にクロスブラウザ化するスクリプトをどっかで見たけどまぁいいや。

keydown/keyup は shift とかを単体で押しても反応しやがるので困った。keypress はイベント発生時点で、まだ textarea.value に文字が入力されないのが困った。かなりキモイ方法で解決したけど、スマートなのは keypress 単体を使って、文字入力をキャンセルする方法かなぁ。できなかったけど。

キャレット位置がおかしいバグがなおせたらそこそこ実用になるかな。

dump() しまくってるので Fx のコンソール表示させてると楽しいですよ。なにがだよ?

TAB 以外の文字でのインデントは一切考えていません。必要性を感じませんから。

  • 属性に / を書こうとすると空要素タグ補完されてうざい。文字列の中にいるか外にいるか調べられればいいんだけどうまくいかない。タグの中の "[^"]*" をスキャンするとかなんとか。
  • たまに補完後のキャレットの位置がおかしい。原因・再現性不明
  • CDATA を見事に無視してインデントする。そんなに難しくないと思うけど、面倒くさいと思う。大して使わないのでどうでもいいちゃどうでもいい。
  • <empty-tag /></close-tag> みたいなときインデント崩れる。原因は空要素タグを最初から無視しているせいなんだけど、これ修正するのはめんどい。
  • 一通り実装終わり。CDATA のインデント無視も動いてるっぽい。俺的に汚いソースを書くとインデントが崩れる素晴らしい仕様に(わらい
    1. トップ
    2. script
    3. xml-mode in textarea
    1. トップ
    2. js
    3. xml-mode in textarea
    1. トップ
    2. web
    3. xml-mode in textarea

    というか二年次にあがれるんだろうか、とか思いつつ。あれ本当に微妙に危険な香り。2-3個落としそうだよなぁ。いくつ落としたらだめなんだっけなぁ。えーっと専門26単位必修で、20単位取得できないと二年次になれない。っていうかやばくね。やばくね。いまさら感が激しいけどやばくね。どうしよ。どうしよう? よく考えると教養科目を今年度とってないな。やばいな素で。まぁ仕方ないよなぁ。はぁ。

    まぁどうにかなるよなぁ。なってほしい。なれよ。とにかく、二年次で情報システム関係にいくか情報デザイン関係にいくか微妙に迷ってたんだけど、情報デザインのほうがよさげなのでとりあえず決定。グループワークが多いらしいのが不安だけど、結局そのうちやることになるから仕方ないか、と、いう、か、殆ど学校で口開かないのは危険なんじゃと思い始めた。挨拶ぐらいしかせんな。

    最近現実に対してリアルに諦めはじめて、リアリティにとんだ夢の世界のほうがリアルにいいんじゃないかと思いはじめた。結局いま見ている風景とか、街で歩きタバコしている宇宙人とか、どこに伝えたいことがあるのかわからない音楽とか、そういうのもとかも、無意識のうちに自分が望んで見ているものなわけで、この世界のこの地域の言語でいうならまさしく幻想というか、限りなく中核に近いところで繰り広げられるパッチワークに対して面白さを抱けないみたいな。でもこんな考えもそのパッチワークに含まれた布切れの一部で、実際にはまったく中核に近づいていない可能性もあったりするのだけれど、これまたどうしてもこの考えが間違っているとは思えない。そういう世界、で片付いてしまうのはつまらないけど、現実的だと思う。無意識が無限大に近いような世界フレームを繋ぎ合わせて、脳に刻み込んでいくだけ。「脳」も「無意識」も象徴的でしかない。象徴というか比喩か。どっちでもいいんだ。結局今この世界の中で、この世界について正確に記述することは絶対に不可能だから。この世界は「脳」で考えている、ということになっているだけ。本当は「他人」すら存在しない。つまんないなぁ。無限再帰ループ。alert() はマジでうざいからはやく対処法ください。

    1. トップ
    2. life
    3. 二年次専攻コース洗濯
    1. トップ
    2. school
    3. 二年次専攻コース洗濯

    textarea で動く劣化コピー xml-mode の入力まわりを整理して分離してみた。C-x i とかいうツーストローク以上のキーバインドも可能に。ただ、やっぱり文字入力をキャンセルさせる方法がわからないため、入力された文字をあとから削除する方法になってる。チラつく。

    これである程度自由にキーバインドが変えられるようになった。

    function xmlText_initialize() {
    var xml = new xmlText(document.getElementById("xmltext"));
    var kb = new keyBinding(document.getElementById("xmltext"), {
    "C-x i" : function () { xml.indentLine() },
    "TAB"   : function () { xml.indentLine() },
    "C-q"   : function () { xml.indentBuffer() },
    "C-."   : function () { xml.wellClose() },
    "/"     : function () { xml.slash() },
    "="     : function () { xml.equal() },
    "RET"   : function () { xml.newLineAndIndent() }
    });
    }
    window.addEventListener("load", xmlText_initialize, true);
    

    劣化コピー xml-mode と一緒に使うとき、キャレット位置が若干混乱するのが微妙。なんで混乱するのかよくわからないのだけれど。

    textarea のスクロール位置をセットしなおす方法が分からん。使えないって!

    event.preventDefault() を使えばキャンセルできるみたいだ。書き換えよう。

    あー、しかもブラウザのキーバインド横取りできる。

    スクロール問題解決?

    Ctrl+記号を入力すると文字が誤認される。

    1. トップ
    2. script
    3. キーバインドの実装
    1. トップ
    2. javascript
    3. キーバインドの実装
    1. トップ
    2. web
    3. キーバインドの実装

    textarea で動く劣化コピー xml-mode 続き。

    TAB 入力時動的補完リストを表示させてみる。たいして意味がない気がする。xyzzy の dabbrev に相当。

    デフォルトの内容で j[TAB] とすると ja, javascript, js が候補にあがる。Down/Up で選択してもう一度 TAB を押すと補完される。

    「動的」なので、適当に vfsgergfherkgr とか入力したあと、vfs[TAB] とかやれば補完される。

    似非 xml-mode じゃホント意味ないなぁ。っていうかほんとはタグの予測補完をやろうと思ったんだけどめんどくてやめたんです。動的補完のが簡単だけどソレなりの面白さはあるかなと。

    関係ないところでは C-x h を入力したときキーバインド一覧をだすようにしてみた。微妙。

    直前に動的補完できそうな文字がない場合は、親要素に合わせて開始タグ候補をリストするようにしてみた。

    xml.complementList = {
    "head" : ['<meta name="" content=""/>', '<link rel="" href=""/>'],
    "body" : ['<div class="section"', "<p>", "<address>"],
    "div"  : ['<div class="section"', "<p>"],
    "p"    : ['<abbr title', "<span class"],
    "ul"   : ["<li>"],
    "ol"   : ["<li>"],
    "dl"   : ["<dt>", "<dd>"]
    "pre"  : ["<![CDATA["]
    };
    1. トップ
    2. script
    3. 動的補完 in textarea
    1. トップ
    2. javascript
    3. 動的補完 in textarea

    2005-10-20 を最後に更新されてないらしいです。たぶん DNS エントリ消したせいなので復活させて 301 投げなおします。いままで 301 返してたつもりだったんだけどなぁ。今 eNom がメンテ中でなにもできん。

    DNS 更新 / ドメイン設定 / リダイレクト設定 が終わった。Bloglines 巡回待ち。

    1時間以上たったけど更新されないな。ちゃんとリダイレクトされているんだけど。Bloglines の挙動をまとめたページとかないのかなぁ。わけわからんよ。

    1. トップ
    2. net
    3. Bloglines can't find my feed

    制限つきながら、IE でも動くように。閉じタグ補完とかだけ。

    Ajax による Full IME のコードをパクっています。

    keypress 時のコードがうまくかければもうちょい使えるだろうけど、いかんせん IE はデバッグしにくいのでやる気起きない。Opera も。

    1. トップ
    2. script
    3. 似非 xml-mode in textarea
    1. トップ
    2. web
    3. 似非 xml-mode in textarea
    1. トップ
    2. javascript
    3. 似非 xml-mode in textarea

    IE がモノとして存在していたら、とりあえず床に叩きつけ、五階建てマンションのベランダから踏み切りにほうりなげ、電車によりつぶされる様なストーリーを連想したりするんだけど、きっと IE がモノとして存在するとすれば、東京タワーあるいはもっとよくわからんデカイものなのだろうから、叩きつけることも、五階建てマンションのベランダから放り投げることもできないし、ましてや踏み切りにいきなり東京タワーなんて現れた日には事故どころじゃないよサイコキネシスだ、とここまで書いてちょっと切なくなってきた。つまるところ今なんでこのトップページだけが IE でズレて表示されるのか全くわからなくてむかついていたわけです。CSS のどこ書き換えてもなおらねぇ。a { border: 1px solid red } とかやるとなおるけどな!!

    というか、なんでトップページだけなんだよと。意味わかんねぇよと。IE なんて死んでしまえばいいんだ。ほんとうに。でも俺と IE どっちのほうが価値があるかっていったら明らかに IE さんなわけで、あぁ、これはきっと僻みなんだな。俺ってばバカなやつ、あはは。とかなんとか。

    自動筆記で日記書くのって頭悪いなぁ。なぁ。

    そんなわけで、もう知らない。知らないったら知らないよ!!!!

    1. トップ
    2. ie
    3. Fucking IE
    1. トップ
    2. fuck
    3. Fucking IE
    1. トップ
    2. web
    3. Fucking IE

    なんか Bloglines が title を sanitize しない気が。。。

    title に &lt;textarea&gt; って書いたやつ (すなわちタグじゃなく実態参照) からバグって表示される。なんですか。いぢめ食らってますか僕。

    script じゃダメっぽいな。textarea だけか。

    で、いつリダイレクトのほうの URL に書き換わるんだろう。

    1. トップ
    2. script
    3. Bloglines sanitize <script>alert("unco");</script>
    1. トップ
    2. web
    3. Bloglines sanitize <script>alert("unco");</script>

    似非 xyzzy

    テキストエリアの管理部分と、モード用機能を分離してみた。似非ミニバッファ搭載!

    新しくモード用のオブジェクト (関数) をつくればいい感じに。まぁあんまり綺麗な実装じゃないんだけど……

    似非ミニバッファは M-x でフォーカス移動。入力した内容を eval した結果を挿入。M-x new Date() RET とかやれば Sat Nov 05 2005 06:57:29 GMT+0900 みたいに挿入される。ただの eval なのでグローバルに見えてる関数じゃないと使いにくい。

    モードはテスト用に xmlc (中身は未実装)。M-x c RET とかやるとモード変更。これは特別に判定させてる。

    余談だけど M-x (new Date()).w3cdtf() RET とか眠い。

    再び Firefox 限定になりました。IE と Gecko とだと、イベント起きたときの e.which とか e.keyCode とかがバラバラなんだもん。IE は Ctrl+* で keypress が発生しないし。

    まぁ色分けできない textarea ではかなり微妙な感じになってきました。XML はインデントさえまともなら色ついてなくてもいい (逆にインデントがまともじゃないと色がついてても読めない) んだけどねぇ。

    リージョンをサポート。C-SPC でマーク。C-w (kill-region), M-w (copy-region-as-kill), C-y (yank), C-x n (narrow-to-region), C-x w (widen)

    1. トップ
    2. web
    3. *-mode in textarea
    1. トップ
    2. script
    3. *-mode in textarea
    1. トップ
    2. javascript
    3. *-mode in textarea

    電撃 hp 2005 OCTOBER VOLUME 38 「しにがみのバラッド。てのひらの銀河<前編> Cherish You (Side-A)」 76ページ にヘッドフォン娘がっていう話を友人から聞いて貸してもらった。絵のやつはアートモニターシリーズっぽいヘッドフォン。

    作中にデムパったヘッドフォンガールがでてくるんだけど、名前が黒崎クロエ。笑うって。笑うって。

    樋浦トイロってなんだっけっていう感じだったけど親父の話が出てきたところで思い出す。あぁ。あぁ。とかなんとか。

    臭いがするのは、メロディーフラッグ (BUMP OF CHICKEN)・MISS WORLD (ART-SCHOOL)・乾いた花 (ART-SCHOOL)・鋼鉄の朝 (BURGER NUDS) trick or treat (Good Dog Happy Men)

    なんか消化しきれてないんだなぁって思った。ばらばらというか、なんというか。思い込みの激しい登場人物が多いとかなんとか誰かが言ってました。

    ヘッドフォンの役割は理想的だった。役割なんて1つしかないけど。

    1. トップ
    2. book
    3. しにがみのバラッド。@電撃hp 38
    1. トップ
    2. text
    3. しにがみのバラッド。@電撃hp 38
    1. トップ
    2. music
    3. しにがみのバラッド。@電撃hp 38
    1. トップ
    2. headphone
    3. しにがみのバラッド。@電撃hp 38

    テレビでやってたのを見た。

    セーラー服!

    メガネの女の子が危険

    なんか短いよね。特に前半

    竹中直人が割りと好きなんだけど、こう、やっぱ竹中直人じゃないとダメだなって感じがしてよかった。あとドラムソロがカッコヨサス

    1. トップ
    2. tv
    3. スウィングガールズ
    1. トップ
    2. movie
    3. スウィングガールズ
    1. トップ
    2. music
    3. スウィングガールズ

    違いがわからんうえに、ちゃんとキーボードと対応してない。英語キーボードだとちゃんと対応してんのか?

    e.which, e.charCode, e.keyCode, String.fromCharCode(e.which) の順で、前者が keydown、後者が keypress。環境は Firefox 1.0.7

    ;
    61 0 61 = / 59 59 0 ;
    C-;
    61 0 61 = / 61 61 0 =
    C-+ (Ctrl+Shidt+;) テンキー側の C-+ は問題なし
    61 0 61 = / 61 61 0 =
    C-:
    59 0 59 ; / 59 59 0 ;
    C-| (Ctrl+Shift+\)
    220 0 220 テ・ / 発生しない
    C-a
    65 0 65 A / 97 97 0 a
    C-F1
    112 0 112 p / 0 0 112

    差が一定ってわけじゃないし、どうやってマッピングすればいいか見当がつかない。さらに IE だとイベントが発生するタイミングがまた全然違う。帰れ。

    Gecko_DOM_Reference:Examples#Example_7:_Displaying_Event_Object_Constants

    つまり、正確に処理するにはキーボード配置を自分で作らないとダメなわけか。入力された文字を取得したいのに、入力されたキーしか取得できない。Gecko の e.charCode って charCode じゃないだろ。

    それにしてもなんでセミコロンの位置でDOM_VK_EQUALSなんだろう。わからん。

    1. トップ
    2. javascript
    3. Event.which, Event.charCode, Event.keyCode
    1. トップ
    2. script
    3. Event.which, Event.charCode, Event.keyCode
    1. トップ
    2. dom
    3. Event.which, Event.charCode, Event.keyCode

    XML 宣言を省略したことにより、IE で描画モードが変わっていたせいみたいだ。唐突に思い出して omit-xml-declaration="no" にしたらなおった。でも CSS で解決する方法がないっぽいのはどうすればいいんだろ。標準モードで描画させないほうがいいんじゃないか。

    1. トップ
    2. css
    3. なぜホームページだけ表示が崩れていたか
    1. トップ
    2. web
    3. なぜホームページだけ表示が崩れていたか

    ちゃんとエラークラス吐くバージョンがリリース。kiyoya さんのパッチ。

    ruby extconf.rb --enable-error-handler して Makefile 作成。ちゃんと exslt もリンクさせるため、OBJS に /lib/libxml2.dll.a /lib/libexslt.dll.a /lib/libxslt.dll.a を追加。なんか知らんけど明示的に指定しないとリンクされなくて ld が怒る@cygwin (このバージョンに限らず)

    XML::XSLT::XSLTError と、そのサブクラス XML::XSLT::ParsingError, XML::XSLT::TransformationError が追加される。変換用 XML ファイルのエラーなのか、XSLT ファイルのエラーなのかはわからなく。そのかわりエラー発生のタイミングが変わった。serve 時ではなく、xml= のときに出るようになった。だから問題ない。

    エラーの message の意味がないっぽいので、--enable-error-handler 時には rb_raise 第2引数を STR2CSTR(rb_ary_to_s(rb_cvar_get(cXSLT, rb_intern("@@errors")))) とかにしたほうがいい感じ。--enable-error-handler は errors が定義されるのがキモイけど俺はそんなに気にならない。

    第二引数を変えるだけだと以下のコードがダメ。

    xslt = XML::XSLT.new()
    xslt2 = XML::XSLT.new()
    begin
    xslt.xml = File.read("examples/fuzface.xml")
    xslt.xsl = File.read("examples/fuzface.xsl")
    out = xslt.serve()
    print out;
    rescue XML::XSLT::XSLTError => e
    p XML::XSLT.class_eval("@@errors") #=> (1)
    p e.message #=> (2)
    end
    p XML::XSLT.class_eval("@@errors") #=> (3)
    begin
    xslt2.xml = File.read("examples/fuzface.xml")
    xslt2.xsl = File.read("examples/fuzface.xsl")
    out = xslt2.serve()
    print out;
    rescue XML::XSLT::XSLTError => e
    p e.message  #=> (4)
    end
    

    (3) で (2) のときと同じ (4) のとき前のエラーメッセージが紛れ込む。クラス変数使ってるからだろうけど、単純にインスタンス変数にしないのにはなんか理由があるんだろうからとりあえずそのままにして、

    void xslt_raise(VALUE cError) {
    #ifdef USE_ERROR_HANDLER
    VALUE errors = rb_cvar_get(cXSLT, rb_intern("@@errors"));
    VALUE error_str = rb_ary_to_s(errors);
    rb_ary_clear(errors);
    rb_raise(cError, STR2CSTR(error_str));
    return;
    #endif
    rb_raise(cError, "");
    }

    とか作って経由させ、リセットさせてみる。XML::XSLT.errors は常に空の配列が返るようになって無意味になる。

    ruby-xslt.0.9.1.error_message.patch

    スレッドの切り替えってどういうタイミングなんだろう。

    1. トップ
    2. xslt
    3. ruby-xslt 0.9.1
    1. トップ
    2. ruby
    3. ruby-xslt 0.9.1
    1. トップ
    2. xml
    3. ruby-xslt 0.9.1

    Visitors を XREA 上で使う。のりさんにコレいいよ、とか教えてもらったので以下略

    特に何も考えなくても make できる。

    XREA の生ログは最新5日分しか保存されないので、CRON でバックアップをとるようにする。んで、ついでに visitors 解析。

    #!/bin/sh
    cd log
    DOMAIN="lowreal.net no-real.net headphone.lowreal.net"
    #DOMAIN=`ls *[^0-9].log | sed s/\.log$//`
    for domain in $DOMAIN
    do
    echo $domain.log
    gzip $domain.log
    mv $domain.log.gz $domain.log.`date +%Y-%m-%d`.gz
    zcat $domain.log.`date +%Y-%m`-[0-9][0-9].gz > tmp # パイプると Resource temporarily unavailable ?
    ../visitors tmp -A -o html -f ../public_html/log/$domain.log.html --trails --prefix http://$domain
    done
    rm tmp
    

    上のようなのを FTP ログイン後のルートに visitors と一緒に突っ込んどく。んで、毎朝6時ぐらいに実行されるようにしとけばあとはてきとう。

    しかし XREA でコマンド実行しようとすると Resource temporarily unavailable になりまくる。いぢめ。

    1. トップ
    2. xrea
    3. visitors on xrea
    1. トップ
    2. log
    3. visitors on xrea

    はてなの入力欄で動く xml-modeそれのナロー化 css-mode

    バグバグだけどなんか今日はもうやる気しない。留年しそうなんだもん。一個単位数え間違えてた。これから軽く必死こいても、あがれる確立20%ぐらい。はぁーうまくいかない。

    • インデントしないエリアにバグ。閉じた直後の RET がおかしい。いままでずっと CDATA で囲ってたから気付かなかった。
    • css-mode の開き括弧直後の RET がおかしい。
    • 補完リストの位置がおかしい。offsetLeft がおかしいのか?
    • はてなのエリアだと右下の広げるやつを一回やっとかないと横に伸びる。はてなの JS とのコンフリクト

    物好きの方がいたらどうぞ。eta.user.js

    余計なことしなくていいよモード (謎) は M-x c RET

    1. トップ
    2. javascript
    3. GreaseMonkey スクリプトのデバッグが激しく面倒くさい
    1. トップ
    2. firefox
    3. GreaseMonkey スクリプトのデバッグが激しく面倒くさい
    1. トップ
    2. script
    3. GreaseMonkey スクリプトのデバッグが激しく面倒くさい
    1. トップ
    2. xml
    3. GreaseMonkey スクリプトのデバッグが激しく面倒くさい

    学校で暇つぶしにドキュメント眺めていたらメソッドが増えていたのでちょっといぢってみる。cygwin 版が微妙に古く、mingw 版はまともに動かないとか言ってたら kiyoya さん がビルドしてくれた。ありがたう。

    結論から言えば何もできなかった。blosxom 劣化クローンを作れないかなぁと思っていたんだけど、途中で完全にめんどうになってやめた。んで、もうちょい楽なのを考えていたら Tropy が浮かんだので作ってたんだけど、もうちょいってとこで強制終了連打されたので諦めた。Win32 だからかもしれないが。

    join の位置がおかしいのはどうにかならないんだろうか。List にあるべきメソッドだよなぁ。

    SequenceString の区別がかなりうざい。"literal" は immutable Sequence とか言われて、直接 "literal" replaceSeq("li", "il") とかやることができない。エラーがでる。Sequence clone appendSeq("literal") replaceSeq("li", "il") とかやる必要がある。しかしながら appendSeq にバグがあるっぽく強制終了をよく食らう。よくわからん。

    Tropio: Tropy クローン試行の残骸。動きません。動くかもしれないけど俺にはムリ。

    1. トップ
    2. script
    3. Io (iolanguage) いぢくる。
    1. トップ
    2. io
    3. Io (iolanguage) いぢくる。

    電撃 hp のインタビューの写真を見ているとどうしても胸が痛くなる (謎) んだけれど、例えばあの写真が、音楽と人の1ページであったり、あるいは Web Designing に1ページであったりしたら、こんな気持ちにはならないんだろうなぁ、と考えたところで、環境の重要さを再確認した。

    誰が悪いわけじゃなくて、その写っている人が悪いわけじゃなくて、しかも誰にもどうしようもないことであるから、アレなわけですよ。

    1. トップ
    2. thinking
    3. 環境光

    某サイトに entries_kache を導入したんだけど、改行コードが混ざっていてうまく動かない。wikieditish.cgi を使って Win から更新してるせい。めんどくせーなー、とか思いつつ、entries_kache 側で強制的に改行コードを統一させるようにして (if の条件いぢって強制再書き込みさせた) 一件落着……と思いきや動かなかったんだけどプラグインの実行順だった。

    wikieditish.cgi.unite_crlf.patch
    常に LF で保存するように。
    entries_kache.unite_crlf-keep_utime.patch
    LF になるように保険。デフォルトの wikieditish.cgi は \n と \r\n が混ざるので。上のやつ修正したあとじゃいらない。あとは、メタデータ書き込むときにファイルの時刻変えるのがうざいので設定しなおす。メタデータ読むんだから関係ないんだけど、精神衛生上よくない。
    alternate
    全然関係ないけど、代替フレーバーのリンク用プラグイン。<link rel="alternate" type="text/plain" title="Plain Text" href="/$alternate::path.text"/> とかやる。

    特定のディレクトリ以下を例外的にトップページとか、一覧に表示させないようにしたい。プラグインがあるだろうけど探すのがめんどい。かといって書こうと思っても Perl のツン具合に萎える。

    exclude Not Found

    excludez

    1. トップ
    2. blosxom
    3. entries_kache & wikieditish.cgi
    1. トップ
    2. web
    3. entries_kache & wikieditish.cgi
    1. トップ
    2. script
    3. entries_kache & wikieditish.cgi

    最近 Gecko -> IE と確認して終わったなぁって感じで Opera で見ると見事に崩れることが多い。やれやれ。Gecko 以外のレンダリングエンジンいらんよ(素

    でもなんか Gecko も border: none な状態だと margin だかなんだかが盛大にぶっとんだりする。なんなんだ。

    1. トップ
    2. css
    3. CSS Opera
    1. トップ
    2. web
    3. CSS Opera

    Flickr: Creative Commonsピアノの鍵盤の写真を見たのが昨日の夜。一時間ぐらいで他のやつとてきとーなことして年賀状作成。たぶん作り直すんだろうな、と思いつつ。

    今日の夕方になってそれ派生させた CSS を書き始める。どう考えてもリキッドにならなくて、いっそ固定レイアウトにしちまえよという悪魔のささやきに微妙な抵抗をしながら、適当に CSS 書いていると、ナイスな偶然に見舞われ一件落着。面倒くさかったけど……んで、さっきクロスブラウザ化を終える。テスト用のドキュメント作ってスクロールして眺める。ひたすら眺める。とりあえず眺める。そうやって眺めているとモニタに可愛い女の子が見えてくるがそれは幻想だから気をつけろ、と言い聞かせる。どうでもいいけどタオルが耳鼻科の臭い (ネブライザー) を放っている。なんだこのタヲルわっ。

    さっき気付いたんだけど、今のスタイルになってから一年ほどになるらしい。なんか無駄に長いこと適用してんなぁ。そして長いこと適用していると、別のスタイルを適用させるのが怖くなってくる。何が怖いって共通 CSS (base.css) に、そのスタイルに微妙に依存するルールとか書いちゃっているからなんだよね。頭悪いな。

    一旦ブラウザスタイルをリセットする CSS をかませようと思ったんだけど、読み込むファイルが増えるのでやめた。base.css に書いちゃうと別のスタイルがおかしくなるし……

    そんなこんなで map 要素は Opera で inline である罠にひっかかったりした。map なんて使ってる人少ないから気にしないんだよな。

    1. トップ
    2. css
    3. カススタスタタ、タラスタタ
    1. トップ
    2. web
    3. カススタスタタ、タラスタタ

    "\n\n".replace(/$/, "!") //=> "\n\n!"
    "\n\n".replace(/$/m, "!") //=> "!\n\n"
    "\n\n".replace(/$/mg, "!") //=> "!\n!\n!"
    

    問答無用で \n の前にマッチすると思ってた。m つけなければ \Z っぽく使えるのね。

    1. トップ
    2. script
    3. ECMAScript RegExp $

    ふと気がつくと一昨日やったことなんて微塵も覚えていないのだけれど、こうやって日記を書いていると一応「何か」をやっていたことはわかる。不思議なことだ。

    tDiary を使って日記をつけはじめたのが 2003-08-20 らしい。それより前も PHP で書かれたクソスクリプトを用いて書いていた。手元には一切データが残っていないので、Web Archive で調べてみると 2003-02-04 から独り言とかいう名前で書いていた。クソみたいな HTML ソースだなぁ。でも2年前の日記はクソみたいな HTML より吐き気を催す危険物。どうでもいいけど NULL::something っていう名前は 2003-02 - 2003-04 の間についたらしい。へぇ。

    だんだん一日に書く文章量が増えてる。なんでだろう。余計なことくっつけすぎなのかな。

    それにしてもその日記を書いたのが2年間前とはとても思えない。もっと前に思える。それっぽいウェブサイトを構築できるようにはなったけれど、それ以外のことはなにもできていない。しかもそのウェブサイトを構築できるというのも趣味の域を出ていない。

    俺はプログラム (とりわけスクリプト) の話をよくするけど、本当のところ殆どプログラムなんて書けない。頭が普通についていけない。多くの場合、俺の書くスクリプトは他人の考えたアルゴリズムをいくつか組み合わせたにすぎない。レゴを組み立てるようなもんだ。考える必要のあるパズルではなくて、積み木。それに俺が思いつくアイデアは既に実装されているのでアルゴリズムを新たに考える必要性があまりない。

    願わくば、イメージをそのままウェブサイトのデザインにしたり、文章にしたりしたい。今のところ手が勝手に何かを作るのを見てイメージを逆算している感じでしかない。数うちゃ当たる、みたいな。この方法は趣味ではいいけど、作りたいイメージをすぐに作れるわけじゃない (手が作ってくれるのを待つしかない) から責任があるときにこの方法は使えない。

    それにしても責任という言葉はあまりに重いと思う。義務と言い換えてもいい。少し前によく書いていた「頑張れ」も、義務を追加する言葉になりえる。素直に受け取れといわれても、それはチャーハンに混ぜられた嫌いな食べ物みたいなものだから、どうしようもない。

    日記の話からだいぶズレたけど、結局俺が言いたいのは、日記を書くのがそれなりに楽しいことだっていうこと。

    1. トップ
    2. thinking
    3. 日記・日記
    1. トップ
    2. life
    3. 日記・日記

    CGI から extconf.rb 起動させたら have_library で異常に時間がかかって Kill される。しかたないのでコメントアウトして強制的に Makefile 作らせて make してみたけど Resource temporarily unavailable で進まない。

    FTP も NLST コマンドが通らないことが多い。謎すぎ。

    SFTP で接続しても一定時間で予期しない切断をされる。ダメすぎ。

    1. トップ
    2. xrea
    3. s63.xrea.com がどう考えてもぶっとんでおかしい

    先々週友人と集まったとき、断片化の話をした。というのもどっかのインタビューでBURGER NUDS が日本語で洋楽みたいな感じをとか言っていたからなんだけど、URL を忘れてしまったので探し出した。んで見つけたのが BURGER NUDS

    かなりまえのものだけど意外にも残ってた。残ってなくても Web Archive があるけど。

    該当部分がすごく印象が濃かったんだけど、他の部分も今読むと面白い。

    1. トップ
    2. music
    3. BURGER NUDS のインタビューを再読する。
    1. トップ
    2. net
    3. BURGER NUDS のインタビューを再読する。

    /img/remains/title.jpg

    そろそろいぢるの飽きたので公開。

    #top の画像に微妙なトリック使ってファイルサイズ軽減。NULL::something の部分は別の画像にして重ねてある。おかげで全体的に圧縮率を上げられる。1px バグで時々ズレる。

    1. トップ
    2. css
    3. 新しい CSS を適用
    1. トップ
    2. web
    3. 新しい CSS を適用

    http://null.lowreal.net/d/latest.rdf が登録されしまっていて、301 Moved Permanently と Location: http://lowreal.net/logs/latest.rdf を投げているのだけど、いつまでたっても更新されない。更新されている人とうちとの違いがわからん。

    3日様子見のあと更新されるとか書いてあったと思うんだけどなぁ。

    1. トップ
    2. web
    3. Bloglines がいつまでたっても新しいほうを読んでくれない
    1. トップ
    2. service
    3. Bloglines がいつまでたっても新しいほうを読んでくれない

    セレクタの最後にはスペース入れようよ。ルールセットの中はインデントしようよ。宣言のコロンのあとにスペース入れようよ。

    1. トップ
    2. css
    3. 他人の CSS なんて読むものじゃない
    1. トップ
    2. web
    3. 他人の CSS なんて読むものじゃない

    高校のときの話だけど、MISS WORLD (ART-SCHOOL) の 震え気味になる声も震え、霧になる声も と勘違いしていて、そのうえ素敵な表現だなぁとか素で思っていたから救えない。冬の話だし、吐いた息の白さを霧と表現しているんだと……

    まー今でも霧になる声ものほうがいいじゃん?とか思ってそっちのほうに脳内変換しているのだけれども。

    1. トップ
    2. music
    3. MISS WORLD
    1. トップ
    2. self
    3. MISS WORLD

    Opera のフルスクリーンモード (F11) は media が projection 扱いみたい。知らなかった。media="screen,tv,projection" と書くことにしよう

    Opera のフォント設定をヒラギノにしてサイズも大きめにしているんだけど、これでたまにフルスクリーンにしてウェブ見ると気持ちいい。

    1. トップ
    2. web
    3. Opera のフルスクリーンモード
    1. トップ
    2. browser
    3. Opera のフルスクリーンモード

    Gecko で border-collapse: collapse; つかうとバグるような。padding がシカトされる。

    collapse ってデフォルト値なんだけどなぁ。

    だめだわけわからん。テーブルの右マージンがシカトされる。意味わからん。テーブル周りの CSS 嫌いだ。IE はこんなところでもゴーイングマイウェイってるっし。うざ。

    1. トップ
    2. css
    3. border-collapse: collapse;
    1. トップ
    2. web
    3. border-collapse: collapse;

    小学校のとき発作的に目のピントが全くあわなくなることがあった。

    全くあわないっていうか、ピントが奥から手前へ、手前から奥へって感じでがちょーんする。季節は冬。

    そうなるとどうしよもないのでコタツ布団に顔面を近づけておちけつ!!とかやってたんだけど、結局あれはなんだったんだろう。めっさ怖かったんだけどアレ

    1. トップ
    2. life
    3. 昔話 目のがちょーん。
    1. トップ
    2. self
    3. 昔話 目のがちょーん。

    だいたい決まった構造の HTML を書くようになってきたので、俺の場合を紹介してみる。body 以下を書く。

    1. body
      1. (div#all)
        1. h1#top
          1. a
        2. div.section#navigation
          1. h2
          2. (p#skip-to-main-content)
            1. a
          3. map
            1. ul
              1. li#navigation-home
                1. a
              2. 以下似たようなのが続く
        3. div.section#content
          1. div.section
            1. h2
            2. 内容
          2. 以下似たような(ry
        4. div.section#footer
          1. address

    おおむね上のような感じ。っていうか ol, li で書くとすげぇ大変なんですが!!

    これはもちろん現実的にこうなっただけであって、いろんな妥協に溢れている。

    body 直下の div#all なんてもちろんいらない要素だけど、実際問題 CSS 書くときに、これがあるだけで、クロスブラウザ用の無駄にややこしいハックを減らせるので、安全になる。幅も広がる。

    div#navigation map なんて、パっと見変な風に見えないかもしれないけど、ぶっちゃけた話、こじつけられた div 要素みたいなもの。意味的には問題ないので、使ってみると結構便利。ただし display: block を書かないとハマるときがある。こいつには一枚多く背景に画像突っ込めるわけだ。あと実は p#skip-to-main-content も、アクセシビリティの配慮とか、そういうの関係なく、あると便利な要素の一つ。サイトによっては書かなかったり (そもそもナヴィゲーションがないとか) するけど。

    できるだけ意味をこじつけて、div じゃない要素を使おうとしているだけ。いろいろ置換してけば div 厨になるんです。なんでもいいけど、悪いのは微妙な仕様の CSS と、その CSS に対応してない IE なんですよ!! 俺は悪くない! 放せ!

    1. トップ
    2. sw
    3. 俺的 XHTML 構造
    1. トップ
    2. web
    3. 俺的 XHTML 構造
    1. トップ
    2. csS
    3. 俺的 XHTML 構造

    上のセクションに続き (とはいえ書いたのはこっちが先だ。つまり、まだ今「上のセクション」はない) 割と理想的な XHTML の姿と、CSS 2.0 の本来の姿。 True Power of CSS

    body 直下に h1 を置き、サイト名やら、文書タイトルを書き直すのはバカらしい。既に title 要素を書いているのだから、それを利用すべき。これで hn の数字が全体的に一個減る。

    本当はフッタ情報 (書いた人やら、連絡先やら) も body 内に書くものじゃない気がする (どっちかといえばメタデータなはず) けど、とりあえず仕方ないので address 要素置いてる。CSS からリンクは作れないし、フッタっぽく表示させるのは困難。

    1. トップ
    2. web
    3. CSS 本来の力・XHTML のあるべき姿
    1. トップ
    2. sw
    3. CSS 本来の力・XHTML のあるべき姿

    ご飯を食った後、だるくて横になったら寝てしまった。起きたときには THE BACK HORN の旅人がかかっていて、なぜか起き上がって fb2k の曲名を右クリックし、Copy name していた。

    なんだかよくわからないけど、いくつかのテーブルと、何かしら変なものと、群青色の空がある空間で、制限された生活を送っていた。何が制限されていたかは覚えていない。居場所とかそういう類だけど、実際あんまり関係ない。俺が壁際のお湯がでてくるところ、もしくは火が使えるところ (どっちだかわからない) にいると、知っている顔の女の子が、カップラーメン (深く大きめ) を俺に差し出してきて、お湯を入れて欲しいといってきた。いや言ってきたかどうかはわからないが、入れて欲しいことが伝わってきた。夢だからなんでもありだから、な? とにかく、お湯を入れた。そのぐらいしか覚えていない。

    他にもあったのだけど、うまく思い出せない。長いテーブルばっかりだ。とにかく、なにかあったことはあったけど、なにがあったか思い出せない。事実ではないからもう思い出す術はない。

    1. トップ
    2. dream
    3. 夢 カップラーメン・制限された生活
    1. トップ
    2. self
    3. 夢 カップラーメン・制限された生活
    1. トップ
    2. life
    3. 夢 カップラーメン・制限された生活

    昨日暇すぎだったので Firefox RC3 を入れた。

    拡張とかそのまんまにして、上書きインストール。起動してみるとステータスバーの下に変なスペースがあいて何がなにやら。とりあえずセーフモードで起動してみるも解決せず。セーフモード後に普通に起動したらブックマーク (その他設定) が飛んであせった。

    とりあえず動いていない拡張も含めて怪しいのをすべてアンインストールしてみると、変なスペースがなくなった。 GreaseMonkey, LiveHTTPHeader, bbs2chreader, Tab Mix, downTHEMall, Bookmark Synchronizer が使えなくなった。Bookmark Synchronizer は使えないと困るなぁ。

    Tab Mix 相当の拡張は入れてない。普通に標準装備のタブ機能だけでいける。(Force Links that open new windows to open in: にチェック a new tab を選択、Hide the tab bar when only one web site is open のチェックをはずしただけ)

    とんだブックマークはプロファイルディレクトリに bookmarkbackups とかいう親切なものがあったので助かった。

    1. All-in-One Gesture
    2. Sage
    3. IE View
    4. Opera View
    5. Web Developer
    6. Linky
    7. Adblock
    1. トップ
    2. software
    3. Firefox RC3
    1. トップ
    2. life
    3. Firefox RC3

    : ランダムにてきとーな色を発生させるだけのブックマークレット。長時間連打すると眼が疲れる。Firefox でしか見てない。

    さぁ! これで新しい色との出会いを体験してみませんか☆

    出会い系スパム、のように。

    1. トップ
    2. web
    3. 暇つぶし。色、いろいろ
    1. トップ
    2. script
    3. 暇つぶし。色、いろいろ
    1. トップ
    2. javascript
    3. 暇つぶし。色、いろいろ

    テレビで賢者の石がやっていて見たけど、やっぱハーマイオニーの可愛さが臨界点超えててやばい。つか最後に映画館で見た映画が賢者の石か秘密の部屋だった気がする。中学のとき母親と一緒にいったんだよな(謎。しかし作を追うごとに可愛くなくなるのが切ない。

    原作読んでてもやっぱあんまり気にならない。違和感感じないっていうかなんていうか、ハーマイオニー可愛いから満足っていうか、どうでもいい。

    1. トップ
    2. life
    3. ハリーポッターいいね
    1. トップ
    2. book
    3. ハリーポッターいいね

    NULL::colors の外観

    NULL::colors Firefox Only. カラージェネレータ

    こういうツールは IE に対応させても嬉しくないので IE にはハナから対応させる気がありません。(IE コンパチじゃない、すなわちオリジナルの Triangle Color Selector を微妙に改良したのを使用) Opera には対応させようと思ったんだけど、なんかいろんな処理がいちいち4回走ってうざいのでやめた。

    色の計算式はソレっぽくなるのを試行錯誤してみた。これから変わるかもしれない。処理自体はごく単純。

    むしろ俺が色の計算式を変えて遊ぶのが楽しい。だからユーザが動的に計算式変えられるようにしたら面白いのかもしれない。とりあえずめんどっちいのでアイデアだけメモ。

    クリック&ドラッグがうまくいかなかったのは preventDefault() をやってなかったからだった。

    ロード直後の真っ白なパレットに、TCS をクリックすることにより色がドバっと発生する、この瞬間が萌えませんか? お前だけだよってか。

    dump でコンソール流れまくります。

    1. トップ
    2. web
    3. NULL::colors
    1. トップ
    2. css
    3. NULL::colors
    1. トップ
    2. design
    3. NULL::colors

    NULL::colors の外観

    セクション分ける必要があるのか微妙。NULL::colors2

    もう少し実用的かつ美しくしてみる。カラフルなのは楽しい。

    表示されているパレット 6x3 のうち、プレビューに使われるのは一番左の2列だけです。

    今のアルゴリズムだと彩度低くて明度高いとイマイチ。

    1. トップ
    2. web
    3. NULL::colors2
    1. トップ
    2. css
    3. NULL::colors2
    1. トップ
    2. design
    3. NULL::colors2

    NULL::colors2 をさらにいぢくる。ドラックアンドドロップで色の変更できるようにしてみたり。やばい楽しい。でも気がつくとクロスブラウザのこと考えて鬱になる。「ああーこのコード IE じゃ動かないな」「Opera はちゃんと解釈するんだろうか」「opacity とか Gecko でしか使えないじゃん」っていう自動的思考。微妙に病的。そして考えてから、Firefox で動けばいいんだった!と気づいて晴れやかな気分に。やりたい放題というのはすばらしい。

    カラーコードがコピペできんな。どうしよ。

    プレビューの色をクッキーに保存させたい (さらに URL からも復元したい) んだけど、いまいちうまいやりたかがない。

    前景色と背景色を一部決めうちにしているんだけど、なんかいい方法ないかなぁ。D&D したときスムーズにやりたいからダイアログとかは嫌だしなぁ。

    1. トップ
    2. color
    3. NULL::colors2 D&D
    1. トップ
    2. web
    3. NULL::colors2 D&D
    1. トップ
    2. design
    3. NULL::colors2 D&D
    1. トップ
    2. javascript
    3. NULL::colors2 D&D

    NULL::colors2 飽きるまでいぢる。

    とりあえず、クッキーからの自動復帰を適当に実装。無駄に JSON 使ってる。このへん実装しなおすかもしれない。

    んで URLハッシュからの復帰を実装。TCS のターゲット色と、プレビューエリアの4箇所8色 (前景・背景) を保存する。Result をクリックした後でてくる Static Link にリンクを貼ってある。要 UI 改良。ハッシュから復帰すると問答無用で Cookie がリセットされるのは挙動としてどうなんだ。

    あとは、気に入った配色ができたら保存して、サムネイル付で読み込みできるようなのが欲しい。ついでに、コレ!ってのができたらサーバー上に保存しておくとか、そういうの。

    Cookie ってどれぐらいの大きさまでいけるのかなぁ。

    クッキーの最大サイズ制限について

    1. トップ
    2. color
    3. NULL::colors いろいろアップデート
    1. トップ
    2. web
    3. NULL::colors いろいろアップデート
    1. トップ
    2. design
    3. NULL::colors いろいろアップデート
    1. トップ
    2. javascript
    3. NULL::colors いろいろアップデート

    NULL::colors2 飽きるまでいぢる。

    でもってプレビューつきセーブ・ロードを実装。スロット9箇所。クッキーサイズが 2k ぐらいになるので調度よさげ。

    Firefox 1.5 で outline が使えるようになったので使ってみた。既に Firefox 1.0.7 とか過去のもの扱い。だんだん俺の俺による俺のためのカラージェネレータに。最初はてきとーに作って放置する気だったけど微妙に自分でも使おうという気になってきた。

    Result で明度差・色差と、WCAG1.0 による判定を表示するように。

    上から3番目がコンテンツ本文なので、それが false でなければ気にしなくてもいいと思う。

    1. トップ
    2. color
    3. NULL::colors 色セットの保存
    1. トップ
    2. web
    3. NULL::colors 色セットの保存
    1. トップ
    2. design
    3. NULL::colors 色セットの保存
    1. トップ
    2. javascript
    3. NULL::colors 色セットの保存

    先に UI 作ったほうがやる気が出る。さきに機能を実装すると UI 作るのが面倒くさくなって UI がおろそかになる。そして UI が悪いものはいくら内部実装がかっこよくても使わない。

    1. トップ
    2. prog
    3. UI -> 機能

    each 使えないから最新の RC を試したんだけど、思ったより使えない。Event.observe って、もうちょっとクロスブラウザに考慮していると思ってた。

    軽くテストスクリプト書いてごちゃごちゃやってた script.aculo.us の effects.js を使ってみたかっただけとかなんとか。

    Event.observe で function (e) {} とか渡しても IE では e にイベントオブジェクトが入らない。

    _observeAndCache: function(element, name, observer, useCapture) {
    var eEvent = function () {
    this.type            = window.event.type;
    this.target          = window.event.srcElement;
    this.currentTarget   = this;
    this.clientX         = window.event.clientX;
    this.clientY         = window.event.clientY;
    this.pageX           = document.body.scrollLeft + window.event.clientX;
    this.pageY           = document.body.scrollTop + window.event.clientY;
    this.shiftKey        = window.event.shiftKey;
    this.altKey          = window.event.altKey;
    this.ctrlKey         = window.event.ctrlKey;
    this.which           = window.event.keyCode;
    this.stopPropagation = function() { window.event.cancelBubble = true }
    this.preventDefault  = function() { window.event.returnValue = false }
    }
    if (!this.observers) this.observers = [];
    if (element.addEventListener) {
    this.observers.push([element, name, observer, useCapture]);
    element.addEventListener(name, observer, useCapture);
    } else if (element.attachEvent) {
    this.observers.push([element, name, observer, useCapture]);
    element.attachEvent('on' + name, function () {
    observer(new eEvent());
    });
    }
    },

    みたいに prototype.js を直接書き変えて使ってみた。けど、なんか楽しくない。

    なんかわくわくしない。つまらない。

    ちなみに prototype.js における each の break, continue の実装は、あらかじめ $break$continue にオブジェクトを代入しておいて、それを投げるというものだった。なるほど文字列投げるよりこっちのほうがいいな。

    [1, 2, 3, 4, 2, 6].collect(function (v, i) {
    if (v == 2) throw $continue;
    if (i > 4) throw $break;
    return v;
    }); //=> [1, 3, 4]

    なんで _each を定義させるんだろうと思っていたけどこれのためだね。_eachEnumerable.each からのみ呼び出される。Enumerable の各メソッドは each を使用する。

    each_with_index 相当がねぇよとか思ったけど、each 自体がその役目を負ってる。[1].each(function (value, index) {}) とかける。

    あー Event.element とか使うのか。

    1. トップ
    2. javacript
    3. prototype.js
    1. トップ
    2. ajax
    3. prototype.js

    $H()inspect() の組み合わせが微妙に便利だ。普通の object って toString() しても [object Object] とかになって中身がわからんから、$H(obj).inspect() とかやると中身が見れて便利。

    Object.prototype.p = function () {
    var t = Object.inspect(this);
    if (t == "[object Object]")
    t = $H(this).inspect().replace(/^#<Hash/, "#<Object");
    if (navigator.userAgent.match(/Firefox/)) {
    window.dump(t + "\n");
    } else {
    window.status = t;
    }
    return this;
    };
    ({aa:"aabb"}).p().aa.p().replace(/^a/, "b").p();
    //=> #<Object:{'aa': 'aa'}>
    //   'aabb'
    //   'babb'
    
    1. トップ
    2. javascript
    3. prototype.js .inspect $H()
    1. トップ
    2. prototype
    3. prototype.js .inspect $H()