diff --git a/src/program/static/js/event_instance_websocket.js b/src/program/static/js/event_instance_websocket.js index 76c05a6a..5d19080c 100644 --- a/src/program/static/js/event_instance_websocket.js +++ b/src/program/static/js/event_instance_websocket.js @@ -120,6 +120,9 @@ function render_day_menu(active_iso) { var container = document.getElementById('schedule-days'); container.innerHTML = ''; + var mobile_container = document.getElementById('schedule-days-mobile'); + mobile_container.innerHTML = ''; + function set_btn_type(classList, primary) { if(primary == true) { classList.add('btn-primary'); @@ -128,16 +131,25 @@ function render_day_menu(active_iso) { } } + function dayEvent(e) { + setHistoryState({ + 'day': this.dataset.iso + }); + render(); + } + var all_days = document.createElement('a'); all_days.classList.add('btn'); set_btn_type(all_days.classList, active_iso == null); all_days.innerHTML = 'All days'; - all_days.addEventListener('click', function(e) { - setHistoryState({'day': 'all-days'}); - render(); - }); + all_days.dataset.iso = 'all-days'; + all_days.addEventListener('click', dayEvent); container.appendChild(all_days); + all_days_mobile = all_days.cloneNode(true); + all_days_mobile.addEventListener('click', dayEvent); + mobile_container.appendChild(all_days_mobile); + for(var day_id in DAYS) { var day_link = document.createElement('a'); day_link.classList.add('btn'); @@ -145,14 +157,12 @@ function render_day_menu(active_iso) { day_link.dataset.iso = DAYS[day_id]['iso']; day_link.innerHTML = DAYS[day_id]['day_name']; - day_link.addEventListener('click', function(e) { - setHistoryState({ - 'day': this.dataset.iso - }); - render(); - }); - + day_link.addEventListener('click', dayEvent); container.appendChild(day_link); + + day_link_mobile = day_link.cloneNode(true); + day_link_mobile.addEventListener('click', dayEvent); + mobile_container.appendChild(day_link_mobile); } } @@ -463,7 +473,6 @@ function setHistoryState(parts) { } history.replaceState({}, '', query); - } function toggleFilterBoxes(types, locations) { diff --git a/src/program/templates/schedule_base.html b/src/program/templates/schedule_base.html index a1e2e4fd..e7b19bce 100644 --- a/src/program/templates/schedule_base.html +++ b/src/program/templates/schedule_base.html @@ -4,7 +4,9 @@ {% block program_content %}
-
+ +
diff --git a/src/static_src/css/bornhack.css b/src/static_src/css/bornhack.css index 57b89bdb..c4aad30d 100644 --- a/src/static_src/css/bornhack.css +++ b/src/static_src/css/bornhack.css @@ -219,13 +219,13 @@ footer { } } -.schedule-days { +#schedule-days { list-style: none; padding: 0; display: flex; } -.schedule-days a { +#schedule-days a { display: inline; flex-grow: 1; }