var DEBUG_APP = true; $('#dataform').on('submit', function (e) { e.preventDefault(); var inputContent = $.trim($('#data').val()); if (inputContent.length > 0) { var warData = JSON.parse(inputContent); if (initApp(warData, 'withSave', warData) != false) { $('#data').val(''); } } }); $('#fileUpload').on('change', function () { var fileUploader = document.getElementById("fileUpload"); if (fileUploader.files.length > 0) { getFileContents(fileUploader.files[0]); } }); function initApp(data, callback, callbackData) { if (data.results && data.results.length == 3) { var reWriteMapData = JSON.parse(JSON.stringify(data)); reWriteMapData.results[1].ident = reWriteMapData.results[1].ident.replace(/group_\d+_/g, ""); reWriteMapData.results[2].ident = reWriteMapData.results[2].ident.replace(/group_\d+_/g, ""); reWriteMapData.results.shift(); callbackData = data = JSON.parse(JSON.stringify(reWriteMapData)); delete reWriteMapData; if (DEBUG_APP) console.log(data); } if (!data.results || data.results.length != 2 || !data.results[0] || data.results[0].ident != "body" || !data.results[1] || data.results[1].ident != "clanWarGetInfo" || !data.results[1].result || !data.results[1].result.response) { alert("Please recreate the JSON, switch to the main screen, and switch back to GuildWars. Then copy the JSON!"); return false; } if (DEBUG_APP) console.log(data) var mapData = data.results[1].result.response; if (DEBUG_APP) console.log('data', JSON.parse(JSON.stringify(data))); enhanceMap(mapData.enemySlots); enhanceMap(mapData.ourSlots); app.map = mapData; app.map.warDate = data.warDate; if (DEBUG_APP) console.log('app.map', JSON.parse(JSON.stringify(mapData))); Vue.nextTick(function () { // Determine which player team has more power: titans or heroes determineBestTeam('ally'); determineBestTeam('enemy'); // Syncs checkboxes between hero/titan teams syncCheckboxes(); // Highlights the other player team when the other one is hovered highlightHovered(); if (callback == 'withSave') { saveToStorage(callbackData); } }); } function initApp2(data) { var mapData = data; if (DEBUG_APP) console.log('data', JSON.parse(JSON.stringify(data))); enhanceMap(mapData.enemySlots); enhanceMap(mapData.ourSlots); app.map = mapData; app.map.warDate = data.warDate; if (DEBUG_APP) console.log('app.map', JSON.parse(JSON.stringify(mapData))); Vue.nextTick(function () { // Determine which player team has more power: titans or heroes determineBestTeam('ally'); determineBestTeam('enemy'); // Syncs checkboxes between hero/titan teams syncCheckboxes(); // Highlights the other player team when the other one is hovered highlightHovered(); }); } var app = {}; var jsondata = []; if (DEBUG_APP) { Vue.config.devtools = true; } console.log("hello"); $.getJSON('/hwtools/data/clanWarGetInfo.json', function (data) { console.log("hello 222222222"); jsondata = data jsondata = jsondata.filter(function (el) { return !!(el.enemyClan && el.enemyClan.title); }); mapData = jsondata[0]; enhanceMap(mapData.enemySlots); enhanceMap(mapData.ourSlots); console.log(jsondata[0]); app = new Vue({ el: '#app', data: { map: mapData, //mapData, the data obtained from the game mapSlots: mapSlots, // maps building names and types of data obtained from the game storage: jsondata || [] }, computed: { // Helps render enemy teams in order by power level orderedEnemies: function () { return orderByPower(this.map.enemySlots); }, // Helps render allied teams in order by power level orderedAllies: function () { return orderByPower(this.map.ourSlots); }, // Renders total team powers: hero, titan, total getAllyPower: function () { return getTotalPower(this.map.ourSlots); }, // Renders total enemy team powers: hero, titan, total getEnemyPower: function () { return getTotalPower(this.map.enemySlots); } }, filters: { formatNumber: function (value) { return value.toString().replace(/(\d)(?=(\d{3})+(?!\d))/g, '$1,'); }, unixToLocale: function (value) { return new Date(value * 1000).toDateString(); } } }); }) .fail(function( jqxhr, textStatus, error ) { var err = textStatus + ", " + error; console.log( "Request Failed: " + err ); })