Ext.define("Ext.ux.mailChimp.Grid", {
	extend: "Ext.grid.Panel",
	alias: ["widget.mailchimpgrid"],
	border: false,
	viewConfig: {
		loadMask: true,
		variableRowHeight: true
	},
	initComponent: function() {
		var me = this;

		var modelName = "mailchimpmembers";

		if (!Ext.ClassManager.isCreated(modelName)) {
			Ext.define(modelName, {
				extend: "Ext.data.Model",
				fields: [
				{ name: "id", type: "string" },
				{ name: "email", type: "string" },
				{ name: "info_changed", type: "string" },
				{ name: "status", type: "string" }
				],
				proxy: {
					type: "ajax",
					url: "/ip2-services/" + "wshMailChimp.aspx",
					reader: {
						type: "json",
						rootProperty: "response.data",
						totalProperty: "total"
					}
				}
			});
		}

		me.columns = [
			{ header: ip2.i18n({ da: "Email", en: "Email" }), dataIndex: "email", flex: 3 },
			{ header: ip2.i18n({ da: "Status", en: "Status" }), dataIndex: "status", flex: 1 },
			{ header: ip2.i18n({ da: "Ændret d.", en: "Changed" }), dataIndex: "info_changed", flex: 1 }
		];

		me.store = Ext.create("Ext.data.BufferedStore", {
			model: modelName,
			pageSize: 100,
			remoteSort: true
		});

		me.dockedItems = [{
			xtype: "toolbar",
			itemId: "actionbar",
			dock: "top",
			items: [{
				xtype: "button",
				itemId: "subscribe",
				text: ip2.i18n({
					da: "Tilmeld ny",
					en: "Subscribe new"
				}),
				iconCls: "pf-add",
				handler: function() {
					me.subscribe();
				}
			}],
			listeners: {
				afterrender: function() {
					me.setButtonsDisable();
				}
			}
		}];

		var rowMenu = Ext.create("Ext.menu.Menu", {
			items: [{
				xtype: "menuitem",
				itemId: "unsubscribe",
				text: ip2.i18n({
					da: "Afmeld",
					en: "Unsubscribe"
				}),
				iconCls: "pf-delete",
				handler: function () {
					me.unsubscribe();
				}
			}]
		});

		me.listeners = {
			itemcontextmenu: function(view, records, item, index, e) {
				e.stopEvent();

				me.getSelectionModel().select(records);

				var coords = e.getXY();
				rowMenu.showAt([coords[0], coords[1]]);
			},
			search: function(o_params) {

				var i_store = me.store;
				var i_proxy = i_store.getProxy();
				var o_extraParams = i_proxy.getExtraParams();

				o_extraParams = Ext.apply(o_extraParams, o_params);
				i_store.loadPage(1);
			}
		};

		me.callParent();
	},
	subscribe: function() {
		var me = this;

		Ext.create("Ext.ux.mailChimp.Panel", {
			listid: me.getListId(),
			success: function(data) {
				me.store.loadPage(1);
			}
		}).show();
	},
	unsubscribe: function() {
		var me = this;

		var records = me.getSelectionModel().getSelection();
		if (records.length == 0) {
			Ext.MessageBox.show({
				msg: ip2.i18n({ da: "Du skal vælge en række først...", en: "Select one row..." }),
				icon: Ext.MessageBox.WARNING
			});

			setTimeout(function() {
				Ext.MessageBox.hide();
			}, 1000);
			return;
		}

		Ext.Msg.show({
			title: ip2.i18n({ da: "Bekræft", en: "Confirm" }),
			msg: ip2.i18n({ da: "Vil du afmelde dette medlem af listen ?", en: "Do you want to unsubscribe this member ?" }),
			buttons: Ext.Msg.OKCANCEL,
			icon: Ext.Msg.WARNING,
			fn: function(btn) {
				if (btn == "ok") {
					Ext.Ajax.request({
						url: "/ip2-services/" + "wshMailChimp.aspx",
						params: {
							action: "unsubscribe",
							email: records[0].data.email,
							listid: me.getListId()
						},
						record: records[0],
						success: function(response, request) {
							me.store.loadPage(1);
						}
					});
				}
			}
		});
	},
	getListId: function() {

		var me = this;
		var value;

		var i_panel = me.previousSibling("panel");
		if (i_panel) {
			var i_fieldcontainer = i_panel.down("fieldcontainer");
			if (i_fieldcontainer) {
				var i_listId = i_fieldcontainer.down("#listid");
				if (i_listId) {
					value = i_listId.getValue();
				}
			}
		}

		return value;
	},
	setButtonsEnable: function() {

		var me = this;
		var i_toolbar = me.down("#actionbar");
		if (i_toolbar) {
			var i_subscribe = i_toolbar.down("#subscribe");
			if (i_subscribe) {
				i_subscribe.enable();
			}
		}
	},
	setButtonsDisable: function() {
		var me = this;
		var i_toolbar = me.down("#actionbar");
		if (i_toolbar) {
			var i_subscribe = i_toolbar.down("#subscribe");
			if (i_subscribe) {
				i_subscribe.disable();
			}
		}
	}
});
