Ext.define('Ext.ux.folderorganizer.MultiChoice', {
	extend: 'Ext.window.Window',
	alias: ['widget.ip2MsgMultiChoice', 'widget.ip2msgMultiChoice', 'widget.ip2msgmultichoice'],
	bodyStyle: 'background-color: white;',
	width: 500,
	initComponent: function () {
		var me = this;

		me.items = [];

		windowHeight = 0;

		// Guide line
		if (me.guideLine && me.guideLine.length > 0) {
			windowHeight += 58;
			me.items.push(
				Ext.create('Ext.form.field.Display', {
					hideLabel: true,
					value: me.guideLine,
					padding: '12 20 12 20'
				})        	
			)
		}

		// Question grid
		if (me.questions && me.questions.length > 0) {
			windowHeight += 40 + (me.questions.length * 26);

			var store = Ext.create('Ext.data.Store', {
				fields: ['answer', 'question', 'icon'],
				proxy: {
					type: 'memory',
					reader: {
						type: 'json'
					}
				}
			});

			store.loadData(me.questions);

			var iconRenderer = function(value, meta, record) {
				return '<img src="' + value + '"/>'
			}

			me.items.push(
		        Ext.create('Ext.grid.Panel', {
			hideHeaders: true,
			store: store,
			border: false,
			padding: '0 20 12 20',
			columns: [
			{ dataIndex: 'icon', renderer: iconRenderer, width: 30 },
			{ dataIndex: 'question', flex: 1 }
			],
			viewConfig: {
				getRowClass: function(record, rowIndex, rowParams, store) {
					return 'ip2-grid-row-XL';
				}
			},
			listeners: {
				itemclick: function(view, record) {
					if (Ext.isFunction(me.handler)) {
						me.handler.call(me, record.data.answer);	
					}
					me.hide();
				}
			}                   
		        })
	       	)
		}

		me.height = windowHeight;

		me.callParent();
	}    
});
