sfCssTabsPlugin からやっていこうか

良く考えるとあまり SymfonyPlugin しらない

開発の無駄をなくすために、既存のプラグインは網羅しておきたい。
なのでコチラにあるプラグインを上から順にやっつけていこうと思う。
有用かどうかは知らない。

sfCssTabsPlugin を使ってみる

とりあえずWikiに丁寧な使い方があるので、簡単そうだ。
英語はわかりませんが。。。

[sfCssTabsPlugin 0.1.6 Beta - 2007/11/1 現在]

sfCssTabsPlugin をインストール

symfony plugin-install http://plugins.symfony-project.com/sfCssTabsPlugin

いつも通り、簡単です。

CSSを設置する

とりあえず、用意されているデフォルトCSSを '/web/css' フォルダにコピーする。

<my_project>/web/sfCssTabsPlugin/css/sfCssTabs.css
↓コピー
<my_project>/web/css/sfCssTabs.css

次に sfCssTabs.css を読み込むように view.yml を修正。 [<my_project>/apps/<myapp>/config/view.yml]

stylesheets:    [main]
↓修正
stylesheets:    [main, sfCssTabs]

タブメニューの設定をする

今回はサンプルなので、ためしに、'sfCssTabs_1','sfCssTabs_2','sfCssTabs_3'というモジュールを作成して、それぞれに、'sample1','sample2','sample3'というアクションを設置しました。
んで、それに対する設定ファイルを同封の'example'を参考にして下記のように記述した。

[<my_project>/plugins/sfCssTabsPlugin/config/ctSite.yml]

cssTabs:

  # general config
  # それぞれのタグのアトリビュート設定。
  # キーは固定。st_spanとかでspanタグを増やしたりは残念ながら出来ない。
  # あと activeII ってid名が斬新すぎて引いた。気になる人は変更すべき。
  configTabs:
    div:           {id: navcontainer}
    mt_ul:         {id: adminmenu}
    mt_li:         {id: active}
    mt_a:          {class: current}
    st_ul:         {id: submenu}
    st_li:         {id: activeII}
    st_a:          {class: current}

  # Configuration of the main Tabs
  # メインタブ設定。
  # モジュール単位で配置。同じモジュールは複数置けない(current表示がダブる)。
  # linkOptions には Aタグのアトリビュートを {key: value} で指定できる。
  mainTabs:
    - label:       'moduleA'
      module:      'sfCssTabs_1'
      action:      'sample1'
      linkOptions: {}
    
    - label:       'moduleB'
      module:      'sfCssTabs_2'
      action:      'sample1'
      linkOptions: {}
    
    - label:       'moduleC'
      module:      'sfCssTabs_3'
      action:      'sample1'
      linkOptions: {}


  # Configuration of the sub Tabs
  # サブタブ設定
  # メインタブ設定と基本的に同じ。
  # parentTab には、所属するメインタブのモジュール名を指定(別のモジュールグループにも参加できる)。
  subTabs:
    - label:       'mA:actionA'
      module:      'sfCssTabs_1'
      action:      'sample1'
      linkOptions: {}
      parentTab:   sfCssTabs_1
    - label:       'mA:actionB'
      module:      'sfCssTabs_1'
      action:      'sample2'
      linkOptions: {}
      parentTab:   sfCssTabs_1
    - label:       'mA:actionC'
      module:      'sfCssTabs_1'
      action:      'sample3'
      linkOptions: {}
      parentTab:   sfCssTabs_1

    - label:       'mB:actionA'
      module:      'sfCssTabs_2'
      action:      'sample1'
      linkOptions: {}
      parentTab:   sfCssTabs_2
    - label:       'mB:actionB'
      module:      'sfCssTabs_2'
      action:      'sample2'
      linkOptions: {}
      parentTab:   sfCssTabs_2
    - label:       'mB:actionC'
      module:      'sfCssTabs_2'
      action:      'sample3'
      linkOptions: {}
      parentTab:   sfCssTabs_2

    - label:       'mC:actionA'
      module:      'sfCssTabs_3'
      action:      'sample1'
      linkOptions: {}
      parentTab:   sfCssTabs_3
    - label:       'mC:actionB'
      module:      'sfCssTabs_3'
      action:      'sample2'
      linkOptions: {}
      parentTab:   sfCssTabs_3
    - label:       'mC:actionC'
      module:      'sfCssTabs_3'
      action:      'sample3'
      linkOptions: {}
      parentTab:   sfCssTabs_3

ちなみに 'ctSite.yml' というのはデフォルトの設定ファイル名で、先頭に'ct'を付けた yml ファイルであれば別の名前で作成することも出来る。
たとえば 'hoge' という名前にしたければファイル名は 'ctHoge.yml' になる。

最後に出力コードを書いて終了です

Bodyタグ内の好きなところに配置。
[<my_project>/apps/<myapp>/templates/layout.php]

<body>
...
<?php sfCssTabs::singleton()->render(); ?>
...
</body>

もし、デフォルト以外の設定ファイルを利用する場合は'render'に名前を渡してやります。
[ctHoge.yml を利用する場合]

<body>
...
<?php sfCssTabs::singleton()->render('hoge'); ?>
...
</body>

完成したものはコチラ。
デフォルトのCSSなので何か味気ない感じですが、スタイルをいじっていけばそれなりのものになるでしょう。

まとめ

導入は非常にラクチンだけど、設定ファイルが冗長化しそうな気もする。
出力タグが固定で柔軟性が乏しいのも、僕にとってはマイナス。今のところ導入のメリットは感じられないかな。
そもそもメニューは layout.php あたりで一元管理出来るし、モジュールやアクションの判定でカレント状態を演出するのも難しくないしね。
まぁ、まだ Beta バージョンなので今後に期待ということで。

--
この調子で全プラグイン試すのは無理じゃね？

About this entry

Title

sfCssTabsPlugin からやっていこうか

Archive type

Individual archive

Published

2007/11/01 18:28

Xlune::Blog