Scripting…

cygwin with mintty

いまさらながら、(個人的に)必要に迫られてcygwinを夏に買ったVAIO Zにインストールした。

もともと vpsのssh接続用にTera Term Proをインストールしていたので、Tera Term Proに入っているCygtermを介して Tera Term Pro 上で使うようにしました。コピペもWindowsのコマンドプロンプトなシェル より遥かに使い勝手がいいし。

で、ちょっと調べてみたら、cygwin の端末エミュレータとして標準で mintty というのがインストールされてて、どうやらこのminttyがcygwin 推奨の？端末ソフトらしい。Tera Term Proでもほとんど不満はないのですが、やはりcygwin 関係はcygwin 内ですべてを完結させたいところ。
使ってみると、日本語もちゃんと表示されるし、最低限の機能を備えているので問題なし。Windows7でウィンドウの透過を”Glass”にしたら、結構かっこよく見える(^^;;;

ただ、一点、不満がありまして・・・、それが・・・環境変数 HOME の扱い。Windowsのアプリですでに環境変数HOMEを設定していて、これは変えたくない。

で、どうやら、mintty を起動すると、cygwinのインストーラが作成した、/etc/passwd(実際にはc:cygwinetcpasswd) を見ているらしく、デフォルトでホームディレクトリが、Windowsの%USERPROFILE%になるみたい。

Tera Term Pro では、「設定 → その他の設定」で、環境変数を設定できる項目があるのでHOMEを /home/username と設定することで解決してたんですが・・・。

環境変数HOMEをバッチファイルに埋め込めばいいんだけど、それだといちいちコンソールウィンドウが立ち上がってブサイク。

・・・というわけで、バッチファイル(コマンドファイル)ではなく、wsh + jscript の力を借りて下記のような起動スクリプトを作ってスタートメニューに登録。

var wshl = WScript.CreateObject("WScript.Shell");
var env = wshl.Environment("PROCESS");

env.item('HOME') = '/home/' + env.item('USERNAME');
env.item('MAKE_MODE') = "unix";

wshl.Run("c:\\cygwin\\bin\\mintty.exe -i /Cygwin-Terminal.ico -");

vpsへのログインも、cygwin + ssh で。 非WIndows環境はすべてcygwinにしてしまいました。

ええ感じ～、と思っていたら、Tera Term Proで操作ログを常に保存していたのを思い出し・・・mintty のオプション ” -l ” を指定しないと・・・んーーーなんか挫折しそう。

(2012/1/2 : 若干記述修正済み)

javascript コードをウェブページに注入

ブックマークレットって、意外に便利ですよね。

でも、ネット(主にWeb)にベッタリ依存している人は別として(笑)、一般的にはあんまり浸透していないんじゃないかと思います。というか、言葉を知ってても、一体何なのか分かっている人は、もっと少ない感じ。

実は僕もブックマークレットの便利さを、つい最近知ったんで(^^;;;

ブックマークレットの実体はブラウザのブックマークに登録された、javascriptなどの極少量のスクリプトコードなんですが・・・、この「極少量」っていうところがミソで、FireFoxやChromeのブラウザのアドオンや拡張機能を実装するほどでもない機能をブックマークレットで・・・ってとこでしょうか。

要は、任意のページにjavascriptコードを注入できる、ということ。

僕がよく使うのはブログなどに表示される広告削除。。。だって読みづらいったらありゃしねー。ブログサイト毎に作ってブックマークに登録しとけば非常に便利。

特に、iPhone のSafariブラウザでのブログ閲覧は、もう最悪。狭い領域にパカパカ広告開いて、ご丁寧にもタッチ操作するたびに違う広告を呼び出すので、3G回線で使うときは固まっちまう。

iPhoneのSafariブラウザも、ブックマークレットは使えるのですが、ブックマークの登録時はURLを変更できないので、一度どこのサイトのどのページでもいいのでブックマークを登録して、そのブックマークを編集・修正することでブックマークレットを登録できます。2度手間なので、なんか一発で登録できるアプリないのかな・・・？

たとえば、アメブロのスマートフォン用ページ(iPhoneでしかアクセスしたことないので他のスマホは知らない)では、↓ のように、広告バー？が表示されます。

画像

アメバさんには悪いけど、これヒジョーにうっとおしい。固定されていれば文句はないんですが、タッチ操作するたびに消えたり・表示されたりするので、動作が遅くなるし、誤ってクリックしようもんなら・・・

ムカーーーーーー！金麦なんて、ぜってー、飲まねーーーー！

とくるんですよね(笑) ちなみに、僕はビール類とかお酒自体飲まないんで。そんなの知ったことねーか(^^;;; とにかく、どんなブログサイトでも、こんなスタイルで表示されてるんじゃないでしょうか？ ブックマークレットで消しましょう。

あくまで、アメブロの例にしますが、他でも同じ感じです。 手順は簡単で、

  1. この広告に使用されているDOMノードを特定
  2. DOMノードを削除

これだけ。具体的なコードは・・・

javascript:(function(){var ads=document.getElementsByClassName("adBanner");for(var i=0;i<ads.length;i++){ads.item(i).parentNode.removeChild(ads.item(i));}})();

アメブロの広告は、<div class=”adBanner”>というタグが使われているので、getElementsByClassNameで取得して削除しているだけ。

DOMノードの解析に、僕はPCでGoogle Chromeの「デベロッパー・ツール」を使ってます。Chromeを起ち上げる際、起動オプションとして、

--user-agent="Mozilla/5.0 (iPhone; U; CPU iPhone OS 4_3_5 like Mac OS X; ja-jp) AppleWebKit/533.17.9 (KHTML, like Gecko) Version/5.0.2 Mobile/8L1 Safari/6533.18.5"

を付けて起動すると、ブラウザの表示がスマートフォンと同じようになりますので、そこでデベロッパーツールを表示させて広告表示に使用されているDOMノードを特定できます。FireFoxやIE/Operaでも同様のツールが使えると思います。

で、上記コードをコピペして、ブックマークに登録。
ただ問題は、ページ毎にブックマークを選択しないといけないので、PCのブラウザならワンクリックでいけますが、iPhoneだとメンドクサイですね～

ノードを特定したいときにjQueryとか使いたいとか、もっと長いコードを登録したい場合は、document.createElement(“script”)などで外部スクリプトファイルを読み込ます方法があります。

正しく使えば非常に有用なんですが、少し考えると分かりますが、非常に危険なコードを簡単に注入することが可能です。使用者本人のコードなら問題はないと思いますが、他人が作ったブックマークレットは、リスクが伴います。諸刃の剣ですかね。

Perlの綺麗な始め方は？

特に意味ないです。

Perl コードを書くとき、↓ のようなテンプレートから mainサブルーチンを書くようにしてました。

#!/usr/bin/perl
use strict;
use warnings;

#スタートアップ・コード
sub main
{
  my @argv = @_;
  
  print &quot;Content-type: text/plain;charset=utf-8\n\n&quot;;
  print &quot;ほげほげ\n&quot;;
}

#その他のコード
sub func
{
  1;
}
#スクリプト実行開始
main(@ARGV);
#スクリプト実行終了

ファイルの最後でmain をコールすることで、Cとかのmain関数を真似て、自己満足してたんですが・・・

なんか最後に main をコールするところが、ちょっと格好悪く感じて、他に良い書き方ないかな～、と模索してました。バカでしょ(^^;;;

で、最近 jQuery を使ってjavascriptコードを組むことが多いので、その作法にならって、下記のようにしてみた。

use strict;
use warnings;

#スタートアップコード
&amp;{
  sub
  {
    my @argv = @_;
    print &quot;Content-type: text/plain;charset=utf-8\n\n&quot;;
    print &quot;ほげほげ\n&quot;;
  }
}(@ARGV);

#その他のコード
sub func
{
  ...
}

main というCの名残が消えてしまいましたが・・・、ちょっとスッキリ！ ^^

それと、Perlモジュールを作るとき、たとえばコンストラクタ(new)で以下のようにハッシュをクラスに関連づけることが多いのですが、

sub new
{
  my $param = shift;
  my $class = ref($param) || $param;
  my $this = { x =&gt; [], y =&gt; {} };

  bless($this ,$class);

  return $this;
}

問題は、そのゲッターとかセッター。
$this->{x} とか $this->{y} とかでアクセスするのはちょっと頂けない。とはいいつつ、例えば、

sub x { return shift-&gt;{x};}
sub y { return shift-&gt;{y};}

とかやるのは正直面倒。最近知ったのですが(^^;;; caller という関数が使えば・・・

sub getter {
  my @name = split(/::/,(caller 1)[3]);
  return shift-&gt;{pop @name};
}
sub x { return shift-&gt;getter;}
sub y { return shift-&gt;getter;}

#追記  ↑より↓の方がコピペしなくていいかもネ。あってんのかな？
no strict 'refs';
foreach my $name_(qw/x y/)
{
  *{__PACKAGE__.'::'.$name_} = sub { return shift-&gt;{$name_};}
}

という方法で・・・・、あ、Class::Accessor 使えば良かったんだ。。。orz

自前のC++オブジェクトをjscriptで操作させたい

単純にCOMオートメーションサーバーを作成すれば事足ります。コードの再利用という点から考えてみてもそれがいいのですが・・・、一つのプログラム内で完結させたいといった時に調べてみました。

たとえば、自作の複雑なオブジェクトを持つアプリケーションがあって、jscriptなどのスクリプトでプラグインを書いてもらう、というようなケースなどでは、スクリプト環境をホストしなければなりません。

完全に自分用のメモで(＾＾;、 ネットなどで検索をしたり、MSDNドキュメントを拾い読みなどをまとめた備忘録です。あしからず。

で、やはりCOMのお世話にならないといけません。Visual Studio Express Editionでは全部自分でコーディングしないといけないので、退屈なコードを書かないといけないところが面倒です・・・。

手順としては、

  1. スクリプトから操作させたいオブジェクトをIDispatch を継承、もしくは、オブジェクトへのラッパークラスをIDispatch実装クラスでインプリメントする。
  2. スクリプトをホストするため(スクリプトからの様々な通知を受け取るため？)に必要なIActiveScriptSite の 実装クラスを作成

で、これらを使って、以下を順番に実行。

  1. CoCreateInstance APIでIActiveScriptのインスタンスを生成
  2. IActiteScript::SetScriptSite()へIActiveScriptSiteの実装クラスのインスタンスをnewして放り込む。
  3. IActiveScript::QueryInterface()でIActiveScriptParse インターフェイスポインタ(IID_IActiveScriptParse)を得る。
  4. IActiveScriptParse::InitNew()をコール
  5. IActiveScript::AddNamedItem()で、自前のC++オブジェクトの名前をつける。スクリプトではこの名前を使ってアクセスさせる。
  6. IActiveScriptParse::ParseScriptText()でスクリプト文を解析させる
  7. IActiveScript::SetScriptState(SCRIPTSTATE_CONNECTED)をコール
  8. IActiveScript::SetScriptState(SCRIPTSTATE_CLOSED)をコール
  9. インターフェイスポインタの後始末

という流れ。

続きを読む →

CANVASとSVG

IE9がリリースされ、主要なウェブ・ブラウザのほぼ全てで、HTML5の<CANVAS>タグや<SVG>タグがサポートされました。IE以外のブラウザではもっと早くにサポートされてたんですけどね。

アクセス解析のグラフ表示やCSVデータのグラフィック表示など、いままで、JavaアプレットやFlashに頼っていたものが、CANVASタグだけでなくSVGタグを使って、ブラウザ機能だけで実現できてしまうので、Web開発している人には朗報かもですね。ちょっとした動的なグラフィック表示なんかjavascriptでチョコチョコッと書けば済むんですから(^^;

とくに、Illustratorで作成したデータなんかをSVG形式で保存して<SVG>タグ内にコピペしてやれば、プラグインなしに表示できますし、画像のHTML内への埋め込み(インライン)も可能。SVG自体、xmlなのでjavascriptで動的に作成もでき、使わない手はありません。

IllustratorのデータをSVGで保存し、HTMLの<SVG>タグ内にコピペしたサンプル。

ただ、SVGについては、ブラウザによって表示が違いました。firefox4とchrome(11)だと、下の画像のように・・・花の部分が欠けてしまいました。なんでだろ？？？ブラウザのせいとうより、SVGフォーマットへの書き出し方が悪いんでしょうか。

svg1

まだブラウザ毎に表示確認は必要みたいですね。

で、おそまきながら、勉強がてら<CANVAS>タグでなんかしてみよう！ と思いたって書いてみたんですが・・・なんせ無知なもんで、ちょっとはまってしまいました。

リファレンスサイトとして参照させてもらったのは、

http://www.html5.jp/canvas/index.html

続きを読む →