Clever Geek Handbook

テンプレート：Subversion + DOM-parser in action

「目覚まし時計をいじる！」ハッカーは枕に呪いをかけ、頭を上げずに近くのテーブルに手を伸ばした。 その上にある空のビール瓶は床に向かってうなり声を上げながら転がり、ハッカーの手はテーブルの上のスペースを感じ、このひどいデバイスを手に入れようとしましたが、無駄でした。



ハッカーはベッドの端に座って目覚まし時計を上げて割れ、鏡を覗きました。鏡は反対側にぶら下がっていました。 あなたはお粗末に見える、と彼は思った。



今日、彼はテンプレートエンジンに関する考えをHigher Hacker Councilに表明する必要がありますが、これらの考慮事項は、評議会に出席したいという欲求とは異なり、そうではありませんでした。



ハッカーはベッドから出ました。 冷水で顔を洗い、部屋を上下にペーシングして、彼は思慮深く窓の外を見ました。 反対に、家では、犬を連れた女性の監督の下で労働者が正面の窓を変えました。



「窓、窓...」とハッカーは考えた。 -WindowsはWindowsです。 Windows、Windows .... Windowsはブレーキであり、ブレーキは亀です。 カメ、カメ...カメはSubversionクライアントです... Subversion ??? 「



「エウレカ！ 「泣いたハッカー。 決定は単独で行われました。 今、彼は彼が議会で提供するものを知っていました。





そこで、テンプレートエンジンと呼ばれる次の自転車についてお話します。 テンプレートエンジンの基盤は、Subversionバージョン管理システムとその素晴らしいフックメカニズムです。 この場合、トランザクション（リポジトリへの変更）が完了した後に実行されるpost-commitフックが必要になります。



別の自転車が必要な理由を理解してみましょう。



まず、すべての作業プロセスを可能な限り自動化する必要があります。 第二に、ワークフローに直接関与するタイプセッターとプログラマーの生活を可能な限り簡単にしたい。 第三に、私たちは、現在存在するそれらに対するより強力でシンプルなソリューションを作成したいと考えています。



各タイプセッターは、「HTML以外の」マークアップをできるだけ少なくしたいと考えています。 Smartyのようなよく知られたテンプレートエンジン（およびそれらの多くがあります）に不慣れな人は、そのようなマークアップをすぐには受け入れません： www.smarty.net/manual/en/language.basic.syntax.php



レイアウトデザイナーにこのような機会を与え、HTML構文に対応するテンプレートの構成を使用します。 これに伴う最初の利点は、レイアウト設計者が静的ページを使用して作業できることです。



上記のリンクと次のリンクで指定されている例をブラウザがどのように表示するかを確認してください。

<! doctype html >

< html >

< head >

< meta http-equiv ="Content-Type" content ="text/html;charset=utf-8" />

< title > iSvnTemplate example </ title >

< style type ="text/css" >

#header, #footer, #lsb { font-size:24px; color: white; }

#header, #footer {

width:100%;

height:50px;

background-color:#303030;

text-align:center;

line-height:50px;

}

#footer {

clear:both;

}

#lsb {

border:1px solid green;

margin:2px;

min-height:200px;

width:90px;

float:left;

}

</ style >

</ head >

< body >

<!-- Template container. -->

< cont name ="header" >

< div id ="header" >

Header

</ div >

</ cont >



< cont name ="lsb" >

< div id ="lsb" >

Lsb

</ div >

</ cont >



< cont name ="blockA" >

< div id ="blockA" >

<!-- Support of conditional expressions. -->

< if cond ="$ a > $b" >

< h2 > A is greater than B </ h2 >

</ if >

< else >

< h2 > B is greater than A </ h2 >

</ else >



<!-- Support of loops. -->

< for cond ="$i = 0; $i < 8; $i++" >

<!-- Including another template. -->

< include file ="" />

</ for >



< php >

print " < b > Hello, World! </ b > "

</ php >

</ div >

</ cont >



< cont name ="footer" >

< div id ="footer" >

Footer

</ div >

</ cont >



</ body >

</ html >



* This source code was highlighted with Source Code Highlighter .





、 for 、 includeタグがブラウザによって無視される場合は不明であり、結果の出力は、ドキュメントがテンプレートエンジンによって処理された後の出力に完全に対応します（出力に含まれない部分はカウントしません）。



さらに、テンプレートを解析するための強力なツール、 DOMパーサーがあります。 テンプレート構造はすべてHTML構文に準拠しているため、 <if cond =” $ a> $ b”> </ if>などのすべてのタグは、対応するPHPコードに非常に簡単に変換されます。



上記の例を使用して、テンプレートエンジンのファイル構造と、in vivoでタイプセッターがHTMLドキュメントを操作するとどうなるかを検討してください。 

 /ビュー
   /静的
     index.html
 /テンプレート
   header.tpl
   lsb.tpl
   footer.tpl
   blockA.tpl
 /ロジック
   header.tpl.php
   lsb.tpl.php
   footer.tpl.php
   blockA.tpl.php




index.htmlページには、ヘッダー、フッター、lsb、blockAという複数のテンプレートが含まれています。 タイプセッターがドキュメントに変更を加えた後（テンプレートの1つを変更するか、新しいテンプレートを追加する）、リポジトリに変更を書き込みます（ svn ci –m“ index.html update” ）。 このフィールドはすぐに、次のことを行うコミット後のフックを満たします。

  1. / view / staticディレクトリの内容全体を読み取ります
  2. ステージ1で見つかったドキュメントを解析します。
  3. すべてのテンプレートを取得し、/ view / templateディレクトリの内容を更新します
  4. 新しいテンプレートが発見された場合、クラスフレームワークを/ view / logicディレクトリに追加（または削除）します




各テンプレートは、基本クラスTemplateを継承するPHPクラスに対応しています。 クラスは必要なテンプレート（テンプレートエンジンによる処理後のマークアップ+ PHPコード）を自動的に読み込み、必要なデータを取得し、それに基づいてテンプレート本体を返します（MVCアーキテクチャ）。 テンプレートはネストすることもできます。



したがって、単純な手法を使用すると、他のどのソリューションよりもはるかに柔軟なソリューションを取得できます（少なくとも著者に知られているソリューションから）。



これはすべてアイデアレベルですが、誰かがこの手法を実装して使用したい場合は、作成者がすべての可能な支援を提供します。


More articles:


All Articles