From 1b513debf50b629bfd10dbbb119a1b455e4b57a5 Mon Sep 17 00:00:00 2001
From: Marcin <zelkowski.m@gmail.com>
Date: Fri, 27 Jul 2018 05:29:32 +0200
Subject: [PATCH] add pl (#6)

* add pl

* pl fix
---
 html/js/app_pl.js | 175 ++++++++++++++++++++++++++++++++++++++++++++++
 html/ui_pl.html   |  12 ++++
 2 files changed, 187 insertions(+)
 create mode 100644 html/js/app_pl.js
 create mode 100644 html/ui_pl.html

diff --git a/html/js/app_pl.js b/html/js/app_pl.js
new file mode 100644
index 00000000..cbbcef9f
--- /dev/null
+++ b/html/js/app_pl.js
@@ -0,0 +1,175 @@
+(function(){
+
+	let MenuTpl =
+		'<div id="menu_{{_namespace}}_{{_name}}" class="dialog {{#isBig}}big{{/isBig}}">' +
+			'<div class="head"><span>{{title}}</span></div>' +
+				'{{#isDefault}}<input type="text" name="value" id="inputText"/>{{/isDefault}}' +
+				'{{#isBig}}<textarea name="value"/>{{/isBig}}' +
+				'<button type="button" name="submit">Zapisz</button>' +
+				'<button type="button" name="cancel">Zamknij</button>'
+			'</div>' +
+		'</div>'
+	;
+
+	window.ESX_MENU       = {};
+	ESX_MENU.ResourceName = 'esx_menu_dialog';
+	ESX_MENU.opened       = {};
+	ESX_MENU.focus        = [];
+	ESX_MENU.pos          = {};
+
+	ESX_MENU.open = function(namespace, name, data) {
+
+		if(typeof ESX_MENU.opened[namespace] == 'undefined')
+			ESX_MENU.opened[namespace] = {};
+
+		if(typeof ESX_MENU.opened[namespace][name] != 'undefined')
+			ESX_MENU.close(namespace, name);
+
+		if(typeof ESX_MENU.pos[namespace] == 'undefined')
+			ESX_MENU.pos[namespace] = {};
+
+		if(typeof data.type == 'undefined')
+			data.type = 'default';
+
+		if(typeof data.align == 'undefined')
+			data.align = 'top-left';
+
+		data._index     = ESX_MENU.focus.length;
+		data._namespace = namespace;
+		data._name      = name;
+
+		ESX_MENU.opened[namespace][name] = data;
+		ESX_MENU.pos   [namespace][name] = 0;
+
+		ESX_MENU.focus.push({
+			namespace: namespace,
+			name     : name
+		});
+
+		document.onkeyup = function (key) {
+			if (key.which == 27) { // Escape key
+				$.post('http://' + ESX_MENU.ResourceName + '/menu_cancel', JSON.stringify(data));
+			} else if (key.which == 13) { // Enter key
+				$.post('http://' + ESX_MENU.ResourceName + '/menu_submit', JSON.stringify(data));
+			}
+		};
+
+		ESX_MENU.render();
+	}
+
+	ESX_MENU.close = function(namespace, name) {
+		
+		delete ESX_MENU.opened[namespace][name];
+
+		for(let i=0; i<ESX_MENU.focus.length; i++){
+			if(ESX_MENU.focus[i].namespace == namespace && ESX_MENU.focus[i].name == name){
+				ESX_MENU.focus.splice(i, 1);
+				break;
+			}
+		}
+
+		ESX_MENU.render();
+	}
+
+	ESX_MENU.render = function() {
+
+		let menuContainer = $('#menus')[0];
+		
+		$(menuContainer).find('button[name="submit"]').unbind('click');
+		$(menuContainer).find('button[name="cancel"]').unbind('click');
+		$(menuContainer).find('[name="value"]')       .unbind('input propertychange');
+
+		menuContainer.innerHTML = '';
+
+		$(menuContainer).hide();
+
+		for(let namespace in ESX_MENU.opened){
+			for(let name in ESX_MENU.opened[namespace]){
+
+				let menuData = ESX_MENU.opened[namespace][name];
+				let view     = JSON.parse(JSON.stringify(menuData));
+
+				switch(menuData.type){
+
+					case 'default' : {
+						view.isDefault = true;
+						break;
+					}
+
+					case 'big' : {
+						view.isBig = true;
+						break;
+					}
+
+					default : break;
+				}
+
+				let menu = $(Mustache.render(MenuTpl, view))[0];
+
+				$(menu).css('z-index', 1000 + view._index);
+
+				$(menu).find('button[name="submit"]').click(function() {
+					ESX_MENU.submit(this.namespace, this.name, this.data);
+				}.bind({namespace: namespace, name: name, data: menuData}));
+
+				$(menu).find('button[name="cancel"]').click(function() {
+					ESX_MENU.cancel(this.namespace, this.name, this.data);
+				}.bind({namespace: namespace, name: name, data: menuData}));
+
+				$(menu).find('[name="value"]').bind('input propertychange', function(){
+					this.data.value = $(menu).find('[name="value"]').val();
+					ESX_MENU.change(this.namespace, this.name, this.data);
+				}.bind({namespace: namespace, name: name, data: menuData}));
+
+				if(typeof menuData.value != 'undefined')
+					$(menu).find('[name="value"]').val(menuData.value);
+
+				menuContainer.appendChild(menu);
+			}
+		}
+
+		$(menuContainer).show();
+		$("#inputText").focus();
+	}
+
+	ESX_MENU.submit = function(namespace, name, data) {
+		$.post('http://' + ESX_MENU.ResourceName + '/menu_submit', JSON.stringify(data));
+	}
+
+	ESX_MENU.cancel = function(namespace, name, data) {
+		$.post('http://' + ESX_MENU.ResourceName + '/menu_cancel', JSON.stringify(data));
+	}
+
+	ESX_MENU.change = function(namespace, name, data) {
+		$.post('http://' + ESX_MENU.ResourceName + '/menu_change', JSON.stringify(data));
+	}
+
+	ESX_MENU.getFocused = function() {
+		return ESX_MENU.focus[ESX_MENU.focus.length - 1];
+	}
+
+	window.onData = (data) => {
+
+		switch(data.action){
+
+			case 'openMenu' : {
+				ESX_MENU.open(data.namespace, data.name, data.data);
+				break;
+			}
+
+			case 'closeMenu' : {
+				ESX_MENU.close(data.namespace, data.name);
+				break;
+			}
+
+		}
+
+	}
+
+	window.onload = function(e){
+		window.addEventListener('message', (event) => {
+			onData(event.data)
+		});
+	}
+
+})()
\ No newline at end of file
diff --git a/html/ui_pl.html b/html/ui_pl.html
new file mode 100644
index 00000000..d851c28c
--- /dev/null
+++ b/html/ui_pl.html
@@ -0,0 +1,12 @@
+<html>
+	<head>
+		<link rel="stylesheet" href="css/app.css" />
+	</head>
+	<body>
+		<div id="menus"></div>
+
+		<script src="nui://game/ui/jquery.js" type="text/javascript"></script>
+		<script src="js/mustache.min.js"></script>
+		<script src="js/app_pl.js"></script>
+	</body>
+</html>
\ No newline at end of file