mirror of
https://github.com/krateng/maloja.git
synced 2025-04-16 16:52:18 +03:00
Experimental start page redesign
This commit is contained in:
krateng
parent
75c0ab385b
commit
6ff7aa2ee0
@ -189,8 +189,7 @@ malojaconfig = Configuration(
|
||||
"parse_remix_artists":(tp.Boolean(), "Parse Remix Artists", False)
|
||||
},
|
||||
"Web Interface":{
|
||||
"default_range_charts_artists":(tp.Choice({'alltime':'All Time','year':'Year','month':"Month",'week':'Week'}), "Default Range Artist Charts", "year"),
|
||||
"default_range_charts_tracks":(tp.Choice({'alltime':'All Time','year':'Year','month':"Month",'week':'Week'}), "Default Range Track Charts", "year"),
|
||||
"default_range_startpage":(tp.Choice({'alltime':'All Time','year':'Year','month':"Month",'week':'Week'}), "Default Range for Startpage Stats", "year"),
|
||||
"default_step_pulse":(tp.Choice({'year':'Year','month':"Month",'week':'Week','day':'Day'}), "Default Pulse Step", "month"),
|
||||
"charts_display_tiles":(tp.Boolean(), "Display Chart Tiles", False),
|
||||
"album_showcase":(tp.Boolean(), "Display Album Showcase", True, "Display a graphical album showcase for artist overview pages instead of a chart list"),
|
||||
|
||||
45
maloja/web/jinja/partials/info_album.jinja
Normal file
45
maloja/web/jinja/partials/info_album.jinja
Normal file
@ -0,0 +1,45 @@
|
||||
{% import 'snippets/links.jinja' as links %}
|
||||
{% import 'partials/awards_album.jinja' as awards %}
|
||||
|
||||
{% set album = filterkeys.album %}
|
||||
{% set info = dbc.album_info({'album':album}) %}
|
||||
|
||||
{% set encodedalbum = mlj_uri.uriencode({'album':album}) %}
|
||||
|
||||
|
||||
<table class="top_info">
|
||||
<tr>
|
||||
<td class="image">
|
||||
{% if adminmode %}
|
||||
<div
|
||||
class="changeable-image" data-uploader="b64=>upload('{{ encodedalbum }}',b64)"
|
||||
style="background-image:url('{{ images.get_album_image(album) }}');"
|
||||
title="Drag & Drop to upload new image"
|
||||
></div>
|
||||
{% else %}
|
||||
<div style="background-image:url('{{ images.get_album_image(album) }}');">
|
||||
</div>
|
||||
{% endif %}
|
||||
</td>
|
||||
<td class="text">
|
||||
<span>{{ links.links(album.artists) }}</span><br/>
|
||||
<h1 id="main_entity_name" class="headerwithextra">{{ info.album.albumtitle | e }}</h1>
|
||||
{# awards.certs(album) #}
|
||||
<span class="rank"><a href="/charts_albums?max=100">#{{ info.position }}</a></span>
|
||||
<br/>
|
||||
|
||||
<p class="stats">
|
||||
<a href="{{ mlj_uri.create_uri("/scrobbles",filterkeys) }}">{{ info['scrobbles'] }} Scrobbles</a>
|
||||
</p>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
{{ awards.medals(info) }}
|
||||
{{ awards.topweeks(info) }}
|
||||
|
||||
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
59
maloja/web/jinja/partials/info_artist.jinja
Normal file
59
maloja/web/jinja/partials/info_artist.jinja
Normal file
@ -0,0 +1,59 @@
|
||||
{% import 'snippets/links.jinja' as links %}
|
||||
{% import 'partials/awards_artist.jinja' as awards %}
|
||||
|
||||
|
||||
{% set artist = filterkeys.artist %}
|
||||
{% set info = db.artist_info(artist=artist) %}
|
||||
|
||||
{% set credited = info.get('replace') %}
|
||||
{% set included = info.get('associated') %}
|
||||
|
||||
{% if credited is not none %}
|
||||
{% set competes = false %}
|
||||
{% else %}
|
||||
{% set credited = artist %}
|
||||
{% set competes = true %}
|
||||
{% endif %}
|
||||
|
||||
|
||||
<table class="top_info">
|
||||
<tr>
|
||||
<td class="image">
|
||||
{% if adminmode %}
|
||||
<div
|
||||
class="changeable-image" data-uploader="b64=>upload('{{ encodedartist }}',b64)"
|
||||
style="background-image:url('{{ images.get_artist_image(artist) }}');"
|
||||
title="Drag & Drop to upload new image"
|
||||
></div>
|
||||
{% else %}
|
||||
<div style="background-image:url('{{ images.get_artist_image(artist) }}');">
|
||||
</div>
|
||||
{% endif %}
|
||||
</td>
|
||||
<td class="text">
|
||||
<h1 id="main_entity_name" class="headerwithextra">{{ info.artist | e }}</h1>
|
||||
{% if competes and info['scrobbles']>0 %}<span class="rank"><a href="/charts_artists?max=100">#{{ info.position }}</a></span>{% endif %}
|
||||
<br/>
|
||||
{% if competes and included %}
|
||||
<span>associated: {{ links.links(included) }}</span>
|
||||
{% elif not competes %}
|
||||
<span>Competing under {{ links.link(credited) }} (#{{ info.position }})</span>
|
||||
{% endif %}
|
||||
|
||||
<p class="stats">
|
||||
<a href="{{ mlj_uri.create_uri("/scrobbles",filterkeys) }}">{{ info['scrobbles'] }} Scrobbles</a>
|
||||
</p>
|
||||
|
||||
|
||||
|
||||
|
||||
{% if competes %}
|
||||
{{ awards.medals(info) }}
|
||||
{{ awards.topweeks(info) }}
|
||||
{% endif %}
|
||||
{{ awards.certs(artist) }}
|
||||
|
||||
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
48
maloja/web/jinja/partials/info_track.jinja
Normal file
48
maloja/web/jinja/partials/info_track.jinja
Normal file
@ -0,0 +1,48 @@
|
||||
{% import 'snippets/links.jinja' as links %}
|
||||
|
||||
{% set track = filterkeys.track %}
|
||||
{% set info = dbc.track_info({'track':track}) %}
|
||||
|
||||
{% import 'partials/awards_track.jinja' as awards %}
|
||||
|
||||
|
||||
<table class="top_info">
|
||||
<tr>
|
||||
<td class="image">
|
||||
{% if adminmode %}
|
||||
<div
|
||||
class="changeable-image" data-uploader="b64=>upload('{{ encodedtrack }}',b64)"
|
||||
style="background-image:url('{{ images.get_track_image(track) }}');"
|
||||
title="Drag & Drop to upload new image"
|
||||
></div>
|
||||
{% else %}
|
||||
<div style="background-image:url('{{ images.get_track_image(track) }}');">
|
||||
</div>
|
||||
{% endif %}
|
||||
</td>
|
||||
<td class="text">
|
||||
<span>{{ links.links(track.artists) }}</span><br/>
|
||||
<h1 id="main_entity_name" class="headerwithextra">{{ info.track.title | e }}</h1>
|
||||
{{ awards.certs(track) }}
|
||||
<span class="rank"><a href="/charts_tracks?max=100">#{{ info.position }}</a></span>
|
||||
<br/>
|
||||
{% if info.track.album %}
|
||||
from {{ links.link(info.track.album) }}<br/>
|
||||
{% endif %}
|
||||
|
||||
<p class="stats">
|
||||
{% if adminmode %}<button type="button" onclick="scrobble('{{ encodedtrack }}')">Scrobble now</button>{% endif %}
|
||||
<a href="{{ mlj_uri.create_uri("/scrobbles",filterkeys) }}">{{ info['scrobbles'] }} Scrobbles</a>
|
||||
</p>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
{{ awards.medals(info) }}
|
||||
{{ awards.topweeks(info) }}
|
||||
|
||||
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
@ -1,5 +1,5 @@
|
||||
{% macro link(entity) -%}
|
||||
{% if entity is mapping and 'title' in entity or 'albumtitle' in entity %}
|
||||
{% if entity is mapping and ('title' in entity or 'albumtitle' in entity) %}
|
||||
{% set name = entity.title or entity.albumtitle %}
|
||||
{% else %}
|
||||
{% set name = entity %}
|
||||
|
||||
@ -3,109 +3,44 @@
|
||||
|
||||
{% block scripts %}
|
||||
|
||||
<script>document.addEventListener('DOMContentLoaded',function() {
|
||||
showRange('topartists','{{ settings["DEFAULT_RANGE_CHARTS_ARTISTS"] }}');
|
||||
showRange('toptracks','{{ settings["DEFAULT_RANGE_CHARTS_TRACKS"] }}');
|
||||
showRange('pulse','{{ settings["DEFAULT_STEP_PULSE"] }}');
|
||||
})</script>
|
||||
<script src="/rangeselect.js"></script>
|
||||
<script src="/rangeselect.js"></script>
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded',function() {
|
||||
for (let type of ["topartists","toptracks","topalbums","pulse"]) {
|
||||
var val = localStorage.getItem("rangeselect_" + type);
|
||||
if (val != null) {
|
||||
showRange(type,val);
|
||||
}
|
||||
else {
|
||||
showRange(type,'{{ settings["DEFAULT_RANGE_STARTPAGE"] }}');
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<script src="/cookies.js"></script>
|
||||
<link rel="stylesheet" href="/static/css/startpage.css" />
|
||||
{% endblock %}
|
||||
|
||||
{% block content -%}
|
||||
|
||||
|
||||
<!-- ARTIST CHARTS -->
|
||||
<h1><a class="stat_link_topartists" href="/charts_artists?in=alltime">Top Artists</a></h1>
|
||||
|
||||
{% for r in xcurrent -%}
|
||||
<span onclick="showRangeManual('topartists','{{ r.identifier }}')" class="stat_selector_topartists selector_topartists_{{ r.identifier }}">
|
||||
{{ r.localisation }}
|
||||
</span>
|
||||
{{ "|" if not loop.last }}
|
||||
{%- endfor %}
|
||||
|
||||
<br/><br/>
|
||||
<div id="startpage">
|
||||
|
||||
|
||||
{% for r in xcurrent -%}
|
||||
<span class="stat_module_topartists topartists_{{ r.identifier }}" style="display:none;">
|
||||
{%- with limitkeys = {"timerange":r.range} -%}
|
||||
{% include 'partials/charts_artists_tiles.jinja' %}
|
||||
{%- endwith -%}
|
||||
</span>
|
||||
{%- endfor %}
|
||||
{% for module in ['charts_artists','charts_tracks','charts_albums','pulse','lastscrobbles','featured'] %}
|
||||
<section id="start_page_module_{{ module }}" style="grid-area: {{ module }}">
|
||||
<!-- MODULE: {{ module }} -->
|
||||
|
||||
{% include 'startpage_modules/' + module + '.jinja' %}
|
||||
|
||||
|
||||
<!-- END MODULE: {{ module }} -->
|
||||
</section>
|
||||
{% endfor %}
|
||||
|
||||
</div>
|
||||
|
||||
<!-- TRACK CHARTS -->
|
||||
<h1><a class="stat_link_toptracks" href="/charts_tracks?in=alltime">Top Tracks</a></h1>
|
||||
|
||||
{% for r in xcurrent -%}
|
||||
<span onclick="showRangeManual('toptracks','{{ r.identifier }}')" class="stat_selector_toptracks selector_toptracks_{{ r.identifier }}">
|
||||
{{ r.localisation }}
|
||||
</span>
|
||||
{{ "|" if not loop.last }}
|
||||
{%- endfor %}
|
||||
|
||||
<br/><br/>
|
||||
|
||||
|
||||
{% for r in xcurrent -%}
|
||||
<span class="stat_module_toptracks toptracks_{{ r.identifier }}" style="display:none;">
|
||||
{%- with limitkeys = {"timerange":r.range} -%}
|
||||
{% include 'partials/charts_tracks_tiles.jinja' %}
|
||||
{%- endwith -%}
|
||||
</span>
|
||||
{%- endfor %}
|
||||
|
||||
|
||||
<div class="sidelist">
|
||||
<!-- SCROBBLES -->
|
||||
|
||||
<h1><a href="/scrobbles">Last Scrobbles</a></h1>
|
||||
|
||||
{% for range in xcurrent %}
|
||||
<span class="stats">{{ range.localisation }}</span>
|
||||
<a href='/scrobbles?in={{ range.identifier }}'>{{ dbc.get_scrobbles_num({'timerange':range.range}) }}</a>
|
||||
{% endfor %}
|
||||
<br/><br/>
|
||||
|
||||
<span class="stat_module">
|
||||
|
||||
|
||||
{%- with amountkeys = {"perpage":12,"page":0}, shortTimeDesc=True -%}
|
||||
{% include 'partials/scrobbles.jinja' %}
|
||||
{%- endwith -%}
|
||||
</span>
|
||||
|
||||
|
||||
<br/>
|
||||
|
||||
|
||||
|
||||
|
||||
<!-- PULSE -->
|
||||
<h1><a class="stat_link_pulse" href="/pulse?trail=1&step=month">Pulse</a></h1>
|
||||
|
||||
{% for range in xranges -%}
|
||||
<span onclick="showRangeManual('pulse','{{ range.identifier }}')" class="stat_selector_pulse selector_pulse_{{ range.identifier }}">
|
||||
{{ range.localisation }}
|
||||
</span>
|
||||
{{ "|" if not loop.last }}
|
||||
{%- endfor %}
|
||||
<br/><br/>
|
||||
|
||||
{% for range in xranges -%}
|
||||
<span class="stat_module_pulse pulse_{{ range.identifier }}" style="display:none;">
|
||||
{%- with limitkeys={"since":range.firstrange},delimitkeys={"step":range.identifier} -%}
|
||||
{% include 'partials/pulse.jinja' %}
|
||||
{%- endwith -%}
|
||||
</span>
|
||||
{%- endfor %}
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
{%- endblock %}
|
||||
|
||||
19
maloja/web/jinja/startpage_modules/charts_albums.jinja
Normal file
19
maloja/web/jinja/startpage_modules/charts_albums.jinja
Normal file
@ -0,0 +1,19 @@
|
||||
<h1><a class="stat_link_topalbums" href="/charts_albums?in=alltime">Top Albums</a></h1>
|
||||
|
||||
{% for r in xcurrent -%}
|
||||
<span onclick="showRangeManual('topalbums','{{ r.identifier }}')" class="stat_selector_topalbums selector_topalbums_{{ r.identifier }}">
|
||||
{{ r.localisation }}
|
||||
</span>
|
||||
{{ "|" if not loop.last }}
|
||||
{%- endfor %}
|
||||
|
||||
<br/><br/>
|
||||
|
||||
|
||||
{% for r in xcurrent -%}
|
||||
<section class="stat_module_topalbums topalbums_{{ r.identifier }}" style="display:none;">
|
||||
{%- with limitkeys = {"timerange":r.range} -%}
|
||||
{% include 'partials/charts_albums_tiles.jinja' %}
|
||||
{%- endwith -%}
|
||||
</section>
|
||||
{%- endfor %}
|
||||
19
maloja/web/jinja/startpage_modules/charts_artists.jinja
Normal file
19
maloja/web/jinja/startpage_modules/charts_artists.jinja
Normal file
@ -0,0 +1,19 @@
|
||||
<h1><a class="stat_link_topartists" href="/charts_artists?in=alltime">Top Artists</a></h1>
|
||||
|
||||
{% for r in xcurrent -%}
|
||||
<span onclick="showRangeManual('topartists','{{ r.identifier }}')" class="stat_selector_topartists selector_topartists_{{ r.identifier }}">
|
||||
{{ r.localisation }}
|
||||
</span>
|
||||
{{ "|" if not loop.last }}
|
||||
{%- endfor %}
|
||||
|
||||
<br/><br/>
|
||||
|
||||
|
||||
{% for r in xcurrent -%}
|
||||
<section class="stat_module_topartists topartists_{{ r.identifier }}" style="display:none;">
|
||||
{%- with limitkeys = {"timerange":r.range} -%}
|
||||
{% include 'partials/charts_artists_tiles.jinja' %}
|
||||
{%- endwith -%}
|
||||
</section>
|
||||
{%- endfor %}
|
||||
19
maloja/web/jinja/startpage_modules/charts_tracks.jinja
Normal file
19
maloja/web/jinja/startpage_modules/charts_tracks.jinja
Normal file
@ -0,0 +1,19 @@
|
||||
<h1><a class="stat_link_toptracks" href="/charts_tracks?in=alltime">Top Tracks</a></h1>
|
||||
|
||||
{% for r in xcurrent -%}
|
||||
<span onclick="showRangeManual('toptracks','{{ r.identifier }}')" class="stat_selector_toptracks selector_toptracks_{{ r.identifier }}">
|
||||
{{ r.localisation }}
|
||||
</span>
|
||||
{{ "|" if not loop.last }}
|
||||
{%- endfor %}
|
||||
|
||||
<br/><br/>
|
||||
|
||||
|
||||
{% for r in xcurrent -%}
|
||||
<section class="stat_module_toptracks toptracks_{{ r.identifier }}" style="display:none;">
|
||||
{%- with limitkeys = {"timerange":r.range} -%}
|
||||
{% include 'partials/charts_tracks_tiles.jinja' %}
|
||||
{%- endwith -%}
|
||||
</section>
|
||||
{%- endfor %}
|
||||
58
maloja/web/jinja/startpage_modules/featured.jinja
Normal file
58
maloja/web/jinja/startpage_modules/featured.jinja
Normal file
@ -0,0 +1,58 @@
|
||||
<h1>Featured</h1>
|
||||
|
||||
|
||||
{% set entitytypes = [
|
||||
{'identifier':'artist','localisation':"Artist", 'template':"info_artist.jinja", 'filterkeys':{"artist":"Blackpink"} },
|
||||
{'identifier':'track','localisation':"Track", 'template':"info_track.jinja", 'filterkeys':{"track": {"artists": ["Red Velvet"], "title": "Russian Roulette"}} },
|
||||
{'identifier':'album','localisation':"Album", 'template':"info_album.jinja", 'filterkeys':{"album": {"artists": ["TWICE"], "albumtitle": "The Story Begins"}} }
|
||||
] %}
|
||||
|
||||
|
||||
{% for t in entitytypes -%}
|
||||
<span onclick="showFeatured('{{ t.identifier }}')" class="stat_selector_featured stat_selector_featured_{{ t.identifier }}">
|
||||
{{ t.localisation }}
|
||||
</span>
|
||||
{{ "|" if not loop.last }}
|
||||
{%- endfor %}
|
||||
|
||||
<br/><br/><br/>
|
||||
|
||||
|
||||
{% for t in entitytypes -%}
|
||||
<section class="stat_module_featured featured_{{ t.identifier }}" style="display:none;">
|
||||
{%- with filterkeys = t.filterkeys -%}
|
||||
{% include 'partials/' + t.template %}
|
||||
{%- endwith -%}
|
||||
</section>
|
||||
{%- endfor %}
|
||||
|
||||
|
||||
|
||||
|
||||
<script>
|
||||
function showFeatured(t) {
|
||||
// Make all modules disappear
|
||||
var modules = document.getElementsByClassName("stat_module_featured");
|
||||
for (var i=0;i<modules.length;i++) {
|
||||
modules[i].setAttribute("style","display:none;");
|
||||
}
|
||||
|
||||
// Make requested module appear
|
||||
var reactivate = document.getElementsByClassName("featured_" + t);
|
||||
for (var i=0;i<reactivate.length;i++) {
|
||||
reactivate[i].setAttribute("style","");
|
||||
}
|
||||
|
||||
// Set all selectors to unselected
|
||||
var selectors = document.getElementsByClassName("stat_selector_featured");
|
||||
for (var i=0;i<selectors.length;i++) {
|
||||
selectors[i].setAttribute("style","");
|
||||
}
|
||||
|
||||
// Set the active selector to selected
|
||||
var reactivate = document.getElementsByClassName("stat_selector_featured_" + t);
|
||||
for (var i=0;i<reactivate.length;i++) {
|
||||
reactivate[i].setAttribute("style","opacity:0.5;");
|
||||
}
|
||||
}
|
||||
</script>
|
||||
15
maloja/web/jinja/startpage_modules/lastscrobbles.jinja
Normal file
15
maloja/web/jinja/startpage_modules/lastscrobbles.jinja
Normal file
@ -0,0 +1,15 @@
|
||||
<h1><a href="/scrobbles">Last Scrobbles</a></h1>
|
||||
|
||||
{% for range in xcurrent %}
|
||||
<span class="stats">{{ range.localisation }}</span>
|
||||
<a href='/scrobbles?in={{ range.identifier }}'>{{ dbc.get_scrobbles_num({'timerange':range.range}) }}</a>
|
||||
{% endfor %}
|
||||
<br/><br/>
|
||||
|
||||
<span class="stat_module">
|
||||
|
||||
|
||||
{%- with amountkeys = {"perpage":12,"page":0}, shortTimeDesc=True -%}
|
||||
{% include 'partials/scrobbles.jinja' %}
|
||||
{%- endwith -%}
|
||||
</span>
|
||||
17
maloja/web/jinja/startpage_modules/pulse.jinja
Normal file
17
maloja/web/jinja/startpage_modules/pulse.jinja
Normal file
@ -0,0 +1,17 @@
|
||||
<h1><a class="stat_link_pulse" href="/pulse?trail=1&step=month">Pulse</a></h1>
|
||||
|
||||
{% for range in xranges -%}
|
||||
<span onclick="showRangeManual('pulse','{{ range.identifier }}')" class="stat_selector_pulse selector_pulse_{{ range.identifier }}">
|
||||
{{ range.localisation }}
|
||||
</span>
|
||||
{{ "|" if not loop.last }}
|
||||
{%- endfor %}
|
||||
<br/><br/>
|
||||
|
||||
{% for range in xranges -%}
|
||||
<span class="stat_module_pulse pulse_{{ range.identifier }}" style="display:none;">
|
||||
{%- with limitkeys={"since":range.firstrange},delimitkeys={"step":range.identifier} -%}
|
||||
{% include 'partials/pulse.jinja' %}
|
||||
{%- endwith -%}
|
||||
</span>
|
||||
{%- endfor %}
|
||||
@ -802,10 +802,12 @@ table.misc td {
|
||||
|
||||
div.tiles {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(18, 50px);
|
||||
grid-template-rows: repeat(6, 50px);
|
||||
grid-template-columns: repeat(18, calc(100% / 18));
|
||||
grid-template-rows: repeat(6, calc(100% / 6));
|
||||
grid-auto-flow: row dense;
|
||||
|
||||
aspect-ratio: 3 / 1;
|
||||
|
||||
}
|
||||
|
||||
div.tiles div {
|
||||
@ -982,35 +984,3 @@ span.stat_module_pulse, span.stat_module_topartists, span.stat_module_toptracks
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
/*
|
||||
**
|
||||
**
|
||||
** SIDE LIST ON START PAGE
|
||||
**
|
||||
**
|
||||
*/
|
||||
|
||||
|
||||
@media (min-width: 1600px) {
|
||||
div.sidelist {
|
||||
position:absolute;
|
||||
right:0px;
|
||||
top:0px;
|
||||
width:40%;
|
||||
height:100%;
|
||||
--current-bg-color: var(--base-color-light); /* drag this information through inheritances */
|
||||
background-color: var(--current-bg-color);
|
||||
padding-left:30px;
|
||||
padding-right:30px;
|
||||
}
|
||||
}
|
||||
|
||||
div.sidelist table {
|
||||
width:100%;
|
||||
table-layout:fixed;
|
||||
}
|
||||
|
||||
div.sidelist table.list td.time {
|
||||
width:17%;
|
||||
}
|
||||
|
||||
49
maloja/web/static/css/startpage.css
Normal file
49
maloja/web/static/css/startpage.css
Normal file
@ -0,0 +1,49 @@
|
||||
div#startpage {
|
||||
display: grid;
|
||||
justify-content: center;
|
||||
|
||||
display: fixed;
|
||||
grid-column-gap: 25px;
|
||||
grid-row-gap: 25px;
|
||||
}
|
||||
|
||||
|
||||
@media (min-width: 2201px) {
|
||||
div#startpage {
|
||||
grid-template-columns: 30vw 30vw 30vw;
|
||||
grid-template-rows: 45vh 45vh;
|
||||
|
||||
grid-template-areas:
|
||||
"charts_artists charts_tracks charts_albums"
|
||||
"lastscrobbles featured pulse";
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1401px) and (max-width: 2200px) {
|
||||
div#startpage {
|
||||
grid-template-columns: 45vw 45vw;
|
||||
grid-template-rows: 45vh 45vh 45vh;
|
||||
|
||||
grid-template-areas:
|
||||
"charts_artists lastscrobbles"
|
||||
"charts_tracks pulse"
|
||||
"charts_albums featured";
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 1400px) {
|
||||
div#startpage {
|
||||
grid-template-columns: 90vw;
|
||||
|
||||
grid-template-areas:
|
||||
"charts_artists"
|
||||
"charts_tracks"
|
||||
"charts_albums"
|
||||
"lastscrobbles"
|
||||
"pulse";
|
||||
}
|
||||
|
||||
#start_page_module_featured {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
@ -2,7 +2,7 @@ localStorage = window.localStorage;
|
||||
|
||||
function showRange(identifier,unit) {
|
||||
// Make all modules disappear
|
||||
modules = document.getElementsByClassName("stat_module_" + identifier);
|
||||
var modules = document.getElementsByClassName("stat_module_" + identifier);
|
||||
for (var i=0;i<modules.length;i++) {
|
||||
//modules[i].setAttribute("style","width:0px;overflow:hidden;")
|
||||
// cheesy trick to make the allocated space always whatever the biggest module needs
|
||||
@ -11,19 +11,19 @@ function showRange(identifier,unit) {
|
||||
}
|
||||
|
||||
// Make requested module appear
|
||||
reactivate = document.getElementsByClassName(identifier + "_" + unit);
|
||||
var reactivate = document.getElementsByClassName(identifier + "_" + unit);
|
||||
for (var i=0;i<reactivate.length;i++) {
|
||||
reactivate[i].setAttribute("style","");
|
||||
}
|
||||
|
||||
// Set all selectors to unselected
|
||||
selectors = document.getElementsByClassName("stat_selector_" + identifier);
|
||||
var selectors = document.getElementsByClassName("stat_selector_" + identifier);
|
||||
for (var i=0;i<selectors.length;i++) {
|
||||
selectors[i].setAttribute("style","");
|
||||
}
|
||||
|
||||
// Set the active selector to selected
|
||||
reactivate = document.getElementsByClassName("selector_" + identifier + "_" + unit);
|
||||
var reactivate = document.getElementsByClassName("selector_" + identifier + "_" + unit);
|
||||
for (var i=0;i<reactivate.length;i++) {
|
||||
reactivate[i].setAttribute("style","opacity:0.5;");
|
||||
}
|
||||
@ -43,16 +43,3 @@ function showRangeManual(identifier,unit) {
|
||||
//neo.setCookie("rangeselect_" + identifier,unit);
|
||||
localStorage.setItem("rangeselect_" + identifier,unit);
|
||||
}
|
||||
|
||||
|
||||
|
||||
document.addEventListener('DOMContentLoaded',function() {
|
||||
for (let type of ["topartists","toptracks","pulse"]) {
|
||||
var val = localStorage.getItem("rangeselect_" + type);
|
||||
if (val != null) {
|
||||
showRange(type,val);
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
})
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user