badcold/clansofcontracts
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

initial commit

Browse Source
This commit is contained in:
badcold
2024-04-06 10:38:49 +02:00
commit bb8daf1f74
3 changed files with 277 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

121
contracts.json Normal file
View File

@@ -0,0 +1,121 @@
[
{
"id": 1,
"costs": {
"wool": 4
},
"rewards": {
"cotton": 2,
"expansion": 1,
"hops": 1
}
},
{
"id": 2,
"costs": {
"wool": 6
},
"rewards": {
"tobacco": 2,
"hops": 2
}
},
{
"id": 3,
"costs": {
"cow": 2
},
"rewards": {
"sugarCane": 2,
"gold": 10,
"hops": 1
}
},
{
"id": 4,
"costs": {
"cow": 3
},
"rewards": {
"wool": 3,
"hops": 3
}
},
{
"id": 5,
"costs": {
"sheep": 2
},
"rewards": {
"tobacco": 2,
"expansion": 1,
"hops": 1
}
},
{
"id": 6,
"costs": {
"wool": 3
},
"rewards": {
"sugarCane": 1,
"upgrade": 1,
"hops": 3
}
},
{
"id": 7,
"costs": {
"bread": 2
},
"rewards": {
"cotton": 2,
"expansion": 1,
"gold": 10
}
},
{
"id": 8,
"costs": {
"bread": 4
},
"rewards": {
"tobacco": 4,
"gold": 5,
"hops": 1
}
},
{
"id": 9,
"costs": {
"cheese": 2
},
"rewards": {
"sugarCane": 1,
"gold": 8,
"hops": 8
}
},
{
"id": 10,
"costs": {
"cheese": 4
},
"rewards": {
"cotton": 4,
"upgrade": 2,
"gold": 10
}
},
{
"id": 11,
"costs": {
"whisky": 2
},
"rewards": {
"tobacco": 2,
"gold": 10,
"hops": 1
}
}
]

BIN
contracts.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 283 KiB

156
index.html Normal file
View File

@@ -0,0 +1,156 @@
<!doctype html>
<html class="no-js" lang="">
<head>
<meta charset="utf-8">
<title>ClansOfContracts</title>
<style>
.filters {
font-size: x-large;
input {
width: 20px;
height: 20px;
}
}
.contract {
margin: 5px;
float: left;
color: red;
font-size: 14em;
line-height: 194px;
text-align: center;
user-select: none;
width: 194px;
height: 194px;
background-image: url('contracts.webp');
background-size: 9894px 194px;
}
html {
color: #222;
font-size: 1em;
line-height: 1.4;
background-color: palegoldenrod;
}
</style>
</head>
<body onload="init()">
<script>
let contracts;
let costs=["sheep", "cow", "wool", "bread", "cheese", "whisky"]
let rewards=["cotton", "tobacco", "sugarCane", "upgrade", "expansion", "gold", "hops"]
function init() {
fetch('contracts.json')
.then(response => response.json())
.then(json => {
contracts = json;
for (contract of contracts) {
contract.discarded = false;
}
update();
})
.catch(error => console.error('Error:', error));
for (cost of costs) {
checkBox = document.getElementById(cost);
checkBox.addEventListener('change', function() {
update();
});
}
for (reward of rewards) {
checkBox = document.getElementById(reward);
checkBox.addEventListener('change', function() {
update();
});
}
}
function update() {
let includedContracts = "";
let excludedContracts = "";
for (contract of contracts) {
if (isIncluded(contract)) {
includedContracts += generateContractHtml(contract);
} else {
excludedContracts += generateContractHtml(contract);
}
}
document.getElementById("included").innerHTML = includedContracts;
document.getElementById("excluded").innerHTML = excludedContracts;
}
function isIncluded(contract) {
let included = true;
for (cost of costs) {
checkBox = document.getElementById(cost);
if (!checkBox.checked && (contract.costs[cost] > 0)) {
included = false;
}
}
for (reward of rewards) {
checkBox = document.getElementById(reward);
if (!checkBox.checked && (contract.rewards[reward] > 0)) {
included = false;
}
}
return included;
}
function generateContractHtml(contract) {
let position = -(contract.id * 194);
if (contract.discarded) {
return "<div id=\"" + contract.id + "\" onclick=\"toggleDiscard(" + contract.id + ")\" class=\"contract\" style=\"background-position: "+position+"px 194px;\">X</div>";
} else {
return "<div id=\"" + contract.id + "\" onclick=\"toggleDiscard(" + contract.id + ")\" class=\"contract\" style=\"background-position: "+position+"px 194px;\"> </div>";
}
}
function toggleDiscard(id) {
for (contract of contracts) {
if (contract.id === id) {
contract.discarded = !contract.discarded;
}
}
update();
}
</script>
<div id="costs" class="filters">
<span>Costs:</span>
<input id="sheep" type="checkbox" checked="checked"/><label for="sheep">Sheep</label>
<input id="cow" type="checkbox" checked="checked"/><label for="cow">Cow</label>
<input id="wool" type="checkbox" checked="checked"/><label for="wool">Wool</label>
<input id="bread" type="checkbox" checked="checked"/><label for="bread">Bread</label>
<input id="cheese" type="checkbox" checked="checked"/><label for="cheese">Cheese</label>
<input id="whisky" type="checkbox" checked="checked"/><label for="whisky">Whisky</label>
</div>
<div id="rewards" class="filters">
<span>Rewards:</span>
<input id="cotton" type="checkbox" checked="checked"/><label for="cotton">Cotton</label>
<input id="tobacco" type="checkbox" checked="checked"/><label for="tobacco">Tobacco</label>
<input id="sugarCane" type="checkbox" checked="checked"/><label for="sugarCane">Sugar cane</label>
<input id="upgrade" type="checkbox" checked="checked"/><label for="upgrade">Upgrade</label>
<input id="expansion" type="checkbox" checked="checked"/><label for="expansion">Expansion</label>
<input id="gold" type="checkbox" checked="checked"/><label for="gold">Gold</label>
<input id="hops" type="checkbox" checked="checked"/><label for="hops">Hops</label>
</div>
<div id="included">
</div>
<hr style="clear: left;height:5px;border-width:0;color:gray;background-color:darkgoldenrod"/>
<div id="excluded">
</div>
<script>
</script>
</body>
</html>