(function ($) {
- function JQtaglist(element) {
+ function JQtaglist(element) {
- // Store name of the list
- this.storageID = $(element).parent().attr('id') + '-filter';
+ // Store name of the list
+ this.storageID = $(element).parent().attr('id') + '-filter';
- this.element = element;
- this.columnWidth = parseInt(this.element.data('column-width'));
- this.gutter = parseInt(this.element.data('gutter'));
- this.list = $(this.element.data('list'));
- this.container = $(this.list);
+ this.element = element;
+ this.columnWidth = parseInt(this.element.data('column-width'));
+ this.gutter = parseInt(this.element.data('gutter'));
+ this.list = $(this.element.data('list'));
+ this.container = $(this.list);
- // Store font size for headings - used to scale fonts in resize function
- this.headingSize = parseInt($(this.container).find('h2').css('font-size'));
+ // Store font size for headings - used to scale fonts in resize function
+ this.headingSize = parseInt($(this.container).find('h2').css('font-size'));
- // Persist filter settings
- var initFilter = 0;
- if (Modernizr.sessionstorage) {
- var f = sessionStorage.getItem(this.storageID);
- if (f !== null) {
- initFilter = f;
- }
- }
+ // Persist filter settings
+ var initFilter = 0;
+ if (Modernizr.sessionstorage) {
+ var f = sessionStorage.getItem(this.storageID);
+ if (f !== null) {
+ initFilter = f;
+ }
+ }
- this.init(initFilter);
- }
+ this.init(initFilter);
+ }
- JQtaglist.prototype = {
- init: function (initFilter) {
- var $this = this;
+ JQtaglist.prototype = {
+ init: function (initFilter) {
+ var $this = this;
// Clear filter first...
$this.filter('none'); // Dummy value so nothing is selected
- // Set up Isotope
- this.container.isotope({
- itemSelector: 'a',
- layoutMode: 'masonry',
- masonry: {
- columnWidth: this.columnWidth,
- gutter: this.gutter
- },
- animationOptions: {
- duration: 750,
- easing: 'linear',
- queue: false
- }
- // hiddenStyle: {
- // opacity: 0,
- // transform: 'scale(2)'
- // },
- // visibleStyle: {
- // opacity: 1,
- // transform: 'scale(1)'
- // }
- });
+ // Set up Isotope
+ this.container.isotope({
+ itemSelector: 'a',
+ layoutMode: 'masonry',
+ masonry: {
+ columnWidth: this.columnWidth,
+ gutter: this.gutter
+ },
+ animationOptions: {
+ duration: 750,
+ easing: 'linear',
+ queue: false
+ }
+ // hiddenStyle: {
+ // opacity: 0,
+ // transform: 'scale(2)'
+ // },
+ // visibleStyle: {
+ // opacity: 1,
+ // transform: 'scale(1)'
+ // }
+ });
// Show the container now Isotope is active
this.container.css('display', 'block');
//var iso = this.container.data('isotope');
//this.container.isotope( 'reveal', iso.items );
- // Also handle resizing of the window
- $(window).on('cubeitresize', function () {
- $this.resize();
- });
- $this.resize();
- window.setTimeout(function () {
- $this.resize();
- }, 500);
+ // Also handle resizing of the window
+ $(window).on('cubeitresize', function () {
+ $this.resize();
+ });
+ $this.resize();
+ window.setTimeout(function () {
+ $this.resize();
+ }, 500);
- // Make sure grid is sized properly once page has loaded fully
- $(window).load(function () {
- $this.resize();
- });
+ // Make sure grid is sized properly once page has loaded fully
+ $(window).on('load', function () {
+ $this.resize();
+ });
- // Set up filter buttons
- $('.tags li').click(function () {
- $('.tags li.active').removeClass('active');
- $(this).addClass('active');
+ // Set up filter buttons
+ $('.tags li').click(function () {
+ $('.tags li.active').removeClass('active');
+ $(this).addClass('active');
- var filterID = $(this).data('id');
+ var filterID = $(this).data('id');
- $this.filter(filterID);
+ $this.filter(filterID);
- return false;
- });
+ return false;
+ });
- },
- filter: function (id) {
+ },
+ filter: function (id) {
- //fb('Filter ID: ' + id);
+ //fb('Filter ID: ' + id);
- // Select button
- this.element.find('.active').removeClass('active');
- this.element.find('[data-id="' + id + '"]').addClass('active');
+ // Select button
+ this.element.find('.active').removeClass('active');
+ this.element.find('[data-id="' + id + '"]').addClass('active');
- var filterClass;
+ var filterClass;
- if (id == 0) {
- filterClass = '*';
- } else {
- filterClass = '[data-cat="' + id + '"]';
- }
+ if (id == 0) {
+ filterClass = '*';
+ } else {
+ filterClass = '[data-cat="' + id + '"]';
+ }
- //fb('Filtering... ' + filterClass);
- this.container.isotope({
- filter: filterClass
- });
+ //fb('Filtering... ' + filterClass);
+ this.container.isotope({
+ filter: filterClass
+ });
- // Save filter for future sessions
- if (Modernizr.sessionstorage) {
- sessionStorage.setItem(this.storageID, id);
- }
- },
- resize: function () {
+ // Save filter for future sessions
+ if (Modernizr.sessionstorage) {
+ sessionStorage.setItem(this.storageID, id);
+ }
+ },
+ resize: function () {
- //fb('Running resize...');
+ //fb('Running resize...');
- var container = this.container
- var margin = this.gutter;
- var naturalWidth = this.columnWidth;
- var scaleFactor = 1;
+ var container = this.container
+ var margin = this.gutter;
+ var naturalWidth = this.columnWidth;
+ var scaleFactor = 1;
- var ww = Math.min($(window).width(), 1048);
+ var ww = Math.min($(window).width(), 1048);
ww -= 68; // Remove margins
- // Handle extra padding that is added for small screens
- //if ($('html').hasClass('small')) {
- // ww = ww - parseInt($('#main .content').css('paddingLeft')) - parseInt($('#main .content').css('paddingRight'));
- // ww = ww - 68;
- //}
-
- var nbcol = Math.ceil(ww / (naturalWidth + margin));
- var ew = Math.floor((ww - (margin * (nbcol - 1))) / nbcol);
- if (ew > naturalWidth) {
- nbcol++; // Add a column when elements are too big
- ew = Math.floor((ww - (margin * (nbcol - 1))) / nbcol);
- }
-
- // Dynamically size text based on element width
- if (ew < naturalWidth) {
- scaleFactor = ew / naturalWidth;
- $(container).find('h2').css('font-size', Math.ceil(scaleFactor * this.headingSize));
- }
-
- // Resize elements
- var a = $(container).find('a');
- $(a).css('width', ew);
- var naturalHeight = $(a).find('img').attr('height');
- var imageRatio = naturalWidth / naturalHeight;
- $(a).find('img').css({width: ew, height: ew / imageRatio});
- $(a).find('.img-wrapper').css({width: ew, height: ew / imageRatio});
-
- // Reset isotope grid
- $(container).isotope({
- masonry: {
- columnWidth: ew,
- gutter: margin
- }
- });
-
- }
-
- };
-
- jQuery.fn.taglist = function () {
- return this.each(function () {
- var $this = $(this);
- $(this).data('taglist', new JQtaglist($this));
- });
- };
+ // Handle extra padding that is added for small screens
+ //if ($('html').hasClass('small')) {
+ // ww = ww - parseInt($('#main .content').css('paddingLeft')) - parseInt($('#main .content').css('paddingRight'));
+ // ww = ww - 68;
+ //}
+
+ var nbcol = Math.ceil(ww / (naturalWidth + margin));
+ var ew = Math.floor((ww - (margin * (nbcol - 1))) / nbcol);
+ if (ew > naturalWidth) {
+ nbcol++; // Add a column when elements are too big
+ ew = Math.floor((ww - (margin * (nbcol - 1))) / nbcol);
+ }
+
+ // Dynamically size text based on element width
+ if (ew < naturalWidth) {
+ scaleFactor = ew / naturalWidth;
+ $(container).find('h2').css('font-size', Math.ceil(scaleFactor * this.headingSize));
+ }
+
+ // Resize elements
+ var a = $(container).find('a');
+ $(a).css('width', ew);
+ var naturalHeight = $(a).find('img').attr('height');
+ var imageRatio = naturalWidth / naturalHeight;
+ $(a).find('img').css({width: ew, height: ew / imageRatio});
+ $(a).find('.img-wrapper').css({width: ew, height: ew / imageRatio});
+
+ // Reset isotope grid
+ $(container).isotope({
+ masonry: {
+ columnWidth: ew,
+ gutter: margin
+ }
+ });
+
+ }
+
+ };
+
+ jQuery.fn.taglist = function () {
+ return this.each(function () {
+ var $this = $(this);
+ $(this).data('taglist', new JQtaglist($this));
+ });
+ };
})(jQuery);
function load_taglist() {
- $('#main').css('overflow-y', 'hidden'); // Stops extra scrollbars appearing
+ $('#main').css('overflow-y', 'hidden'); // Stops extra scrollbars appearing
- $('ul.tags').taglist();
+ $('ul.tags').taglist();
}
\ No newline at end of file