From 7f345404a79e6e0f25bafa6f25c8ba1edf6aef73 Mon Sep 17 00:00:00 2001 From: piernov Date: Sun, 24 Apr 2016 22:23:04 +0200 Subject: Add JS debitAccount() helper --- js/craftmine.js | 5 +++++ 1 file changed, 5 insertions(+) (limited to 'js') diff --git a/js/craftmine.js b/js/craftmine.js index bbb1074..46c726a 100644 --- a/js/craftmine.js +++ b/js/craftmine.js @@ -24,6 +24,11 @@ function updateData() { } } +function debitAccount(amount) { + data.gold -= amount; + updateData("gold"); +} + function withdrawMine() { sendRequest("craftmine.php", "op=withdrawMine&amount="+data.mine, function(xhr) { var gold = parseInt(xhr.responseText); // Server's response is a string -- cgit v1.2.3-54-g00ecf From f2d53d539ee55e1b41cc74368ad5457da6e05cf3 Mon Sep 17 00:00:00 2001 From: piernov Date: Sun, 24 Apr 2016 22:25:17 +0200 Subject: Decode JSON before calling callback and prevent call in case of error --- js/craftmine.js | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-) (limited to 'js') diff --git a/js/craftmine.js b/js/craftmine.js index 46c726a..912d10c 100644 --- a/js/craftmine.js +++ b/js/craftmine.js @@ -11,7 +11,11 @@ function sendRequest(url, params, callback) { xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); xhr.onreadystatechange = function() { if(xhr.readyState == XMLHttpRequest.DONE && xhr.status == "200") { - callback(xhr); + var data = JSON.parse(xhr.responseText); + if(data.error) { + return; + } + if(callback) callback(data); } } xhr.send(params); @@ -31,7 +35,7 @@ function debitAccount(amount) { function withdrawMine() { sendRequest("craftmine.php", "op=withdrawMine&amount="+data.mine, function(xhr) { - var gold = parseInt(xhr.responseText); // Server's response is a string + var gold = parseInt(xhr); // Server's response is a string if(isNaN(gold)) return; data.gold = gold; data.mine = 0; @@ -41,7 +45,7 @@ function withdrawMine() { function initCraftMine() { sendRequest("craftmine.php", "op=getCraftMine", function(xhr) { - var ret = xhr.responseText; + var ret = xhr; data.gold = parseInt(ret); // Server's response is a string updateData("gold"); }) -- cgit v1.2.3-54-g00ecf From 5ff6c7051867ed14ecbbc391709f25106c1bef1f Mon Sep 17 00:00:00 2001 From: piernov Date: Sun, 24 Apr 2016 22:27:33 +0200 Subject: Add client side JS shop functions --- js/craftmine.js | 7 ++++--- js/shop.js | 57 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 61 insertions(+), 3 deletions(-) create mode 100644 js/shop.js (limited to 'js') diff --git a/js/craftmine.js b/js/craftmine.js index 912d10c..dc4ee9a 100644 --- a/js/craftmine.js +++ b/js/craftmine.js @@ -44,9 +44,10 @@ function withdrawMine() { } function initCraftMine() { - sendRequest("craftmine.php", "op=getCraftMine", function(xhr) { - var ret = xhr; - data.gold = parseInt(ret); // Server's response is a string + sendRequest("craftmine.php", "op=getCraftMine", function(ret) { + data.gold = parseInt(ret.gold); // Server's response is a string + if(ret.shop) displayShop(ret.shop); + displayInventory(ret.inventory); updateData("gold"); }) } diff --git a/js/shop.js b/js/shop.js new file mode 100644 index 0000000..00636e1 --- /dev/null +++ b/js/shop.js @@ -0,0 +1,57 @@ +function displayShop(ret) { + var tmphtml = "

Select an item to buy it:

"; + tmphtml += "
    "; + for(var i=0; i < ret.items.length; i++) { + tmphtml += "
  • "; + tmphtml += ""; + tmphtml += "
    • "; + } + tmphtml += "
" + document.getElementById("tab2").innerHTML = tmphtml; +} + +function displayInventory(items) { + for(var i=0; i < items.length; i++) { + addItem(items[i]); + } +} + +function buildShop() { + sendRequest("craftmine.php", "op=buildShop", function(ret) { + displayShop(ret); + debitAccount(ret.cost); + }); +} + +function addItem(ret) { + var itemhtml = "
  • "; + itemhtml += ""; + itemhtml += "
    • "; + + var invcontent = document.getElementById("tab3"); + + if(invcontent.children.length <= 1) + { + var tmphtml = "

    Your bag contains the following items:

    "; + tmphtml += "
      "; + tmphtml += itemhtml; + tmphtml += "
    " + invcontent.innerHTML = tmphtml; + } else + invcontent.getElementsByTagName('ul')[0].innerHTML += itemhtml; + + showInfo(ret.desc); +} + +function buyItem(name) { + sendRequest("craftmine.php", "op=buyItem&item="+name, function(ret) { + addItem(ret); + debitAccount(ret.cost); + }); +} + +function useItem(name) { + sendRequest("craftmine.php", "op=useItem&item="+name, function(ret) { + }); +} + -- cgit v1.2.3-54-g00ecf From 96b345cdd68e0d5f434cd1bd25417e0b9eb62ba6 Mon Sep 17 00:00:00 2001 From: piernov Date: Sun, 24 Apr 2016 22:28:22 +0200 Subject: Add JS GUI helpers --- js/gui.js | 42 ++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 42 insertions(+) create mode 100644 js/gui.js (limited to 'js') diff --git a/js/gui.js b/js/gui.js new file mode 100644 index 0000000..bdf1710 --- /dev/null +++ b/js/gui.js @@ -0,0 +1,42 @@ +var MESSAGE_TIMEOUT = 4000; + +function changeTab() { + var hashtype = window.location.hash.substr(1,3); + if(hashtype != "tab") return; + var id = window.location.hash.substr(4); + var tabs = document.querySelectorAll("#tabs-panel > ul > li"); + for(var i=0; i < tabs.length; i++) { + if(i == id-1) + tabs[i].className = "active"; + else + tabs[i].className = ""; + } + +} + +function showMessage(type, msg) { + var msg_box = document.getElementById(type+"-box"); + msg_box.style.display = "initial"; + var msg_list = msg_box.firstElementChild.firstElementChild.firstElementChild; + msg_list.innerHTML = "
  • " + msg + "
    • \n" + msg_list.innerHTML; + + window.setTimeout(hideMessage.bind(null, type), MESSAGE_TIMEOUT); +} + +function hideMessage(type) { + var msg_box = document.getElementById(type+"-box"); + var msg_list = msg_box.firstElementChild.firstElementChild.firstElementChild; + var item = msg_list.lastElementChild; + msg_list.removeChild(item); + + if(msg_list.children.length <= 0) + msg_box.style.display = "none"; +} + +function showError(msg) { + showMessage("error", msg); +} + +function showInfo(msg) { + showMessage("info", msg); +} -- cgit v1.2.3-54-g00ecf From 9df3524395d661357483bcfcbf8962e57fe9bd6d Mon Sep 17 00:00:00 2001 From: piernov Date: Sun, 24 Apr 2016 22:29:27 +0200 Subject: Display error received from server + switch to specified tab on load --- js/craftmine.js | 2 ++ 1 file changed, 2 insertions(+) (limited to 'js') diff --git a/js/craftmine.js b/js/craftmine.js index dc4ee9a..66c35fc 100644 --- a/js/craftmine.js +++ b/js/craftmine.js @@ -13,6 +13,7 @@ function sendRequest(url, params, callback) { if(xhr.readyState == XMLHttpRequest.DONE && xhr.status == "200") { var data = JSON.parse(xhr.responseText); if(data.error) { + showError(data.error); return; } if(callback) callback(data); @@ -60,5 +61,6 @@ function updateMine() { function init() { initCraftMine(); + changeTab(); window.setInterval(updateMine, 1000); } -- cgit v1.2.3-54-g00ecf