Browse files

Added a base Foundation install

  • Loading branch information...
1 parent d556e75 commit 924774c5bd2cc27491fd13b65359b9519c3243e7 @smileyj68 smileyj68 committed Aug 17, 2012
View
8 humans.txt
@@ -0,0 +1,8 @@
+/* Foundation was made by ZURB, an interaction design and design strategy firm in Campbell, CA */
+/* zurb.com */
+/* humanstxt.org */
+
+/* SITE */
+ Standards: HTML5, CSS3
+ Components: jQuery, Orbit, Reveal
+ Software: Coda, Textmate, Git
View
BIN images/foundation/orbit/bullets.jpg
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN images/foundation/orbit/left-arrow-small.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN images/foundation/orbit/left-arrow.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN images/foundation/orbit/loading.gif
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN images/foundation/orbit/mask-black.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN images/foundation/orbit/pause-black.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN images/foundation/orbit/right-arrow-small.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN images/foundation/orbit/right-arrow.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN images/foundation/orbit/rotator-black.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN images/foundation/orbit/timer-black.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
201 index.html
@@ -0,0 +1,201 @@
+<!DOCTYPE html>
+
+<!-- paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/ -->
+<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang="en"> <![endif]-->
+<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8" lang="en"> <![endif]-->
+<!--[if IE 8]> <html class="no-js lt-ie9" lang="en"> <![endif]-->
+<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
+<head>
+ <meta charset="utf-8" />
+
+ <!-- Set the viewport width to device width for mobile -->
+ <meta name="viewport" content="width=device-width" />
+
+ <title>Welcome to Foundation</title>
+
+ <!-- Included CSS Files (Uncompressed) -->
+ <!--
+ <link rel="stylesheet" href="stylesheets/foundation.css">
+ -->
+
+ <!-- Included CSS Files (Compressed) -->
+ <link rel="stylesheet" href="stylesheets/foundation.min.css">
+ <link rel="stylesheet" href="stylesheets/app.css">
+
+ <script src="javascripts/modernizr.foundation.js"></script>
+
+ <!-- IE Fix for HTML5 Tags -->
+ <!--[if lt IE 9]>
+ <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
+ <![endif]-->
+
+</head>
+<body>
+
+ <div class="row">
+ <div class="twelve columns">
+ <h2>Welcome to Foundation</h2>
+ <p>This is version <strong>3.0.9</strong> generated on August 15, 2012.</p>
+ <hr />
+ </div>
+ </div>
+
+ <div class="row">
+ <div class="eight columns">
+ <h3>The Grid</h3>
+
+ <!-- Grid Example -->
+ <div class="row">
+ <div class="twelve columns">
+ <div class="panel">
+ <p>This is a twelve column section in a row. Each of these includes a div.panel element so you can see where the columns are - it's not required at all for the grid.</p>
+ </div>
+ </div>
+ </div>
+ <div class="row">
+ <div class="six columns">
+ <div class="panel">
+ <p>Six columns</p>
+ </div>
+ </div>
+ <div class="six columns">
+ <div class="panel">
+ <p>Six columns</p>
+ </div>
+ </div>
+ </div>
+ <div class="row">
+ <div class="four columns">
+ <div class="panel">
+ <p>Four columns</p>
+ </div>
+ </div>
+ <div class="four columns">
+ <div class="panel">
+ <p>Four columns</p>
+ </div>
+ </div>
+ <div class="four columns">
+ <div class="panel">
+ <p>Four columns</p>
+ </div>
+ </div>
+ </div>
+
+
+ <h3>Tabs</h3>
+ <dl class="tabs">
+ <dd class="active"><a href="#simple1">Simple Tab 1</a></dd>
+ <dd><a href="#simple2">Simple Tab 2</a></dd>
+ <dd><a href="#simple3">Simple Tab 3</a></dd>
+ </dl>
+
+ <ul class="tabs-content">
+ <li class="active" id="simple1Tab">This is simple tab 1's content. Pretty neat, huh?</li>
+ <li id="simple2Tab">This is simple tab 2's content. Now you see it!</li>
+ <li id="simple3Tab">This is simple tab 3's content. It's, you know...okay.</li>
+ </ul>
+
+
+
+ <h3>Buttons</h3>
+
+ <div class="row">
+ <div class="six columns">
+ <p><a href="#" class="small button">Small Button</a></p>
+ <p><a href="#" class="button">Medium Button</a></p>
+ <p><a href="#" class="large button">Large Button</a></p>
+ </div>
+ <div class="six columns">
+ <p><a href="#" class="small alert button">Small Alert Button</a></p>
+ <p><a href="#" class="success button">Medium Success Button</a></p>
+ <p><a href="#" class="large secondary button">Large Secondary Button</a></p>
+ </div>
+ </div>
+
+ </div>
+
+ <div class="four columns">
+ <h4>Getting Started</h4>
+ <p>We're stoked you want to try Foundation! To get going, this file (index.html) includes some basic styles you can modify, play around with, or totally destroy to get going.</p>
+
+ <h4>Other Resources</h4>
+ <p>Once you've exhausted the fun in this document, you should check out:</p>
+ <ul class="disc">
+ <li><a href="http://foundation.zurb.com/docs">Foundation Documentation</a><br />Everything you need to know about using the framework.</li>
+ <li><a href="http://github.com/zurb/foundation">Foundation on Github</a><br />Latest code, issue reports, feature requests and more.</li>
+ <li><a href="http://twitter.com/foundationzurb">@foundationzurb</a><br />Ping us on Twitter if you have questions. If you build something with this we'd love to see it (and send you a totally boss sticker).</li>
+ </ul>
+ </div>
+ </div>
+
+
+ <div class="row">
+ <div class="twelve columns">
+ <h3>Orbit</h3>
+ <div id="featured">
+ <img src="http://placehold.it/1200x250&text=Slide_1" alt="slide image">
+ <img src="http://placehold.it/1200x250&text=Slide_2" alt="slide image">
+ <img src="http://placehold.it/1200x250&text=Slide_3" alt="slide image">
+ </div>
+ </div>
+ </div>
+
+
+
+ <div class="row">
+ <div class="twelve columns">
+ <h3>Reveal</h3>
+ <p><a href="#" data-reveal-id="exampleModal" class="button">Example modal</a></p>
+ </div>
+ </div>
+
+ <div id="exampleModal" class="reveal-modal">
+ <h2>This is a modal.</h2>
+ <p>
+ Reveal makes these very easy to summon and dismiss. The close button is simple an anchor with a unicode
+ character icon and a class of <code>close-reveal-modal</code>. Clicking anywhere outside the modal will
+ also dismiss it.
+ </p>
+ <a class="close-reveal-modal">×</a>
+ </div>
+
+
+ <!-- Included JS Files (Uncompressed) -->
+ <!--
+
+ <script src="javascripts/modernizr.foundation.js"></script>
+
+ <script src="javascripts/jquery.js"></script>
+
+ <script src="javascripts/jquery.foundation.mediaQueryToggle.js"></script>
+
+ <script src="javascripts/jquery.foundation.reveal.js"></script>
+
+ <script src="javascripts/jquery.foundation.orbit.js"></script>
+
+ <script src="javascripts/jquery.foundation.navigation.js"></script>
+
+ <script src="javascripts/jquery.foundation.buttons.js"></script>
+
+ <script src="javascripts/jquery.foundation.tabs.js"></script>
+
+ <script src="javascripts/jquery.foundation.forms.js"></script>
+
+ <script src="javascripts/jquery.foundation.tooltips.js"></script>
+
+ <script src="javascripts/jquery.foundation.accordion.js"></script>
+
+ <script src="javascripts/jquery.placeholder.js"></script>
+
+ <script src="javascripts/jquery.foundation.alerts.js"></script>
+
+ -->
+
+ <!-- Included JS Files (Compressed) -->
+ <script src="javascripts/foundation.min.js"></script>
+
+ <!-- Initialize JS Plugins -->
+ <script src="javascripts/app.js"></script>
+</body>
+</html>
View
40 javascripts/app.js
@@ -0,0 +1,40 @@
+(function($){
+ $(function(){
+ $(document).foundationMediaQueryViewer();
+
+ $(document).foundationAlerts();
+ $(document).foundationAccordion();
+ $(document).tooltips();
+ $('input, textarea').placeholder();
+
+
+
+ $(document).foundationButtons();
+
+
+
+ $(document).foundationNavigation();
+
+
+
+ $(document).foundationCustomForms();
+
+
+
+
+ $(document).foundationTabs({callback:$.foundation.customForms.appendCustomMarkup});
+
+
+
+
+ $("#featured").orbit();
+
+
+ // UNCOMMENT THE LINE YOU WANT BELOW IF YOU WANT IE8 SUPPORT AND ARE USING .block-grids
+ // $('.block-grid.two-up>li:nth-child(2n+1)').css({clear: 'left'});
+ // $('.block-grid.three-up>li:nth-child(3n+1)').css({clear: 'left'});
+ // $('.block-grid.four-up>li:nth-child(4n+1)').css({clear: 'left'});
+ // $('.block-grid.five-up>li:nth-child(5n+1)').css({clear: 'left'});
+ });
+
+})(jQuery);
View
52 javascripts/foundation.min.js
52 additions, 0 deletions not shown because the diff is too large. Please use a local Git client to view these changes.
View
15 javascripts/jquery.foundation.accordion.js
@@ -0,0 +1,15 @@
+(function ($){
+
+ $.fn.foundationAccordion = function (options) {
+
+ $(document).on('click.fndtn', '.accordion li', function () {
+ var flyout = $(this).children('.content').first();
+ $('.accordion .content').not(flyout).hide().parent('li').removeClass('active');
+ flyout.show(0, function () {
+ flyout.parent('li').addClass('active');
+ });
+ });
+
+ };
+
+})( jQuery );
View
19 javascripts/jquery.foundation.alerts.js
@@ -0,0 +1,19 @@
+(function ($) {
+
+ $.fn.foundationAlerts = function (options) {
+ var settings = $.extend({
+ callback: $.noop
+ }, options);
+
+ $(document).on("click", ".alert-box a.close", function (event) {
+ event.preventDefault();
+ $(this).closest(".alert-box").fadeOut(function (event) {
+ $(this).remove();
+ // Do something else after the alert closes
+ settings.callback();
+ });
+ });
+
+ };
+
+})(jQuery);
View
49 javascripts/jquery.foundation.buttons.js
@@ -0,0 +1,49 @@
+(function ($) {
+
+ $.fn.foundationButtons = function(options) {
+ // Prevent event propagation on disabled buttons
+ $(document).on('click.fndtn', '.button.disabled', function (e) {
+ e.preventDefault();
+ });
+
+ $('.button.dropdown > ul', this).addClass('no-hover');
+
+ $(document).on('click.fndtn', '.button.dropdown, .button.dropdown.split span', function (e) {
+ // Stops further propagation of the event up the DOM tree when clicked on the button.
+ // Events fired by its descendants are not being blocked.
+ if (e.target === this) {
+ e.stopPropagation();
+ }
+ });
+ $(document).on('click.fndtn', '.button.dropdown.split span', function (e) {
+ e.preventDefault();
+ $('.button.dropdown', this).not($(this).parent()).children('ul').removeClass('show-dropdown');
+ $(this).siblings('ul').toggleClass('show-dropdown');
+ });
+ $(document).on('click.fndtn', '.button.dropdown:not(.split)', function (e) {
+ $('.button.dropdown', this).not(this).children('ul').removeClass('show-dropdown');
+ $(this).children('ul').toggleClass('show-dropdown');
+ });
+ $(document).on('click.fndtn', 'body, html', function () {
+ $('.button.dropdown ul').removeClass('show-dropdown');
+ });
+
+ // Positioning the Flyout List
+ var normalButtonHeight = $('.button.dropdown:not(.large):not(.small):not(.tiny)', this).outerHeight() - 1,
+ largeButtonHeight = $('.button.large.dropdown', this).outerHeight() - 1,
+ smallButtonHeight = $('.button.small.dropdown', this).outerHeight() - 1,
+ tinyButtonHeight = $('.button.tiny.dropdown', this).outerHeight() - 1;
+
+ $('.button.dropdown:not(.large):not(.small):not(.tiny) > ul', this).css('top', normalButtonHeight);
+ $('.button.dropdown.large > ul', this).css('top', largeButtonHeight);
+ $('.button.dropdown.small > ul', this).css('top', smallButtonHeight);
+ $('.button.dropdown.tiny > ul', this).css('top', tinyButtonHeight);
+
+ $('.button.dropdown.up:not(.large):not(.small):not(.tiny) > ul', this).css('top', 'auto').css('bottom', normalButtonHeight - 2);
+ $('.button.dropdown.up.large > ul', this).css('top', 'auto').css('bottom', largeButtonHeight - 2);
+ $('.button.dropdown.up.small > ul', this).css('top', 'auto').css('bottom', smallButtonHeight - 2);
+ $('.button.dropdown.up.tiny > ul', this).css('top', 'auto').css('bottom', tinyButtonHeight - 2);
+
+ };
+
+})( jQuery );
View
483 javascripts/jquery.foundation.forms.js
@@ -0,0 +1,483 @@
+/*
+ * jQuery Custom Forms Plugin 1.0
+ * www.ZURB.com
+ * Copyright 2010, ZURB
+ * Free to use under the MIT license.
+ * http://www.opensource.org/licenses/mit-license.php
+*/
+
+(function( $ ){
+
+ /**
+ * Helper object used to quickly adjust all hidden parent element's, display and visibility properties.
+ * This is currently used for the custom drop downs. When the dropdowns are contained within a reveal modal
+ * we cannot accurately determine the list-item elements width property, since the modal's display property is set
+ * to 'none'.
+ *
+ * This object will help us work around that problem.
+ *
+ * NOTE: This could also be plugin.
+ *
+ * @function hiddenFix
+ */
+ var hiddenFix = function() {
+
+ return {
+ /**
+ * Sets all hidden parent elements and self to visibile.
+ *
+ * @method adjust
+ * @param {jQuery Object} $child
+ */
+
+ // We'll use this to temporarily store style properties.
+ tmp : [],
+
+ // We'll use this to set hidden parent elements.
+ hidden : null,
+
+ adjust : function( $child ) {
+ // Internal reference.
+ var _self = this;
+
+ // Set all hidden parent elements, including this element.
+ _self.hidden = $child.parents().andSelf().filter( ":hidden" );
+
+ // Loop through all hidden elements.
+ _self.hidden.each( function() {
+
+ // Cache the element.
+ var $elem = $( this );
+
+ // Store the style attribute.
+ // Undefined if element doesn't have a style attribute.
+ _self.tmp.push( $elem.attr( 'style' ) );
+
+ // Set the element's display property to block,
+ // but ensure it's visibility is hidden.
+ $elem.css( { 'visibility' : 'hidden', 'display' : 'block' } );
+ });
+
+ }, // end adjust
+
+ /**
+ * Resets the elements previous state.
+ *
+ * @method reset
+ */
+ reset : function() {
+ // Internal reference.
+ var _self = this;
+ // Loop through our hidden element collection.
+ _self.hidden.each( function( i ) {
+ // Cache this element.
+ var $elem = $( this ),
+ _tmp = _self.tmp[ i ]; // Get the stored 'style' value for this element.
+
+ // If the stored value is undefined.
+ if( _tmp === undefined )
+ // Remove the style attribute.
+ $elem.removeAttr( 'style' );
+ else
+ // Otherwise, reset the element style attribute.
+ $elem.attr( 'style', _tmp );
+
+ });
+ // Reset the tmp array.
+ _self.tmp = [];
+ // Reset the hidden elements variable.
+ _self.hidden = null;
+
+ } // end reset
+
+ }; // end return
+
+ };
+
+ jQuery.foundation = jQuery.foundation || {};
+ jQuery.foundation.customForms = jQuery.foundation.customForms || {};
+
+ $.foundation.customForms.appendCustomMarkup = function ( options ) {
+
+ var defaults = {
+ disable_class: "js-disable-custom"
+ };
+
+ options = $.extend( defaults, options );
+
+ function appendCustomMarkup(idx, sel) {
+ var $this = $(sel).hide(),
+ type = $this.attr('type'),
+ $span = $this.next('span.custom.' + type);
+
+ if ($span.length === 0) {
+ $span = $('<span class="custom ' + type + '"></span>').insertAfter($this);
+ }
+
+ $span.toggleClass('checked', $this.is(':checked'));
+ $span.toggleClass('disabled', $this.is(':disabled'));
+ }
+
+ function appendCustomSelect(idx, sel) {
+ var hiddenFixObj = hiddenFix();
+ //
+ // jQueryify the <select> element and cache it.
+ //
+ var $this = $( sel ),
+ //
+ // Find the custom drop down element.
+ //
+ $customSelect = $this.next( 'div.custom.dropdown' ),
+ //
+ // Find the custom select element within the custom drop down.
+ //
+ $customList = $customSelect.find( 'ul' ),
+ //
+ // Find the custom a.current element.
+ //
+ $selectCurrent = $customSelect.find( ".current" ),
+ //
+ // Find the custom a.selector element (the drop-down icon).
+ //
+ $selector = $customSelect.find( ".selector" ),
+ //
+ // Get the <options> from the <select> element.
+ //
+ $options = $this.find( 'option' ),
+ //
+ // Filter down the selected options
+ //
+ $selectedOption = $options.filter( ':selected' ),
+ //
+ // Initial max width.
+ //
+ maxWidth = 0,
+ //
+ // We'll use this variable to create the <li> elements for our custom select.
+ //
+ liHtml = '',
+ //
+ // We'll use this to cache the created <li> elements within our custom select.
+ //
+ $listItems
+ ;
+ var $currentSelect = false;
+ //
+ // Should we not create a custom list?
+ //
+ if ( $this.hasClass( 'no-custom' ) ) return;
+
+ //
+ // Did we not create a custom select element yet?
+ //
+ if ( $customSelect.length === 0 ) {
+ //
+ // Let's create our custom select element!
+ //
+
+ //
+ // Determine what select size to use.
+ //
+ var customSelectSize = $this.hasClass( 'small' ) ? 'small' :
+ $this.hasClass( 'medium' ) ? 'medium' :
+ $this.hasClass( 'large' ) ? 'large' :
+ $this.hasClass( 'expand' ) ? 'expand' : ''
+ ;
+ //
+ // Build our custom list.
+ //
+ $customSelect = $('<div class="' + ['custom', 'dropdown', customSelectSize ].join( ' ' ) + '"><a href="#" class="selector"></a><ul /></div>"');
+ //
+ // Grab the selector element
+ //
+ $selector = $customSelect.find( ".selector" );
+ //
+ // Grab the unordered list element from the custom list.
+ //
+ $customList = $customSelect.find( "ul" );
+ //
+ // Build our <li> elements.
+ //
+ liHtml = $options.map( function() { return "<li>" + $( this ).html() + "</li>"; } ).get().join( '' );
+ //
+ // Append our <li> elements to the custom list (<ul>).
+ //
+ $customList.append( liHtml );
+ //
+ // Insert the the currently selected list item before all other elements.
+ // Then, find the element and assign it to $currentSelect.
+ //
+
+ $currentSelect = $customSelect.prepend( '<a href="#" class="current">' + $selectedOption.html() + '</a>' ).find( ".current" );
+ //
+ // Add the custom select element after the <select> element.
+ //
+ $this.after( $customSelect )
+ //
+ //then hide the <select> element.
+ //
+ .hide();
+
+ } else {
+ //
+ // Create our list item <li> elements.
+ //
+ liHtml = $options.map( function() { return "<li>" + $( this ).html() + "</li>"; } ).get().join( '' );
+ //
+ // Refresh the ul with options from the select in case the supplied markup doesn't match.
+ // Clear what's currently in the <ul> element.
+ //
+ $customList.html( '' )
+ //
+ // Populate the list item <li> elements.
+ //
+ .append( liHtml );
+
+ } // endif $customSelect.length === 0
+
+ //
+ // Determine whether or not the custom select element should be disabled.
+ //
+ $customSelect.toggleClass( 'disabled', $this.is( ':disabled' ) );
+ //
+ // Cache our List item elements.
+ //
+ $listItems = $customList.find( 'li' );
+
+ //
+ // Determine which elements to select in our custom list.
+ //
+ $options.each( function ( index ) {
+
+ if ( this.selected ) {
+ //
+ // Add the selected class to the current li element
+ //
+ $listItems.eq( index ).addClass( 'selected' );
+ //
+ // Update the current element with the option value.
+ //
+ if ($currentSelect) {
+ $currentSelect.html( $( this ).html() );
+ }
+
+ }
+
+ });
+
+ //
+ // Update the custom <ul> list width property.
+ //
+ $customList.css( 'width', 'inherit' );
+ //
+ // Set the custom select width property.
+ //
+ $customSelect.css( 'width', 'inherit' );
+
+ //
+ // If we're not specifying a predetermined form size.
+ //
+ if ( !$customSelect.is( '.small, .medium, .large, .expand' ) ) {
+
+ // ------------------------------------------------------------------------------------
+ // This is a work-around for when elements are contained within hidden parents.
+ // For example, when custom-form elements are inside of a hidden reveal modal.
+ //
+ // We need to display the current custom list element as well as hidden parent elements
+ // in order to properly calculate the list item element's width property.
+ // -------------------------------------------------------------------------------------
+
+ //
+ // Show the drop down.
+ // This should ensure that the list item's width values are properly calculated.
+ //
+ $customSelect.addClass( 'open' );
+ //
+ // Quickly, display all parent elements.
+ // This should help us calcualate the width of the list item's within the drop down.
+ //
+ hiddenFixObj.adjust( $customList );
+ //
+ // Grab the largest list item width.
+ //
+ maxWidth = ( $listItems.outerWidth() > maxWidth ) ? $listItems.outerWidth() : maxWidth;
+ //
+ // Okay, now reset the parent elements.
+ // This will hide them again.
+ //
+ hiddenFixObj.reset();
+ //
+ // Finally, hide the drop down.
+ //
+ $customSelect.removeClass( 'open' );
+ //
+ // Set the custom list width.
+ //
+ $customSelect.width( maxWidth + 18);
+ //
+ // Set the custom list element (<ul />) width.
+ //
+ $customList.width( maxWidth + 16 );
+
+ } // endif
+
+ }
+
+ $('form.custom input:radio[data-customforms!=disabled]').each(appendCustomMarkup);
+ $('form.custom input:checkbox[data-customforms!=disabled]').each(appendCustomMarkup);
+ $('form.custom select[data-customforms!=disabled]').each(appendCustomSelect);
+ };
+
+ var refreshCustomSelect = function($select) {
+ var maxWidth = 0,
+ $customSelect = $select.next();
+ $options = $select.find('option');
+ $customSelect.find('ul').html('');
+
+ $options.each(function () {
+ $li = $('<li>' + $(this).html() + '</li>');
+ $customSelect.find('ul').append($li);
+ });
+
+ // re-populate
+ $options.each(function (index) {
+ if (this.selected) {
+ $customSelect.find('li').eq(index).addClass('selected');
+ $customSelect.find('.current').html($(this).html());
+ }
+ });
+
+ // fix width
+ $customSelect.removeAttr('style')
+ .find('ul').removeAttr('style');
+ $customSelect.find('li').each(function () {
+ $customSelect.addClass('open');
+ if ($(this).outerWidth() > maxWidth) {
+ maxWidth = $(this).outerWidth();
+ }
+ $customSelect.removeClass('open');
+ });
+ $customSelect.css('width', maxWidth + 18 + 'px');
+ $customSelect.find('ul').css('width', maxWidth + 16 + 'px');
+
+ };
+
+ var toggleCheckbox = function($element) {
+ var $input = $element.prev(),
+ input = $input[0];
+
+ if (false === $input.is(':disabled')) {
+ input.checked = ((input.checked) ? false : true);
+ $element.toggleClass('checked');
+ }
+ };
+
+ var toggleRadio = function($element) {
+ var $input = $element.prev(),
+ input = $input[0];
+
+ if (false === $input.is(':disabled')) {
+ $('input:radio[name="' + $input.attr('name') + '"]').each(function () {
+ $(this).next().removeClass('checked');
+ });
+ input.checked = ((input.checked) ? false : true);
+ $element.toggleClass('checked');
+
+ $input.trigger('change');
+ }
+ };
+
+ $(document).on('click', 'form.custom span.custom.checkbox', function (event) {
+ event.preventDefault();
+ event.stopPropagation();
+
+ toggleCheckbox($(this));
+ });
+
+ $(document).on('click', 'form.custom span.custom.radio', function (event) {
+ event.preventDefault();
+ event.stopPropagation();
+
+ toggleRadio($(this));
+ });
+
+ $(document).on('change', 'form.custom select[data-customforms!=disabled]', function (event) {
+ refreshCustomSelect($(this));
+ });
+
+ $(document).on('click', 'form.custom label', function (event) {
+ var $associatedElement = $('#' + $(this).attr('for')),
+ $customCheckbox,
+ $customRadio;
+ if ($associatedElement.length !== 0) {
+ if ($associatedElement.attr('type') === 'checkbox') {
+ event.preventDefault();
+ $customCheckbox = $(this).find('span.custom.checkbox');
+ toggleCheckbox($customCheckbox);
+ } else if ($associatedElement.attr('type') === 'radio') {
+ event.preventDefault();
+ $customRadio = $(this).find('span.custom.radio');
+ toggleRadio($customRadio);
+ }
+ }
+ });
+
+ $(document).on('click', 'form.custom div.custom.dropdown a.current, form.custom div.custom.dropdown a.selector', function (event) {
+ var $this = $(this),
+ $dropdown = $this.closest('div.custom.dropdown'),
+ $select = $dropdown.prev();
+
+ event.preventDefault();
+ $('div.dropdown').removeClass('open');
+
+ if (false === $select.is(':disabled')) {
+ $dropdown.toggleClass('open');
+
+ if ($dropdown.hasClass('open')) {
+ $(document).bind('click.customdropdown', function (event) {
+ $dropdown.removeClass('open');
+ $(document).unbind('.customdropdown');
+ });
+ } else {
+ $(document).unbind('.customdropdown');
+ }
+ return false;
+ }
+ });
+
+ $(document).on('click', 'form.custom div.custom.dropdown li', function (event) {
+ var $this = $(this),
+ $customDropdown = $this.closest('div.custom.dropdown'),
+ $select = $customDropdown.prev(),
+ selectedIndex = 0;
+
+ event.preventDefault();
+ event.stopPropagation();
+ $('div.dropdown').removeClass('open');
+
+ $this
+ .closest('ul')
+ .find('li')
+ .removeClass('selected');
+ $this.addClass('selected');
+
+ $customDropdown
+ .removeClass('open')
+ .find('a.current')
+ .html($this.html());
+
+ $this.closest('ul').find('li').each(function (index) {
+ if ($this[0] == this) {
+ selectedIndex = index;
+ }
+
+ });
+ $select[0].selectedIndex = selectedIndex;
+
+ $select.trigger('change');
+ });
+
+
+ $.fn.foundationCustomForms = $.foundation.customForms.appendCustomMarkup;
+
+})( jQuery );
View
25 javascripts/jquery.foundation.mediaQueryToggle.js
@@ -0,0 +1,25 @@
+(function ($) {
+
+ $.fn.foundationMediaQueryViewer = function (options) {
+
+ var settings = $.extend(options,{toggleKey:77}); // // Press 'M'
+ $(document).on("keyup.mediaQueryViewer", ":input", function(e){
+ if (e.which === settings.toggleKey) {
+ e.stopPropagation();
+ }
+ });
+ $(document).on("keyup.mediaQueryViewer", function(e) {
+ var $mqViewer = $('#fqv');
+
+ if (e.which === settings.toggleKey) {
+ if ($mqViewer.length > 0) {
+ $mqViewer.remove();
+ } else {
+ $('body').prepend('<div id="fqv" style="position:fixed;top:4px;left:4px;z-index:999;color:#fff;"><p style="font-size:12px;background:rgba(0,0,0,0.75);padding:5px;margin-bottom:1px;line-height:1.2;"><span class="left">Media:</span> <span style="font-weight:bold;" class="show-for-xlarge">Extra Large</span><span style="font-weight:bold;" class="show-for-large">Large</span><span style="font-weight:bold;" class="show-for-medium">Medium</span><span style="font-weight:bold;" class="show-for-small">Small</span><span style="font-weight:bold;" class="show-for-landscape">Landscape</span><span style="font-weight:bold;" class="show-for-portrait">Portrait</span><span style="font-weight:bold;" class="show-for-touch">Touch</span></p></div>');
+ }
+ }
+ });
+
+ };
+
+})(jQuery);
View
30 javascripts/jquery.foundation.navigation.js
@@ -0,0 +1,30 @@
+(function ($){
+
+ $.fn.foundationNavigation = function (options) {
+
+ var lockNavBar = false;
+ // Windows Phone, sadly, does not register touch events :(
+ if (Modernizr.touch || navigator.userAgent.match(/Windows Phone/i)) {
+ $(document).on('click.fndtn touchstart.fndtn', '.nav-bar a.flyout-toggle', function (e) {
+ e.preventDefault();
+ var flyout = $(this).siblings('.flyout').first();
+ if (lockNavBar === false) {
+ $('.nav-bar .flyout').not(flyout).slideUp(500);
+ flyout.slideToggle(500, function () {
+ lockNavBar = false;
+ });
+ }
+ lockNavBar = true;
+ });
+ $('.nav-bar>li.has-flyout', this).addClass('is-touch');
+ } else {
+ $('.nav-bar>li.has-flyout', this).hover(function () {
+ $(this).children('.flyout').show();
+ }, function () {
+ $(this).children('.flyout').hide();
+ });
+ }
+
+ };
+
+})( jQuery );
View
634 javascripts/jquery.foundation.orbit.js
@@ -0,0 +1,634 @@
+/*
+ * jQuery Orbit Plugin 1.4.0
+ * www.ZURB.com/playground
+ * Copyright 2010, ZURB
+ * Free to use under the MIT license.
+ * http://www.opensource.org/licenses/mit-license.php
+*/
+
+
+(function ($) {
+ 'use strict';
+ $.fn.findFirstImage = function () {
+ return this.first()
+ .find('img')
+ .andSelf().filter('img')
+ .first();
+ };
+
+ var ORBIT = {
+
+ defaults: {
+ animation: 'horizontal-push', // fade, horizontal-slide, vertical-slide, horizontal-push, vertical-push
+ animationSpeed: 600, // how fast animtions are
+ timer: true, // true or false to have the timer
+ advanceSpeed: 4000, // if timer is enabled, time between transitions
+ pauseOnHover: false, // if you hover pauses the slider
+ startClockOnMouseOut: false, // if clock should start on MouseOut
+ startClockOnMouseOutAfter: 1000, // how long after MouseOut should the timer start again
+ directionalNav: true, // manual advancing directional navs
+ directionalNavRightText: 'Right', // text of right directional element for accessibility
+ directionalNavLeftText: 'Left', // text of left directional element for accessibility
+ captions: true, // do you want captions?
+ captionAnimation: 'fade', // fade, slideOpen, none
+ captionAnimationSpeed: 600, // if so how quickly should they animate in
+ resetTimerOnClick: false, // true resets the timer instead of pausing slideshow progress on manual navigation
+ bullets: false, // true or false to activate the bullet navigation
+ bulletThumbs: false, // thumbnails for the bullets
+ bulletThumbLocation: '', // location from this file where thumbs will be
+ afterSlideChange: $.noop, // empty function
+ afterLoadComplete: $.noop, //callback to execute after everything has been loaded
+ fluid: true,
+ centerBullets: true // center bullet nav with js, turn this off if you want to position the bullet nav manually
+ },
+
+ activeSlide: 0,
+ numberSlides: 0,
+ orbitWidth: null,
+ orbitHeight: null,
+ locked: null,
+ timerRunning: null,
+ degrees: 0,
+ wrapperHTML: '<div class="orbit-wrapper" />',
+ timerHTML: '<div class="timer"><span class="mask"><span class="rotator"></span></span><span class="pause"></span></div>',
+ captionHTML: '<div class="orbit-caption"></div>',
+ directionalNavHTML: '<div class="slider-nav"><span class="right"></span><span class="left"></span></div>',
+ bulletHTML: '<ul class="orbit-bullets"></ul>',
+
+ init: function (element, options) {
+ var $imageSlides,
+ imagesLoadedCount = 0,
+ self = this;
+
+ // Bind functions to correct context
+ this.clickTimer = $.proxy(this.clickTimer, this);
+ this.addBullet = $.proxy(this.addBullet, this);
+ this.resetAndUnlock = $.proxy(this.resetAndUnlock, this);
+ this.stopClock = $.proxy(this.stopClock, this);
+ this.startTimerAfterMouseLeave = $.proxy(this.startTimerAfterMouseLeave, this);
+ this.clearClockMouseLeaveTimer = $.proxy(this.clearClockMouseLeaveTimer, this);
+ this.rotateTimer = $.proxy(this.rotateTimer, this);
+
+ this.options = $.extend({}, this.defaults, options);
+ if (this.options.timer === 'false') this.options.timer = false;
+ if (this.options.captions === 'false') this.options.captions = false;
+ if (this.options.directionalNav === 'false') this.options.directionalNav = false;
+
+ this.$element = $(element);
+ this.$wrapper = this.$element.wrap(this.wrapperHTML).parent();
+ this.$slides = this.$element.children('img, a, div');
+
+ this.$element.bind('orbit.next', function () {
+ self.shift('next');
+ });
+
+ this.$element.bind('orbit.prev', function () {
+ self.shift('prev');
+ });
+
+ this.$element.bind('orbit.goto', function (event, index) {
+ self.shift(index);
+ });
+
+ this.$element.bind('orbit.start', function (event, index) {
+ self.startClock();
+ });
+
+ this.$element.bind('orbit.stop', function (event, index) {
+ self.stopClock();
+ });
+
+ $imageSlides = this.$slides.filter('img');
+
+ if ($imageSlides.length === 0) {
+ this.loaded();
+ } else {
+ $imageSlides.bind('imageready', function () {
+ imagesLoadedCount += 1;
+ if (imagesLoadedCount === $imageSlides.length) {
+ self.loaded();
+ }
+ });
+ }
+ },
+
+ loaded: function () {
+ this.$element
+ .addClass('orbit')
+ .css({width: '1px', height: '1px'});
+
+ this.$slides.addClass('orbit-slide');
+
+ this.setDimentionsFromLargestSlide();
+ this.updateOptionsIfOnlyOneSlide();
+ this.setupFirstSlide();
+
+ if (this.options.timer) {
+ this.setupTimer();
+ this.startClock();
+ }
+
+ if (this.options.captions) {
+ this.setupCaptions();
+ }
+
+ if (this.options.directionalNav) {
+ this.setupDirectionalNav();
+ }
+
+ if (this.options.bullets) {
+ this.setupBulletNav();
+ this.setActiveBullet();
+ }
+
+ this.options.afterLoadComplete.call(this);
+ },
+
+ currentSlide: function () {
+ return this.$slides.eq(this.activeSlide);
+ },
+
+ setDimentionsFromLargestSlide: function () {
+ //Collect all slides and set slider size of largest image
+ var self = this,
+ $fluidPlaceholder;
+
+ self.$element.add(self.$wrapper).width(this.$slides.first().outerWidth());
+ self.$element.add(self.$wrapper).height(this.$slides.first().height());
+ self.orbitWidth = this.$slides.first().outerWidth();
+ self.orbitHeight = this.$slides.first().height();
+ $fluidPlaceholder = this.$slides.first().findFirstImage().clone();
+
+
+ this.$slides.each(function () {
+ var slide = $(this),
+ slideWidth = slide.outerWidth(),
+ slideHeight = slide.height();
+
+ if (slideWidth > self.$element.outerWidth()) {
+ self.$element.add(self.$wrapper).width(slideWidth);
+ self.orbitWidth = self.$element.outerWidth();
+ }
+ if (slideHeight > self.$element.height()) {
+ self.$element.add(self.$wrapper).height(slideHeight);
+ self.orbitHeight = self.$element.height();
+ $fluidPlaceholder = $(this).findFirstImage().clone();
+ }
+ self.numberSlides += 1;
+ });
+
+ if (this.options.fluid) {
+ if (typeof this.options.fluid === "string") {
+ $fluidPlaceholder = $('<img src="http://placehold.it/' + this.options.fluid + '" />')
+ }
+
+ self.$element.prepend($fluidPlaceholder);
+ $fluidPlaceholder.addClass('fluid-placeholder');
+ self.$element.add(self.$wrapper).css({width: 'inherit'});
+ self.$element.add(self.$wrapper).css({height: 'inherit'});
+
+ $(window).bind('resize', function () {
+ self.orbitWidth = self.$element.outerWidth();
+ self.orbitHeight = self.$element.height();
+ });
+ }
+ },
+
+ //Animation locking functions
+ lock: function () {
+ this.locked = true;
+ },
+
+ unlock: function () {
+ this.locked = false;
+ },
+
+ updateOptionsIfOnlyOneSlide: function () {
+ if(this.$slides.length === 1) {
+ this.options.directionalNav = false;
+ this.options.timer = false;
+ this.options.bullets = false;
+ }
+ },
+
+ setupFirstSlide: function () {
+ //Set initial front photo z-index and fades it in
+ var self = this;
+ this.$slides.first()
+ .css({"z-index" : 3})
+ .fadeIn(function() {
+ //brings in all other slides IF css declares a display: none
+ self.$slides.css({"display":"block"})
+ });
+ },
+
+ startClock: function () {
+ var self = this;
+
+ if(!this.options.timer) {
+ return false;
+ }
+
+ if (this.$timer.is(':hidden')) {
+ this.clock = setInterval(function () {
+ self.$element.trigger('orbit.next');
+ }, this.options.advanceSpeed);
+ } else {
+ this.timerRunning = true;
+ this.$pause.removeClass('active');
+ this.clock = setInterval(this.rotateTimer, this.options.advanceSpeed / 180, false);
+ }
+ },
+
+ rotateTimer: function (reset) {
+ var degreeCSS = "rotate(" + this.degrees + "deg)";
+ this.degrees += 2;
+ this.$rotator.css({
+ "-webkit-transform": degreeCSS,
+ "-moz-transform": degreeCSS,
+ "-o-transform": degreeCSS,
+ "-ms-transform": degreeCSS
+ });
+ if(this.degrees > 180) {
+ this.$rotator.addClass('move');
+ this.$mask.addClass('move');
+ }
+ if(this.degrees > 360 || reset) {
+ this.$rotator.removeClass('move');
+ this.$mask.removeClass('move');
+ this.degrees = 0;
+ this.$element.trigger('orbit.next');
+ }
+ },
+
+ stopClock: function () {
+ if (!this.options.timer) {
+ return false;
+ } else {
+ this.timerRunning = false;
+ clearInterval(this.clock);
+ this.$pause.addClass('active');
+ }
+ },
+
+ setupTimer: function () {
+ this.$timer = $(this.timerHTML);
+ this.$wrapper.append(this.$timer);
+
+ this.$rotator = this.$timer.find('.rotator');
+ this.$mask = this.$timer.find('.mask');
+ this.$pause = this.$timer.find('.pause');
+
+ this.$timer.click(this.clickTimer);
+
+ if (this.options.startClockOnMouseOut) {
+ this.$wrapper.mouseleave(this.startTimerAfterMouseLeave);
+ this.$wrapper.mouseenter(this.clearClockMouseLeaveTimer);
+ }
+
+ if (this.options.pauseOnHover) {
+ this.$wrapper.mouseenter(this.stopClock);
+ }
+ },
+
+ startTimerAfterMouseLeave: function () {
+ var self = this;
+
+ this.outTimer = setTimeout(function() {
+ if(!self.timerRunning){
+ self.startClock();
+ }
+ }, this.options.startClockOnMouseOutAfter)
+ },
+
+ clearClockMouseLeaveTimer: function () {
+ clearTimeout(this.outTimer);
+ },
+
+ clickTimer: function () {
+ if(!this.timerRunning) {
+ this.startClock();
+ } else {
+ this.stopClock();
+ }
+ },
+
+ setupCaptions: function () {
+ this.$caption = $(this.captionHTML);
+ this.$wrapper.append(this.$caption);
+ this.setCaption();
+ },
+
+ setCaption: function () {
+ var captionLocation = this.currentSlide().attr('data-caption'),
+ captionHTML;
+
+ if (!this.options.captions) {
+ return false;
+ }
+
+ //Set HTML for the caption if it exists
+ if (captionLocation) {
+ //if caption text is blank, don't show captions
+ if ($.trim($(captionLocation).text()).length < 1){
+ return false;
+ }
+ captionHTML = $(captionLocation).html(); //get HTML from the matching HTML entity
+ this.$caption
+ .attr('id', captionLocation) // Add ID caption TODO why is the id being set?
+ .html(captionHTML); // Change HTML in Caption
+ //Animations for Caption entrances
+ switch (this.options.captionAnimation) {
+ case 'none':
+ this.$caption.show();
+ break;
+ case 'fade':
+ this.$caption.fadeIn(this.options.captionAnimationSpeed);
+ break;
+ case 'slideOpen':
+ this.$caption.slideDown(this.options.captionAnimationSpeed);
+ break;
+ }
+ } else {
+ //Animations for Caption exits
+ switch (this.options.captionAnimation) {
+ case 'none':
+ this.$caption.hide();
+ break;
+ case 'fade':
+ this.$caption.fadeOut(this.options.captionAnimationSpeed);
+ break;
+ case 'slideOpen':
+ this.$caption.slideUp(this.options.captionAnimationSpeed);
+ break;
+ }
+ }
+ },
+
+ setupDirectionalNav: function () {
+ var self = this,
+ $directionalNav = $(this.directionalNavHTML);
+
+ $directionalNav.find('.right').html(this.options.directionalNavRightText);
+ $directionalNav.find('.left').html(this.options.directionalNavLeftText);
+
+ this.$wrapper.append($directionalNav);
+
+ this.$wrapper.find('.left').click(function () {
+ self.stopClock();
+ if (self.options.resetTimerOnClick) {
+ self.rotateTimer(true);
+ self.startClock();
+ }
+ self.$element.trigger('orbit.prev');
+ });
+
+ this.$wrapper.find('.right').click(function () {
+ self.stopClock();
+ if (self.options.resetTimerOnClick) {
+ self.rotateTimer(true);
+ self.startClock();
+ }
+ self.$element.trigger('orbit.next');
+ });
+ },
+
+ setupBulletNav: function () {
+ this.$bullets = $(this.bulletHTML);
+ this.$wrapper.append(this.$bullets);
+ this.$slides.each(this.addBullet);
+ this.$element.addClass('with-bullets');
+ if (this.options.centerBullets) this.$bullets.css('margin-left', -this.$bullets.outerWidth() / 2);
+ },
+
+ addBullet: function (index, slide) {
+ var position = index + 1,
+ $li = $('<li>' + (position) + '</li>'),
+ thumbName,
+ self = this;
+
+ if (this.options.bulletThumbs) {
+ thumbName = $(slide).attr('data-thumb');
+ if (thumbName) {
+ $li
+ .addClass('has-thumb')
+ .css({background: "url(" + this.options.bulletThumbLocation + thumbName + ") no-repeat"});;
+ }
+ }
+ this.$bullets.append($li);
+ $li.data('index', index);
+ $li.click(function () {
+ self.stopClock();
+ if (self.options.resetTimerOnClick) {
+ self.rotateTimer(true);
+ self.startClock();
+ }
+ self.$element.trigger('orbit.goto', [$li.data('index')])
+ });
+ },
+
+ setActiveBullet: function () {
+ if(!this.options.bullets) { return false; } else {
+ this.$bullets.find('li')
+ .removeClass('active')
+ .eq(this.activeSlide)
+ .addClass('active');
+ }
+ },
+
+ resetAndUnlock: function () {
+ this.$slides
+ .eq(this.prevActiveSlide)
+ .css({"z-index" : 1});
+ this.unlock();
+ this.options.afterSlideChange.call(this, this.$slides.eq(this.prevActiveSlide), this.$slides.eq(this.activeSlide));
+ },
+
+ shift: function (direction) {
+ var slideDirection = direction;
+
+ //remember previous activeSlide
+ this.prevActiveSlide = this.activeSlide;
+
+ //exit function if bullet clicked is same as the current image
+ if (this.prevActiveSlide == slideDirection) { return false; }
+
+ if (this.$slides.length == "1") { return false; }
+ if (!this.locked) {
+ this.lock();
+ //deduce the proper activeImage
+ if (direction == "next") {
+ this.activeSlide++;
+ if (this.activeSlide == this.numberSlides) {
+ this.activeSlide = 0;
+ }
+ } else if (direction == "prev") {
+ this.activeSlide--
+ if (this.activeSlide < 0) {
+ this.activeSlide = this.numberSlides - 1;
+ }
+ } else {
+ this.activeSlide = direction;
+ if (this.prevActiveSlide < this.activeSlide) {
+ slideDirection = "next";
+ } else if (this.prevActiveSlide > this.activeSlide) {
+ slideDirection = "prev"
+ }
+ }
+
+ //set to correct bullet
+ this.setActiveBullet();
+
+ //set previous slide z-index to one below what new activeSlide will be
+ this.$slides
+ .eq(this.prevActiveSlide)
+ .css({"z-index" : 2});
+
+ //fade
+ if (this.options.animation == "fade") {
+ this.$slides
+ .eq(this.activeSlide)
+ .css({"opacity" : 0, "z-index" : 3})
+ .animate({"opacity" : 1}, this.options.animationSpeed, this.resetAndUnlock);
+ }
+
+ //horizontal-slide
+ if (this.options.animation == "horizontal-slide") {
+ if (slideDirection == "next") {
+ this.$slides
+ .eq(this.activeSlide)
+ .css({"left": this.orbitWidth, "z-index" : 3})
+ .animate({"left" : 0}, this.options.animationSpeed, this.resetAndUnlock);
+ }
+ if (slideDirection == "prev") {
+ this.$slides
+ .eq(this.activeSlide)
+ .css({"left": -this.orbitWidth, "z-index" : 3})
+ .animate({"left" : 0}, this.options.animationSpeed, this.resetAndUnlock);
+ }
+ }
+
+ //vertical-slide
+ if (this.options.animation == "vertical-slide") {
+ if (slideDirection == "prev") {
+ this.$slides
+ .eq(this.activeSlide)
+ .css({"top": this.orbitHeight, "z-index" : 3})
+ .animate({"top" : 0}, this.options.animationSpeed, this.resetAndUnlock);
+ }
+ if (slideDirection == "next") {
+ this.$slides
+ .eq(this.activeSlide)
+ .css({"top": -this.orbitHeight, "z-index" : 3})
+ .animate({"top" : 0}, this.options.animationSpeed, this.resetAndUnlock);
+ }
+ }
+
+ //horizontal-push
+ if (this.options.animation == "horizontal-push") {
+ if (slideDirection == "next") {
+ this.$slides
+ .eq(this.activeSlide)
+ .css({"left": this.orbitWidth, "z-index" : 3})
+ .animate({"left" : 0}, this.options.animationSpeed, this.resetAndUnlock);
+ this.$slides
+ .eq(this.prevActiveSlide)
+ .animate({"left" : -this.orbitWidth}, this.options.animationSpeed);
+ }
+ if (slideDirection == "prev") {
+ this.$slides
+ .eq(this.activeSlide)
+ .css({"left": -this.orbitWidth, "z-index" : 3})
+ .animate({"left" : 0}, this.options.animationSpeed, this.resetAndUnlock);
+ this.$slides
+ .eq(this.prevActiveSlide)
+ .animate({"left" : this.orbitWidth}, this.options.animationSpeed);
+ }
+ }
+
+ //vertical-push
+ if (this.options.animation == "vertical-push") {
+ if (slideDirection == "next") {
+ this.$slides
+ .eq(this.activeSlide)
+ .css({top: -this.orbitHeight, "z-index" : 3})
+ .animate({top : 0}, this.options.animationSpeed, this.resetAndUnlock);
+ this.$slides
+ .eq(this.prevActiveSlide)
+ .animate({top : this.orbitHeight}, this.options.animationSpeed);
+ }
+ if (slideDirection == "prev") {
+ this.$slides
+ .eq(this.activeSlide)
+ .css({top: this.orbitHeight, "z-index" : 3})
+ .animate({top : 0}, this.options.animationSpeed, this.resetAndUnlock);
+ this.$slides
+ .eq(this.prevActiveSlide)
+ .animate({top : -this.orbitHeight}, this.options.animationSpeed);
+ }
+ }
+
+ this.setCaption();
+ }
+ }
+ };
+
+ $.fn.orbit = function (options) {
+ return this.each(function () {
+ var orbit = $.extend({}, ORBIT);
+ orbit.init(this, options);
+ });
+ };
+
+})(jQuery);
+
+/*!
+ * jQuery imageready Plugin
+ * http://www.zurb.com/playground/
+ *
+ * Copyright 2011, ZURB
+ * Released under the MIT License
+ */
+(function ($) {
+
+ var options = {};
+
+ $.event.special.imageready = {
+
+ setup: function (data, namespaces, eventHandle) {
+ options = data || options;
+ },
+
+ add: function (handleObj) {
+ var $this = $(this),
+ src;
+
+ if ( this.nodeType === 1 && this.tagName.toLowerCase() === 'img' && this.src !== '' ) {
+ if (options.forceLoad) {
+ src = $this.attr('src');
+ $this.attr('src', '');
+ bindToLoad(this, handleObj.handler);
+ $this.attr('src', src);
+ } else if ( this.complete || this.readyState === 4 ) {
+ handleObj.handler.apply(this, arguments);
+ } else {
+ bindToLoad(this, handleObj.handler);
+ }
+ }
+ },
+
+ teardown: function (namespaces) {
+ $(this).unbind('.imageready');
+ }
+ };
+
+ function bindToLoad(element, callback) {
+ var $this = $(element);
+
+ $this.bind('load.imageready', function () {
+ callback.apply(element, arguments);
+ $this.unbind('load.imageready');
+ });
+ }
+
+}(jQuery));
View
773 javascripts/jquery.foundation.reveal.js
@@ -0,0 +1,773 @@
+/*
+ * jQuery Reveal Plugin 1.1
+ * www.ZURB.com
+ * Copyright 2010, ZURB
+ * Free to use under the MIT license.
+ * http://www.opensource.org/licenses/mit-license.php
+*/
+/*globals jQuery */
+
+(function ($) {
+ 'use strict';
+ //
+ // Global variable.
+ // Helps us determine if the current modal is being queued for display.
+ //
+ var modalQueued = false;
+
+ //
+ // Bind the live 'click' event to all anchor elemnets with the data-reveal-id attribute.
+ //
+ $(document).on('click', 'a[data-reveal-id]', function ( event ) {
+ //
+ // Prevent default action of the event.
+ //
+ event.preventDefault();
+ //
+ // Get the clicked anchor data-reveal-id attribute value.
+ //
+ var modalLocation = $( this ).attr( 'data-reveal-id' );
+ //
+ // Find the element with that modalLocation id and call the reveal plugin.
+ //
+ $( '#' + modalLocation ).reveal( $( this ).data() );
+
+ });
+
+ /**
+ * @module reveal
+ * @property {Object} [options] Reveal options
+ */
+ $.fn.reveal = function ( options ) {
+ /*
+ * Cache the document object.
+ */
+ var $doc = $( document ),
+ /*
+ * Default property values.
+ */
+ defaults = {
+ /**
+ * Possible options: fade, fadeAndPop, none
+ *
+ * @property animation
+ * @type {String}
+ * @default fadeAndPop
+ */
+ animation: 'fadeAndPop',
+ /**
+ * Speed at which the reveal should show. How fast animtions are.
+ *
+ * @property animationSpeed
+ * @type {Integer}
+ * @default 300
+ */
+ animationSpeed: 300,
+ /**
+ * Should the modal close when the background is clicked?
+ *
+ * @property closeOnBackgroundClick
+ * @type {Boolean}
+ * @default true
+ */
+ closeOnBackgroundClick: true,
+ /**
+ * Specify a class name for the 'close modal' element.
+ * This element will close an open modal.
+ *
+ @example
+ <a href='#close' class='close-reveal-modal'>Close Me</a>
+ *
+ * @property dismissModalClass
+ * @type {String}
+ * @default close-reveal-modal
+ */
+ dismissModalClass: 'close-reveal-modal',
+ /**
+ * Specify a callback function that triggers 'before' the modal opens.
+ *
+ * @property open
+ * @type {Function}
+ * @default function(){}
+ */
+ open: $.noop,
+ /**
+ * Specify a callback function that triggers 'after' the modal is opened.
+ *
+ * @property opened
+ * @type {Function}
+ * @default function(){}
+ */
+ opened: $.noop,
+ /**
+ * Specify a callback function that triggers 'before' the modal prepares to close.
+ *
+ * @property close
+ * @type {Function}
+ * @default function(){}
+ */
+ close: $.noop,
+ /**
+ * Specify a callback function that triggers 'after' the modal is closed.
+ *
+ * @property closed
+ * @type {Function}
+ * @default function(){}
+ */
+ closed: $.noop
+ }
+ ;
+ //
+ // Extend the default options.
+ // This replaces the passed in option (options) values with default values.
+ //
+ options = $.extend( {}, defaults, options );
+
+ //
+ // Apply the plugin functionality to each element in the jQuery collection.
+ //
+ return this.each( function () {
+ //
+ // Cache the modal element
+ //
+ var modal = $( this ),
+ //
+ // Get the current css 'top' property value in decimal format.
+ //
+ topMeasure = parseInt( modal.css( 'top' ), 10 ),
+ //
+ // Calculate the top offset.
+ //
+ topOffset = modal.height() + topMeasure,
+ //
+ // Helps determine if the modal is locked.
+ // This way we keep the modal from triggering while it's in the middle of animating.
+ //
+ locked = false,
+ //
+ // Get the modal background element.
+ //
+ modalBg = $( '.reveal-modal-bg' ),
+ //
+ // Show modal properties
+ //
+ cssOpts = {
+ //
+ // Used, when we show the modal.
+ //
+ open : {
+ //
+ // Set the 'top' property to the document scroll minus the calculated top offset.
+ //
+ 'top': 0,
+ //
+ // Opacity gets set to 0.
+ //
+ 'opacity': 0,
+ //
+ // Show the modal
+ //
+ 'visibility': 'visible',
+ //
+ // Ensure it's displayed as a block element.
+ //
+ 'display': 'block'
+ },
+ //
+ // Used, when we hide the modal.
+ //
+ close : {
+ //
+ // Set the default 'top' property value.
+ //
+ 'top': topMeasure,
+ //
+ // Has full opacity.
+ //
+ 'opacity': 1,
+ //
+ // Hide the modal
+ //
+ 'visibility': 'hidden',
+ //
+ // Ensure the elment is hidden.
+ //
+ 'display': 'none'
+ }
+
+ },
+ //
+ // Initial closeButton variable.
+ //
+ $closeButton
+ ;
+
+ //
+ // Do we have a modal background element?
+ //
+ if ( modalBg.length === 0 ) {
+ //
+ // No we don't. So, let's create one.
+ //
+ modalBg = $( '<div />', { 'class' : 'reveal-modal-bg' } )
+ //
+ // Then insert it after the modal element.
+ //
+ .insertAfter( modal );
+ //
+ // Now, fade it out a bit.
+ //
+ modalBg.fadeTo( 'fast', 0.8 );
+ }
+
+ //
+ // Helper Methods
+ //
+
+ /**
+ * Unlock the modal for animation.
+ *
+ * @method unlockModal
+ */
+ function unlockModal() {
+ locked = false;
+ }
+
+ /**
+ * Lock the modal to prevent further animation.
+ *
+ * @method lockModal
+ */
+ function lockModal() {
+ locked = true;
+ }
+
+ /**
+ * Closes all open modals.
+ *
+ * @method closeOpenModal
+ */
+ function closeOpenModals() {
+ //
+ // Get all reveal-modal elements with the .open class.
+ //
+ var $openModals = $( ".reveal-modal.open" );
+ //
+ // Do we have modals to close?
+ //
+ if ( $openModals.length === 1 ) {
+ //
+ // Set the modals for animation queuing.
+ //
+ modalQueued = true;
+ //
+ // Trigger the modal close event.
+ //
+ $openModals.trigger( "reveal:close" );
+ }
+
+ }
+ /**
+ * Animates the modal opening.
+ * Handles the modal 'open' event.
+ *
+ * @method openAnimation
+ */
+ function openAnimation() {
+ //
+ // First, determine if we're in the middle of animation.
+ //
+ if ( !locked ) {
+ //
+ // We're not animating, let's lock the modal for animation.
+ //
+ lockModal();
+ //
+ // Close any opened modals.
+ //
+ closeOpenModals();
+ //
+ // Now, add the open class to this modal.
+ //
+ modal.addClass( "open" );
+
+ //
+ // Are we executing the 'fadeAndPop' animation?
+ //
+ if ( options.animation === "fadeAndPop" ) {
+ //
+ // Yes, we're doing the 'fadeAndPop' animation.
+ // Okay, set the modal css properties.
+ //
+ //
+ // Set the 'top' property to the document scroll minus the calculated top offset.
+ //
+ cssOpts.open.top = $doc.scrollTop() - topOffset;
+ //
+ // Flip the opacity to 0.
+ //
+ cssOpts.open.opacity = 0;
+ //
+ // Set the css options.
+ //
+ modal.css( cssOpts.open );
+ //
+ // Fade in the background element, at half the speed of the modal element.
+ // So, faster than the modal element.
+ //
+ modalBg.fadeIn( options.animationSpeed / 2 );
+
+ //
+ // Let's delay the next animation queue.
+ // We'll wait until the background element is faded in.
+ //
+ modal.delay( options.animationSpeed / 2 )
+ //
+ // Animate the following css properties.
+ //
+ .animate( {
+ //
+ // Set the 'top' property to the document scroll plus the calculated top measure.
+ //
+ "top": $doc.scrollTop() + topMeasure + 'px',
+ //
+ // Set it to full opacity.
+ //
+ "opacity": 1
+
+ },
+ /*
+ * Fade speed.
+ */
+ options.animationSpeed,
+ /*
+ * End of animation callback.
+ */
+ function () {
+ //
+ // Trigger the modal reveal:opened event.
+ // This should trigger the functions set in the options.opened property.
+ //
+ modal.trigger( 'reveal:opened' );
+
+ }); // end of animate.
+
+ } // end if 'fadeAndPop'
+
+ //
+ // Are executing the 'fade' animation?
+ //
+ if ( options.animation === "fade" ) {
+ //
+ // Yes, were executing 'fade'.
+ // Okay, let's set the modal properties.
+ //
+ cssOpts.open.top = $doc.scrollTop() + topMeasure;
+ //
+ // Flip the opacity to 0.
+ //
+ cssOpts.open.opacity = 0;
+ //
+ // Set the css options.
+ //
+ modal.css( cssOpts.open );
+ //
+ // Fade in the modal background at half the speed of the modal.
+ // So, faster than modal.
+ //
+ modalBg.fadeIn( options.animationSpeed / 2 );
+
+ //
+ // Delay the modal animation.
+ // Wait till the modal background is done animating.
+ //
+ modal.delay( options.animationSpeed / 2 )
+ //
+ // Now animate the modal.
+ //
+ .animate( {
+ //
+ // Set to full opacity.
+ //
+ "opacity": 1
+ },
+
+ /*
+ * Animation speed.
+ */
+ options.animationSpeed,
+
+ /*
+ * End of animation callback.
+ */
+ function () {
+ //
+ // Trigger the modal reveal:opened event.
+ // This should trigger the functions set in the options.opened property.
+ //
+ modal.trigger( 'reveal:opened' );
+
+ });
+
+ } // end if 'fade'
+
+ //
+ // Are we not animating?
+ //
+ if ( options.animation === "none" ) {
+ //
+ // We're not animating.
+ // Okay, let's set the modal css properties.
+ //
+ //
+ // Set the top property.
+ //
+ cssOpts.open.top = $doc.scrollTop() + topMeasure;
+ //
+ // Set the opacity property to full opacity, since we're not fading (animating).
+ //
+ cssOpts.open.opacity = 1;
+ //
+ // Set the css property.
+ //
+ modal.css( cssOpts.open );
+ //
+ // Show the modal Background.
+ //
+ modalBg.css( { "display": "block" } );
+ //
+ // Trigger the modal opened event.
+ //
+ modal.trigger( 'reveal:opened' );
+
+ } // end if animating 'none'
+
+ }// end if !locked
+
+ }// end openAnimation
+
+ //
+ // Bind the reveal 'open' event.
+ // When the event is triggered, openAnimation is called
+ // along with any function set in the options.open property.
+ //
+ modal.bind( 'reveal:open.reveal', openAnimation );
+
+ /**
+ * Closes the modal element(s)
+ * Handles the modal 'close' event.
+ *
+ * @method closeAnimation
+ */
+ function closeAnimation() {
+ //
+ // First, determine if we're in the middle of animation.
+ //
+ if ( !locked ) {
+ //
+ // We're not animating, let's lock the modal for animation.
+ //
+ lockModal();
+ //
+ // Clear the modal of the open class.
+ //
+ modal.removeClass( "open" );
+
+ //
+ // Are we using the 'fadeAndPop' animation?
+ //
+ if ( options.animation === "fadeAndPop" ) {
+ //
+ // Yes, okay, let's set the animation properties.
+ //
+ modal.animate( {
+ //
+ // Set the top property to the document scrollTop minus calculated topOffset.
+ //
+ "top": $doc.scrollTop() - topOffset + 'px',
+ //
+ // Fade the modal out, by using the opacity property.
+ //
+ "opacity": 0
+
+ },
+ /*
+ * Fade speed.
+ */
+ options.animationSpeed / 2,
+ /*
+ * End of animation callback.
+ */
+ function () {
+ //
+ // Set the css hidden options.
+ //
+ modal.css( cssOpts.close );
+
+ });
+ //
+ // Is the modal animation queued?
+ //
+ if ( !modalQueued ) {
+ //
+ // Oh, the modal(s) are mid animating.
+ // Let's delay the animation queue.
+ //
+ modalBg.delay( options.animationSpeed )
+ //
+ // Fade out the modal background.
+ //
+ .fadeOut(
+ /*
+ * Animation speed.
+ */
+ options.animationSpeed,
+ /*
+ * End of animation callback.
+ */
+ function () {
+ //
+ // Trigger the modal 'closed' event.
+ // This should trigger any method set in the options.closed property.
+ //
+ modal.trigger( 'reveal:closed' );
+
+ });
+
+ } else {
+ //
+ // We're not mid queue.
+ // Trigger the modal 'closed' event.
+ // This should trigger any method set in the options.closed propety.
+ //
+ modal.trigger( 'reveal:closed' );
+
+ } // end if !modalQueued
+ //
+ // Reset the modalQueued variable.
+ //
+ modalQueued = false;
+
+ } // end if animation 'fadeAndPop'
+
+ //
+ // Are we using the 'fade' animation.
+ //
+ if ( options.animation === "fade" ) {
+ //
+ // Yes, we're using the 'fade' animation.
+ //
+ modal.animate( { "opacity" : 0 },
+ /*
+ * Animation speed.
+ */
+ options.animationSpeed,
+ /*
+ * End of animation callback.
+ */
+ function () {
+ //
+ // Set the css close options.
+ //
+ modal.css( cssOpts.close );
+
+ }); // end animate
+
+ //
+ // Are we mid animating the modal(s)?
+ //
+ if ( !modalQueued ) {
+ //
+ // Oh, the modal(s) are mid animating.
+ // Let's delay the animation queue.
+ //
+ modalBg.delay( options.animationSpeed )
+ //
+ // Let's fade out the modal background element.
+ //
+ .fadeOut(
+ /*
+ * Animation speed.
+ */
+ options.animationSpeed,
+ /*
+ * End of animation callback.
+ */
+ function () {
+ //
+ // Trigger the modal 'closed' event.
+ // This should trigger any method set in the options.closed propety.
+ //
+ modal.trigger( 'reveal:closed' );
+
+ }); // end fadeOut
+
+ } else {
+ //
+ // We're not mid queue.
+ // Trigger the modal 'closed' event.
+ // This should trigger any method set in the options.closed propety.
+ //
+ modal.trigger( 'reveal:closed' );
+
+ } // end if !modalQueued
+
+ } // end if animation 'fade'
+
+ //
+ // Are we not animating?
+ //
+ if ( options.animation === "none" ) {
+ //
+ // We're not animating.
+ // Set the modal close css options.
+ //
+ modal.css( cssOpts.close );
+ //
+ // Is the modal in the middle of an animation queue?
+ //
+ if ( !modalQueued ) {
+ //
+ // It's not mid queueu. Just hide it.
+ //
+ modalBg.css( { 'display': 'none' } );
+ }
+ //
+ // Trigger the modal 'closed' event.
+ // This should trigger any method set in the options.closed propety.
+ //
+ modal.trigger( 'reveal:closed' );
+
+ } // end if not animating
+
+ } // end if !locked
+
+ } // end closeAnimation
+
+ /**
+ * Destroys the modal and it's events.
+ *
+ * @method destroy
+ */
+ function destroy() {
+ //
+ // Unbind all .reveal events from the modal.
+ //
+ modal.unbind( '.reveal' );
+ //
+ // Unbind all .reveal events from the modal background.
+ //
+ modalBg.unbind( '.reveal' );
+ //
+ // Unbind all .reveal events from the modal 'close' button.
+ //
+ $closeButton.unbind( '.reveal' );
+ //
+ // Unbind all .reveal events from the body.
+ //
+ $( 'body' ).unbind( '.reveal' );
+
+ }
+
+ //
+ // Bind the modal 'close' event
+ //
+ modal.bind( 'reveal:close.reveal', closeAnimation );
+ //
+ // Bind the modal 'opened' + 'closed' event
+ // Calls the unlockModal method.
+ //
+ modal.bind( 'reveal:opened.reveal reveal:closed.reveal', unlockModal );
+ //
+ // Bind the modal 'closed' event.
+ // Calls the destroy method.
+ //
+ modal.bind( 'reveal:closed.reveal', destroy );
+ //
+ // Bind the modal 'open' event
+ // Handled by the options.open property function.
+ //
+ modal.bind( 'reveal:open.reveal', options.open );
+ //
+ // Bind the modal 'opened' event.
+ // Handled by the options.opened property function.
+ //
+ modal.bind( 'reveal:opened.reveal', options.opened );
+ //
+ // Bind the modal 'close' event.
+ // Handled by the options.close property function.
+ //
+ modal.bind( 'reveal:close.reveal', options.close );
+ //
+ // Bind the modal 'closed' event.
+ // Handled by the options.closed property function.