pukiwikiプラグイン/regiongroup
表記、そんな感じのものを作ったので、一応公開しておきます。
大昔に作ったものを、最近のサイトリニューアルの際に機能追加&リファインしました。
一応過去互換にしてあるので、以前のバージョンに上書きしてしまって大丈夫だと思います。
プラグイン概要†
pukiwiki 本家ページにある、他の方が作った 「region プラグイン」、 およびそのバリエーションである拙作「devregionプラグイン」 に関する、追加的なプラグインです。
region/devregion プラグインはいわゆる『折りたたみ』系の機能を提供するプラグインです。
で、このregiongroupプラグインは、こういう折りたたみをサポートしているモノに一般的に採用されている『全て開く』『全て閉じる』という機能を追加提供するためのものです。
- 内部的に javascript を呼び出しています。Javascript無効だと動作しません・・・が。
region プラグイン自体が javascript必須なので、多勢に影響はないと思います。
インストール方法†
- 本ページに添付されている下記ファイルをダウンロードし、regiongroup.inc.php のファイル名でpukiwiki の pluginフォルダにおいてください。
divregionのバージョンがv1.4 以降なら最新版を、それ以前なら旧版を使用してください。 - 必要に応じて、次の2つの画像ファイルを準備し、pukiwikiのimageフォルダにおいてください。
- CollapseAll.png (全て閉じるアイコン)
- ExpandAll.png (全て開くアイコン)
- これらのファイルは当方からは配布しません。
使い方†
書式
#regiongroup([mode])
パラメータ†
- mode:本プラグインで追加する「すべて開く」「すべて閉じる」UIをどのように表示するかの指定です。
省略可能、もしくは次の値のいずれかを指定してください:default,image,image_vartical,image_horizontal- default、もしくは省略:旧版との互換モード。
次のような「tableベース」のクリッカブルエリアの形で表示します。
全て開く 全て閉じる - image 、もしくは image_vartical :「画像と文字でクリック領域を描画」した「開く」「閉じる」を縦に並べて表示する形式。
友瀬の環境での表示例はこんな感じ。
すべて開く
すべて閉じる
- image_horizontal::「画像と文字でクリック領域を描画」した「開く」「閉じる」を横に並べて表示する形式。
すべて開く
すべて閉じる
- default、もしくは省略:旧版との互換モード。
提供する javascript関数†
本プラグインでは、外部から呼び出すことを想定している次のJavascript関数を提供しています。
regiongroupe_showtext(mode)
機能:
この関数を呼び出すことで、image系で指定している「すべて開く」「すべて閉じる」について、「文字を表示する/非表示にする」を選択することができます。
具体的な動作は、この配布ページ右側バーを見てください:
右上のほうにあるアイコンを押すと、右側バーは折りたたみになりますが、その際本プラグインの「開く」「閉じる」はボタンアイコンだけが表示されている状態になっていると思います。
表示エリアの折りたたみの処理から、上記のjavascript用関数を呼ぶことでこれを実現しています。
変更履歴†
- Ver1.4
- 拙作 divregion ver1.4での折りたたみ実現手段の変更に伴う対応
- Ver1.3
- 拙作 divregion ver1.3での拡張に伴うCSS構成の変更に対応
- Ver1.2
- divregion の「まとめて開く/閉じる」が使用されいている場合に正常動作していなかった問題を修正
技術的な話。†
基本構造†
region プラグインを参考にしたクラスベースでの作成を行っています。
正直クラス化する必要もないのですが、過去の名残です(笑)
「まとめて開く・閉じる」メカニズム†
region プラグインでは内部的に複数のエレメントを管理しており、「1つのページに複数のregion」を置いた場合、例えば 「rgn_summary1」「rgn_summary2」・・・というように、エレメント名の後ろに数字をつけて識別するようにしています。 拙作 divregionプラグインもほぼ同じ構造で、識別名が「drgn_summaryX」となっているだけです。
本regiongroupプラグインでは上記の動作を前提に、当該ページに存在する rgn_summaryX/drgn_summaryX(Xの部分は数値)を順番に探して開く/閉じるような javascript を搭載しています。
「文字部分だけ表示・非表示にする」†
regiongroupe_showtext(mode) が呼び出されたら、その指定に合わせて当該クラスに割り当てている文字列を再設定しています。
コメント†
ご意見などがあれば。
添付ファイル:
