Rewish

WindowsでCakePHPコンソール(bake)を使い易くする方法

2010-02-03T02:33:44Z

CakePHP v1.3.0-betaが出ていたので、久しぶりにWindows上でCakePHPを使ってみました。

普段からWindowsのMS-DOSコマンドプロンプトを使うことがほとんど無い僕は、CakePHPのコンソール(bake)を使うために、いちいちコマンドプロンプトを立ち上げてcdで移動して・・・と言う作業が凄く面倒に感じた訳です。

なので、そんな僕の悩みを解決するため、簡単なバッチファイルを書いてみました。

ダウンロード

console.bat

バッチファイルの使い方

ダウンロードしたバッチファイルを、cake(コア)フォルダと同じディレクトリに置いて実行して下さい。

自動的にpath\to\cake\consoleへのパスを通し、コマンドを入力可能な状態にしてくれます。

後はプロジェクトフォルダ(appなど)に移動して、cake bakeやら何やらお好きにどうぞ状態です。簡単ですね。

バッチファイルのソースコードと解説

@echo off

goto console

:init
rem Path
if exist "%CD%\cake\console" (
  set "CAKECONSOLE=%CD%\cake\console"
) else (
  if exist "%CD%\..\cake\console" (
    set "CAKECONSOLE=%CD%\..\cake\console"
  ) else (
    echo cake\consoleが見つかりませんでした。
    echo.
    echo cake\consoleのパスを入力して下さい。
    set /p CAKECONSOLE=:
  )
)
set "PATH=%PATH%;%CAKECONSOLE%"
rem Alias
doskey cat=type $*
doskey ls=dir /w $*
doskey ll=dir $*
doskey la=dir /a $*
doskey rm=del $*
exit /b

:console
if "%1" equ "init" (
  call :init
) else (
  prompt $P$_$G$S
  start "" /b %COMSPEC% /k %~f0 init
)

cake\consoleへパスを通す

まずバッチファイルの実行フォルダと同階層でcake\consoleの存在をチェックし、あれば%PATH%にパスをセットして次へ。

無ければ、一階層下のフォルダでcake\consoleを探します。デフォルトのフォルダ構成で開発してる場合は、プロジェクトフォルダ(app)にバッチファイルを置くとスムーズです。

cake\consoleが見つからない場合はパスを入力する画面になります。

Aliasの設定

lsとかcatとか打っちゃって悲しい気分になるのを防ぎます。

PHPのパスも通したい場合

19行目を以下のように変更。

set "PATH=%PATH%;%CAKECONSOLE%;PHPのパス"

PHPのパスはC:\phpやC:\xampp\phpなどですね。

まとめ

バッチファイルをcake(コア)フォルダと同じ階層に配置
バッチファイルを実行してCakePHPコンソールを堪能
おまけ機能でcake(コア)フォルダの一階層上に置いても動く

WP HatenaNotation v1.0.0を公開しました

2010-02-01T17:01:10Z

久しぶりにWordPressのはてな記法プラグインをアップデートしました。

使い易さの向上、記法の追加などを含む、割と大きめの更新になってます。

以下、v1.0.0の更新情報。

設定メニューの位置変更

設定画面へのリンクを【投稿】メニューから【設定】メニューに変更しました。

包含要素の有無切り替え設定

HatenaSyntaxで変換した文字列を包含する要素div.sectionは、WordPressで使用する場合はあまり必要ないので、包含要素の有無を切り替えられるようにしました。

なお、この設定のデフォルト値は有です。

無効日指定の選択方法を変更

DETETIME型の入力を手動でさせるのは、あまりにも乱暴だったので、簡易的な記事一覧から選択出来るようにしました。

render呼び出し関数wphn_render()を定義

the_content()を使用していない場合や、コメントではてな記法を使用する際などに、より簡単に呼び出せるようにwphn_render();と言う関数を定義しました。

wphn_render($content);のように、変換したい文字列を渡して使用します。

[http://～～:title]に対応

タイトルを自動で取得してくれるナイスな記法[http://～～:title]に対応しました。

※タイトルのキャッシュを保存するため、DBに新しいテーブルを作成します。

いくつかのオプションを削除

HTMLエスケープオプションを削除し、常にエスケープしないようにしました。
設定の意味がほとんど無かった、記事の識別子オプションを削除しました。

今後の予定

記事ごとに「はてな記法」の有効/無効を切り替える機能
はてな記法適用後の記事をエクスポート
ライブラリで実装できない記法の実装

ちょっと開発遅めですが、こんな感じで。

ブログに「はてなスター」を設置してAutoPagerizeに対応する

2010-01-08T03:17:03Z

去年の末ごろに、はてなスターを設置してAutoPagerizeに対応してみました。

と言う報告だけで終わるのも何なので、はてなスターを設置し、AutoPagerizeに対応するまでの流れをざっくり紹介したいと思います。

※今回はAutoPagerizeと同時にAutoPatchWorkにも対応します。

はてなスターを設置

はてなスターをブログに設置するにはを参考に、以下のコードをブログに貼り付ける。

http://s.hatena.ne.jp/はてなID/blogs でブログを登録し表示されるコード
はてなスター追加箇所を指定するためのコード

ウチのブログの場合以下のようなコード。

<script type="text/javascript" src="http://s.hatena.ne.jp/js/HatenaStar.js"></script>

Hatena.Star.Token = 'トークン';
Hatena.Star.SiteConfig = {
	entryNodes: {
		'article > header': {
			uri: 'h1 a',
			title: 'h1',
			container: 'h1'
		}
	}
};

AutoPagerize(+AutoPatchWork)への対応

継ぎ足しされるノードをHatena.Star.EntryLoader.loadNewEntries()に渡すイベントリスナーをwindow.addEventListener()で登録する。

注意点として、Hatena.Star.SiteConfig.entryNodesで指定したセレクタに、継ぎ足しされるノードが含まれる場合、継ぎ足しされるノードからのセレクタに修正する必要がある。

ウチのブログの場合、継ぎ足しされるノードがarticle要素なので、以下のようにセレクタからarticle要素を取り除いて対応した。

var StarConfig = Hatena.Star.SiteConfig.entryNodes;
var NodeInsert = function(evt) {
	Hatena.Star.SiteConfig.entryNodes = {
		'> header': StarConfig['article > header']
	};
	Hatena.Star.EntryLoader.loadNewEntries(evt.target);
};
window.addEventListener('AutoPagerize_DOMNodeInserted', NodeInsert, false);
window.addEventListener('AutoPatchWork.DOMNodeInserted', NodeInsert, false);

これで継ぎ足しされた部分にも、はてなスターが追加されます。

あと、リスナーの登録にAutoPagerize_DOMNodeInsertedを使っているので、AutoPagerize 0.40以降でないと動作しません。

参考: AutoPagerizeで継ぎ足された部分に自分のスクリプトを適用する方法あれこれ – 0xFF

最後に

はてなスターの連打はキケンです！

ペタるリンクを付けるGreasemonkeyを更新しました

2009-12-31T16:09:50Z

少し前に書いたアメーバの『ペタ』を手軽に付けられるGreasemonkeyをアメーバの仕様変更に対応して公開しました。意外に需要のあるスクリプトだったようなので、新しいポストで報告しておきます。

と言うわけで、かなり簡潔ですが今年最後のポストでした。

皆さん良いお年を！

jQueryの開発コードをビルドして使う (Win & Mac)

2009-12-15T09:26:33Z

jQueryの開発リポジトリに入っているファイルは、開発用のためモジュール毎に分割されています。

コードを追う時は良いですが、開発中のjQueryが使いたい！と言う時に、これらを全て読み込むのはちょっと面倒なので、ビルドして一つのファイルにしてみたいと思います。

今回は、Windowsの場合とMacの場合二つの方法を紹介します。

Windowsの場合

Windows XP SP3へのインストールを想定しています。その他の環境では動作しない可能性があります。

Gitをインストール

msysgit – Project Hosting on Google Codeからインストーラーをダウンロード。

※今回はGit-1.6.5.1-preview20091022.exeを選択

インストールの手順は以下の通り。

Welcome to the Git Setup Wizard
1. Next >
Information
1. Next >
Select Destination Location
1. Next >
Select Start Menu Folder
1. Next >
Select Additional Tasks
1. Next >
Adjusting your PATH environment
1. Run Git and included Unix tools the Windows Command Promptを選択
2. Next >
Choosing CR/LF behavior
1. Use Unix style line endingsを選択
2. Next >

jQueryをチェックアウト

適当な場所にフォルダを作る (今回はD:\jquery-devを作成)
作成したフォルダを右クリック
Git Bash Hereをクリック
Bashが立ち上がるので、以下のコマンドを実行する

git clone git://github.com/jquery/jquery.git .

※コピーして貼り付け: タイトルバーを右クリック(またはAlt+Space) -> 編集 -> 貼り付け

以上でD:\jquery-devにjQueryの開発コードがコピーされる。

Apache Antをインストール

Apache Ant – Binary DistributionsからApache Antのバイナリをダウンロード。

※今回はapache-ant-1.7.1-bin.zipを選択

zipアーカイブを解凍
出来たフォルダ(apache-ant-1.7.1)をantにリネーム
antフォルダをCドライブ直下へ移動

C:\ant\binのようなファイル構成になっていればOK。

ビルド用のバッチファイルを作成

D:\jquery-dev\build.batを以下の内容で作成。

@echo off

set /p arg="オプションを指定しますか？[空エンター可]: "
C:\ant\bin\ant %arg%

いよいよビルド！

上記で作成したbuild.batを実行してエンターを押せば、D:\jquery-dev\dist内にjquery.jsが作成される。

minified版を作りたい場合は、「オプションを指定しますか？」に「min」と答えて下さい。

Macの場合

Mac Book Pro (Mac OSX Snow Leopard)へのインストールを想定しています。その他の環境では動作しない可能性があります

Gitをインストール

git-osx-installer – Project Hosting on Google Codeからdmgをダウンロード
今回はgit-1.6.5.5-intel-leopard.dmgを選択
git-1.6.5.5-intel-leopard.dmgをダブルクリックしてマウント
デスクトップのGit 1.6.5.5 Intel Leopardを開く
git-1.6.5.5-intel-leopard.pkgを実行し、ウィザードに従いインストール

jQueryをチェックアウト

ターミナルを起動し、以下のコマンドを実行する。

git clone git://github.com/jquery/jquery.git $HOME/jquery-dev

上記のコマンドで、ユーザーのホームディレクトリ /Users/ユーザー名/jQuery-dev にjQueryの開発コードがコピーされる。

ビルド！

ターミナルを起動し、以下のコマンドを一行ずつ実行する。

cd $HOME/jQuery-dev/
make

/Users/ユーザー名/jQuery-dev/dist内にjquery.js及びjquery.min.jsが作成される。

シンプルなイベントカレンダーを実装するjQueryプラグイン

2010-01-20T01:34:07Z

ある朝僕は、以下の用件を満たすカレンダープラグインを探していました。

シンプルなHTMLを吐いてデザインの変更が容易
コールバック関数である程度処理をイジれる
月移動のアニメーションが素人ウケしそう

小一時間色々なプラグインを見ましたが、中々しっくり来るモノが無く、「これは探すより作った方が早そうかなぁ」と思ったので作ってみました。

機能概要

記事の初めで大方出ていますが、主に以下の機能を備えています。

月移動時のスライドアニメーション
生成するHTMLを包含する要素のclass変更
イベント追加、月移動などに対応するコールバック関数
JSON形式でのイベント追加
イベント用JSONの先読み機能 (月移動時の遅延対策)
表示中の月に属さない日付の表示、非表示

ダウンロード

jQuery.calendar [圧縮版] – v1.0.2

※開発版はrewish’s jQuery.calendar at master – GitHubに置いています。

2010-01-20 – v1.0.2 – bugfix
2009-12-05 – v1.0.1 – bugfix
2009-11-05 – v1.0.0 – 公開

動作デモ

デモを見る

導入方法

jQueryプラグインではお馴染み、jQueryを読み込んでからプラグインを読み込む。

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.calendar-min.js"></script>

実際にカレンダーを呼び出すコードは以下のようになります。

jQuery(document).ready(function($) {
	// 初期状態でカレンダーを呼び出す
	$(expr).calendar();

	// オプションを付けて呼び出す
	$(expr).calendar({
		オプション名: オプション値,
		オプション名: オプション値
	});
});

オプション

以下のオプションが指定できます。

オプション名	オプション値	初期値	説明
year	初期表示する年	現在の年
month	初期表示する月	現在の月
week	日曜日から始まる週の配列	[日, 月, 火, 水, 木, 金, 土]	thead部分
caption	表示月のキャプション	%Y年%M月	%Y=年、%M=月に置換
navi	0=前月、1=次月の配列	[前の月へ, 次の月へ]
todayLink	「今日」へのリンク	今日 [%Y年%M月%D日]	%Y=年、%M=月、%D=日に置換
moveTime	スライドアニメの速度	700
events	イベント(行事)を指定		イベントを追加
hideOther	表示中の月以外の日付を非表示	false	非表示にする場合はtrue
cssClass	包含要素のclass	jqueryCalendar
addDay	日付追加コールバック		addDay
addEvent	イベント追加コールバック		addEvent
beforeMove	月移動前のコールバック		beforeMove
afterMove	月移動後のコールバック		afterMove
preloadEvent	イベントデータ先読み		イベントをプリロード

イベントを追加

イベントを追加するには、オプションeventsに連想配列を渡します。

addEventコールバック関数をデフォルトの状態で使用する場合は、以下のような書式になります。

$(expr).calendar({
	events: {
		// 月と日はゼロパディングしてもしなくてもOK
		'2009-10-01': {
			title: 'titleを指定すると、指定した文字列がtitle属性に挿入される',
			url: 'urlを指定した場合リンクになる'
		},
		'2009-10-2': {
			title: 'titleを指定すると、指定した文字列がtitle属性に挿入される',
			url: 'urlを指定した場合リンクになる'
		}
	}
});

addEventコールバック関数を使って独自の処理にする場合は、連想配列の内容に制限はありません。

$(expr).calendar({
	events: {
		'2009-10-01': {
			hoge: 'addEventの第二引数で受け取れる (evt.hoge など)'
		}
	}
});

詳しくはコールバック関数 – addEvent参照して下さい。

コールバック関数

addDay

表示月の日付セルを追加する際に呼ばれる関数。

実行するタイミング: 日付セル追加時
第一引数: 日付セル(td)のjQueryオブジェクト

$(expr).calendar({
	addDay: function(td) {
		// 日付の後ろに「日」を付ける (例: 10日)
		td.text(td.text() + '日');
	}
});

addEvent

イベント(行事)を追加する際に呼ばれる関数。

実行するタイミング: イベント(行事)追加時
第一引数: 日付セル(td)のjQueryオブジェクト
第二引数: eventsオプションで指定したイベント

第二引数にはeventsで指定した日付の内容がそのまま渡される。イベントを追加の例では連想配列を渡しています。

$(expr).calendar({
	// 以下は初期値
	addEvent: function(td, evt) {
		var elem = typeof evt.url != 'undefined'
			? $('<a />').attr('href', evt.url)
			: $('<span />');
		if (evt.id) {
			elem.attr('id', 'event-' + evt.id);
		}
		if (evt.title) {
			elem.attr('title', evt.title);
		}
		elem.text(td.text());
		td.text('').append(elem).addClass('event');
	}
});

beforeMove & afterMove

月移動前後に呼ばれる関数。

実行するタイミング: 月移動前後
第一引数: 全オプションの連想配列
第二引数: 移動する年
第三引数: 移動する月

$(expr).calendar({
	// 月移動前に次のイベントをセット
	beforeMove: function(option, year, month) {
		// /hoge/YYYYMM からJSONを取得
		$.getJson('/hoge/' + year + month, function(json) {
			option.events = json;
		});
	}
});

preloadEventがあるので使用用途が微妙。

イベントをプリロード

イベントデータを月ごとに読み込む場合、月移動時にAjaxなどでイベントデータを読み込むと遅延が発生するので、プリロード(先読み)機能を用意しました。

実行するタイミング: カレンダーを表示した直後
第一引数: 表示している年
第二引数: 表示している月

使用方法

オプションpreloadEventに関数を定義して、以下のようにイベントデータをreturnして下さい。

$(expr).calendar({
	preloadEvent: function(year, month) {
		// 表示月が2009年10月の場合
		:
		: AjaxでJSONを読み込むなど
		:
		return {
			'2009-09-1': {
				title: '前月のイベント'
			},
			'2009-11-1': {
				title: '次月のイベント'
			}
		}
	}
});

この場合、前月と次月のイベントを含むデータをreturnしなければなりません。

イベントデータが多い場合は、前月と次月を分けて記述することも出来ます。

$(expr).calendar({
	preloadEvent: function(year, month) {
		// 表示月が2009年10月の場合
		:
		: AjaxでJSONを読み込むなど
		:
		return {
			// 前月のデータはprevの中に
			prev: {
				'2009-09-1': {
					title: '前月のイベント'
				}
			},
			// 次月のデータはnextの中に
			next: {
				'2009-11-1': {
					title: '次月のイベント'
				}
			}
		}
	}
});

イベント追加の処理が少なくなるので、少しだけ速くなります。

MacBook Proを購入したのでセットアップ

2009-10-13T03:02:52Z

様々な誘惑に負けてMacBook Proを購入したのでセットアップの内容をメモ。

Macを触るのは今回が初めてと言うことで、Macbook (with Snow Leopard) 買った後にやったことまとめ – IT戦記を大いに参考にしつつ、部分的に自分なりの設定にしてみました。

※とりあえず、トラックパッドは良い仕事してますね。

初期設定

お気に入りの日本語フォント、VLゴシックを予めインストールしておく。

トラックパッドの設定

スクロールの速さは左から5番目で、とりあえず様子見。

ターミナルの設定

開くシェルを/bin/bashに変更。zshはまだよく解りません。

フォントはVL Gothic Regular 14pt、文字間隔 1.10、行間隔 1.10 に変更。

Firefoxの設定

アドオン

意外に一杯あったのでここでの掲載は控えることに。機会があればまた公開します。

ブックマーク

[ブックマーク] -> [ブックマークの管理] -> [インポートとバックアップ]から、バックアップ及び復元を行えば簡単に移せる。まだまだローカルブックマークも現役。

パスワード

Sxipperでエクスポート及びインポート。あと、マスターパスワードも設定しておく。

ブックマークツールバーのfavicon

デフォルトではfaviconが表示されないので、鳥獣保護区 | Firefox のブックマークツールバーに favicon を表示するを参考に、Stylishで白紙のスタイルを作成して以下を貼り付ける。

@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);

toolbarbutton.bookmark-item:not([container="true"]) > .toolbarbutton-icon {
	padding	: 0px !important;
	margin	: 0px !important;
	width	: 16px;
	height	: 16px;
	display	: inline !important;
}

Thunderbirdの設定

面倒なのでWindowsからProfileをコピーして、無効なアドオンと、不要なアカウントを削除。

Growlと連携するため、アドオンのGrowl Notificationsをインストール。

MacPortsをインストール

手順についてはamachangさんの記事に載っているので割愛。

※amachangさんの記事には手動でパスを追加すると書いてあるけれど、インストールした時点で.profileにパスが記述されていた。

後で適当に必要なパッケージを入れる。

bashの設定

.bash_profile

デフォルトの設定ではターミナルログイン時に.bashrcが読み込まれないので、.bash_profileを以下のように作成。

$ echo source \~/.bashrc > ~/.bash_profile

これでターミナルログイン時に.bashrcが読み込まれるようになる。

.bashrc

Cygwinの設定をそのまま持ってきて以下の内容で作成。

$ vi ~/.bashrc

# Prompt
PS1='\[\e]0;\w\a\]\n\[\e[32m\]\u@localhost \[\e[0m\][\[\e[33m\]\w\[\e[0m\]]\n\$ '

# History
HISTIGNORE="[   ]*:&:bg:fg:exit"
HISTFILE="$HOME/.bash_history"
HISTFILESIZE=100000
HISTSIZE=100000

# Alias
alias ls='ls -G'
alias ll='ls -l'
alias la='ll -a'
alias vi='vim'

その他のアプリケーション

使い続けるかは別として、必要なので以下をインストール。

こんな感じで初期段階のセットアップは大体終了。

VMware PlayerにVMware Toolsをインストールして快適開発

2009-09-21T15:08:15Z

Dropboxを使い出してから自分用メモをブログに書くことが少なくなった気がするので、ちょっと古いですがVMware Toolsで快適な環境を作るメモ。

VMware Toolsを導入すると、「ファイルを開いたままVMware(samba)を終了してしまい、Explorerが固まってうわっふじこ」が無くなります。

その他、VMwareを起動していなくてもファイルを閲覧・編集出来たり、CGIモードじゃなくてもパーミッションの設定を(常に書き込み権限が与えられるため)スキップ出来たり、ホストOSと時刻を同期出来たり、とにかく便利になるのでオススメです。

VMware Toolsのディスクイメージをダウンロード

ドライバとツール – VMwareからVMware Toolsのディスクイメージをダウンロード。

今回はCentOS 5.3の入ったVMwareにインストールするのでLinux版のisoを選択。

VMware Toolsをインストール

まず、先ほどダウンロードしたISOをCDROMとして読み込むための設定をvmxファイルに記述。

ide1:0.autodetect = "TRUE"
ide1:0.present = "TRUE"
ide1:0.fileName = "path\to\VMware-tools-linux-116369.iso"
ide1:0.deviceType = "cdrom-image"

そして起動。CDROMをマウントしてRPMでVMwareToolsをインストール。

[root@dev-srv ~]# mkdir /mnt/cd
[root@dev-srv ~]# mount -r /dev/cdrom /mnt/cd
[root@dev-srv ~]# rpm -ivh /mnt/cd/VMwareTools-e.x.p-116369.i386.rpm
[root@dev-srv ~]# umount /dev/cdrom

以下の作業はVMware Player上で行う(実行するとネットワークが切断されるのでSSHはNG)。

[root@dev-srv ~]# /usr/bin/vmware-config-tools.pl

途中でSYNCドライバをインストールしますか？と聞かれるので空エンターで[no]を選択。

ここで一度VMware Playerを終了。

[root@dev-srv ~]# halt -p

vmxファイルに設定を記述

vmxファイルに時間同期の設定と共有フォルダの設定を記述。

# ホストOSとゲストOSの時間を同期
tools.syncTime = "TRUE"

# 共有フォルダの有効/無効 (FALSEで有効)
isolation.tools.hgfs.disable = "FALSE"

# 設定するフォルダの数
sharedFolder.maxNum = "2"

sharedFolder0.enabled     = "TRUE"
sharedFolder0.present     = "TRUE"
sharedFolder0.writeAccess = "TRUE"
sharedFolder0.readAccess  = "TRUE"
sharedFolder0.hostPath    = "共有するフォルダのパス(ホストOS側)"
sharedFolder0.guestName   = "ゲストOSでのディレクトリ名"
sharedFolder0.eXpiration  = "never"

# /mnt/hgfs/foo
sharedFolder1.enabled     = "TRUE"
sharedFolder1.present     = "TRUE"
sharedFolder1.writeAccess = "TRUE"
sharedFolder1.readAccess  = "TRUE"
sharedFolder1.hostPath    = "D:\foo"
sharedFolder1.guestName   = "foo"
sharedFolder1.eXpiration  = "never"

設定が終ったらVMware Playerを起動。

/mnt/hgfs以下にsharedFolder*.guestNameで設定した名前のディレクトリが出来ていればOK。

「共有フォルダが無効になっています」と言われる場合

VMware Player上部のメニューから共有フォルダを有効にする。

[常に有効]を選んでOKを押せば共有フォルダが有効になる。

ちょっと便利な使い方

シンボリックリンクを作成してパスを本番環境に合わせると色々スムーズ。

共有フォルダ名が hoge 本番環境のパスが /home/project/www の場合

[root@dev-srv ~]# ln -s /mnt/hgfs/hoge /home/project/www

Windows以外のOSならこんなことしなくてもいいんだけども。

JavaScriptのDateオブジェクトを拡張してPHPのdate関数を実装

2009-11-14T18:56:41Z

某勉強会のグループチャットにて、『JavaScriptでXMLを取得、パースして適当に表示しなさい』と言う宿題が出た時、ちょっと欲しいなぁと思ったので勉強がてら作ってみました。

一応date関数に対応する全てのフォーマット文字列が使えますが、タイムゾーン周りを正確に実装するのは実質不可能なので、eは「Asia/Tokyo」、Tは「JST」固定になっています。

その他、副産物で日付周りのメソッドも色々生えてるので、良かったら使ってみて下さい。

ダウンロード

php_date.js – 圧縮版 – v0.2.0

2009-09-09 – v0.2.0 – パース部分を大幅に書き換え
2009-08-26 – v0.1.2 – パース部分を修正
2009-08-25 – v0.1.1 – パース部分を修正
2009-08-19 – v0.1.0 – 公開

簡単な使い方

date関数風に使う基本

インスタンス化したDateオブジェクトのformatメソッドを使ってdate関数風にフォーマット。

var obj = new Date;
alert(obj.format('Y-m-d H:i:s'));
// 2005-08-15 15:52:01

定数を使う

定義済みの定数にある定数(っぽいモノ)も使えます。

var obj = new Date;
alert(obj.format(Date.ISO8601));
// 2005-08-15T15:52:01+09:00
alert(obj.format(Date.RFC822));
// Mon, 15 Aug 05 15:52:01 +0900

日付文字列をパース

Date.parse()を拡張して、定数で定義されているフォーマットもパース出来るようにしました。

alert(Date.parse('2005-08-15T15:52:01+09:00'));
// 1124088721000
alert(Date.parse('Wed, 19 Aug 09 00:12:58 +0900'));
// 1250608378000

フォーマット文字列と同時にタイムスタンプもセット

formatメソッドの第二引数に ミリ秒単位のUNIXタイムスタンプ または Date.parse()でパース出来る日付文字列 をセットすることで好きな日時を出力できます。

var obj = new Date;
alert(obj.format('Y-m-d H:i:s', 1124088721000));
// 2005-08-15 15:52:01
alert(obj.format('Y-m-d H:i:s', '2009-12-20T18:32:31+00:00'));
// 2009-12-20 09:32:31

※セットした日時は日付を出力するまでの間のみ有効です。継続的に日付をセットしたい場合はsetTimeメソッドを使用して下さい。

以上、簡単な使い方でした。

APIドキュメント

JavaScript用のドキュメント自動出力ツールJsDoc Toolkitを使ってAPIドキュメントを作成してみました。しかしJsDoc Toolkitはあんまりメジャーじゃないっぽいですね。

詳しくはAPIリファレンスをご覧下さい。

利用シーン

作っておいて何ですが、JavaScriptでガッツリ日付処理する事ってあんまり無いですね。

Expiresヘッダを送出するPHPのクラスとmod_rewrite

2009-10-16T18:56:28Z

レンタルサーバーではmod_expiresが使えない場合が多いので、PHPとmod_rewriteで頑張って追加してみよう的な感じです。

ただ、以下で示す方法は、画像などの静的ファイルにExpiresヘッダを追加するため、ファイル数分のPHPが動くのでサーバーに大きな負荷をかけてしまいます。

上記理由により、アクセスが多いサイトでは、使用しない方が無難かも知れません。

概要

header関数を利用してExpires、Last-Modified、Cache-control、Content-Typeを送出するPHPのクラスと、それを利用するためのmod_rewriteの設定。

大まかな処理の流れ

リクエストされたファイルが存在する場合、ファイルのフルパスをPHPに渡して処理。
拡張子からMIMEタイプを判別してContent-Typeを送出。
デフォルトの設定ではGZIP圧縮してからファイルを出力。

ダウンロード

ExpiresHeader.php – v0.1.0

使い方

PHPの設定

適当なPHPファイルを作ってExpiresHeader.phpを読み込み、必要に応じてMIMEタイプの追加やコンフィグの書き換えを行う。

今回はeh.phpと言うファイルを作成。

<?php
// eh.php
require '/path/to/ExpiresHeader.php';
try {
	$eh = new ExpiresHeader();
	// ファイルをセット
	$eh->setFile($_GET['file']);
	// コンフィグ
	$eh->setConfig(array(
		'days' => 7, // キャッシュは7日間有効 (初期値は30)
		'gzip' => false // GZIP圧縮はしない (初期値はtrue)
	));
	// MIMEタイプ追加
	$eh->setMimeType(array(
		'html' => 'text/html',
		'css' => 'text/css'
	));
	$eh->display();
} catch (Exception $e) {
	header('HTTP', true, $e->getCode());
	echo $e->getMessage();
	exit(0);
}

/path/to/の部分は適宜書き換え。

.htaccessの設定

RewriteEngine On
RewriteBase /
# 存在するファイルのみ有効
RewriteCond %{REQUEST_FILENAME} -f
# ヘッダを送出するファイルの拡張子
RewriteCond %{REQUEST_FILENAME} "\.(jpe?g|gif|png|ico|html?|xml|css|js|rdf|rss|xsl|swf|flv)$"
# PHPにファイルのフルパスを渡す
RewriteRule .+ /path/to/eh.php?file=%{REQUEST_FILENAME} [L]

/path/to/の部分は適宜書き換え。

以上で設定は終り。

注意点として、セキュリティ上の理由から、PHPを直接呼び出す事は出来なくなっています。mod_rewriteが使えない環境では、導入を諦めて下さい。南無。

まとめ

適当なPHPファイルでExpiresHeader.phpを読み込む
必要に応じてコンフィグやMIMEタイプリストをいじる
RewriteCondでヘッダを送出するファイルの拡張を設定
サーバー負荷が高いのでアクセス数が多い場合は使わない方が無難

アメーバの『ペタ』を手軽に付けられるGreasemonkey

2009-12-24T17:12:38Z

もの凄く需要が無さそうですが書いたので公開。

アメーバにはペタと言うよく分からない機能が付いていて、ペタが付けられたらペタ返しをするのが慣わしのようですが、通常のプロセスでペタ返しを行うと3クリックもしなければなりません。

そんな特殊な文化に慣れていない身としては、この3クリックは非常に煩わしいかったので、ペタ帳(ペタの履歴)画面から直接ペタを付けられるGreasemonkeyスクリプトを書いてみました。

ダウンロード

ameba_petalink.user.js – v0.2

2009-12-25 v0.2 アメーバの仕様変更に対応
2009-07-10 v0.1 公開

説明

ペタ帳のリストにペタるリンクが追加されます。

こんな感じ。

具体的に追加されるページは以下のような感じ。

rewさんのペタ帳
管理画面でのペタ帳(要ログイン)

アナタのペタライフに少しでも役立てば幸いです。

WordPressへ移行するならXMLを書き出すのがスムーズ

2009-11-26T02:28:32Z

WordPressに限った話では無いですが、移行用のエクスポートファイルは移行先のツールに合わせたフォーマットの方が良いんじゃないかと言うお話。

ブログツールによっては、各種ブログのエクスポートフォーマットに合わせたインポート機能がついていたりしますが、結局は他所様の作ったツールなので対応が微妙だったりしますよね。

その点、今回提案する方法なら、割とスムーズにインポート出来るんじゃないかなと思います。

※今回はMTからの移行を例に説明していますが、他のブログサービスやブログツールでも、なんらかの方法で書き出しが可能ならばいけると思います。

経緯

先日、このブログもMTからWordPressに移行しましたが、WordPressのMTフォーマットでのインポート機能もかなり微妙でした。と言うか使い物にならない。

そんなWordPressも自分のことなら出来るだろうと言う考えからWordPressのフォーマットに合わせて書き出してみました。

※バージョン2.7では自分でエクスポートしたファイルもまともにインポート出来なかったのですが、バージョン2.8で修正されたので2.8以上を使用すればOKです。

勘違い。バージョン2.8.xでもまともにインポート出来ません。

テンプレートを作成

wp_export.xmlなど適当な名前で以下を書き出す。

現行バージョン(2.8.6)でカテゴリー、タグがインポート出来なかったので修正。

<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
    xmlns:excerpt="http://wordpress.org/export/1.0/excerpt/"
    xmlns:content="http://purl.org/rss/1.0/modules/content/"
    xmlns:wfw="http://wellformedweb.org/CommentAPI/"
    xmlns:dc="http://purl.org/dc/elements/1.1/"
    xmlns:wp="http://wordpress.org/export/1.0/"
>

<channel>
    <wp:wxr_version>1.0</wp:wxr_version>
<mt:Categories show_empty="1">
    <wp:category><mt:ignore></mt:ignore
        ><wp:category_nicename><$mt:CategoryBasename$></wp:category_nicename><mt:ignore></mt:ignore
        ><wp:category_parent><mt:ParentCategory><$mt:CategoryLabel$></mt:ParentCategory></wp:category_parent><mt:ignore></mt:ignore
        ><wp:cat_name><![CDATA[<$mt:CategoryLabel$>]]></wp:cat_name><mt:ignore></mt:ignore
        ><wp:category_description><![CDATA[<$mt:CategoryDescription$>]]></wp:category_description><mt:ignore></mt:ignore
        ></wp:category>
</mt:Categories>
<mt:Tags>
    <wp:tag><mt:ignore></mt:ignore
        ><wp:tag_slug><$mt:TagName$></wp:tag_slug><mt:ignore></mt:ignore
        ><wp:tag_name><![CDATA[<$mt:TagName$>]]></wp:tag_name><mt:ignore></mt:ignore
    ></wp:tag>
</mt:Tags>
<mt:Entries lastn="0" sort_order="ascend">
    <item>
        <title><$mt:EntryTitle$></title>
        <link><$mt:EntryPermalink$></link>
        <pubDate><$mt:EntryDate format_name="rfc822"$></pubDate>
        <dc:creator><![CDATA[<$mt:EntryAuthor$>]]></dc:creator>
<mt:EntryCategories>
        <category><![CDATA[<$mt:CategoryBasename$>]]></category>
</mt:EntryCategories>
<mt:EntryTags>
        <category domain="tag"><![CDATA[<$mt:TagName$>]]></category>
</mt:EntryTags>
        <guid isPermaLink="false"><$mt:EntryPermalink$></guid>
        <description></description>
        <content:encoded><![CDATA[<$mt:EntryBody$><mt:EntryIfExtended>
<!--more-->
<$mt:EntryMore$></mt:EntryIfExtended>]]></content:encoded>
        <excerpt:encoded><![CDATA[<$mt:EntryExcerpt$>]]></excerpt:encoded>
        <wp:post_id><mt:Ignore><$mt:EntryID$></mt:Ignore></wp:post_id>
        <wp:post_date><$mt:EntryDate format="%Y-%m-%d %H:%M:%S"$></wp:post_date>
        <wp:post_date_gmt><$mt:EntryDate format="%Y-%m-%d %H:%M:%S"$></wp:post_date_gmt>
        <wp:comment_status><mt:IfCommentsAccepted>open<mt:Else>closed</mt:IfCommentsAccepted></wp:comment_status>
        <wp:ping_status><mt:IfPingsAccepted>open<mt:Else>closed</mt:IfPingsAccepted></wp:ping_status>
        <wp:post_name><$mt:EntryBasename$></wp:post_name>
        <wp:status><$mt:EntryStatus lower_case="1"$></wp:status>
        <wp:post_parent>0</wp:post_parent>
        <wp:menu_order>0</wp:menu_order>
        <wp:post_type>post</wp:post_type>
        <wp:post_password></wp:post_password>
<mt:Comments lastn="0">
        <wp:comment>
                <wp:comment_id><$mt:CommentID$></wp:comment_id>
                <wp:comment_author><![CDATA[<$mt:CommentAuthor default="??"$>]]></wp:comment_author>
                <wp:comment_author_email><$mt:CommenterEmail$></wp:comment_author_email>
                <wp:comment_author_url><$mt:CommentURL$></wp:comment_author_url>
                <wp:comment_author_IP><$mt:CommentIP$></wp:comment_author_IP>
                <wp:comment_date><$mt:CommentDate format="%Y-%m-%d %H:%M:%S"$></wp:comment_date>
                <wp:comment_date_gmt><$mt:CommentDate format="%Y-%m-%d %H:%M:%S"$></wp:comment_date_gmt>
                <wp:comment_content><![CDATA[<$mt:CommentBody$>]]></wp:comment_content>
                <wp:comment_approved><mt:IfCommentsActive>1<mt:Else>0</mt:IfCommentsActive></wp:comment_approved>
                <wp:comment_type></wp:comment_type>
                <wp:comment_parent>0</wp:comment_parent>
                <wp:comment_user_id>0</wp:comment_user_id>
        </wp:comment>
</mt:Comments>
<mt:Pings lastn="0">
        <wp:comment>
                <wp:comment_id><$mt:PingID$></wp:comment_id>
                <wp:comment_author><![CDATA[<$mt:PingTitle$>]]></wp:comment_author>
                <wp:comment_author_email></wp:comment_author_email>
                <wp:comment_author_url><$mt:PingURL$></wp:comment_author_url>
                <wp:comment_author_IP><$mt:PingIP$></wp:comment_author_IP>
                <wp:comment_date><$mt:PingDate format="%Y-%m-%d %H:%M:%S"$></wp:comment_date>
                <wp:comment_date_gmt><$mt:PingDate format="%Y-%m-%d %H:%M:%S"$></wp:comment_date_gmt>
                <wp:comment_content><![CDATA[<$mt:PingExcerpt$>]]></wp:comment_content>
                <wp:comment_approved><mt:IfPingsActive>1<mt:Else>0</mt:IfPingsActive></wp:comment_approved>
                <wp:comment_type>trackback</wp:comment_type>
                <wp:comment_parent>0</wp:comment_parent>
                <wp:comment_user_id>0</wp:comment_user_id>
        </wp:comment>
</mt:Pings>
    </item>
</mt:Entries>
</channel>

</rss>

ちょっと長くなったけど、こんな感じでいけると思います。

インポートする

XMLを書き出したら後はインポートするだけですね！

WordPressのインポートは[メニュー]->[ツール]->[インポート]です。

注意点

運用の方法によっては、今回示したコードでは上手くインポート出来ないかもしれません。

例えばカテゴリーベースのURLで複数カテゴリーを指定している場合は、親カテゴリーと言う概念が無いWordPressではURLが変わってしまう可能性があります。

その辺りは適当に調整してみて下さい(そしてアウトプットして下さい)。

WordPressにはてな記法を導入するプラグインを作った

2010-02-01T17:03:26Z

はてなダイアリーでおなじみのはてな記法ですが、慣れるとさくさく記事が書けて良いので、是非WordPressでも使いたいと思い、HatenaSyntax – openpearを利用して作ってみました。

手軽に導入出来るので、はてな記法が大好きなWordPressユーザーは是非使ってみて下さい。

ダウンロード

WP HatenaNotation – v1.0.2

対応している記法

記法名	書式	備考
見出し記法	*～～	設定で指定した見出しレベル
小見出し記法	**～～	見出しレベルをアスタリスクで指定
リスト記法	-～～, –～～, +～～, ++～～	順序無し、順序付きリスト
定義リスト記法	:～～:～～
表組み記法	\| ～～ \| ～～ \|, \|*～～ \| ～～ \|
引用記法	>> ～～ <<	blockquoteでマークアップ
pre記法	>\| ～～ \|<	preでマークアップ
スーパーpre記法	>\|\| ～～ \|\|<	設定で指定したマークアップ HTMLエスケープ付き
脚注記法	(( ～～ ))
http記法	[http://～～] [http://～～:title=hoge] [http://～～:title]	キャッシュ用DBテーブル作成
キーワード記法	[[ ～～ ]]	キーワードにはタグが使用される
下書き記法	<!– ～～ –>	記事を公開しつつ部分的に下書き
目次	[:contents]	見出し(記法)のインデックス

はてな記法の設定

項目名	説明	初期値
無効日指定	指定日以前でははてな記法が無効になる	現在の最終投稿日
見出し記法の基準値	*見出しのHeading level	h3
包含要素を使用する	はてな記法を包含する要素	使用する
包含要素のclass	記事全体を囲むdivのclass	section
脚注部分のclass	脚注記法で下部に挿入されるdivのclass	footnote
スーパーpre記法のマークアップ	%type%を指定言語に置換 %content%を内容に置換	syntaxhighlighter2
タイトルのキャッシュを保持する日数	[http://~~~:title]のキャッシュ	90

特殊なケース

以下のような特殊なケースにも対応しています。

HatenaSyntaxをOpenpearで管理する

パスが通っているディレクトリのHatenaSyntax.phpを優先的に読み込むので、HatenaSyntaxをOpenpearで管理する事も可能です。

Openpearの使用方法は、openpear :: Open PEAR Repository Channel 及び HatenaSyntax – openpearを参照して下さい。

※Openpearで管理する場合の動作はサポート対象外となります。

the_content()を使っていない場合

圧倒的少数だと思いますが、the_content()を使わずに記事を出力している場合は、wphn_render()関数に、はてな記法文字列を渡して利用することが出来ます。

&lt?php
echo wphn_render($content);

応用すればコメントではてな記法を使ったりも出来ますね。

謝辞

PHPではてな記法を扱う素敵なライブラリを提供して下さったanatooさん、何となく動作チェックを手伝って下さったnoriさん、お二人にはこの場を借りてお礼申し上げます。

バグ報告・機能追加要望は、この記事のコメントやメールなどで頂ければ幸いです。

更新履歴

2010-02-02 – v1.0.2: スーパーpre記法の二重エスケープを防止。
2010-02-02 – v1.0.1: wphn_render()関数内のtypoを修正。
2010-01-29 – v1.0.0: 大幅な更新。詳しくはWP HatenaNotation v1.0.0を公開しましたを参照。
2009-11-16 – v0.5.1: v0.5の途中から誤って開発版がリリースされていたのを修正
2009-11-06 – v0.5: 目次記法 [:contents]、キーワード記法(タグを使用)、下書き記法に対応
2009-06-17 – v0.4: 公開

WordPressに移行してHTML5で組んでみた

2009-06-15T04:28:22Z

MTはある程度使えるレベルになったので、PHP製CMSのWordPressに移行。同時にデザインも変更してHTML5っぽい感じにしてみました。

移行に伴って色々やってみたのですが、その辺は個別でまとめるとして、今回は簡単に書けそうな部分にだけ触れます。

HTML5について

現状、仕様を完全に追いきれて無いので、割と感覚で組んだ部分があります。結構難しいですねHTML5。適当にやってたら直ぐに置いていかれそう。でも面白い。

疑問点

セクションの関係を意識してたらh1がやたら増えた。こんな感じでいいのだろうか。まだ策定段階なので見本はほとんど無いし、仕様書見てもあんまり解らなかった。

表示の高速化関連

CSS Spriteを使った(まとめ方が若干変)
CSSを一つのファイルにまとめる
適切なヘッダを送出してキャッシュをうまく使う
gzip圧縮

CSSとJSにはrev=リビジョンを付けて最新版が読み込まれるようにしています。

デザインについて

デザインはウチの専属デザイナーに丸投げ。やたらシンプルなデザインを返されつつも、スキルを上げて作り直してくれることに期待。

IE6

見ない方がいいですよ。絶対見ない方がいいですよ。

WordPress

何だか色々ひどい。でも利用ユーザーが多いから面白い。

CygwinでGit(GitHub)を始めるための準備・設定メモ

2009-12-14T03:36:54Z

登録して放置していたGitHubを本格的に始めました。

rewish’s Profile – GitHub

以下、CygwinでGit及びGitHubを始めるための設定メモ。

Gitをインストール

Cygwinのsetup.exeを起動して適当なサーバーを選択、gitを選択してダウンロード＆インストール。この辺はいつもの作業なのでCygwinユーザーなら問題無いはず。

※git-svnを使う場合はsubversion-perlをインストールしてごにょごにょするみたいです。

Gitのユーザー設定

これをやらないとコンピュータ名などが晒されて恥ずかしい事になるらしい。

$ git config --global user.name "rew"
$ git config --global user.email rewish.org@gmail.com

追記: ついでに以下もやっておくと良い。

$ git config --global color.ui auto

SSH公開鍵の設定

パスワード無し公開鍵を作る

自宅からはパスワード無しでpushなどを行えるようにする。

$ ssh-keygen -d -f ~/.ssh/nopass_dsa -N ''

作成した公開鍵をGitHubのホストで使う設定

次に~/.ssh/configを設定。

Host github.com
  User git
  Port 22
  Hostname github.com
  IdentityFile ~/.ssh/nopass_dsa
  TCPKeepAlive yes
  IdentitiesOnly yes

GitHubに公開鍵を登録

GitHubアカウント設定画面のSSH Public Keysから公開鍵を登録する。

今回の場合はnopass_dsa.pubの内容を貼り付け。

ターミナルをckに変更

マルチバイト文字の対応がわりと簡単にできそうなckにターミナルを変更。

ダウンロード

公式サイトはすでに閉鎖していますが、こちらのミラーサイトからバイナリをダウンロードすることが出来ます。今回はck-3.2.1-bin.zipをダウンロード。

解凍・移動

zipを解凍し、以下のファイルをC:\cygwin\binに移動。

ck.exe
ck.con.exe
ck.app.dll

ckの設定

.ck.config.jsをC:\cygwin\home\%USERNAME%に移動し、適当にいじり倒す。

設定ファイル一式はrewish’s cygwin at master – GitHubに置いています。

まとめ

Cygwinのsetup.exeからGitをインストール
SSH公開鍵を作成
~/.ssh/configの設定
GitHubに公開鍵を登録
文字コードに悩まされたらckを導入してみる
たまに文字化けするけど

Rewish

WindowsでCakePHPコンソール(bake)を使い易くする方法

ダウンロード

バッチファイルの使い方

バッチファイルのソースコードと解説

cake\consoleへパスを通す

Aliasの設定

PHPのパスも通したい場合

まとめ

WP HatenaNotation v1.0.0を公開しました

v0.5.1からの変更点一覧

設定メニューの位置変更

包含要素の有無切り替え設定

無効日指定の選択方法を変更

render呼び出し関数wphn_render()を定義

[http://～～:title]に対応

いくつかのオプションを削除

今後の予定

ブログに「はてなスター」を設置してAutoPagerizeに対応する

はてなスターを設置

AutoPagerize(+AutoPatchWork)への対応

最後に

ペタるリンクを付けるGreasemonkeyを更新しました

jQueryの開発コードをビルドして使う (Win & Mac)

Windowsの場合

Gitをインストール

jQueryをチェックアウト

Apache Antをインストール

ビルド用のバッチファイルを作成

いよいよビルド！

最新版を使いたい場合

Macの場合

Gitをインストール

jQueryをチェックアウト

ビルド！

最新版を使いたい場合

シンプルなイベントカレンダーを実装するjQueryプラグイン

目次

機能概要

ダウンロード

動作デモ

導入方法

オプション

イベントを追加

コールバック関数

addDay

addEvent

beforeMove & afterMove

イベントをプリロード

使用方法

MacBook Proを購入したのでセットアップ

初期設定

トラックパッドの設定

ターミナルの設定

Firefoxの設定

アドオン

ブックマーク

パスワード

ブックマークツールバーのfavicon

Thunderbirdの設定

MacPortsをインストール

bashの設定

.bash_profile

.bashrc

その他のアプリケーション

VMware PlayerにVMware Toolsをインストールして快適開発

目次

VMware Toolsのディスクイメージをダウンロード

VMware Toolsをインストール

vmxファイルに設定を記述

「共有フォルダが無効になっています」と言われる場合

ちょっと便利な使い方

JavaScriptのDateオブジェクトを拡張してPHPのdate関数を実装

目次

ダウンロード

簡単な使い方

date関数風に使う基本

定数を使う

日付文字列をパース

フォーマット文字列と同時にタイムスタンプもセット