Localstorage additions, scrollto
This commit is contained in:
parent
b9ef801f77
commit
4916f77a1d
67
orna_tools.py
Normal file
67
orna_tools.py
Normal file
@ -0,0 +1,67 @@
|
||||
from flask import Flask, render_template, jsonify, request
|
||||
|
||||
app = Flask(__name__)
|
||||
|
||||
@app.route('/')
|
||||
def index():
|
||||
return render_template('index.html')
|
||||
|
||||
@app.route('/results', methods=['POST'])
|
||||
def results():
|
||||
combinations = calculate_combinations(request.get_json())
|
||||
return jsonify(combinations)
|
||||
|
||||
|
||||
# Data Methods
|
||||
def calculate_combinations(equipment, do_print=False):
|
||||
# name, defense, resistance
|
||||
eq_headware = equipment["head"]
|
||||
eq_chestware = equipment["chest"]
|
||||
eq_legwear = equipment["legs"]
|
||||
|
||||
# Create a list of all possible eq combinations
|
||||
results = []
|
||||
for hw in eq_headware:
|
||||
for cw in eq_chestware:
|
||||
for lw in eq_legwear:
|
||||
result = {}
|
||||
result["eq"] = [hw[0], cw[0], lw[0]]
|
||||
result["def"] = hw[1] + cw[1] + lw[1]
|
||||
result["res"] = hw[2] + cw[2] + lw[2]
|
||||
results.append(result)
|
||||
|
||||
# Sort the combinations by combined total of def anf res
|
||||
results.sort(key=lambda i: i["def"] + i["res"])
|
||||
|
||||
if do_print:
|
||||
for result in results:
|
||||
print("{} ({} def {} res) -".format(result["def"] + result["res"], result["def"], result["res"]))
|
||||
for eq in result["eq"]:
|
||||
print("\t{}".format(eq))
|
||||
|
||||
return results
|
||||
|
||||
|
||||
"""
|
||||
eq_headware = [
|
||||
["Ljosalfar Hood", 98, 510],
|
||||
["Kobold Hood", 0, 614],
|
||||
["Northern Cowl", 584, 130],
|
||||
["High Fomorian Hood", 487, 112]
|
||||
]
|
||||
|
||||
eq_chestware = [
|
||||
["Ljosalfar Robe", 121, 528],
|
||||
["High Fomorian Garb", 544, 0],
|
||||
["Darkest Garb", 514, 169],
|
||||
["Northern Garb", 535, 119],
|
||||
["Northern Robe", 486, 108]
|
||||
]
|
||||
|
||||
eq_legwear = [
|
||||
["Northern Boots", 636, 142],
|
||||
["Terra Boots", 129, 369],
|
||||
["High Fomorian Boots", 516, 0],
|
||||
["Ljosalfar Boots", 280, 280]
|
||||
]
|
||||
"""
|
@ -19,10 +19,13 @@
|
||||
<body>
|
||||
<nav class="uk-navbar-container" uk-navbar>
|
||||
<div class="uk-navbar-center">
|
||||
<a href="" class="uk-navbar-item uk-logo">Orna Tools</a>
|
||||
<a href="" class="uk-navbar-item uk-logo">Orna Tools - Equipment Combinations</a>
|
||||
</div>
|
||||
</nav>
|
||||
<div class="uk-container">
|
||||
<div id="help-container" class="uk-padding-large uk-text-center uk-text-muted uk-margin-large-left uk-margin-large-right">
|
||||
<div>Use the three tabs to input your options for each equipment slot (head/chest/leg). Click the calculate button to populate a table with possible combinations. Click on the column headers to sort results. Use the green + to input additional items.</div>
|
||||
</div>
|
||||
<div id="equipment-container" class="uk-padding-large">
|
||||
<ul class="uk-flex-center" uk-tab>
|
||||
<li class="uk-active"><a href="">Head</a></li>
|
||||
@ -63,23 +66,33 @@
|
||||
</ul>
|
||||
</div>
|
||||
<div class="uk-text-center uk-margin-bottom">
|
||||
<button id="clear-button" class="uk-button uk-button-danger">Clear</button>
|
||||
<button id="calculate-button" class="uk-button uk-button-primary">Calculate</button>
|
||||
</div>
|
||||
|
||||
<div id="result-panel" class="uk-section">
|
||||
<div id="results-panel" class="uk-section uk-overflow-auto" hidden>
|
||||
<hr class="uk-divider-icon" />
|
||||
<table id="results-table" class="uk-table uk-table-divider uk-table-striped uk-table-hover">
|
||||
<thead>
|
||||
<th>Total</th>
|
||||
<th data-sort-default>Total</th>
|
||||
<th>Defense</th>
|
||||
<th>Resistance</th>
|
||||
<th class="uk-table-expand">Head</th>
|
||||
<th class="uk-table-expand">Chest</th>
|
||||
<th class="uk-table-expand">Legs</th>
|
||||
<th class="uk-table-expand" data-sort-method='none'>Head</th>
|
||||
<th class="uk-table-expand" data-sort-method='none'>Chest</th>
|
||||
<th class="uk-table-expand" data-sort-method='none'>Legs</th>
|
||||
</thead>
|
||||
<tbody></tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="uk-text-center uk-margin-large-top uk-margin-small-bottom">
|
||||
© <script>document.write(new Date().getFullYear());</script> by <a href="http://binaryatrocity.name">binaryatrocity</a>
|
||||
|
|
||||
Created for the <span class="uk-text-success">Legends of Palisma</span> Kingdom
|
||||
|
|
||||
<a href="http://playorna.com">OrnaRPG</a>
|
||||
</footer>
|
||||
</div>
|
||||
</body>
|
||||
<script>
|
||||
@ -127,12 +140,18 @@
|
||||
}
|
||||
|
||||
table_sort.refresh();
|
||||
document.querySelector("div#results-panel").hidden = false;
|
||||
|
||||
results_tbody.scrollIntoView();
|
||||
}
|
||||
|
||||
// Send data to backend
|
||||
function calculateEquipment() {
|
||||
let data = gatherEquipmentData();
|
||||
|
||||
// Store data in localStorage
|
||||
localStorage.setItem('eq_data', JSON.stringify(data));
|
||||
|
||||
// Clear out existing table rows
|
||||
for(let row of document.querySelectorAll("table#results-table > tbody > tr")) {
|
||||
row.remove();
|
||||
@ -143,7 +162,7 @@
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify(data)
|
||||
}).then((response) => response.json()).then((data) => {
|
||||
processEquipmentResults(data)
|
||||
processEquipmentResults(data);
|
||||
}).catch((error) => {
|
||||
console.log(error);
|
||||
alert("There was a problem...");
|
||||
@ -189,6 +208,69 @@
|
||||
return data;
|
||||
}
|
||||
|
||||
function clearExistingData() {
|
||||
localStorage.clear();
|
||||
|
||||
// Clear out existing table rows
|
||||
for(let row of document.querySelectorAll("table > tbody > tr")) {
|
||||
row.remove();
|
||||
}
|
||||
}
|
||||
|
||||
function loadExistingData() {
|
||||
var data = localStorage.getItem('eq_data');
|
||||
|
||||
function appendToTable(eq, table_id) {
|
||||
let input_element = document.createElement("input");
|
||||
input_element.className="uk-input";
|
||||
input_element.type = "text";
|
||||
|
||||
// Create the delete button
|
||||
let delete_button = document.createElement("a");
|
||||
delete_button.className="uk-icon-button del-row-button";
|
||||
delete_button.setAttribute("uk-icon", "icon:minus-circle;ratio:1");
|
||||
delete_button.addEventListener("click", deleteEquipmentTableRow, false);
|
||||
|
||||
let query = "table#" + table_id + " > tbody";
|
||||
let tbody = document.querySelector(query);
|
||||
let new_row = tbody.insertRow(-1);
|
||||
|
||||
// Append all of the child cells needed
|
||||
new_row.insertCell(0).appendChild(delete_button);
|
||||
input_element.value = eq[2];
|
||||
new_row.insertCell(0).appendChild(input_element.cloneNode());
|
||||
input_element.value = eq[1];
|
||||
new_row.insertCell(0).appendChild(input_element.cloneNode());
|
||||
input_element.value = eq[0];
|
||||
new_row.insertCell(0).appendChild(input_element.cloneNode());
|
||||
new_row.insertCell(0).appendChild(document.createTextNode(tbody.children.length))
|
||||
}
|
||||
|
||||
if(data) {
|
||||
data = JSON.parse(data);
|
||||
|
||||
// Remove existing rows from all tables
|
||||
clearExistingData();
|
||||
|
||||
// Populate new rows in all eq tables
|
||||
for(let hg of data['head']) {
|
||||
appendToTable(hg, "head-table");
|
||||
}
|
||||
for(let cg of data['chest']) {
|
||||
appendToTable(cg, "chest-table");
|
||||
}
|
||||
for(let lg of data['legs']) {
|
||||
appendToTable(lg, "leg-table");
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function confirmDataCleanse() {
|
||||
if(confirm("Are you sure you want to clear all existing data?")) {
|
||||
clearExistingData();
|
||||
}
|
||||
}
|
||||
|
||||
// Add event listeners to our table buttons
|
||||
const add_row_buttons = document.querySelectorAll("a.add-row-button");
|
||||
for(let button of add_row_buttons) {
|
||||
@ -201,9 +283,13 @@
|
||||
|
||||
// Add event listener to Calculate button, call backend
|
||||
document.querySelector("#calculate-button").addEventListener("click", calculateEquipment, false);
|
||||
document.querySelector("#clear-button").addEventListener("click", confirmDataCleanse, false);
|
||||
|
||||
// Enable sorting for our results table
|
||||
var table_sort = new Tablesort(document.querySelector("table#results-table"));
|
||||
var table_sort = new Tablesort(document.querySelector("table#results-table"), {descending: true});
|
||||
|
||||
// Load any existing data from LocalStorage
|
||||
loadExistingData();
|
||||
</script>
|
||||
<style type="text/css">
|
||||
table:not(#results-table) > tbody > tr > td:first-child {
|
||||
|
Loading…
x
Reference in New Issue
Block a user