diff --git a/html/en_ui.html b/html/en_ui.html new file mode 100644 index 00000000..8f33bebc --- /dev/null +++ b/html/en_ui.html @@ -0,0 +1,132 @@ + + + + + + + + + + +
+
+

+ + Bank +

+
+
+
+
+
+
+
+ +
+
+

+ + Amount? +

+
+
+
+ + + +
+
+
+ +
+
+

+ + Amount? +

+
+
+
+ + + +
+
+
+ +
+
+

+ + Amount? +

+
+
+
+ + +
+
+
+ +
+
+

+ + Amount? +

+
+
+
+ + +
+
+
+ +
+
+

+ + Amount? +

+
+
+
+ + +
+
+
+ +
+
+

+ + Amount? +

+
+
+
+ + +
+
+
+ + + + +
+
 Bank
+
 Bank
+
 Return
+
+ + + + + + + + \ No newline at end of file diff --git a/html/scripts/en_app.js b/html/scripts/en_app.js new file mode 100644 index 00000000..2d30c3ab --- /dev/null +++ b/html/scripts/en_app.js @@ -0,0 +1,512 @@ +(function(){ + + let DefaultTpl = + '
{{title}}
' + + ''+ + '' + ; + + let DefaultWithTypeAndCountTpl = + '
{{title}}
' + + ''+ + '' + ; + + let CustomersTpl = + '' + + '' + + 'Client' + + 'Solde' + + 'Actions' + + '' + + '' + + '' + + '{{#customers}}' + + '' + + '{{name}}' + + '${{bank_savings}}' + + '' + + '' + + '' + + '' + + '' + + '{{/customers}}' + + '' + ; + + let menus = { + + banque : { + title : 'Bank', + visible : false, + current : -1, + hasControl: false, + template : DefaultTpl, + + items: [ + {label: 'Clients', value: 'customers'}, + {label: 'Withdraw Company Money', value: 'withdraw_society_money'}, + {label: 'Launder Money', value: 'wash_money'} + ] + }, + + banque_actions : { + title : 'Bank', + visible : false, + current : 0, + hasControl: true, + template : DefaultTpl, + + items: [] + }, + } + + let renderMenus = function(){ + for(let k in menus){ + + let elem = $('#menu_' + k); + + elem.html(Mustache.render(menus[k].template, menus[k])); + + if(menus[k].visible) + elem.show(); + else + elem.hide(); + + } + } + + let showMenu = function(menu){ + + currentMenu = menu; + + for(let k in menus) + menus[k].visible = false; + + menus[menu].visible = true; + + renderMenus(); + + if(menus[currentMenu].items.length > 0){ + + $('#menu_' + currentMenu + ' .menu-item').removeClass('selected'); + $('#menu_' + currentMenu + ' .menu-item:eq(0)').addClass('selected'); + + menus[currentMenu].current = 0; + currentVal = menus[currentMenu].items[menus[currentMenu].current].value; + currentType = $('#menu_' + currentMenu + ' .menu-item:eq(0)').data('type'); + currentAction = $('#menu_' + currentMenu + ' .menu-item:eq(0)').data('action'); + currentCount = $('#menu_' + currentMenu + ' .menu-item:eq(0)').data('count'); + } + + $('#ctl_return').show(); + + isMenuOpen = true + isShowingControls = false + } + + let hideMenus = function(){ + + for(let k in menus) + menus[k].visible = false; + + renderMenus(); + isMenuOpen = false; + } + + let showControl = function(control){ + + hideControls(); + $('#ctl_' + control).show(); + isShowingControls = true; + currentControl = control; + } + + let hideControls = function(){ + + for(let k in menus) + $('#ctl_' + k).hide(); + + $('#ctl_return').hide(); + + isShowingControls = false; + } + + let showCustomers = function(customers, bankMoney){ + + let view = { + customers: customers + } + + $('#bank-money').text('$' + bankMoney) + $('#customer-list').html(Mustache.render(CustomersTpl, view)); + + $('#customer-list .transfer-btn').click(function(){ + showTransferDialog($(this).data('identifier')) + }); + + $('#customer-list .withdraw-btn').click(function(){ + showWithdrawBankSavingsDialog($(this).data('identifier')) + }); + + $('#customers').show(); + $(cursor).show(); + } + + let hideCustomers = function(){ + $('#customers').hide(); + $(cursor).hide(); + } + + let showTransferDialog = function(identifier){ + $('#transfer-dialog-amount').val(''); + $('#transfer-dialog-identifier').val(identifier); + $('#transfer-dialog').show(); + } + + let hideTransferDialog = function(){ + $('#transfer-dialog').hide(); + } + + let showWithdrawBankSavingsDialog = function(identifier){ + $('#withdraw-bank-savings-dialog-amount').val(''); + $('#withdraw-bank-savings-dialog-identifier').val(identifier); + $('#withdraw-bank-savings-dialog').show(); + } + + let hideWithdrawBankSavingsDialog = function(){ + $('#withdraw-bank-savings-dialog').hide(); + } + + let showBillingDialog = function(){ + $('#billing-dialog-amount').val(''); + $('#billing-dialog').show(); + $(cursor).show(); + } + + let hideBillingDialog = function(){ + $('#billing-dialog').hide(); + $(cursor).hide(); + } + + let showWithdrawDialog = function(){ + $('#withdraw-dialog-amount').val(''); + $('#withdraw-dialog').show(); + $(cursor).show(); + } + + let hideWithdrawDialog = function(){ + $('#withdraw-dialog').hide(); + $(cursor).hide(); + } + + let showWashMoneyDialog = function(){ + $('#washmoney-dialog-amount').val(''); + $('#washmoney-dialog').show(); + $(cursor).show(); + } + + let hideWashMoneyDialog = function(){ + $('#washmoney-dialog').hide(); + $(cursor).hide(); + } + + let showWithdrawSocietyMoneyDialog = function(){ + $('#withdraw-society-money-dialog-amount').val(''); + $('#withdraw-society-money-dialog').show(); + $(cursor).show(); + } + + let hideWithdrawSocietyMoneyDialog = function(){ + $('#withdraw-society-money-dialog').hide(); + $(cursor).hide(); + } + + $('#transfer-dialog-send').click(function(){ + + $.post('http://esx_bankerjob/transfer', JSON.stringify({ + identifier: $('#transfer-dialog-identifier').val(), + amount : parseFloat($('#transfer-dialog-amount').val()) + })) + + hideTransferDialog(); + + }); + + $('#withdraw-bank-savings-dialog-send').click(function(){ + + $.post('http://esx_bankerjob/withdraw_bank_savings', JSON.stringify({ + identifier: $('#withdraw-bank-savings-dialog-identifier').val(), + amount : parseFloat($('#withdraw-bank-savings-dialog-amount').val()) + })) + + hideWithdrawBankSavingsDialog(); + + }); + + $('#billing-dialog-send').click(function(){ + + $.post('http://esx_bankerjob/billing', JSON.stringify({ + amount: parseFloat($('#billing-dialog-amount').val()) + })) + + hideBillingDialog(); + + }); + + $('#withdraw-dialog-send').click(function(){ + + $.post('http://esx_bankerjob/withdraw', JSON.stringify({ + amount: parseFloat($('#withdraw-dialog-amount').val()) + })) + + hideWithdrawDialog(); + + }); + + $('#washmoney-dialog-send').click(function(){ + + $.post('http://esx_bankerjob/wash_money', JSON.stringify({ + amount: parseFloat($('#washmoney-dialog-amount').val()) + })) + + hideWashMoneyDialog(); + + }); + + $('#withdraw-society-money-dialog-send').click(function(){ + $.post('http://esx_bankerjob/withdraw_society_money', JSON.stringify({ + amount: parseFloat($('#withdraw-society-money-dialog-amount').val()) + })) + + hideWithdrawSocietyMoneyDialog(); + }); + + let documentWidth = document.documentElement.clientWidth; + let documentHeight = document.documentElement.clientHeight; + + let cursor = document.getElementById("cursor"); + let cursorX = documentWidth / 2; + let cursorY = documentHeight / 2; + + function UpdateCursorPos() { + cursor.style.left = cursorX; + cursor.style.top = cursorY; + } + + function Click(x, y) { + let element = $(document.elementFromPoint(x, y)); + element.focus().click(); + } + + function scrollCustomers(direction){ + + let element = $('#customers .head-content')[0]; + + if(direction == 'UP') + element.scrollTop -= 32; + + if(direction == 'DOWN') + element.scrollTop += 32; + + } + + $(document).mousemove(function(event) { + cursorX = event.pageX; + cursorY = event.pageY; + UpdateCursorPos(); + }); + + let isMenuOpen = false + let isShowingControls = false; + let currentMenu = null; + let currentControl = null; + let currentVal = null; + let currentType = null; + let currentAction = null; + let currentCount = null; + + renderMenus(); + + window.onData = function(data){ + + if(data.click === true){ + Click(cursorX - 1, cursorY - 1); + } + + if(data.showControls === true){ + currentMenu = data.controls; + showControl(data.controls); + } + + if(data.showControls === false){ + hideControls(); + } + + if(data.showMenu === true){ + hideControls(); + + if(data.items) + menus[data.menu].items = data.items + + showMenu(data.menu); + } + + if(data.showMenu === false){ + hideMenus(); + } + + if(data.showCustomers === true){ + showCustomers(data.customers, data.bankMoney); + } + + if(data.showCustomers === false){ + hideCustomers(); + } + + if(data.showBillingDialog === true){ + showBillingDialog(); + } + + if(data.showBillingDialog === false){ + hideBillingDialog(); + } + + if(data.showWithdrawDialog === true){ + showWithdrawDialog(); + } + + if(data.showWithdrawDialog === false){ + hideWithdrawDialog(); + } + + if(data.showWashMoneyDialog === true){ + showWashMoneyDialog(); + } + + if(data.showWashMoneyDialog === false){ + hideWashMoneyDialog(); + } + + if(data.showWithdrawSocietyMoneyDialog === true){ + showWithdrawSocietyMoneyDialog(); + } + + if(data.showWithdrawSocietyMoneyDialog === false){ + hideWithdrawSocietyMoneyDialog(); + } + + if(data.move && isMenuOpen){ + + if(data.move == 'UP'){ + if(menus[currentMenu].current > 0) + menus[currentMenu].current--; + } + + if(data.move == 'DOWN'){ + + let max = $('#menu_' + currentMenu + ' .menu-item').length; + + if(menus[currentMenu].current < max - 1) + menus[currentMenu].current++; + } + + $('#menu_' + currentMenu + ' .menu-item').removeClass('selected'); + $('#menu_' + currentMenu + ' .menu-item:eq(' + menus[currentMenu].current + ')').addClass('selected'); + + currentVal = menus[currentMenu].items[menus[currentMenu].current].value; + currentType = $('#menu_' + currentMenu + ' .menu-item:eq(' + menus[currentMenu].current + ')').data('type'); + currentAction = $('#menu_' + currentMenu + ' .menu-item:eq(' + menus[currentMenu].current + ')').data('action'); + currentCount = $('#menu_' + currentMenu + ' .menu-item:eq(' + menus[currentMenu].current + ')').data('count'); + } + + if(data.enterPressed){ + + if(isShowingControls){ + + $.post('http://esx_bankerjob/select_control', JSON.stringify({ + control: currentControl, + })) + + hideControls(); + showMenu(currentMenu); + + } else if(isMenuOpen) { + + if(menus[currentMenu].current != -1){ + $.post('http://esx_bankerjob/select', JSON.stringify({ + menu : currentMenu, + val : currentVal, + type : currentType, + action: currentAction, + count : currentCount + })) + } + + let elem = $('#menu_' + currentMenu + ' .menu-item.selected') + + if(elem.data('remove-on-select') == true){ + + elem.remove(); + + menus[currentMenu].items.splice(menus[currentMenu].current, 1) + menus[currentMenu].current = 0; + + $('#menu_' + currentMenu + ' .menu-item').removeClass('selected'); + $('#menu_' + currentMenu + ' .menu-item:eq(0)').addClass('selected'); + + currentVal = menus[currentMenu].items[0].value; + currentType = $('#menu_' + currentMenu + ' .menu-item:eq(0)').data('type'); + currentAction = $('#menu_' + currentMenu + ' .menu-item:eq(0)').data('action'); + currentCount = $('#menu_' + currentMenu + ' .menu-item:eq(0)').data('count'); + } + + } + + } + + if(data.backspacePressed){ + + if(isMenuOpen && currentMenu == 'banque'){ + hideMenus(); + $('#ctl_return').hide(); + showControl('banque'); + } + + if(isMenuOpen && currentMenu == 'banque_actions'){ + hideMenus(); + $('#ctl_return').hide(); + } + + } + } + + document.onkeyup = function (data) { + if (data.which == 27) { + $.post('http://esx_bankerjob/escape', '{}'); + } + }; + + document.onwheel = function (data) { + + if (data.deltaY < 0) { + scrollCustomers('UP'); + } + + if (data.deltaY > 0) { + scrollCustomers('DOWN'); + } + + }; + + $('form').submit(function(){ + return false; + }); + + window.onload = function(e){ window.addEventListener('message', function(event){ onData(event.data) }); } + +})() \ No newline at end of file