/*
 * ExtJS Raptorizer Plugin 0.1
 * By Joshua M. Thompson
 *
 * Derived from:
 *
 * jQuery Raptorize Plugin 1.0
 * www.ZURB.com/playground
 * Copyright 2010, ZURB
 * Free to use under the MIT license.
 * http://www.opensource.org/licenses/mit-license.php
*/

Ext.namespace('Ext.ux');

Ext.ux.KeySequenceTrigger = Ext.extend(Ext.util.Observable, {
    sequence: "38,38,40,40,37,39,37,39,66,65",
    useAudio: false,
    single:   true,

    keys: [],

    constructor: function (config) {
        Ext.ux.KeySequenceTrigger.superclass.constructor.call(this, config);

        Ext.apply(this, config);

        this.addEvents('activate');

        if (!this.el) {
            this.el = Ext.getDoc();
        }

        this.el.on('keydown', this.onKeyDown, this);

        if (this.useAudio && (Ext.isGecko3 || Ext.isWebKit)) {
            var html = '<audio preload="auto">';

            for (var i = 0 ; i < this.audioUrls.length ; i++) {
                html = html + '<source src="' + this.audioUrls[i] + '" />';
            }

            html = html + '</audio>';

            this.audioEl = Ext.DomHelper.append(document.body, html, true);
        }
    },

    onKeyDown: function (e, t, o) {
        this.keys.push(e.getKey());

        if (this.keys.toString().indexOf(this.sequence) >= 0) {
            if (this.single) {
                this.el.un('keydown', this.onKeyDown, this);
            }

            if (this.audioEl) {
                this.audioEl.dom.play();
            }

            this.fireEvent('activate', this, this.el);
        }
    }
});

Ext.ux.Raptorizer = Ext.extend(Ext.util.Observable, {
    useAudio: true,     // wehther or not to play audio when the browser supports it

    imageUrl: 'raptor.png',
    audioUrls: ['raptor-sound.mp3', 'raptor-sound.ogg'],

    locked: false,

    constructor: function (config) {
        Ext.ux.Raptorizer.superclass.constructor.call(this, config);

        Ext.apply(this, config);

        this.createElements();

        if (this.triggerType == 'timer') {
            this.timeoutId = this.onActivate.defer(this.delayTime, this);
        }
        else if (this.triggerType == 'click') {
            this.el.on('click', this.onClick, this);
        }
        else if (this.triggerType == 'trigger'){
            if (!this.trigger) {
                this.trigger = new Ext.ux.KeySequenceTrigger(this.triggerConfig);
            }

            this.trigger.on('activate', this.onActivate, this);
        }
    },

    createElements: function () {
        this.imageEl = Ext.DomHelper.append(document.body, '<img style="display: none" src="' + this.imageUrl + '" />', true);
        this.imageEl.setStyle({
            "display": "block",
            "position": "fixed",
            "bottom": "-1000px",
            "right": "0"
        });

        if (this.useAudio && (Ext.isGecko3 || Ext.isWebKit)) {
            var html = '<audio preload="auto">';

            for (var i = 0 ; i < this.audioUrls.length ; i++) {
                html = html + '<source src="' + this.audioUrls[i] + '" />';
            }

            html = html + '</audio>';

            this.audioEl = Ext.DomHelper.append(document.body, html, true);
        }

    },

    onActivate: function () {
        this.locked = true;

        if (this.audioEl) {
            this.audioEl.dom.play();
        }

        this.startAnimation(this.imageEl);
    },

    onClick: function (e, t, o) {
        if (!this.locked && e.shiftKey) {
            e.stopEvent();

            this.onActivate();
        }
    },

    remove: function (el) {
        this.locked = true;

        if (this.triggerType == 'timer') {
            clearTimeout(this.timeoutId);
        }
        else if (this.triggerType == 'click') {
            this.el.un('click', this.onClick, this);
        }
        else if (this.triggerType == 'triggger') {
            this.trigger.un('activate', this.onActivate, this);
        }

        if (this.imageEl) {
            this.imageEl.remove();
        }

        if (this.audioEl) {
            this.audioEl.remove();
        }
    },

    startAnimation: function (el) {
        el.alignTo(document, 'b-b');
        el.sequenceFx();
        el.slideIn('b', { duration: 9 });
        el.puff({ duration: 6, remove: true });
    }
});