remove unnessessary plugins and added filtarizr plugin

assets/js/script.js

@@ -51,8 +51,7 @@ jQuery(function ($) {
 	/*	Portfolio Filtering Hook
 	/* =========================================================================  */
 
-	var mixer = mixitup('.portfolio-items-wrapper');
-
+	var filterizd = $('.filtr-container').filterizr({});
 	/* ========================================================================= */
 	/*	Testimonial Carousel
 	/* =========================================================================  */
@@ -65,10 +64,6 @@ jQuery(function ($) {
 		autoplaySpeed: 4000
 	});
 
-
-
-
-
 	/* ========================================================================= */
 	/*   Contact Form Validating
 	/* ========================================================================= */
@@ -167,7 +162,7 @@ var wow = new WOW({
 
 //https://github.com/matthieua/WOW/issues/196#issuecomment-348734401
 var scrolled = false;
-$(window).on('scroll', function() {
+$(window).on('scroll', function () {
 	if (!scrolled) {
 		scrolled = true;
 		wow.init();
@@ -298,18 +293,18 @@ google.maps.event.addDomListener(window, "load", initialize);
 /* ========================================================================= */
 /*	Staticman comments reply
 /* ========================================================================= */
-function changeValue(elementName, newValue){
-	document.getElementsByName(elementName)[0].value=newValue;
+function changeValue(elementName, newValue) {
+	document.getElementsByName(elementName)[0].value = newValue;
 };
 
 /* ========================================================================= */
 /*	Honeypot
 /* ========================================================================= */
-$(document).ready(function() {
-    $('form').submit(function() {
-        if ($('input[type="text"]#e-mail').val().length > 0) {
-            $('form').attr('action', '/');
-            return false;
-        }
-    });
-});
+$(document).ready(function () {
+	$('form').submit(function () {
+		if ($('input[type="text"]#e-mail').val().length > 0) {
+			$('form').attr('action', '/');
+			return false;
+		}
+	});
+});

exampleSite/data/portfolio.yml

@@ -26,14 +26,14 @@ portfolioItem :
     title : Sound system
     description : Lorem ipsum dolor sit amet consectetur adipisicing elit. Ullam, nemo!
     
-  - types : design development
+  - types : design, development
     image : images/portfolio/portfolio-3.jpg
     icon : tf-ion-android-search
     URL : #
     title : Clock Product
     description : Lorem ipsum dolor sit amet consectetur adipisicing elit. Ullam, nemo!
     
-  - types : photography development
+  - types : photography, development
     image : images/portfolio/portfolio-4.jpg
     icon : tf-ion-android-search
     URL : #
@@ -61,14 +61,14 @@ portfolioItem :
     title : Business Card
     description : Lorem ipsum dolor sit amet consectetur adipisicing elit. Ullam, nemo!
     
-  - types : design development
+  - types : design, development
     image : images/portfolio/portfolio-8.jpg
     icon : tf-ion-android-search
     URL : #
     title : Stationary Design
     description : Lorem ipsum dolor sit amet consectetur adipisicing elit. Ullam, nemo!
     
-  - types : design photography
+  - types : design, photography
     image : images/portfolio/portfolio-2.jpg
     icon : tf-ion-android-search
     URL : #

layouts/partials/footer.html

@@ -19,7 +19,6 @@
 						<img src="{{ .Site.Params.logo | absURL }}" alt="Meghna" />
 					</a>
 					<br>
-
 					<p>Design And Developed by <a href="{{ .Site.Params.footer.copyrightURL | absURL }}"> {{ with .Site.Params.footer.copyright }} {{ . }} {{ end }} </a>. Copyright &copy; <script>
 							document.write(new Date().getFullYear())
 						</script>. All Rights Reserved.</p>
@@ -39,7 +38,7 @@
 		{{"<!-- Slick Carousel -->" | safeHTML}}
 		<script type="text/javascript" src="{{ "plugins/slick-carousel/slick/slick.min.js" | absURL}}"></script>
 		{{"<!-- Portfolio Filtering -->" | safeHTML}}
-		<script type="text/javascript" src="{{ "plugins/mixitup/mixitup.min.js" | absURL}}"></script>
+		<script type="text/javascript" src="{{ "plugins/filterzr/jquery.filterizr.min.js" | absURL}}"></script>
 		{{"<!-- Magnific popup -->" | safeHTML}}
 		<script type="text/javascript" src="{{ "plugins/magnific-popup/dist/jquery.magnific-popup.min.js" | absURL}}"></script>
 		{{"<!-- Google Map API -->" | safeHTML}}

layouts/partials/portfolio.html

@@ -17,21 +17,19 @@
                 <div class="portfolio-filter">
                     <button type="button" data-filter="all">All</button>
                     {{ range .Site.Data.portfolio.filterList }}
-                    <button type="button" data-filter=".{{ .filterType }}">{{ .filterTitle }}</button>
+                    <button type="button" data-filter="{{ .filterType }}">{{ .filterTitle }}</button>
                     {{ end }}
                 </div>
             </div>
         </div>
-        <div class="row portfolio-items-wrapper">
+        <div class="row filtr-container">
             {{"<!-- portfolio item -->" | safeHTML}}
             {{ range .Site.Data.portfolio.portfolioItem }}
-            <div class="mix col-lg-4 {{ .types }}">
-                <div class="portfolio-block">
+            <div class="col-lg-4 filtr-item" data-category="{{ .types }}">
+                <div class="portfolio-block mb-4">
                     <img class="img-fluid" src="{{ .image | absURL}}" alt="work-image">
                     <div class="caption">
-
-                        <a class="search-icon image-popup" data-effect="mfp-with-zoom" href="{{ .image | absURL}}"
-                            data-lightbox="image-1">
+                        <a class="search-icon image-popup" data-effect="mfp-with-zoom" href="{{ .image | absURL}}" data-lightbox="image-1">
                             <i class="{{ .icon }}"></i>
                         </a>
                         <h4><a href="{{ .URL | absURL }}">{{ .title }}</a></h4>

static/plugins/jQuery-nav/jquery.nav.js

@@ -1,223 +0,0 @@
-/*
- * jQuery One Page Nav Plugin
- * http://github.com/davist11/jQuery-One-Page-Nav
- *
- * Copyright (c) 2010 Trevor Davis (http://trevordavis.net)
- * Dual licensed under the MIT and GPL licenses.
- * Uses the same license as jQuery, see:
- * http://jquery.org/license
- *
- * @version 3.0.0
- *
- * Example usage:
- * $('#nav').onePageNav({
- *   currentClass: 'current',
- *   changeHash: false,
- *   scrollSpeed: 750
- * });
- */
-
-;(function($, window, document, undefined){
-
-	// our plugin constructor
-	var OnePageNav = function(elem, options){
-		this.elem = elem;
-		this.$elem = $(elem);
-		this.options = options;
-		this.metadata = this.$elem.data('plugin-options');
-		this.$win = $(window);
-		this.sections = {};
-		this.didScroll = false;
-		this.$doc = $(document);
-		this.docHeight = this.$doc.height();
-	};
-
-	// the plugin prototype
-	OnePageNav.prototype = {
-		defaults: {
-			navItems: 'a',
-			currentClass: 'current',
-			changeHash: false,
-			easing: 'swing',
-			filter: '',
-			scrollSpeed: 750,
-			scrollThreshold: 0.5,
-			begin: false,
-			end: false,
-			scrollChange: false
-		},
-
-		init: function() {
-			// Introduce defaults that can be extended either
-			// globally or using an object literal.
-			this.config = $.extend({}, this.defaults, this.options, this.metadata);
-
-			this.$nav = this.$elem.find(this.config.navItems);
-
-			//Filter any links out of the nav
-			if(this.config.filter !== '') {
-				this.$nav = this.$nav.filter(this.config.filter);
-			}
-
-			//Handle clicks on the nav
-			this.$nav.on('click.onePageNav', $.proxy(this.handleClick, this));
-
-			//Get the section positions
-			this.getPositions();
-
-			//Handle scroll changes
-			this.bindInterval();
-
-			//Update the positions on resize too
-			this.$win.on('resize.onePageNav', $.proxy(this.getPositions, this));
-
-			return this;
-		},
-
-		adjustNav: function(self, $parent) {
-			self.$elem.find('.' + self.config.currentClass).removeClass(self.config.currentClass);
-			$parent.addClass(self.config.currentClass);
-		},
-
-		bindInterval: function() {
-			var self = this;
-			var docHeight;
-
-			self.$win.on('scroll.onePageNav', function() {
-				self.didScroll = true;
-			});
-
-			self.t = setInterval(function() {
-				docHeight = self.$doc.height();
-
-				//If it was scrolled
-				if(self.didScroll) {
-					self.didScroll = false;
-					self.scrollChange();
-				}
-
-				//If the document height changes
-				if(docHeight !== self.docHeight) {
-					self.docHeight = docHeight;
-					self.getPositions();
-				}
-			}, 250);
-		},
-
-		getHash: function($link) {
-			return $link.attr('href').split('#')[1];
-		},
-
-		getPositions: function() {
-			var self = this;
-			var linkHref;
-			var topPos;
-			var $target;
-
-			self.$nav.each(function() {
-				linkHref = self.getHash($(this));
-				$target = $('#' + linkHref);
-
-				if($target.length) {
-					topPos = $target.offset().top;
-					self.sections[linkHref] = Math.round(topPos);
-				}
-			});
-		},
-
-		getSection: function(windowPos) {
-			var returnValue = null;
-			var windowHeight = Math.round(this.$win.height() * this.config.scrollThreshold);
-
-			for(var section in this.sections) {
-				if((this.sections[section] - windowHeight) < windowPos) {
-					returnValue = section;
-				}
-			}
-
-			return returnValue;
-		},
-
-		handleClick: function(e) {
-			var self = this;
-			var $link = $(e.currentTarget);
-			var $parent = $link.parent();
-			var newLoc = '#' + self.getHash($link);
-
-			if(!$parent.hasClass(self.config.currentClass)) {
-				//Start callback
-				if(self.config.begin) {
-					self.config.begin();
-				}
-
-				//Change the highlighted nav item
-				self.adjustNav(self, $parent);
-
-				//Removing the auto-adjust on scroll
-				self.unbindInterval();
-
-				//Scroll to the correct position
-				self.scrollTo(newLoc, function() {
-					//Do we need to change the hash?
-					if(self.config.changeHash) {
-						window.location.hash = newLoc;
-					}
-
-					//Add the auto-adjust on scroll back in
-					self.bindInterval();
-
-					//End callback
-					if(self.config.end) {
-						self.config.end();
-					}
-				});
-			}
-
-			e.preventDefault();
-		},
-
-		scrollChange: function() {
-			var windowTop = this.$win.scrollTop();
-			var position = this.getSection(windowTop);
-			var $parent;
-
-			//If the position is set
-			if(position !== null) {
-				$parent = this.$elem.find('a[href$="#' + position + '"]').parent();
-
-				//If it's not already the current section
-				if(!$parent.hasClass(this.config.currentClass)) {
-					//Change the highlighted nav item
-					this.adjustNav(this, $parent);
-
-					//If there is a scrollChange callback
-					if(this.config.scrollChange) {
-						this.config.scrollChange($parent);
-					}
-				}
-			}
-		},
-
-		scrollTo: function(target, callback) {
-			var offset = $(target).offset().top;
-
-			$('html, body').animate({
-				scrollTop: offset
-			}, this.config.scrollSpeed, this.config.easing, callback);
-		},
-
-		unbindInterval: function() {
-			clearInterval(this.t);
-			this.$win.unbind('scroll.onePageNav');
-		}
-	};
-
-	OnePageNav.defaults = OnePageNav.prototype.defaults;
-
-	$.fn.onePageNav = function(options) {
-		return this.each(function() {
-			new OnePageNav(this, options).init();
-		});
-	};
-
-})( jQuery, window , document );