tokuhirom's Blog

Amon2 をつかったウェブアプリケーションを GUI アプリにはやがわりさせる!!

GUI アプリをつくりたいけど、どうもめんどくさくて、ウェブアプリケーションですませてしまうウェブエンジニアは多いとききます。
とはいえブラウザでいちいちひらくのも面倒だし、daemontools つかうのもちと面倒。。というわけで、GUI アプリケーションにしてしまいましょう。

以下のような、キモい猫が回転する PSGI アプリがあったとします。これを GUI アプリケーションにはやがわりさせるにはどうしたらいいでしょうか。

use strict;
use warnings;
use utf8;
use Amon2::Lite;

get '/' => sub {
    my $c = shift;
    return $c->render('index.tt');
};

# code was taken from: http://jsdo.it/moriyoshi/syTt

__PACKAGE__->to_app;

__DATA__

@@ index.tt
<!doctype html>
<html>
<head>
    <meta charset='utf8'>
    <script type="text/javascript">
        window.onload = function () {
            var n = document.getElementById('sprite');
            var r = 0, s = 1;
            setInterval(function() {
                var trans = 'rotate(' + r + 'deg) scale(' + s + ',' + s + ')';
                n.setAttribute('style', '-moz-transform:' + trans +'; -webkit-transform:' + trans + '; -ie-transform:' + trans + '; transform:' + trans);
                r += .5; s += .01;
            }, 100);
        };
    </script>
    <style>
        body { background-color: #DDDDDD; font: 30px sans-serif; }

        .n {
            background: url(http://a3.twimg.com/profile_images/1379864305/3f2beb73b92a9fcefb3391a90043d5f5.png) no-repeat center;
            width: 100%;
            height: 465px;
        }
    </style>
</head>
<body>
    <div id="sprite" class="n"></div>
</body>
</html>

Gtk2 をつかえばいいんです! Gtk2.pm は AnyEvent が対応しているので、Gtk2 のメインループの中で一緒に Twiggy をうごかすことができます。
ヤッター。

use strict;
use warnings;
use Gtk2 -init;
use Gtk2::WebKit;
use Test::TCP;
use Twiggy;
use Twiggy::Server;
use Plack::Util;
use AE;

my $port = empty_port();
my $app = Plack::Util::load_psgi('app.psgi');


my $twiggy = Twiggy::Server->new(
    host => '127.0.0.1',
    port => $port,
);
$twiggy->register_service($app);

my $window = Gtk2::Window->new;
my $sw     = Gtk2::ScrolledWindow->new;
my $view   = Gtk2::WebKit::WebView->new;

$sw->add($view);
$window->add($sw);

$view->open("http://127.0.0.1:$port");

$window->show_all;

print "Server url: http://127.0.0.1:$port/\n";

AE::cv->recv;

こうして、常にデスクトップの片隅でキモい猫を回転させておくことができるようになりました。
もっと有用なアプリでやれば、もっと有用な使い方ができるかとおもいます。

PSGI のアプリの方はほんとうにただの PSGI アプリなのがポイントですね。

Created: 2012-08-09T05:28:52
Updated: 2012-08-09T05:28:52