Ext.onReady(function(){
	
	Ext.state.Manager.setProvider(new Ext.state.CookieProvider());
	
	var config = {
		news: {
			record: [
				{name: 'id', sortType: 'integer'},
				{name: 'title', sortType: 'string'},
				{name: 'source_title', sortType: 'string'},
				{name: 'source_url', sortType: 'string'},
				{name: 'created', sortType: 'date', type: 'date', dateFormat: 'Y-m-d H:i:s'},
				{name: 'updated', sortType: 'date', type: 'date', dateFormat: 'Y-m-d H:i:s'},
				{name: 'is_active', sortType: 'integer'}
			],
			model: [
				//csm,
				
				{header: "id", width: 70, dataIndex: 'id', sortable: true},
				{header: "А", align : 'left', dataIndex: 'is_active', width: 20, renderer: statusNRenderer},
				{header: "Заголовок", align : 'left', dataIndex: 'title', width: 500, renderer: titleRenderer},
				{header: "Источник", align : 'left', dataIndex: 'source_title', width: 100, renderer: sourceRenderer},
				{header: "Создано", align : 'left', dataIndex: 'created', width: 100, renderer: LocalizedTimeForGrid},
				{header: "Обновлено", align : 'left', dataIndex: 'updated', width: 100, renderer: LocalizedTimeForGrid}
			],
			bufferedReader: {
				root			: 'list.items',
				versionProperty : 'list.version',
				totalProperty   : 'list.total_count',
				id			  : 'id'
			},
			bufferedStore: {
				bufferSize : 100,
				sortInfo : {field: 'id', direction: 'DESC'},
				url		 : baseUri() + '/news/list.json'
			},
			grid: {
				listeners: {
					cellclick: CellClick
				},
				bbar: [
						'<input type="button" value="добавить новость" onclick="ShowNewsItemDialog (false)"/>',
						'<input type="button" value="обновить список новостей" onclick="Ext.getCmp(\'news-grid\').getStore().reload()"/>'
				],
				id: 'news-grid'
			},
			title: "Новости"
		},
		articles: {
			record: [
				{name: 'id', sortType: 'integer'},
				{name: 'title', sortType: 'string'},
				{name: 'source_title', sortType: 'string'},
				{name: 'source_url', sortType: 'string'},
				{name: 'created', sortType: 'date', type: 'date', dateFormat: 'Y-m-d H:i:s'},
				{name: 'updated', sortType: 'date', type: 'date', dateFormat: 'Y-m-d H:i:s'},
				{name: 'is_active', sortType: 'integer'}
			],
			model: [
				//csm,
				
				{header: "id", width: 70, dataIndex: 'id', sortable: true},
				{header: "А", align : 'left', dataIndex: 'is_active', width: 20, renderer: statusARenderer},
				{header: "Заголовок", align : 'left', dataIndex: 'title', width: 500, renderer: titleRenderer},
				{header: "Источник", align : 'left', dataIndex: 'source_title', width: 100, renderer: sourceRenderer},
				{header: "Создано", align : 'left', dataIndex: 'created', width: 100, renderer: LocalizedTimeForGrid},
				{header: "Обновлено", align : 'left', dataIndex: 'updated', width: 100, renderer: LocalizedTimeForGrid}
				
				
			],
			bufferedReader: {
				root			: 'list.items',
				versionProperty : 'list.version',
				totalProperty   : 'list.total_count',
				id			  : 'id'
			},
			bufferedStore: {
				bufferSize : 100,
				sortInfo : {field: 'id', direction: 'DESC'},
				url		 : baseUri() + '/articles/list.json'
			},
			grid: {
				listeners: {
					//render: false,
					//activate: false,
					cellclick: CellClick
				},
				bbar: [
						'<input type="button" value="добавить статью" onclick="ShowArticleItemDialog(false)"/>',
						'<input type="button" value="обновить список статей" onclick="Ext.getCmp(\'articles-grid\').getStore().reload()"/>'
				],
				id: 'articles-grid'
			},
			title: "Статьи"
		},
		banners: banners,
		'static': statics,
		images: illustrationLayout,
		categories: categories
	};
	
	var layoutConfig = {title: 'deepapple'};
	
	CreateLayout (config, layoutConfig, [
	//'auth',
		'news',
		'categories',
		'articles',
		'banners',
		'static',
		'images'
		
	]); //web_app_domain_filters);
	
	
	
});


function CellClick (p, rowIdx, colIdx, e) {
	var record = p.getStore().getAt(rowIdx);  // Get the Record
	var renderer = p.getColumnModel().getRenderer(colIdx); // Get field name
	if (renderer == sourceRenderer
		|| renderer == statusARenderer
		|| renderer == statusNRenderer
	) { //titleRenderer) {
		// here we call auction watch event
		// alert (1);
		return false;
	}
	
	if (p.id == 'news-grid') {
		ShowNewsItemDialog (record.data.id);
		//ShowNewsItem (record.data.id);
	} else if (p.id == 'articles-grid') {
		ShowArticleItemDialog (record.data.id);
	}
}


function ShowNewsItemDialog (id) {
	
	if (window.news_editor) {
		
		var formPanel = window.news_editor.formObject;
		
		var form = formPanel.getForm();
		
		Ext.getDom ('teaser-image').src = '';
		form.reset();
		formPanel.formItemId = id;
		
		if (id)
			window.news_editor.setTitle ('item #' + id)
		else 
			window.news_editor.setTitle ('');
		
		window.news_editor.show ();
		
		form.load ({
			url: baseUri() + '/news/info.json/' + id,
			waitMsg: 'Loading'
		});
		
		return;
	}
	
	//Ext.QuickTips.init();

	// turn on validation errors beside the field globally
	// Ext.form.Field.prototype.msgTarget = 'side';
	
	// window.news_loader
	
	var category_store = new Ext.data.JsonStore({
		autoDestroy: true,
		autoLoad: true,
		url: baseUri() + '/entity/category/list.json',
		root: 'items',
		idProperty: 'id',
		fields: [{name: 'id', type: 'int'}, 'title', 'sid']
	});
	
	var category_combo = new Ext.form.ComboBox({
		fieldLabel: 'category',
		hiddenName: 'category_id',
		name: 'category_id',
		store: category_store,
		valueField: 'id',
		displayField: 'title',
		editable: false,
		//lazyInit: false,
		mode: 'local',
		//mode: 'remote',
		//forceSelection: true,
		triggerAction: 'all',
		//selectOnFocus:true,
		emptyText: '…'
		//width: 190
	});
	
	category_store.on ('load', function (store) {
	});
	
	category_combo.on ('select', function (combo) {
	});
	
	
	
	//category_store.load();
	
	var fs = new Ext.FormPanel({
		frame: true,
		title:'editing',
		labelAlign: 'right',
		width:340,
		waitMsgTarget: true,
		
		id: 'news-form-panel',
		
		formItemId: id,

		// configure how to read the JSON Data
		reader : new Ext.data.JsonReader({
			root : 'record',
			success: 'request/data_available'
		}, [
			"source_title",
			"pinned_until",
			"date",
			"time",
			"topic_id",
			"status",
			"section",
			"category_id",
			"updated",
			"id",
			"thumbnail",
			"teaser",
			"week",
			"source_url",
			"display_mode",
			"descr",
			"created",
			"language_id",
			"is_active",
			"tgroup",
			"title"
			/*{name: 'first', mapping:'name/first'}, // custom mapping
			{name: 'last', mapping:'name/last'},*/
			/*{name: 'dob', type:'date', dateFormat:'m/d/Y'} // custom data types*/
		]),

		// reusable eror reader class defined at the end of this file
		// errorReader: new Ext.form.XmlErrorReader(),
		layout:'fit',
		labelWidth: 150,
		autoScroll: true,
		defaults:{
			columnWidth:0.5,
			layout:'form',
			border:false,
			bodyStyle:'padding:4px'
		},
		items: [
			new Ext.form.FieldSet({
				id: 'fieldset-hidden',
				defaultType: 'hidden'
			}),

			new Ext.form.FieldSet({
				width: '60%',
				id: 'fieldset-title',
				autoHeight: true,
				defaultType: 'textfield',
				labelWidth: 75,
				items: [{
					fieldLabel: 'Title',
					name:	   'title'
				}]
			}),
			new Ext.form.FieldSet({
				id: 'fieldset-category',
				autoHeight: true,
				defaultType: 'textfield',
				width: '35%',
				labelWidth: 75,
				items: category_combo
			}),
			new Ext.Panel ({
				id: 'fieldset-teaser',
				autoHeight: true,
				width: '50%',
				height: 250,
				items: {
					html: '<img id="teaser-image"/>'
				}
			}),
			new Ext.form.FieldSet({
				// title: 'Meta Information',
				autoHeight: true,
				defaultType: 'textfield',
				region: 'west',
				width: '50%',
				items: [{
					fieldLabel: 'teaser',
					name: 'teaser',
					listeners: {
						change: function (teaser) {
							Ext.getDom ('teaser-image').src = '';
							Ext.getDom ('teaser-image').src = teaser.getValue();
						}
					}
				}, {
						fieldLabel: 'is_active',
						name: 'is_active',
						xtype: 'checkbox'
					}, new Ext.form.DateField({
						fieldLabel: 'pinned_until',
						name: 'pinned_until',
						format: "Y-m-d"
					}), {
						fieldLabel: 'week',
						name: 'week',
						xtype: 'checkbox'
					}, new Ext.form.ComboBox ({
						fieldLabel: 'display_mode',
						name: 'display_mode',
						hiddenName: 'display_mode',
						store: ['normal', 'hot', 'bold', 'mega'],
						//valueField: 'id',
						//displayField: 'title',
						mode: 'local',
						triggerAction: 'all',
						editable: false//,
						//lazyInit: false,
						//mode: 'remote',
						//emptyText: '…'
					}), {
						fieldLabel: 'source_title',
						name: 'source_title',
					}, {
						fieldLabel: 'source_url',
						name: 'source_url',
					}, {
						fieldLabel: 'tags',
						name: 'tags',
					}
				]
			}),
			new Ext.form.FieldSet({
				// title: 'Text',
				id: 'fieldset-contents',
				autoHeight: true,
				defaultType: 'textarea',
				region: 'south',
				items: [{
						fieldLabel: 'descr',
						name: 'descr',
						width: '95%',
						height: '200'
					}
				]
			})
		]
	});

	// simple button add
	/*fs.addButton('Load', function(){
		fs.getForm().load({url:baseUri() + '/news/info.json/' + fs.formItemId, waitMsg:'Loading'});
	});*/
	
	var modal_dialog = new Ext.Window({
		layout:   'fit',
		plain:	false,
		modal:	true,
		closable: true,
		//title:	title,
		items:	new Ext.TabPanel ({
			activeTab: 0,
			items: [fs]
	
		}),
		formObject: fs,
		bbar:	 new Ext.Toolbar ({}),
		closeAction: 'hide',
		maximizable: true,
		width: 850,
		height: 600
	});
		
	window.news_editor = modal_dialog;

	var submit_handler = function (button, e, close_flag) {
		
		var itemId = window.news_editor.formObject.formItemId;
		
		fs.getForm().submit({
			url: baseUri() + '/news/info.json/' + itemId,
			waitMsg: 'Saving Data...',
			success: function(form, action) {
				// Ext.Msg.alert ('Success', action.result.msg);
				
				Ext.getCmp ('news-grid').getStore().reload();
				
				if (close_flag == 1) {
					modal_dialog.hide();
					return;
				}
				
				window.news_editor.formObject.formItemId = action.result.newsId;
				
				var itemIdNew = action.result.newsId;
				
				modal_dialog.setTitle ('item #' + itemIdNew);
				
				form.load ({url:baseUri() + '/news/info.json/' + itemIdNew, waitMsg:'Loading'});
			},
			failure: function(form, action) {
				alert (action.failureType + ':' + action.result.msg);
				switch (action.failureType) {
					case Ext.form.Action.CLIENT_INVALID:
						Ext.Msg.alert('Failure', 'Form fields may not be submitted with invalid values');
						break;
					case Ext.form.Action.CONNECT_FAILURE:
						Ext.Msg.alert('Failure', 'Ajax communication failed');
						break;
					case Ext.form.Action.SERVER_INVALID:
					   Ext.Msg.alert('Failure', action.result.msg);
			   }
			}
		});
		
	};
	
	var submit_close_handler = function (button, e) {
		return submit_handler (button, e, 1);
	}
	
	// explicit add
	var submit = fs.addButton({
		text: 'сохранить',
		handler: submit_handler
	});

	var submit_close = fs.addButton({
		text: 'сохранить и закрыть',
		handler: submit_close_handler
	});

	fs.on({
		afterrender: function (form, action) {
			console.log ('after render');
			form.load ({
				url: baseUri() + '/news/info.json/' + fs.formItemId,
				waitMsg: 'Loading'
			});
		}
	});
	
	fs.getForm().on ('actioncomplete', function (form, action) {
		Ext.getDom ('teaser-image').src = '';
		Ext.getDom ('teaser-image').src = form.getValues().teaser;
	});
	
	modal_dialog.show();
	
	if (fs.formItemId)
		modal_dialog.setTitle ('item #' + fs.formItemId);
	
}

function ShowArticleItemDialog (id) {
	
	if (window.article_editor) {
		
		var formPanel = window.article_editor.formObject;
		
		var form = formPanel.getForm();
		
		Ext.getDom ('article-teaser-image').src = '';
		form.reset();
		formPanel.formItemId = id;
		
		if (id)
			window.article_editor.setTitle ('item #' + id)
		else 
			window.article_editor.setTitle ('');
		
		window.article_editor.show ();
		
		form.load ({
			url: baseUri() + '/articles/info.json/' + id,
			waitMsg: 'Loading'
		});
		
		return;
	}
	
	//Ext.QuickTips.init();

	// turn on validation errors beside the field globally
	// Ext.form.Field.prototype.msgTarget = 'side';
	
	// window.news_loader
	
	var category_store = new Ext.data.JsonStore({
		autoDestroy: true,
		//autoLoad: true,
		url: baseUri() + '/entity/category/list.json',
		root: 'items',
		idProperty: 'id',
		fields: ['id', 'title']
	});
	
	var category_combo = new Ext.form.ComboBox({
		fieldLabel: 'category',
		hiddenName: 'category_id',
		name: 'category_id',
		store: category_store,
		valueField: 'id',
		displayField: 'title',
		editable: false,
		//lazyInit: false,
		//mode: 'remote',
		emptyText: '…'
		//width: 190
	});
	
	/*category_store.on ('load', function (store) {
		alert (category_combo.selectByValue (category_combo.itemToSelect));
	});*/
	
	var fs = new Ext.FormPanel({
		frame: true,
		title:'editing',
		labelAlign: 'right',
		width:340,
		waitMsgTarget: true,
		
		id: 'article-form-panel',
		
		formItemId: id,

		// configure how to read the JSON Data
		reader : new Ext.data.JsonReader({
			root : 'record',
			success: 'request/data_available'
		}, [
			"source_title",
			"pinned_until",
			"date",
			"time",
			"topic_id",
			"status",
			"section",
			"category_id",
			"updated",
			"id",
			"thumbnail",
			"teaser",
			"week",
			"source_url",
			"display_mode",
			"descr",
			"content",
			"created",
			"language_id",
			"is_active",
			"tgroup",
			"title"
			/*{name: 'first', mapping:'name/first'}, // custom mapping
			{name: 'last', mapping:'name/last'},*/
			/*{name: 'dob', type:'date', dateFormat:'m/d/Y'} // custom data types*/
		]),

		// reusable eror reader class defined at the end of this file
		// errorReader: new Ext.form.XmlErrorReader(),
		layout:'fit',
		labelWidth: 150,
		autoScroll: true,
		defaults:{
			columnWidth:0.5,
			layout:'form',
			border:false,
			bodyStyle:'padding:4px'
		},
		items: [
			new Ext.form.FieldSet({
				id: 'fieldset-hidden2',
				defaultType: 'hidden'
			}),

			new Ext.form.FieldSet({
				width: '60%',
				id: 'fieldset-title2',
				autoHeight: true,
				defaultType: 'textfield',
				labelWidth: 75,
				items: [{
					fieldLabel: 'Title',
					name:	   'title'
				}]
			}),
			new Ext.form.FieldSet({
				id: 'fieldset-category2',
				autoHeight: true,
				defaultType: 'textfield',
				width: '35%',
				labelWidth: 75,
				items: category_combo
			}),
			new Ext.Panel ({
				id: 'fieldset-teaser2',
				autoHeight: true,
				width: '50%',
				height: 250,
				items: {
					html: '<img id="article-teaser-image"/>'
				}
			}),
			new Ext.form.FieldSet({
				// title: 'Meta Information',
				autoHeight: true,
				defaultType: 'textfield',
				region: 'west',
				width: '50%',
				items: [{
					fieldLabel: 'teaser',
					name: 'teaser',
					listeners: {
						change: function (teaser) {
							Ext.getDom ('article-teaser-image').src = teaser.getValue();
						}
					}
				}, {
						fieldLabel: 'is_active',
						name: 'is_active',
						xtype: 'checkbox'
					}, {
						fieldLabel: 'source_title',
						name: 'source_title',
					}, {
						fieldLabel: 'source_url',
						name: 'source_url',
					}, {
						fieldLabel: 'tags',
						name: 'tags',
					}
				]
			}),
			new Ext.form.FieldSet({
				// title: 'Text',
				id: 'fieldset-contents2',
				autoHeight: true,
				defaultType: 'textarea',
				region: 'south',
				items: [{
					fieldLabel: 'content',
					name: 'content',
					width: '95%',
					height: '200'
				}]
			})
		]
	});

	// simple button add
	/*fs.addButton('Load', function(){
		fs.getForm().load({url:baseUri() + '/articles/info.json/' + fs.formItemId, waitMsg:'Loading'});
	});*/
	
	var modal_dialog = new Ext.Window({
		layout:   'fit',
		plain:	false,
		modal:	true,
		closable: true,
		//title:	title,
		items:	new Ext.TabPanel ({
			activeTab: 0,
			items: [fs]
	
		}),
		formObject: fs,
		bbar:	 new Ext.Toolbar ({}),
		closeAction: 'hide',
		maximizable: true,
		width: 850,
		height: 600
	});
		
	window.article_editor = modal_dialog;

	var submit_handler = function (button, e, close_flag) {
		
		var itemId = window.article_editor.formObject.formItemId;
		
		fs.getForm().submit({
			url: baseUri() + '/articles/info.json/' + itemId,
			waitMsg: 'Saving Data...',
			success: function(form, action) {
				// Ext.Msg.alert ('Success', action.result.msg);
				
				Ext.getCmp ('articles-grid').getStore().reload();
				
				if (close_flag == 1) {
					modal_dialog.hide();
					return;
				}
				
				window.article_editor.formObject.formItemId = action.result.articleId;
				
				var itemIdNew = action.result.articleId;
				
				modal_dialog.setTitle ('item #' + itemIdNew);
				
				form.load ({url:baseUri() + '/articles/info.json/' + itemIdNew, waitMsg:'Loading'});
			},
			failure: function(form, action) {
				alert (action.failureType + ':' + action.result.msg);
				switch (action.failureType) {
					case Ext.form.Action.CLIENT_INVALID:
						Ext.Msg.alert('Failure', 'Form fields may not be submitted with invalid values');
						break;
					case Ext.form.Action.CONNECT_FAILURE:
						Ext.Msg.alert('Failure', 'Ajax communication failed');
						break;
					case Ext.form.Action.SERVER_INVALID:
					   Ext.Msg.alert('Failure', action.result.msg);
			   }
			}
		});
		
	};
	
	var submit_close_handler = function (button, e) {
		return submit_handler (button, e, 1);
	}
	
	// explicit add
	var submit = fs.addButton({
		text: 'сохранить',
		handler: submit_handler
	});

	var submit_close = fs.addButton({
		text: 'сохранить и закрыть',
		handler: submit_close_handler
	});

	fs.on({
		afterrender: function (form, action) {
			console.log ('after render');
			form.load ({
				url: baseUri() + '/articles/info.json/' + fs.formItemId,
				waitMsg: 'Loading'
			});
		}
	});
	
	fs.getForm().on ('actioncomplete', function (form, action) {
		Ext.getDom ('article-teaser-image').src = form.getValues().teaser;
	});
	
	modal_dialog.show();
	
	if (fs.formItemId)
		modal_dialog.setTitle ('item #' + fs.formItemId);
	
}