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
fa1080db95
maloja/website/start.html

243 lines
8.8 KiB
HTML
Raw Normal View History

Rudimentary start page
2019-02-02 18:54:01 +03:00
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Maloja</title>
<link rel="stylesheet" href="maloja.css" />
Added different pulses on start page
2019-03-03 15:38:53 +03:00
<script>
function showPulse(unit) {
modules = document.getElementsByClassName("stat_module_pulse")
for (var i=0;i<modules.length;i++) {
modules[i].setAttribute("style","display:none;")
}
document.getElementById("pulse_" + unit).setAttribute("style","")
selectors = document.getElementsByClassName("stat_selector_pulse")
for (var i=0;i<selectors.length;i++) {
selectors[i].setAttribute("style","")
}
document.getElementById("selector_pulse_" + unit).setAttribute("style","opacity:0.5;")
}
Modularized tile charts on start page and added options for different ranges
2019-03-03 23:22:42 +03:00
function showTopartists(unit) {
modules = document.getElementsByClassName("stat_module_topartists")
for (var i=0;i<modules.length;i++) {
modules[i].setAttribute("style","display:none;")
}
document.getElementById("topartists_" + unit).setAttribute("style","")
selectors = document.getElementsByClassName("stat_selector_topartists")
for (var i=0;i<selectors.length;i++) {
selectors[i].setAttribute("style","")
}
document.getElementById("selector_topartists_" + unit).setAttribute("style","opacity:0.5;")
}
function showToptracks(unit) {
modules = document.getElementsByClassName("stat_module_toptracks")
for (var i=0;i<modules.length;i++) {
modules[i].setAttribute("style","display:none;")
}
document.getElementById("toptracks_" + unit).setAttribute("style","")
selectors = document.getElementsByClassName("stat_selector_toptracks")
for (var i=0;i<selectors.length;i++) {
selectors[i].setAttribute("style","")
}
document.getElementById("selector_toptracks_" + unit).setAttribute("style","opacity:0.5;")
}
Implemented search function
2019-03-06 19:50:36 +03:00
function search(searchfield) {
txt = searchfield.value;
Some improvements for search function
2019-03-06 21:35:35 +03:00
if (txt == "") {
reallyclear()
}
else {
xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = searchresult
Further optimization to search
2019-03-07 01:18:11 +03:00
xhttp.open("GET","/db/search?max=5&query=" + txt, true);
Some improvements for search function
2019-03-06 21:35:35 +03:00
xhttp.send();
}
Implemented search function
2019-03-06 19:50:36 +03:00
}
function searchresult() {
Some improvements for search function
2019-03-06 21:35:35 +03:00
if (this.readyState == 4 && this.status == 200 && document.getElementById("searchinput").value != "") {
// checking if field is empty in case we get an old result coming in that would overwrite our cleared result window
Implemented search function
2019-03-06 19:50:36 +03:00
result = JSON.parse(this.responseText);
artists = result["artists"].slice(0,5)
tracks = result["tracks"].slice(0,5)
html = `<div class="searchresults">
<span>Artists</span>
<table class="searchresults_artists">`
for (var i=0;i<artists.length;i++) {
name = artists[i];
uristr = "artist=" + encodeURIComponent(name);
uristr = uristr.replace("'","\\'");
image = "/image?" + uristr;
link = "/artist?" + uristr;
html += `<tr onclick="goto('` + link + `')">
<td class="image" style="background-image:url('` + image + `');"></td>
<td>
<span>` + name + `</span><br/>
</td>
</tr>`
}
html += `</table>
<br/><br/>
<span>Tracks</span>
<table class="searchresults_tracks">`
for (var i=0;i<tracks.length;i++) {
artists = tracks[i]["artists"].join(", ");
title = tracks[i]["title"];
uristr = "title=" + encodeURIComponent(title) + "&" + tracks[i]["artists"].map(x => "artist=" + encodeURIComponent(x)).join("&");
uristr = uristr.replace("'","\\'");
image = "/image?" + uristr;
link = "/track?" + uristr;
html += `<tr onclick="goto('` + link + `')">
<td class="image" style="background-image:url('` + image + `');"></td>
<td>
<span>` + artists + `</span><br/>
<span>` + title + `</span>
</td>
</tr>`
}
html += `</table>
</div>`
document.getElementById("resultwrap").innerHTML = html;
}
}
function clearresults() {
Fixed image redirect issue
2019-03-06 20:04:12 +03:00
window.setTimeout(reallyclear,500)
}
function reallyclear() {
Implemented search function
2019-03-06 19:50:36 +03:00
document.getElementById("resultwrap").innerHTML = "";
}
function goto(link) {
window.location = link
}
Added different pulses on start page
2019-03-03 15:38:53 +03:00
</script>
Rudimentary start page
2019-02-02 18:54:01 +03:00
</head>
Added different pulses on start page
2019-03-03 15:38:53 +03:00
Rudimentary start page
2019-02-02 18:54:01 +03:00
<body>
Implemented search function
2019-03-06 19:50:36 +03:00
<!--<div class="header"><h1>Maloja</h1>
</div>-->
Significant rework of the architecture * URL keys and internal keys are now being separated more cleanly * HTML generation is split up into submodules that can be used by serveral websites * HTML generation now talks directly to the database in most cases instead of calling the database server for json data
2019-02-20 20:22:45 +03:00
<h1><a href="/topartists?max=50">Top Artists</a></h1>
Modularized tile charts on start page and added options for different ranges
2019-03-03 23:22:42 +03:00
<!--All Time | This Year | This Month | This Week-->
Expanded start page
2019-02-02 20:08:30 +03:00
Modularized tile charts on start page and added options for different ranges
2019-03-03 23:22:42 +03:00
<span onclick="showTopartists('week')" class="stat_selector_topartists" id="selector_topartists_week">This Week</span>
| <span onclick="showTopartists('month')" class="stat_selector_topartists" id="selector_topartists_month">This Month</span>
| <span onclick="showTopartists('year')" class="stat_selector_topartists" id="selector_topartists_year">This Year</span>
| <span onclick="showTopartists('alltime')" class="stat_selector_topartists" id="selector_topartists_alltime" style="opacity:0.5;">All Time</span>
<br/><br/>
<span class="stat_module_topartists" id="topartists_week" style="display:none;">KEY_TOPARTISTS_WEEK</span>
<span class="stat_module_topartists" id="topartists_month" style="display:none;">KEY_TOPARTISTS_MONTH</span>
<span class="stat_module_topartists" id="topartists_year" style="display:none;">KEY_TOPARTISTS_YEAR</span>
<span class="stat_module_topartists" id="topartists_alltime">KEY_TOPARTISTS_TOTAL</span>
Expanded start page
2019-02-02 20:08:30 +03:00
Significant rework of the architecture * URL keys and internal keys are now being separated more cleanly * HTML generation is split up into submodules that can be used by serveral websites * HTML generation now talks directly to the database in most cases instead of calling the database server for json data
2019-02-20 20:22:45 +03:00
<h1><a href="/toptracks?max=50">Top Tracks</a></h1>
Rudimentary start page
2019-02-02 18:54:01 +03:00
Fancy af start page
2019-02-03 18:52:37 +03:00
Modularized tile charts on start page and added options for different ranges
2019-03-03 23:22:42 +03:00
<span onclick="showToptracks('week')" class="stat_selector_toptracks" id="selector_toptracks_week">This Week</span>
| <span onclick="showToptracks('month')" class="stat_selector_toptracks" id="selector_toptracks_month">This Month</span>
| <span onclick="showToptracks('year')" class="stat_selector_toptracks" id="selector_toptracks_year">This Year</span>
| <span onclick="showToptracks('alltime')" class="stat_selector_toptracks" id="selector_toptracks_alltime" style="opacity:0.5;">All Time</span>
<br/><br/>
<span class="stat_module_toptracks" id="toptracks_week" style="display:none;">KEY_TOPTRACKS_WEEK</span>
<span class="stat_module_toptracks" id="toptracks_month" style="display:none;">KEY_TOPTRACKS_MONTH</span>
<span class="stat_module_toptracks" id="toptracks_year" style="display:none;">KEY_TOPTRACKS_YEAR</span>
<span class="stat_module_toptracks" id="toptracks_alltime">KEY_TOPTRACKS_TOTAL</span>
Fancy af start page
2019-02-03 18:52:37 +03:00
<div class="sidelist">
<h1><a href="/scrobbles?max=100">Last Scrobbles</a></h1>
Design changes
2019-02-03 19:36:21 +03:00
<span class="stats">Today</span> KEY_SCROBBLES_TODAY
<span class="stats">This month</span> KEY_SCROBBLES_MONTH
<span class="stats">This year</span> KEY_SCROBBLES_YEAR
<span class="stats">All Time</span> KEY_SCROBBLES_TOTAL
<br/><br/>
Significant rework of the architecture * URL keys and internal keys are now being separated more cleanly * HTML generation is split up into submodules that can be used by serveral websites * HTML generation now talks directly to the database in most cases instead of calling the database server for json data
2019-02-20 20:22:45 +03:00
Added different pulses on start page
2019-03-03 15:38:53 +03:00
<span class="stat_module">KEY_SCROBBLES</span>
Significant rework of the architecture * URL keys and internal keys are now being separated more cleanly * HTML generation is split up into submodules that can be used by serveral websites * HTML generation now talks directly to the database in most cases instead of calling the database server for json data
2019-02-20 20:22:45 +03:00
Added pulse on main page
2019-02-18 19:22:44 +03:00
<br/>
Added pulse on artist and track pages
2019-02-20 01:18:46 +03:00
<h1><a href="/pulse?step=month&trail=1">Pulse</a></h1>
<!--
<a href="/pulse?step=day&trail=1">Days</a>
<a href="/pulse?step=week&trail=1">Weeks</a>
<a href="/pulse?step=month&trail=1">Months</a>
<a href="/pulse?step=year&trail=1">Years</a>
-->
Significant rework of the architecture * URL keys and internal keys are now being separated more cleanly * HTML generation is split up into submodules that can be used by serveral websites * HTML generation now talks directly to the database in most cases instead of calling the database server for json data
2019-02-20 20:22:45 +03:00
Added different pulses on start page
2019-03-03 15:38:53 +03:00
<span onclick="showPulse('days')" class="stat_selector_pulse" id="selector_pulse_days">7 days</span>
| <span onclick="showPulse('weeks')" class="stat_selector_pulse" id="selector_pulse_weeks">12 weeks</span>
| <span onclick="showPulse('months')" class="stat_selector_pulse" id="selector_pulse_months" style="opacity:0.5;">12 months</span>
| <span onclick="showPulse('years')" class="stat_selector_pulse" id="selector_pulse_years">10 years</span>
<br/><br/>
Significant rework of the architecture * URL keys and internal keys are now being separated more cleanly * HTML generation is split up into submodules that can be used by serveral websites * HTML generation now talks directly to the database in most cases instead of calling the database server for json data
2019-02-20 20:22:45 +03:00
Added different pulses on start page
2019-03-03 15:38:53 +03:00
<span class="stat_module_pulse" id="pulse_months">KEY_PULSE_MONTHS</span>
<span class="stat_module_pulse" id="pulse_days" style="display:none;">KEY_PULSE_DAYS</span>
<span class="stat_module_pulse" id="pulse_years" style="display:none;">KEY_PULSE_YEARS</span>
<span class="stat_module_pulse" id="pulse_weeks" style="display:none;">KEY_PULSE_WEEKS</span>
Fancy af start page
2019-02-03 18:52:37 +03:00
</div>
Some brushing up
2019-02-17 18:27:55 +03:00
<div class="footer">
Implemented search function
2019-03-06 19:50:36 +03:00
<div>
<span>Get your own Maloja scrobble server on <a target="_blank" rel="noopener noreferrer" href="https://github.com/krateng/maloja">GitHub</a></span>
</div>
<div>
<a href="/"><span style="font-weight:bold;">Maloja</span></a>
</div>
<div>
Some improvements for search function
2019-03-06 21:35:35 +03:00
<span><input id="searchinput" placeholder="Search for an artist or track..." oninput="search(this)" onblur="clearresults()" /></span>
Implemented search function
2019-03-06 19:50:36 +03:00
</div>
Some improvements for search function
2019-03-06 21:35:35 +03:00
<span id="resultwrap"></span>
Some brushing up
2019-02-17 18:27:55 +03:00
</div>
Implemented search function
2019-03-06 19:50:36 +03:00
Some improvements for search function
2019-03-06 21:35:35 +03:00
Implemented search function
2019-03-06 19:50:36 +03:00
Fancy af start page
2019-02-03 18:52:37 +03:00
Rudimentary start page
2019-02-02 18:54:01 +03:00
</body>
Added different pulses on start page
2019-03-03 15:38:53 +03:00
Rudimentary start page
2019-02-02 18:54:01 +03:00
</html>
Reference in New Issue Copy Permalink