BIM-Monitor/assets/javascripts/pages/examples.mediagallery.js

(function ($) {
	$("#switch").click(function () {
		if ($(this).hasClass('btn-default')) {
			$("#caret").css('transform', 'rotate(180deg)')
			$(this).removeClass('btn-default');
			$(this).addClass('btn-primary');
			$("#filter-content").fadeIn();
		} else {
			$("#caret").css('transform', 'rotate(0deg)')
			$(this).addClass('btn-default');
			$(this).removeClass('btn-primary');
			$("#filter-content").fadeOut();
		}
	});
	/*
	Thumbnail: Select
	*/
	$('.mg-option input[type=checkbox]').on('change', function (ev) {
		var wrapper = $(this).parents('.thumbnail');
		if ($(this).is(':checked')) {
			wrapper.addClass('thumbnail-selected');
		} else {
			wrapper.removeClass('thumbnail-selected');
		}
	});

	$('.mg-option input[type=checkbox]:checked').trigger('change');

	/*
	Toolbar: Select All
	*/
	$('#mgSelectAll').on('click', function (ev) {		
		ev.preventDefault();
		var $this = $(this),
			$label = $this.find('> span');
		$checks = $("input[name='delCheck']")

		if ($this.attr('data-all-selected')) {
			$this.removeAttr('data-all-selected');
			$checks.prop('checked', false).trigger('change');
			$label.html($label.data('all-text'));
		} else {
			$this.attr('data-all-selected', 'true');
			$checks.prop('checked', true).trigger('change');
			$label.html($label.data('none-text'));
		}
	});

	/*
	Image Preview: Lightbox
	*/
	$('.thumb-preview a[href]').magnificPopup({
		type: 'image',
		closeOnContentClick: true,
		mainClass: 'mfp-img-mobile',
		image: {
			verticalFit: true
		}
	});

	$('.thumb-preview .mg-zoom').on('click.lightbox', function (ev) {
		ev.preventDefault();
		$(this).closest('.thumb-preview').find('a.thumb-image').triggerHandler('click');
	});

	/*
	Thumnail: Dropdown Options
	*/
	$('.thumbnail .mg-toggle').parent()
		.on('show.bs.dropdown', function (ev) {
			$(this).closest('.mg-thumb-options').css('overflow', 'visible');
		})
		.on('hidden.bs.dropdown', function (ev) {
			$(this).closest('.mg-thumb-options').css('overflow', '');
		});

	$('.thumbnail').on('mouseenter', function () {
		var toggle = $(this).find('.mg-toggle');
		if (toggle.parent().hasClass('open')) {
			toggle.dropdown('toggle');
		}
	});


	var destination = $("[data-sort-destination]");
	var $grid;


	/*$(window).load(function () {
		
	});*/

	function Filter() {
		var $this = $(this);
		var searchResult = qsRegex ? $this.text().match(qsRegex) : true;
		var buttonResult = buttonFilter ? $this.is(buttonFilter) : true;
		var comboResult = comboFilter ? $this.is(comboFilter) : true;
		return searchResult && buttonResult && comboResult;
	}

	var buttonFilters = {};
	var buttonFilter;
	// quick search regex
	var qsRegex;
	var comboFilter;

	var $quicksearch = $('#quicksearch').keyup(debounce(function () {
		qsRegex = new RegExp($quicksearch.val(), 'gi');
		$grid.isotope({
			filter: Filter
		});
	}));


	// debounce so filtering doesn't happen every millisecond
	function debounce(fn, threshold) {
		var timeout;
		threshold = threshold || 100;
		return function debounced() {
			clearTimeout(timeout);
			var args = arguments;
			var _this = this;

			function delayed() {
				fn.apply(_this, args);
			}
			timeout = setTimeout(delayed, threshold);
		};
	}

	function concatValues(obj) {
		var value = '';
		for (var prop in obj) {
			value += obj[prop];
		}
		return value;
	}

	$('.button-group').each(function (i, buttonGroup) {
		var $buttonGroup = $(buttonGroup);
		$buttonGroup.on('click', 'a', function () {
			$buttonGroup.find('.active').removeClass('active');
			$(this).parents('li').addClass('active');
		});
	});

	$('.filters').on('click', '.button', function () {
		var $this = $(this);
		// get group key
		var $buttonGroup = $this.parents('.button-group');
		var filterGroup = $buttonGroup.attr('data-filter-group');
		// set filter for group
		buttonFilters[filterGroup] = $this.attr('data-filter');
		// combine filters
		buttonFilter = concatValues(buttonFilters);
		// Isotope arrange
		$grid.isotope({
			filter: Filter
		});

	});

	// store filter per group
	var filters = {};

	// do stuff when checkbox change
	$('#options').on('change', function (event) {
		var checkbox = event.target;
		var $checkbox = $(checkbox);
		var group = $checkbox.parents('.option-set').attr('data-group');
		// create array for filter group, if not there yet
		var filterGroup = filters[group];
		if (!filterGroup) {
			filterGroup = filters[group] = [];
		}
		// add/remove filter
		if (checkbox.checked) {
			// add filter
			filterGroup.push(checkbox.value);
		} else {
			// remove filter
			var index = filterGroup.indexOf(checkbox.value);
			filterGroup.splice(index, 1);
		}

		comboFilter = getComboFilter();
		$grid.isotope({
			filter: Filter
		});
	});



	function getComboFilter() {
		var combo = [];
		for (var prop in filters) {
			var group = filters[prop];
			if (!group.length) {
				// no filters in group, carry on
				continue;
			}
			// add first group
			if (!combo.length) {
				combo = group.slice(0);
				continue;
			}
			// add additional groups
			var nextCombo = [];
			// split group into combo: [ A, B ] & [ 1, 2 ] => [ A1, A2, B1, B2 ]
			for (var i = 0; i < combo.length; i++) {
				for (var j = 0; j < group.length; j++) {
					var item = combo[i] + group[j];
					nextCombo.push(item);
				}
			}
			combo = nextCombo;
		}
		var comboFilter = combo.join(', ');
		return comboFilter;
	}
}(jQuery));