﻿///<reference path="../../Lib/Extjs_Intellisense.js" />

Ext.namespace('LUL');

var iframePanelTPL = new Ext.XTemplate(
    '<tpl for="PanelData">',
        '<div id="iframePanel{parent.id}Title" class="title">{name}</div>',
        '<div style="{style}" class="iframeBox"><iframe id="iframe{parent.id}" src="{src}" frameborder="0" width="{width}" height="{height}"></iframe></div>',
    '</tpl>'
);

// redigeringspanel för extern panel (iframe)
LUL.IframeEditor = Ext.extend(LUL.EditorPanel, {
    constructor: function(c) {
        var ee = Ext.get(c.editId);
        if (ee.getHeight() < 100) c.height = 100;
        //c.height = ee.getHeight() + 52;

        LUL.IframeEditor.superclass.constructor.call(this, Ext.apply(c, {}));
    },

    initComponent: function() {
        LUL.IframeEditor.superclass.initComponent.call(this);
        this.add({ html: '<iframe src="' + this.data.PanelData.src + '" frameborder="0" width="100%" height="100%"></iframe>' });
        this.setTitle(this.data.PanelData.name);
        if (document.selection && document.selection.createRange().htmlText == '') document.selection.clear();
    },

    onSave: function() {
        /*if (this.data.path) {
        var p = this;

            function success() {
        p.getEl().unmask();
        LUL.IframeEditor.superclass.onSave.call(p);
        flashPanelTPL.overwrite(p.editElement, p.data);
        }

            function failure() {
        p.getEl().unmask();
        alert('Kunde inte spara!');
        }

            this.getEl().mask('Sparar');

            Ext.Ajax.request({
        url: dataManager.editIframeURL,
        success: success,
        failure: failure,
        params: { id: this.data.PanelData.id, src: this.data.path }
        });
        } else {
        this.onClose();
        }*/
        this.onClose();
    },

    onClose: function() {
        LUL.IframeEditor.superclass.onClose.call(this);
        iframePanelTPL.overwrite(this.editElement, this.data);
    },

    onPanelSettings: function() {
        var fieldNames = [
            ['Namn', 'PanelData.name', false, 'Panelens namn & titel'],
            ['Url', 'PanelData.src', false, 'Adress till hemsida som ska visas'],
            ['Bredd', 'PanelData.width', false, 'Bredd i pixlar eller %'],
            ['Höjd', 'PanelData.height', false, 'Höjd i pixlar eller %'],
            ['Automatisk uppdatering', 'PanelData.autoUpdate', true, 'Uppdateringsintervall i sekunder'],
            ['CSS stilmall', 'PanelData.style', true],
            ['CSS klass', 'PanelData.cls', true]
        ];
        this.showPanelSettings(fieldNames, dataManager.editIframePanelSettingsURL, function() {
            this.getEl().child('iframe').dom.src = this.data.PanelData.src;
        });
    }
});

// hantera dubbelklick på sidan
LUL.IframeEditor.onDblClick = function(e) {
    LUL.EditorPanel.onDblClick(e, 'div.iframePanel');
}

// skapar ny textpanel och öppnar editorn för den
LUL.IframeEditor.createNew = function(marker, insertBefore) {
    function success(res, id) {
        Ext.get('iframePanelX').set({
            id: 'iframePanel' + id,
            cls: 'iframePanel',
            html: iframePanelTPL.apply({ id: id, PanelData: { src: '', width: '100%', height: '300', style: '' } })
        });

        Ext.get('iframePanel' + id).on('dblclick', LUL.IframeEditor.onDblClick);
    }

    LUL.EditorPanel.createNew(
        marker,
        insertBefore,
        { tag: 'div', id: 'iframePanelX' },
        dataManager.createIframePanelURL,
        'iframePanel',
        success
    );
}

// laddar en dold panel...
LUL.IframeEditor.loadHiddenPanel = function(marker, insertBefore, dragData) {    
    function success(response, id) {
        Ext.DomHelper.insertAfter(marker, {
            tag: 'div',
            id: 'iframePanel' + id,
            cls: 'iframePanel',
            html: iframePanelTPL.apply({ id: id, PanelData: dragData.panelData })
        });

        Ext.get('iframePanel' + id).on('dblclick', LUL.IframeEditor.onDblClick);
    }

    LUL.EditorPanel.loadHidden(
        marker,
        insertBefore,
        dragData,
        success
    );
}
