さくらでirssi動かし始めた - すぎゃーんメモの続き。

せっかくirssiが動いたので次はtig.rbを。

基本的にlistは作っているけどほとんど使っていないので使用しない方向で。@hokacchaのものを使わせていただきます。

tig.rbのリストの有効/無効をnameで渡す - Webtech Walker

git clone git://github.com/hokaccha/net-irc.git

でexample/tig.rbを動かす。

rubyのことはよく分かっていないけど、gemでjsonを入れないと動かないっぽい。

さくらサーバーに Rubygems をインストールする - make world

wget http://rubyforge.org/frs/download.php/60718/rubygems-1.3.5.tgz
tar zxvf rubygems-1.3.5.tgz
ruby setup.rb --prefix=$HOME/local

でinstallできたっぽい。

.zshrcに環境変数追加。

export RUBYLIB=$HOME/local/lib
export GEM_HOME=$HOME/local

で、

gem18 install json

でいけるかと思いきや、"chown/chgrp: Operation not permitted"とか言われて怒られる。

もう一個、RB_USER_INSTALLという環境変数も必要っぽい。

さくらインターネットで、gem install すると「chown/chgrp: Operation not permitted 」と叱られる件の対応 | JAM☆ぱん

alias gem="RB_USER_INSTALL=1 gem18"
gem install json

と適当なalias書いてインストールした。

で、ようやくtig.rbを動かせる。

./tig.rb -n 'sugyan mentions' &

とかで動かすらしい。

$HOME/.irssi/configでは

servers = (
  {
    address = "localhost";
    chatnet = "TIG";
    port = "16668";
    password = "********";
    use_ssl = "no";
    ssl_verify = "no";
    autoconnect = "yes";
  },
...
);

chatnets = {
  TIG = { type = "IRC"; };
...
};

とか書いておく。irssiで"/connect TIG"で接続。

出てきたエラー。

D, [2010-02-08T00:12:01.107555 #5770] DEBUG -- : ["POST", "https://twitter.com/account/update_profile.json"]
E, [2010-02-08T00:12:01.396691 #5770] ERROR -- : #<OpenSSL::SSL::SSLError: SSL_connect returned=1 errno=0 state=SSLv3 read server certificate B: certificate verify failed>
D, [2010-02-08T00:12:01.396827 #5770] DEBUG -- : SEND: :twittergw NOTICE #twitter :Fatal SSL error was happened #<OpenSSL::SSL::SSLError: SSL_connect returned=1 errno=0 state=SSLv3 read server certificate B: certificate verify failed>
#<OpenSSL::SSL::SSLError: SSL_connect returned=1 errno=0 state=SSLv3 read server certificate B: certificate verify failed>

SSLで何かしようとして失敗しているようだ。色々ググって調べてみる。

tig.rb のアップデート - 冬通りに消え行く制服ガールは、夢物語にリアルを求めない。 - subtech

あーありがち - Ruby の SSL の証明書検証の失敗でハマっていた

タイトル未定:Rubyでnet/httpsで通信 - livedoor Blog（ブログ）

net/https - Rubyリファレンスマニュアル

よく分からなかったけど、証明書のパスを明示的に指定すると良いっぽい。さくらの環境では以下のように一行書き換えたら動くようになった。

diff --git a/examples/tig.rb b/examples/tig.rb
index 6a282e1..69ef3ff 100755
--- a/examples/tig.rb
+++ b/examples/tig.rb
@@ -2149,6 +2149,7 @@ class TwitterIrcGateway < Net::IRC::Server::Session
                        http.use_ssl     = true
                        http.cert_store = @cert_store
                        http.verify_mode = OpenSSL::SSL::VERIFY_PEER
+                        http.ca_file = '/usr/local/share/certs/ca-root-nss.crt'
                end
                http
        rescue => e

ちゃんと何かを設定すればtig.rbを書き換えなくても動くようにできるのかな…

多くの人が使ってる「さくらインターネット」がどんなものか、手を出してみようと思ってスタンダードで契約してみた。

root権限なくても、大抵のものはソースダウンロードして

./configure --prefix=$HOME/local
make
make install

的なことをすれば入れられるようだ。なるほどなるほど。

local::libはもちろん、screen, zsh, vimなど導入。gitも入れた。

で、irssiをここに入れて常時起動にしておいてみようと。tiarraは今のところまだ使わないで頑張ってみる方向で。

今までirssiを全然使いこなせていなかったのでせっかくの機会だし、とゴニョゴニョやってみた。

• 大抵の設定はコマンドから設定して/saveすれば保存される
• windowの配置は/layout saveしてから/save

layoutはlayoutを保存するだけで再起動時に自動接続されるわけではない。

再起動時に自動で繋ぎたい場合は、

/NETWORK ADD HOGE
/SERVER ADD -auto -network HOGE irc.hoge.fuga 6667

とか設定しておくと、起動時に自動で接続されるようになるっぽい。

/CHANNEL ADD -auto #piyo HOGE

とか設定しておくと、channelへのjoinも自動でやってくれるようになる。

Irssi - The client of the future

まぁ上記のように設定して/saveすれば、$HOME/.irssi/configに下記のように保存されるようなので、あとはそれを参考に弄ればいいのかもしれない。

servers = (
  {
    ...
  },
  {
    address = "irc.hoge.fuga";
    chatnet = "HOGE";
    port = "6667";
    password = "hogefugapiyo";
    use_ssl = "no";
    ssl_verify = "no";
    autoconnect = "yes";
  }
);
channels = (
  { ... },
  { name = "#piyo"; chatnet = "HOGE"; autojoin = "yes"; },
);

logを保存するための設定はこのへん？

Irssi - The client of the future

acotieさんの記事も分かりやすくて参考になりました。

A Guide to Efficiently Using Irssi and Screenを適当に和訳 - iDeaList::Writing

tig.rbとかも動かしておきたいけど今日はここまで。あとでやる。きっと@hokacchaの記事をみれば上手くいくはず。

2010 1月 - Webtech Walker

前回の1-4の、やり残し。

ブラウザで無料ではじめるActionScript 3.0 ―It's a wonderfl world―

• 作者: 面白法人カヤック,フォークビッツ
• 出版社/メーカー: ワークスコーポレーション
• 発売日: 2009/12/19
• メディア: 単行本
• クリック: 45回
• この商品を含むブログ (18件) を見る

1-4では時計を作っていたのだけど、まだ自分で作ってみてなかったので作ってみた。

時計を作ってみる | wonderfl build flash online

要は適当なループで時刻をチェックし、時刻が変更されていたら表示を変えればいい、というだけ？

ENTER_FRAME内でやるか、timerで間隔あけてチェックするかでマシンへの負荷が変わったりするのかも知れない。

あと前回覚えたビットマップエフェクトを使ってちょっとカッコよく数字が変化するようにしてみた。

// forked from sugyan's 時計を作ってみる
package {
    import flash.display.Bitmap;
    import flash.display.BitmapData;
    import flash.display.Sprite;
    import flash.events.Event;
    import flash.filters.BitmapFilterQuality;
    import flash.filters.BlurFilter;
    import flash.geom.Point;

    [SWF(width="465", height="465", backgroundColor="0x000000")]
    public class FlashTest extends Sprite {
        private var _prevH:Number;
        private var _prevM:Number;
        private var _prevS:Number;
        private var _texts:Array = [
            new MyText(  1, 120),
            new MyText( 73, 120),
            new MyText(161, 120),
            new MyText(233, 120),
            new MyText(321, 120),
            new MyText(393, 120),
        ];
        private var _bmp:Bitmap = new Bitmap();
        private var _bmd:BitmapData = new BitmapData(465, 465, true, 0xFFFFFF);
        private var _filter:BlurFilter = new BlurFilter();
        
        public function FlashTest() {
            _bmp.bitmapData = _bmd;
            _filter.quality = BitmapFilterQuality.HIGH;
            addChild(_bmp);
            var colon1:MyText = new MyText(130, 110, ":");
            var colon2:MyText = new MyText(290, 110, ":");
            addChild(colon1);
            addChild(colon2);
            for (var i:int = 0; i < _texts.length; i++) {
                addChild(_texts[i]);
            }
            addEventListener(Event.ENTER_FRAME, function (event:Event):void {
                var date:Date = new Date();
                var second:Number = date.seconds;
                var minute:Number = date.minutes;
                var hour:Number   = date.hours;
                if (hour != _prevH) {
                    var h:Number = hour % 10;
                    _changeText(_texts[1], h);
                    if (h != 0 || _texts[0].isEmpty()) {
                        _changeText(_texts[0], (hour - h) / 10);
                    }
                    _prevH = hour;
                }
                if (minute != _prevM) {
                    var m:Number = minute % 10;
                    _changeText(_texts[3], m);
                    if (m == 0 || _texts[2].isEmpty()) {
                        _changeText(_texts[2], (minute - m) / 10);
                    }
                    _prevM = minute;
                }
                if (second != _prevS) {
                    var s:Number = second % 10;
                    _changeText(_texts[5], s);
                    if (s == 0 || _texts[4].isEmpty()) {
                        _changeText(_texts[4], (second - s) / 10);
                    }
                    _prevS = second;
                }
                _bmd.applyFilter(_bmd, _bmd.rect, new Point(0, 0), _filter);
            });
        }
        
        private function _changeText(text:MyText, num:Number):void {
            _bmd.draw(text);
            text.changeText(num);
        }
    }
}


import flash.display.Sprite;
import flash.text.TextField;
import flash.text.TextFormat;

class MyText extends Sprite {
    private var _text:TextField = new TextField();
    public function MyText(x:Number, y:Number, initText:String = "") {
        addChild(_text);

        _text.x = x;
        _text.y = y;
        _text.width = 72;
        _text.background = false;

        var format:TextFormat = new TextFormat();
        format.color = 0xFFFFFF;
        format.size = 150;
        _text.defaultTextFormat = format;

        _text.text = initText;
    }
    
    public function isEmpty():Boolean {
        if (_text.text.length > 0) {
            return false;
        }
        return true;
    }

    public function changeText(num:Number):void {
        _text.text = num.toString();
    }
}

出来たもの -> forked from: 時計を作ってみる | wonderfl build flash online

なんかキレイなコードの書き方がわからないなー

昨日に引き続き、学習中。

ブラウザで無料ではじめるActionScript 3.0 ―It's a wonderfl world―

• 作者: 面白法人カヤック,フォークビッツ
• 出版社/メーカー: ワークスコーポレーション
• 発売日: 2009/12/19
• メディア: 単行本
• クリック: 45回
• この商品を含むブログ (18件) を見る

今日は1-4 時計を作ろうを読んだ。

TimerEventはまだ触ったことがないからちょっとやってみたいと思ったんだけど、面白そうだと思ったのはビットマップエフェクト。

Electrogram clock | wonderfl build flash online

このサンプルについての解説が載っていて、現れては消えていく線はビットマップエフェクトを使って表現されているそうな。

var _bmp:Bitmap = new Bitmap();
var _bmd:BitmapData = new BitmapData(465, 465, false, 0x000000);
_bmp.bitmapData = _bmd;

のようにしてBitMapDataインスタンスを登録したBitMapインスタンスを用意してaddChild()などで画面に追加、あとはBitmapDataインスタンスに対しdraw()メソッドで引数に渡したDisplayObjectのスナップショットをそこに描画したり、フィルタリングしたりできるらしい。

昨日書いたマウスの動きを追従する円の残像のようなものを、線に対し連続でBlurFilterをかけることで表現できるのでは？と書いてみた。

// forked from sugyan's forked from: flash on 2010-1-21
// forked from sugyan's flash on 2010-1-21
/* ドラッグ操作で滲むような線を描く */
package {
    import flash.filters.BlurFilter;
    import flash.display.BitmapData;
    import flash.display.Bitmap;
    import flash.display.Sprite;
    import flash.geom.Point;
    import flash.events.Event;
    import flash.events.MouseEvent;

    public class FlashTest extends Sprite {
        private var _line:MyLine = new MyLine(5, 0xFF0000);
        private var _bmp:Bitmap = new Bitmap();
        private var _bmd:BitmapData = new BitmapData(465, 465, false, 0x000000);
    	    
        public function FlashTest() {
            _bmp.bitmapData = _bmd;
            addChild(_bmp);
            stage.addEventListener(MouseEvent.MOUSE_DOWN, function (event:MouseEvent):void {
                _line.startDraw(new Point(event.stageX, event.stageY));
                stage.addEventListener(MouseEvent.MOUSE_MOVE, onMouseMove);
            });
            stage.addEventListener(MouseEvent.MOUSE_UP, function (event:MouseEvent):void {
                stage.removeEventListener(MouseEvent.MOUSE_MOVE, onMouseMove);
            });
            stage.addEventListener(Event.ENTER_FRAME, onEnterFrame);
        }

        private function onMouseMove(event:MouseEvent):void {
            _line.drawLine(new Point(event.stageX, event.stageY));
            _bmd.draw(_line);
        }
        
        private function onEnterFrame(event:Event):void {
            _bmd.applyFilter(_bmd, _bmd.rect, new Point(0, 0), new BlurFilter(5, 5));
        }
    }
}


import flash.geom.Point;
import flash.display.Sprite;

class MyLine extends Sprite {
    private var _prevX:Number;
    private var _prevY:Number;
    private var _thickness:Number;
    private var _color:uint;

    public function MyLine(thickness:Number, color:uint) {
        _thickness = thickness;
        _color = color;
    }
	
    public function startDraw(point:Point):void {
        _prevX = point.x;
        _prevY = point.y;
    }
	
    public function drawLine(point:Point):void {
        graphics.clear();
        graphics.lineStyle(_thickness, _color);
        graphics.moveTo(_prevX, _prevY);
        graphics.lineTo(point.x, point.y);
        _prevX = point.x;
        _prevY = point.y;
    }
}

出来たのがコレ -> forked from: forked from: flash on 2010-1-21 | wonderfl build flash online

forkして作ったけど結局全然別物になってしまったｗ

ボタンダウンしている時だけマウス移動に伴い連続で直線がBitmapDataに描画されていくのだけど、同時にENTER_FRAMEのイベントで常時BlurFilterでぼかしをかけているので時間が経つと消えていく。

なるほどー、こうやってエフェクトかけることができるんだ！

BitmapFilterは他にも種類があるしBitmapDataにも色々なメソッドがある。組み合わせて使いこなすことでもっとたくさんのエフェクトができるようになるんだろうなー。

せっかくなので時計っぽいものも作っておきたい。次は2章だ！！

追記

どうもマウスを速く動かすと線がカクカクしてしまう。

隣の席にいる某天才に訊いてみたところ、MOUSE_MOVEでのイベントで描画するよりもENTER_FRAMEの方が優先度が高いはずなのでより滑らかに書けるのでは？と言われ、書き換えてみた。

forked from: forked from: forked from: flash on 2010-1-21 | wonderfl build flash online

結局あまり変わらなかった…残念。

ブラウザで無料ではじめるActionScript 3.0 ―It's a wonderfl world―

• 作者: 面白法人カヤック,フォークビッツ
• 出版社/メーカー: ワークスコーポレーション
• 発売日: 2009/12/19
• メディア: 単行本
• クリック: 45回
• この商品を含むブログ (18件) を見る

本が手元に届いて3日も経ってしまったけど、ようやく読み始めた！

なんとなく既に分かっていそうな序盤を適度に読み飛ばしつつ…

面白いと思ったのは1-3 インタラクティブな動きを学ぶでの「タイムライン」の話。あまりこういう動きのあるものを作ったことがなかったし、イージングというのも用語は全然知らなくて、でも読んでみるとたしかに納得、簡単に書けそうだ！と思って自分でもwonderflで書いてみた。

/* マウスをゆっくり追従してくるサンプル */
package {
    import flash.events.Event;
    import flash.events.MouseEvent;
    import flash.display.Sprite;

    public class FlashTest extends Sprite {
        private var _circle:MyCircle = new MyCircle();
        private var _targetX:Number;
        private var _targetY:Number;
        private var _easeRatio:Number = 0.1;
    	    
        public function FlashTest() {
            addChild(_circle);
            stage.addEventListener(MouseEvent.MOUSE_MOVE, onMouseMove);
            stage.addEventListener(Event.ENTER_FRAME, onFrame);
        }
        
        private function onMouseMove(event:MouseEvent):void {
            _targetX = event.stageX;
            _targetY = event.stageY;
        }
        
        private function onFrame(event:Event):void {
            var dX:Number = _targetX - _circle.x;
            var dY:Number = _targetY - _circle.y;
        	    
            _circle.x += dX * _easeRatio;
            _circle.y += dY * _easeRatio;
        }
    }
}


import flash.display.Sprite;

class MyCircle extends Sprite {
    public function MyCircle() {
	graphics.beginFill(0xFF0000);
	graphics.drawCircle(0, 0, 10);
    }
}

作品はここで動かせます -> flash on 2010-1-21 | wonderfl build flash online

たったこれだけで、円がマウスを"ゆっくり"追従してくるインタラクティブなアニメーションが書ける！なるほどー。

ここからイージングの比率を場面に応じて変えたり、円の移動に残像のようなものを残すようにしたりすると面白そう。あとでやってみようっと

追記

残像を出して追従の軌跡がわかりやすくなるようにしてみた

forked from: flash on 2010-1-21 | wonderfl build flash online

MacのTerminalでscreenを使ってる。ステータスラインは邪魔だから要らないと思っていたけど、さすがにwindowの数が多くなってくると把握できないし自分がどこを開いているのかもよく分からなくなってきたので、表示させることにした。

表示させるだけの設定は、.screenrcに

hardstatus on

だけでOK。常時最下行に表示させる場合は

hardstatus alwayslastline [string]

とかで、[string]に表示させる内容を指定できる。

ここに指定できる特殊文字列については"man screen"すれば載っているので頑張って読む。

読みたくなくて検索するとよくヒットするのが下記の設定。

- unknownplace.org

中身についてはここで解説されていたり。

hardstatusを解読 - urekatのスカンク日記３

自分はこれに倣って

hardstatus alwayslastline "%-w%{= ck}%n %t%{-}%+w"

と設定した。

"%w"でウィンドウ番号とウィンドウ名を表示させられるけど、現在選択しているウィンドウだけ違う表示をするために"%-w"と"%+w"に分けて、カレントウィンドウは"%n %t"(number, title)で表示。カレントの部分だけ色を変更するように"%{= ck}"でシアン背景、黒文字表示。

で、%tで表示されるwindow titleは、何もしない状態だと普通シェル名(zsh使っていれば"zsh")が表示される。これは"\ek"と"\e\\"で挟んだ文字列で指定することができるらしい(よくわかってない)。

echo -ne "\ekhoge\e\\"

といったものを.zshrcのpreexec()内で使うことで実行中のコマンド名に設定することができる。

メモの日々(2008-03-31)

実行終了後も同じものが表示され続けるのがイヤだったので今度はprecmd()で元に戻す。

しかしprecmd()内でechoを使われるとscreenじゃないときにもコマンド実行ごとに表示されてしまう。

ので$TERM値によってprecmd()を使い分ける。

setopt prompt_subst
RPROMPT='%{${fg[green]}%}%/%{$reset_color%}'
common_precmd() {
    LANG=en_US.UTF-8 vcs_info
    LOADAVG=$(sysctl -n vm.loadavg | perl -anpe '$_=$F[1]')
    PROMPT='${vcs_info_msg_0_}%{${fg[yellow]}%}%* ($LOADAVG) %%%{$reset_color%} '
}
case $TERM in
    screen)
        preexec() {
            echo -ne "\ek$1\e\\"
        }
        precmd() {
            echo -ne "\ek$(basename $SHELL)\e\\"
            common_precmd
        }
        ;;
    *)
        precmd() {
            common_precmd
        }
        ;;
esac

これで一応自分のやりたい表示にはなった。

それにしても.screenrcとか.zshrcとかで指定する文字列は覚えられん。。