﻿if (!Poseidon.Controls.Print.Module) {
    Poseidon.Controls.Print.Module = {};
}

Poseidon.Controls.Print.Module.LE34MapHeader = Ext.extend(Poseidon.Controls.Print.Module.FixableModule, {
    //style: 'background-color: transparent;',
    //bodyStyle: 'background-color: transparent; border: 0px solid transparent;',        

    stretch: this.stretch || false,

    moduleType: 'le34_map_header',

    layout: 'fit',

    getObject: function () {
        return {
            "module_id": this.module_id,
            "module_name": this.module_name,
            "width": this.width,
            "height": this.height,
            "x": this.x,
            "y": this.y,
            "align_x": this.align_x || this.x || 0,
            "align_y": this.align_y || this.y || 0,
            "align": this.align,
            "logo": this.url_reference,
            "image_width": this.image_width || this.width || 0,
            "image_height": this.image_height || this.height || 0,
            "custom_name": this.controls.nameField.getValue() || '',
            "custom_text": this.controls.textArea.getValue() || ''
        };
    },

    height: 'auto',

    z_index: this.z_index || 100,

    title: 'Korthoved',

    initComponent: function () {

        var logo = {
            xtype: 'box',
            autoEl: {
                tag: 'img',
                src: this.url_reference
            },
            width: '150',
            height: '22'
        };

        this.items = [
        {
            xtype: 'container',
            layout: 'form',
            style: 'padding: 10px;',
            items: [
            {
                xtype: 'label',
                text: 'Navn, dato og kommentarer.'
            }]
        }];

        this.bbar = new Ext.Toolbar({
            items: [
            {
                xtype: 'button',
                iconCls: 'icon-push-pin',
                handler: function (button, event) {
                    this.alignContextMenu.showAt(event.getXY());
                },
                scope: this
            }, {
                xtype: 'button',
                iconCls: 'icon-application-edit',
                handler: function (button, event) {
                    this.controls.editWindow.show();
                },
                scope: this
            }]
        });

        var nameField = new Ext.form.TextField({
            value: this.custom_name,
            fieldLabel: 'Navn'
        });

        var textArea = new Ext.form.TextArea({
            fieldLabel: 'Tekst',
            autoScroll: true,
            height: 50,
            width: 128
        });        

        var editWindow = new Ext.Window({
            title: 'Redigér korthoved',
            width: 280,
            height: 170,
            //autoHeight: true,
            layout: 'fit',
            resizable: false,
            closable: true,
            closeAction: 'hide',
            autoScroll: true,
            collapsible: false,
            modal: true,
            items: [
            {
                xtype: 'container',
                style: 'padding: 4px',
                layout: 'form',
                items: [
                {
                    xtype: 'label',
                    text: 'Indsæt navn og eventuelt en fri tekst.'
                },
                    nameField,
                    textArea
                ]
            }],
            buttons: [
            {
                text: 'Luk',
                handler: function (button, event) {
                    this.custom_name = this.controls.nameField.getValue(); // Ext.getCmp('poseidon-controls-print-module-defaultmapheader-name').getValue();
                    this.custom_text = this.controls.textArea.getValue(); // Ext.getCmp('poseidon-controls-print-module-defaultmapheader-text').getValue();
                    this.controls.editWindow.hide();
                },
                scope: this
            }],
            listeners: {
                close: function (control) {
                    this.custom_name = this.controls.nameField.getValue(); // Ext.getCmp('poseidon-controls-print-module-defaultmapheader-name').getValue();
                    this.custom_text = this.controls.textArea.getValue(); // Ext.getCmp('poseidon-controls-print-module-defaultmapheader-text').getValue();
                },
                scope: this
            }
        });

        this.controls = {
            nameField: nameField,
            textArea: textArea,
            editWindow: editWindow
        }        
        
        // Config object has already been applied to 'this' so properties can 
        // be overriden here or new properties (e.g. items, tools, buttons) 
        // can be added, eg:
//        Ext.apply(this, {
//            bbar: bbar
//        });

        // Call parent (required)
        Poseidon.Controls.Print.Module.LE34MapHeader.superclass.initComponent.apply(this, arguments);
    },

    /**
    * Destructor
    */
    onDestroy: function () {
        Poseidon.Controls.Print.Module.LE34MapHeader.superclass.onDestroy.call(this);

        this.controls.editWindow.destroy();
    }

});
