work on sthome and archive pages, template cleanup

This commit is contained in:
2019-06-10 23:34:56 +02:00
parent 027ad5511c
commit 1f4a97ca1a
22 changed files with 537 additions and 664 deletions

View File

@@ -15,6 +15,8 @@
console.log(vw, wow)
var isMobile
var isHome = false
var isArchive = false
var isEsemeny = false
@@ -31,6 +33,14 @@
isHome = true
}
if ($('body').hasClass("archive") & !$('body').hasClass("category-esemeny")) {
isArchive = true
}
if ($('body').hasClass("category-esemeny")) {
isEsemeny = true
}
var desktophomemargin = $(".header-1")[0].getBoundingClientRect().width
@@ -135,39 +145,65 @@
}
/* -------------------------------------------------------------------------- */
/* HOME */
/* HOME & ARCHIVES */
/* -------------------------------------------------------------------------- */
/* ----------------------------------- css ---------------------------------- */
var articleWrapCounter = 0
if (isHome & !isMobile) {
$('html').css({ overflowY: "hidden" })
if (!isMobile) {
if (isHome || isArchive) {
$('html').css({ overflowY: "hidden" })
$('#content>*:not(.misha_loadmore)').addClass("hbox")
var wrapArticles = $(".hbox").length
//wrapping for big-small difference
if (isHome) {
$('.hbox:first-child').wrap('<div class="home-wrapper-big home-wrapper-1"></div>').addClass("home-big")
$('.hbox:nth-child(2)').wrap('<div class="home-wrapper-big home-wrapper-2"></div>').addClass("home-big")
wrapArticles = $(".hbox").length - 2
//wrapping for big-small difference
$('article:first-child').wrap('<div class="home-wrapper-big home-wrapper-1"></div>').addClass("home-big")
$('article:nth-child(2)').wrap('<div class="home-wrapper-big home-wrapper-2"></div>').addClass("home-big")
var wrapArticles = $("article").length - 2
var articleWrapCounter = 0
for (let i = 0; i < wrapArticles; i++) {
var j = i + 3
if (i % 6 == 0) {
articleWrapCounter++
}
$('article:nth-child(' + j + ')').addClass("home-small home-thumbnail-small-" + articleWrapCounter)
}
for (let i = 0; i < articleWrapCounter; i++) {
var j = i + 3
var k = i + 1
$(".home-thumbnail-small-" + k).wrapAll('<div class="home-wrapper-small home-wrapper-' + j + '"></div>')
//add classes to articles and elements
var articleWrapCounter = 0
for (let i = 0; i < wrapArticles; i++) {
var j = i + 1
if (isHome) {
j = i + 3
}
if (i % 6 == 0) {
articleWrapCounter++
}
console.log($('.hbox:nth-child(' + j + ')').attr("id"), i, j)
$('.hbox:nth-child(' + j + ')').addClass("home-small home-thumbnail-small-" + articleWrapCounter)
//change order if there is a description
if ($(".archivedescription") && articleWrapCounter == 1 && j > 2 && j < 5) {
$('.hbox:nth-child(' + j + ')').css({order:"99"})
}
}
//wrap classes
for (let i = 0; i < articleWrapCounter; i++) {
var j = i + 1
if (isHome) {
j = i + 3
}
var k = i + 1
$(".home-thumbnail-small-" + k).wrapAll('<div class="home-wrapper-small home-wrapper-' + j + '"></div>')
if (i == 0) {
$(".home-wrapper-" + j).addClass("home-wrapper-s1")
}
}
}
}
//returns three random numebers 0-5
function randomNumbers() {
// All numbers are equal
@@ -206,14 +242,18 @@
$(this).addRandomClasses()
})
/* ----------------------------- Snap on mobile ----------------------------- */
if (isHome & isMobile) {
$("article.post").SnapScroll({
animateDuration: 400
});
if (isMobile) {
if (isHome || isArchive) {
$("article.post").SnapScroll({
animateDuration: 400
});
}
}
/* --------------------------------- To top --------------------------------- */
$(".totop>a").click(function (e) {
@@ -245,7 +285,7 @@
} else {
//from the third wrap modify the offset
var wNum = parseInt($(nextelem).attr("class").split(" ")[1].split("-")[2])
if (wNum > 3) {
if (wNum > 3 || !isHome) {
offset = offset - desktophomemargin
}
}
@@ -278,33 +318,37 @@
var currElem = $(selector + ':first-child')
//checking the current scroll location for refresh:
if (isHome & !isMobile) {
var articleWidth = $(selector + ':first-child')[0].getBoundingClientRect().width
var currscroll = $('html').scrollLeft()
var scrollnr = Math.floor(currscroll / articleWidth) + 1
currElem = $(selector + ':nth-child(' + scrollnr + ')')
console.log("start location: " + currElem.attr("class"))
if (!isMobile) {
if (isHome || isArchive) {
var articleWidth = $(selector + ':first-child')[0].getBoundingClientRect().width
var currscroll = $('html').scrollLeft()
var scrollnr = Math.floor(currscroll / articleWidth) + 1
currElem = $(selector + ':nth-child(' + scrollnr + ')')
console.log("start location: " + currElem.attr("class"))
}
}
var scrolltimer = false;
$(window).on('wheel DOMMouseScroll', function (e) {
//e.preventDefault();
if (isHome & !isMobile) {
if (scrolltimer) {
return false;
}
scrolltimer = true;
setTimeout(() => {
scrolltimer = false;
}, 500);
if (!isMobile) {
if (isHome || !isMobile) {
if (scrolltimer) {
return false;
}
scrolltimer = true;
setTimeout(() => {
scrolltimer = false;
}, 500);
var wd = extractDelta(e)
var wd = extractDelta(e)
if (wd > 0) {
currElem = homeScroll(currElem, "prev")
}
else {
currElem = homeScroll(currElem, "next")
if (wd > 0) {
currElem = homeScroll(currElem, "prev")
}
else {
currElem = homeScroll(currElem, "next")
}
}
}
});
@@ -347,7 +391,7 @@
var noMoreAjax = false
function loadmore(element){
function loadmore(element) {
if (noMoreAjax) {
console.log("no more ajax")
return false
@@ -360,13 +404,13 @@
'page': misha_loadmore_params.current_page
};
button.trigger("moreload-start")
$.ajax({ // you can also use $.post here
url: misha_loadmore_params.ajaxurl, // AJAX handler
data: data,
type: 'POST',
beforeSend: function (xhr) {
button.html('<p>Betöltés...</p>'); // change the button text, you can also add a preloader image
},
success: function (data) {
@@ -381,10 +425,10 @@
misha_loadmore_params.current_page++;
button.trigger("moreload-finish")
console.log(data.length)
// you can also fire the "post-load" event here if you use a plugin that requires it
// $( document.body ).trigger( 'post-load' );
} else {
button.children().remove(); // if no data, remove the button as well
noMoreAjax = true
@@ -397,20 +441,20 @@
/* ------------------------------ hover on home ----------------------------- */
//hover on big articles
$(".home-big h2>a").hover(function () {
$(".home-big h2").hover(function () {
let cc = $(this)
//make width more
cc.parents("article").addClass("hovered")
//change bg
// $(this).parents('article').animate({})
//animate metadata
//show excerpt
}, function () {
let cc = $(this)
//width back to normal
cc.parents("article").removeClass("hovered")
})