diff options
| -rw-r--r-- | result/index.html | 4 | ||||
| -rw-r--r-- | result/krafcik.js | 23 |
2 files changed, 22 insertions, 5 deletions
diff --git a/result/index.html b/result/index.html index e136110..cfd2473 100644 --- a/result/index.html +++ b/result/index.html @@ -38,7 +38,7 @@ <ul class="nav nav-tabs" id="tab-menu" role="tablist"> <li class="nav-item"> - <a class="nav-link active" id="styles-tab" data-toggle="tab" href="#styles" role="tab" aria-controls="styles" aria-selected="true"> + <a class="nav-link" id="styles-tab" data-toggle="tab" href="#styles" role="tab" aria-controls="styles" aria-selected="false"> Rozkład stylów </a> </li> @@ -59,7 +59,7 @@ </li> </ul> <div class="tab-content" id="tab-content"> - <div class="tab-pane fade show active" id="styles" role="tabpanel" aria-labelledby="styles-tab"> + <div class="tab-pane fade" id="styles" role="tabpanel" aria-labelledby="styles-tab"> <canvas id="styles-chart" width="100%"></canvas> </div> <div class="tab-pane fade" id="abv-ratings" role="tabpanel" aria-labelledby="abv-ratings-tab"> diff --git a/result/krafcik.js b/result/krafcik.js index cac3371..ba8ccf9 100644 --- a/result/krafcik.js +++ b/result/krafcik.js @@ -1,5 +1,16 @@ $(document).ready(function() { + var initTab = function(tab, push) { + if (!tab) { + tab = location.hash.replace('#', '') || 'styles'; + } + console.log(tab, push); + $(`a#${tab}-tab`).tab('show'); + if (push) { + history.pushState({}, '', '#' + tab); + } + }; + $.when( $.getJSON('beers.json'), $.getJSON('breweries.json'), @@ -400,13 +411,19 @@ $(document).ready(function() { changeTimeout = setTimeout(updateCharts, 500); }); - var pageHash = location.hash.replace('#', '') || 'styles'; - $(`a#${pageHash}-tab`).click().trigger('shown.bs.tab'); + initTab(false, true); updateCharts(); }); $('#tab-menu a').on('click', function (e) { e.preventDefault(); - $(this).tab('show'); + e.stopImmediatePropagation(); + initTab($(this).attr('aria-controls'), true); + return false; }); + + $(window).on('popstate', function(ev) { + initTab(false, false); + }); + }); |