Cookie pannel is there now.

+ theme toggle (light mode works the rest is "placeholder")
removed some debug stuff

---
TODO:
- rating (idk how mby a copy of commenting func; problem is "user"; you can upvote /downvote only once per IP / user or sth)
- menubar with firefox style
- more themes
- clean up stuff (comments / posts)
- search something
- use other database with like database things and not .json files mby mongodb lol

if * exept search + dbupgrade betterdb is done its getting public / to blog.derzombiiie.com/derzombiiie.com idk jet

---
its ~1:40AM
have a great night! (2myself)
\#fuck€DU/CSU
master
derzombiiie 2021-08-18 01:37:25 +02:00
parent 70b6ff34c4
commit 3fa37da7ee
4 changed files with 87 additions and 23 deletions

View File

@ -3,6 +3,15 @@ switchcb.ads = (s) => {
console.log("settings ads setting to "+s)
}
switchcb.the = (s) => {
switch ( s ) {
case "on":
themes.set($(".themeselect").val())
break
case "off":
setCookie("theme", "", 1)
break
}
console.log("themes "+s)
}
switchcb.oth = (s) => {
@ -13,7 +22,7 @@ toggler = new class {
constructor() {
}
toggle( jtag, s ) {
toggle( jtag, s, cb ) {
if ( !s ) {
s = $(jtag).attr("state")
if ( s == "on") {
@ -25,27 +34,42 @@ toggler = new class {
}
}
let je = $(jtag).attr("state", s)
let je = $(jtag)
je.attr("state", s)
let classes = je.attr("class").split(" ")
switch ( s ) {
case "noff":
classes.splice(2,2)
classes.splice(2,-1)
classes[2] = "noff"
break
case "on":
classes.splice(2,2)
classes.splice(2,-1)
classes[2] = "on"
break
case "off":
classes.splice(2,2)
classes.splice(2,-1)
classes[2] = "off"
break
}
je.attr("class", classes.join(" "))
switchcb[je.attr("cb")](s)
if ( !cb ) eval(`s="${s}";`+je.attr("cb"))
return s
}
}
// readout theme and create selector
$(document).ready(() => {
let c = getCookie("theme")
if ( !c )
toggler.toggle(".cookie.setting.theme", "noff", true)
else
toggler.toggle(".cookie.setting.theme", "on", true)
$(".cookiesetting.theme").append(`<select class="themeselect" onchange='toggler.toggle(".cookie.setting.theme", "on")'>
<option value="light" ${c == "light" ? "selected": ""}>Light-mode</option>
<option value="dark" ${c == "dark" ? "selected" : ""}>Dark-mode</option>
<option value="" ${c != "light" && c != "dark" && c != "" ? "selected" : ""}>-mode</option>
</select>`)
})

View File

@ -1,21 +1,50 @@
class themes {
function setCookie(cname, cvalue, exdays) {
if ( !exdays ) {
exdays = 10**20
}
const d = new Date();
d.setTime(d.getTime() + (exdays*24*60*60*1000));
let expires = "expires="+ d.toUTCString();
document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
}
function getCookie(cname) {
let name = cname + "=";
let decodedCookie = decodeURIComponent(document.cookie);
let ca = decodedCookie.split(';');
for(let i = 0; i <ca.length; i++) {
let c = ca[i];
while (c.charAt(0) == ' ') {
c = c.substring(1);
}
if (c.indexOf(name) == 0) {
return c.substring(name.length, c.length);
}
}
return "";
}
themes = new class {
constructor( theme ) {
if ( theme ) return this.loadstyle(theme)
fetch("/usermeta?theme").then( d => d.json()).then( d => {
if ( d.type == "s" )
this.loadstyle( d.style )
else
console.error("Couldnt read user style")
})
this.theme = getCookie("theme")
if( !this.theme ) {
this.theme = "light"
}
this.loadstyle(this.theme)
}
loadstyle( style ) {
this.theme = style
$.get( "/static/style/" + style + ".css" , css => {
$('<style type="text/css"></style>')
.html(css).appendTo("head")
})
}
}
// static until cookie model implemented / user / idk preferences
new themes("light")
set( style ) {
setCookie( "theme", style )
location = location
}
}

View File

@ -30,13 +30,13 @@
Here you can change your cookie settings:<br>
<br>
<div class="cookiesetting">
Other: <div class="cookie setting off" cb="switchcb.oth()" state="noff" d="on" onclick="toggler.toggle(this)"><div class="switcher"></div></div>(does nothing)<br>
</div>
<!--<div class="cookiesetting">
Ads: <div class="cookie setting noff" cb="ads" state="noff" d="on" onclick="toggler.toggle(this)"><div class="switcher"></div></div><br>
</div>
<div class="cookiesetting">
Themes: <div class="cookie setting on" cb="the" state="noff" d="on" onclick="toggler.toggle(this)"><div class="switcher"></div></div><br>
</div>
<div class="cookiesetting">
Other: <div class="cookie setting off" cb="oth" state="noff" d="off" onclick="toggler.toggle(this)"><div class="switcher"></div></div><br>
</div>-->
<div class="cookiesetting theme select">
Themes: <div class="cookie setting off theme" cb="switchcb.the(s)" state="off" d="off" onclick="toggler.toggle(this)"><div class="switcher"></div></div><br>
</div>
</div>
</div>

View File

@ -164,3 +164,14 @@
.footer > a.text {
font-size: 0.7em;
}
/* cookie settings */
.cookiesetting > * {
margin-right: 0px;
margin-left: 0.5em;
}
.cookiesetting {
display: flex;
justify-content: left;
}