近頃は小ネタばかりでまともなサンプルコードを書いていないと気が付いた。
このブログらしくないので久々に小物アプリ作ってみます。

もちろん JavaScript(Gjs) で。
基本は大分やったと思うので実際に何か作ってみるとどうかを試したい。
経験で実際にアプリを作ってみないと気が付かないことが多いと知っている。

とりあえず今回はデスクトップマスコットを。
背景が透過されている PNG 画像をデスクトップに表示というありがちなもので。

常にすべての GUI アプリの再背面に表示とかイベントの処理とかのサンプルにも。
それなら応用範囲も広がるだろう、と勝手に考える。
何より重要なのが GtkApplication を必ず使う。
でないと後々で困ることになりそうな謎の雰囲気があるのですよ。
GNOME 公式サンプルからして。

ということで。
背景透過画像は以下からカワイイ苗ちゃんを拾って使う。

【ウチ姫】UR++「小粒姫 優木 苗」ステータス・評価まとめ – お姫さま図鑑｜ウチ姫公式攻略Wiki – GAMY（ゲーミー）

んで、こんなコードになりました。

#!/usr/bin/gjs

const Gtk = imports.gi.Gtk;
const Gdk = imports.gi.Gdk;
const Gio = imports.gi.Gio;
const GLib = imports.gi.GLib;
const GdkPixbuf = imports.gi.GdkPixbuf;
const Lang = imports.lang;

const NaeWindow = new Lang.Class({
    Name: 'NaeWindow',
    Extends: Gtk.ApplicationWindow,

    _init: function(app) {
        this.parent({
            application: app
        });
        // GdkColormap to GdkVisual
        let screen = this.get_screen();
        let visual = screen.get_rgba_visual();
        if (visual != null && screen.is_composited()) {
            this.set_visual(visual);
        } else {
            print("no Composited...");
        }
        this.set_app_paintable(true);
        // Transparent background image
        this.pixbuf = GdkPixbuf.Pixbuf.new_from_file_at_size("nae_ur++.png", 300, 300);
        // Event Mouse
        //this.set_events(Gdk.EventMask.BUTTON_PRESS_MASK);
        this.connect("button-press-event", Lang.bind(this, function(widget, event) {
            /* NG
            https://people.gnome.org/~gcampagna/docs/Gdk-3.0/Gdk.Event.html
            
            if (event.type === Gdk.EventType.BUTTON_PRESS) {
                this.begin_move_drag(event.button, event.x_root, event.y_root, event.time);
            */
            if (event.get_event_type() === Gdk.EventType.BUTTON_PRESS) {
                let [res, x_root, y_root] = event.get_root_coords();
                this.begin_move_drag(
                    event.get_button()[1],
                    x_root,
                    y_root,
                    event.get_time()
                );
            } else if (event.get_event_type() == Gdk.EventType.DOUBLE_BUTTON_PRESS) {
                this.close();
            }
        }));
        // Event Draw
        this.connect("draw", Lang.bind(this, function(widget, cr) {
            Gdk.cairo_set_source_pixbuf(cr, this.pixbuf, 0, 0);
            cr.paint();
        }));
        // z-order
        this.set_keep_below(true);
        // etc
        this.set_decorated(false);
        this.resize(300, 300);
        this.show_all();
    }
});

const Application = new Lang.Class({
    Name: 'Application',
    Extends: Gtk.Application,

    _init: function() {
        // TaskBar Title
        GLib.set_prgname("Nae Chan !");
        // property
        this.parent({
            application_id: 'apps.test.NaeChan',
            flags: Gio.ApplicationFlags.FLAGS_NONE
        });
    },
    // override activate signal
    vfunc_activate: function() {
        new NaeWindow(this);
    }
});
let application = new Application();
application.run(ARGV);

あぁ、苗ちゃんがいつもデスクトップにいる。
カワイイよぉ、剥製にして飾…（嘘です

最近気が付いた、g_set_prgname でアクティビティ横の文字列を決められる。
たしか Ubuntu は違ったような、まあ猿専用ディストリなんてガン無視でいい。

そんなことより。
button-press-event ハンドラの仕様は何なんだよ！

Gdk.Event

UNION だとこういうバインドしか手段が無いのか、それとも別の理由か。
現状 Python, C のようにメソッドは使えず関数で取得しか手が無い。

ぶっちゃけ。
コレで混乱しなかったらこんな素敵なサイトなんて見つけられなかったぞ！
やはり何か具体的にアプリを作ってみないと解らない事って多い。

Gjs のサンプルコードはほとんど以下が書いてある。

const Lang = imports.lang;

この lang.js って今はドコにあるの？
以前は /usr/share/gjs-1.0 以下にあったのに。

Gjs は gir 以外のモジュールをどこから探しているのだろう。
以下のコードで調べることができるようだ。

#!/usr/bin/gjs

let list = imports.searchPath;
for (let s of list) {
    print(s);
}
/* output @ 3.18
resource:///org/gnome/gjs/modules/
/usr/local/share/gjs-1.0
/usr/share/gjs-1.0
/usr/share/gjs-1.0
*/

こんなディレクトリは 3.18 では存在しない。
どうやら現行版はリソース化されてソレを参照しているようだ。

ちなみにこの resource:///org/gnome/* は Gvfs の URI でして。
たとえば Nautilus にて Ctrl+L して resource:/// と打ち込むと。

と Nautilus が参照しているリソースにアクセスできます。
ファイルに見えるけど拡張子が無いものはディレクトリ。
Gedit の FileChooserDialog で Ctrl+L しても同じようにできます。

各アプリが参照しているリソースにしかアクセスできませんので注意。
ということで、Gjs のリソースの中身を探してみる。

gjs/modules at master ? GNOME/gjs ? GitHub

上記がリソースの中身らしい、lang.js もしっかりあります。
以前書いた format.js もこの中にある。
Here Document | PaePoi

色々まとめようと思ったけどバージョンでコロコロ変わりそう。
もしかしたら Gjs も PyGObject 同様にバージョン指定が必要になるかも。
Fedora 24 が出てからもう少し確認しよう。

GNOME 開発センター

もはや GNOME 公式の overview が Gjs なんだよな。
vfunc_* のオーバーライドを使っていないのは何故だ？

GitHub – gcampax/gtk-js-app: A template for a standard Gtk/GNOME JS application

コッチのほうが解りやすい、メモメモ。