Jedit X で ZenCoding
愛用のテキストエディタ「Jedit X」でZen Codingができないものかと探ってみました。
Zen Codingとは?
Zen Codingについては、以下が参考になります。
ライブラリ探し
Jedit Xのマクロは AppleScriptでつくることができるのですが、さすがにAppleScript実装のZenCodingというものは無さそう。でも、AppleScriptは「do shell script」でコマンドを実行できるので、Perl やら Rubyで実装されたものがあれば、なんとかなるか、と思って見つけたのが以下です。
Zen Coding の Perl 実装書きました – OTCHY.NET
全ての機能に対応している訳ではないそうですが、よく使う記述には対応しているので、これで十分に満足できそうです。使わせていただきます。
実装してみる
上記サイトから SSSCoding.pm をダウンロードして、Perlのライブラリディレクトリ(Snow Leopardだと、/Library/perl/5.10.0/SSSCoding.pm 辺り)に保存します。で、以下のようにAppleScriptを書いてみました。
tell document 1 of application "Jedit X" set range to selected paragraph range set startP to loc of range set endP to startP + (len of range) - 1 repeat with i from startP to endP set str to paragraph i set res to do shell script "perl -MSSSCoding -e 'chomp($ARGV[0]);print SSSCoding::expand($ARGV[0]);'" & " " & quoted form of str set paragraph i to res & (ASCII character 10) end repeat end tell
#なんだか改行の処理がややこしくて美しくないですが・・・。
これをスクリプトファイル(.scpt)で保存して、Jedit Xの「スクリプトウィンドウ」に放りこめば完成です。好きなショートカットを割り振っておくと、より便利です。
iPhone/Android/PCのブラウザ対応、フリック操作をシンプルに実装できるjQueryプラグイン
自作のjQueryプラグイン、jQuery.flickSimpleを公開します。
これは、iPhoneの特徴的なインタフェースであるフリック操作を、Webサイト上で実現するための jQueryプラグインです。某サイトのiPhone版のためにだいぶ前に書いたもので、当時はiPhone専用だったのですが、Android対応の依頼を受けたのをきっかけに、PCのブラウザにも対応しようと、大幅に作り直したものです。
フリック動作を実現するjQueryプラグインは既にいくつかあります。機能としても実装としても、私が作ったものより優れているものもあると思いますが、まずは公開することに意義がある、ということで。
ちなみに、このスクリプトは以下のようなコンセプトで作りました。
- フリック動作のみを実装する
- 見た目に関連する部分は、なるべく自由にできるようにする
- その代わりに、拡張しやすいようにする
- 内部のパラメータに簡単にアクセスできるようにする
- コールバック関数を用意する
- iPhone、Androidだけでなく、PCのブラウザ上でも動作させたい
- iPhone、Androidの縦持ち・横持ちに対応する
- 子要素の中にアンカーや画像があっても大丈夫
- Macの場合、画像がドラッグされてしまわないように対処
- 同ページ内に複数設置できるようにする
指定しただけでは、ナビゲーションやインジケータは表示されませんので、JavaScriptの初心者向けではありませんが、いろいろと機能を加えたい、JavaScriptやCSSを自分で組める方には、便利に使っていただけるのではないかと思っています。
つっこみ、添削、機能追加要望など、ありましたらお寄せいただけると、喜ぶと思います。
フリック動作を実現するjQueryプラグイン
上記のモノ以外で、同じようにフリック動作を実現するjQueryプラグインを調べてみました。いくつかは、上記のjQuery.flickSimpleを制作する際の参考にさせていただきました。
追記(2011/08/02)
ダウンロードファイルをgithubに移行しました。
追記(2011/08/20)
「フリック動作を実現するjQueryプラグイン」に「flipsnap.js」を追加してみました。ちゃんと検証してませんが、私が欲しかったものに一番近い気がします。ソースコード読んで勉強させていただきます。
追記(2011/10/09)
追記(2012/08/09)
追記(2012/08/28)
Windows Server の「.htaccess」と 550 FTPエラー
Windows Server 2003 に Apache / MySQL をインストールしてWebサイトを構築していたところ、このサーバに置いた「.htaccess」が他の端末からFTPで取得できない、という症状に出会してハマったのでメモ。
FTPのファイルリストからは「.htaccess」が見えるのだが、GETしようとすると以下のエラーがでて失敗してしまう。ちなみに、FTPサーバはIISで構成している。
550 .htaccess: The system cannot find the file specified.
FTPクライアントソフトを変えてみたり、FTPコマンドで試してみたりしてもダメ。Webで検索すると「権限がない」らしいということがわかったのだが、Windowsのファイル権限はFTPでは変更できないので、次回そのサーバを直接触れる機会までひとまずおあずけ。
実機を見て、一目でその原因がわかった。「.htaccess」が「隠しファイル」になっていた。ファイルのプロパティから「隠しファイル」のチェックを外したところ、問題なくFTPでGETできるようになった。
一般的に「.」から始まるファイルはシステムが使うファイルだったりするので、CD-ROMからコンテンツをコピーした際に、どうやらそのようになってしまったらしい。
という訳で、上記のようなエラーが出た際は「隠しファイル」になっていないかどうか、確認いただくといいと思います。
Android 2.2の不具合
スマートフォン対応サイトにて、Galaxyで<input>にfocusをあてると、ウィンドウが変にスクロールしてしまうという問題が報告された。
いろいろ調べてみると、Android 2.2 では対応していないCSS3 Animationの指定をすると誤動作する、ということらしい。
jQTouchの場合
http://code.google.com/p/jqtouch/issues/detail?id=398
下記のようにCSSをデフォルト値で上書きすると症状がおさまる。ただし、iOSや2.2以外のAndroidにも影響を与えてしまう(画面遷移の際に点滅したりする)ので、UAで判定をかけてAndroid 2.2の場合だけ以下の指定になるように改造する必要がありそうだ。
body { -webkit-perspective: none; -webkit-transform-style: flat; } body>*{ -webkit-backface-visibility: visible; -webkit-transform: none; }
Android と基本認証
ちょっと前からスマートフォン対応のサイトを作る機会がよくありまして。
iPhone/iPod Touchはいいのですが、Androidは日本語の情報が少なくて困りますね。実機を持っていないので、検証も主にAndroid SDKでやっているのですが、これが非常に遅くてまた困り物。
ところで、Androidって、基本認証(Basic認証)をかけたサイトをブラウザで閲覧すると、JavaScriptが実行されなかったりしませんでしょうか。単純に document.writeしているものでも、文字化けしてしまっておかしなことになります。
いくつかエミュレータをつくって試してみたのですが、Android 2.1以前では、同様の症状が起こるようです。Sony Ericsson のサイトから落とせる Android SDK用のXperiaエミュレータでも同様でした。
Web屋としては、これは非常に不便です。お客様プレビュー用のテストサイトは、ほぼ全て基本認証をかけているのですが、それが使えないとなると、IPアドレスで制限をかけるよりほかありません。おかげで Apacheの Satisfy Any が大活躍状態になってます。
検索してもあまり出てこないのですが、みなさん、困ってないのでしょうかねぇ。
Cache::FileCache の purge と Purge
Cache::FileCache を使っていて、期限切れキャッシュのファイルが削除されなくてはまりました。
この記事 を参考にして Purge() していたのですが、どうやら Cache::FileCache には purge と Purge があるようなのです。上の記事のコメントを見て知りました。
で、この二つはどう違うのか、ソースをざっくりと見てみたのですが、
Purge() は、呼び出し元のオブジェクトの指定に関わりなく、引数に指定したディレクトリ以下のすべてのファイルについて、期限切れファイルを削除するようです。なので、$cache->Purge( '/path/to/cache_root' ); あるいは、Cache::FileCache::Purge( '/path/to/cache_root' ); という風に実行する必要があるのですね。
purge() は、呼び出し元のオブジェクトに指定したディレクトリ・namespace の期限切れファイルを削除してくれます。
ので、上の記事ではやはり、purge() を使うのが正しそうですね。
それにしても、このインタフェースはどうかと思いますね・・・。Cache::CacheのPOD にある説明もどうかと・・・。
疑問:mod_perl と 後置 if と my
#!/usr/bin/perl use strict; use warnings; { my $flg; { my $cnt = 1 if ( $flg ); $cnt++; print "Content-type: text/plain\n\n"; print join( ', ', $cnt, $$, \$cnt ); } } 1;
上記のような CGI を mod_perl(ModPerl::Registry)上で動かすと、Apacheのプロセス毎に $cnt がカウントアップされます。
なぜでしょう??? 誰か教えてください。
$cnt はレキシカルスコープなはずですよね。スコープが外れた {} の後で $cnt を使うと怒られます。なのに、なぜかグローバル変数のように共有されてしまいます。
そもそも、my $cnt = 1 if ( $flg ); はどのように動作するのでしょうか。$flg は undef なので、my $cnt = 1; にはなりません。my $cnt; も実行されないとすれば、$cnt はレキシカルスコープにならず、use strict; でエラーになりそうなものですが、そうはなりません。かといって、初期化(undefがセット)もされない状態になるみたいです。
最後の print のところで、$cnt のリファレンスをscalarとして評価していますが、これを見ると同じメモリアドレスを参照していることが分かります。ということは、このメモリアドレスが初期化されずに、残っている値を参照してしまっているということなのでしょうか。
う〜ん、分かりません。誰か教えてください。
ちなみに、Perl 5.8.8+mod_perl 2.0.2、Perl 5.8.0+mod_perl 2.0.4(+両方ともApache 2.2.11)のいずれで実行しても、同じ結果でした。
#以下追記(2009/08/29)
この記事と同様のことが質問されてました。
http://q.hatena.ne.jp/1251400485
私の記事では mod_perl上での動作についてですが、同じプロセス上であれば同じことが起こるということですね。
確かに、(危険ですが)Hackとして使えないこともないですね(笑)。
http://d.hatena.ne.jp/tokuhirom/20090828/1251448289