Layout update
This commit is contained in:
parent
839c13ed88
commit
5cece45351
31
css/main.css
31
css/main.css
|
|
@ -8,6 +8,17 @@
|
|||
}
|
||||
|
||||
#menubox {
|
||||
height: 100%;
|
||||
top: 0px;
|
||||
left : 0px;
|
||||
position: fixed;
|
||||
border-left-width: 2px;
|
||||
border-color: black;
|
||||
border-left-style: solid;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
#crafting {
|
||||
height: 100%;
|
||||
top: 0px;
|
||||
left : 320px;
|
||||
|
|
@ -15,7 +26,18 @@
|
|||
border-left-width: 2px;
|
||||
border-color: black;
|
||||
border-left-style: solid;
|
||||
left: 320px;
|
||||
}
|
||||
|
||||
#outputbox {
|
||||
height: 100%;
|
||||
top: 0px;
|
||||
left : 640px;
|
||||
position: fixed;
|
||||
border-left-width: 2px;
|
||||
border-right-width: 2px;
|
||||
border-color: black;
|
||||
border-left-style: solid;
|
||||
border-right-style: solid;
|
||||
}
|
||||
|
||||
.splitable {
|
||||
|
|
@ -31,4 +53,11 @@
|
|||
right: 5px;
|
||||
bottom: 0;
|
||||
position: fixed;
|
||||
}
|
||||
|
||||
#outputfull {
|
||||
border-top-width: 2px;
|
||||
border-color: black;
|
||||
border-top-style: solid;
|
||||
width: 320px;
|
||||
}
|
||||
15
index.html
15
index.html
|
|
@ -11,7 +11,7 @@
|
|||
<body>
|
||||
<script src="js/main.js"></script>
|
||||
<div id="menubox">
|
||||
<h1 class="ui-widget" style="text-align: center;">Add Items</h1>
|
||||
<h1 class="ui-widget" style="text-align: center;">Add Items</h1>
|
||||
<ul id="menu">
|
||||
<li>
|
||||
<div>Blocks</div>
|
||||
|
|
@ -50,15 +50,24 @@
|
|||
$("ul").css("width", "250px")
|
||||
</script>
|
||||
<div id="crafting">
|
||||
<h1 class="ui-widget" style="text-align: center;width: 320px;">Items to Craft</h1>
|
||||
<div id="tocraft"></div>
|
||||
<span style="display: inline-block; width: 90%;"></span> <br>
|
||||
<button id="calc">Calculate</button>
|
||||
<br><span style="display: inline-block; width: 90%;"></span> <br>
|
||||
</div>
|
||||
<div id="outputbox">
|
||||
<h1 class="ui-widget" style="text-align: center;">Requiered Items</h1>
|
||||
<br>
|
||||
<div class="ui-widget" id="output"></div>
|
||||
<br>
|
||||
<div class="ui-widget" id="outputfull"><h1 class="ui-widget">=</h1><br></div>
|
||||
<span style="display: inline-block; width: 90%;"></span> <br>
|
||||
</div>
|
||||
</body>
|
||||
<div id="container">
|
||||
<div class="ui-widget" id="bottom-left">Thanks to Pyramidalist and his community<br>© MasterGordon & Ph3nix</div>
|
||||
<div class="ui-widget" id="bottom-left">
|
||||
Thanks to Pyramidalist and his community<br>© MasterGordon &
|
||||
Ph3nix
|
||||
</div>
|
||||
</div>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,260 @@
|
|||
/**
|
||||
*
|
||||
*/
|
||||
var allItemsArray = []
|
||||
var allItems = {}
|
||||
var requieredCount = []
|
||||
var requieredItems = []
|
||||
var srequieredCount = []
|
||||
var srequieredItems = []
|
||||
var newid = 0
|
||||
var items = ""
|
||||
|
||||
var itemsRequest = new XMLHttpRequest();
|
||||
itemsRequest.open('GET', 'resources/items.txt')
|
||||
itemsRequest.onload = function() {
|
||||
var res = itemsRequest.responseText;
|
||||
items = res.split("\n")
|
||||
var loaded = 0
|
||||
for (var i = 0; i < items.length && !(items[i] in window); i++) {
|
||||
loadJSON(items[i])
|
||||
}
|
||||
|
||||
}
|
||||
itemsRequest.send()
|
||||
|
||||
function loadHTML() {
|
||||
$("#menu li ul").empty()
|
||||
$("#k_other").empty()
|
||||
for (var i = 0; i < allItemsArray.length; i++) {
|
||||
if (!('disabled' in allItemsArray[i])) {
|
||||
// $("#itemtoadd").append("<option
|
||||
// value=\""+allItemsArray[i].id+"\">" + allItemsArray[i].name +
|
||||
// "</option>")
|
||||
$("#k_" + allItemsArray[i].type).append(
|
||||
"<li><div class=\"additem\" id=\"add" + allItemsArray[i].id
|
||||
+ "\">" + allItemsArray[i].name + "</div></li>")
|
||||
} else {
|
||||
// console.log(allItemsArray[i].name+" disabled. Not loading")
|
||||
}
|
||||
}
|
||||
|
||||
$("#menu li ul").each(function() {
|
||||
$(this).html($(this).children('li').sort(function(a, b) {
|
||||
return ($(b).data('position')) < ($(a).data('position')) ? 1 : -1;
|
||||
}));
|
||||
});
|
||||
|
||||
$(".additem")
|
||||
.click(
|
||||
function() {
|
||||
var id = parseInt($(this).attr("id").substring(3, 99))
|
||||
console.log(id)
|
||||
var tagid = 'item_' + id
|
||||
if ($('#' + tagid).length) {
|
||||
console.log(id + " allready exists!")
|
||||
return
|
||||
}
|
||||
$("#tocraft")
|
||||
.append(
|
||||
'<input id="'
|
||||
+ tagid
|
||||
+ '" name="value"><label id="lable_'
|
||||
+ tagid
|
||||
+ '" style="margin-top: 3px;" class="ui-widget" for="'
|
||||
+ tagid + '"> '
|
||||
+ getItemFromId(id).name
|
||||
+ '<br></label>')
|
||||
// <span id="trash'+tagid+'" class="ui-icon
|
||||
// ui-icon-trash"></span>
|
||||
$("#" + tagid).spinner({
|
||||
min : 0,
|
||||
numberFormat : "n",
|
||||
change : function(event, ui) {
|
||||
if ($("#" + tagid).spinner("value") == 0) {
|
||||
$("#" + tagid).spinner("destroy")
|
||||
$("#" + tagid).remove()
|
||||
$("#lable_" + tagid).remove()
|
||||
}
|
||||
}
|
||||
});
|
||||
$("#" + tagid).val(1)
|
||||
})
|
||||
}
|
||||
|
||||
function loadJSON(itemname) {
|
||||
var itemRequest = new XMLHttpRequest();
|
||||
itemRequest.open('GET', 'resources/items/' + itemname + '.txt')
|
||||
console.log("Loading: " + itemname + ".txt")
|
||||
itemRequest.onload = function() {
|
||||
itemname = itemname.replace(/\s/g, "")
|
||||
var item = JSON.parse(itemRequest.responseText)
|
||||
if (!('name' in item)) {
|
||||
item.name = itemname
|
||||
console.warn("missing key \"name\" in " + itemname)
|
||||
}
|
||||
item.id = newid
|
||||
allItems[itemname] = item
|
||||
allItemsArray.push(item)
|
||||
console.log(item)
|
||||
loadHTML()
|
||||
newid++
|
||||
if (newid == items.length){
|
||||
console.log("refresh")
|
||||
$("#menu").menu("refresh");
|
||||
}
|
||||
}
|
||||
itemRequest.send()
|
||||
}
|
||||
|
||||
function getItemFromId(index) {
|
||||
for (var i = 0; i < allItemsArray.length; i++) {
|
||||
if (allItemsArray[i].id == index)
|
||||
return allItemsArray[i]
|
||||
}
|
||||
return null
|
||||
}
|
||||
|
||||
$(document)
|
||||
.ready(
|
||||
function() {
|
||||
// SEITE HAT GELADEN
|
||||
|
||||
$("#additem").button()
|
||||
$("#calc").button()
|
||||
|
||||
// BUTTONS
|
||||
|
||||
$("#calc")
|
||||
.click(
|
||||
function() {
|
||||
requieredCount = []
|
||||
requieredItems = []
|
||||
for (var i = 0; i < newid; i++) {
|
||||
var tag = "#item_" + i;
|
||||
if ($(tag).length) {
|
||||
var item = allItemsArray[i]
|
||||
for (var n = 0; n < $(tag)
|
||||
.spinner("value"); n++) {
|
||||
for (var j = 0; j < item.crafting.length; j++) {
|
||||
|
||||
var count = 1
|
||||
if (item.count)
|
||||
count = 1 / item.count
|
||||
|
||||
if (requieredItems
|
||||
.indexOf(item.crafting[j]) == -1) {
|
||||
requieredCount[requieredItems.length] = 1
|
||||
requieredItems[requieredItems.length] = item.crafting[j]
|
||||
} else {
|
||||
requieredCount[requieredItems
|
||||
.indexOf(item.crafting[j])]++
|
||||
}
|
||||
}
|
||||
}
|
||||
for (var i = 0; i < requieredCount.length; i++) {
|
||||
requieredCount[i] = Math
|
||||
.ceil(requieredCount[i])
|
||||
}
|
||||
}
|
||||
}
|
||||
srequieredCount = requieredCount
|
||||
srequieredItems = requieredItems
|
||||
var swapped = false
|
||||
// do {
|
||||
// swapped = false
|
||||
// for (var i = 0; i < srequieredItems.length; i++) {
|
||||
// var itemid = srequieredItems[i]
|
||||
// var itemcount = srequieredCount[i]
|
||||
// if (allItems[itemid]) {
|
||||
// var item = allItems[itemid]
|
||||
// srequieredCount.splice(i, 1)
|
||||
// srequieredItems.splice(i, 1)
|
||||
// for (var k = 0; k < itemcount; k++) {
|
||||
// for (var j = 0; j < item.crafting.length; j++) {
|
||||
//
|
||||
// var count = 1
|
||||
// if (item.count)
|
||||
// count = 1 / item.count
|
||||
//
|
||||
// if (srequieredItems
|
||||
// .indexOf(item.crafting[j]) == -1) {
|
||||
// srequieredCount[srequieredItems.length] = count
|
||||
// srequieredItems[srequieredItems.length] = item.crafting[j]
|
||||
// console.log("-1")
|
||||
// } else {
|
||||
// srequieredCount[srequieredItems
|
||||
// .indexOf(item.crafting[j])] += count
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// for (var i = 0; i < srequieredCount.length; i++) {
|
||||
// srequieredCount[i] = Math
|
||||
// .ceil(srequieredCount[i])
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// } while (swapped)
|
||||
updateoutput()
|
||||
})
|
||||
|
||||
})
|
||||
|
||||
function updateoutput() {
|
||||
$("#output").empty()
|
||||
for (var i = 0; i < requieredItems.length; i++) {
|
||||
if (allItems[requieredItems[i]]) {
|
||||
$("#output").append(
|
||||
"<span id=\"" + i
|
||||
+ "\" class=\"ui-widget outputitem splitable\">"
|
||||
+ requieredCount[i] + "x "
|
||||
+ allItems[requieredItems[i]].name + "</span><br>")
|
||||
} else {
|
||||
$("#output").append(
|
||||
"<span id=\"" + i
|
||||
+ "\" class=\"ui-widget outputitem notsplitable\">"
|
||||
+ requieredCount[i] + "x " + requieredItems[i]
|
||||
+ "</span><br>")
|
||||
}
|
||||
}
|
||||
|
||||
$(".outputitem")
|
||||
.click(
|
||||
function() {
|
||||
console.log($(this).attr('id'))
|
||||
var index = parseInt($(this).attr('id'))
|
||||
var itemid = requieredItems[index]
|
||||
var itemcount = requieredCount[index]
|
||||
if (allItems[itemid]) {
|
||||
var item = allItems[itemid]
|
||||
requieredCount.splice(index, 1)
|
||||
requieredItems.splice(index, 1)
|
||||
for (var i = 0; i < itemcount; i++) {
|
||||
for (var j = 0; j < item.crafting.length; j++) {
|
||||
|
||||
var count = 1
|
||||
if (item.count)
|
||||
count = 1 / item.count
|
||||
|
||||
if (requieredItems
|
||||
.indexOf(item.crafting[j]) == -1) {
|
||||
requieredCount[requieredItems.length] = count
|
||||
requieredItems[requieredItems.length] = item.crafting[j]
|
||||
console.log("-1")
|
||||
} else {
|
||||
requieredCount[requieredItems
|
||||
.indexOf(item.crafting[j])] += count
|
||||
}
|
||||
}
|
||||
}
|
||||
for (var i = 0; i < requieredCount.length; i++) {
|
||||
requieredCount[i] = Math
|
||||
.ceil(requieredCount[i])
|
||||
}
|
||||
$('#' + index).fadeOut(300)
|
||||
setTimeout(function() {
|
||||
updateoutput()
|
||||
}, 300)
|
||||
}
|
||||
})
|
||||
}
|
||||
Loading…
Reference in New Issue