var DBG = DBG || 0;
var DBG1 = true;

if (!NAMESPACE) throw "Missing NAMESPACE";
if (!USER_LOGIN) throw "Missing USER_LOGIN";
if (!HTML_NODE_ID) throw "Missing HTML_NODE_ID";
if (!VIEW_ALL_LINK) throw "Missing VIEW_ALL_LINK";
if (!global.p5VendorJs) throw "Missing vendor.js";
if (!global.p5WFS_GetFeature) throw "Missing p5WFS_GetFeature";
var REQUEST_LIMIT = (REQUEST_LIMIT) ? REQUEST_LIMIT : 10;

var createReactClass = global.p5VendorJs.createReactClass;
var h = global.p5VendorJs.React.createElement;
var ReactDOM = global.p5VendorJs.ReactDOM;
var p5WFS_GetFeature = global.p5WFS_GetFeature;

var P5UI__WidgetPrzypomnij = createReactClass({
	getInitialState: function () {
		return {
			response: [],
			isLoading: false,
			errorMsg: '',
		}
	},
	componentDidMount: function() {
		DBG && console.log('DBG:P5UI__WidgetPrzypomnij:componentDidMount');
		this.setState({ isLoading: true })
		p5WFS_GetFeature(this.props.namespace, {
			sortBy: 'L_APPOITMENT_DATE+A',
			maxFeatures: REQUEST_LIMIT,
			'ogc:Filter': '<wfs:Query>' + '\n' +
				'<ogc:Filter>' + '\n' +
					'<ogc:And>' + '\n' +
						'<ogc:PropertyIsEqualTo>' + '\n' +
							'<ogc:PropertyName>' + "L_APPOITMENT_USER" + '</ogc:PropertyName>' + "\n" +
							'<ogc:Literal>' + this.props.login + '</ogc:Literal>' + "\n" +
						'</ogc:PropertyIsEqualTo>' + '\n' +
					'</ogc:And>' + '\n' +
				'</ogc:Filter>' + '\n' +
			'</wfs:Query>',
		}).then(this.handleWfsResponse.bind(this))
		.catch(this.handleWfsError.bind(this))
	},
	handleWfsResponse: function (response) {
		DBG && console.log('DBG:P5UI__WidgetPrzypomnij:handleWfsResponse', { response });
		this.setState({
			isLoading: false,
			response: response,
		})
	},
	handleWfsError: function (error) {
		DBG && console.log('DBG:P5UI__WidgetPrzypomnij:handleWfsError', { error });
		this.setState({
			isLoading: false,
			errorMsg: '' + error,
		})
	},

	renderLoading: function () {
		return h('p', {}, "loading...");
	},
	renderEmpty: function () {
		if (this.state.errorMsg) return this.renderErrorMsg();
		return h('p', {}, "Brak danych");
	},
	renderErrorMsg: function () {
		return h('div', { className: "alert alert-danger" }, this.state.errorMsg);
	},
	renderRow: function (row) {
		// A_STATUS: "WAITING"
		// L_APPOITMENT_DATE: "2013-02-01 00:00:00"
		// L_APPOITMENT_INFO: "..."
		// L_APPOITMENT_USER: "..."
		// PROJECT__ID: "0"
		// USER__IS_ACTIVE: "1"
		// featureDesc: "Przycisk - Zapisz"
		// featureType: "NARZEDZIE"
		// feature_id: "CRM_LISTA_ZASOBOW.3954"
		// namespace: "default_db/CRM_LISTA_ZASOBOW"
		// primaryKey: "3954"

		return h('tr', {}, [
			h('td', { style: { whiteSpace: "pre" } }, row['L_APPOITMENT_DATE'].substr(0, 10)),
			h('td', {}, row['L_APPOITMENT_INFO']),
			h('td', {}, [
				h('a', {
					href: 'index.php?_route=ViewTableAjax&namespace=' + row['namespace'] + '#EDIT/' + row['primaryKey'],
					className: "btn btn-xs btn-link"
				}, "Edytuj " + row['primaryKey'])
			]),
		]);
	},
	render: function () {
		DBG && console.log('DBG:P5UI__WidgetPrzypomnij:render', { props: this.props, state: this.state });
		if (this.state.isLoading) return this.renderLoading();
		if (!this.state.response.length) return this.renderEmpty();
		return h('table', { className: "table table-condensed table-bordered" }, [
			h('thead', {}, [
				h('tr', {}, [
					h('th', {}, "Termin"),
					h('th', {}, "Opis"),
					h('th', {}, "Rekord"),
				]),
			]),
			h('tfoot', {}, [
				h('tr', {}, [
					h('td', { colSpan: 3, style: { padding: "12px", textAlign: "center" } }, [
						h('a', {
							href: VIEW_ALL_LINK,
						}, "przeglądaj wszystkie")
					]),
				]),
			]),
			h('tbody', {}, this.state.response.map(this.renderRow)),
		]);
	}
});

ReactDOM.render(
	h(P5UI__WidgetPrzypomnij, {
		namespace: NAMESPACE,
		login: USER_LOGIN,
	}),
	document.getElementById(HTML_NODE_ID)
);