Skip to content
This repository

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse code

Added a base Foundation install

  • Loading branch information...
commit 924774c5bd2cc27491fd13b65359b9519c3243e7 1 parent d556e75
Jonathan Smiley smileyj68 authored

Showing 31 changed files with 13,274 additions and 0 deletions. Show diff stats Hide diff stats

  1. +8 0 humans.txt
  2. BIN  images/foundation/orbit/bullets.jpg
  3. BIN  images/foundation/orbit/left-arrow-small.png
  4. BIN  images/foundation/orbit/left-arrow.png
  5. BIN  images/foundation/orbit/loading.gif
  6. BIN  images/foundation/orbit/mask-black.png
  7. BIN  images/foundation/orbit/pause-black.png
  8. BIN  images/foundation/orbit/right-arrow-small.png
  9. BIN  images/foundation/orbit/right-arrow.png
  10. BIN  images/foundation/orbit/rotator-black.png
  11. BIN  images/foundation/orbit/timer-black.png
  12. +201 0 index.html
  13. +40 0 javascripts/app.js
  14. +52 0 javascripts/foundation.min.js
  15. +15 0 javascripts/jquery.foundation.accordion.js
  16. +19 0 javascripts/jquery.foundation.alerts.js
  17. +49 0 javascripts/jquery.foundation.buttons.js
  18. +483 0 javascripts/jquery.foundation.forms.js
  19. +25 0 javascripts/jquery.foundation.mediaQueryToggle.js
  20. +30 0 javascripts/jquery.foundation.navigation.js
  21. +634 0 javascripts/jquery.foundation.orbit.js
  22. +773 0 javascripts/jquery.foundation.reveal.js
  23. +36 0 javascripts/jquery.foundation.tabs.js
  24. +183 0 javascripts/jquery.foundation.tooltips.js
  25. +9,404 0 javascripts/jquery.js
  26. +157 0 javascripts/jquery.placeholder.js
  27. +4 0 javascripts/modernizr.foundation.js
  28. +4 0 robots.txt
  29. +29 0 stylesheets/app.css
  30. +1,127 0 stylesheets/foundation.css
  31. +1 0  stylesheets/foundation.min.css
8 humans.txt
... ... @@ -0,0 +1,8 @@
  1 +/* Foundation was made by ZURB, an interaction design and design strategy firm in Campbell, CA */
  2 +/* zurb.com */
  3 +/* humanstxt.org */
  4 +
  5 +/* SITE */
  6 + Standards: HTML5, CSS3
  7 + Components: jQuery, Orbit, Reveal
  8 + Software: Coda, Textmate, Git
BIN  images/foundation/orbit/bullets.jpg
BIN  images/foundation/orbit/left-arrow-small.png
BIN  images/foundation/orbit/left-arrow.png
BIN  images/foundation/orbit/loading.gif
BIN  images/foundation/orbit/mask-black.png
BIN  images/foundation/orbit/pause-black.png
BIN  images/foundation/orbit/right-arrow-small.png
BIN  images/foundation/orbit/right-arrow.png
BIN  images/foundation/orbit/rotator-black.png
BIN  images/foundation/orbit/timer-black.png
201 index.html
... ... @@ -0,0 +1,201 @@
  1 +<!DOCTYPE html>
  2 +
  3 +<!-- paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/ -->
  4 +<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang="en"> <![endif]-->
  5 +<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8" lang="en"> <![endif]-->
  6 +<!--[if IE 8]> <html class="no-js lt-ie9" lang="en"> <![endif]-->
  7 +<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
  8 +<head>
  9 + <meta charset="utf-8" />
  10 +
  11 + <!-- Set the viewport width to device width for mobile -->
  12 + <meta name="viewport" content="width=device-width" />
  13 +
  14 + <title>Welcome to Foundation</title>
  15 +
  16 + <!-- Included CSS Files (Uncompressed) -->
  17 + <!--
  18 + <link rel="stylesheet" href="stylesheets/foundation.css">
  19 + -->
  20 +
  21 + <!-- Included CSS Files (Compressed) -->
  22 + <link rel="stylesheet" href="stylesheets/foundation.min.css">
  23 + <link rel="stylesheet" href="stylesheets/app.css">
  24 +
  25 + <script src="javascripts/modernizr.foundation.js"></script>
  26 +
  27 + <!-- IE Fix for HTML5 Tags -->
  28 + <!--[if lt IE 9]>
  29 + <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
  30 + <![endif]-->
  31 +
  32 +</head>
  33 +<body>
  34 +
  35 + <div class="row">
  36 + <div class="twelve columns">
  37 + <h2>Welcome to Foundation</h2>
  38 + <p>This is version <strong>3.0.9</strong> generated on August 15, 2012.</p>
  39 + <hr />
  40 + </div>
  41 + </div>
  42 +
  43 + <div class="row">
  44 + <div class="eight columns">
  45 + <h3>The Grid</h3>
  46 +
  47 + <!-- Grid Example -->
  48 + <div class="row">
  49 + <div class="twelve columns">
  50 + <div class="panel">
  51 + <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>
  52 + </div>
  53 + </div>
  54 + </div>
  55 + <div class="row">
  56 + <div class="six columns">
  57 + <div class="panel">
  58 + <p>Six columns</p>
  59 + </div>
  60 + </div>
  61 + <div class="six columns">
  62 + <div class="panel">
  63 + <p>Six columns</p>
  64 + </div>
  65 + </div>
  66 + </div>
  67 + <div class="row">
  68 + <div class="four columns">
  69 + <div class="panel">
  70 + <p>Four columns</p>
  71 + </div>
  72 + </div>
  73 + <div class="four columns">
  74 + <div class="panel">
  75 + <p>Four columns</p>
  76 + </div>
  77 + </div>
  78 + <div class="four columns">
  79 + <div class="panel">
  80 + <p>Four columns</p>
  81 + </div>
  82 + </div>
  83 + </div>
  84 +
  85 +
  86 + <h3>Tabs</h3>
  87 + <dl class="tabs">
  88 + <dd class="active"><a href="#simple1">Simple Tab 1</a></dd>
  89 + <dd><a href="#simple2">Simple Tab 2</a></dd>
  90 + <dd><a href="#simple3">Simple Tab 3</a></dd>
  91 + </dl>
  92 +
  93 + <ul class="tabs-content">
  94 + <li class="active" id="simple1Tab">This is simple tab 1's content. Pretty neat, huh?</li>
  95 + <li id="simple2Tab">This is simple tab 2's content. Now you see it!</li>
  96 + <li id="simple3Tab">This is simple tab 3's content. It's, you know...okay.</li>
  97 + </ul>
  98 +
  99 +
  100 +
  101 + <h3>Buttons</h3>
  102 +
  103 + <div class="row">
  104 + <div class="six columns">
  105 + <p><a href="#" class="small button">Small Button</a></p>
  106 + <p><a href="#" class="button">Medium Button</a></p>
  107 + <p><a href="#" class="large button">Large Button</a></p>
  108 + </div>
  109 + <div class="six columns">
  110 + <p><a href="#" class="small alert button">Small Alert Button</a></p>
  111 + <p><a href="#" class="success button">Medium Success Button</a></p>
  112 + <p><a href="#" class="large secondary button">Large Secondary Button</a></p>
  113 + </div>
  114 + </div>
  115 +
  116 + </div>
  117 +
  118 + <div class="four columns">
  119 + <h4>Getting Started</h4>
  120 + <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>
  121 +
  122 + <h4>Other Resources</h4>
  123 + <p>Once you've exhausted the fun in this document, you should check out:</p>
  124 + <ul class="disc">
  125 + <li><a href="http://foundation.zurb.com/docs">Foundation Documentation</a><br />Everything you need to know about using the framework.</li>
  126 + <li><a href="http://github.com/zurb/foundation">Foundation on Github</a><br />Latest code, issue reports, feature requests and more.</li>
  127 + <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>
  128 + </ul>
  129 + </div>
  130 + </div>
  131 +
  132 +
  133 + <div class="row">
  134 + <div class="twelve columns">
  135 + <h3>Orbit</h3>
  136 + <div id="featured">
  137 + <img src="http://placehold.it/1200x250&text=Slide_1" alt="slide image">
  138 + <img src="http://placehold.it/1200x250&text=Slide_2" alt="slide image">
  139 + <img src="http://placehold.it/1200x250&text=Slide_3" alt="slide image">
  140 + </div>
  141 + </div>
  142 + </div>
  143 +
  144 +
  145 +
  146 + <div class="row">
  147 + <div class="twelve columns">
  148 + <h3>Reveal</h3>
  149 + <p><a href="#" data-reveal-id="exampleModal" class="button">Example modal</a></p>
  150 + </div>
  151 + </div>
  152 +
  153 + <div id="exampleModal" class="reveal-modal">
  154 + <h2>This is a modal.</h2>
  155 + <p>
  156 + Reveal makes these very easy to summon and dismiss. The close button is simple an anchor with a unicode
  157 + character icon and a class of <code>close-reveal-modal</code>. Clicking anywhere outside the modal will
  158 + also dismiss it.
  159 + </p>
  160 + <a class="close-reveal-modal">×</a>
  161 + </div>
  162 +
  163 +
  164 + <!-- Included JS Files (Uncompressed) -->
  165 + <!--
  166 +
  167 + <script src="javascripts/modernizr.foundation.js"></script>
  168 +
  169 + <script src="javascripts/jquery.js"></script>
  170 +
  171 + <script src="javascripts/jquery.foundation.mediaQueryToggle.js"></script>
  172 +
  173 + <script src="javascripts/jquery.foundation.reveal.js"></script>
  174 +
  175 + <script src="javascripts/jquery.foundation.orbit.js"></script>
  176 +
  177 + <script src="javascripts/jquery.foundation.navigation.js"></script>
  178 +
  179 + <script src="javascripts/jquery.foundation.buttons.js"></script>
  180 +
  181 + <script src="javascripts/jquery.foundation.tabs.js"></script>
  182 +
  183 + <script src="javascripts/jquery.foundation.forms.js"></script>
  184 +
  185 + <script src="javascripts/jquery.foundation.tooltips.js"></script>
  186 +
  187 + <script src="javascripts/jquery.foundation.accordion.js"></script>
  188 +
  189 + <script src="javascripts/jquery.placeholder.js"></script>
  190 +
  191 + <script src="javascripts/jquery.foundation.alerts.js"></script>
  192 +
  193 + -->
  194 +
  195 + <!-- Included JS Files (Compressed) -->
  196 + <script src="javascripts/foundation.min.js"></script>
  197 +
  198 + <!-- Initialize JS Plugins -->
  199 + <script src="javascripts/app.js"></script>
  200 +</body>
  201 +</html>
40 javascripts/app.js
... ... @@ -0,0 +1,40 @@
  1 +(function($){
  2 + $(function(){
  3 + $(document).foundationMediaQueryViewer();
  4 +
  5 + $(document).foundationAlerts();
  6 + $(document).foundationAccordion();
  7 + $(document).tooltips();
  8 + $('input, textarea').placeholder();
  9 +
  10 +
  11 +
  12 + $(document).foundationButtons();
  13 +
  14 +
  15 +
  16 + $(document).foundationNavigation();
  17 +
  18 +
  19 +
  20 + $(document).foundationCustomForms();
  21 +
  22 +
  23 +
  24 +
  25 + $(document).foundationTabs({callback:$.foundation.customForms.appendCustomMarkup});
  26 +
  27 +
  28 +
  29 +
  30 + $("#featured").orbit();
  31 +
  32 +
  33 + // UNCOMMENT THE LINE YOU WANT BELOW IF YOU WANT IE8 SUPPORT AND ARE USING .block-grids
  34 + // $('.block-grid.two-up>li:nth-child(2n+1)').css({clear: 'left'});
  35 + // $('.block-grid.three-up>li:nth-child(3n+1)').css({clear: 'left'});
  36 + // $('.block-grid.four-up>li:nth-child(4n+1)').css({clear: 'left'});
  37 + // $('.block-grid.five-up>li:nth-child(5n+1)').css({clear: 'left'});
  38 + });
  39 +
  40 +})(jQuery);
52 javascripts/foundation.min.js
52 additions, 0 deletions not shown
15 javascripts/jquery.foundation.accordion.js
... ... @@ -0,0 +1,15 @@
  1 +(function ($){
  2 +
  3 + $.fn.foundationAccordion = function (options) {
  4 +
  5 + $(document).on('click.fndtn', '.accordion li', function () {
  6 + var flyout = $(this).children('.content').first();
  7 + $('.accordion .content').not(flyout).hide().parent('li').removeClass('active');
  8 + flyout.show(0, function () {
  9 + flyout.parent('li').addClass('active');
  10 + });
  11 + });
  12 +
  13 + };
  14 +
  15 +})( jQuery );
19 javascripts/jquery.foundation.alerts.js
... ... @@ -0,0 +1,19 @@
  1 +(function ($) {
  2 +
  3 + $.fn.foundationAlerts = function (options) {
  4 + var settings = $.extend({
  5 + callback: $.noop
  6 + }, options);
  7 +
  8 + $(document).on("click", ".alert-box a.close", function (event) {
  9 + event.preventDefault();
  10 + $(this).closest(".alert-box").fadeOut(function (event) {
  11 + $(this).remove();
  12 + // Do something else after the alert closes
  13 + settings.callback();
  14 + });
  15 + });
  16 +
  17 + };
  18 +
  19 +})(jQuery);
49 javascripts/jquery.foundation.buttons.js
... ... @@ -0,0 +1,49 @@
  1 +(function ($) {
  2 +
  3 + $.fn.foundationButtons = function(options) {
  4 + // Prevent event propagation on disabled buttons
  5 + $(document).on('click.fndtn', '.button.disabled', function (e) {
  6 + e.preventDefault();
  7 + });
  8 +
  9 + $('.button.dropdown > ul', this).addClass('no-hover');
  10 +
  11 + $(document).on('click.fndtn', '.button.dropdown, .button.dropdown.split span', function (e) {
  12 + // Stops further propagation of the event up the DOM tree when clicked on the button.
  13 + // Events fired by its descendants are not being blocked.
  14 + if (e.target === this) {
  15 + e.stopPropagation();
  16 + }
  17 + });
  18 + $(document).on('click.fndtn', '.button.dropdown.split span', function (e) {
  19 + e.preventDefault();
  20 + $('.button.dropdown', this).not($(this).parent()).children('ul').removeClass('show-dropdown');
  21 + $(this).siblings('ul').toggleClass('show-dropdown');
  22 + });
  23 + $(document).on('click.fndtn', '.button.dropdown:not(.split)', function (e) {
  24 + $('.button.dropdown', this).not(this).children('ul').removeClass('show-dropdown');
  25 + $(this).children('ul').toggleClass('show-dropdown');
  26 + });
  27 + $(document).on('click.fndtn', 'body, html', function () {
  28 + $('.button.dropdown ul').removeClass('show-dropdown');
  29 + });
  30 +
  31 + // Positioning the Flyout List
  32 + var normalButtonHeight = $('.button.dropdown:not(.large):not(.small):not(.tiny)', this).outerHeight() - 1,
  33 + largeButtonHeight = $('.button.large.dropdown', this).outerHeight() - 1,
  34 + smallButtonHeight = $('.button.small.dropdown', this).outerHeight() - 1,
  35 + tinyButtonHeight = $('.button.tiny.dropdown', this).outerHeight() - 1;
  36 +
  37 + $('.button.dropdown:not(.large):not(.small):not(.tiny) > ul', this).css('top', normalButtonHeight);
  38 + $('.button.dropdown.large > ul', this).css('top', largeButtonHeight);
  39 + $('.button.dropdown.small > ul', this).css('top', smallButtonHeight);
  40 + $('.button.dropdown.tiny > ul', this).css('top', tinyButtonHeight);
  41 +
  42 + $('.button.dropdown.up:not(.large):not(.small):not(.tiny) > ul', this).css('top', 'auto').css('bottom', normalButtonHeight - 2);
  43 + $('.button.dropdown.up.large > ul', this).css('top', 'auto').css('bottom', largeButtonHeight - 2);
  44 + $('.button.dropdown.up.small > ul', this).css('top', 'auto').css('bottom', smallButtonHeight - 2);
  45 + $('.button.dropdown.up.tiny > ul', this).css('top', 'auto').css('bottom', tinyButtonHeight - 2);
  46 +
  47 + };
  48 +
  49 +})( jQuery );
483 javascripts/jquery.foundation.forms.js
... ... @@ -0,0 +1,483 @@
  1 +/*
  2 + * jQuery Custom Forms Plugin 1.0
  3 + * www.ZURB.com
  4 + * Copyright 2010, ZURB
  5 + * Free to use under the MIT license.
  6 + * http://www.opensource.org/licenses/mit-license.php
  7 +*/
  8 +
  9 +(function( $ ){
  10 +
  11 + /**
  12 + * Helper object used to quickly adjust all hidden parent element's, display and visibility properties.
  13 + * This is currently used for the custom drop downs. When the dropdowns are contained within a reveal modal
  14 + * we cannot accurately determine the list-item elements width property, since the modal's display property is set
  15 + * to 'none'.
  16 + *
  17 + * This object will help us work around that problem.
  18 + *
  19 + * NOTE: This could also be plugin.
  20 + *
  21 + * @function hiddenFix
  22 + */
  23 + var hiddenFix = function() {
  24 +
  25 + return {
  26 + /**
  27 + * Sets all hidden parent elements and self to visibile.
  28 + *
  29 + * @method adjust
  30 + * @param {jQuery Object} $child
  31 + */
  32 +
  33 + // We'll use this to temporarily store style properties.
  34 + tmp : [],
  35 +
  36 + // We'll use this to set hidden parent elements.
  37 + hidden : null,
  38 +
  39 + adjust : function( $child ) {
  40 + // Internal reference.
  41 + var _self = this;
  42 +
  43 + // Set all hidden parent elements, including this element.
  44 + _self.hidden = $child.parents().andSelf().filter( ":hidden" );
  45 +
  46 + // Loop through all hidden elements.
  47 + _self.hidden.each( function() {
  48 +
  49 + // Cache the element.
  50 + var $elem = $( this );
  51 +
  52 + // Store the style attribute.
  53 + // Undefined if element doesn't have a style attribute.
  54 + _self.tmp.push( $elem.attr( 'style' ) );
  55 +
  56 + // Set the element's display property to block,
  57 + // but ensure it's visibility is hidden.
  58 + $elem.css( { 'visibility' : 'hidden', 'display' : 'block' } );
  59 + });
  60 +
  61 + }, // end adjust
  62 +
  63 + /**
  64 + * Resets the elements previous state.
  65 + *
  66 + * @method reset
  67 + */
  68 + reset : function() {
  69 + // Internal reference.
  70 + var _self = this;
  71 + // Loop through our hidden element collection.
  72 + _self.hidden.each( function( i ) {
  73 + // Cache this element.
  74 + var $elem = $( this ),
  75 + _tmp = _self.tmp[ i ]; // Get the stored 'style' value for this element.
  76 +
  77 + // If the stored value is undefined.
  78 + if( _tmp === undefined )
  79 + // Remove the style attribute.
  80 + $elem.removeAttr( 'style' );
  81 + else
  82 + // Otherwise, reset the element style attribute.
  83 + $elem.attr( 'style', _tmp );
  84 +
  85 + });
  86 + // Reset the tmp array.
  87 + _self.tmp = [];
  88 + // Reset the hidden elements variable.
  89 + _self.hidden = null;
  90 +
  91 + } // end reset
  92 +
  93 + }; // end return
  94 +
  95 + };
  96 +
  97 + jQuery.foundation = jQuery.foundation || {};
  98 + jQuery.foundation.customForms = jQuery.foundation.customForms || {};
  99 +
  100 + $.foundation.customForms.appendCustomMarkup = function ( options ) {
  101 +
  102 + var defaults = {
  103 + disable_class: "js-disable-custom"
  104 + };
  105 +
  106 + options = $.extend( defaults, options );
  107 +
  108 + function appendCustomMarkup(idx, sel) {
  109 + var $this = $(sel).hide(),
  110 + type = $this.attr('type'),
  111 + $span = $this.next('span.custom.' + type);
  112 +
  113 + if ($span.length === 0) {
  114 + $span = $('<span class="custom ' + type + '"></span>').insertAfter($this);
  115 + }
  116 +
  117 + $span.toggleClass('checked', $this.is(':checked'));
  118 + $span.toggleClass('disabled', $this.is(':disabled'));
  119 + }
  120 +
  121 + function appendCustomSelect(idx, sel) {
  122 + var hiddenFixObj = hiddenFix();
  123 + //
  124 + // jQueryify the <select> element and cache it.
  125 + //
  126 + var $this = $( sel ),
  127 + //
  128 + // Find the custom drop down element.
  129 + //
  130 + $customSelect = $this.next( 'div.custom.dropdown' ),
  131 + //
  132 + // Find the custom select element within the custom drop down.
  133 + //
  134 + $customList = $customSelect.find( 'ul' ),
  135 + //
  136 + // Find the custom a.current element.
  137 + //
  138 + $selectCurrent = $customSelect.find( ".current" ),
  139 + //
  140 + // Find the custom a.selector element (the drop-down icon).
  141 + //
  142 + $selector = $customSelect.find( ".selector" ),
  143 + //
  144 + // Get the <options> from the <select> element.
  145 + //
  146 + $options = $this.find( 'option' ),
  147 + //
  148 + // Filter down the selected options
  149 + //
  150 + $selectedOption = $options.filter( ':selected' ),
  151 + //
  152 + // Initial max width.
  153 + //
  154 + maxWidth = 0,
  155 + //
  156 + // We'll use this variable to create the <li> elements for our custom select.
  157 + //
  158 + liHtml = '',
  159 + //
  160 + // We'll use this to cache the created <li> elements within our custom select.
  161 + //
  162 + $listItems
  163 + ;
  164 + var $currentSelect = false;
  165 + //
  166 + // Should we not create a custom list?
  167 + //
  168 + if ( $this.hasClass( 'no-custom' ) ) return;
  169 +
  170 + //
  171 + // Did we not create a custom select element yet?
  172 + //
  173 + if ( $customSelect.length === 0 ) {
  174 + //
  175 + // Let's create our custom select element!
  176 + //
  177 +
  178 + //
  179 + // Determine what select size to use.
  180 + //
  181 + var customSelectSize = $this.hasClass( 'small' ) ? 'small' :
  182 + $this.hasClass( 'medium' ) ? 'medium' :
  183 + $this.hasClass( 'large' ) ? 'large' :
  184 + $this.hasClass( 'expand' ) ? 'expand' : ''
  185 + ;
  186 + //
  187 + // Build our custom list.
  188 + //
  189 + $customSelect = $('<div class="' + ['custom', 'dropdown', customSelectSize ].join( ' ' ) + '"><a href="#" class="selector"></a><ul /></div>"');
  190 + //
  191 + // Grab the selector element
  192 + //
  193 + $selector = $customSelect.find( ".selector" );
  194 + //
  195 + // Grab the unordered list element from the custom list.
  196 + //
  197 + $customList = $customSelect.find( "ul" );
  198 + //
  199 + // Build our <li> elements.
  200 + //
  201 + liHtml = $options.map( function() { return "<li>" + $( this ).html() + "</li>"; } ).get().join( '' );
  202 + //
  203 + // Append our <li> elements to the custom list (<ul>).
  204 + //
  205 + $customList.append( liHtml );
  206 + //
  207 + // Insert the the currently selected list item before all other elements.
  208 + // Then, find the element and assign it to $currentSelect.
  209 + //
  210 +
  211 + $currentSelect = $customSelect.prepend( '<a href="#" class="current">' + $selectedOption.html() + '</a>' ).find( ".current" );
  212 + //
  213 + // Add the custom select element after the <select> element.
  214 + //
  215 + $this.after( $customSelect )
  216 + //
  217 + //then hide the <select> element.
  218 + //
  219 + .hide();
  220 +
  221 + } else {
  222 + //
  223 + // Create our list item <li> elements.
  224 + //
  225 + liHtml = $options.map( function() { return "<li>" + $( this ).html() + "</li>"; } ).get().join( '' );
  226 + //
  227 + // Refresh the ul with options from the select in case the supplied markup doesn't match.
  228 + // Clear what's currently in the <ul> element.
  229 + //
  230 + $customList.html( '' )
  231 + //
  232 + // Populate the list item <li> elements.
  233 + //
  234 + .append( liHtml );
  235 +
  236 + } // endif $customSelect.length === 0
  237 +
  238 + //
  239 + // Determine whether or not the custom select element should be disabled.
  240 + //
  241 + $customSelect.toggleClass( 'disabled', $this.is( ':disabled' ) );
  242 + //
  243 + // Cache our List item elements.
  244 + //
  245 + $listItems = $customList.find( 'li' );
  246 +
  247 + //
  248 + // Determine which elements to select in our custom list.
  249 + //
  250 + $options.each( function ( index ) {
  251 +
  252 + if ( this.selected ) {
  253 + //
  254 + // Add the selected class to the current li element
  255 + //
  256 + $listItems.eq( index ).addClass( 'selected' );
  257 + //
  258 + // Update the current element with the option value.
  259 + //
  260 + if ($currentSelect) {
  261 + $currentSelect.html( $( this ).html() );
  262 + }
  263 +
  264 + }
  265 +
  266 + });
  267 +
  268 + //
  269 + // Update the custom <ul> list width property.
  270 + //
  271 + $customList.css( 'width', 'inherit' );
  272 + //
  273 + // Set the custom select width property.
  274 + //
  275 + $customSelect.css( 'width', 'inherit' );
  276 +
  277 + //
  278 + // If we're not specifying a predetermined form size.
  279 + //
  280 + if ( !$customSelect.is( '.small, .medium, .large, .expand' ) ) {
  281 +
  282 + // ------------------------------------------------------------------------------------
  283 + // This is a work-around for when elements are contained within hidden parents.
  284 + // For example, when custom-form elements are inside of a hidden reveal modal.
  285 + //
  286 + // We need to display the current custom list element as well as hidden parent elements
  287 + // in order to properly calculate the list item element's width property.
  288 + // -------------------------------------------------------------------------------------
  289 +
  290 + //
  291 + // Show the drop down.
  292 + // This should ensure that the list item's width values are properly calculated.
  293 + //
  294 + $customSelect.addClass( 'open' );
  295 + //
  296 + // Quickly, display all parent elements.
  297 + // This should help us calcualate the width of the list item's within the drop down.
  298 + //
  299 + hiddenFixObj.adjust( $customList );
  300 + //
  301 + // Grab the largest list item width.
  302 + //
  303 + maxWidth = ( $listItems.outerWidth() > maxWidth ) ? $listItems.outerWidth() : maxWidth;
  304 + //
  305 + // Okay, now reset the parent elements.
  306 + // This will hide them again.
  307 + //
  308 + hiddenFixObj.reset();
  309 + //
  310 + // Finally, hide the drop down.
  311 + //
  312 + $customSelect.removeClass( 'open' );
  313 + //
  314 + // Set the custom list width.
  315 + //
  316 + $customSelect.width( maxWidth + 18);
  317 + //
  318 + // Set the custom list element (<ul />) width.
  319 + //
  320 + $customList.width( maxWidth + 16 );
  321 +
  322 + } // endif
  323 +
  324 + }
  325 +
  326 + $('form.custom input:radio[data-customforms!=disabled]').each(appendCustomMarkup);
  327 + $('form.custom input:checkbox[data-customforms!=disabled]').each(appendCustomMarkup);
  328 + $('form.custom select[data-customforms!=disabled]').each(appendCustomSelect);
  329 + };
  330 +
  331 + var refreshCustomSelect = function($select) {
  332 + var maxWidth = 0,
  333 + $customSelect = $select.next();
  334 + $options = $select.find('option');
  335 + $customSelect.find('ul').html('');
  336 +
  337 + $options.each(function () {
  338 + $li = $('<li>' + $(this).html() + '</li>');
  339 + $customSelect.find('ul').append($li);
  340 + });
  341 +
  342 + // re-populate
  343 + $options.each(function (index) {
  344 + if (this.selected) {
  345 + $customSelect.find('li').eq(index).addClass('selected');
  346 + $customSelect.find('.current').html($(this).html());
  347 + }
  348 + });
  349 +
  350 + // fix width
  351 + $customSelect.removeAttr('style')
  352 + .find('ul').removeAttr('style');
  353 + $customSelect.find('li').each(function () {
  354 + $customSelect.addClass('open');
  355 + if ($(this).outerWidth() > maxWidth) {
  356 + maxWidth = $(this).outerWidth();
  357 + }
  358 + $customSelect.removeClass('open');
  359 + });
  360 + $customSelect.css('width', maxWidth + 18 + 'px');
  361 + $customSelect.find('ul').css('width', maxWidth + 16 + 'px');
  362 +
  363 + };
  364 +
  365 + var toggleCheckbox = function($element) {
  366 + var $input = $element.prev(),
  367 + input = $input[0];
  368 +
  369 + if (false === $input.is(':disabled')) {
  370 + input.checked = ((input.checked) ? false : true);
  371 + $element.toggleClass('checked');
  372 + }
  373 + };
  374 +
  375 + var toggleRadio = function($element) {
  376 + var $input = $element.prev(),
  377 + input = $input[0];
  378 +
  379 + if (false === $input.is(':disabled')) {
  380 + $('input:radio[name="' + $input.attr('name') + '"]').each(function () {
  381 + $(this).next().removeClass('checked');
  382 + });
  383 + input.checked = ((input.checked) ? false : true);
  384 + $element.toggleClass('checked');
  385 +
  386 + $input.trigger('change');
  387 + }
  388 + };
  389 +
  390 + $(document).on('click', 'form.custom span.custom.checkbox', function (event) {
  391 + event.preventDefault();
  392 + event.stopPropagation();
  393 +
  394 + toggleCheckbox($(this));
  395 + });
  396 +
  397 + $(document).on('click', 'form.custom span.custom.radio', function (event) {
  398 + event.preventDefault();
  399 + event.stopPropagation();
  400 +
  401 + toggleRadio($(this));
  402 + });
  403 +
  404 + $(document).on('change', 'form.custom select[data-customforms!=disabled]', function (event) {
  405 + refreshCustomSelect($(this));
  406 + });
  407 +
  408 + $(document).on('click', 'form.custom label', function (event) {
  409 + var $associatedElement = $('#' + $(this).attr('for')),
  410 + $customCheckbox,
  411 + $customRadio;
  412 + if ($associatedElement.length !== 0) {
  413 + if ($associatedElement.attr('type') === 'checkbox') {
  414 + event.preventDefault();
  415 + $customCheckbox = $(this).find('span.custom.checkbox');
  416 + toggleCheckbox($customCheckbox);
  417 + } else if ($associatedElement.attr('type') === 'radio') {
  418 + event.preventDefault();
  419 + $customRadio = $(this).find('span.custom.radio');
  420 + toggleRadio($customRadio);
  421 + }
  422 + }
  423 + });
  424 +
  425 + $(document).on('click', 'form.custom div.custom.dropdown a.current, form.custom div.custom.dropdown a.selector', function (event) {
  426 + var $this = $(this),
  427 + $dropdown = $this.closest('div.custom.dropdown'),
  428 + $select = $dropdown.prev();
  429 +
  430 + event.preventDefault();
  431 + $('div.dropdown').removeClass('open');
  432 +
  433 + if (false === $select.is(':disabled')) {
  434 + $dropdown.toggleClass('open');
  435 +
  436 + if ($dropdown.hasClass('open')) {
  437 + $(document).bind('click.customdropdown', function (event) {
  438 + $dropdown.removeClass('open');
  439 + $(document).unbind('.customdropdown');
  440 + });
  441 + } else {
  442 + $(document).unbind('.customdropdown');
  443 + }
  444 + return false;
  445 + }
  446 + });
  447 +
  448 + $(document).on('click', 'form.custom div.custom.dropdown li', function (event) {
  449 + var $this = $(this),
  450 + $customDropdown = $this.closest('div.custom.dropdown'),
  451 + $select = $customDropdown.prev(),
  452 + selectedIndex = 0;
  453 +
  454 + event.preventDefault();
  455 + event.stopPropagation();
  456 + $('div.dropdown').removeClass('open');
  457 +
  458 + $this
  459 + .closest('ul')
  460 + .find('li')
  461 + .removeClass('selected');
  462 + $this.addClass('selected');
  463 +
  464 + $customDropdown
  465 + .removeClass('open')
  466 + .find('a.current')
  467 + .html($this.html());
  468 +
  469 + $this.closest('ul').find('li').each(function (index) {
  470 + if ($this[0] == this) {
  471 + selectedIndex = index;
  472 + }
  473 +
  474 + });
  475 + $select[0].selectedIndex = selectedIndex;
  476 +
  477 + $select.trigger('change');
  478 + });
  479 +
  480 +
  481 + $.fn.foundationCustomForms = $.foundation.customForms.appendCustomMarkup;
  482 +
  483 +})( jQuery );
25 javascripts/jquery.foundation.mediaQueryToggle.js
... ... @@ -0,0 +1,25 @@
  1 +(function ($) {
  2 +
  3 + $.fn.foundationMediaQueryViewer = function (options) {
  4 +
  5 + var settings = $.extend(options,{toggleKey:77}); // // Press 'M'
  6 + $(document).on("keyup.mediaQueryViewer", ":input", function(e){
  7 + if (e.which === settings.toggleKey) {
  8 + e.stopPropagation();
  9 + }
  10 + });
  11 + $(document).on("keyup.mediaQueryViewer", function(e) {
  12 + var $mqViewer = $('#fqv');
  13 +
  14 + if (e.which === settings.toggleKey) {
  15 + if ($mqViewer.length > 0) {
  16 + $mqViewer.remove();
  17 + } else {
  18 + $('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>');
  19 + }
  20 + }
  21 + });
  22 +
  23 + };
  24 +
  25 +})(jQuery);
30 javascripts/jquery.foundation.navigation.js
... ... @@ -0,0 +1,30 @@
  1 +(function ($){
  2 +
  3 + $.fn.foundationNavigation = function (options) {
  4 +
  5 + var lockNavBar = false;
  6 + // Windows Phone, sadly, does not register touch events :(
  7 + if (Modernizr.touch || navigator.userAgent.match(/Windows Phone/i)) {
  8 + $(document).on('click.fndtn touchstart.fndtn', '.nav-bar a.flyout-toggle', function (e) {
  9 + e.preventDefault();
  10 + var flyout = $(this).siblings('.flyout').first();
  11 + if (lockNavBar === false) {
  12 + $('.nav-bar .flyout').not(flyout).slideUp(500);
  13 + flyout.slideToggle(500, function () {
  14 + lockNavBar = false;
  15 + });
  16 + }
  17 + lockNavBar = true;
  18 + });
  19 + $('.nav-bar>li.has-flyout', this).addClass('is-touch');
  20 + } else {
  21 + $('.nav-bar>li.has-flyout', this).hover(function () {
  22 + $(this).children('.flyout').show();
  23 + }, function () {
  24 + $(this).children('.flyout').hide();
  25 + });
  26 + }
  27 +
  28 + };
  29 +
  30 +})( jQuery );
634 javascripts/jquery.foundation.orbit.js
... ... @@ -0,0 +1,634 @@
  1 +/*
  2 + * jQuery Orbit Plugin 1.4.0
  3 + * www.ZURB.com/playground
  4 + * Copyright 2010, ZURB
  5 + * Free to use under the MIT license.
  6 + * http://www.opensource.org/licenses/mit-license.php
  7 +*/
  8 +
  9 +
  10 +(function ($) {
  11 + 'use strict';
  12 + $.fn.findFirstImage = function () {
  13 + return this.first()
  14 + .find('img')
  15 + .andSelf().filter('img')
  16 + .first();
  17 + };
  18 +
  19 + var ORBIT = {
  20 +
  21 + defaults: {
  22 + animation: 'horizontal-push', // fade, horizontal-slide, vertical-slide, horizontal-push, vertical-push
  23 + animationSpeed: 600, // how fast animtions are
  24 + timer: true, // true or false to have the timer
  25 + advanceSpeed: 4000, // if timer is enabled, time between transitions
  26 + pauseOnHover: false, // if you hover pauses the slider
  27 + startClockOnMouseOut: false, // if clock should start on MouseOut
  28 + startClockOnMouseOutAfter: 1000, // how long after MouseOut should the timer start again
  29 + directionalNav: true, // manual advancing directional navs
  30 + directionalNavRightText: 'Right', // text of right directional element for accessibility
  31 + directionalNavLeftText: 'Left', // text of left directional element for accessibility
  32 + captions: true, // do you want captions?
  33 + captionAnimation: 'fade', // fade, slideOpen, none
  34 + captionAnimationSpeed: 600, // if so how quickly should they animate in
  35 + resetTimerOnClick: false, // true resets the timer instead of pausing slideshow progress on manual navigation
  36 + bullets: false, // true or false to activate the bullet navigation
  37 + bulletThumbs: false, // thumbnails for the bullets
  38 + bulletThumbLocation: '', // location from this file where thumbs will be
  39 + afterSlideChange: $.noop, // empty function
  40 + afterLoadComplete: $.noop, //callback to execute after everything has been loaded
  41 + fluid: true,
  42 + centerBullets: true // center bullet nav with js, turn this off if you want to position the bullet nav manually
  43 + },
  44 +
  45 + activeSlide: 0,
  46 + numberSlides: 0,
  47 + orbitWidth: null,
  48 + orbitHeight: null,
  49 + locked: null,
  50 + timerRunning: null,
  51 + degrees: 0,
  52 + wrapperHTML: '<div class="orbit-wrapper" />',
  53 + timerHTML: '<div class="timer"><span class="mask"><span class="rotator"></span></span><span class="pause"></span></div>',
  54 + captionHTML: '<div class="orbit-caption"></div>',
  55 + directionalNavHTML: '<div class="slider-nav"><span class="right"></span><span class="left"></span></div>',
  56 + bulletHTML: '<ul class="orbit-bullets"></ul>',
  57 +
  58 + init: function (element, options) {
  59 + var $imageSlides,
  60 + imagesLoadedCount = 0,
  61 + self = this;
  62 +
  63 + // Bind functions to correct context
  64 + this.clickTimer = $.proxy(this.clickTimer, this);
  65 + this.addBullet = $.proxy(this.addBullet, this);
  66 + this.resetAndUnlock = $.proxy(this.resetAndUnlock, this);
  67 + this.stopClock = $.proxy(this.stopClock, this);
  68 + this.startTimerAfterMouseLeave = $.proxy(this.startTimerAfterMouseLeave, this);
  69 + this.clearClockMouseLeaveTimer = $.proxy(this.clearClockMouseLeaveTimer, this);
  70 + this.rotateTimer = $.proxy(this.rotateTimer, this);
  71 +
  72 + this.options = $.extend({}, this.defaults, options);
  73 + if (this.options.timer === 'false') this.options.timer = false;
  74 + if (this.options.captions === 'false') this.options.captions = false;
  75 + if (this.options.directionalNav === 'false') this.options.directionalNav = false;
  76 +
  77 + this.$element = $(element);
  78 + this.$wrapper = this.$element.wrap(this.wrapperHTML).parent();
  79 + this.$slides = this.$element.children('img, a, div');
  80 +
  81 + this.$element.bind('orbit.next', function () {
  82 + self.shift('next');
  83 + });
  84 +
  85 + this.$element.bind('orbit.prev', function () {
  86 + self.shift('prev');
  87 + });
  88 +
  89 + this.$element.bind('orbit.goto', function (event, index) {
  90 + self.shift(index);
  91 + });
  92 +
  93 + this.$element.bind('orbit.start', function (event, index) {
  94 + self.startClock();
  95 + });
  96 +
  97 + this.$element.bind('orbit.stop', function (event, index) {
  98 + self.stopClock();
  99 + });
  100 +
  101 + $imageSlides = this.$slides.filter('img');
  102 +
  103 + if ($imageSlides.length === 0) {
  104 + this.loaded();
  105 + } else {
  106 + $imageSlides.bind('imageready', function () {
  107 + imagesLoadedCount += 1;
  108 + if (imagesLoadedCount === $imageSlides.length) {
  109 + self.loaded();
  110 + }
  111 + });
  112 + }
  113 + },
  114 +
  115 + loaded: function () {
  116 + this.$element
  117 + .addClass('orbit')
  118 + .css({width: '1px', height: '1px'});
  119 +
  120 + this.$slides.addClass('orbit-slide');
  121 +
  122 + this.setDimentionsFromLargestSlide();
  123 + this.updateOptionsIfOnlyOneSlide();
  124 + this.setupFirstSlide();
  125 +
  126 + if (this.options.timer) {
  127 + this.setupTimer();
  128 + this.startClock();
  129 + }
  130 +
  131 + if (this.options.captions) {
  132 + this.setupCaptions();
  133 + }
  134 +
  135 + if (this.options.directionalNav) {
  136 + this.setupDirectionalNav();
  137 + }
  138 +
  139 + if (this.options.bullets) {
  140 + this.setupBulletNav();
  141 + this.setActiveBullet();
  142 + }
  143 +
  144 + this.options.afterLoadComplete.call(this);
  145 + },
  146 +
  147 + currentSlide: function () {
  148 + return this.$slides.eq(this.activeSlide);
  149 + },
  150 +
  151 + setDimentionsFromLargestSlide: function () {
  152 + //Collect all slides and set slider size of largest image
  153 + var self = this,
  154 + $fluidPlaceholder;
  155 +
  156 + self.$element.add(self.$wrapper).width(this.$slides.first().outerWidth());
  157 + self.$element.add(self.$wrapper).height(this.$slides.first().height());
  158 + self.orbitWidth = this.$slides.first().outerWidth();
  159 + self.orbitHeight = this.$slides.first().height();
  160 + $fluidPlaceholder = this.$slides.first().findFirstImage().clone();
  161 +
  162 +
  163 + this.$slides.each(function () {
  164 + var slide = $(this),
  165 + slideWidth = slide.outerWidth(),
  166 + slideHeight = slide.height();
  167 +
  168 + if (slideWidth > self.$element.outerWidth()) {
  169 + self.$element.add(self.$wrapper).width(slideWidth);
  170 + self.orbitWidth = self.$element.outerWidth();
  171 + }
  172 + if (slideHeight > self.$element.height()) {
  173 + self.$element.add(self.$wrapper).height(slideHeight);
  174 + self.orbitHeight = self.$element.height();
  175 + $fluidPlaceholder = $(this).findFirstImage().clone();
  176 + }
  177 + self.numberSlides += 1;
  178 + });
  179 +
  180 + if (this.options.fluid) {
  181 + if (typeof this.options.fluid === "string") {
  182 + $fluidPlaceholder = $('<img src="http://placehold.it/' + this.options.fluid + '" />')
  183 + }
  184 +
  185 + self.$element.prepend($fluidPlaceholder);
  186 + $fluidPlaceholder.addClass('fluid-placeholder');
  187 + self.$element.add(self.$wrapper).css({width: 'inherit'});
  188 + self.$element.add(self.$wrapper).css({height: 'inherit'});
  189 +
  190 + $(window).bind('resize', function () {
  191 + self.orbitWidth = self.$element.outerWidth();
  192 + self.orbitHeight = self.$element.height();
  193 + });
  194 + }
  195 + },
  196 +
  197 + //Animation locking functions
  198 + lock: function () {
  199 + this.locked = true;
  200 + },
  201 +
  202 + unlock: function () {
  203 + this.locked = false;
  204 + },
  205 +
  206 + updateOptionsIfOnlyOneSlide: function () {
  207 + if(this.$slides.length === 1) {
  208 + this.options.directionalNav = false;
  209 + this.options.timer = false;
  210 + this.options.bullets = false;
  211 + }
  212 + },
  213 +
  214 + setupFirstSlide: function () {
  215 + //Set initial front photo z-index and fades it in
  216 + var self = this;
  217 + this.$slides.first()
  218 + .css({"z-index" : 3})
  219 + .fadeIn(function() {
  220 + //brings in all other slides IF css declares a display: none
  221 + self.$slides.css({"display":"block"})