mirror of
https://github.com/Growstuff/growstuff.git
synced 2026-05-18 21:56:55 -04:00
Skud
3
Gemfile
3
Gemfile
@@ -23,6 +23,9 @@ group :assets do
|
||||
gem 'therubyracer', :platforms => :ruby
|
||||
|
||||
gem 'uglifier', '>= 1.0.3'
|
||||
|
||||
gem 'compass-rails', '~> 1.0.3'
|
||||
gem 'zurb-foundation', '~> 3.0.9'
|
||||
end
|
||||
|
||||
gem 'jquery-rails'
|
||||
|
||||
17
Gemfile.lock
17
Gemfile.lock
@@ -51,6 +51,8 @@ GEM
|
||||
chunky_png (~> 1.2)
|
||||
fssm (>= 0.2.7)
|
||||
sass (~> 3.1)
|
||||
compass-rails (1.0.3)
|
||||
compass (>= 0.12.2, < 0.14)
|
||||
daemon_controller (1.0.0)
|
||||
devise (2.1.2)
|
||||
bcrypt-ruby (~> 3.0)
|
||||
@@ -79,6 +81,9 @@ GEM
|
||||
mime-types (~> 1.16)
|
||||
treetop (~> 1.4.8)
|
||||
mime-types (1.19)
|
||||
modular-scale (1.0.2)
|
||||
compass (>= 0.11.5)
|
||||
sassy-math (>= 1.2)
|
||||
multi_json (1.3.6)
|
||||
net-scp (1.0.4)
|
||||
net-ssh (>= 1.99.1)
|
||||
@@ -125,8 +130,9 @@ GEM
|
||||
rspec-expectations (~> 2.11.0)
|
||||
rspec-mocks (~> 2.11.0)
|
||||
rspec-core (2.11.1)
|
||||
rspec-expectations (2.11.3)
|
||||
rspec-expectations (2.11.2)
|
||||
diff-lcs (~> 1.1.3)
|
||||
rspec-expectations (2.11.3)
|
||||
rspec-mocks (2.11.2)
|
||||
rspec-rails (2.11.0)
|
||||
actionpack (>= 3.0)
|
||||
@@ -140,6 +146,8 @@ GEM
|
||||
railties (~> 3.2.0)
|
||||
sass (>= 3.1.10)
|
||||
tilt (~> 1.3)
|
||||
sassy-math (1.2)
|
||||
compass (~> 0.11)
|
||||
sprockets (2.1.3)
|
||||
hike (~> 1.2)
|
||||
rack (~> 1.0)
|
||||
@@ -162,6 +170,11 @@ GEM
|
||||
nokogiri (>= 1.2.0)
|
||||
rack (>= 1.0)
|
||||
rack-test (>= 0.5.3)
|
||||
zurb-foundation (3.0.9)
|
||||
compass (>= 0.12.2)
|
||||
modular-scale (>= 1.0.2)
|
||||
rake
|
||||
sass (>= 3.2.0)
|
||||
|
||||
PLATFORMS
|
||||
ruby
|
||||
@@ -172,6 +185,7 @@ DEPENDENCIES
|
||||
capistrano
|
||||
coffee-rails (~> 3.2.1)
|
||||
compass
|
||||
compass-rails (~> 1.0.3)
|
||||
devise
|
||||
haml
|
||||
jquery-rails
|
||||
@@ -185,3 +199,4 @@ DEPENDENCIES
|
||||
therubyracer
|
||||
uglifier (>= 1.0.3)
|
||||
webrat
|
||||
zurb-foundation (~> 3.0.9)
|
||||
|
||||
BIN
app/assets/images/foundation/orbit/bullets.jpg
Normal file
BIN
app/assets/images/foundation/orbit/bullets.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 657 B |
BIN
app/assets/images/foundation/orbit/left-arrow-small.png
Normal file
BIN
app/assets/images/foundation/orbit/left-arrow-small.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.1 KiB |
BIN
app/assets/images/foundation/orbit/left-arrow.png
Normal file
BIN
app/assets/images/foundation/orbit/left-arrow.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 522 B |
BIN
app/assets/images/foundation/orbit/loading.gif
Normal file
BIN
app/assets/images/foundation/orbit/loading.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.5 KiB |
BIN
app/assets/images/foundation/orbit/mask-black.png
Normal file
BIN
app/assets/images/foundation/orbit/mask-black.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 526 B |
BIN
app/assets/images/foundation/orbit/pause-black.png
Normal file
BIN
app/assets/images/foundation/orbit/pause-black.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 288 B |
BIN
app/assets/images/foundation/orbit/right-arrow-small.png
Normal file
BIN
app/assets/images/foundation/orbit/right-arrow-small.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.1 KiB |
BIN
app/assets/images/foundation/orbit/right-arrow.png
Normal file
BIN
app/assets/images/foundation/orbit/right-arrow.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.2 KiB |
BIN
app/assets/images/foundation/orbit/rotator-black.png
Normal file
BIN
app/assets/images/foundation/orbit/rotator-black.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 536 B |
BIN
app/assets/images/foundation/orbit/timer-black.png
Normal file
BIN
app/assets/images/foundation/orbit/timer-black.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 526 B |
@@ -12,4 +12,7 @@
|
||||
//
|
||||
//= require jquery
|
||||
//= require jquery_ujs
|
||||
//= require foundation
|
||||
//= require foundation/app
|
||||
//= require_tree .
|
||||
|
||||
|
||||
22
app/assets/javascripts/foundation/app.js
Normal file
22
app/assets/javascripts/foundation/app.js
Normal file
@@ -0,0 +1,22 @@
|
||||
(function ($) {
|
||||
|
||||
$(function(){
|
||||
$(document).foundationAlerts();
|
||||
$(document).foundationButtons();
|
||||
$(document).foundationAccordion();
|
||||
$(document).foundationNavigation();
|
||||
$(document).foundationCustomForms();
|
||||
$(document).foundationMediaQueryViewer();
|
||||
$(document).foundationTabs({callback:$.foundation.customForms.appendCustomMarkup});
|
||||
|
||||
$(document).tooltips();
|
||||
$('input, textarea').placeholder();
|
||||
|
||||
// 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: 'both'});
|
||||
// $('.block-grid.three-up>li:nth-child(3n+1)').css({clear: 'both'});
|
||||
// $('.block-grid.four-up>li:nth-child(4n+1)').css({clear: 'both'});
|
||||
// $('.block-grid.five-up>li:nth-child(5n+1)').css({clear: 'both'});
|
||||
});
|
||||
|
||||
})(jQuery);
|
||||
@@ -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 );
|
||||
@@ -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);
|
||||
@@ -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 );
|
||||
483
app/assets/javascripts/foundation/jquery.foundation.forms.js
Normal file
483
app/assets/javascripts/foundation/jquery.foundation.forms.js
Normal file
@@ -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 );
|
||||
@@ -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);
|
||||
@@ -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 );
|
||||
634
app/assets/javascripts/foundation/jquery.foundation.orbit.js
Normal file
634
app/assets/javascripts/foundation/jquery.foundation.orbit.js
Normal file
@@ -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));
|
||||
773
app/assets/javascripts/foundation/jquery.foundation.reveal.js
Normal file
773
app/assets/javascripts/foundation/jquery.foundation.reveal.js
Normal file
@@ -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.
|
||||
//
|
||||
modal.bind( 'reveal:closed.reveal', options.closed );
|
||||
|
||||
//
|
||||
// We're running this for the first time.
|
||||
// Trigger the modal 'open' event.
|
||||
//
|
||||
modal.trigger( 'reveal:open' );
|
||||
|
||||
//
|
||||
// Get the closeButton variable element(s).
|
||||
//
|
||||
$closeButton = $( '.' + options.dismissModalClass )
|
||||
//
|
||||
// Bind the element 'click' event and handler.
|
||||
//
|
||||
.bind( 'click.reveal', function () {
|
||||
//
|
||||
// Trigger the modal 'close' event.
|
||||
//
|
||||
modal.trigger( 'reveal:close' );
|
||||
|
||||
});
|
||||
|
||||
//
|
||||
// Should we close the modal background on click?
|
||||
//
|
||||
if ( options.closeOnBackgroundClick ) {
|
||||
//
|
||||
// Yes, close the modal background on 'click'
|
||||
// Set the modal background css 'cursor' propety to pointer.
|
||||
// Adds a pointer symbol when you mouse over the modal background.
|
||||
//
|
||||
modalBg.css( { "cursor": "pointer" } );
|
||||
//
|
||||
// Bind a 'click' event handler to the modal background.
|
||||
//
|
||||
modalBg.bind( 'click.reveal', function () {
|
||||
//
|
||||
// Trigger the modal 'close' event.
|
||||
//
|
||||
modal.trigger( 'reveal:close' );
|
||||
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
//
|
||||
// Bind keyup functions on the body element.
|
||||
// We'll want to close the modal when the 'escape' key is hit.
|
||||
//
|
||||
$( 'body' ).bind( 'keyup.reveal', function ( event ) {
|
||||
//
|
||||
// Did the escape key get triggered?
|
||||
//
|
||||
if ( event.which === 27 ) { // 27 is the keycode for the Escape key
|
||||
//
|
||||
// Escape key was triggered.
|
||||
// Trigger the modal 'close' event.
|
||||
//
|
||||
modal.trigger( 'reveal:close' );
|
||||
}
|
||||
|
||||
}); // end $(body)
|
||||
|
||||
}); // end this.each
|
||||
|
||||
}; // end $.fn
|
||||
|
||||
} ( jQuery ) );
|
||||
36
app/assets/javascripts/foundation/jquery.foundation.tabs.js
Normal file
36
app/assets/javascripts/foundation/jquery.foundation.tabs.js
Normal file
@@ -0,0 +1,36 @@
|
||||
(function ($) {
|
||||
|
||||
$.fn.foundationTabs = function (options) {
|
||||
|
||||
var settings = $.extend({
|
||||
callback: $.noop
|
||||
}, options);
|
||||
|
||||
var activateTab = function ($tab) {
|
||||
var $activeTab = $tab.closest('dl').find('dd.active'),
|
||||
contentLocation = $tab.children('a').attr("href") + 'Tab';
|
||||
|
||||
// Strip off the current url that IE adds
|
||||
contentLocation = contentLocation.replace(/^.+#/, '#');
|
||||
|
||||
//Make Tab Active
|
||||
$activeTab.removeClass('active');
|
||||
$tab.addClass('active');
|
||||
|
||||
//Show Tab Content
|
||||
$(contentLocation).closest('.tabs-content').children('li').removeClass('active').hide();
|
||||
$(contentLocation).css('display', 'block').addClass('active');
|
||||
};
|
||||
|
||||
$(document).on('click.fndtn', 'dl.tabs dd a', function (event){
|
||||
activateTab($(this).parent('dd'));
|
||||
});
|
||||
|
||||
if (window.location.hash) {
|
||||
activateTab($('a[href="' + window.location.hash + '"]').parent('dd'));
|
||||
settings.callback();
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
})(jQuery);
|
||||
183
app/assets/javascripts/foundation/jquery.foundation.tooltips.js
Normal file
183
app/assets/javascripts/foundation/jquery.foundation.tooltips.js
Normal file
@@ -0,0 +1,183 @@
|
||||
/*
|
||||
* jQuery Foundation Tooltip Plugin 2.0.1
|
||||
* http://foundation.zurb.com
|
||||
* Copyright 2012, ZURB
|
||||
* Free to use under the MIT license.
|
||||
* http://www.opensource.org/licenses/mit-license.php
|
||||
*/
|
||||
|
||||
/*jslint unparam: true, browser: true, indent: 2 */
|
||||
|
||||
;(function ($) {
|
||||
'use strict';
|
||||
var settings = {
|
||||
bodyHeight : 0,
|
||||
targetClass : '.has-tip',
|
||||
tooltipClass : '.tooltip',
|
||||
tipTemplate : function (selector, content) {
|
||||
return '<span data-selector="' + selector + '" class="' + settings.tooltipClass.substring(1) + '">' + content + '<span class="nub"></span></span>';
|
||||
}
|
||||
},
|
||||
methods = {
|
||||
init : function (options) {
|
||||
return this.each(function () {
|
||||
var $body = $('body');
|
||||
|
||||
if (Modernizr.touch) {
|
||||
$body.on('click.tooltip touchstart.tooltip touchend.tooltip', settings.targetClass, function (e) {
|
||||
e.preventDefault();
|
||||
$(settings.tooltipClass).hide();
|
||||
methods.showOrCreateTip($(this));
|
||||
});
|
||||
$body.on('click.tooltip touchstart.tooltip touchend.tooltip', settings.tooltipClass, function (e) {
|
||||
e.preventDefault();
|
||||
$(this).fadeOut(150);
|
||||
});
|
||||
} else {
|
||||
$body.on('mouseenter.tooltip mouseleave.tooltip', settings.targetClass, function (e) {
|
||||
var $this = $(this);
|
||||
|
||||
if (e.type === 'mouseenter') {
|
||||
methods.showOrCreateTip($this);
|
||||
} else if (e.type === 'mouseleave') {
|
||||
methods.hide($this);
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
showOrCreateTip : function ($target) {
|
||||
var $tip = methods.getTip($target);
|
||||
|
||||
if ($tip && $tip.length > 0) {
|
||||
methods.show($target);
|
||||
} else {
|
||||
methods.create($target);
|
||||
}
|
||||
},
|
||||
getTip : function ($target) {
|
||||
var selector = methods.selector($target),
|
||||
tip = null;
|
||||
|
||||
if (selector) {
|
||||
tip = $('span[data-selector=' + selector + ']' + settings.tooltipClass);
|
||||
}
|
||||
return (tip.length > 0) ? tip : false;
|
||||
},
|
||||
selector : function ($target) {
|
||||
var id = $target.attr('id'),
|
||||
dataSelector = $target.data('selector');
|
||||
|
||||
if (id === undefined && dataSelector === undefined) {
|
||||
dataSelector = 'tooltip' + Math.random().toString(36).substring(7);
|
||||
$target.attr('data-selector', dataSelector);
|
||||
}
|
||||
return (id) ? id : dataSelector;
|
||||
},
|
||||
create : function ($target) {
|
||||
var $tip = $(settings.tipTemplate(methods.selector($target), $('<div>').text($target.attr('title')).html())),
|
||||
classes = methods.inheritable_classes($target);
|
||||
|
||||
$tip.addClass(classes).appendTo('body');
|
||||
if (Modernizr.touch) {
|
||||
$tip.append('<span class="tap-to-close">tap to close </span>');
|
||||
}
|
||||
$target.removeAttr('title');
|
||||
methods.show($target);
|
||||
},
|
||||
reposition : function (target, tip, classes) {
|
||||
var width, nub, nubHeight, nubWidth, column, objPos;
|
||||
|
||||
tip.css('visibility', 'hidden').show();
|
||||
|
||||
width = target.data('width');
|
||||
nub = tip.children('.nub');
|
||||
nubHeight = nub.outerHeight();
|
||||
nubWidth = nub.outerWidth();
|
||||
|
||||
objPos = function (obj, top, right, bottom, left, width) {
|
||||
return obj.css({
|
||||
'top' : top,
|
||||
'bottom' : bottom,
|
||||
'left' : left,
|
||||
'right' : right,
|
||||
'width' : (width) ? width : 'auto'
|
||||
}).end();
|
||||
};
|
||||
|
||||
objPos(tip, (target.offset().top + target.outerHeight() + 10), 'auto', 'auto', target.offset().left, width);
|
||||
objPos(nub, -nubHeight, 'auto', 'auto', 10);
|
||||
|
||||
if ($(window).width() < 767) {
|
||||
column = target.closest('.columns');
|
||||
|
||||
if (column.length < 0) {
|
||||
// if not using Foundation
|
||||
column = $('body');
|
||||
}
|
||||
tip.width(column.outerWidth() - 25).css('left', 15).addClass('tip-override');
|
||||
objPos(nub, -nubHeight, 'auto', 'auto', target.offset().left);
|
||||
} else {
|
||||
if (classes.indexOf('tip-top') > -1) {
|
||||
objPos(tip, (target.offset().top - tip.outerHeight() - nubHeight), 'auto', 'auto', target.offset().left, width)
|
||||
.removeClass('tip-override');
|
||||
objPos(nub, 'auto', 'auto', -nubHeight, 'auto');
|
||||
} else if (classes.indexOf('tip-left') > -1) {
|
||||
objPos(tip, (target.offset().top + (target.outerHeight() / 2) - nubHeight), 'auto', 'auto', (target.offset().left - tip.outerWidth() - 10), width)
|
||||
.removeClass('tip-override');
|
||||
objPos(nub, (tip.outerHeight() / 2) - (nubHeight / 2), -nubHeight, 'auto', 'auto');
|
||||
} else if (classes.indexOf('tip-right') > -1) {
|
||||
objPos(tip, (target.offset().top + (target.outerHeight() / 2) - nubHeight), 'auto', 'auto', (target.offset().left + target.outerWidth() + 10), width)
|
||||
.removeClass('tip-override');
|
||||
objPos(nub, (tip.outerHeight() / 2) - (nubHeight / 2), 'auto', 'auto', -nubHeight);
|
||||
}
|
||||
}
|
||||
tip.css('visibility', 'visible').hide();
|
||||
},
|
||||
inheritable_classes : function (target) {
|
||||
var inheritables = ['tip-top', 'tip-left', 'tip-bottom', 'tip-right', 'noradius'],
|
||||
filtered = target.attr('class').split(' ').map(function (el, i) {
|
||||
if ($.inArray(el, inheritables) !== -1) {
|
||||
return el;
|
||||
}
|
||||
}).join(' ');
|
||||
|
||||
return $.trim(filtered);
|
||||
},
|
||||
show : function ($target) {
|
||||
var $tip = methods.getTip($target);
|
||||
|
||||
methods.reposition($target, $tip, $target.attr('class'));
|
||||
$tip.fadeIn(150);
|
||||
},
|
||||
hide : function ($target) {
|
||||
var $tip = methods.getTip($target);
|
||||
|
||||
$tip.fadeOut(150);
|
||||
},
|
||||
reload : function () {
|
||||
var $self = $(this);
|
||||
|
||||
return ($self.data('tooltips')) ? $self.tooltips('destroy').tooltips('init') : $self.tooltips('init');
|
||||
},
|
||||
destroy : function () {
|
||||
return this.each(function () {
|
||||
$(window).off('.tooltip');
|
||||
$(settings.targetClass).off('.tooltip');
|
||||
$(settings.tooltipClass).each(function (i) {
|
||||
$($(settings.targetClass).get(i)).attr('title', $(this).text());
|
||||
}).remove();
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
$.fn.tooltips = function (method) {
|
||||
if (methods[method]) {
|
||||
return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
|
||||
} else if (typeof method === 'object' || !method) {
|
||||
return methods.init.apply(this, arguments);
|
||||
} else {
|
||||
$.error('Method ' + method + ' does not exist on jQuery.tooltips');
|
||||
}
|
||||
};
|
||||
}(jQuery));
|
||||
9404
app/assets/javascripts/foundation/jquery.js
vendored
Normal file
9404
app/assets/javascripts/foundation/jquery.js
vendored
Normal file
File diff suppressed because it is too large
Load Diff
50
app/assets/javascripts/foundation/jquery.offcanvas.js
Normal file
50
app/assets/javascripts/foundation/jquery.offcanvas.js
Normal file
@@ -0,0 +1,50 @@
|
||||
(function ($) {
|
||||
// Set the negative margin on the top menu for slide-menu pages
|
||||
var $selector1 = $('#topMenu'),
|
||||
events = 'click.fndtn';
|
||||
if ($selector1.length > 0) $selector1.css("margin-top", $selector1.height() * -1);
|
||||
|
||||
// Watch for clicks to show the sidebar
|
||||
var $selector2 = $('#sidebarButton');
|
||||
if ($selector2.length > 0) {
|
||||
$('#sidebarButton').on(events, function (e) {
|
||||
e.preventDefault();
|
||||
$('body').toggleClass('active');
|
||||
});
|
||||
}
|
||||
|
||||
// Watch for clicks to show the menu for slide-menu pages
|
||||
var $selector3 = $('#menuButton');
|
||||
if ($selector3.length > 0) {
|
||||
$('#menuButton').on(events, function (e) {
|
||||
e.preventDefault();
|
||||
$('body').toggleClass('active-menu');
|
||||
});
|
||||
}
|
||||
|
||||
// // Adjust sidebars and sizes when resized
|
||||
// $(window).resize(function() {
|
||||
// // if (!navigator.userAgent.match(/Android/i)) $('body').removeClass('active');
|
||||
// var $selector4 = $('#topMenu');
|
||||
// if ($selector4.length > 0) $selector4.css("margin-top", $selector4.height() * -1);
|
||||
// });
|
||||
|
||||
// Switch panels for the paneled nav on mobile
|
||||
var $selector5 = $('#switchPanels');
|
||||
if ($selector5.length > 0) {
|
||||
$('#switchPanels dd').on(events, function (e) {
|
||||
e.preventDefault();
|
||||
var switchToPanel = $(this).children('a').attr('href'),
|
||||
switchToIndex = $(switchToPanel).index();
|
||||
$(this).toggleClass('active').siblings().removeClass('active');
|
||||
$(switchToPanel).parent().css("left", (switchToIndex * (-100) + '%'));
|
||||
});
|
||||
}
|
||||
|
||||
$('#nav li a').on(events, function (e) {
|
||||
e.preventDefault();
|
||||
var href = $(this).attr('href'),
|
||||
$target = $(href);
|
||||
$('html, body').animate({scrollTop : $target.offset().top}, 300);
|
||||
});
|
||||
});
|
||||
157
app/assets/javascripts/foundation/jquery.placeholder.js
Normal file
157
app/assets/javascripts/foundation/jquery.placeholder.js
Normal file
@@ -0,0 +1,157 @@
|
||||
/*! http://mths.be/placeholder v2.0.7 by @mathias */
|
||||
;(function(window, document, $) {
|
||||
|
||||
var isInputSupported = 'placeholder' in document.createElement('input'),
|
||||
isTextareaSupported = 'placeholder' in document.createElement('textarea'),
|
||||
prototype = $.fn,
|
||||
valHooks = $.valHooks,
|
||||
hooks,
|
||||
placeholder;
|
||||
|
||||
if (isInputSupported && isTextareaSupported) {
|
||||
|
||||
placeholder = prototype.placeholder = function() {
|
||||
return this;
|
||||
};
|
||||
|
||||
placeholder.input = placeholder.textarea = true;
|
||||
|
||||
} else {
|
||||
|
||||
placeholder = prototype.placeholder = function() {
|
||||
var $this = this;
|
||||
$this
|
||||
.filter((isInputSupported ? 'textarea' : ':input') + '[placeholder]')
|
||||
.not('.placeholder')
|
||||
.bind({
|
||||
'focus.placeholder': clearPlaceholder,
|
||||
'blur.placeholder': setPlaceholder
|
||||
})
|
||||
.data('placeholder-enabled', true)
|
||||
.trigger('blur.placeholder');
|
||||
return $this;
|
||||
};
|
||||
|
||||
placeholder.input = isInputSupported;
|
||||
placeholder.textarea = isTextareaSupported;
|
||||
|
||||
hooks = {
|
||||
'get': function(element) {
|
||||
var $element = $(element);
|
||||
return $element.data('placeholder-enabled') && $element.hasClass('placeholder') ? '' : element.value;
|
||||
},
|
||||
'set': function(element, value) {
|
||||
var $element = $(element);
|
||||
if (!$element.data('placeholder-enabled')) {
|
||||
return element.value = value;
|
||||
}
|
||||
if (value == '') {
|
||||
element.value = value;
|
||||
// Issue #56: Setting the placeholder causes problems if the element continues to have focus.
|
||||
if (element != document.activeElement) {
|
||||
// We can't use `triggerHandler` here because of dummy text/password inputs :(
|
||||
setPlaceholder.call(element);
|
||||
}
|
||||
} else if ($element.hasClass('placeholder')) {
|
||||
clearPlaceholder.call(element, true, value) || (element.value = value);
|
||||
} else {
|
||||
element.value = value;
|
||||
}
|
||||
// `set` can not return `undefined`; see http://jsapi.info/jquery/1.7.1/val#L2363
|
||||
return $element;
|
||||
}
|
||||
};
|
||||
|
||||
isInputSupported || (valHooks.input = hooks);
|
||||
isTextareaSupported || (valHooks.textarea = hooks);
|
||||
|
||||
$(function() {
|
||||
// Look for forms
|
||||
$(document).delegate('form', 'submit.placeholder', function() {
|
||||
// Clear the placeholder values so they don't get submitted
|
||||
var $inputs = $('.placeholder', this).each(clearPlaceholder);
|
||||
setTimeout(function() {
|
||||
$inputs.each(setPlaceholder);
|
||||
}, 10);
|
||||
});
|
||||
});
|
||||
|
||||
// Clear placeholder values upon page reload
|
||||
$(window).bind('beforeunload.placeholder', function() {
|
||||
$('.placeholder').each(function() {
|
||||
this.value = '';
|
||||
});
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
function args(elem) {
|
||||
// Return an object of element attributes
|
||||
var newAttrs = {},
|
||||
rinlinejQuery = /^jQuery\d+$/;
|
||||
$.each(elem.attributes, function(i, attr) {
|
||||
if (attr.specified && !rinlinejQuery.test(attr.name)) {
|
||||
newAttrs[attr.name] = attr.value;
|
||||
}
|
||||
});
|
||||
return newAttrs;
|
||||
}
|
||||
|
||||
function clearPlaceholder(event, value) {
|
||||
var input = this,
|
||||
$input = $(input);
|
||||
if (input.value == $input.attr('placeholder') && $input.hasClass('placeholder')) {
|
||||
if ($input.data('placeholder-password')) {
|
||||
$input = $input.hide().next().show().attr('id', $input.removeAttr('id').data('placeholder-id'));
|
||||
// If `clearPlaceholder` was called from `$.valHooks.input.set`
|
||||
if (event === true) {
|
||||
return $input[0].value = value;
|
||||
}
|
||||
$input.focus();
|
||||
} else {
|
||||
input.value = '';
|
||||
$input.removeClass('placeholder');
|
||||
input == document.activeElement && input.select();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function setPlaceholder() {
|
||||
var $replacement,
|
||||
input = this,
|
||||
$input = $(input),
|
||||
$origInput = $input,
|
||||
id = this.id;
|
||||
if (input.value == '') {
|
||||
if (input.type == 'password') {
|
||||
if (!$input.data('placeholder-textinput')) {
|
||||
try {
|
||||
$replacement = $input.clone().attr({ 'type': 'text' });
|
||||
} catch(e) {
|
||||
$replacement = $('<input>').attr($.extend(args(this), { 'type': 'text' }));
|
||||
}
|
||||
$replacement
|
||||
.removeAttr('name')
|
||||
.data({
|
||||
'placeholder-password': true,
|
||||
'placeholder-id': id
|
||||
})
|
||||
.bind('focus.placeholder', clearPlaceholder);
|
||||
$input
|
||||
.data({
|
||||
'placeholder-textinput': $replacement,
|
||||
'placeholder-id': id
|
||||
})
|
||||
.before($replacement);
|
||||
}
|
||||
$input = $input.removeAttr('id').hide().prev().attr('id', id).show();
|
||||
// Note: `$input[0] != input` now!
|
||||
}
|
||||
$input.addClass('placeholder');
|
||||
$input[0].value = $input.attr('placeholder');
|
||||
} else {
|
||||
$input.removeClass('placeholder');
|
||||
}
|
||||
}
|
||||
|
||||
}(this, document, jQuery));
|
||||
File diff suppressed because one or more lines are too long
76
app/assets/stylesheets/_settings.css.scss
Normal file
76
app/assets/stylesheets/_settings.css.scss
Normal file
@@ -0,0 +1,76 @@
|
||||
@import "foundation/common/ratios";
|
||||
|
||||
// Settings file containing Foundation defaults
|
||||
|
||||
// Grid Settings
|
||||
|
||||
// $rowWidth: 1000px;
|
||||
// $columnGutter: 30px;
|
||||
// $totalColumns: 12;
|
||||
// $mobileTotalColumns: 4;
|
||||
|
||||
// Colors Settings
|
||||
|
||||
$mainColor: #009900;
|
||||
// $secondaryColor: #e9e9e9;
|
||||
// $alertColor: #c60f13;
|
||||
// $successColor: #5da423;
|
||||
// $txtColor: #222;
|
||||
// $highlightColor: #ffff99;
|
||||
// $black: #000;
|
||||
// $white: #fff;
|
||||
// $shinyEdge: rgba(#fff, .5);
|
||||
// $darkEdge: rgba(#000, .2);
|
||||
|
||||
// Typography Settings
|
||||
|
||||
$headerFontFamily: "Sevillana", "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
|
||||
$headerFontWeight: normal;
|
||||
// $headerFontColor: #222;
|
||||
// $bodyFontFamily: "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
|
||||
// $bodyFontWeight: normal;
|
||||
// $bodyFontColor: #222;
|
||||
|
||||
// Button Settings
|
||||
|
||||
// $buttonRadius: 3px;
|
||||
// $btnBase: 10px;
|
||||
|
||||
// $tinyBtnBase: $btnBase - 5;
|
||||
// $smallBtnBase: $btnBase - 3;
|
||||
// $largeBtnBase: $btnBase + 5;
|
||||
|
||||
// Form Settings
|
||||
|
||||
// $formSpacing: 12px;
|
||||
|
||||
// Tab Settings
|
||||
|
||||
// $tabHeight: 40px;
|
||||
|
||||
// Nav Bar Settings
|
||||
|
||||
// $navBarHeight: 40px;
|
||||
// $navFlyoutBaseWidth: 250px;
|
||||
|
||||
// Modular Scale
|
||||
// $ratio: $golden;
|
||||
// $baseFontSize: 14px;
|
||||
// $importantModNum: 44px;
|
||||
|
||||
// Tooltip Settings
|
||||
// $hasTipBorderBottom: dotted 1px #ccc;
|
||||
// $hasTipFontWeight: bold;
|
||||
// $hasTipFontColor: #333;
|
||||
// $hasTipBorderBottomHover: dotted 1px darken($mainColor, 20%);
|
||||
// $hasTipFontColorHover: $mainColor;
|
||||
// $tooltipBackgroundColor: #000;
|
||||
// $tooltipBackgroundOpacity: 0.85;
|
||||
// $tooltipFontSize: 12;
|
||||
// $tooltipFontWeight: bold;
|
||||
// $tooltipFontColor: #fff;
|
||||
// $tapToCloseFontSize: 10;
|
||||
// $tapToCloseFontWeight: normal;
|
||||
// $tapToCloseFontColor: #888;
|
||||
// $tooltipFontSizeScreenSmall: 14;
|
||||
// $tooltipBackgroundOpacityScreenSmall: 0.85;
|
||||
46
app/assets/stylesheets/app.css.scss
Normal file
46
app/assets/stylesheets/app.css.scss
Normal file
@@ -0,0 +1,46 @@
|
||||
// You custom settings file to override Foundation defaults
|
||||
@import "settings";
|
||||
|
||||
// Comment out this import if you are customizing you imports below
|
||||
@import "foundation";
|
||||
|
||||
// ----------------------------------------
|
||||
// Import specific parts of Foundation by commenting the import "foundation"
|
||||
// and uncommenting what you want below. You must uncomment the following if customizing
|
||||
|
||||
// @import "compass/css3";
|
||||
// @import "foundation/settings";
|
||||
// @import "foundation/functions/all";
|
||||
// @import "foundation/common/globals";
|
||||
// @import "foundation/mixins/clearfix";
|
||||
// @import "modular-scale";
|
||||
|
||||
// Control which mixins you have access too
|
||||
|
||||
// @import "foundation/mixins/css-triangle";
|
||||
// @import "foundation/mixins/font-size";
|
||||
|
||||
// Must include next two for semantic grid to work
|
||||
|
||||
// @import "foundation/mixins/respond-to";
|
||||
// @import "foundation/mixins/semantic-grid";
|
||||
|
||||
// Must include the grid for any responsiveness
|
||||
|
||||
// @import "foundation/components/grid";
|
||||
|
||||
// Control which common styles get compiled
|
||||
|
||||
// @import "foundation/common/typography";
|
||||
// @import "foundation/common/forms";
|
||||
|
||||
// Control which components you get if customizing
|
||||
|
||||
// @import "foundation/components/modules/buttons";
|
||||
// @import "foundation/components/modules/tabs";
|
||||
// @import "foundation/components/modules/ui";
|
||||
// @import "foundation/components/modules/navbar";
|
||||
// @import "foundation/components/modules/orbit";
|
||||
// @import "foundation/components/modules/reveal";
|
||||
// @import "foundation/components/modules/offcanvas";
|
||||
|
||||
@@ -9,5 +9,7 @@
|
||||
* compiled file, but it's generally better to create a new file per style scope.
|
||||
*
|
||||
*= require_self
|
||||
*= require foundation_and_overrides
|
||||
*= require_tree .
|
||||
*/
|
||||
|
||||
77
app/assets/stylesheets/foundation_and_overrides.scss
Normal file
77
app/assets/stylesheets/foundation_and_overrides.scss
Normal file
@@ -0,0 +1,77 @@
|
||||
@import "foundation/common/ratios";
|
||||
|
||||
// Settings file containing Foundation defaults
|
||||
|
||||
// Grid Settings
|
||||
|
||||
// $rowWidth: 1000px;
|
||||
// $columnGutter: 30px;
|
||||
// $totalColumns: 12;
|
||||
// $mobileTotalColumns: 4;
|
||||
|
||||
// Colors Settings
|
||||
|
||||
// $mainColor: #2ba6cb;
|
||||
// $secondaryColor: #e9e9e9;
|
||||
// $alertColor: #c60f13;
|
||||
// $successColor: #5da423;
|
||||
// $txtColor: #222;
|
||||
// $highlightColor: #ffff99;
|
||||
// $black: #000;
|
||||
// $white: #fff;
|
||||
// $shinyEdge: rgba(#fff, .5);
|
||||
// $darkEdge: rgba(#000, .2);
|
||||
|
||||
// Typography Settings
|
||||
|
||||
// $headerFontFamily: "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
|
||||
// $headerFontWeight: bold;
|
||||
// $headerFontColor: #222;
|
||||
// $bodyFontFamily: "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
|
||||
// $bodyFontWeight: normal;
|
||||
// $bodyFontColor: #222;
|
||||
|
||||
// Button Settings
|
||||
|
||||
// $buttonRadius: 3px;
|
||||
// $btnBase: 10px;
|
||||
|
||||
// $tinyBtnBase: $btnBase - 5;
|
||||
// $smallBtnBase: $btnBase - 3;
|
||||
// $largeBtnBase: $btnBase + 5;
|
||||
|
||||
// Form Settings
|
||||
|
||||
// $formSpacing: 12px;
|
||||
|
||||
// Tab Settings
|
||||
|
||||
// $tabHeight: 40px;
|
||||
|
||||
// Nav Bar Settings
|
||||
|
||||
// $navBarHeight: 40px;
|
||||
// $navFlyoutBaseWidth: 250px;
|
||||
|
||||
// Modular Scale
|
||||
// $ratio: $golden;
|
||||
// $baseFontSize: 14px;
|
||||
// $importantModNum: 44px;
|
||||
|
||||
// Tooltip Settings
|
||||
// $hasTipBorderBottom: dotted 1px #ccc;
|
||||
// $hasTipFontWeight: bold;
|
||||
// $hasTipFontColor: #333;
|
||||
// $hasTipBorderBottomHover: dotted 1px darken($mainColor, 20%);
|
||||
// $hasTipFontColorHover: $mainColor;
|
||||
// $tooltipBackgroundColor: #000;
|
||||
// $tooltipBackgroundOpacity: 0.85;
|
||||
// $tooltipFontSize: 12;
|
||||
// $tooltipFontWeight: bold;
|
||||
// $tooltipFontColor: #fff;
|
||||
// $tapToCloseFontSize: 10;
|
||||
// $tapToCloseFontWeight: normal;
|
||||
// $tapToCloseFontColor: #888;
|
||||
// $tooltipFontSizeScreenSmall: 14;
|
||||
// $tooltipBackgroundOpacityScreenSmall: 0.85;
|
||||
@import 'foundation';
|
||||
5
app/assets/stylesheets/ie.css.scss
Normal file
5
app/assets/stylesheets/ie.css.scss
Normal file
@@ -0,0 +1,5 @@
|
||||
/* Welcome to Compass. Use this file to write IE specific override styles.
|
||||
* Import this file using the following HTML or equivalent:
|
||||
* <!--[if IE]>
|
||||
* <link href="/stylesheets/ie.css" media="screen, projection" rel="stylesheet" type="text/css" />
|
||||
* <![endif]--> */
|
||||
3
app/assets/stylesheets/print.css.scss
Normal file
3
app/assets/stylesheets/print.css.scss
Normal file
@@ -0,0 +1,3 @@
|
||||
/* Welcome to Compass. Use this file to define print styles.
|
||||
* Import this file using the following HTML or equivalent:
|
||||
* <link href="/stylesheets/print.css" media="print" rel="stylesheet" type="text/css" /> */
|
||||
6
app/assets/stylesheets/screen.css.scss
Normal file
6
app/assets/stylesheets/screen.css.scss
Normal file
@@ -0,0 +1,6 @@
|
||||
/* Welcome to Compass.
|
||||
* In this file you should write your main styles. (or centralize your imports)
|
||||
* Import this file using the following HTML or equivalent:
|
||||
* <link href="/stylesheets/screen.css" media="screen, projection" rel="stylesheet" type="text/css" /> */
|
||||
|
||||
//@import "compass/reset";
|
||||
30
app/views/home/index.html.erb
Normal file
30
app/views/home/index.html.erb
Normal file
@@ -0,0 +1,30 @@
|
||||
<% content_for :title, "Growstuff dev site" %>
|
||||
|
||||
<div class="row">
|
||||
<div class="five columns">
|
||||
<ul class="link-list">
|
||||
<% if user_signed_in? %>
|
||||
<li>You are signed in as <%= current_user.email %>. </li>
|
||||
<li><%= link_to("Log out", destroy_user_session_path) %></li>
|
||||
<% else %>
|
||||
<li><%= link_to('Sign up', new_user_registration_path) %></li>
|
||||
<li><%= link_to('Log in', new_user_session_path) %></li>
|
||||
<% end %>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="five columns">
|
||||
<h1><a href="/">Growstuff</a> <small>dev site</small></h1>
|
||||
<p>We're a community of gardeners</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="five columns">
|
||||
<ul class="link-list">
|
||||
<li><a href="">footer link</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -1,6 +1,11 @@
|
||||
%html
|
||||
%head
|
||||
%title Growstuff
|
||||
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<link href='http://fonts.googleapis.com/css?family=Sevillana' rel='stylesheet' type='text/css'>
|
||||
|
||||
%title = content_for?(:title) ? yield(:title) : "Growstuff"
|
||||
= stylesheet_link_tag "application", :media => "all"
|
||||
= javascript_include_tag "application"
|
||||
= csrf_meta_tags
|
||||
|
||||
26
config.rb
Normal file
26
config.rb
Normal file
@@ -0,0 +1,26 @@
|
||||
require 'zurb-foundation'
|
||||
# Require any additional compass plugins here.
|
||||
|
||||
# Set this to the root of your project when deployed:
|
||||
http_path = "/"
|
||||
css_dir = "app/assets/stylesheets"
|
||||
sass_dir = "app/assets/stylesheets"
|
||||
javascripts_dir = "app/assets/javascripts"
|
||||
images_dir = "app/assets/images"
|
||||
|
||||
# You can select your preferred output style here (can be overridden via the command line):
|
||||
# output_style = :expanded or :nested or :compact or :compressed
|
||||
|
||||
# To enable relative paths to assets via compass helper functions. Uncomment:
|
||||
# relative_assets = true
|
||||
|
||||
# To disable debugging comments that display the original location of your selectors. Uncomment:
|
||||
# line_comments = false
|
||||
|
||||
|
||||
# If you prefer the indented syntax, you might want to regenerate this
|
||||
# project again passing --syntax sass, or you can uncomment this:
|
||||
# preferred_syntax = :sass
|
||||
# and then run:
|
||||
# sass-convert -R --from scss --to sass sass scss && rm -rf sass && mv scss sass
|
||||
|
||||
2
config/compass.rb
Normal file
2
config/compass.rb
Normal file
@@ -0,0 +1,2 @@
|
||||
# Require any additional compass plugins here.
|
||||
project_type = :rails
|
||||
@@ -1,2 +0,0 @@
|
||||
Use this README file to introduce your application and point to useful places in the API for learning more.
|
||||
Run "rake doc:app" to generate API documentation for your models, controllers, helpers, and libraries.
|
||||
Reference in New Issue
Block a user