Toggle bump buttona via JS

This commit is contained in:
2021-05-02 10:33:14 +02:00
parent 766fd30842
commit 8066862c8a
7 changed files with 26 additions and 14 deletions

6
Cargo.lock generated
View File

@ -2166,7 +2166,7 @@ checksum = "213701ba3370744dcd1a12960caa4843b3d68b4d1c0a5d575e0d65b2ee9d16c0"
[[package]]
name = "stl"
version = "2.6.0"
version = "2.6.1"
dependencies = [
"bincode",
"chrono",
@ -2190,7 +2190,7 @@ dependencies = [
[[package]]
name = "stl_cli"
version = "2.6.0"
version = "2.6.1"
dependencies = [
"chrono",
"futures",
@ -2209,7 +2209,7 @@ dependencies = [
[[package]]
name = "stl_lib"
version = "2.6.0"
version = "2.6.1"
dependencies = [
"chrono",
"serde",

View File

@ -1,6 +1,6 @@
[package]
name = "stl_cli"
version = "2.6.0"
version = "2.6.1"
authors = ["Joakim Hulthe <joakim@hulthe.net>"]
license = "MPL-2.0"
edition = "2018"

View File

@ -1,6 +1,6 @@
[package]
name = "stl_lib"
version = "2.6.0"
version = "2.6.1"
authors = ["Joakim Hulthe <joakim@hulthe.net>"]
license = "MPL-2.0"
edition = "2018"

View File

@ -1,7 +1,7 @@
[package]
name = "stl"
description = "studielogg aka scuffed toggl"
version = "2.6.0"
version = "2.6.1"
authors = ["Joakim Hulthe <joakim@hulthe.net>"]
license = "MPL-2.0"
edition = "2018"

View File

@ -231,3 +231,6 @@ ul.striped_list > li:nth-child(odd) ul li:nth-child(odd) { background-color:#30
opacity: 1;
}
.display_none {
display: none;
}

View File

@ -5,16 +5,19 @@
></div>
<span class="category_name">{{this.category.name}}</span>
<div class="category_button_container">
{{#if this.category.started}}
<form
action="/category/{{@key}}/bump_session/minutes/5"
id="bump-form-{{@key}}"
method="post"></form>
<button
{{#if this.category.started}}
class="category_bump_button"
{{else}}
class="category_bump_button display_none"
{{/if}}
id="bump-button-{{@key}}"
form="bump-form-{{@key}}"
type="submit">+5m</button>
{{/if}}
<!-- without this extra tag, every even noscript tag seems to not trigger -->
<!-- what is even happening help -->
<noscript></noscript>

View File

@ -14,17 +14,21 @@
function toggle_category(id) {
// Find out whether the button is in active (play) or inactive (paused) state
let toggled_class = "category_button_toggled";
let cl = document.getElementById("toggle-button-" + id).classList;
let active = cl.contains(toggled_class);
let display_none_class = "display_none";
let toggle_cl = document.getElementById("toggle-button-" + id).classList;
let bump_cl = document.getElementById("bump-button-" + id).classList;
let active = toggle_cl.contains(toggled_class);
// Get the corresponding route to activate/inactivate the category
let url;
if(active) {
url = "/api/category/" + id + "/end_session";
cl.remove(toggled_class);
toggle_cl.remove(toggled_class);
bump_cl.add(display_none_class);
} else {
url = "/api/category/" + id + "/start_session";
cl.add(toggled_class);
toggle_cl.add(toggled_class);
bump_cl.remove(display_none_class);
}
//var params = "lorem=ipsum&name=alpha";
@ -36,9 +40,11 @@
xhr.onreadystatechange = function() {
if(xhr.readyState === XMLHttpRequest.DONE) {
console.log(xhr.status, xhr.responseText);
if(xhr.status != 200) {
console.error("xhr error", xhr.status, xhr.responseText);
document.location.reload(false /* don't reset scroll position */);
}
}
};
xhr.send();