﻿if (!Poseidon.Controls.Print.Module) {
    Poseidon.Controls.Print.Module = {};
}

Poseidon.Controls.Print.Module.DefaultMapHeader = Ext.extend(Poseidon.Controls.Print.Module.FixableModule, {
    //style: 'background-color: transparent;',
    //bodyStyle: 'background-color: transparent; border: 0px solid transparent;',        
	minWidth: 100,
	minHeight: 60,
	stretch: this.stretch || false,   
    moduleType: 'default_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,
			"print_width": this.print_width,
			"print_height": this.print_height,
            "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'
        };
		*/
		
		var width = Math.round(this.print_width * OpenLayers.DOTS_PER_INCH / this.dpi);
		var height = Math.round(this.print_height * OpenLayers.DOTS_PER_INCH / this.dpi);		
		
		this.width = width > this.minWidth ? width : this.minWidth;
	    this.height = height > this.minHeight ? height : this.minHeight;
		
        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:
		
        // Call parent (required)
        Poseidon.Controls.Print.Module.DefaultMapHeader.superclass.initComponent.apply(this, arguments);
    },


    /**
    * Destructor
    */
    onDestroy: function () {
        Poseidon.Controls.Print.Module.DefaultMapHeader.superclass.onDestroy.call(this);

        this.controls.editWindow.destroy();
    }

});
