Source: main.js

/*
 *  2016 Maciej Wiecierzewski
 */

/**
 * @namespace
 */
var main = {};

main.menuDialog = null;
main.gameplayDialog = null;

main.images = [];

main.minHeight = 0;
main.minWidth = 0;


/**
 * Loads assets and initializes the application
 */
main.init = function()
{
    this.loadQueue = new createjs.LoadQueue();
    this.loadQueue.on("fileload", this.fileLoaded, this);
    this.loadQueue.on("complete", this.assetsLoaded, this);
    this.loadQueue.on("error", this.loadingError, this);
    this.loadQueue.loadManifest("json/game_assets_manifest.json");
    
    this.stage = new createjs.Stage("canvas");
    createjs.Touch.enable(this.stage);
    
    Dialog.stage = this.stage;
    Dialog.addAction('gotoGameplay', function() { this.startGameplay(); }.bind(this) );
    Dialog.addAction('gotoMenu', function() { } );
    
    this.menuDialog = new MenuDialog();
    this.gameplayDialog = new GameplayDialog(gameplay, this.images);
    
    this.menuDialog.show();
    
    window.addEventListener('resize', function(){ this.resize(); }.bind(this) , false);
    
    createjs.Ticker.setFPS(60);
    createjs.Ticker.addEventListener("tick", function() { this.tick(); }.bind(this) );
    
    this.resize();
}

main.tick = function()
{
    this.stage.update();
}

/** Adjusts the interface according to window size */
main.resize = function()
{   
    this.stage.canvas.width = Math.max(window.innerWidth, this.minWidth);
    this.stage.canvas.height = Math.max(window.innerHeight, this.minHeight);
    
    this.stage.canvas.getContext('2d').scale(window.devicePixelRatio,
        window.devicePixelRatio);
    
    Dialog.currentDialog.resize();
}

/** Function called on 'fileload' event */
main.fileLoaded = function(event)
{
    if(event.item.type === "svg")
    {
        this.convertSvgElement(event.result, function(img) {
                this.images[event.item.id] = img;
            }.bind(this) );
    }
}

/** Function called on 'complete' event */
main.assetsLoaded = function()
{
    this.gameplayDialog.images = this.images;
    
    console.log("assets loaded");
}

/** Function called on 'error' event */
main.loadingError = function(event)
{
    data = event.data;
    console.log(event.title+", "+event.message+"; "+event.data);
}

/** Makes the game begin */
main.startGameplay = function()
{
    if(!this.loadQueue.loaded)
        return;
    
    gameplay.levelsData = this.loadQueue.getResult("levels_data");
    gameplay.init();
    gameplay.startTutorial();
    
    this.gameplayDialog.show();
    this.gameplayDialog.drawExpression();
}

/**
 * Becouse EaselJS cannot draw SVG fetched by PreloadJS
 * @param {type} element
 * @param {type} callback
 */
main.convertSvgElement = function(element, callback)
{
    var data = element.innerHTML;
    if(data === undefined)
        return;
    
    var DOMURL = window.URL || window.webkitURL || window;
    
    var img = new Image();
    var svg = new Blob([data], {type: 'image/svg+xml;charset=utf-8'});
    var url = DOMURL.createObjectURL(svg);
    
    img.onload = function()
    {
        //ctx.drawImage(img, 0, 0);
        DOMURL.revokeObjectURL(url);
        
        callback(img)
    }
    
    img.onerror = function(event)
    {
        console.log(event);
    }
    
    img.src = url;
}