使用可能なタグ・モディファイア

機能を上書きしているのでMTInclude/MTWidgetSet(MTWidgetManager)がそのまま使えます。
モディファイアもそのまま同じものが使えます。

ダウンロード

OptimizeParent.zip

インストール

解凍してできたOptimizeParentフォルダを/path/to/mt/plugins内にそのままアップロードしてください。
正しくアップロードできていればシステム・メニューのプラグイン設定画面に「Include」プラグインの項目が表示されます。

動作環境

Movable Type 5.0以上

CSSソース

ol {
  /* reset */
  margin: 0 0 1.62em;
  padding: 0;
  /* text */
  font-family: "Myeiad Pro", "arial", sans-serif;
  /* css3 transition */
  -webkit-transition-property: width,background-color;
  -webkit-transition-duration: .3s;
  -webkit-transition-timing-function: easing;
  /* clearfix */
  overflow: hidden;
}

<ol>の指定です。marginやpaddingをリセットやclearfixの指定をした後に、CSS3のtransitionでアニメーションの指定をします。。

ol li {
  list-style: none;
  width: 114px;
  height: 40px;
  line-height: 40px;
  float: left;
  background: -webkit-gradient(linear, left top, left bottom, from(#d7d7d7), to(#a6a6a6));
  border-right: 2px ridge #cdcdcd;
  border-left: 1px solid #cdcdcd;
  -webkit-transition-property: width,background;
  -webkit-transition-duration: .3s;
  -webkit-transition-timing-function: easing;
  overflow: hidden;
}

ol li:first-child {
  width: 116px;
  border-left: none;
  -webkit-border-top-left-radius: 3px;
  -webkit-border-bottom-left-radius: 3px;
}

ol li:last-child {
  width: 115px;
  border-right: none;
  -webkit-border-top-right-radius: 3px;
  -webkit-border-bottom-right-radius: 3px;
}

<li>の指定です。CSS3でアニメーションの指定と背景色をグラデーションにしています。

ol li a {
  display: block;
  padding-left: 20px;
  background-position: 120px center;
  background-repeat: no-repeat;
  text-decoration: none;
  color :#444;
  text-shadow: 0 1px 0 #dedede;
}
ol li.home a      {background-image: url(house.png);}
ol li.contact a   {background-image: url(mobile.png);}
ol li.downloads a {background-image: url(box.png);}
ol li.search a    {background-image: url(earth.png);}

<a>の指定です。

ol:hover li {
  width: 100px;
}

ol li:hover {
  width: 161px;
  background: -webkit-gradient(linear, left top, left bottom, from(#a4a4a4), to(#7e7e7e));
}

ol li:hover a {
  color: #FFF;
  text-shadow: 0 -1px #909090;
  background-color: transparent !important;
}

それぞれの要素にマウスオーバーしたときの指定です。CSS3のtransitionでアニメーションの指定をしているためなめらかに動きが変化します。

プラグインについて

インストールすると、アイテム挿入のオプション画面に「Google Analytics用トラッキングコードを挿入する」という項目が追加されます。
この項目にチェックをし保存をすることで、pageTracker._trackPageview()関数にアイテムのURLが設定された状態の<a>要素を生成することができます。
※拡張子がzip/lzh/gz/rarの場合のみです。

インストール後の画面

このプラグインをインストールすると、以下の画面に「Google Analytics用トラッキングコードを挿入する」という項目が追加されるようになります。

生成されるコード

「Google Analytics用トラッキングコードを挿入する」にチェックをいれ保存すると、以下のようなコードが生成されます。
pageTracker._trackPageview()内にはアップロードしたアイテムのURLが入ります。

<a onclick="javascript:pageTracker._trackPageview('http://blog.chibatch.jp/static/scripts/GooglePageTracker.zip');" href="http://blog.chibatch.jp/static/scripts/GooglePageTracker.zip">GooglePageTracker.zip</a>

「アーカイブ」クイックフィルタ

このプラグインをインストールするとアイテム一覧に「アーカイブ」という項目が追加され、以下の拡張子の付いたファイルを絞り込んで表示できるようになります。

• zip
• lzh
• gz
• rar

基本的な使い方

$router = Net_URL_Mapper::getInstance();
$router->connect('/:controller/:action');
var_dump($router->match($path));

$pathには$_SERVER['REQUEST_URI']などから作ったパスの情報が入ります。
例えばこの記事で言ったらphp/pear-net-url-mapperになりますでしょうか。

実行結果はこんな。

array(2) {
  ["controller"]=>
  string(3) "php"
  ["action"]=>
  string(19) "per-net-url-mapper"
}

これを元にコントローラとアクションを指定してやれば、Zendっぽいルーティングとかも簡単にできちゃいます。
より詳細な使い方は、PEAR::Net_URL_MapperでURLルーティングを制御するやURLルーティングを作る - part one : PEAR::Net_URL_Mapperにてわかりやすく説明されているので、そちらを参照ください。

Zend Frameworkっぽいルーティング

ただ、これだけだと個人的に面白くないので、ZendっぽいルーティングをNet_URL_Mapperを使って実装してみようと思います。
じゃーZend使えばと言われてしまうと、おっしゃる通りですとなってしまうので、それは言わないでおいてください。

Zendっぽいルーティングっていうのは、Zend Framework: Documentに書かれいている「デフォルトのルート」ってやつです。
いろいろ面倒なので、今回の例ではモジュールはなしで。

$router = Net_URL_Mapper::getInstance();
$default = array(
  "controller" => "index",
  "action"   => "index",
  "params"   => ""
);
$router->connect(':controller',$defualt);

$router->connect(':controller/:action',$defualt);
$router->connect(':controller/:action/*params',$defualt);

$match = $router->match($path);
$className  = $match['controller'] . 'Controller';
$actionName = $match['action'] . 'Action';

$controller = new $className();
$controller->$actionName($match['params']);

connectメソッドは複数定義できるので、複数定義してしまいます。
ルーティングを複数定義した場合は上から順番にマッチしているかどうか確認されるみたいです。

これをこのブログにあてはめてみようと思います。

//$parh = "";
var_dump($router->match($path));

array(3) {
  ["controller"]=>
  string(5) "index"
  ["action"]=>
  string(5) "index"
  ["params"]=>
  string(0) ""
}

// $path = "php";
var_dump($router->match($path));

array(3) {
  ["controller"]=>
  string(3) "php"
  ["action"]=>
  string(5) "index"
  ["params"]=>
  string(0) ""

// $path = "php/pear-net-url-mapper

var_dump($router->match($path));

array(3) {
  ["controller"]=>
  strng(3) "php"
  ["action"]=>
  string(19) "pear-net-url-mapper"
  ["params"]=>
  string(0) ""
}

http://blog.chibatch.jp/php/pear-net-url-mapper/commentの場合

// $path = "php/pear-net-url-mapper/comment";
var_dump($router->match($path));

array(3) {
  ["controller"]=>
  strng(3) "php"
  ["action"]=>
  string(19) "pear-net-url-mapper"
  ["params"]=>
  string(7) "comment"
}

phpControllerのpear-net-url-mapperActionに変数commentが渡される感じです。

ざっと書いてみました。（最後の例とか間違っているかも知れません）。
Net_URL_Mapperはとても便利に使えるライブラリです。

Zend FrameworkもPHP5でしか使えないし、もうPHP4とかいいじゃんと思うんですがまだ残っている以上仕方ないのでしょうか...。
やっぱりPHP4にも対応できるように作った方がよいのかな。みんなはどうしてるんでしょうか

MTでアップロードした画像にだけ適用

jQueryを使っているということは、少しコードを変えるだけで特定のクラスに対して右クリック禁止ということもできます。
試しにspan.mt-enclosure-imageの中の画像に対してだけ右クリックを禁止してみます。

サンプル（MTからアップロードした画像）

$(document).ready(function(){
  $(".mt-enclosure-image img").bind("contextmenu",function(event){
    return false;
  });
});

bind()、かなり便利なのでアイデアを思いつき次第書いていこうと思います。