Initial Upload
This commit is contained in:
parent
edc28482f4
commit
3a5091f5e3
File diff suppressed because it is too large
Load Diff
|
|
@ -0,0 +1,310 @@
|
|||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<link rel="stylesheet" href="bootstrap.css">
|
||||
|
||||
<style>
|
||||
button {
|
||||
margin: 5px
|
||||
}
|
||||
td, th {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.active {
|
||||
background-color: green;
|
||||
color: white;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
|
||||
</script>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<section>
|
||||
<div class="container">
|
||||
<h1 style="margin-left: 10px;">Aktuelles Thema</h1>
|
||||
<table border="1">
|
||||
<tr>
|
||||
<td colspan="2">
|
||||
<input class="form-control" type="text" id="topicInput" placeholder="Thema hier eingeben">
|
||||
</td>
|
||||
<td>
|
||||
<button class="btn btn-primary" onclick="closeTopic()">
|
||||
Thema abschliessen
|
||||
</button>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>
|
||||
M
|
||||
</th>
|
||||
<th>
|
||||
W
|
||||
</th>
|
||||
<th>
|
||||
D
|
||||
</th>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td id="time-0">
|
||||
0
|
||||
</td>
|
||||
<td id="time-1">
|
||||
0
|
||||
</td>
|
||||
<td id="time-2">
|
||||
0
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<button class="btn btn-primary" onclick="start(0)">Beginnt zu Reden</button>
|
||||
</td>
|
||||
<td>
|
||||
<button class="btn btn-primary" onclick="start(1)">Beginnt zu Reden</button>
|
||||
</td>
|
||||
<td>
|
||||
<button class="btn btn-primary" onclick="start(2)">Beginnt zu Reden</button>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="3">
|
||||
<button class="btn btn-primary" style="width: 98%;" onclick="stop()">Hört auf zu Reden, -> Stille</button>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="3">
|
||||
<button class="btn btn-primary" style="width: 98%;" onclick="resetButton()">Reset</button>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<div class="container">
|
||||
|
||||
|
||||
<H1>Abgeschlossene Themen</H1>
|
||||
<button class="btn btn-primary" onclick="buttonDeleteAllClosedTopics()">alle Löschen</button>
|
||||
<table border="1">
|
||||
<thead>
|
||||
<tr>
|
||||
<th style="min-width: 300px;">
|
||||
Thema
|
||||
</th>
|
||||
<th style="min-width: 100px;">
|
||||
M
|
||||
</th>
|
||||
<th style="min-width: 100px;">
|
||||
W
|
||||
</th>
|
||||
<th style="min-width: 100px;">
|
||||
D
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="closedTopicsTable">
|
||||
|
||||
</tbody>
|
||||
|
||||
|
||||
|
||||
</table>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<script>
|
||||
closedTopics = JSON.parse(localStorage.getItem("closedTopics"))
|
||||
if(!closedTopics) {
|
||||
closedTopics = []
|
||||
}
|
||||
watches = JSON.parse(localStorage.getItem("watches"))
|
||||
if(!watches){
|
||||
reset()
|
||||
}
|
||||
|
||||
function reset() {
|
||||
watches = [{"actions": []}, {"actions": []}, {"actions": []}]
|
||||
saveWatchesToLocalStorage()
|
||||
}
|
||||
|
||||
function resetButton() {
|
||||
if(confirm("Soll die Zähler zurückgesetzt werden?")){
|
||||
reset()
|
||||
}
|
||||
}
|
||||
|
||||
function buttonDeleteAllClosedTopics() {
|
||||
if(confirm("Sollen alle abgeschlossenen Themen gelöscht werden?")) {
|
||||
closedTopics = []
|
||||
saveClosedTopicsToLocalStorage()
|
||||
refreshClosedTopics()
|
||||
}
|
||||
}
|
||||
|
||||
function buttonDeleteClosedTopic(topicIndex) {
|
||||
if(confirm('Soll das Thema "' + closedTopics[topicIndex]["name"] + '" gelöscht werden?')) {
|
||||
deleteTopic(topicIndex)
|
||||
}
|
||||
}
|
||||
|
||||
function closeTopic() {
|
||||
let defaultname = "Thema"
|
||||
let name = document.getElementById("topicInput").value
|
||||
let nameLessCounter = 1
|
||||
while(!name){
|
||||
let foundName = false
|
||||
closedTopics.forEach(topic => {
|
||||
if(topic.name === defaultname + nameLessCounter){
|
||||
foundName = true
|
||||
}
|
||||
});
|
||||
if(foundName) {
|
||||
nameLessCounter++
|
||||
} else {
|
||||
name = defaultname + nameLessCounter
|
||||
}
|
||||
}
|
||||
|
||||
closedTopics.push({"name": name, "watches": watches})
|
||||
stop()
|
||||
reset()
|
||||
document.getElementById("topicInput").value = ""
|
||||
saveActualTopicToLocalStorage()
|
||||
saveClosedTopicsToLocalStorage()
|
||||
refreshClosedTopics()
|
||||
}
|
||||
|
||||
function deleteTopic(topicIndex) {
|
||||
closedTopics = closedTopics.slice(0, topicIndex).concat(closedTopics.slice(topicIndex+1))
|
||||
saveClosedTopicsToLocalStorage()
|
||||
refreshClosedTopics()
|
||||
}
|
||||
|
||||
function reopenTopic(topicIndex) {
|
||||
if(watches[0]["actions"]["length"] > 0 || watches[1]["actions"]["length"] > 0 ||watches[2]["actions"]["length"] > 0 || document.getElementById("topicInput").value != "") {
|
||||
closeTopic()
|
||||
}
|
||||
watches = closedTopics[topicIndex]["watches"]
|
||||
document.getElementById("topicInput").value = closedTopics[topicIndex]["name"]
|
||||
deleteTopic(topicIndex)
|
||||
saveWatchesToLocalStorage()
|
||||
saveActualTopicToLocalStorage()
|
||||
}
|
||||
|
||||
function start(watchIndex) {
|
||||
stop()
|
||||
watches[watchIndex].actions.push({"type": "start", "time": new Date().getTime()})
|
||||
saveWatchesToLocalStorage()
|
||||
}
|
||||
|
||||
function stop() {
|
||||
watches.forEach(watch => {
|
||||
if(watch["actions"]["length"] > 0) {
|
||||
if(watch["actions"]["length"] % 2 == 1){
|
||||
watch["actions"].push({"type": "stop", "time": new Date().getTime()})
|
||||
}
|
||||
}
|
||||
});
|
||||
saveWatchesToLocalStorage()
|
||||
}
|
||||
|
||||
function sumForWatch(watch) {
|
||||
let summe = 0
|
||||
let i = 0
|
||||
while( i < watch["actions"]["length"]){
|
||||
let start = watch.actions[i].time
|
||||
let stop = new Date().getTime()
|
||||
if(i+1 < watch["actions"]["length"]) {
|
||||
stop = watch["actions"][i+1].time
|
||||
}
|
||||
summe += (stop - start)
|
||||
i += 2
|
||||
}
|
||||
return summe
|
||||
}
|
||||
|
||||
function timeToISO(time){
|
||||
return new Date(time).toISOString().slice(11, 19)
|
||||
}
|
||||
|
||||
function refreshWatch(watchIndex) {
|
||||
let cell = document.getElementById("time-" + watchIndex)
|
||||
cell.textContent = timeToISO(sumForWatch(watches[watchIndex]))
|
||||
if(watches[watchIndex]["actions"].slice(-1)[0]["type"] == "start"){
|
||||
cell.classList.add("active")
|
||||
} else {
|
||||
cell.classList.remove("active")
|
||||
}
|
||||
}
|
||||
|
||||
function refreshClosedTopics() {
|
||||
let table = document.getElementById("closedTopicsTable")
|
||||
table.innerHTML = ""
|
||||
for(let i = closedTopics.length - 1; i >= 0; i--) {
|
||||
let topic = closedTopics[i]
|
||||
let topicColumn = elt("td")
|
||||
topicColumn.textContent = topic.name
|
||||
let time0Column = elt("td")
|
||||
time0Column.textContent = timeToISO(sumForWatch(topic.watches[0]))
|
||||
let time1Column = elt("td")
|
||||
time1Column.textContent = timeToISO(sumForWatch(topic.watches[1]))
|
||||
let time2Column = elt("td")
|
||||
time2Column.textContent = timeToISO(sumForWatch(topic.watches[2]))
|
||||
let reopenButton = elt("button", {"onclick": "reopenTopic(" + i + ")"})
|
||||
reopenButton.textContent = "wieder öffnen"
|
||||
let reopenButtonColumn = elt("td", {}, reopenButton)
|
||||
let deleteButton = elt("button", {"onclick": "buttonDeleteClosedTopic(" + i + ")"})
|
||||
deleteButton.textContent = "löschen"
|
||||
let deleteButtonColumn = elt("td", {}, deleteButton)
|
||||
table.appendChild(elt("tr", {}, topicColumn, time0Column, time1Column, time2Column, reopenButtonColumn, deleteButtonColumn))
|
||||
}
|
||||
}
|
||||
|
||||
function saveWatchesToLocalStorage() {
|
||||
localStorage.setItem("watches", JSON.stringify(watches))
|
||||
}
|
||||
|
||||
function saveActualTopicToLocalStorage() {
|
||||
localStorage.setItem("actualTopic", document.getElementById("topicInput").value)
|
||||
}
|
||||
|
||||
function saveClosedTopicsToLocalStorage() {
|
||||
localStorage.setItem("closedTopics", JSON.stringify(closedTopics))
|
||||
}
|
||||
|
||||
// Helper function for DOM manipulation
|
||||
//
|
||||
function elt (type, attrs, ...children) {
|
||||
let node = document.createElement(type)
|
||||
for (a in attrs) {
|
||||
node.setAttribute(a, attrs[a])
|
||||
}
|
||||
for (let child of children) {
|
||||
if (typeof child != "string") node.appendChild(child)
|
||||
else node.appendChild(document.createTextNode(child))
|
||||
}
|
||||
return node
|
||||
}
|
||||
|
||||
document.getElementById("topicInput").value = localStorage.getItem("actualTopic")
|
||||
document.getElementById("topicInput").addEventListener('keyup', saveActualTopicToLocalStorage);
|
||||
refreshClosedTopics()
|
||||
setInterval(() => {
|
||||
refreshWatch(0)
|
||||
refreshWatch(1)
|
||||
refreshWatch(2)
|
||||
}, 100);
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Reference in New Issue