かたつむりくんのWWW

複数ファイルを高速でアップロードできる Movable Type プラグイン「Multi Uploader」を使ってみた

alfasado さんの GitHubで公開されている「Multi Uploader」というプラグインを試してみました。

この「Multi Uploader」プラグインは、「jQuery File Upload」という jQuery プラグインを Movable Type のアイテムのアップロード機能に適用させたプラグインのようです。

この記事を書くときにさっそく使わせていただきましたが、これは必須のプラグインになると思いました!

使い方を簡単にご紹介します。

続きを読む

Git コマンドのヘルプをテキストファイルに出力する方法

Git において、コマンドの使い方などは git help で見ることができます。例えば「branch」コマンドについて知りたいときは、

git help branch

とすればOKです。これでターミナルにヘルプが表示されます(qで終了)。

そして、このヘルプをテキストファイルで出力することもできます。branch.txt というファイルで出力したいときは、

git help branch > branch.txt

とすればOKです。

しかし、このままだと、ターミナルでヘルプを表示したときにアンダーラインが引いてあるものや太字の大文字になっているものなどは、その装飾の情報も含まれて表示されてしまうため、おかしな状態になってしまいます。

SSYYNNOOPPSSIISS
       _g_i_t _b_r_a_n_c_h [--color[=<when>] | --no-color] [-r | -a]
               [-v [--abbrev=<length> | --no-abbrev]]
               [(--merged | --no-merged | --contains) [<commit>]]
       _g_i_t _b_r_a_n_c_h [--set-upstream | --track | --no-track] [-l] [-f] <branchname> [<start-point>]
       _g_i_t _b_r_a_n_c_h (-m | -M) [<oldbranch>] <newbranch>
       _g_i_t _b_r_a_n_c_h (-d | -D) [-r] <branchname>...
(抜粋)

そこで、colcrt や col という UNIX のコマンドを合わせて使えば良いみたいです。

git help branch | colcrt | col > branch.txt

以下のように、先ほどおかしなことになっていた装飾部分は、アンダーラインが引かれたきれいなテキストになって出力されます。

SYNOPSIS
       git branch [--color[=<when>] | --no-color] [-r | -a]
       --- ------
	       [-v [--abbrev=<length> | --no-abbrev]]
	       [(--merged | --no-merged | --contains) [<commit>]]
       git branch [--set-upstream | --track | --no-track] [-l] [-f] <branchname> [<start-point>]
       --- ------
       git branch (-m | -M) [<oldbranch>] <newbranch>
       --- ------
       git branch (-d | -D) [-r] <branchname>...
       --- ------
(抜粋)

ちなみに「|」は、左のコマンド結果を右のコマンド結果に渡すという意味です。

以上、自分用メモでした(col はなくてもいいかも)。

参考
UNIXの部屋 コマンド検索:col (*BSD/Linux)

MT 5.1 Beta 1 のカテゴリ一覧の「編集」ってちょっと違和感があるからカスタマイズ

Movable Type 5.1 Beta 1 のカテゴリ一覧の「編集」ってちょっと違和感がありますよね。

list_category_edit-1.png

こちらの記事(MT5.1ベータ ちょっと触ってみたよ - Hello World)でも書かれていますが、確かに編集っていうと編集画面に飛んで欲しいイメージです。名前を変更するだけだったら、そのまんま「名前を編集」でいい気がします。

ということで、「編集」を「名前を編集」にするカスタマイズです。

続きを読む

Movable Type 5.1 Beta 1 の「タイトル」と「本文」も並べ替えられるようにするカスタマイズ

mt5.1_title_sortable.png

待ちに待った Movable Type 5.1 Beta 1 が出ましたね。毎回、バージョンアップしたものを触るのは軽く興奮します。

Movable Type 5.1 Beta 1 リリース直後に、著名な方々から MT 5.1 に関するレポートが上がっています。その早さや内容には頭が下がります。

さて、僕は少し視点を変えて、一歩踏み込んだ記事を書こうと思います。

MT 5.1 のブログ記事やウェブページの編集画面では、タグ・概要・キーワード・カスタムフィールドをドラッグ&ドロップで並べ替えられるようになりました。少し地味かもしれませんが、意外と重宝される機能だと思います。

しかし、残念なことに、「タイトル」や「本文」については、並べ替えの対象になっていません。

今回は、この二つのフィールドについてもドラッグ&ドロップで並べ替えられるようにするカスタマイズを紹介します。MT 5.1 の管理画面のカスタマイズ記事第一弾です!

続きを読む

Movable Type 5.1 Beta 1 にバージョンアップ

2月15日、予告通り Movable Type 5.1 Beta 1 がリリースされました。

リリース直後に、ローカル環境にインストールしてみましたが、oscarさんもいつものごとく早速切り替えていることだし、今回はこのブログも Beta 1 の段階から MT 5.1 Beta 1 にバージョンアップしてみました。

やっぱり本番環境で検証するのが一番かなとw

カテゴリIDから、カテゴリラベルとベースネームを出力するMovable Typeプラグイン - Category Util

カテゴリIDから、カテゴリラベルとベースネームを出力する「Category Util」というMovable Typeプラグインを作りました。日頃お世話になっている方から需要があったので。

プラグインをインストールすると、以下のファンクションタグが使えるようになります。特にコンテキストには依存しないので、どのテンプレートでも使えると思います。

<$mt:CategoryUtilLabel id="n"$>
<$mt:CategoryUtilBasename id="n"$>

id モディファイアに取り出したいカテゴリのIDを指定してください。IDは一つしか指定できません。パフォーマンス的にはあまり良くないプラグインですが、場合によっては便利かもしれませんね。

MTAppjQuery 0.15 リリース - バグフィックス

MTAppjQuery - Movable Type 5 の管理画面をjQueryでカスタマイズしやすくするプラグイン」の MTAppjQuery.js 内にバグが見つかりました。

$.MTAppMultiCheckbox() をブログ記事編集画面のタグ欄に適用させた場合、保存したタグが正しく反映されませんでした。

これは MT の仕様上、タグが「, 」(カンマ + 半角スペース)という状態で表示されるのに対し、当プラグインでは単純にカンマで区切ってしまっていたため、余分な半角スペースが残ってしまうためででした。

このバグと、先日の「MTAppjQuery 0.14 のバグフィックス用の差分ファイル」の記事にあるバグもつぶしてありますので、今後お使いになる方は最新版をお使いいただくか、バージョン 0.14 をお使いの方は、MTAppjQuery.js を差し替えてください。

いずれも以下のページからダウンロードしてください。

なお、このバグは、おそらく過去のすべてのバージョンに同様に発生します。過去のバージョンをお使いの方は、MTAppjQuery.js を以下のように修正してください。

193行目付近
checked = value.split(',');
この部分を次のように差し替える
checked = value.split(',').map(function(s) {
    return $.trim(s);
});
221行目付近
checks = title.split(',');
この部分を次のように差し替える
checks = title.split(',').map(function(s) {
    return $.trim(s);
});

お手数をおかけして申し訳ございませんが、よろしくお願いいたします。また、ご指摘いただいた@havanaclub_さん、ありがとうございました!

No hyphen v0.02 リリース - Movable Type のブログ記事のファイル名がハイフンで始まるのを防ぐプラグイン

先日公開した「Movable Type のブログ記事のファイル名がハイフンで始まるのを防ぐプラグイン - No hyphen」をアップデートしました。

なんかもう、ファイル名の頭にハイフンがあったりアンダースコアがあったりするとかっこわるいから、いっそのこと取っ払っちゃえばいいじゃん、というオプションを付けました。

「システム」>「プラグイン」>「No hyphen」>「設定」から次の設定が可能です。

  • 「Remove the first hyphen」にチェックを入れると、先頭のハイフンを削除
  • 「and underscore」にチェックを入れると、ハイフンとアンダースコアを削除
  • どちらにもチェックを入れない場合は「Prefix」欄に入力した文字列が先頭のハイフンの手前に挿入される

以上です。

jQuery の .end() メソッドが便利ですよ

たぶん jQuery を使い始めたばかりの人はあまり使わないであろう .end() メソッドですが、これ、かなり便利なんですよね。

僕も最初はあまり使っていませんでしたが、最近は積極的に使っています。ソースも短くかけるうえに、パフォーマンス的にも良いので是非使っていきたいメソッドです。

今回は、簡単な例で .end() を紹介してみます。

続きを読む

Movable Type のブログ記事のファイル名がハイフンで始まるのを防ぐプラグイン - No hyphen

昨日、ふと@mersyさんのこんなつぶやきと、

no_hyphen01.png

その先の記事を見て、Movable Type で自動的に振られるファイル名がハイフンで始まるとき、その頭にあらかじめ指定した接頭辞を付けてハイフンで始まるのを防いでくれるプラグインを作りました。

ブログ記事を保存するタイミングでファイル名をチェックする仕様になっています。

インストールは、mt の plugins ディレクトリに Nohyphen ディレクトリをアップロードすればOKです。接頭辞は「システム」>「プラグイン」>「No hyphen」>「設定」で設定します(初期値は mt です)。

最初は「mersy-」ってなるように決められていたやつでしたがw

微妙ですが一応アップしておきます。

以上です。

MTAppjQuery 0.14 のバグフィックス用の差分ファイル

MTAppjQuery - Movable Type 5 の管理画面をjQueryでカスタマイズしやすくするプラグイン」の MTAppjQuery.js 内にバグが見つかりました。

バグの内容は、$.MTAppCustomize() において、basename に assets を指定し、さらに show_field を 0 にした場合に JavaScript エラーが発生します。

バージョン 0.14 用の MTAppjQuery.js を用意しましたので、ご利用の方はこちらに差し替えてください。

なお、このバグは、おそらく過去のすべてのバージョンに同様に発生します。過去のバージョンをお使いの方は、MTAppjQuery.js を以下のように修正してください。

$.MTAppCustomize()を定義する関数の最後の方
$(fieldID).each(function(){
    $('h3.widget-label span',this).text(op.label);
    if (op.hint != '') $(this).showHint(op.hint);
});
// show_field
if (op.show_field == 0) {
    $(this).addClass('hidden');
}
この部分を次のように差し替える
$(fieldID).each(function(){
    if (op.label != '') $('h3.widget-label span',this).text(op.label);
    if (op.hint != '') $(this).showHint(op.hint);
    if (op.show_field == 0) $(this).addClass('hidden');
});

お手数をおかけして申し訳ございませんが、よろしくお願いいたします。

2011年、あけましておめでとうございます。

新年、あけましておめでとうございます。

昨年は、Movable Type、jQuery を中心にお勉強した1年でした。今年も引き続き、Movable Type、jQuery のスキルを高め、いろいろなプラグインを公開したり、サイト制作のお手伝いをしたり、自分が身につけた知識をアウトプットしたりしていきたいと思います。

今年はさらに、HTML5、CSS3、iPhone サイトなどについても積極的に勉強していきたいなと思います。また、Perl についてもしっかりと勉強したいと思います。

と、書いていると非常に欲張り度満点ですが(笑)、今年も引き続きがんばりますので、よろしくお願いいたします!

親ウェブサイトのモジュールを使ってブログ一覧のグローバルナビゲーションを作る

「親ウェブサイトのモジュールを利用して、ブログ一覧のグローバルナビゲーションを作るにはどうしたら良いか」という質問をいただきました。実現する方法は色々ありますが、その一例を書いてみます。

続きを読む

flexibleSearch.js で読み込む JSON を Movable Type で出力する

flexibleSearch.js - ページ送りに対応した高速 Ajax 検索が可能な jQuery プラグイン」の検索対象となる JSON を、Movable Type で出力する方法を紹介します。

続きを読む

ページ送りに対応した高速 Ajax 検索が可能な jQuery プラグイン - flexibleSearch.js ver1.00 リリース

flexibleSearch.js とは、柔軟で高速な Ajax 検索を実現する jQuery プラグインです。

僕が検索に求める2大要素は「速さ」と「精度」です。このブログで公開している「jQuery で実現する高速キーワード検索とタグ検索(Movable Type 版)- jQuery Search Box」という jQuery プラグインは、個人的には、その2大要素をある程度のレベルで満たしていると思っていました(ホントある程度ね(^^ゞ)。

しかし、使っていく上で、色々とやりたいことが沸いてきたり要望があったりしました。

  • 大文字・小文字、スペースを認識した完全一致検索がしたい
  • ページ送りしたい
  • チェックボックスセレクトボックスで条件を選べたりできるようにしたい
  • 検索項目の絞り込みは複数の項目を選びたい、などなど

また、何より jQuery Search Box はスペースの処理がイケてなかったんです。

今回、これらの機能を満たせるように「jQuery Search Box」をかなり書き直したので、flexibleSearch.js と名前を変えてリリースすることにしました。

jQuery Search Box で気に入っていた「タグ検索」は、利用シーンが限られる機能なので、本体からは外しました。これはまた別の形で取り入れようと思います(多分使われてないしw)。

flexibleSearch.js の詳細は以下のページからお願いします。十分テストはしたつもりですが、何かあったら以下のページでコメントいただけると嬉しいです。

マンガでわかるJavaScript - 感想

978-4798027838.jpg

なぜか衝動買いしてしまった JavaScript の入門書『マンガでわかるJavaScript』を読みました。

専門書の場合、マンガが載っていても結局内容は難しいという本はよくありますが、この本は違うと思いました。

説明が分かりやすくて丁寧で、図もイメージしやすくて理解を助けてくれたり、ソースコードにも丁寧にコメントが書かれていたりと、すごく分かり易いです。

また、内容が必要最小限に絞られている点が良いのかもしれません。必要最小限と言っても、この本にある内容だけでもかなり色々な事ができるようになると思います。

JavaScript の入門書をお探しの方、他の入門書で挫折した方はぜひ本屋さんで立ち読みしてみると良いでしょう(*^_^*)

次は、最近話題の書籍『HTML5+CSS3で作る 魅せるiPhoneサイト』を読みます。

エディタでコーディングしているときの素早く前の位置に戻るプチTips

エディタでコーディングしているときなどで、素早く一つ前の位置(行)に戻れるTipsを思いつきました。僕にとっては「閃いた!」って感じでしたw

続きを読む

jQueryで要素に特定のクラス名が設定されていなければ true を返す - .notClasses

jQuery で要素に複数のクラスが指定されているか調べる .hasClasses()」の逆バージョンです。セレクタで指定したクラスがすべて設定されていない場合に true を返し、一つでも設定されていれば false を返します。

jQuery.fn.extend({
    hasClasses: function(selector) {
        if (typeof selector == "string") {
            selector = /^\./.test(selector) 
                ? selector.replace(/^\./,"").split(".")
                : selector.replace(/^ | $/g,"").split(" "); 
        }
        for (var i = -1,j = 0, n = selector.length; ++i < n;) {
            if (this.hasClass(selector[i])) j++;
        }
        return n === j;
    },
    notClasses: function(selector) {
       return !this.hasClasses(selector);
    }
});

このメソッドは、.hasClasses() で調べて、結果を反転して返すだけなので、セレクタの指定方法などは、.hasClasses() の記事を参照してください。

以上です。

jQueryで多数の要素を生成して追加する場合のパフォーマンスについて

jQuery で多数の要素を生成して別の要素に追加する場合、どんな書き方が速いのかなーと思って試してみました。

今回は、3,000回ループを回して既存の要素に追加していくというのを、パッと思いつく感じの6パターンで試してみました。

続きを読む

MTDDC Meetup FUKUSHIMA 2010 に行ってきました #mtddcfks

日付が変わって昨日(11月6日)、ビッグパレットふくしまにて開催された、MTDDC Meetup FUKUSHIMA 2010に行ってきました。

東京からだと往復の交通費と参加費で1万5千円近くしてしまうので最初は迷っていましたが、行ってみて本当に良かったと思います。

簡単ですが、一言ずつ感想を。

続きを読む