Web/WebDesign

| ･･･4 5 6 7 8 9 10 11 12 13 14 ･･･ |

2007/08/22 20:08

空行ありのblockquoteやcodeなどに対応したhtml_text_transform完成！

html_text_transformの確認用エントリのエントリーの内容 (MTEntryBody)は以下の通り。
（<pre>のとこは、半角スペースを全角スペースに意図的に変更してます。）

私は、その男の写真を三葉、見たことがある。

一葉は、その男の、幼年時代、とでも言うべきであろうか、
十歳前後かと推定される頃の写真であって、その子供が大勢の女のひとに取りかこまれ、（それは、その子供の姉たち、妹たち、それから、従姉妹（いとこ）たちかと想像される）庭園の池のほとりに、荒い縞の袴（はかま）をはいて立ち、
首を三十度ほど左に傾け、醜く笑っている写真である。

<blockquote>
醜く？　けれども、鈍い人たち（つまり、美醜などに関心を持たぬ人たち）は、面白くも何とも無いような顔をして、
</blockquote>

<blockquote>
「可愛い坊ちゃんですね」
といい加減なお世辞を言っても、まんざら空（から）お世辞に聞えないくらいの、謂（い）わば通俗の「可愛らしさ」みたいな影もその子供の笑顔に無いわけではないのだが、しかし、いささかでも、美醜に就いての訓練を経て来たひとなら、ひとめ見てすぐ、
</blockquote>

<blockquote>
「なんて、いやな子供だ」

と頗（すこぶ）る不快そうに呟（つぶや）き、毛虫でも払いのける時のような手つきで、その写真をほうり投げるかも知れない。
</blockquote>

<pre>
　まったく、
　　その子供の笑顔は、
　　　よく見れば見るほど、
　　　何とも知れず、
　　　イヤな薄気味悪いものが感ぜられて来る。どだい、それは、笑顔でない。この子は、少しも笑ってはいないのだ。その証拠には、この子は、両方のこぶしを固く握って立っている。人間は、
　　　こぶしを固く握りながら笑えるものでは無いのである。猿だ。猿の笑顔だ。
　　ただ、顔に醜い皺（しわ）を寄せているだけなのである。
　「皺くちゃ坊ちゃん」とでも言いたくなるくらいの、
　まことに奇妙な、そうして、
　どこかけがらわしく、
　へんにひとをムカムカさせる表情の写真であった。
　私はこれまで、こんな不思議な表情の子供を見た事が、いちども無かった。
</pre>

<pre>
　第二葉の写真の顔は、これはまた、びっくりするくらいひどく変貌（へんぼう）していた。

　学生の姿である。

　高等学校時代の写真か、
　　大学時代の写真か、
　　　はっきりしないけれども、
　　とにかく、
　おそろしく美貌の学生である。
</pre>

しかし、これもまた、不思議にも、<code>生きている人間の感じはしなかった</code>。

<code>学生服を着て、胸のポケットから白いハンケチを覗（のぞ）かせ、籐椅子（とういす）に腰かけて足を組み、そうして、やはり、笑っている。こんどの笑顔は、皺くちゃの猿の笑いでなく、かなり巧みな微笑になってはいるが、しかし、人間の笑いと、どこやら違う。</code>

<code>血の重さ、とでも言おうか、生命（いのち）の渋さ、とでも言おうか、そのような充実感は少しも無く、それこそ、鳥のようではなく、羽毛のように軽く、ただ白紙一枚、そうして、笑っている。

つまり、一から十まで造り物の感じなのである。

キザと言っても足りない。軽薄と言っても足りない。

ニヤケと言っても足りない。おしゃれと言っても、もちろん足りない。</code>

しかも、よく見ていると、やはりこの美貌の学生にも、どこか怪談じみた気味悪いものが感ぜられて来るのである。
<code>私はこれまで、こんな不思議な美貌の青年を見た事が、いちども無かった。</code>

もう一葉の写真は、最も奇怪なものである。
<code>まるでもう、としの頃がわからない。頭はいくぶん白髪のようである。</code>
それが、ひどく汚い部屋（部屋の壁が三箇所ほど崩れ落ちているのが、その写真にハッキリ写っている）の片隅で、小さい火鉢に両手をかざし、こんどは笑っていない。

mt/lib/MT/Util.pmのhtml_text_transformを書き換えまくりました。いろいろ対応させました。

<blockquote>に関しては、囲んだら<br />だけ付加する。で、<blockquote>はブロック要素（だよね・・）だから、たまに、<blockquote>
引用文
</blockquote>って書いちゃう。僕がね。他の人はしりませんけど。そうすると<blockquote><br/>
引用文<br/>
</blockquote>こうなっちゃうのよねー。だから回避するようにしたのさ。あと、空行がいくらあっても問題ない感じになってます。しっかり</blockquote>が出てくるまでこれらの設定が有効な感じ。

<pre>に関しては、ほとんど使わないんだけど、まー<blockquote>同様に</pre>が出てくるまでいくら空行があっても大丈夫にして、あとはマークアップを何もしない感じ。

僕がよく使う<code>は、ブロック要素みたいに使うとき（前後に空行を入れる）があるからそういうときは<pre>で囲んであげるようにしました。その時にやっぱりいくら空行があっても大丈夫にしました。もともとインライン要素だから、インラインで使うときは<pre>で囲まずそのままな感じ。

あと、ソースを見ないと気づかないけど、ソースを綺麗にする！のが好きな僕は、ソースコードを綺麗にするだけのためにちょっと手を入れました。まずは、インデント。まったく付かないので、つけてあげました。あと、ブロック要素の後に必ず空行が入りますけど、消しました。

このソースを綺麗にするためにあれこれやってたから複雑な感じで、頭の中がゴチャゴチャになったよ。

正規表現とPerl、なかなか手強い敵だった。と言うか、最初にフローチャートを考えておけばよかったのか。と、後から思う。

で、実際のコードは今のところ載せません。もう少し様子を見させてください。あとは、反響次第で載せるカモね。

2007/08/22 12:08

html_text_transformの確認用エントリ

私は、その男の写真を三葉、見たことがある。

一葉は、その男の、幼年時代、とでも言うべきであろうか、
十歳前後かと推定される頃の写真であって、その子供が大勢の女のひとに取りかこまれ、（それは、その子供の姉たち、妹たち、それから、従姉妹（いとこ）たちかと想像される）庭園の池のほとりに、荒い縞の袴（はかま）をはいて立ち、
首を三十度ほど左に傾け、醜く笑っている写真である。

醜く？　けれども、鈍い人たち（つまり、美醜などに関心を持たぬ人たち）は、面白くも何とも無いような顔をして、

「可愛い坊ちゃんですね」
といい加減なお世辞を言っても、まんざら空（から）お世辞に聞えないくらいの、謂（い）わば通俗の「可愛らしさ」みたいな影もその子供の笑顔に無いわけではないのだが、しかし、いささかでも、美醜に就いての訓練を経て来たひとなら、ひとめ見てすぐ、

「なんて、いやな子供だ」

と頗（すこぶ）る不快そうに呟（つぶや）き、毛虫でも払いのける時のような手つきで、その写真をほうり投げるかも知れない。

  まったく、
    その子供の笑顔は、
      よく見れば見るほど、
      何とも知れず、
      イヤな薄気味悪いものが感ぜられて来る。どだい、それは、笑顔でない。この子は、少しも笑ってはいないのだ。その証拠には、この子は、両方のこぶしを固く握って立っている。人間は、
      こぶしを固く握りながら笑えるものでは無いのである。猿だ。猿の笑顔だ。
    ただ、顔に醜い皺（しわ）を寄せているだけなのである。
  「皺くちゃ坊ちゃん」とでも言いたくなるくらいの、
  まことに奇妙な、そうして、
  どこかけがらわしく、
  へんにひとをムカムカさせる表情の写真であった。
  私はこれまで、こんな不思議な表情の子供を見た事が、いちども無かった。

  第二葉の写真の顔は、これはまた、びっくりするくらいひどく変貌（へんぼう）していた。

  学生の姿である。

  高等学校時代の写真か、
    大学時代の写真か、
      はっきりしないけれども、
    とにかく、
  おそろしく美貌の学生である。

しかし、これもまた、不思議にも、生きている人間の感じはしなかった。

学生服を着て、胸のポケットから白いハンケチを覗（のぞ）かせ、籐椅子（とういす）に腰かけて足を組み、そうして、やはり、笑っている。こんどの笑顔は、皺くちゃの猿の笑いでなく、かなり巧みな微笑になってはいるが、しかし、人間の笑いと、どこやら違う。
血の重さ、とでも言おうか、生命（いのち）の渋さ、とでも言おうか、そのような充実感は少しも無く、それこそ、鳥のようではなく、羽毛のように軽く、ただ白紙一枚、そうして、笑っている。

つまり、一から十まで造り物の感じなのである。

キザと言っても足りない。軽薄と言っても足りない。

ニヤケと言っても足りない。おしゃれと言っても、もちろん足りない。

しかも、よく見ていると、やはりこの美貌の学生にも、どこか怪談じみた気味悪いものが感ぜられて来るのである。私はこれまで、こんな不思議な美貌の青年を見た事が、いちども無かった。

もう一葉の写真は、最も奇怪なものである。まるでもう、としの頃がわからない。頭はいくぶん白髪のようである。それが、ひどく汚い部屋（部屋の壁が三箇所ほど崩れ落ちているのが、その写真にハッキリ写っている）の片隅で、小さい火鉢に両手をかざし、こんどは笑っていない。

2007/08/22 11:08

html_text_transformにはまる。。

Movable Typeのmt/lib/MT/Util.pm内のhtml_text_transformを自分用にいろいろやっていくうちにとりとめも無くなってきました。html_text_transformは、エントリーの内容（MTEntryBody）を改行設定の「改行を変換する」に設定した際に動作するアレです。エントリーの内容を自動的にいろいろマークアップしてくれる感じ。

デフォルトの動作の流れは、エントリーの内容を空行があるところ（改行改行と続いている箇所（\n\n））でブチブチ切って配列に代入していきます。その配列を1つ1つマークアップしてくれます。エントリーの内容にはタグを直接入力できるので、行頭に以下のタグがない場合のみ動作します。

タグ：h1 h2 h3 h4 h5 h6 table ol dl ul menu dir p pre center form fieldset select blockquote address div hr

あくまでも行頭です。これらのタグが行頭ない場合、配列の1つずつ、改行を<br />に変換し、<p></p>で囲んでくれます。<br />なので、XHTMLです。Movable TypeをHTML4で書くのは面倒くさそう。。こんなXHTMLハードコーディングがいたるところにありそうです。

話はそれたけど、これだけしかしてくれません。いろいろと本当にやっかいです。まずなにより「エントリーの内容を空行があるところでブチブチ切って配列に代入していきます」がやっかいです。つまり、下記の空行入りがやっかいすぎるのです。

<blockquote>
私は、その男の写真を三葉、見たことがある。

一葉は、その男の、幼年時代、とでも言うべきであろうか、
</blockquote>

あとは、インデントがない。HTMLを綺麗にしたい僕にはイラっとします。ええ、自己満足です。

この辺をどうにかしたいんですよ。まだまだ戦っています。昨日、数時間戦いました。出来上がらないと、このブログが公開に至らない悲しさ。。。

2007/08/16 23:13

PagedArchivesの<b>タグをやめる

Movable Typeのプラグインですね。


sub make_pagelist {
  …
  (略)
  …
  $pagelist="";
  for(my $ii=1; $ii<=$pagecount; $ii++) {
    $filename="$pagebasename$ii$ext" if($ii>1);
    $pagelist.="$spacer<a href=\"$filename\">$ii</a>" if($ii != $pagenum);
    $pagelist.="$spacer<em>$ii</em>" if($ii == $pagenum);
    $spacer=" ";
  }
  $pagelist;
}

もっといじるとこあるけど、とりあえず今回はこれだけ。

2007/08/16 22:38

html_text_transformをblockquoteとcodeに対応させる

Movable Type3.3xのいじいじしたメモ。
4系はどうなっているのかわかりません。。再構築が遅いので当分使いません。

mt/lib/MT/Util.pm


if ($p !~ m@^</?(?:h1|h2|h3|...(略)...|blockquote|address|div|hr|code)@) {
    $p =~ s!¥r?¥n!<br />¥n!g;
    $p = "<p>$p</p>";
} elsif ($p =~ m@^</?(?:blockquote)@) {
    $p =~ s!¥r?¥n!<br />¥n!g;
} elsif ($p =~ m@^</?(?:code)@) {
    $p = "<pre>$p</pre>";
}

blockquoteには<p>で囲まないようにするのと、codeタグをブロック要素的に使用した場合（codeタグの前後に空行を入れた場合）には、preタグをつけてあげることです。code内の<>を&lt;&gt;に置換しようかと思ったけど、code内でstrongとか使えなくなるからやめました。

参考文献
小粋空間: エントリーにpタグとbrタグが入る仕組み（その2：blockquoteにbrタグを挿入）

| ･･･4 5 6 7 8 9 10 11 12 13 14 ･･･ |