mirror/maloja
1
0
Fork 0
mirror of https://github.com/krateng/maloja.git synced 2023-08-10 21:12:55 +03:00
Code Issues Projects Releases Wiki Activity

Range selections are now saved in cookies

Browse Source
This commit is contained in:
Krateng 2019-06-17 12:18:19 +02:00
parent 649075286c
commit e6aa0a25c8
7 changed files with 96 additions and 42 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
website/artist.html
View File

@ -4,7 +4,8 @@
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<title>Maloja - KEY_ARTISTNAME</title> <title>Maloja - KEY_ARTISTNAME</title>
<script src="javascript/rangeselect.js" async></script> <script src="javascript/cookies.js"></script>
<script src="javascript/rangeselect.js"></script>
</head> </head>
<body> <body>
@ -35,10 +36,10 @@
<h2><a href='/pulse?artist=KEY_ENC_ARTISTNAME&step=year&trail=1'>Pulse</a></h2> <h2><a href='/pulse?artist=KEY_ENC_ARTISTNAME&step=year&trail=1'>Pulse</a></h2>
<span onclick="showRange('pulse','days')" class="stat_selector_pulse selector_pulse_days">7 days</span> <span onclick="showRangeManual('pulse','days')" class="stat_selector_pulse selector_pulse_days">7 days</span>
| <span onclick="showRange('pulse','weeks')" class="stat_selector_pulse selector_pulse_weeks">12 weeks</span> | <span onclick="showRangeManual('pulse','weeks')" class="stat_selector_pulse selector_pulse_weeks">12 weeks</span>
| <span onclick="showRange('pulse','months')" class="stat_selector_pulse selector_pulse_months" style="opacity:0.5;">12 months</span> | <span onclick="showRangeManual('pulse','months')" class="stat_selector_pulse selector_pulse_months" style="opacity:0.5;">12 months</span>
| <span onclick="showRange('pulse','years')" class="stat_selector_pulse selector_pulse_years">10 years</span> | <span onclick="showRangeManual('pulse','years')" class="stat_selector_pulse selector_pulse_years">10 years</span>
<br/><br/> <br/><br/>
@ -50,10 +51,10 @@
<td> <td>
<!-- We use the same classes / function calls here because we want it to switch together with pulse --> <!-- We use the same classes / function calls here because we want it to switch together with pulse -->
<h2><a href='/performance?artist=KEY_ENC_CREDITEDARTISTNAME&step=year&trail=1'>Performance</a></h2> <h2><a href='/performance?artist=KEY_ENC_CREDITEDARTISTNAME&step=year&trail=1'>Performance</a></h2>
<span onclick="showRange('pulse','days')" class="stat_selector_pulse selector_pulse_days">7 days</span> <span onclick="showRangeManual('pulse','days')" class="stat_selector_pulse selector_pulse_days">7 days</span>
| <span onclick="showRange('pulse','weeks')" class="stat_selector_pulse selector_pulse_weeks">12 weeks</span> | <span onclick="showRangeManual('pulse','weeks')" class="stat_selector_pulse selector_pulse_weeks">12 weeks</span>
| <span onclick="showRange('pulse','months')" class="stat_selector_pulse selector_pulse_months" style="opacity:0.5;">12 months</span> | <span onclick="showRangeManual('pulse','months')" class="stat_selector_pulse selector_pulse_months" style="opacity:0.5;">12 months</span>
| <span onclick="showRange('pulse','years')" class="stat_selector_pulse selector_pulse_years">10 years</span> | <span onclick="showRangeManual('pulse','years')" class="stat_selector_pulse selector_pulse_years">10 years</span>
<br/><br/> <br/><br/>

57
website/javascript/cookies.js
View File

@ -1,27 +1,57 @@
apikeycorrect = false; apikeycorrect = false;
function insertAPIKeyFromCookie() { var cookies = {};
cookies = decodeURIComponent(document.cookie).split(';');
for(var i = 0; i <cookies.length; i++) { function getCookies() {
cookies[i] = cookies[i].trim() cookiestrings = decodeURIComponent(document.cookie).split(';');
if (cookies[i].startsWith("apikey=")) { for(var i = 0; i <cookiestrings.length; i++) {
document.getElementById("apikey").value = cookies[i].replace("apikey=","") cookiestrings[i] = cookiestrings[i].trim();
checkAPIkey() [key,value] = cookiestrings[i].split("=");
} cookies[key] = value;
}
}
// always on document load, but call specifically when needed early
document.addEventListener("load",getCookies);
function setCookie(key,val) {
cookies[key] = val;
document.cookie = encodeURIComponent(key) + "=" + encodeURIComponent(val);
}
function saveCookies() {
for (var c in cookies) {
document.cookie = encodeURIComponent(c) + "=" + encodeURIComponent(cookies[c]);
} }
} }
/// RANGE SELECTORS
// in rangeselect.js
/// API KEY
function insertAPIKeyFromCookie() {
getCookies();
key = cookies["apikey"];
document.getElementById("apikey").value = key;
checkAPIkey()
}
function saveAPIkey() { function saveAPIkey() {
key = document.getElementById("apikey").value key = APIkey()
document.cookie = "apikey=" + encodeURIComponent(key) setCookie("apikey",key)
} }
function checkAPIkey() { function checkAPIkey() {
saveAPIkey()
url = "/api/test?key=" + document.getElementById("apikey").value url = "/api/test?key=" + APIkey()
var xhttp = new XMLHttpRequest(); var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() { xhttp.onreadystatechange = function() {
if (this.readyState == 4 && (this.status == 204 || this.status == 205)) { if (this.readyState == 4 && (this.status == 204 || this.status == 205)) {
@ -41,6 +71,9 @@ function checkAPIkey() {
document.getElementById("apikey").style.backgroundColor = "red" document.getElementById("apikey").style.backgroundColor = "red"
apikeycorrect = false apikeycorrect = false
} }
if (apikeycorrect) {
saveAPIkey();
}
} }
function APIkey() { function APIkey() {

17
website/javascript/rangeselect.js
View File

@ -25,4 +25,21 @@ function showRange(identifier,unit) {
for (var i=0;i<reactivate.length;i++) { for (var i=0;i<reactivate.length;i++) {
reactivate[i].setAttribute("style","opacity:0.5;") reactivate[i].setAttribute("style","opacity:0.5;")
} }
} }
function showRangeManual(identifier,unit) {
showRange(identifier,unit);
setCookie("rangeselect_" + identifier,unit);
}
document.addEventListener('DOMContentLoaded',function() {
getCookies();
for (c in cookies) {
if (c.startsWith("rangeselect_")) {
showRange(c.slice(12),cookies[c]);
}
}
})

BIN
website/media/record_gold.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 58 KiB

After

Width:  |  Height:  |  Size: 55 KiB

BIN
website/media/record_gold_original.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 58 KiB

26
website/start.html
View File

@ -4,10 +4,12 @@
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<title>Maloja</title> <title>Maloja</title>
<script src="javascript/rangeselect.js"></script>
<script>document.addEventListener('DOMContentLoaded',function() { <script>document.addEventListener('DOMContentLoaded',function() {
KEY_JS_INIT_RANGES KEY_JS_INIT_RANGES
})</script> })</script>
<script src="javascript/cookies.js"></script>
<script src="javascript/rangeselect.js"></script>
</head> </head>
@ -23,10 +25,10 @@
<span onclick="showRange('topartists','week')" class="stat_selector_topartists selector_topartists_week">This Week</span> <span onclick="showRangeManual('topartists','week')" class="stat_selector_topartists selector_topartists_week">This Week</span>
| <span onclick="showRange('topartists','month')" class="stat_selector_topartists selector_topartists_month">This Month</span> | <span onclick="showRangeManual('topartists','month')" class="stat_selector_topartists selector_topartists_month">This Month</span>
| <span onclick="showRange('topartists','year')" class="stat_selector_topartists selector_topartists_year">This Year</span> | <span onclick="showRangeManual('topartists','year')" class="stat_selector_topartists selector_topartists_year">This Year</span>
| <span onclick="showRange('topartists','alltime')" class="stat_selector_topartists selector_topartists_alltime" style="opacity:0.5;">All Time</span> | <span onclick="showRangeManual('topartists','alltime')" class="stat_selector_topartists selector_topartists_alltime" style="opacity:0.5;">All Time</span>
<br/><br/> <br/><br/>
@ -42,9 +44,9 @@
<span onclick="showRange('toptracks','week')" class="stat_selector_toptracks selector_toptracks_week">This Week</span> <span onclick="showRange('toptracks','week')" class="stat_selector_toptracks selector_toptracks_week">This Week</span>
| <span onclick="showRange('toptracks','month')" class="stat_selector_toptracks selector_toptracks_month">This Month</span> | <span onclick="showRangeManual('toptracks','month')" class="stat_selector_toptracks selector_toptracks_month">This Month</span>
| <span onclick="showRange('toptracks','year')" class="stat_selector_toptracks selector_toptracks_year">This Year</span> | <span onclick="showRangeManual('toptracks','year')" class="stat_selector_toptracks selector_toptracks_year">This Year</span>
| <span onclick="showRange('toptracks','alltime')" class="stat_selector_toptracks selector_toptracks_alltime" style="opacity:0.5;">All Time</span> | <span onclick="showRangeManual('toptracks','alltime')" class="stat_selector_toptracks selector_toptracks_alltime" style="opacity:0.5;">All Time</span>
<br/><br/> <br/><br/>
@ -81,10 +83,10 @@
<a href="/pulse?step=year&trail=1">Years</a> <a href="/pulse?step=year&trail=1">Years</a>
--> -->
<span onclick="showRange('pulse','days')" class="stat_selector_pulse selector_pulse_days">7 days</span> <span onclick="showRangeManual('pulse','days')" class="stat_selector_pulse selector_pulse_days">7 days</span>
| <span onclick="showRange('pulse','weeks')" class="stat_selector_pulse selector_pulse_weeks">12 weeks</span> | <span onclick="showRangeManual('pulse','weeks')" class="stat_selector_pulse selector_pulse_weeks">12 weeks</span>
| <span onclick="showRange('pulse','months')" class="stat_selector_pulse selector_pulse_months" style="opacity:0.5;">12 months</span> | <span onclick="showRangeManual('pulse','months')" class="stat_selector_pulse selector_pulse_months" style="opacity:0.5;">12 months</span>
| <span onclick="showRange('pulse','years')" class="stat_selector_pulse selector_pulse_years">10 years</span> | <span onclick="showRangeManual('pulse','years')" class="stat_selector_pulse selector_pulse_years">10 years</span>
<!-- <!--
### this is for extra views of the current canonical week / month / year ### this is for extra views of the current canonical week / month / year
<br/> <br/>

19
website/track.html
View File

@ -4,7 +4,8 @@
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<title>Maloja - KEY_TRACKTITLE</title> <title>Maloja - KEY_TRACKTITLE</title>
<script src="javascript/rangeselect.js" async></script> <script src="javascript/cookies.js" ></script>
<script src="javascript/rangeselect.js"></script>
</head> </head>
<body> <body>
@ -30,10 +31,10 @@
<tr> <tr>
<td> <td>
<h2><a href='/pulse?KEY_SCROBBLELINK&step=year&trail=1'>Pulse</a></h2> <h2><a href='/pulse?KEY_SCROBBLELINK&step=year&trail=1'>Pulse</a></h2>
<span onclick="showRange('pulse','days')" class="stat_selector_pulse selector_pulse_days">7 days</span> <span onclick="showRangeManual('pulse','days')" class="stat_selector_pulse selector_pulse_days">7 days</span>
| <span onclick="showRange('pulse','weeks')" class="stat_selector_pulse selector_pulse_weeks">12 weeks</span> | <span onclick="showRangeManual('pulse','weeks')" class="stat_selector_pulse selector_pulse_weeks">12 weeks</span>
| <span onclick="showRange('pulse','months')" class="stat_selector_pulse selector_pulse_months" style="opacity:0.5;">12 months</span> | <span onclick="showRangeManual('pulse','months')" class="stat_selector_pulse selector_pulse_months" style="opacity:0.5;">12 months</span>
| <span onclick="showRange('pulse','years')" class="stat_selector_pulse selector_pulse_years">10 years</span> | <span onclick="showRangeManual('pulse','years')" class="stat_selector_pulse selector_pulse_years">10 years</span>
<br/><br/> <br/><br/>
@ -44,10 +45,10 @@
</td> </td>
<td> <td>
<h2><a href='/performance?KEY_SCROBBLELINK&step=year&trail=1'>Performance</a></h2> <h2><a href='/performance?KEY_SCROBBLELINK&step=year&trail=1'>Performance</a></h2>
<span onclick="showRange('pulse','days')" class="stat_selector_pulse selector_pulse_days">7 days</span> <span onclick="showRangeManual('pulse','days')" class="stat_selector_pulse selector_pulse_days">7 days</span>
| <span onclick="showRange('pulse','weeks')" class="stat_selector_pulse selector_pulse_weeks">12 weeks</span> | <span onclick="showRangeManual('pulse','weeks')" class="stat_selector_pulse selector_pulse_weeks">12 weeks</span>
| <span onclick="showRange('pulse','months')" class="stat_selector_pulse selector_pulse_months" style="opacity:0.5;">12 months</span> | <span onclick="showRangeManual('pulse','months')" class="stat_selector_pulse selector_pulse_months" style="opacity:0.5;">12 months</span>
| <span onclick="showRange('pulse','years')" class="stat_selector_pulse selector_pulse_years">10 years</span> | <span onclick="showRangeManual('pulse','years')" class="stat_selector_pulse selector_pulse_years">10 years</span>
<br/><br/> <br/><br/>