Programujeme applet pro Cinnamon

programovaniCinnamon má velkou možnost rozšíření, které dnes známe jako „koření“ (Cinnamon spices). Tyto spices jsou desklety, applety, extensions (modifikace chování systému) a témata. Dnes bych se chtěl zaměřit na programování jednoho appletu pro váš panel, který kupříkladu spustí prohlížeč na nějaké stránce. Co potřebujeme? Nějaké IDE (například výchozí Gedit, Geany, atd.) a základní znalost Javascriptu (já jsem si na jednoduchý applet vystačil s velmi základní znalostí z tvorby webů).

Základním stavebním kamenem je GJS, což je jakási upravená verze Javascriptu, přesněji Gnome JavaScript, dříve se programovali rozšíření v Pythonu. Do samotného kódu můžete importovat spousty knihoven a popřípadě i volat programy uvnitř samotného počítače a brát si jejich výsledky.

Nejprve je třeba si zvolit jméno appletu ve tvaru <jméno_appletu>@<nějaká_informace>, kde je jméno_appletu je zvolené jméno, v tomto případě „browser“ a nějaká_informace je typicky odkaz na tvůrce, zde naše webové stránky „linux-mint-czech.cz“. Při zvolení tedy vytvoříme odpovídající adresář a rovnou do něj přejdeme:

ondrej@ondrej-Lenovo-IdeaPad-Y570 ~ $ mkdir ~/.local/share/cinnamon/applets/browser@linux-mint-czech.cz
ondrej@ondrej-Lenovo-IdeaPad-Y570 ~ $ cd ~/.local/share/cinnamon/applets/browser@linux-mint-czech.cz

Každá složka appletu má minimálně dva soubory a to „applet.js“, jako hlavní skript, a „metadata.json“ jako metadata o tom skriptu, ty vytvoříme pomocí skriptu a navíc uděláme hlavní applet.js spustitelný.

ondrej@ondrej-Lenovo-IdeaPad-Y570 ~/.local/share/cinnamon/applets/browser@linux-mint-czech.cz $ touch metadata.json applet.js && chmod +x applet.js

Teď vyplníme informace o pluginu v souboru „metadata.json“

{
„uuid“: „browser@linux-mint-czech.cz“,
„name“: „Oblíbená stránka“,
„description“: „Klepněte na applet a spustí se vám oblíbená stránka“,
„icon“: „star“
}

uuid je unikátní ID appletu, které se musí shodovat s názvem složky, name je jméno appletu a description je popis appletu. Icon určuje ikonu na základě GTK jména. Tento popis je všude víceméně stejný, ve všech appletech a potřebuje ho právě správa appletů.

Applet.js

const Lang = imports.lang;
const Applet = imports.ui.applet;
const GLib = imports.gi.GLib;
const Gettext = imports.gettext.domain(‚cinnamon-applets‘);
const _ = Gettext.gettext;
const url = „http://linux-mint-czech.cz/category/clanky“;
function MyApplet(orientation) {
this._init(orientation);

}

MyApplet.prototype = {
__proto__: Applet.IconApplet.prototype,
_init: function(orientation) {
Applet.IconApplet.prototype._init.call(this, orientation);
try {
this.set_applet_icon_name(„star“);
this.set_applet_tooltip(_(url));
}
catch (e) {
global.logError(e);
}
},
on_applet_clicked: function(event) {
GLib.spawn_command_line_async(‚xdg-open ‚ + url);
}
};
function main(metadata, orientation) {
let myApplet = new MyApplet(orientation);
return myApplet;
}

 

applet-150x53Vytvořený applet

Tak to je celý kód, teď se ním prokoušeme.

const Lang = imports.lang;
const Applet = imports.ui.applet;
const GLib = imports.gi.GLib;
const Gettext = imports.gettext.domain(‚cinnamon-applets‘);
const _ = Gettext.gettext;
const url = „http://linux-mint-czech.cz/category/clanky“;

 

Nejprve importujeme knihovny a připravíme si konstantu, kterou bude možno měnit, podle zvolené stránky. V tuto chvíli máme naimportované veškeré API a můžeme zavolat konstruktor.

 

function MyApplet(orientation) {
this._init(orientation)
}

Všimněte si, že všechny applety můžete podle libosti nazvat MyApplet, název funkce nemá smysl, ale pro jednoduchost je dobré se toho držet, orientation je orientace panelu (jeli nahoře, či dole) a předává vám ji Cinnamon při volání skriptu. Teď vytvoříme třídu appletu

Poznámka: applet může být textový (TextApplet), ikonový (IconApplet), obojí (TextIconApplet) a nebo čistý applet, který naplníte čímkoliv (Applet).

MyApplet.prototype = {
__proto__: Applet.IconApplet.prototype,
_init: function(orientation) {
Applet.IconApplet.prototype._init.call(this, orientation);
//Tady je vidět, že rozšiřujeme třídu IconApplet, která nám říká, že budeme mít applet
//reprezentovaný ikonou, teď je na řadě hlavní část appletu.
try {
this.set_applet_icon_name(„star“);
//nastavení ikony
this.set_applet_tooltip(url);
//Nastavení popisku
}

catch (e) {
global.logError(e);
}
},
//Při klepnutí otevřít stránku
on_applet_clicked: function(event) {
GLib.spawn_command_line_async(‚xdg-open ‚ + url);
//GLib je knihovna obsluhující komunikaci s Gnome (Cinnamon) a tím pádem s celým systémem
//spawn_command_line_async je otevření příkazové řádky asynchroně, což znamená, že neočekávám odpověď
//xdg-open je bash funkce k otevření cesty předvoleným uživatelským programem
}
};
function main(metadata, orientation) {
let myApplet = new MyApplet(orientation);
return myApplet;
}

Debugging, neboli odvšivení

V případě, že se děje, něco, co by nemělo, applet se nenačítá apod. je vhodné sáhnout po odvšivovacím nástroji looking glass, který spouštíte pomocí Alt + F2 a napsání lg, popřípadě cinnamon-looking-glass (ty Cinnamon Looking Glass vhodné dát pod nějakou zkratku, například Ctrl + Alt +G tak, aby jste si je mohli rychle zobrazit a skrývat)

Závěr

Vývoj je neskutečně zábavná věc a začít není tak obtížné, jen je třeba počítat, že člověk na tom začátku nějaký čas pobude a bude přešlapovat, proto je vhodné si nechat radit od někoho zkušenějšího, ti z vás kdo umí anglicky ať se podívají na nějaké vygooglené stránky, popřípadě ať se ptají na irc.spotchat.org #linuxmint-dev, kde je stále někdo a třeba vám i poradí (mně se snažil poradit i samotný Clem :D). Praktický příklad naleznete všechny applety již vytvořené, pořádně je projděte a naleznete v nich inspiraci a poučení.

Pokud budete mít dojem, že máte něco funkčního, užitečného a chuť sdílet to, jděte na stránku http://www.cinnamon-spices.linuxmint.com, kam můžete applet nahrát a nechat ho žít život open-source ve světě Linux Mint, přesněji Cinnamon.

Poznámka: WordPress zde mění uvozovky, je třeba dodržet standartní, zdrojové kódy (bezchybné) jsou zde: browser@linux-mint-czech.cz

Štítky , .Záložka pro permanentní odkaz.

Autor: Ondřej Kolín

Student MFF, spokojený uživatel Linux Mint a mám spoustu zajímavých koníčků, které sem raději nebudu ani psát...

5 reakcí na Programujeme applet pro Cinnamon

  1. rootan1 říká:

    Zdravím,
    nedaří se mi takto vytvořený applet přidat na panel. Jestli by se měl objevit v seznamu appletů, tak se tak nestane ani po restartu. Jestli je nějaký příkaz pro aktualizaci seznamu appletů, tak se mi ho nepodařilo objevit. Prosím proto o pomoc.

  2. Ondřej Kolín říká:

    Dobře, v tuto chvíli je třeba nasadit právě looking glass(teoreticky jsem mohl při přepisu udělat chybu). Tedy (Alt + F2 a „lg“ bez uvozovek) a tam v Errors by měla být uvedena chyba, připadně mi napište na ondrej.kolin@tahlectastranka

  3. Ondřej Kolín říká:

    Uvozovky jsou WP měněny (bez mé vůle)… Pokusím se to upravit

  4. Anonym říká:

    řádek s url je již neplatný, použijte:

    const url = "https://www.linux-mint-czech.cz";

  5. Anonym říká:

    celý funkční příklad:


    const Applet = imports.ui.applet;
    const GLib = imports.gi.GLib;
    const Lang = imports.lang;
    const Gettext = imports.gettext;
    const UUID = "browser@linux-mint-czech.cz";
    const url = "https://www.linux-mint-czech.cz";

    function MyApplet(orientation) {
    this._init(orientation);
    }

    MyApplet.prototype = {
    __proto__: Applet.IconApplet.prototype,
    _init: function(orientation) {
    Applet.IconApplet.prototype._init.call(this, orientation);
    try {
    this.set_applet_icon_name("star");
    this.set_applet_tooltip(url);
    }
    catch (e){
    global.logError(e);
    }
    },
    on_applet_clicked: function(event) {
    GLib.spawn_command_line_async('xdg-open ' + url);
    }
    };

    function main(metadata, orientation) {
    let myApplet = new MyApplet(orientation);
    return myApplet;
    }