Refactor sidebar logic + Add Table of Contents in reading page (#33)

* Refactor sidebar logic + fix responsiveness

* Add TOC

* Add Pagination

* Update exampleSite

* Update README.md
This commit is contained in:
Md. Emruz Hossain 2020-07-22 04:14:08 +06:00 committed by GitHub
parent 647578e88b
commit fa4d474974
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
59 changed files with 1735 additions and 679 deletions

View file

@ -1,7 +1,5 @@
"use strict";
var filterizd;
var isMobile = false, isTablet = false, isLaptop = false;
(function ($) {
jQuery(document).ready(function () {
@ -25,7 +23,7 @@ var isMobile = false, isTablet = false, isLaptop = false;
// ======= Adjust height of the post cards =============
function adjustPostCardsHeight() {
if (!isMobile) { // no need to adjust height for mobile devices
let postCardHolder = document.getElementById("post-cards");
let postCardHolder = document.getElementById("post-card-holder");
if (postCardHolder == null ){
return
}
@ -42,69 +40,5 @@ var isMobile = false, isTablet = false, isLaptop = false;
}
}
adjustPostCardsHeight();
// ============= Sidebar Tree ================
function buildSidebarMenu() {
var openedClass = "fa-minus-circle";
var closedClass = "fa-plus-circle";
// initialize top level
var tree = $("#tree");
// add expand icon to those li who has ul as children
tree.find("li").has("ul").each(function () {
var branch = $(this);
branch.prepend('<i class="fas ' + closedClass + '"></i>');
branch.on('click', function (e) {
if (this.children[1] == e.target) {
// toggle "expand" class and icon
branch.toggleClass("expand");
var icon = $(this).children('i:first');
icon.toggleClass(openedClass + " " + closedClass);
}
});
});
// remove "expnad" class from siblings of the clicked item
tree.find("li").on("click", function () {
var item = $(this);
var shiblings = item.siblings().each(function () {
var sibling = $(this);
if (sibling.hasClass("expand")) {
sibling.removeClass("expand");
var icon = sibling.children('i:first');
icon.toggleClass(openedClass + " " + closedClass);
}
});
});
// focus the cliked item
tree.find("a").on("click", function () {
// clear other focused link
tree.find("a.focused").each(function () {
$(this).removeClass("focused");
});
// focus cliked link
$(this).addClass("focused");
});
}
buildSidebarMenu();
// initialize filterizr
filterizd = $(".filtr-container").filterizr({ layout: 'sameWidth' });
});
})(jQuery);
// toggle sidebar on click
function toggleSidebar() {
document.getElementById("sidebar").classList.toggle("hide");
document.getElementById("content").classList.toggle("overley");
// if it is mobile device. then scroll to top.
if (isMobile && $("#sidebar").hasClass("hide")) {
document.body.scrollTop = 0;
document.documentElement.scrollTop = 0;
}
setTimeout(function () {
filterizd.filterizr('sort');
}, 300);
}