facetapi

gistfile1.js

(function($) {

	// console.log('RPCHANGE');

	// RPCHANGE: 
	// Updating a query string on a HREF string
	// http://stackoverflow.com/questions/5999118/add-or-update-query-string-parameter
	// Use this to add/remove 'openfacet' paramater to each HREF inside the facets
	// Add when facet is open
	// Remove when facet is closed 
	// When the page next loads jQuery finds this paramater and opens the correct facet
	var updateQueryString = function(key, value, url) {

		if (!url) url = window.location.href;
		var re = new RegExp("([?|&])" + key + "=.*?(&|#|$)", "gi");

		if (url.match(re)) {

			if (value) return url.replace(re, '$1' + key + "=" + value + '$2');
			else return url.replace(re, '$2');

		} else {

			if (value) {

				var separator = url.indexOf('?') !== -1 ? '&' : '?',
					hash = url.split('#');
				url = hash[0] + separator + key + '=' + value;
				if (hash[1]) url += '#' + hash[1];
				return url;

			} else {

				return url;

			}
		}
	};



	// RPCHANGE:
	// Returns an object of key, value pairs that match the params in the URL 
	// Each key in the object is a param in the url
	// Its value is that params value
	// taken from: http://papermashup.com/read-url-get-variables-withjavascript/


	function getUrlVars() {
		var vars = {};
		var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m, key, value) {
			vars[key] = value;
		});
		return vars;
	}


	Drupal.behaviors.facetapi = {
		attach: function(context, settings) {
			// Iterates over facet settings, applies functionality like the "Show more"
			// links for block realm facets.
			// @todo We need some sort of JS API so we don't have to make decisions
			// based on the realm.
			if (settings.facetapi) {
				for (var index in settings.facetapi.facets) {
					if (null != settings.facetapi.facets[index].makeCheckboxes) {
						// Find all checkbox facet links and give them a checkbox.
						$('#' + settings.facetapi.facets[index].id + ' a.facetapi-checkbox', context).each(Drupal.facetapi.makeCheckbox);
					}
					if (null != settings.facetapi.facets[index].limit) {
						// Applies soft limit to the list.
						Drupal.facetapi.applyLimit(settings.facetapi.facets[index]);
					}
				}
			}
		}
	}


	/**
	 * Class containing functionality for Facet API.
	 */
	Drupal.facetapi = {}



	/**
	 * Applies the soft limit to facets in the block realm.
	 */
	Drupal.facetapi.applyLimit = function(settings) {

		if (settings.limit > 0 && !$('ul#' + settings.id).hasClass('facetapi-processed')) {

			// Only process this code once per page load.
			$('ul#' + settings.id).addClass('facetapi-processed');

			// Ensures our limit is zero-based, hides facets over the limit.
			var limit = settings.limit - 1;
			
			// RPCHANGE:
			var params = getUrlVars();


			// Adds "Show more" / "Show fewer" links as appropriate.
			$('ul#' + settings.id).filter(function() {

				return $(this).find('li').length > settings.limit;

			}).each(function() {

				var thisFacetId = $(this).parents('.block').attr('id');
				var thisMoreLinkText = Drupal.t('Show more');

				// RPCHANGE:
				if ( thisFacetId ===  params.openfacet ) {

					// console.log( 'this is open: ', $(this) );
					thisMoreLinkText = 'show fewer';
					

				} else {

					// console.log( 'this is closed: ', $(this) );

					$('ul#' + settings.id).find('li:gt(' + limit + ')').hide();

				}

				$('<a href="#" class="facetapi-limit-link"></a>').text( thisMoreLinkText ).click(function() {

					// console.log('click');

					// RPCHANGE: 
					var facetId;

					// Show
					if ($(this).prev().find('li:hidden').length > 0) {

						// console.log('show');

						// RPCHANGE:
						// Grab this ID from the facets parent '.block'
						// e.g: <section class="block..." id="block=facetapi-xyz">
						// Then we update the 'openfacet' paramater in each HREF inside a facet
						// When the page next loads jQuery finds this paramater and opens the correct facet
						facetId = $('.facetapi-limit-link').parents('.block').attr('id');

						$(this).prev().find('li:gt(' + limit + ')').slideDown();
						$(this).addClass('open').text(Drupal.t('Show fewer'));

						// Hide
					} else {

						// console.log('hide');

						$(this).prev().find('li:gt(' + limit + ')').slideUp();
						$(this).removeClass('open').text(Drupal.t('Show more'));

					}

					// console.log('id: ', facetId);

					// RPCHANGE:
					// Loop through each anchor belonging to a facet
					// Update its the 'openfacet' param for its href
					// If the user just opened a facet the param will be the id of that facet
					// If the user just closed a facet the param will be removed
					$('.block-facetapi a.facetapi-checkbox-processed').each(function() {
						var newHref = updateQueryString('openfacet', facetId, $(this).attr('href'))
						$(this).attr('href', newHref)
					})

					return false;

				}).insertAfter($(this));

			});

		}

	}


	/**
	 * Constructor for the facetapi redirect class.
	 */
	Drupal.facetapi.Redirect = function(href) {
		this.href = href;
	}

	/**
	 * Method to redirect to the stored href.
	 */
	Drupal.facetapi.Redirect.prototype.gotoHref = function() {
		window.location.href = this.href;
	}

	/**
	 * Replace an unclick link with a checked checkbox.
	 */
	Drupal.facetapi.makeCheckbox = function() {
		var $link = $(this);
		if (!$link.hasClass('facetapi-checkbox-processed')) {
			var active;
			if ($link.hasClass('facetapi-inactive')) {
				active = false;
			} else if ($link.hasClass('facetapi-active')) {
				active = true;
			} else {
				// Not a facet link.
				return;
			}
			var checkbox = active ? $('<input type="checkbox" class="facetapi-checkbox" checked="true" />') : $('<input type="checkbox" class="facetapi-checkbox" />');
			// Get the href of the link that is this DOM object.
			var href = $link.attr('href');
			redirect = new Drupal.facetapi.Redirect(href);
			checkbox.click($.proxy(redirect, 'gotoHref'));
			if (active) {
				// Add the checkbox, hide the link.
				$link.before(checkbox).hide();
			} else {
				$link.before(checkbox);
			}
			$link.removeClass('facetapi-checkbox').addClass('facetapi-checkbox-processed');
		}
	}


	// RPCHANGE:
	// THIS ENTIRE DOC READY
	// When the page loads we check if there is a 'openfacet' param in the URL
	// If there is we use it to open that facet
	// $(document).ready(function() {

	// 	// I've added this delay because
	// 	// I'm not sure of the execution order of 
	// 	// the drupal code to initialise this page
	// 	setTimeout(function() {

	// 		var params = getUrlVars();
	// 		var openfacetId = params.openfacet;
	// 		var $openFacet

	// 		// There is an openfacet param in the URL
	// 		// It was set the last time the page loaded
	// 		if (params.openfacet) {

	// 			// The wrapper for the open facet
	// 			// e.g: <section class="block ... " id="block-facetapi-xyz...">
	// 			$openFacet = $('#' + params.openfacet)

	// 			// Expand the list items & chaneg the toggle text
	// 			$openFacet.find('li').slideDown(0);
	// 			$openFacet.find('.facetapi-limit-link').text('show fewer')

	// 		}

	// 	}, 200);

	// })



}(jQuery))