Silias-Public
/
genderwatchprotocol
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

styling

This commit is contained in:
schrom01 2023-02-14 12:13:53 +01:00
parent 6264340b58
commit 5e0793c7fc
3 changed files with 51 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
css/custom.css Normal file
View File

@ -0,0 +1,3 @@
.active {
background-color: lightgray;
}

31
index.html
View File

@ -1,6 +1,7 @@
<html> <html>
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<link rel="stylesheet" href="css/custom.css">
<link rel="stylesheet" href="css/bootstrap.css"> <link rel="stylesheet" href="css/bootstrap.css">
</head> </head>
@ -15,7 +16,7 @@
<input class="form-control" type="text" id="topicInput" placeholder="Thema hier eingeben"> <input class="form-control" type="text" id="topicInput" placeholder="Thema hier eingeben">
</td> </td>
<td> <td>
<button class="btn btn-primary" onclick="closeTopic()"> <button class="" onclick="closeTopic()">
Thema abschliessen Thema abschliessen
</button> </button>
</td> </td>
@ -43,25 +44,36 @@
0 0
</td> </td>
</tr> </tr>
<tr>
<td id="count-0">
0
</td>
<td id="count-1">
0
</td>
<td id="count-2">
0
</td>
</tr>
<tr> <tr>
<td> <td>
<button class="btn btn-primary" onclick="start(0)">Beginnt zu Reden</button> <button class="" onclick="start(0)">Beginnt zu Reden</button>
</td> </td>
<td> <td>
<button class="btn btn-primary" onclick="start(1)">Beginnt zu Reden</button> <button class="" onclick="start(1)">Beginnt zu Reden</button>
</td> </td>
<td> <td>
<button class="btn btn-primary" onclick="start(2)">Beginnt zu Reden</button> <button class="" onclick="start(2)">Beginnt zu Reden</button>
</td> </td>
</tr> </tr>
<tr> <tr>
<td colspan="3"> <td colspan="3">
<button class="btn btn-primary" style="width: 98%;" onclick="stop()">Hört auf zu Reden, -> Stille</button> <button class="" style="width: 98%;" onclick="stop()">Hört auf zu Reden, -> Stille</button>
</td> </td>
</tr> </tr>
<tr> <tr>
<td colspan="3"> <td colspan="3">
<button class="btn btn-primary" style="width: 98%;" onclick="resetButton()">Reset</button> <button class="" style="width: 98%;" onclick="resetButton()">Reset</button>
</td> </td>
</tr> </tr>
</table> </table>
@ -73,11 +85,11 @@
<H2>Abgeschlossene Themen</H2> <H2>Abgeschlossene Themen</H2>
<button class="btn btn-primary" onclick="buttonDeleteAllClosedTopics()">alle Löschen</button> <button class="" onclick="buttonDeleteAllClosedTopics()">alle Löschen</button>
<table border="1"> <table class="table-bordered">
<thead> <thead>
<tr> <tr>
<th style="min-width: 300px;"> <th style="min-width: 100px;">
Thema Thema
</th> </th>
<th style="min-width: 100px;"> <th style="min-width: 100px;">
@ -109,6 +121,7 @@
if(!closedTopics) { if(!closedTopics) {
closedTopics = [] closedTopics = []
} }
watches = JSON.parse(localStorage.getItem("watches")) watches = JSON.parse(localStorage.getItem("watches"))
if(!watches){ if(!watches){
reset() reset()

34
js/functions.js
View File

@ -1,5 +1,5 @@
function reset() { function reset() {
watches = [{"actions": []}, {"actions": []}, {"actions": []}] actualTopic.watches = [{"actions": []}, {"actions": []}, {"actions": []}]
saveWatchesToLocalStorage() saveWatchesToLocalStorage()
} }
@ -106,6 +106,22 @@ function sumForWatch(watch) {
return summe return summe
} }
function countForWatch(watch) {
return watch["actions"].length / 2
}
function calcPercCountForWatch(watchindex, topic) {
let sumAll = sumCountAllWatches(topic)
if(sumAll == 0) {
return 0
}
return Math.round(countForWatch(topic.watches[watchindex]) / sumAll * 100)
}
function sumCountAllWatches(topic){
return countForWatch(topic.watches[0]) + countForWatch(topic.watches[1]) + countForWatch(topic.watches[2])
}
function sumAllwatches(topic) { function sumAllwatches(topic) {
return sumForWatch(topic.watches[0]) + sumForWatch(topic.watches[1]) + sumForWatch(topic.watches[2]) return sumForWatch(topic.watches[0]) + sumForWatch(topic.watches[1]) + sumForWatch(topic.watches[2])
} }
@ -115,13 +131,15 @@ function timeToISO(time){
} }
function refreshWatch(watchIndex) { function refreshWatch(watchIndex) {
let cell = document.getElementById("time-" + watchIndex) let timeCell = document.getElementById("time-" + watchIndex)
cell.textContent = timeToISO(sumForWatch(watches[watchIndex])) timeCell.textContent = timeToISO(sumForWatch(watches[watchIndex]))
if(watches[watchIndex]["actions"].length != 0 && watches[watchIndex]["actions"].slice(-1)[0]["type"] == "start"){ if(watches[watchIndex]["actions"].length != 0 && watches[watchIndex]["actions"].slice(-1)[0]["type"] == "start"){
cell.classList.add("active") timeCell.classList.add("active")
} else { } else {
cell.classList.remove("active") timeCell.classList.remove("active")
} }
let countCell = document.getElementById("count-" + watchIndex)
countCell.textContent = countForWatch(watches[watchIndex]) + " Wortmeldungen"
} }
function refreshClosedTopics() { function refreshClosedTopics() {
@ -135,19 +153,19 @@ function refreshClosedTopics() {
let time0 = elt("div") let time0 = elt("div")
time0.textContent = timeToISO(sumForWatch(topic.watches[0])) + " (" + calcPercForWatch(0, topic) + "%)" time0.textContent = timeToISO(sumForWatch(topic.watches[0])) + " (" + calcPercForWatch(0, topic) + "%)"
let count0 = elt("div") let count0 = elt("div")
count0.textContent = ((topic.watches[0]["actions"].length) / 2) + " Wortmeldungen" count0.textContent = countForWatch(topic.watches[0]) + " Wortmeldungen (" + calcPercCountForWatch(0, topic) + "%)"
let time0Column = elt("td", {}, time0, count0) let time0Column = elt("td", {}, time0, count0)
let time1 = elt("div") let time1 = elt("div")
time1.textContent = timeToISO(sumForWatch(topic.watches[1])) + " (" + calcPercForWatch(1, topic) + "%)" time1.textContent = timeToISO(sumForWatch(topic.watches[1])) + " (" + calcPercForWatch(1, topic) + "%)"
let count1 = elt("div") let count1 = elt("div")
count1.textContent = ((topic.watches[1]["actions"].length) / 2) + " Wortmeldungen" count1.textContent = ((topic.watches[1]["actions"].length) / 2) + " Wortmeldungen (" + calcPercCountForWatch(1, topic) + "%)"
let time1Column = elt("td", {}, time1, count1) let time1Column = elt("td", {}, time1, count1)
let time2 = elt("div") let time2 = elt("div")
time2.textContent = timeToISO(sumForWatch(topic.watches[2])) + " (" + calcPercForWatch(2, topic) + "%)" time2.textContent = timeToISO(sumForWatch(topic.watches[2])) + " (" + calcPercForWatch(2, topic) + "%)"
let count2 = elt("div") let count2 = elt("div")
count2.textContent = ((topic.watches[2]["actions"].length) / 2) + " Wortmeldungen" count2.textContent = ((topic.watches[2]["actions"].length) / 2) + " Wortmeldungen (" + calcPercCountForWatch(2, topic) + "%)"
let time2Column = elt("td", {}, time2, count2) let time2Column = elt("td", {}, time2, count2)
let reopenButton = elt("button", {"onclick": "reopenTopic(" + i + ")"}) let reopenButton = elt("button", {"onclick": "reopenTopic(" + i + ")"})