/// <reference path="X:\dev.24sevenoffice.com\media\js\Ext\ext-2.0\adapter\ext\ext-base.js" />
/// <reference path="X:\dev.24sevenoffice.com\media\js\Ext\ext-2.0\ext-all-debug.js" />
/*
*/

Ext.namespace("O24S", "O24S.message");

O24S.message.MessageRecord = Ext.data.Record.create([
	{ name: 'id', mapping: '@id' },
	{ name: 'warningLevel', mapping: 'WarningLevel', type: 'int' },
	{ name: 'title', mapping: 'Title' },
	{ name: 'text', mapping: 'Text' },
	{ name: 'validFrom', mapping: 'ValidFrom', type: 'date', convert: function(v) { return Date.parseDate(v, 'c') } },
	{ name: 'status', mapping: 'Status', type: 'int' }
]);
	O24S.message.MessageView = function(config) {
		config = config || {};

		var tpl = new Ext.XTemplate(
		'<div class="message-view-top"><div class="message-view-line">&nbsp;</div></div>',
		'<tpl for=".">',
			'<div class="message-wrap {cls} {[xindex < xcount ? " has-next" : ""]}">',
				'<div class="message-icon">&nbsp;</div>',
				'<div class="message-title">{title}</div>',
				'<div class="message-date">{validFromString}</div>',
				'<div class="message-text">{text}</div>',
			'</div>',
		'</tpl>',
		'<div class="x-clear"></div>'
	);
		this.addEvents({
			'load': true
		});
		this.store = new Ext.data.Store({
			//url: 'xmlfile.xml',
			//url: '/scriptaspx/communication/message/data/getstatus.aspx',
			// sm
			proxy: new Ext.data.HttpProxy({
				//url: 'xmlfile.xml',
				url: '/scriptaspx/communication/message/data/getstatus.aspx',
				disableErrorHandling: true
			}),
			reader: new Ext.data.XmlReader({
				record: 'Message'
			}, O24S.message.MessageRecord),
			autoLoad: true
		});



		this.statusPanel = new Ext.Panel({
			region: 'north',
			height: 50,
			html: Ext.UpdateManager.defaults.indicatorText
		});
		
		this.view = new Ext.DataView({
			region: 'center',
			cls: 'message-view',
			store: this.store,
			tpl: tpl,
			autoHeight: true,
			multiSelect: true,
			overClass: 'x-view-over',
			itemSelector: 'div.message-wrap',
			prepareData: function(data) {
				data.validFromString = data.validFrom.format('Y-m-d H:i'); // show dates in ISO860Long (minus seconds)				
				var wl = data.warningLevel;
				if (wl === 1) {
					data.cls = 'warning-level-info';
				} else if (wl >= 10) {
					data.cls = 'warning-level-critical';
				} else {
					data.cls = 'warning-level-warning';
				}
				return data;
			}
		});

		Ext.applyIf(config, {
			layout: 'border',
			id: 'o24s-message-view-panel',
			defaults: { border: false },
			items: [this.view, this.statusPanel],
			hideMode: "visibility"
		});

		O24S.message.MessageView.superclass.constructor.call(this, config);
	}

Ext.extend(O24S.message.MessageView, Ext.Panel, {
	// private
	initEvents: function() {
		O24S.message.MessageView.superclass.initEvents.call(this);
		this.store.on('load', this.handleData, this)
		this.store.on('loadexception', this.noData, this); // sm
	},

	// sm
	// I could rewrite it and make the entire thing look way smoother, but i didnt bother...
	noData: function(){
		if (!this.statusTpl) {
			this.statusTpl = new Ext.Template(
					'<div class="status-wrapper {cls}">',
						'<div class="status-icon"><img src="{icon}" /></div>',
						'<div class="status-text">{text}</div>',
					'</div>'
				);
			this.statusTpl.compile();

		}
		this.setVisible(false);
		this.statusTpl.overwrite(this.statusPanel.body, {
			cls: 'failure',
			text: "Could not retrieve status. Try logging in anyway.",
			icon: "/media/icons/ap/32x32/gif/sign_warning.gif"
		});
		
		Ext.get('sysmessage').setHeight(this.statusPanel.el.getHeight() + this.view.el.getHeight() + this.body.getPadding('tb') + 20, { callback: function() { this.setVisible(true); }, scope: this, duration: .3 });
		this.setHeight(this.statusPanel.el.getHeight() + this.view.el.getHeight() + this.body.getPadding('tb'));
	},
	
	// private
	handleData: function(store) {
		window.xml = store;
		if (!this.statusTpl) {
			this.statusTpl = new Ext.Template(
				'<div class="status-wrapper {cls}">',
					'<div class="status-icon"><img src="{icon}" /></div>',
					'<div class="status-text">{text}</div>',
				'</div>'
			);
			this.statusTpl.compile();

		}
		var wl = Ext.DomQuery.selectNumber('Status/WarningLevel', xml.reader.xmlData);
		this.setVisible(false);
		if(wl==0){
			return;
		}
		this.statusTpl.overwrite(this.statusPanel.body, {
			cls: wl > 0 ? 'failure' : 'ok',
			text: Ext.DomQuery.selectValue('Status/Text', xml.reader.xmlData),
			icon: Ext.DomQuery.selectValue('Status/Icon', xml.reader.xmlData)
		});
		//var warningLevel = 0;
		//store.each( function( record ) {
		//	warningLevel = Math.max( record.get('warningLevel'), warningLevel );
		//});	
		if (wl === 0) {
			this.view.hide();
		}
		Ext.get('sysmessage').setHeight(this.statusPanel.el.getHeight() + this.view.el.getHeight() + this.body.getPadding('tb') + 20, { callback: function() { this.setVisible(true); }, scope: this, duration: .3 });
		this.setHeight(this.statusPanel.el.getHeight() + this.view.el.getHeight() + this.body.getPadding('tb'));

		this.fireEvent('load', this, this.warningLevel = wl);
	}

});