Aplikace HelloWorld a jak přidat je do SAGE2

Tvorba aplikace

Jakákoli připravená aplikace pro sage2 by měla obsahovat složku se dvěma soubory uvnitř:

Zdrojový soubor javascript (napr. HelloFIT.js)
Soubor JSON odpovídající zdrojovému kódu - instructions.json

Název složky nesmí obsahovat mezery!

Podívejme se na obsah těchto souborů na příkladu triviální ukázkové aplikace HelloFIT.

Ukázka 1. instructions.json

{
  "main_script": "helloFIT.js",   // přesný název skriptu
  "width": 250,                   // počáteční šířka okna
  "height": 250,                  // počáteční výška okna
  "title": "HelloFIT",            // název okna našeho programu
  "author": "Oleksandr Khokhych"  // volitelný parametr
}

Ukázka 2. HelloFIT.js

// hodnota proměnné musí být přesně stejná jako název skriptu!!!
// ukládá základní šablonu aplikace, kterou rozšíříme
var helloFIT = SAGE2_App.extend({

    // inicializační funkce volaná při vytvoření okna
    // vstupní parametr 'data' má základní informace o okně (x, y, width, height, a date)
    init: function (data) {

        // Inicializace aplikace
        // parametr 'div' je html-tagem kontejneru pro naši aplikaci (img, canvas)
        this.SAGE2Init("div", data);
        // inicializace unikantního id kódu aplikace
        this.element.id = "div" + this.id;
        // přidame informace, kterou chceme vidět na obrazovce do innerHTML
        // platí tady stejná syntaxe HTML
        this.element.innerHTML = "<i style=\"font-size: 24px; color: Orange\">Hello FIT!</i>";
        // uděláme aby pozadí textu bylo bílé
        this.element.style.background = "white";
    },
});