2024-08-28 17:47:13 +02:00
|
|
|
<!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)
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
let hashParams = window.location.hash
|
|
|
|
|
let dataPart = hashParams.replace('#data=', '')
|
|
|
|
|
let decodedData = atob(dataPart)
|
2024-08-28 17:59:21 +02:00
|
|
|
if (decodedData.length > 0) {
|
|
|
|
|
let arr = JSON.parse(decodedData)
|
|
|
|
|
if (arr.length > 0) {
|
|
|
|
|
haram.harams = arr
|
|
|
|
|
}
|
|
|
|
|
}
|
2024-08-28 17:47:13 +02:00
|
|
|
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>
|
