Bshe -- B Smart HTML Extender（デザイナ、プログラマ、顧客の分業を目指したCMS兼開発フレームワーク）

BsheはPHP向けのテンプレートエンジンを基軸にした、PHP開発ライブラリ集です。
顧客、Webデザイナー、プログラマーの分業を強く意識したつくりになっており、大きく2つの機能で構成されています。

CMS機能

• Webデザイナーと顧客との間の分業をかなり進めていたLTSun-Engineを実装してあります。
  • CMS機能の使い方はこちら
• Webデザイナーが作成したHTMLに属性を付加するだけでWebページ上でそのまま利用できるCMSとして稼動する機能を持っています。
• これにより、既存のサイトでも、Bsheと組み合わせるだけで文言の修正などを顧客へ任せることができます。
• サンプル：IDとパスはいずれも「admin」になっています。
   

テンプレートエンジン

• CMS同様HTMLに属性を付加するだけで、PHPからHTMLへさまざまな機能を開発できるようになっています。
• これにより、Webデザイナーはロジックを意識せずにデザインを作成できます。
• まとまった機能を事前にプログラマが作成することで、HTMLテンプレートを差し替えるだけでさまざまなWebアプリケーションを実装できます。
• 一部ZendFrameworkを利用しており、実行にはZendFrameworkの1.53以上が必要ですが、ZendFrameworkのMVCを利用しなくても単体でテンプレートエンジンとしても利用可能です。
  • テンプレートエンジンの使い方はこちら
     
• 実装的にはHTMLをDOMパーサーで（独自DOM解析ロジックなどで完全なDOMではないですが）処理して、それに対して処理できる形です。PHPのDOMはシリアライズできなかったりするのですが、このエンジンではシリアライズ化してキャッシュするなどして速度向上させてます。
   

その他機能マニュアルなど

将来は、追加のモジュールで、携帯サイトやポータルサイト等も簡単に構築できるようにしてゆく予定です。

• Bshe利用マニュアル
• Bshe技術資料(PHPDOCなど）
• Bsheダウンロード

※BsheはLGPLにて公開しています。

最後に、このライブラリの開発で利用させていただいている以下のオープンソースの開発者に感謝します。

• Zend Framework
• LTSun
• sexylightbox2
• xajax
• tinyMCE
   

Bshe利用マニュアル

Bshe紹介

インストール

1. tarボールを展開
   1. 任意のフォルダにtarボールを展開してください。

      tar zxfv bshe_?_?_?_?.tgz

2. apacheへの設定
   1. 展開したフォルダのwwwフォルダをapacheの設定でAlias登録してください。（DocumentRootでも可）
      ※実行には、.htaccessによるRewrite設定が可能である必要があります。

      Alias /myfw "/test/www"
      <Directory "/test/www">
        Options MultiViews FollowSymLinks
        AllowOverride All
        Order allow,deny
        Allow from all
      </Directory>

3. .htaccessの変更 展開したフォルダのwwwの下に.htaccessファイルがあります。 この2行目の

   RewriteBase /

   の部分をApacheで設定したaliasと同じにこの例では

   RewriteBase /myfw

   に変更してください。

1. 書き込みフォルダアクセス権設定
   1. 展開されたフォルダの内[cache][template_c][logs][cms_c]の4つのフォルダをapacheから書き込みできるように設定してください。
   2. よくわからない人はchmod 777してしまいましょう
   3. CMS機能でページの追加を行う場合は、上記同様に[www/_bshetemplate]以下についてもapacheから書き込みできるように設定してください。
2. HTMLコンテンツ
   1. www/_bshetemplate以下にHTMLコンテンツを設置することでBsheのCMS機能が利用できます。
      1. 通常の表示

         http://サーバー名/myfw

   1. 1. CMSへのログインモード（ID、PWDともに初期では「admin」となっています。

         http://サーバー名/myfw/?bshe_specializer_auth=login

• サンプルサイト

  http://bshetest.itassist.info/

• サンプルサイトCMSログイン

  http://bshetest.itassist.info/?bshe_specializer_auth=login

Bshe利用マニュアル

CMS

概要

Bsheのもっとも簡単な使い方、HTMLへ決まった属性を記載するだけでCMSとして稼動します。
※インストール手順に従いインストールされたものとして説明します。

HTMLファイルの設置

インストールしたディレクトリ内の

/www/_bshetemplate

フォルダ以下に自由にHTMLを設置してください。

テキストCMS

テキストのタグに対して、

• HTML上で直接編集
• WYSIWYGエディタで編集
• 保存、公開
• 履歴からサイトを更新 といった作業ができるようになります。設定は簡単、CMSの編集対象としたいタグに

  key="bshe::cms:edittext"

  と入れるだけ、たとえば

  <div id="aaa">文章</div>

  というタグの「文章」の部分をCMSから編集できるようにしたいと思った場合

  <div id="aaa" key="bshe::cms:edittext">文章</div>

  と書いてあげるだけで、CMSの処理対象となります。 ※対象とするタグをBsheが判別するためにid属性を必ずセットする必要があります。

画像CMS

画像のimgタグに対して、

• 画像の差し替え
• 外側にaタグでリンクが記載されている場合そのリンク先の修正
• 公開 といった作業ができるようになります。設定は簡単、CMSの編集対象としたいタグに

  key="bshe::cms:editimg"

  と入れるだけ、たとえば

  <img src="images/rpt.jpg" id="test" width="53" height="53"  />

  というタグの画像をCMSから変更できるようにしたいと思った場合

  <img src="images/rpt.jpg" key="bshe::cms:editimg" id="test" width="53" height="53"  />

  と書いてあげるだけで、CMSの処理対象となります。また、このタグの外側にaタグがある場合は自動で検出してリンクも編集可能になります。
  ※対象とするタグをBsheが判別するためにid属性を必ずセットする必要があります。
  ※画像のアップロードで現在のところ、トリミングや拡大縮小を行っていないため、アップロードする画像のサイズを固定にする場合は、HTMLでwidthとheightをセットする必要があります。

ログイン

CMSで編集したいと思ったページのURLの後ろに

?bshe_specializer_auth=login

とつけるだけで、ログインのウィンドウが開きます。 デフォルトのIDとPWDはどちらもadminです。

操作概要(テキスト)

ログインすると、編集可能な箇所に以下のようなパネルが表示されます。

左から

• 保存
  • 内容を保存します。（公開はされません）
• 公開
  • 現在の内容を公開します。（一般の人が見る内容を更新します）
• WYSIWYGエディタ起動
  • 直接編集よりも柔軟な編集が可能です。
• 履歴表示
  • 保存した変更の履歴が30件まで表示され、それらを、選択して戻すことができます。
• 管理画面へ移動
  • CMSの管理画面へ遷移します。

操作概要(画像)

ログインすると、編集可能な画像はクリックすると別のウィンドウが開くようになります。

上から

• 差し替えたい画像を選択
• リンク（imgタグがaタグで囲まれている場合のみ編集可能となります）
• タイトル（alt属性に設定される値です）
• 「保存ボタン」（保存するだけでは一般へは公開されません、プレビューのようなものです） 画像を一度保存すると、その画像をクリックすると以下のようなウィンドウが表示されます
  
  各ボタンは
• 「公開ボタン」（今の画像を一般から見える状態へ公開します）
• 「戻すボタン」画像を元に戻します。

今後の展開（目標）

というよりやりたいこと

• ver.0.2（開発済み）
  • 画像、リンクなどもCMSから編集可能にする。
• ver.0.3（開発中）
  • 管理メニューページを作成し、既存のHTMLをコピーしてページを追加、削除、タイトル編集できるようにする。
  • 削除もできる予定でしたが、オペミスで消してしまうケースもあるため、とりあえずペンディング
• ver.0.4（開発済み）
  • サイトマップ自動生成
• ver.0.5（開発中）
  • インタフェースを現在のマウス左クリックから右クリックでメニュー表示されるようにする。
• ver.0.6
  • imgタグに自動でCMS機能を適用する
  • ブロック要素を自動検出して、WebからCMS対象にできるようにする。
• ver.0.7
  • yutube、Flickrなどの外部APIを利用してのページ生成機能
• ver.1.0
  • ここまでの機能を整理し、ログや細かなバグFIX
• ver.1.0以降
  • 既存のDIVタグを複製して、エントリーを増やすことができるようにする。（ブログ的な機能）
  • フィード自動生成
  • ポータル機能（このあたりからやはりDB必要かなぁ）
  • FTPを利用して、プロバイダに保存されているHTMLを取得し編集しアップロードできるようにする。

• その他将来像
  • 各種ECパッケージやSaasサービスとの連携
  • 管理画面へのファイルマネージャー追加

Bshe利用マニュアル

Bshe_View（テンプレートエンジンマニュアル）

プログラマー向けマニュアル:値のセット

単純な値の属性へのセット

HTMLテンプレートはタグの集合でできています。Bshe_ViewはHTMLタグの各種属性やタグの内部テキスト（innerHTML）に対して簡単に値をセットするリソースクラスを提供しています。
Bshe_Viewに対して、値を設定するためには2つの方法が提供されています。

• 単純に値をセットする方法
• セットする属性名称を指定して値をセットする方法

単純に値をセットする方法

Bshe_Viewのインスタンスに対して「->」で直接変数を指定して値をセットすることで、
Bshe_Viewに対して、単に値を設定することができます。

以下のようなHTMLがあるとします。

<div "key=bshe::a"></div>

このとき、Bshe_Viewのインスタンスに以下のように値をセットすることで

$view->a = "任意の文字列";

次のようなHTMLが生成されます。

<div >任意の文字列</div>

上記の例では、divなどのブロックタグのため、innerHTMLに対して値のセットが行われましたが
この値のセットは、タグの種類によって、（特にinputタグなど）挙動が異なります。

たとえば、以下のようなinputタグがあるとします。

<input type="text" "key=bshe::a" />

このとき、Bshe_Viewのインスタンスに以下のように値をセットすることで

$view->a = "任意の文字列";

次のようなHTMLが生成されます。

<input type="text" value="任意の文字列" />

のようにvalue属性に値がセットされます。

セットする属性名称を指定して値をセットする方法

上記のような単純なセットのほかに、値をセットする対象の属性を指定して値をセットすることができます。
値を属性つきで指定する場合は、次のような構造の配列を用います。

array(
  'a' => 
    array('style' ,'color: #FF0000;')
)

ここで、

• 'a'は値のセット（assign）をあらわします。
• 配列の中の「style」はstyle属性に対する処理であることを示します。
• 「color: #FF0000;」はstyle属性に対してセットする値を示します。 この配列を以下の用はHTMLを用意し

  <div "key=bshe::a"></div>

  先ほどの配列を次のようにセットすることで、

  $view->a = array( 'a' => array( 'style' ,'color: #FF0000;'));

  次のようなHTMLが生成されます。

  <div style="color: #FF0000;"></div>

  また、同じ値に対して繰り返し、配列をセットすることで、複数の属性処理を投入することができます。
  同じHTMLに対して、次のように配列セットをすると

  $view->a = "任意の文字列";
  $view->a = array( 'a' => array( 'style' ,'color: #FF0000;'));

  次のようなHTMLが生成されます。

  <div style="color: #FF0000;">任意の文字列</div>

  また、上記のセット処理は次の記載と同じ意味です。

  $view->a = array( 'a' => array( 'innerHTML' ,"任意の文字列"));
  $view->a = array( 'a' => array( 'style' ,'color: #FF0000;'));

Bshe利用マニュアル

1. Bsheの紹介
   1. 概要
   2. インストール
2. CMS機能
   1. HTMLに決まった属性をセットするのみで、CMSになります。
3. Bshe_Specializer（HTMLテンプレート領域とプログラムを完全分離するZendFrameworkのMVCを継承した各種クラス群）
   1. HTMLファイル領域とフレームワークのMVCを完全に分離する機能を持つ
4. Bshe_View（テンプレートエンジンマニュアル）
   1. HTMLへ属性を指定するだけで各種機能を実現することのできるWebデザインとロジックを完全に分離したテンプレートエンジン
   2. 携帯電話向けサイトを構築するための各種機能を持つ（予定）
5. Bshe各クラス利用マニュアル
   1. Bshe_Controller
      1. Bshe_Controller_Init
   2. Bshe_Dom
   3. Bshe_Loader
   4. Bshe_Log
      1. Bshe_Log_Writer_Dailystream
      2. Bshe_Log_Writer_Maillog
      3. Bshe_Log_Writer_Syslog
   5. Bshe_Mobile
      1. Bshe_Mobile_Session
   6. Bshe_Registry
      1. Bshe_Registry_Config
   7. Bshe_Specializer
   8. Bshe_View

Bshe利用マニュアル

Bshe紹介

概要

Bsheは作者がZendFrameworkの勉強を兼ねて、作者の利用しやすいテンプレートエンジンや各種クラスを作成したものを公開したものです。
作者はWebデザイナーと仕事をさせていただく機会も多く、デザイナーにロジックを意識させずにHTMLテンプレートを処理させ、さらに簡単にCMSとして機能させることができるようにすることで、顧客、デザイナー、プログラマーの分業を実現することを重要視したテンプレートエンジンとなっております。
Bsheを使って、ECやその他さまざまなPHPのサイトを構築した際には、プログラマーは、各タグに設定してもらいたいキー属性の表を情報共有するのみで、HTMLデザイナーとの連携が事足り、また、文言については顧客が直接編集できるようになるといいと考えています。

Bshe

とは、

B　Smart　HTML　Extender

の略で、HTMLをできるだけシンプルにスマートにロジックを乗せこんだ拡張ができるように開発を進めています。

ライセンスはLGPLで公開しておりますので、自由にお使いください。 バグ等の情報はbshe@bshe.org宛てまたは、このWebページのフォーラムまでお願いします。

Bshe利用マニュアル

Bshe_Specializer（HTMLテンプレート領域とプログラムを完全分離するZendFrameworkのMVCを継承した各種クラス群）

概要

HTMLテンプレートフォルダとZendFrameworkのMVCモデルの分離を実現したクラス群
AというフォルダにHTMLテンプレートをそのまま静的ページとして参照できる形で設置（画像やCSS、フォルダ構成も自由）し
このフォルダへのアクセスについて、cssやjpgのようなFrameworkで処理しないものを除き Bsheのコントローラーへ転送する仕組みを提供する。
また、今後このクラス群に対して、携帯向けの機能や、ポータルを作成する機能などを追加してゆく。

目次

• Bshe_Specializer（HTMLテンプレート領域とプログラムを完全分離するZendFrameworkのMVCを継承した各種クラス群）
  • フォルダ構成
  • HTMLテンプレートフォルダとコントローラーの紐付け
    • 配列による紐付け
    • INIファイルによる紐付け
  • コントローラーの作成

Bshe利用マニュアル

Bshe_Mobile

Bshe_Mobile_Session

概要

Bshe_Viewと連携して、docomo携帯のみsession_idをGETまたはPOSTのパラメーターへセットします。
携帯端末の判別にはPEARのNet_UserAgent_Mobile 1.0.0RC1以上が必要です。

機能内容

テンプレートのafterAssignsへBshe_Mobile_Session::setSessionIdForDoco​moをセットします。
詳細はBshe_Viewの設定参照

後は、Bshe_Mobile_Sessionでsessionを開始するだけで、DOCOMO端末の場合のみBshe_Viewは、
formタグ、aタグ、input(type=imgのみ）に対してセッション名IDを付与します。

設定例

コントローラー内で以下のように、パラメーターをViewへセットし、
Bshe_Mobile_Session::startを呼び出します。

$params =
  array(
    'templatePath' => $mainPath . $config->template_path,
    'afterAssigns' => array(
      array(
        'className' => 'Bshe_Mobile_Session',
        'methodName' => 'setSessionIdForDocomo'
      )
    )
  );
$this->view = New Bshe_View($params);

// セッション処理
Bshe_Mobile_Session::start();
// render
$this->view->render('index.html');

Bshe_View（テンプレートエンジンマニュアル）

プログラマー向けマニュアル:設定

その他設定可能項目

テンプレートのafterAssign関数

Bshe_Viewでは、テンプレートへアサイン処理を実行する後にあらかじめ設定したメソッドを実行させることができます。 設定はafterAssignsというキーの配列を追加することで行います。
複数のメソッドをセットできるため、多重配列で指定します。

$params =
  array(
    'afterAssigns' => array(
      array(
        'className' => メソッドクラス名,
        'methodName' => メソッド名
      )
    )
  );
$this->view = New Bshe_View($params);

• メソッドクラス名、メソッド名
  • 指定したクラスの指定したメソッドがstaticに呼ばれます。
  • 指定したメソッドは引数にテンプレートクラスをとります。
  • 返値にもテンプレートクラスを返します。

• 設定例 メソッドクラスが「Bshe_Mobile_Session」で、メソッドが「setSessionIdForDocomo」の場合、
  

  $params =
    array(
      'afterAssigns' => array(
        array(
          'className' => メソッドクラス名,
          'methodName' => メソッド名
        )
      )
    );
  $this->view = New Bshe_View($params);

Bshe利用マニュアル

Bshe_View（テンプレートエンジンマニュアル）

プログラマー向けマニュアル:設定

テンプレートの指定

テンプレートパスとテンプレートファイル

Bshe_Viewでは、テンプレートをテンプレートパスとテンプレートファイルの2つの項目で設定できます。

• テンプレートパス
  • 通常、Bshe_Viewクラスをインスタンス化する際に設定します。
  • テンプレートファイルを検索する際の、ルートフォルダを指定します。
• テンプレートファイル
  • 通常、テンプレートクラスからrenderメソッドを呼び出してHTMLの出力を生成する際に指定します。
    
  • テンプレートファイルは、ファイル名またはテンプレートパス以下のパスを含んだファイル名で指定します。

例）テンプレートパスが/templateで、利用するファイルが/template/aaa/bbb.htmlの場合、
　テンプレートパスに/template
　テンプレートファイルに/aaa/bbb.html
　を指定します。

設定例

テンプレートパスが/templateで、対象テンプレートがindex.htmlの場合、以下のように指定してBshe_Viewをインスタンス化します。

$params =
  array(
    'templatePath' => '/template', // テンプレートパス
    'templateFile' => 'index.html', // テンプレートファイル
  );
$view = New Bshe_View( $params);

Bshe利用マニュアル

Bshe_Registry_Config

概要

• ZendFrameworkのZend_RegistryにZend_Configの機能をマージしたもの
• Iniファイルの内容について、Registryへ問い合わせた際に、あらかじめ決められたINIファイルの内容を読込それを返す。
• Iniファイルを読み込んだ際にはZend_Registryへそのコンフィグクラスを保存する。
• Iniファイルがすでに読み込まれている場合は、INIファイルを読み直さずにRegistryからコンフィグクラスを返す。

機能内容

INIファイルパス登録

読み込むINIファイルの振るパスを設定する。

Bshe_Registry_Config::setInitPath([INIファイルの振るパス]);

以下のようにセットしておくことで、プログラム内からBshe_Registry_Configのメソッドを呼ぶことで、コンフィグクラスを取得できる。

// パス設定
Bshe_Registry_Config::setInitPath('/init/bshe.ini');
// Zend_RegistryへBshe_Registry_Configをセット
Zend_Registry::setClassName('Bshe_Registry_Config');

コンフィグクラス取得

setInitPathにて設定されたINIファイルからコンフィグクラスを生成し返す。
コンフィグクラスはZend_Registryへ保存され、2回目からはRegistryからコンフィグクラスを返す。

Bshe_Registry_Config::getConfig([INIファイル内のセクション]);

INIファイルの内容がBshe_Config_Iniクラスへ取得される

Bshe利用マニュアル

Bshe_Mobile

概要

• Bsheで携帯向けWebサイトを構築する機能を付与するクラス群

目次

• Bshe_Mobile
  • Bshe_Mobile_Session

機能内容

• Bshe_Viewと連携して、docomo携帯のみsession_idをGETまたはPOSTのパラメーターへセットします。
• その他開発中

Bshe利用マニュアル

Bshe_Controller_Init

概要

• プログラムの各所で利用するパス情報などをスタティックに返す関数群
• この関数群は、tarボールを展開したフォルダ構成のまま利用するときのみ意味を持ちます。

機能内容

アプリケーションのメインパス取得

アプリケーションのメインパス（libraryパスのひとつ上）を返す。

Bshe_Controller_Init::getMainPath();

文字列でメインパスをフルパスで返します。

アプリケーションのメインパス取得

アプリケーションのURLルートを返す。

Bshe_Controller_Init::getUrlPath();

文字列でメインパスをURLルートを返します。

アプリケーションのライブラリパス取得

アプリケーションのライブラリパスを返す。

Bshe_Controller_Init::getLibraryPath();

文字列でメインパスをライブラリパスを返します。

Bshe利用マニュアル

Bshe_Loader

目次

• Bshe_Loader

概要

Zend_FrameworkのZend_Loaderはlibrary以下の各クラスファイルをクラス名から検索してくれる機能を提供してくれる、
これをapplicationのmodels以下のファイルについても同様に自動で読み込んでくれるように拡張したもの。

• application以下のmodelsクラスについても、Models_AAA_BBBの形式のクラスをapplication/models/AAA/BBB.phpと解釈して自動読み込みできるようにする。
• module後とのmodel（application/module名/model）についても同様にModule名_Models_AAA_BBBクラスをapplication/module名/models/AAA/BBB.phpと解釈するようにする。
• AAAやBBBの後ろにも_を間に挟むことでフォルダの階層構造に制限を設けない。

機能内容

Bshe_Loader::setApplicationDir( '/path/to/application');　←１
Zend_Loader::registerAutoload('Bshe_Loader');　←２

１．'/path/to/application'のところに、applicationディレクトリのpathを設定
２．Zend_Loaderのautoloaderの設定メソッドを使って登録する。