lol
This commit is contained in:
parent
f5b3e61152
commit
f034f181b5
1 changed files with 200 additions and 0 deletions
200
index.html
Normal file
200
index.html
Normal file
|
@ -0,0 +1,200 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Harampunkte</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id='container'>
|
||||
</div>
|
||||
<div id='inputs'>
|
||||
</div>
|
||||
|
||||
<h1 id='harampunkte'>0 Harampunkte</h1>
|
||||
<button id="edit">edit</button>
|
||||
<hr />
|
||||
<a href="#" id="url"></a>
|
||||
</body>
|
||||
<script>
|
||||
const haram = {
|
||||
clear: () => {
|
||||
const container = document.getElementById('container')
|
||||
while(container.firstChild) {
|
||||
container.removeChild(container.firstChild)
|
||||
}
|
||||
const inputs = document.getElementById('inputs')
|
||||
while(inputs.firstChild) {
|
||||
inputs.removeChild(inputs.firstChild)
|
||||
}
|
||||
},
|
||||
editMode: false,
|
||||
harams: [
|
||||
{
|
||||
'points' : 10,
|
||||
'label' : 'Hatte Sex',
|
||||
},
|
||||
{
|
||||
'points' : 7,
|
||||
'label' : 'Blowjob gegeben/geleckt',
|
||||
},
|
||||
{
|
||||
'points' : 4,
|
||||
'label' : 'Blowjob bekommen/geleckt worden',
|
||||
},
|
||||
{
|
||||
'points' : 5,
|
||||
'label' : 'Geraucht',
|
||||
},
|
||||
{
|
||||
'points' : 4,
|
||||
'label' : 'Betrunken gewesen',
|
||||
},
|
||||
{
|
||||
'points' : 3,
|
||||
'label' : 'Jemanden vom anderen Geschlecht gekuesst',
|
||||
},
|
||||
{
|
||||
'points' : 9,
|
||||
'label' : 'Jemanden vom selben Geschlecht gekuesst',
|
||||
},
|
||||
{
|
||||
'points' : 3,
|
||||
'label' : 'geklaut',
|
||||
},
|
||||
{
|
||||
'points' : 4,
|
||||
'label' : 'Schlaegerei gehabt',
|
||||
},
|
||||
{
|
||||
'points' : 9,
|
||||
'label' : 'Illegale Drogen konsumiert',
|
||||
},
|
||||
{
|
||||
'points' : 12,
|
||||
'label' : 'Sex in der Oeffentlichkeit',
|
||||
},
|
||||
{
|
||||
'points' : 5,
|
||||
'label' : 'Verliebt gewesen',
|
||||
},
|
||||
{
|
||||
'points' : 8,
|
||||
'label' : 'Du hast mal ein Herz gebrochen',
|
||||
},
|
||||
{
|
||||
'points' : 6,
|
||||
'label' : 'Dir wurde das Herz gebrochen',
|
||||
},
|
||||
{
|
||||
'points' : 7,
|
||||
'label' : 'Strafanzeige bekommen',
|
||||
},
|
||||
{
|
||||
'points' : 11,
|
||||
'label' : 'In Polizeigewahrsam gewesen',
|
||||
},
|
||||
{
|
||||
'points' : 2,
|
||||
'label' : 'Porno geschaut',
|
||||
},
|
||||
],
|
||||
createLabel: (points, label) => {
|
||||
const labelElement = document.createElement('label')
|
||||
const checkbox = document.createElement('input')
|
||||
checkbox.setAttribute('type', 'checkbox')
|
||||
checkbox.setAttribute('value', points)
|
||||
checkbox.setAttribute('name', 'haram')
|
||||
|
||||
labelElement.appendChild(checkbox)
|
||||
labelElement.appendChild(document.createTextNode(label + " (+" + points +")"))
|
||||
|
||||
const container = document.getElementById('container')
|
||||
container.appendChild(labelElement)
|
||||
container.appendChild(document.createElement('br'))
|
||||
},
|
||||
setUp: () => {
|
||||
document.getElementById('edit').innerText = 'edit';
|
||||
haram.editMode = false
|
||||
haram.clear()
|
||||
haram.harams.forEach((item) => haram.createLabel(item.points, item.label))
|
||||
document.getElementsByName('haram').forEach((item) => {
|
||||
item.addEventListener('change', (event) => {
|
||||
var harampunkte = 0;
|
||||
document.getElementsByName('haram').forEach((haramItem) => {
|
||||
if (haramItem.checked) {
|
||||
harampunkte = parseInt(harampunkte) + parseInt(haramItem.value)
|
||||
}
|
||||
})
|
||||
document.getElementById('harampunkte').innerHTML = harampunkte + " Harampunkte"
|
||||
})
|
||||
})
|
||||
},
|
||||
edit: () => {
|
||||
document.getElementById('edit').innerText = 'save';
|
||||
haram.editMode = true
|
||||
haram.clear()
|
||||
haram.createInputs()
|
||||
},
|
||||
createInputs: () => {
|
||||
const table = document.createElement('table')
|
||||
table.setAttribute('id', 'table')
|
||||
haram.harams.forEach((item) => haram.addTableRow(table, item.label, item.points))
|
||||
document.getElementById('inputs').appendChild(table)
|
||||
const newButton = document.createElement('button')
|
||||
newButton.innerText = 'new item'
|
||||
newButton.addEventListener('click', (e) => haram.addTableRow(table))
|
||||
|
||||
|
||||
document.getElementById('inputs').appendChild(newButton)
|
||||
},
|
||||
deleteItem: (label) => {
|
||||
const index = haram.harams.findIndex((item) => item.label === label)
|
||||
if (index > -1) {
|
||||
haram.harams.splice(index, 1)
|
||||
}
|
||||
haram.edit()
|
||||
},
|
||||
addTableRow: (table, label = '', points = 0) => {
|
||||
const row = document.createElement('tr')
|
||||
const td = document.createElement('td')
|
||||
const labelInput = document.createElement('input')
|
||||
labelInput.setAttribute('type', 'text')
|
||||
labelInput.setAttribute('value', label)
|
||||
const pointsInput = document.createElement('input')
|
||||
pointsInput.setAttribute('type', 'number')
|
||||
pointsInput.setAttribute('value', points)
|
||||
const deleteButton = document.createElement('button')
|
||||
deleteButton.innerText = 'delete'
|
||||
deleteButton.addEventListener('click', (e) => haram.deleteItem(label))
|
||||
|
||||
td.appendChild(labelInput)
|
||||
td.appendChild(pointsInput)
|
||||
td.appendChild(deleteButton)
|
||||
row.appendChild(td)
|
||||
table.appendChild(row)
|
||||
}
|
||||
}
|
||||
|
||||
debugger;
|
||||
let hashParams = window.location.hash
|
||||
let dataPart = hashParams.replace('#data=', '')
|
||||
let decodedData = atob(dataPart)
|
||||
let arr = JSON.parse(decodedData)
|
||||
haram.harams = arr
|
||||
haram.setUp()
|
||||
document.getElementById('edit').addEventListener('click', () => {
|
||||
if (haram.editMode === true) {
|
||||
haram.setUp()
|
||||
const jsonString = JSON.stringify(haram.harams)
|
||||
const encoded = btoa(jsonString)
|
||||
const baseUrl = window.location.protocol + "//" + window.location.host + window.location.pathname;
|
||||
const url = `${baseUrl}#data=${encodeURIComponent(encoded)}`;
|
||||
const linkElem = document.getElementById('url')
|
||||
linkElem.href = url
|
||||
linkElem.innerHTML = url
|
||||
return
|
||||
}
|
||||
haram.edit()
|
||||
})
|
||||
</script>
|
||||
</html>
|
Loading…
Add table
Reference in a new issue