groundworkcss-rails 0.2.7 → 0.2.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- data/lib/generators/groundworkcss/layout/templates/_sidebar.html.erb +5 -5
- data/lib/groundworkcss/rails/version.rb +1 -1
- data/vendor/assets/javascripts/groundworkcss/components/responsiveText.js +19 -2
- data/vendor/assets/javascripts/groundworkcss/groundwork.all.js +754 -744
- data/vendor/assets/javascripts/groundworkcss/plugins/jquery.modals.js +152 -158
- data/vendor/assets/javascripts/groundworkcss/plugins/jquery.popover.js +170 -176
- data/vendor/assets/javascripts/groundworkcss/plugins/jquery.responsiveTables.js +44 -50
- data/vendor/assets/javascripts/groundworkcss/plugins/jquery.responsiveText.js +26 -32
- data/vendor/assets/javascripts/groundworkcss/plugins/jquery.tooltip.js +111 -117
- data/vendor/assets/stylesheets/groundworkcss-scss/_buttons.scss +67 -16
- data/vendor/assets/stylesheets/groundworkcss-scss/_callouts.scss +21 -11
- data/vendor/assets/stylesheets/groundworkcss-scss/_font-awesome.scss +1 -0
- data/vendor/assets/stylesheets/groundworkcss-scss/_forms.scss +4 -4
- data/vendor/assets/stylesheets/groundworkcss-scss/_messages.scss +20 -10
- data/vendor/assets/stylesheets/groundworkcss-scss/_typography.scss +2 -0
- data/vendor/assets/stylesheets/groundworkcss-scss/_variables.scss +30 -5
- data/vendor/assets/stylesheets/groundworkcss-scss/{groundwork.css.scss → groundwork.scss} +0 -0
- metadata +15 -22
- data/vendor/assets/fonts/groundworkcss/fontawesome.otf +0 -0
- data/vendor/assets/javascripts/groundworkcss/groundwork.js +0 -264
- data/vendor/assets/javascripts/groundworkcss/libs/html5shiv.js +0 -299
- data/vendor/assets/javascripts/groundworkcss/plugins/jquery.orbit-1.4.0.js +0 -919
- data/vendor/assets/stylesheets/groundworkcss-scss/_classes.scss +0 -143
- data/vendor/assets/stylesheets/groundworkcss-scss/_layout.scss +0 -78
- data/vendor/assets/stylesheets/groundworkcss-scss/_orbit.scss +0 -239
@@ -1,299 +0,0 @@
|
|
1
|
-
/**
|
2
|
-
* @preserve HTML5 Shiv v3.6.2pre | @afarkas @jdalton @jon_neal @rem | MIT/GPL2 Licensed
|
3
|
-
*/
|
4
|
-
;(function(window, document) {
|
5
|
-
/*jshint evil:true */
|
6
|
-
/** version */
|
7
|
-
var version = '3.6.2pre';
|
8
|
-
|
9
|
-
/** Preset options */
|
10
|
-
var options = window.html5 || {};
|
11
|
-
|
12
|
-
/** Used to skip problem elements */
|
13
|
-
var reSkip = /^<|^(?:button|map|select|textarea|object|iframe|option|optgroup)$/i;
|
14
|
-
|
15
|
-
/** Not all elements can be cloned in IE **/
|
16
|
-
var saveClones = /^(?:a|b|code|div|fieldset|h1|h2|h3|h4|h5|h6|i|label|li|ol|p|q|span|strong|style|table|tbody|td|th|tr|ul)$/i;
|
17
|
-
|
18
|
-
/** Detect whether the browser supports default html5 styles */
|
19
|
-
var supportsHtml5Styles;
|
20
|
-
|
21
|
-
/** Name of the expando, to work with multiple documents or to re-shiv one document */
|
22
|
-
var expando = '_html5shiv';
|
23
|
-
|
24
|
-
/** The id for the the documents expando */
|
25
|
-
var expanID = 0;
|
26
|
-
|
27
|
-
/** Cached data for each document */
|
28
|
-
var expandoData = {};
|
29
|
-
|
30
|
-
/** Detect whether the browser supports unknown elements */
|
31
|
-
var supportsUnknownElements;
|
32
|
-
|
33
|
-
(function() {
|
34
|
-
try {
|
35
|
-
var a = document.createElement('a');
|
36
|
-
a.innerHTML = '<xyz></xyz>';
|
37
|
-
//if the hidden property is implemented we can assume, that the browser supports basic HTML5 Styles
|
38
|
-
supportsHtml5Styles = ('hidden' in a);
|
39
|
-
|
40
|
-
supportsUnknownElements = a.childNodes.length == 1 || (function() {
|
41
|
-
// assign a false positive if unable to shiv
|
42
|
-
(document.createElement)('a');
|
43
|
-
var frag = document.createDocumentFragment();
|
44
|
-
return (
|
45
|
-
typeof frag.cloneNode == 'undefined' ||
|
46
|
-
typeof frag.createDocumentFragment == 'undefined' ||
|
47
|
-
typeof frag.createElement == 'undefined'
|
48
|
-
);
|
49
|
-
}());
|
50
|
-
} catch(e) {
|
51
|
-
// assign a false positive if detection fails => unable to shiv
|
52
|
-
supportsHtml5Styles = true;
|
53
|
-
supportsUnknownElements = true;
|
54
|
-
}
|
55
|
-
|
56
|
-
}());
|
57
|
-
|
58
|
-
/*--------------------------------------------------------------------------*/
|
59
|
-
|
60
|
-
/**
|
61
|
-
* Creates a style sheet with the given CSS text and adds it to the document.
|
62
|
-
* @private
|
63
|
-
* @param {Document} ownerDocument The document.
|
64
|
-
* @param {String} cssText The CSS text.
|
65
|
-
* @returns {StyleSheet} The style element.
|
66
|
-
*/
|
67
|
-
function addStyleSheet(ownerDocument, cssText) {
|
68
|
-
var p = ownerDocument.createElement('p'),
|
69
|
-
parent = ownerDocument.getElementsByTagName('head')[0] || ownerDocument.documentElement;
|
70
|
-
|
71
|
-
p.innerHTML = 'x<style>' + cssText + '</style>';
|
72
|
-
return parent.insertBefore(p.lastChild, parent.firstChild);
|
73
|
-
}
|
74
|
-
|
75
|
-
/**
|
76
|
-
* Returns the value of `html5.elements` as an array.
|
77
|
-
* @private
|
78
|
-
* @returns {Array} An array of shived element node names.
|
79
|
-
*/
|
80
|
-
function getElements() {
|
81
|
-
var elements = html5.elements;
|
82
|
-
return typeof elements == 'string' ? elements.split(' ') : elements;
|
83
|
-
}
|
84
|
-
|
85
|
-
/**
|
86
|
-
* Returns the data associated to the given document
|
87
|
-
* @private
|
88
|
-
* @param {Document} ownerDocument The document.
|
89
|
-
* @returns {Object} An object of data.
|
90
|
-
*/
|
91
|
-
function getExpandoData(ownerDocument) {
|
92
|
-
var data = expandoData[ownerDocument[expando]];
|
93
|
-
if (!data) {
|
94
|
-
data = {};
|
95
|
-
expanID++;
|
96
|
-
ownerDocument[expando] = expanID;
|
97
|
-
expandoData[expanID] = data;
|
98
|
-
}
|
99
|
-
return data;
|
100
|
-
}
|
101
|
-
|
102
|
-
/**
|
103
|
-
* returns a shived element for the given nodeName and document
|
104
|
-
* @memberOf html5
|
105
|
-
* @param {String} nodeName name of the element
|
106
|
-
* @param {Document} ownerDocument The context document.
|
107
|
-
* @returns {Object} The shived element.
|
108
|
-
*/
|
109
|
-
function createElement(nodeName, ownerDocument, data){
|
110
|
-
if (!ownerDocument) {
|
111
|
-
ownerDocument = document;
|
112
|
-
}
|
113
|
-
if(supportsUnknownElements){
|
114
|
-
return ownerDocument.createElement(nodeName);
|
115
|
-
}
|
116
|
-
if (!data) {
|
117
|
-
data = getExpandoData(ownerDocument);
|
118
|
-
}
|
119
|
-
var node;
|
120
|
-
|
121
|
-
if (data.cache[nodeName]) {
|
122
|
-
node = data.cache[nodeName].cloneNode();
|
123
|
-
} else if (saveClones.test(nodeName)) {
|
124
|
-
node = (data.cache[nodeName] = data.createElem(nodeName)).cloneNode();
|
125
|
-
} else {
|
126
|
-
node = data.createElem(nodeName);
|
127
|
-
}
|
128
|
-
|
129
|
-
// Avoid adding some elements to fragments in IE < 9 because
|
130
|
-
// * Attributes like `name` or `type` cannot be set/changed once an element
|
131
|
-
// is inserted into a document/fragment
|
132
|
-
// * Link elements with `src` attributes that are inaccessible, as with
|
133
|
-
// a 403 response, will cause the tab/window to crash
|
134
|
-
// * Script elements appended to fragments will execute when their `src`
|
135
|
-
// or `text` property is set
|
136
|
-
return node.canHaveChildren && !reSkip.test(nodeName) ? data.frag.appendChild(node) : node;
|
137
|
-
}
|
138
|
-
|
139
|
-
/**
|
140
|
-
* returns a shived DocumentFragment for the given document
|
141
|
-
* @memberOf html5
|
142
|
-
* @param {Document} ownerDocument The context document.
|
143
|
-
* @returns {Object} The shived DocumentFragment.
|
144
|
-
*/
|
145
|
-
function createDocumentFragment(ownerDocument, data){
|
146
|
-
if (!ownerDocument) {
|
147
|
-
ownerDocument = document;
|
148
|
-
}
|
149
|
-
if(supportsUnknownElements){
|
150
|
-
return ownerDocument.createDocumentFragment();
|
151
|
-
}
|
152
|
-
data = data || getExpandoData(ownerDocument);
|
153
|
-
var clone = data.frag.cloneNode(),
|
154
|
-
i = 0,
|
155
|
-
elems = getElements(),
|
156
|
-
l = elems.length;
|
157
|
-
for(;i<l;i++){
|
158
|
-
clone.createElement(elems[i]);
|
159
|
-
}
|
160
|
-
return clone;
|
161
|
-
}
|
162
|
-
|
163
|
-
/**
|
164
|
-
* Shivs the `createElement` and `createDocumentFragment` methods of the document.
|
165
|
-
* @private
|
166
|
-
* @param {Document|DocumentFragment} ownerDocument The document.
|
167
|
-
* @param {Object} data of the document.
|
168
|
-
*/
|
169
|
-
function shivMethods(ownerDocument, data) {
|
170
|
-
if (!data.cache) {
|
171
|
-
data.cache = {};
|
172
|
-
data.createElem = ownerDocument.createElement;
|
173
|
-
data.createFrag = ownerDocument.createDocumentFragment;
|
174
|
-
data.frag = data.createFrag();
|
175
|
-
}
|
176
|
-
|
177
|
-
|
178
|
-
ownerDocument.createElement = function(nodeName) {
|
179
|
-
//abort shiv
|
180
|
-
if (!html5.shivMethods) {
|
181
|
-
return data.createElem(nodeName);
|
182
|
-
}
|
183
|
-
return createElement(nodeName, ownerDocument, data);
|
184
|
-
};
|
185
|
-
|
186
|
-
ownerDocument.createDocumentFragment = Function('h,f', 'return function(){' +
|
187
|
-
'var n=f.cloneNode(),c=n.createElement;' +
|
188
|
-
'h.shivMethods&&(' +
|
189
|
-
// unroll the `createElement` calls
|
190
|
-
getElements().join().replace(/\w+/g, function(nodeName) {
|
191
|
-
data.createElem(nodeName);
|
192
|
-
data.frag.createElement(nodeName);
|
193
|
-
return 'c("' + nodeName + '")';
|
194
|
-
}) +
|
195
|
-
');return n}'
|
196
|
-
)(html5, data.frag);
|
197
|
-
}
|
198
|
-
|
199
|
-
/*--------------------------------------------------------------------------*/
|
200
|
-
|
201
|
-
/**
|
202
|
-
* Shivs the given document.
|
203
|
-
* @memberOf html5
|
204
|
-
* @param {Document} ownerDocument The document to shiv.
|
205
|
-
* @returns {Document} The shived document.
|
206
|
-
*/
|
207
|
-
function shivDocument(ownerDocument) {
|
208
|
-
if (!ownerDocument) {
|
209
|
-
ownerDocument = document;
|
210
|
-
}
|
211
|
-
var data = getExpandoData(ownerDocument);
|
212
|
-
|
213
|
-
if (html5.shivCSS && !supportsHtml5Styles && !data.hasCSS) {
|
214
|
-
data.hasCSS = !!addStyleSheet(ownerDocument,
|
215
|
-
// corrects block display not defined in IE6/7/8/9
|
216
|
-
'article,aside,figcaption,figure,footer,header,hgroup,nav,section{display:block}' +
|
217
|
-
// adds styling not present in IE6/7/8/9
|
218
|
-
'mark{background:#FF0;color:#000}'
|
219
|
-
);
|
220
|
-
}
|
221
|
-
if (!supportsUnknownElements) {
|
222
|
-
shivMethods(ownerDocument, data);
|
223
|
-
}
|
224
|
-
return ownerDocument;
|
225
|
-
}
|
226
|
-
|
227
|
-
/*--------------------------------------------------------------------------*/
|
228
|
-
|
229
|
-
/**
|
230
|
-
* The `html5` object is exposed so that more elements can be shived and
|
231
|
-
* existing shiving can be detected on iframes.
|
232
|
-
* @type Object
|
233
|
-
* @example
|
234
|
-
*
|
235
|
-
* // options can be changed before the script is included
|
236
|
-
* html5 = { 'elements': 'mark section', 'shivCSS': false, 'shivMethods': false };
|
237
|
-
*/
|
238
|
-
var html5 = {
|
239
|
-
|
240
|
-
/**
|
241
|
-
* An array or space separated string of node names of the elements to shiv.
|
242
|
-
* @memberOf html5
|
243
|
-
* @type Array|String
|
244
|
-
*/
|
245
|
-
'elements': options.elements || 'abbr article aside audio bdi canvas data datalist details figcaption figure footer header hgroup main mark meter nav output progress section summary time video',
|
246
|
-
|
247
|
-
/**
|
248
|
-
* current version of html5shiv
|
249
|
-
*/
|
250
|
-
'version': version,
|
251
|
-
|
252
|
-
/**
|
253
|
-
* A flag to indicate that the HTML5 style sheet should be inserted.
|
254
|
-
* @memberOf html5
|
255
|
-
* @type Boolean
|
256
|
-
*/
|
257
|
-
'shivCSS': (options.shivCSS !== false),
|
258
|
-
|
259
|
-
/**
|
260
|
-
* Is equal to true if a browser supports creating unknown/HTML5 elements
|
261
|
-
* @memberOf html5
|
262
|
-
* @type boolean
|
263
|
-
*/
|
264
|
-
'supportsUnknownElements': supportsUnknownElements,
|
265
|
-
|
266
|
-
/**
|
267
|
-
* A flag to indicate that the document's `createElement` and `createDocumentFragment`
|
268
|
-
* methods should be overwritten.
|
269
|
-
* @memberOf html5
|
270
|
-
* @type Boolean
|
271
|
-
*/
|
272
|
-
'shivMethods': (options.shivMethods !== false),
|
273
|
-
|
274
|
-
/**
|
275
|
-
* A string to describe the type of `html5` object ("default" or "default print").
|
276
|
-
* @memberOf html5
|
277
|
-
* @type String
|
278
|
-
*/
|
279
|
-
'type': 'default',
|
280
|
-
|
281
|
-
// shivs the document according to the specified `html5` object options
|
282
|
-
'shivDocument': shivDocument,
|
283
|
-
|
284
|
-
//creates a shived element
|
285
|
-
createElement: createElement,
|
286
|
-
|
287
|
-
//creates a shived documentFragment
|
288
|
-
createDocumentFragment: createDocumentFragment
|
289
|
-
};
|
290
|
-
|
291
|
-
/*--------------------------------------------------------------------------*/
|
292
|
-
|
293
|
-
// expose html5
|
294
|
-
window.html5 = html5;
|
295
|
-
|
296
|
-
// shiv the document
|
297
|
-
shivDocument(document);
|
298
|
-
|
299
|
-
}(this, document));
|
@@ -1,919 +0,0 @@
|
|
1
|
-
/*
|
2
|
-
* jQuery Orbit Plugin 1.4.0
|
3
|
-
* www.ZURB.com/playground
|
4
|
-
* Copyright 2010, ZURB
|
5
|
-
* Free to use under the MIT license.
|
6
|
-
* http://www.opensource.org/licenses/mit-license.php
|
7
|
-
*/
|
8
|
-
|
9
|
-
|
10
|
-
(function ($) {
|
11
|
-
'use strict';
|
12
|
-
|
13
|
-
$.fn.findFirstImage = function () {
|
14
|
-
return this.first()
|
15
|
-
.find('img')
|
16
|
-
.andSelf().filter('img')
|
17
|
-
.first();
|
18
|
-
};
|
19
|
-
|
20
|
-
var ORBIT = {
|
21
|
-
|
22
|
-
defaults: {
|
23
|
-
animation: 'horizontal-push', // fade, horizontal-slide, vertical-slide, horizontal-push, vertical-push
|
24
|
-
animationSpeed: 600, // how fast animations are
|
25
|
-
timer: true, // display timer?
|
26
|
-
advanceSpeed: 4000, // if timer is enabled, time between transitions
|
27
|
-
pauseOnHover: false, // if you hover pauses the slider
|
28
|
-
startClockOnMouseOut: false, // if clock should start on MouseOut
|
29
|
-
startClockOnMouseOutAfter: 1000, // how long after MouseOut should the timer start again
|
30
|
-
directionalNav: true, // manual advancing directional navs
|
31
|
-
directionalNavRightText: 'Right', // text of right directional element for accessibility
|
32
|
-
directionalNavLeftText: 'Left', // text of left directional element for accessibility
|
33
|
-
captions: true, // do you want captions?
|
34
|
-
captionAnimation: 'fade', // fade, slideOpen, none
|
35
|
-
captionAnimationSpeed: 600, // if so how quickly should they animate in
|
36
|
-
resetTimerOnClick: false, // true resets the timer instead of pausing slideshow progress on manual navigation
|
37
|
-
bullets: false, // true or false to activate the bullet navigation
|
38
|
-
bulletThumbs: false, // thumbnails for the bullets
|
39
|
-
bulletThumbLocation: '', // relative path to thumbnails from this file
|
40
|
-
bulletThumbsHideOnSmall: true, // hide thumbs on small devices
|
41
|
-
afterSlideChange: $.noop, // callback to execute after slide changes
|
42
|
-
afterLoadComplete: $.noop, // callback to execute after everything has been loaded
|
43
|
-
fluid: true,
|
44
|
-
centerBullets: true, // center bullet nav with js, turn this off if you want to position the bullet nav manually
|
45
|
-
singleCycle: false, // cycles through orbit slides only once
|
46
|
-
slideNumber: false, // display slide numbers?
|
47
|
-
stackOnSmall: false // stack slides on small devices (i.e. phones)
|
48
|
-
},
|
49
|
-
|
50
|
-
activeSlide: 0,
|
51
|
-
numberSlides: 0,
|
52
|
-
orbitWidth: null,
|
53
|
-
orbitHeight: null,
|
54
|
-
locked: null,
|
55
|
-
timerRunning: null,
|
56
|
-
degrees: 0,
|
57
|
-
wrapperHTML: '<div class="orbit-wrapper" />',
|
58
|
-
timerHTML: '<div class="timer"><span class="mask"><span class="rotator"></span></span><span class="pause"></span></div>',
|
59
|
-
captionHTML: '<div class="orbit-caption"></div>',
|
60
|
-
directionalNavHTML: '<div class="slider-nav hide-for-small"><span class="right"></span><span class="left"></span></div>',
|
61
|
-
bulletHTML: '<ul class="orbit-bullets"></ul>',
|
62
|
-
slideNumberHTML: '<span class="orbit-slide-counter"></span>',
|
63
|
-
|
64
|
-
init: function (element, options) {
|
65
|
-
var $imageSlides,
|
66
|
-
imagesLoadedCount = 0,
|
67
|
-
self = this;
|
68
|
-
|
69
|
-
// Bind functions to correct context
|
70
|
-
this.clickTimer = $.proxy(this.clickTimer, this);
|
71
|
-
this.addBullet = $.proxy(this.addBullet, this);
|
72
|
-
this.resetAndUnlock = $.proxy(this.resetAndUnlock, this);
|
73
|
-
this.stopClock = $.proxy(this.stopClock, this);
|
74
|
-
this.startTimerAfterMouseLeave = $.proxy(this.startTimerAfterMouseLeave, this);
|
75
|
-
this.clearClockMouseLeaveTimer = $.proxy(this.clearClockMouseLeaveTimer, this);
|
76
|
-
this.rotateTimer = $.proxy(this.rotateTimer, this);
|
77
|
-
|
78
|
-
this.options = $.extend({}, this.defaults, options);
|
79
|
-
if (this.options.timer === 'false') this.options.timer = false;
|
80
|
-
if (this.options.captions === 'false') this.options.captions = false;
|
81
|
-
if (this.options.directionalNav === 'false') this.options.directionalNav = false;
|
82
|
-
|
83
|
-
this.$element = $(element);
|
84
|
-
this.$wrapper = this.$element.wrap(this.wrapperHTML).parent();
|
85
|
-
this.$slides = this.$element.children('img, a, div, figure, li');
|
86
|
-
|
87
|
-
this.$element.on('movestart', function(e) {
|
88
|
-
// If the movestart is heading off in an upwards or downwards
|
89
|
-
// direction, prevent it so that the browser scrolls normally.
|
90
|
-
if ((e.distX > e.distY && e.distX < -e.distY) ||
|
91
|
-
(e.distX < e.distY && e.distX > -e.distY)) {
|
92
|
-
e.preventDefault();
|
93
|
-
}
|
94
|
-
});
|
95
|
-
|
96
|
-
this.$element.bind('orbit.next', function () {
|
97
|
-
self.shift('next');
|
98
|
-
});
|
99
|
-
|
100
|
-
this.$element.bind('orbit.prev', function () {
|
101
|
-
self.shift('prev');
|
102
|
-
});
|
103
|
-
|
104
|
-
this.$element.bind('swipeleft', function () {
|
105
|
-
$(this).trigger('orbit.next');
|
106
|
-
});
|
107
|
-
|
108
|
-
this.$element.bind('swiperight', function () {
|
109
|
-
$(this).trigger('orbit.prev');
|
110
|
-
});
|
111
|
-
|
112
|
-
this.$element.bind('orbit.goto', function (event, index) {
|
113
|
-
self.shift(index);
|
114
|
-
});
|
115
|
-
|
116
|
-
this.$element.bind('orbit.start', function (event, index) {
|
117
|
-
self.startClock();
|
118
|
-
});
|
119
|
-
|
120
|
-
this.$element.bind('orbit.stop', function (event, index) {
|
121
|
-
self.stopClock();
|
122
|
-
});
|
123
|
-
|
124
|
-
$imageSlides = this.$slides.filter('img');
|
125
|
-
|
126
|
-
if ($imageSlides.length === 0) {
|
127
|
-
this.loaded();
|
128
|
-
} else {
|
129
|
-
$imageSlides.bind('imageready', function () {
|
130
|
-
imagesLoadedCount += 1;
|
131
|
-
if (imagesLoadedCount === $imageSlides.length) {
|
132
|
-
self.loaded();
|
133
|
-
}
|
134
|
-
});
|
135
|
-
}
|
136
|
-
},
|
137
|
-
|
138
|
-
loaded: function () {
|
139
|
-
this.$element
|
140
|
-
.addClass('orbit')
|
141
|
-
.css({width: '1px', height: '1px'});
|
142
|
-
|
143
|
-
if (this.options.stackOnSmall) {
|
144
|
-
this.$element.addClass('orbit-stack-on-small');
|
145
|
-
}
|
146
|
-
|
147
|
-
this.$slides.addClass('orbit-slide').css({"opacity" : 0});
|
148
|
-
|
149
|
-
this.setDimentionsFromLargestSlide();
|
150
|
-
this.updateOptionsIfOnlyOneSlide();
|
151
|
-
this.setupFirstSlide();
|
152
|
-
this.notifySlideChange();
|
153
|
-
|
154
|
-
if (this.options.timer) {
|
155
|
-
this.setupTimer();
|
156
|
-
this.startClock();
|
157
|
-
}
|
158
|
-
|
159
|
-
if (this.options.captions) {
|
160
|
-
this.setupCaptions();
|
161
|
-
}
|
162
|
-
|
163
|
-
if (this.options.directionalNav) {
|
164
|
-
this.setupDirectionalNav();
|
165
|
-
}
|
166
|
-
|
167
|
-
if (this.options.bullets) {
|
168
|
-
this.setupBulletNav();
|
169
|
-
this.setActiveBullet();
|
170
|
-
}
|
171
|
-
|
172
|
-
this.options.afterLoadComplete.call(this);
|
173
|
-
Holder.run();
|
174
|
-
},
|
175
|
-
|
176
|
-
currentSlide: function () {
|
177
|
-
return this.$slides.eq(this.activeSlide);
|
178
|
-
},
|
179
|
-
|
180
|
-
notifySlideChange: function() {
|
181
|
-
if (this.options.slideNumber) {
|
182
|
-
var txt = (this.activeSlide+1) + ' of ' + this.$slides.length;
|
183
|
-
this.$element.trigger("orbit.change", {slideIndex: this.activeSlide, slideCount: this.$slides.length});
|
184
|
-
if (this.$counter === undefined) {
|
185
|
-
var $counter = $(this.slideNumberHTML).html(txt);
|
186
|
-
this.$counter = $counter;
|
187
|
-
this.$wrapper.append(this.$counter);
|
188
|
-
} else {
|
189
|
-
this.$counter.html(txt);
|
190
|
-
}
|
191
|
-
}
|
192
|
-
},
|
193
|
-
|
194
|
-
setDimentionsFromLargestSlide: function () {
|
195
|
-
//Collect all slides and set slider size of largest image
|
196
|
-
var self = this,
|
197
|
-
$fluidPlaceholder;
|
198
|
-
|
199
|
-
self.$element.add(self.$wrapper).width(this.$slides.first().outerWidth());
|
200
|
-
self.$element.add(self.$wrapper).height(this.$slides.first().height());
|
201
|
-
self.orbitWidth = this.$slides.first().outerWidth();
|
202
|
-
self.orbitHeight = this.$slides.first().height();
|
203
|
-
$fluidPlaceholder = this.$slides.first().findFirstImage().clone();
|
204
|
-
|
205
|
-
|
206
|
-
this.$slides.each(function () {
|
207
|
-
var slide = $(this),
|
208
|
-
slideWidth = slide.outerWidth(),
|
209
|
-
slideHeight = slide.height();
|
210
|
-
|
211
|
-
if (slideWidth > self.$element.outerWidth()) {
|
212
|
-
self.$element.add(self.$wrapper).width(slideWidth);
|
213
|
-
self.orbitWidth = self.$element.outerWidth();
|
214
|
-
}
|
215
|
-
if (slideHeight > self.$element.height()) {
|
216
|
-
self.$element.add(self.$wrapper).height(slideHeight);
|
217
|
-
self.orbitHeight = self.$element.height();
|
218
|
-
$fluidPlaceholder = $(this).findFirstImage().clone();
|
219
|
-
}
|
220
|
-
self.numberSlides += 1;
|
221
|
-
});
|
222
|
-
|
223
|
-
if (this.options.fluid) {
|
224
|
-
if (typeof this.options.fluid === "string") {
|
225
|
-
// $fluidPlaceholder = $("<img>").attr("src", "http://placehold.it/" + this.options.fluid);
|
226
|
-
$fluidPlaceholder = $("<img>").attr("data-src", "holder.js/" + this.options.fluid);
|
227
|
-
//var inner = $("<div/>").css({"display":"inline-block", "width":"2px", "height":"2px"});
|
228
|
-
//$fluidPlaceholder = $("<div/>").css({"float":"left"});
|
229
|
-
//$fluidPlaceholder.wrapInner(inner);
|
230
|
-
|
231
|
-
//$fluidPlaceholder = $("<div/>").css({"height":"1px", "width":"2px"});
|
232
|
-
//$fluidPlaceholder = $("<div style='display:inline-block;width:2px;height:1px;'></div>");
|
233
|
-
}
|
234
|
-
|
235
|
-
self.$element.prepend($fluidPlaceholder);
|
236
|
-
$fluidPlaceholder.addClass('fluid-placeholder');
|
237
|
-
self.$element.add(self.$wrapper).css({width: 'inherit'});
|
238
|
-
self.$element.add(self.$wrapper).css({height: 'inherit'});
|
239
|
-
|
240
|
-
$(window).bind('resize', function () {
|
241
|
-
self.orbitWidth = self.$element.outerWidth();
|
242
|
-
self.orbitHeight = self.$element.height();
|
243
|
-
});
|
244
|
-
}
|
245
|
-
},
|
246
|
-
|
247
|
-
//Animation locking functions
|
248
|
-
lock: function () {
|
249
|
-
this.locked = true;
|
250
|
-
},
|
251
|
-
|
252
|
-
unlock: function () {
|
253
|
-
this.locked = false;
|
254
|
-
},
|
255
|
-
|
256
|
-
updateOptionsIfOnlyOneSlide: function () {
|
257
|
-
if(this.$slides.length === 1) {
|
258
|
-
this.options.directionalNav = false;
|
259
|
-
this.options.timer = false;
|
260
|
-
this.options.bullets = false;
|
261
|
-
}
|
262
|
-
},
|
263
|
-
|
264
|
-
setupFirstSlide: function () {
|
265
|
-
//Set initial front photo z-index and fades it in
|
266
|
-
var self = this;
|
267
|
-
this.$slides.first()
|
268
|
-
.css({"z-index" : 3, "opacity" : 1})
|
269
|
-
.fadeIn(function() {
|
270
|
-
//brings in all other slides IF css declares a display: none
|
271
|
-
self.$slides.css({"display":"block"})
|
272
|
-
});
|
273
|
-
},
|
274
|
-
|
275
|
-
startClock: function () {
|
276
|
-
var self = this;
|
277
|
-
|
278
|
-
if(!this.options.timer) {
|
279
|
-
return false;
|
280
|
-
}
|
281
|
-
|
282
|
-
if (this.$timer.is(':hidden')) {
|
283
|
-
this.clock = setInterval(function () {
|
284
|
-
self.$element.trigger('orbit.next');
|
285
|
-
}, this.options.advanceSpeed);
|
286
|
-
} else {
|
287
|
-
this.timerRunning = true;
|
288
|
-
this.$pause.removeClass('active');
|
289
|
-
this.clock = setInterval(this.rotateTimer, this.options.advanceSpeed / 180, false);
|
290
|
-
}
|
291
|
-
},
|
292
|
-
|
293
|
-
rotateTimer: function (reset) {
|
294
|
-
var degreeCSS = "rotate(" + this.degrees + "deg)";
|
295
|
-
this.degrees += 2;
|
296
|
-
this.$rotator.css({
|
297
|
-
"-webkit-transform": degreeCSS,
|
298
|
-
"-moz-transform": degreeCSS,
|
299
|
-
"-o-transform": degreeCSS,
|
300
|
-
"-ms-transform": degreeCSS
|
301
|
-
});
|
302
|
-
if (reset) {
|
303
|
-
this.degrees = 0;
|
304
|
-
this.$rotator.removeClass('move');
|
305
|
-
this.$mask.removeClass('move');
|
306
|
-
}
|
307
|
-
if(this.degrees > 180) {
|
308
|
-
this.$rotator.addClass('move');
|
309
|
-
this.$mask.addClass('move');
|
310
|
-
}
|
311
|
-
if(this.degrees > 360) {
|
312
|
-
this.$rotator.removeClass('move');
|
313
|
-
this.$mask.removeClass('move');
|
314
|
-
this.degrees = 0;
|
315
|
-
this.$element.trigger('orbit.next');
|
316
|
-
}
|
317
|
-
},
|
318
|
-
|
319
|
-
stopClock: function () {
|
320
|
-
if (!this.options.timer) {
|
321
|
-
return false;
|
322
|
-
} else {
|
323
|
-
this.timerRunning = false;
|
324
|
-
clearInterval(this.clock);
|
325
|
-
this.$pause.addClass('active');
|
326
|
-
}
|
327
|
-
},
|
328
|
-
|
329
|
-
setupTimer: function () {
|
330
|
-
this.$timer = $(this.timerHTML);
|
331
|
-
this.$wrapper.append(this.$timer);
|
332
|
-
|
333
|
-
this.$rotator = this.$timer.find('.rotator');
|
334
|
-
this.$mask = this.$timer.find('.mask');
|
335
|
-
this.$pause = this.$timer.find('.pause');
|
336
|
-
|
337
|
-
this.$timer.click(this.clickTimer);
|
338
|
-
|
339
|
-
if (this.options.startClockOnMouseOut) {
|
340
|
-
this.$wrapper.mouseleave(this.startTimerAfterMouseLeave);
|
341
|
-
this.$wrapper.mouseenter(this.clearClockMouseLeaveTimer);
|
342
|
-
}
|
343
|
-
|
344
|
-
if (this.options.pauseOnHover) {
|
345
|
-
this.$wrapper.mouseenter(this.stopClock);
|
346
|
-
}
|
347
|
-
},
|
348
|
-
|
349
|
-
startTimerAfterMouseLeave: function () {
|
350
|
-
var self = this;
|
351
|
-
|
352
|
-
this.outTimer = setTimeout(function() {
|
353
|
-
if(!self.timerRunning){
|
354
|
-
self.startClock();
|
355
|
-
}
|
356
|
-
}, this.options.startClockOnMouseOutAfter)
|
357
|
-
},
|
358
|
-
|
359
|
-
clearClockMouseLeaveTimer: function () {
|
360
|
-
clearTimeout(this.outTimer);
|
361
|
-
},
|
362
|
-
|
363
|
-
clickTimer: function () {
|
364
|
-
if(!this.timerRunning) {
|
365
|
-
this.startClock();
|
366
|
-
} else {
|
367
|
-
this.stopClock();
|
368
|
-
}
|
369
|
-
},
|
370
|
-
|
371
|
-
setupCaptions: function () {
|
372
|
-
this.$caption = $(this.captionHTML);
|
373
|
-
this.$wrapper.append(this.$caption);
|
374
|
-
this.setCaption();
|
375
|
-
},
|
376
|
-
|
377
|
-
setCaption: function () {
|
378
|
-
var captionLocation = this.currentSlide().attr('data-caption'),
|
379
|
-
captionHTML;
|
380
|
-
|
381
|
-
if (!this.options.captions) {
|
382
|
-
return false;
|
383
|
-
}
|
384
|
-
|
385
|
-
//Set HTML for the caption if it exists
|
386
|
-
if (captionLocation) {
|
387
|
-
//if caption text is blank, don't show captions
|
388
|
-
if ($.trim($(captionLocation).text()).length < 1){
|
389
|
-
return false;
|
390
|
-
}
|
391
|
-
|
392
|
-
// if location selector starts with '#', remove it so we don't see id="#selector"
|
393
|
-
if (captionLocation.charAt(0) == '#') {
|
394
|
-
captionLocation = captionLocation.substring(1, captionLocation.length);
|
395
|
-
}
|
396
|
-
captionHTML = $('#' + captionLocation).html(); //get HTML from the matching HTML entity
|
397
|
-
this.$caption
|
398
|
-
.attr('id', captionLocation) // Add ID caption TODO why is the id being set?
|
399
|
-
.html(captionHTML); // Change HTML in Caption
|
400
|
-
//Animations for Caption entrances
|
401
|
-
switch (this.options.captionAnimation) {
|
402
|
-
case 'none':
|
403
|
-
this.$caption.show();
|
404
|
-
break;
|
405
|
-
case 'fade':
|
406
|
-
this.$caption.fadeIn(this.options.captionAnimationSpeed);
|
407
|
-
break;
|
408
|
-
case 'slideOpen':
|
409
|
-
this.$caption.slideDown(this.options.captionAnimationSpeed);
|
410
|
-
break;
|
411
|
-
}
|
412
|
-
} else {
|
413
|
-
//Animations for Caption exits
|
414
|
-
switch (this.options.captionAnimation) {
|
415
|
-
case 'none':
|
416
|
-
this.$caption.hide();
|
417
|
-
break;
|
418
|
-
case 'fade':
|
419
|
-
this.$caption.fadeOut(this.options.captionAnimationSpeed);
|
420
|
-
break;
|
421
|
-
case 'slideOpen':
|
422
|
-
this.$caption.slideUp(this.options.captionAnimationSpeed);
|
423
|
-
break;
|
424
|
-
}
|
425
|
-
}
|
426
|
-
},
|
427
|
-
|
428
|
-
setupDirectionalNav: function () {
|
429
|
-
var self = this,
|
430
|
-
$directionalNav = $(this.directionalNavHTML);
|
431
|
-
|
432
|
-
$directionalNav.find('.right').html(this.options.directionalNavRightText);
|
433
|
-
$directionalNav.find('.left').html(this.options.directionalNavLeftText);
|
434
|
-
|
435
|
-
this.$wrapper.append($directionalNav);
|
436
|
-
|
437
|
-
this.$wrapper.find('.left').click(function () {
|
438
|
-
self.stopClock();
|
439
|
-
if (self.options.resetTimerOnClick) {
|
440
|
-
self.rotateTimer(true);
|
441
|
-
self.startClock();
|
442
|
-
}
|
443
|
-
self.$element.trigger('orbit.prev');
|
444
|
-
});
|
445
|
-
|
446
|
-
this.$wrapper.find('.right').click(function () {
|
447
|
-
self.stopClock();
|
448
|
-
if (self.options.resetTimerOnClick) {
|
449
|
-
self.rotateTimer(true);
|
450
|
-
self.startClock();
|
451
|
-
}
|
452
|
-
self.$element.trigger('orbit.next');
|
453
|
-
});
|
454
|
-
},
|
455
|
-
|
456
|
-
setupBulletNav: function () {
|
457
|
-
this.$bullets = $(this.bulletHTML);
|
458
|
-
this.$wrapper.append(this.$bullets);
|
459
|
-
this.$slides.each(this.addBullet);
|
460
|
-
this.$element.addClass('with-bullets');
|
461
|
-
if (this.options.centerBullets) this.$bullets.css('margin-left', -this.$bullets.outerWidth() / 2);
|
462
|
-
if (this.options.bulletThumbsHideOnSmall) this.$bullets.addClass('hide-for-small');
|
463
|
-
},
|
464
|
-
|
465
|
-
addBullet: function (index, slide) {
|
466
|
-
var position = index + 1,
|
467
|
-
$li = $('<li>' + (position) + '</li>'),
|
468
|
-
thumbName,
|
469
|
-
self = this;
|
470
|
-
|
471
|
-
if (this.options.bulletThumbs) {
|
472
|
-
thumbName = $(slide).attr('data-thumb');
|
473
|
-
if (thumbName) {
|
474
|
-
$li
|
475
|
-
.addClass('has-thumb')
|
476
|
-
.css({background: "url(" + this.options.bulletThumbLocation + thumbName + ") no-repeat"});;
|
477
|
-
}
|
478
|
-
}
|
479
|
-
this.$bullets.append($li);
|
480
|
-
$li.data('index', index);
|
481
|
-
$li.click(function () {
|
482
|
-
self.stopClock();
|
483
|
-
if (self.options.resetTimerOnClick) {
|
484
|
-
self.rotateTimer(true);
|
485
|
-
self.startClock();
|
486
|
-
}
|
487
|
-
self.$element.trigger('orbit.goto', [$li.data('index')])
|
488
|
-
});
|
489
|
-
},
|
490
|
-
|
491
|
-
setActiveBullet: function () {
|
492
|
-
if(!this.options.bullets) { return false; } else {
|
493
|
-
this.$bullets.find('li')
|
494
|
-
.removeClass('active')
|
495
|
-
.eq(this.activeSlide)
|
496
|
-
.addClass('active');
|
497
|
-
}
|
498
|
-
},
|
499
|
-
|
500
|
-
resetAndUnlock: function () {
|
501
|
-
this.$slides
|
502
|
-
.eq(this.prevActiveSlide)
|
503
|
-
.css({"z-index" : 1});
|
504
|
-
this.unlock();
|
505
|
-
this.options.afterSlideChange.call(this, this.$slides.eq(this.prevActiveSlide), this.$slides.eq(this.activeSlide));
|
506
|
-
},
|
507
|
-
|
508
|
-
shift: function (direction) {
|
509
|
-
var slideDirection = direction;
|
510
|
-
|
511
|
-
//remember previous activeSlide
|
512
|
-
this.prevActiveSlide = this.activeSlide;
|
513
|
-
|
514
|
-
//exit function if bullet clicked is same as the current image
|
515
|
-
if (this.prevActiveSlide == slideDirection) { return false; }
|
516
|
-
|
517
|
-
if (this.$slides.length == "1") { return false; }
|
518
|
-
if (!this.locked) {
|
519
|
-
this.lock();
|
520
|
-
//deduce the proper activeImage
|
521
|
-
if (direction == "next") {
|
522
|
-
this.activeSlide++;
|
523
|
-
if (this.activeSlide == this.numberSlides) {
|
524
|
-
this.activeSlide = 0;
|
525
|
-
}
|
526
|
-
} else if (direction == "prev") {
|
527
|
-
this.activeSlide--
|
528
|
-
if (this.activeSlide < 0) {
|
529
|
-
this.activeSlide = this.numberSlides - 1;
|
530
|
-
}
|
531
|
-
} else {
|
532
|
-
this.activeSlide = direction;
|
533
|
-
if (this.prevActiveSlide < this.activeSlide) {
|
534
|
-
slideDirection = "next";
|
535
|
-
} else if (this.prevActiveSlide > this.activeSlide) {
|
536
|
-
slideDirection = "prev"
|
537
|
-
}
|
538
|
-
}
|
539
|
-
|
540
|
-
//set to correct bullet
|
541
|
-
this.setActiveBullet();
|
542
|
-
this.notifySlideChange();
|
543
|
-
|
544
|
-
//set previous slide z-index to one below what new activeSlide will be
|
545
|
-
this.$slides
|
546
|
-
.eq(this.prevActiveSlide)
|
547
|
-
.css({"z-index" : 2});
|
548
|
-
|
549
|
-
//fade
|
550
|
-
if (this.options.animation == "fade") {
|
551
|
-
this.$slides
|
552
|
-
.eq(this.activeSlide)
|
553
|
-
.css({"opacity" : 0, "z-index" : 3})
|
554
|
-
.animate({"opacity" : 1}, this.options.animationSpeed, this.resetAndUnlock);
|
555
|
-
this.$slides
|
556
|
-
.eq(this.prevActiveSlide)
|
557
|
-
.animate({"opacity":0}, this.options.animationSpeed);
|
558
|
-
}
|
559
|
-
|
560
|
-
//horizontal-slide
|
561
|
-
if (this.options.animation == "horizontal-slide") {
|
562
|
-
if (slideDirection == "next") {
|
563
|
-
this.$slides
|
564
|
-
.eq(this.activeSlide)
|
565
|
-
.css({"left": this.orbitWidth, "z-index" : 3})
|
566
|
-
.css("opacity", 1)
|
567
|
-
.animate({"left" : 0}, this.options.animationSpeed, this.resetAndUnlock);
|
568
|
-
}
|
569
|
-
if (slideDirection == "prev") {
|
570
|
-
this.$slides
|
571
|
-
.eq(this.activeSlide)
|
572
|
-
.css({"left": -this.orbitWidth, "z-index" : 3})
|
573
|
-
.css("opacity", 1)
|
574
|
-
.animate({"left" : 0}, this.options.animationSpeed, this.resetAndUnlock);
|
575
|
-
}
|
576
|
-
this.$slides
|
577
|
-
.eq(this.prevActiveSlide)
|
578
|
-
.css("opacity", 0);
|
579
|
-
}
|
580
|
-
|
581
|
-
//vertical-slide
|
582
|
-
if (this.options.animation == "vertical-slide") {
|
583
|
-
if (slideDirection == "prev") {
|
584
|
-
this.$slides
|
585
|
-
.eq(this.activeSlide)
|
586
|
-
.css({"top": this.orbitHeight, "z-index" : 3})
|
587
|
-
.css("opacity", 1)
|
588
|
-
.animate({"top" : 0}, this.options.animationSpeed, this.resetAndUnlock);
|
589
|
-
this.$slides
|
590
|
-
.eq(this.prevActiveSlide)
|
591
|
-
.css("opacity", 0);
|
592
|
-
}
|
593
|
-
if (slideDirection == "next") {
|
594
|
-
this.$slides
|
595
|
-
.eq(this.activeSlide)
|
596
|
-
.css({"top": -this.orbitHeight, "z-index" : 3})
|
597
|
-
.css("opacity", 1)
|
598
|
-
.animate({"top" : 0}, this.options.animationSpeed, this.resetAndUnlock);
|
599
|
-
}
|
600
|
-
this.$slides
|
601
|
-
.eq(this.prevActiveSlide)
|
602
|
-
.css("opacity", 0);
|
603
|
-
}
|
604
|
-
|
605
|
-
//horizontal-push
|
606
|
-
if (this.options.animation == "horizontal-push") {
|
607
|
-
if (slideDirection == "next") {
|
608
|
-
this.$slides
|
609
|
-
.eq(this.activeSlide)
|
610
|
-
.css({"left": this.orbitWidth, "z-index" : 3})
|
611
|
-
.animate({"left" : 0, "opacity" : 1}, this.options.animationSpeed, this.resetAndUnlock);
|
612
|
-
this.$slides
|
613
|
-
.eq(this.prevActiveSlide)
|
614
|
-
.animate({"left" : -this.orbitWidth}, this.options.animationSpeed, "", function(){
|
615
|
-
$(this).css({"opacity" : 0});
|
616
|
-
});
|
617
|
-
}
|
618
|
-
if (slideDirection == "prev") {
|
619
|
-
this.$slides
|
620
|
-
.eq(this.activeSlide)
|
621
|
-
.css({"left": -this.orbitWidth, "z-index" : 3})
|
622
|
-
.animate({"left" : 0, "opacity" : 1}, this.options.animationSpeed, this.resetAndUnlock);
|
623
|
-
this.$slides
|
624
|
-
.eq(this.prevActiveSlide)
|
625
|
-
.animate({"left" : this.orbitWidth}, this.options.animationSpeed, "", function(){
|
626
|
-
$(this).css({"opacity" : 0});
|
627
|
-
});
|
628
|
-
}
|
629
|
-
}
|
630
|
-
|
631
|
-
//vertical-push
|
632
|
-
if (this.options.animation == "vertical-push") {
|
633
|
-
if (slideDirection == "next") {
|
634
|
-
this.$slides
|
635
|
-
.eq(this.activeSlide)
|
636
|
-
.css({top: -this.orbitHeight, "z-index" : 3})
|
637
|
-
.css("opacity", 1)
|
638
|
-
.animate({top : 0, "opacity":1}, this.options.animationSpeed, this.resetAndUnlock);
|
639
|
-
this.$slides
|
640
|
-
.eq(this.prevActiveSlide)
|
641
|
-
.css("opacity", 0)
|
642
|
-
.animate({top : this.orbitHeight}, this.options.animationSpeed, "");
|
643
|
-
}
|
644
|
-
if (slideDirection == "prev") {
|
645
|
-
this.$slides
|
646
|
-
.eq(this.activeSlide)
|
647
|
-
.css({top: this.orbitHeight, "z-index" : 3})
|
648
|
-
.css("opacity", 1)
|
649
|
-
.animate({top : 0}, this.options.animationSpeed, this.resetAndUnlock);
|
650
|
-
this.$slides
|
651
|
-
.eq(this.prevActiveSlide)
|
652
|
-
.css("opacity", 0)
|
653
|
-
.animate({top : -this.orbitHeight}, this.options.animationSpeed);
|
654
|
-
}
|
655
|
-
}
|
656
|
-
|
657
|
-
this.setCaption();
|
658
|
-
}
|
659
|
-
|
660
|
-
// if on last slide and singleCycle is true, don't loop through slides again
|
661
|
-
// .length is zero based so must minus 1 to match activeSlide index
|
662
|
-
if (this.activeSlide === this.$slides.length-1 && this.options.singleCycle) {
|
663
|
-
this.stopClock();
|
664
|
-
}
|
665
|
-
}
|
666
|
-
};
|
667
|
-
|
668
|
-
$.fn.orbit = function (options) {
|
669
|
-
return this.each(function () {
|
670
|
-
var orbit = $.extend({}, ORBIT);
|
671
|
-
orbit.init(this, options);
|
672
|
-
});
|
673
|
-
};
|
674
|
-
|
675
|
-
})(jQuery);
|
676
|
-
|
677
|
-
/*!
|
678
|
-
* jQuery imageready Plugin
|
679
|
-
* http://www.zurb.com/playground/
|
680
|
-
*
|
681
|
-
* Copyright 2011, ZURB
|
682
|
-
* Released under the MIT License
|
683
|
-
*/
|
684
|
-
(function ($) {
|
685
|
-
|
686
|
-
var options = {};
|
687
|
-
|
688
|
-
$.event.special.imageready = {
|
689
|
-
|
690
|
-
setup: function (data, namespaces, eventHandle) {
|
691
|
-
options = data || options;
|
692
|
-
},
|
693
|
-
|
694
|
-
add: function (handleObj) {
|
695
|
-
var $this = $(this),
|
696
|
-
src;
|
697
|
-
|
698
|
-
if ( this.nodeType === 1 && this.tagName.toLowerCase() === 'img' && this.src !== '' ) {
|
699
|
-
if (options.forceLoad) {
|
700
|
-
src = $this.attr('src');
|
701
|
-
$this.attr('src', '');
|
702
|
-
bindToLoad(this, handleObj.handler);
|
703
|
-
$this.attr('src', src);
|
704
|
-
} else if ( this.complete || this.readyState === 4 ) {
|
705
|
-
handleObj.handler.apply(this, arguments);
|
706
|
-
} else {
|
707
|
-
bindToLoad(this, handleObj.handler);
|
708
|
-
}
|
709
|
-
}
|
710
|
-
},
|
711
|
-
|
712
|
-
teardown: function (namespaces) {
|
713
|
-
$(this).unbind('.imageready');
|
714
|
-
}
|
715
|
-
};
|
716
|
-
|
717
|
-
function bindToLoad(element, callback) {
|
718
|
-
var $this = $(element);
|
719
|
-
|
720
|
-
$this.bind('load.imageready', function () {
|
721
|
-
callback.apply(element, arguments);
|
722
|
-
$this.unbind('load.imageready');
|
723
|
-
});
|
724
|
-
}
|
725
|
-
|
726
|
-
}(jQuery));
|
727
|
-
|
728
|
-
/*
|
729
|
-
|
730
|
-
Holder - 1.3 - client side image placeholders
|
731
|
-
(c) 2012 Ivan Malopinsky / http://imsky.co
|
732
|
-
|
733
|
-
Provided under the Apache 2.0 License: http://www.apache.org/licenses/LICENSE-2.0
|
734
|
-
Commercial use requires attribution.
|
735
|
-
|
736
|
-
*/
|
737
|
-
|
738
|
-
var Holder = Holder || {};
|
739
|
-
(function (app, win) {
|
740
|
-
|
741
|
-
var preempted = false,
|
742
|
-
fallback = false,
|
743
|
-
canvas = document.createElement('canvas');
|
744
|
-
|
745
|
-
//http://javascript.nwbox.com/ContentLoaded by Diego Perini with modifications
|
746
|
-
function contentLoaded(n,t){var l="complete",s="readystatechange",u=!1,h=u,c=!0,i=n.document,a=i.documentElement,e=i.addEventListener?"addEventListener":"attachEvent",v=i.addEventListener?"removeEventListener":"detachEvent",f=i.addEventListener?"":"on",r=function(e){(e.type!=s||i.readyState==l)&&((e.type=="load"?n:i)[v](f+e.type,r,u),!h&&(h=!0)&&t.call(n,null))},o=function(){try{a.doScroll("left")}catch(n){setTimeout(o,50);return}r("poll")};if(i.readyState==l)t.call(n,"lazy");else{if(i.createEventObject&&a.doScroll){try{c=!n.frameElement}catch(y){}c&&o()}i[e](f+"DOMContentLoaded",r,u),i[e](f+s,r,u),n[e](f+"load",r,u)}};
|
747
|
-
|
748
|
-
//https://gist.github.com/991057 by Jed Schmidt with modifications
|
749
|
-
function selector(a){
|
750
|
-
a=a.match(/^(\W)?(.*)/);var b=document["getElement"+(a[1]?a[1]=="#"?"ById":"sByClassName":"sByTagName")](a[2]);
|
751
|
-
var ret=[]; b!=null&&(b.length?ret=b:b.length==0?ret=b:ret=[b]); return ret;
|
752
|
-
}
|
753
|
-
|
754
|
-
//shallow object property extend
|
755
|
-
function extend(a,b){var c={};for(var d in a)c[d]=a[d];for(var e in b)c[e]=b[e];return c}
|
756
|
-
|
757
|
-
function draw(ctx, dimensions, template) {
|
758
|
-
var dimension_arr = [dimensions.height, dimensions.width].sort();
|
759
|
-
var maxFactor = Math.round(dimension_arr[1] / 16),
|
760
|
-
minFactor = Math.round(dimension_arr[0] / 16);
|
761
|
-
var text_height = Math.max(template.size, maxFactor);
|
762
|
-
canvas.width = dimensions.width;
|
763
|
-
canvas.height = dimensions.height;
|
764
|
-
ctx.textAlign = "center";
|
765
|
-
ctx.textBaseline = "middle";
|
766
|
-
ctx.fillStyle = template.background;
|
767
|
-
ctx.fillRect(0, 0, dimensions.width, dimensions.height);
|
768
|
-
ctx.fillStyle = template.foreground;
|
769
|
-
ctx.font = "bold " + text_height + "px sans-serif";
|
770
|
-
var text = template.text ? template.text : (dimensions.width + "x" + dimensions.height);
|
771
|
-
if (Math.round(ctx.measureText(text).width) / dimensions.width > 1) {
|
772
|
-
text_height = Math.max(minFactor, template.size);
|
773
|
-
}
|
774
|
-
ctx.font = "bold " + text_height + "px sans-serif";
|
775
|
-
ctx.fillText(text, (dimensions.width / 2), (dimensions.height / 2), dimensions.width);
|
776
|
-
return canvas.toDataURL("image/png");
|
777
|
-
}
|
778
|
-
|
779
|
-
if (!canvas.getContext) {
|
780
|
-
fallback = true;
|
781
|
-
} else {
|
782
|
-
if (canvas.toDataURL("image/png").indexOf("data:image/png") < 0) {
|
783
|
-
//Android doesn't support data URI
|
784
|
-
fallback = true;
|
785
|
-
} else {
|
786
|
-
var ctx = canvas.getContext("2d");
|
787
|
-
}
|
788
|
-
}
|
789
|
-
|
790
|
-
var settings = {
|
791
|
-
domain: "holder.js",
|
792
|
-
images: "img",
|
793
|
-
themes: {
|
794
|
-
"gray": {
|
795
|
-
background: "#eee",
|
796
|
-
foreground: "#aaa",
|
797
|
-
size: 12
|
798
|
-
},
|
799
|
-
"social": {
|
800
|
-
background: "#3a5a97",
|
801
|
-
foreground: "#fff",
|
802
|
-
size: 12
|
803
|
-
},
|
804
|
-
"industrial": {
|
805
|
-
background: "#434A52",
|
806
|
-
foreground: "#C2F200",
|
807
|
-
size: 12
|
808
|
-
}
|
809
|
-
}
|
810
|
-
};
|
811
|
-
|
812
|
-
|
813
|
-
|
814
|
-
app.flags = {
|
815
|
-
dimensions: {
|
816
|
-
regex: /([0-9]+)x([0-9]+)/,
|
817
|
-
output: function(val){
|
818
|
-
var exec = this.regex.exec(val);
|
819
|
-
return {
|
820
|
-
width: +exec[1],
|
821
|
-
height: +exec[2]
|
822
|
-
}
|
823
|
-
}
|
824
|
-
},
|
825
|
-
colors: {
|
826
|
-
regex: /#([0-9a-f]{3,})\:#([0-9a-f]{3,})/i,
|
827
|
-
output: function(val){
|
828
|
-
var exec = this.regex.exec(val);
|
829
|
-
return {
|
830
|
-
size: settings.themes.gray.size,
|
831
|
-
foreground: "#" + exec[2],
|
832
|
-
background: "#" + exec[1]
|
833
|
-
}
|
834
|
-
}
|
835
|
-
},
|
836
|
-
text: {
|
837
|
-
regex: /text\:(.*)/,
|
838
|
-
output: function(val){
|
839
|
-
return this.regex.exec(val)[1];
|
840
|
-
}
|
841
|
-
}
|
842
|
-
}
|
843
|
-
|
844
|
-
for(var flag in app.flags){
|
845
|
-
app.flags[flag].match = function (val){
|
846
|
-
return val.match(this.regex)
|
847
|
-
}
|
848
|
-
}
|
849
|
-
|
850
|
-
app.add_theme = function (name, theme) {
|
851
|
-
name != null && theme != null && (settings.themes[name] = theme);
|
852
|
-
return app;
|
853
|
-
};
|
854
|
-
|
855
|
-
app.add_image = function (src, el) {
|
856
|
-
var node = selector(el);
|
857
|
-
if (node.length) {
|
858
|
-
for (var i = 0, l = node.length; i < l; i++) {
|
859
|
-
var img = document.createElement("img")
|
860
|
-
img.setAttribute("data-src", src);
|
861
|
-
node[i].appendChild(img);
|
862
|
-
}
|
863
|
-
}
|
864
|
-
return app;
|
865
|
-
};
|
866
|
-
|
867
|
-
app.run = function (o) {
|
868
|
-
var options = extend(settings, o),
|
869
|
-
images = selector(options.images),
|
870
|
-
preempted = true;
|
871
|
-
|
872
|
-
for (var l = images.length, i = 0; i < l; i++) {
|
873
|
-
var theme = settings.themes.gray;
|
874
|
-
var src = images[i].getAttribute("data-src") || images[i].getAttribute("src");
|
875
|
-
if (src && !! ~src.indexOf(options.domain)) {
|
876
|
-
var render = false,
|
877
|
-
dimensions = null,
|
878
|
-
text = null;
|
879
|
-
var flags = src.substr(src.indexOf(options.domain) + options.domain.length + 1).split("/");
|
880
|
-
for (sl = flags.length, j = 0; j < sl; j++) {
|
881
|
-
if (app.flags.dimensions.match(flags[j])) {
|
882
|
-
render = true;
|
883
|
-
dimensions = app.flags.dimensions.output(flags[j]);
|
884
|
-
} else if (app.flags.colors.match(flags[j])) {
|
885
|
-
theme = app.flags.colors.output(flags[j]);
|
886
|
-
} else if (options.themes[flags[j]]) {
|
887
|
-
//If a theme is specified, it will override custom colors
|
888
|
-
theme = options.themes[flags[j]];
|
889
|
-
} else if (app.flags.text.match(flags[j])) {
|
890
|
-
text = app.flags.text.output(flags[j]);
|
891
|
-
}
|
892
|
-
}
|
893
|
-
if (render) {
|
894
|
-
images[i].setAttribute("data-src", src);
|
895
|
-
var dimensions_caption = dimensions.width + "x" + dimensions.height;
|
896
|
-
images[i].setAttribute("alt", text ? text : theme.text ? theme.text + " [" + dimensions_caption + "]" : dimensions_caption);
|
897
|
-
|
898
|
-
// Fallback
|
899
|
-
// images[i].style.width = dimensions.width + "px";
|
900
|
-
// images[i].style.height = dimensions.height + "px";
|
901
|
-
images[i].style.backgroundColor = theme.background;
|
902
|
-
|
903
|
-
var theme = (text ? extend(theme, {
|
904
|
-
text: text
|
905
|
-
}) : theme);
|
906
|
-
|
907
|
-
if (!fallback) {
|
908
|
-
images[i].setAttribute("src", draw(ctx, dimensions, theme));
|
909
|
-
}
|
910
|
-
}
|
911
|
-
}
|
912
|
-
}
|
913
|
-
return app;
|
914
|
-
};
|
915
|
-
contentLoaded(win, function () {
|
916
|
-
preempted || app.run()
|
917
|
-
})
|
918
|
-
|
919
|
-
})(Holder, window);
|