se/SE/se-lib/UI/AjaxContent.php.script.js

var DBG = 0;
var DBG1 = 1;
if (!ID_HTML_NODE) throw "Missing 'ID_HTML_NODE'!";
// if (!URL_FETCH_CONTENT) throw "Missing 'URL_FETCH_CONTENT'!";
var URL_FETCH_CONTENT = URL_FETCH_CONTENT || '';
if (!global.fetch) throw "Missing 'fetch'!";
if (!global.p5VendorJs.ReactDOM) throw "Missing ReactDOM"
if (!global.p5UI__buildDom) throw "Missing 'p5UI__buildDom'!"; // static/vendor.js, static/p5UI/buildDom.js
if (!global.P5UI__AjaxContent) throw "Missing 'P5UI__AjaxContent'!"; // static/vendor.js, static/p5UI/AjaxContent.js
var NOTIFY_USER_MODE = NOTIFY_USER_MODE || 'inline'; // inline | notify
var LOADING = LOADING || 'loading ...';
var ReactDOM = global.p5VendorJs.ReactDOM;
var h = global.p5VendorJs.React.createElement;
var P5UI__AjaxContent = global.P5UI__AjaxContent;

var rootNode = document.getElementById(ID_HTML_NODE);
if (!rootNode) throw "Node not exists";

ReactDOM.render(
	h(P5UI__AjaxContent, {
		url: URL_FETCH_CONTENT,
		loading: LOADING,
	}),
	rootNode
)

return;

global.fetch(URL_FETCH_CONTENT, {
	credentials: "same-origin",
}).then(function (response) {
	DBG1 && console.log("DBG:response", { status: response.status, response: response });
	response.text()
		.then(response.ok ? _handleFetchResponseSuccess : _handleFetchResponseFail)
		.catch(function (err) {
			DBG1 && console.log("Response Error #1:")
			DBG1 && console.error(err)
			// throw err;
			doNotify('error', "" + err);
		})
}).then(function (data) {
	DBG1 && console.warn("DBG:response data", { data });
}).catch(function (err) {
	DBG1 && console.log("Response Error #2:")
	DBG1 && console.error(err)
})


function _handleFetchResponseFail(responseText) {
	DBG1 && console.warn("DBG:response fail responseText", { responseText });
	if (!responseText) throw "Error";
	_handleFetchResponseText(false, responseText)
}
function _handleFetchResponseSuccess(responseText) {
	DBG1 && console.warn("DBG:response success responseText", { responseText });
	_handleFetchResponseText(true, responseText)
}
function _handleFetchResponseText(isOk, responseText) {
	if ('{' !== responseText.substr(0, 1)) throw "Response Parse Error: Expected json.";
	try {
		var jsonResponse = JSON.parse(responseText);
		if (!jsonResponse.msg) throw "Response Parse Error: Expected json with msg.";
		if (!isOk) throw jsonResponse.msg; // TODO: throw or just show alert for user

		_handleFetchResponseJson(jsonResponse)
	} catch (err) {
		throw "Response Parse Error: " + err;
	}
}
function _handleFetchResponseJson(jsonResponse) {
	switch (jsonResponse.type) {
		case 'error': return doNotify('error', (jsonResponse.msg || "Wystąpił błąd"));
		case 'success': return doShowContent(jsonResponse.body);
		default: return doNotify('warning', jsonResponse.msg);
	}
}

function doNotify(type, msg) {
	// TODO: if (NOTIFY_USER_MODE) // 'inline' | 'notify'
	type = ('error' == type) ? 'danger' : type;
	rootNode.innerHTML = '<div class="alert alert-' + type + '" style="margin-bottom:0">' + msg + '</div>';
}
function doShowContent(body) {
	if (body.reactNode) return p5UI__buildDom(body.reactNode, rootNode);
	if (body.html) return doShowHtmlContent(body.html, rootNode);
	if (typeof body === 'string' || body instanceof String) return doShowHtmlContent(body, rootNode);
	else {
		// TODO: if DBG
		rootNode.innerHTML = '<pre>' + JSON.stringify(body, null, 4) + '</pre>';
	}
}
function doShowHtmlContent(htmlContent, node) {
	node.innerHTML = htmlContent;
}
// }).then(function (response) {
// 	return response.text()
// }).then(function (responseText) {
// 	try {
// 		return JSON.parse(responseText)
// 	} catch (e) {
// 		throw responseText
// 	}
// }).then(function (result) {
// 	if ('success' == result.type) {
// 		p5UI__notifyAjaxCallback(result)
// 		resolve(result.data)
// 	} else {
// 		p5UI__notifyAjaxCallback(result)
// 		reject(result.msg || "Wystąpił błąd!")
// 	}
// }).catch(function (e) {
// 	reject("ajax response error: " + e)
// });



// .fetch(P5MENU_URL
// 	, (!postData)
// 		?	{ method: 'GET',
// 				headers: { 'Content-Type': 'application/json' },
// 				credentials: 'same-origin',
// 			}
// 		:	{ method: 'POST',
// 				headers: { 'Content-Type': 'application/json' },
// 				credentials: 'same-origin',
// 				body: JSON.stringify(postData)
// 			}
// ).then(function (response) {
// 	return response.json()
// }).then(function (response) {
// 	if ('success' === response.type) {
// 		_update(response.body)
// 	} else {
// 		// err...
// 	}
// })