home updates

js/scripts.js

@@ -10,38 +10,56 @@
 		/*                                  VARIABLES                                 */
 		/* ========================================================================== */
 
+		/* -------------------------------- geometry -------------------------------- */
+
 		const vw = $(window).width()
 		const wow = window.outerWidth
-		console.log(vw, wow)
-		var isMobile
-		var isHome = false
-		var isArchive = false
-		var isEsemeny = false
+		// console.log(vw, wow)
+
+		const bottomScrollHeight = window.innerHeight - $(window).height()
+		const desktophomemargin = $(".header-1")[0].getBoundingClientRect().width
 
 
+		/* --------------------------- css values to vars --------------------------- */
+		//isMobile
+		const isMobile = (_ => {
+			if (wow < 769) {
+				//mobile settings
+				$('.social-link').addClass('hidden')
+				return true
 
-		if (wow < 769) {
-			isMobile = true
-			//mobile settings
-			$('.social-link').addClass('hidden')
+			} else {
+				return false
+			}
+		})()
 
-		} else {
-			isMobile = false
-		}
+		//isHome
+		const isHome = (_ => {
+			if ($('body').hasClass("home")) {
+				return true
+			} else {
+				return false
+			}
+		})()
 
-		if ($('body').hasClass("home")) {
-			isHome = true
-		}
 
-		if ($('body').hasClass("archive") & !$('body').hasClass("category-esemeny")) {
-			isArchive = true
-		}
+		//isArchive
+		const isArchive = (_ => {
+			if ($('body').hasClass("archive") & !$('body').hasClass("category-esemeny")) {
+				return true
+			} else {
+				return false
+			}
+		})()
 
-		if ($('body').hasClass("category-esemeny")) {
-			isEsemeny = true
-		}
-
-		var desktophomemargin = $(".header-1")[0].getBoundingClientRect().width
+		//isEsemeny
+		const isEsemeny = (_ => {
+			if ($('body').hasClass("category-esemeny")) {
+				return true
+			} else {
+				return false
+			}
+		})()
 
 
 		/* ========================================================================== */
@@ -155,8 +173,11 @@
 
 		if (!isMobile) {
 			if (isHome || isArchive) {
-				$('html').css({ overflowY: "hidden" })
 
+				//no overflowY
+				$('html').css({ overflowY: "hidden" })		
+
+				//calculate wrappable elements
 				$('#content>*:not(.misha_loadmore)').addClass("hbox")
 				var wrapArticles = $(".hbox").length
 
@@ -165,10 +186,8 @@
 					$('.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
-
 				}
 
-
 				//add classes to articles and elements
 				var articleWrapCounter = 0
 				for (let i = 0; i < wrapArticles; i++) {
@@ -178,15 +197,14 @@
 						j = i + 3
 					}
 
-
 					if (i % 6 == 0) {
 						articleWrapCounter++
 					}
-					console.log($('.hbox:nth-child(' + j + ')').attr("id"), i, j)
+					//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"})
+						$('.hbox:nth-child(' + j + ')').css({ order: "99" })
 					}
 				}
 				//wrap classes
@@ -201,8 +219,12 @@
 						$(".home-wrapper-" + j).addClass("home-wrapper-s1")
 					}
 				}
-			}
-		}
+
+				//add bottom scrollbar to div on bottom:
+				$(".home-wrapper-big .metadata").css({bottom: bottomScrollHeight})
+
+			}//isHome || isArchive end
+		}// !isMobile end
 
 		//returns three random numebers 0-5
 		function randomNumbers() {
@@ -253,7 +275,6 @@
 			}
 		}
 
-
 		/* --------------------------------- To top --------------------------------- */
 
 		$(".totop>a").click(function (e) {
@@ -443,22 +464,40 @@
 		//hover on big articles
 		$(".home-big h2").hover(function () {
 			let cc = $(this)
-			//make width more
-			cc.parents("article").addClass("hovered")
-			//change bg
-			// $(this).parents('article').animate({})
-			//animate metadata
+			let cArticle = cc.parents("article")
+			//add hovered class
+			cArticle.addClass("hovered")
+			//add tag to header for bg
+			let artClasses = cArticle.attr("class").split(" ")
+			let theTag = findClassByStart(artClasses, "tag")
+			$("body, .header-1, .header-2").addClass("hover-" + theTag)
+			//show excerpt and alcim
+			cArticle.children(".metadata").children(".alcim").show()
+			cArticle.children(".metadata").children(".bevezeto").show()
 
-			//show excerpt
 		}, function () {
 			let cc = $(this)
-			//width back to normal
+			//remove hovered class
 			cc.parents("article").removeClass("hovered")
-
-
+			//remove tag from header and body
+			let headerClasses = $(".header-1").attr("class").split(" ")
+			var hoverClass = findClassByStart(headerClasses, "hover")
+			$("body, .header-1, .header-2").removeClass(hoverClass)
 		})
 
 
+		function findClassByStart(classlist, startString, sep = "-") {
+			//finds a name of a class, from the first elemnt 
+			var fullstring
+			for (let i = 0; i < classlist.length; i++) {
+				let curr = classlist[i].split(sep)
+				if (curr[0] == startString) {
+					fullstring = classlist[i]
+				}
+			}
+			return fullstring
+		}
+
 		//hover on small articles
 		function showTitle(th) {
 			$(th).children("h2").show()