jquery_kwicks_rails 1.0.0 → 2.2.0
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.
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA1:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 0439cc90b664ddce91f2ca9089a5f01cc06651d1
|
4
|
+
data.tar.gz: 3bcb319974fefd291faad73a3b93b4524ec62791
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: eca700c53871802e09a5f752c6f9d7c8966c58ce28d5e01249b239b1d3e9820468c83a094ade42f6bc3f677fe210f0cbf4c98af661e1f63411b76a05ca28f73b
|
7
|
+
data.tar.gz: 96befaa97cdf3617883c79547354d5d580b30f844ad8d443ab7b171091e6b97f891755666c87c1194aae0950b0e666b40f9db6b03c1ceb444602390d7a4a1028
|
data/CHANGELOG.md
CHANGED
@@ -1,3 +1,13 @@
|
|
1
1
|
## 1.0.0 (July 21, 2013)
|
2
2
|
|
3
|
-
*
|
3
|
+
* Initial release.
|
4
|
+
|
5
|
+
## 2.2.0 (October 27, 2013)
|
6
|
+
|
7
|
+
* Upgraded kwicks JS to the last release (version 2.2.0), and keep gem version along with the JS version.
|
8
|
+
* There is now a *kwicks-collapsed* class to go along with the pre-existing *kwicks-expanded* class.
|
9
|
+
* There is now a built-in slideshow behavior.
|
10
|
+
* Panel spacing can now be specified as a percentage.
|
11
|
+
* There is now a ```$().kwicks('destroy')``` method.
|
12
|
+
* The ```$().kwicks('expand')``` method now accepts a *delay* option).
|
13
|
+
* The menu behavior has new options: *delayMouseIn*, *delayMouseOut*, *selectOnClick*, and *deselectOnClick*.
|
@@ -1,5 +1,5 @@
|
|
1
1
|
/*!
|
2
|
-
* Kwicks: Sexy Sliding Panels for jQuery - v2.
|
2
|
+
* Kwicks: Sexy Sliding Panels for jQuery - v2.2.0
|
3
3
|
* http://devsmash.com/projects/kwicks
|
4
4
|
*
|
5
5
|
* Copyright 2013 Jeremy Martin (jmar777)
|
@@ -16,15 +16,23 @@
|
|
16
16
|
var methods = {
|
17
17
|
init: function(opts) {
|
18
18
|
var defaults = {
|
19
|
+
// general options:
|
19
20
|
maxSize: -1,
|
20
21
|
minSize: -1,
|
21
22
|
spacing: 5,
|
22
23
|
duration: 500,
|
23
24
|
isVertical: false,
|
24
25
|
easing: undefined,
|
25
|
-
behavior: null,
|
26
26
|
autoResize: true,
|
27
|
-
|
27
|
+
behavior: null,
|
28
|
+
// menu behavior options:
|
29
|
+
delayMouseIn: 0,
|
30
|
+
delayMouseOut: 0,
|
31
|
+
selectOnClick: true,
|
32
|
+
deselectOnClick: false,
|
33
|
+
// slideshow behavior options:
|
34
|
+
interval: 2500,
|
35
|
+
interactive: true
|
28
36
|
};
|
29
37
|
var o = $.extend(defaults, opts);
|
30
38
|
|
@@ -33,7 +41,7 @@
|
|
33
41
|
throw new Error('Kwicks options minSize and maxSize may not both be set');
|
34
42
|
if (o.behavior && o.behavior !== 'menu' && o.behavior !== 'slideshow')
|
35
43
|
throw new Error('Unrecognized Kwicks behavior specified: ' + o.behavior);
|
36
|
-
$.each(['minSize', 'maxSize'], function(i, prop) {
|
44
|
+
$.each(['minSize', 'maxSize', 'spacing'], function(i, prop) {
|
37
45
|
var val = o[prop];
|
38
46
|
switch (typeof val) {
|
39
47
|
case 'number':
|
@@ -45,7 +53,7 @@
|
|
45
53
|
o[prop] = +val.slice(0, -1) / 100;
|
46
54
|
} else if (val.slice(-2) === 'px') {
|
47
55
|
o[prop + 'Units'] = 'px';
|
48
|
-
o[prop] = +val.slice(0, -2);
|
56
|
+
o[prop] = +val.slice(0, -2);
|
49
57
|
} else {
|
50
58
|
throw new Error('Invalid value for Kwicks option ' + prop + ': ' + val);
|
51
59
|
}
|
@@ -59,82 +67,120 @@
|
|
59
67
|
$(this).data('kwicks', new Kwick(this, o));
|
60
68
|
});
|
61
69
|
},
|
62
|
-
expand: function(index) {
|
70
|
+
expand: function(index, opts) {
|
71
|
+
if (typeof index === 'object') {
|
72
|
+
opts = index;
|
73
|
+
index = undefined;
|
74
|
+
}
|
75
|
+
|
76
|
+
var delay = opts && opts.delay || 0;
|
77
|
+
|
63
78
|
return this.each(function() {
|
64
79
|
var $this = $(this),
|
65
|
-
$
|
66
|
-
|
67
|
-
//
|
68
|
-
if (
|
69
|
-
|
70
|
-
throw new Error('Kwicks method "expand" requires an index');
|
71
|
-
// protect against jquery's eq(-index) feature
|
72
|
-
if (index >= 0) $panel = $this.children().eq(index);
|
73
|
-
}
|
74
|
-
// otherwise `this` should be a panel already
|
75
|
-
else if ($this.parent().is('.kwicks-processed')) {
|
76
|
-
// don't need panel in this scenario
|
77
|
-
$panel = $this;
|
78
|
-
index = $panel.index();
|
80
|
+
kwick = $this.data('kwicks');
|
81
|
+
|
82
|
+
// assume this is the container
|
83
|
+
if (kwick) {
|
84
|
+
index = typeof index === 'number' ? index : -1;
|
79
85
|
}
|
80
|
-
//
|
81
|
-
else {
|
82
|
-
|
86
|
+
// otherwise, assume we have a panel
|
87
|
+
else if (kwick = $this.parent().data('kwicks')) {
|
88
|
+
index = $this.index();
|
89
|
+
} else {
|
90
|
+
return;
|
83
91
|
}
|
84
92
|
|
85
|
-
|
86
|
-
|
87
|
-
|
93
|
+
var expand = function() {
|
94
|
+
// bail out if the panel is already expanded
|
95
|
+
if (index === kwick.expandedIndex) return;
|
96
|
+
|
97
|
+
var $panels = kwick.$panels,
|
98
|
+
expanded = $panels[index] || null;
|
99
|
+
|
100
|
+
kwick.$container.trigger('expand.kwicks', {
|
101
|
+
index: index,
|
102
|
+
expanded: expanded,
|
103
|
+
collapsed: $panels.not(expanded).get(),
|
104
|
+
oldIndex: kwick.expandedIndex,
|
105
|
+
oldExpanded: kwick.getExpandedPanel(),
|
106
|
+
isAnimated: kwick.isAnimated
|
107
|
+
});
|
108
|
+
};
|
109
|
+
|
110
|
+
var timeoutId = kwick.$container.data('kwicks-timeout-id');
|
111
|
+
if (timeoutId) {
|
112
|
+
kwick.$container.removeData('kwicks-timeout-id');
|
113
|
+
clearTimeout(timeoutId);
|
114
|
+
}
|
115
|
+
if (delay > 0) {
|
116
|
+
kwick.$container.data('kwicks-timeout-id', setTimeout(expand, delay));
|
117
|
+
} else {
|
118
|
+
expand();
|
119
|
+
}
|
88
120
|
});
|
89
121
|
},
|
90
122
|
expanded: function() {
|
91
123
|
var kwick = this.first().data('kwicks');
|
92
|
-
if (!kwick)
|
124
|
+
if (!kwick) return;
|
93
125
|
return kwick.expandedIndex;
|
94
126
|
},
|
95
127
|
select: function(index) {
|
96
128
|
return this.each(function() {
|
97
129
|
var $this = $(this),
|
98
|
-
$
|
99
|
-
|
100
|
-
//
|
101
|
-
if (
|
102
|
-
|
103
|
-
throw new Error('Kwicks method "select" requires an index');
|
104
|
-
// protect against jquery's eq(-index) feature
|
105
|
-
if (index >= 0) $panel = $this.children().eq(index);
|
130
|
+
kwick = $this.data('kwicks');
|
131
|
+
|
132
|
+
// assume this is the container
|
133
|
+
if (kwick) {
|
134
|
+
index = typeof index === 'number' ? index : -1;
|
106
135
|
}
|
107
|
-
// otherwise
|
108
|
-
else if ($this.parent().
|
109
|
-
|
110
|
-
|
111
|
-
|
136
|
+
// otherwise, assume we have a panel
|
137
|
+
else if (kwick = $this.parent().data('kwicks')) {
|
138
|
+
index = $this.index();
|
139
|
+
} else {
|
140
|
+
return;
|
112
141
|
}
|
113
|
-
|
114
|
-
|
115
|
-
|
142
|
+
|
143
|
+
// don't trigger event if its already selected
|
144
|
+
if (index !== kwick.selectedIndex) {
|
145
|
+
var $panels = kwick.$panels,
|
146
|
+
selected = $panels[index] || null;
|
147
|
+
|
148
|
+
kwick.$container.trigger('select.kwicks', {
|
149
|
+
index: index,
|
150
|
+
selected: selected,
|
151
|
+
unselected: $panels.not(selected).get(),
|
152
|
+
oldIndex: kwick.selectedIndex,
|
153
|
+
oldSelected: kwick.getSelectedPanel()
|
154
|
+
});
|
116
155
|
}
|
117
156
|
|
118
|
-
//
|
119
|
-
|
120
|
-
$target.trigger('select.kwicks', { index: index });
|
157
|
+
// call expand
|
158
|
+
kwick.$container.kwicks('expand', index);
|
121
159
|
});
|
122
160
|
},
|
123
161
|
selected: function() {
|
124
162
|
var kwick = this.first().data('kwicks');
|
125
|
-
if (!kwick)
|
163
|
+
if (!kwick) return;
|
126
164
|
return kwick.selectedIndex;
|
127
165
|
},
|
128
|
-
resize: function(
|
166
|
+
resize: function() {
|
129
167
|
return this.each(function() {
|
130
168
|
var $this = $(this),
|
131
169
|
kwick = $this.data('kwicks');
|
132
170
|
|
133
|
-
if (!kwick)
|
134
|
-
throw new Error('Cannot called "resize" method on a non-Kwicks element');
|
135
|
-
}
|
171
|
+
if (!kwick) return;
|
136
172
|
|
137
|
-
kwick.resize();
|
173
|
+
kwick.resize();
|
174
|
+
});
|
175
|
+
},
|
176
|
+
destroy: function() {
|
177
|
+
return this.each(function() {
|
178
|
+
var $this = $(this),
|
179
|
+
kwick = $this.data('kwicks');
|
180
|
+
|
181
|
+
if (!kwick) return;
|
182
|
+
|
183
|
+
kwick.destroy();
|
138
184
|
});
|
139
185
|
}
|
140
186
|
};
|
@@ -158,11 +204,8 @@
|
|
158
204
|
$.event.special.expand = {
|
159
205
|
_default: function(e, data) {
|
160
206
|
if (e.namespace !== 'kwicks') return;
|
161
|
-
var
|
162
|
-
|
163
|
-
// should we throw here?
|
164
|
-
if (!kwick) return;
|
165
|
-
kwick.expand(data.index);
|
207
|
+
var kwick = $(e.target).data('kwicks');
|
208
|
+
if (kwick) kwick.expand(data.index);
|
166
209
|
}
|
167
210
|
};
|
168
211
|
|
@@ -172,11 +215,8 @@
|
|
172
215
|
$.event.special.select = {
|
173
216
|
_default: function(e, data) {
|
174
217
|
if (e.namespace !== 'kwicks') return;
|
175
|
-
var
|
176
|
-
|
177
|
-
// should we throw here?
|
178
|
-
if (!kwick) return;
|
179
|
-
kwick.select(data.index);
|
218
|
+
var kwick = $(e.target).data('kwicks');
|
219
|
+
if (kwick) kwick.select(data.index);
|
180
220
|
}
|
181
221
|
};
|
182
222
|
|
@@ -184,13 +224,29 @@
|
|
184
224
|
* Instantiates a new Kwick instance using the provided container and options.
|
185
225
|
*/
|
186
226
|
var Kwick = function Kwick(container, opts) {
|
227
|
+
var self = this;
|
228
|
+
|
187
229
|
this.opts = opts;
|
188
230
|
|
231
|
+
// an array of callbacks to invoke if 'destroy' is invoked
|
232
|
+
this.onDestroyHandlers = [];
|
233
|
+
|
189
234
|
// references to our DOM elements
|
190
235
|
var orientation = opts.isVertical ? 'vertical' : 'horizontal';
|
191
|
-
this.$container = $(container)
|
236
|
+
this.$container = $(container);
|
192
237
|
this.$panels = this.$container.children();
|
193
238
|
|
239
|
+
// semi-smart add/remove around container classes so that we don't bork
|
240
|
+
// the styling if/when destroy is called
|
241
|
+
var containerClasses = ['kwicks', 'kwicks-' + orientation];
|
242
|
+
$.each(containerClasses, function(className) {
|
243
|
+
if (self.$container.hasClass(className)) return;
|
244
|
+
self.$container.addClass(className);
|
245
|
+
self.onDestroy(function() {
|
246
|
+
self.$container.removeClass(className);
|
247
|
+
});
|
248
|
+
});
|
249
|
+
|
194
250
|
// zero-based, -1 for "none"
|
195
251
|
this.selectedIndex = this.$panels.filter('.kwicks-selected').index();
|
196
252
|
this.expandedIndex = this.selectedIndex;
|
@@ -209,28 +265,38 @@
|
|
209
265
|
this.secondaryAlignment = opts.isVertical ? 'bottom' : 'right';
|
210
266
|
|
211
267
|
// object for creating a "master" animation loop for all panel animations
|
212
|
-
this.$timer = $({ progress
|
268
|
+
this.$timer = $({ progress: 0 });
|
269
|
+
|
270
|
+
// keeps track of whether or not an animation is in progress
|
271
|
+
this.isAnimated = false;
|
213
272
|
|
214
273
|
// the current offsets for each panel
|
215
274
|
this.offsets = this.getOffsetsForExpanded();
|
216
275
|
|
217
|
-
this.
|
276
|
+
this.updatePanelStyles();
|
218
277
|
this.initBehavior();
|
219
278
|
this.initWindowResizeHandler();
|
220
|
-
this.initSlideShow();
|
221
279
|
};
|
222
280
|
|
223
281
|
/**
|
224
|
-
* Calculates size, minSize, and
|
225
|
-
* user-provided options. The results will be stored on this.panelSize, this.panelMinSize,
|
226
|
-
* this.panelMaxSize. This should be run on initialization and whenever
|
227
|
-
* primary dimension may have changed in size.
|
282
|
+
* Calculates size, minSize, maxSize, and spacing based on the current size of the container and
|
283
|
+
* the user-provided options. The results will be stored on this.panelSize, this.panelMinSize,
|
284
|
+
* this.panelMaxSize, and this.panelSpacing. This should be run on initialization and whenever
|
285
|
+
* the container's primary dimension may have changed in size.
|
228
286
|
*/
|
229
287
|
Kwick.prototype.calculatePanelSizes = function() {
|
230
288
|
var opts = this.opts,
|
231
|
-
|
232
|
-
|
233
|
-
|
289
|
+
containerSize = this.getContainerSize(true);
|
290
|
+
|
291
|
+
// calculate spacing first
|
292
|
+
if (opts.spacingUnits === '%') {
|
293
|
+
this.panelSpacing = containerSize * opts.spacing;
|
294
|
+
} else {
|
295
|
+
this.panelSpacing = opts.spacing;
|
296
|
+
}
|
297
|
+
|
298
|
+
var numPanels = this.$panels.length,
|
299
|
+
sumSpacing = this.panelSpacing * (numPanels - 1),
|
234
300
|
sumPanelSize = containerSize - sumSpacing;
|
235
301
|
|
236
302
|
this.panelSize = sumPanelSize / numPanels;
|
@@ -271,7 +337,7 @@
|
|
271
337
|
// todo: cache the offset values
|
272
338
|
var expandedIndex = this.expandedIndex,
|
273
339
|
numPanels = this.$panels.length,
|
274
|
-
spacing = this.
|
340
|
+
spacing = this.panelSpacing,
|
275
341
|
size = this.panelSize,
|
276
342
|
minSize = this.panelMinSize,
|
277
343
|
maxSize = this.panelMaxSize;
|
@@ -320,7 +386,7 @@
|
|
320
386
|
pDim = this.primaryDimension,
|
321
387
|
pAlign = this.primaryAlignment,
|
322
388
|
sAlign = this.secondaryAlignment,
|
323
|
-
spacing = this.
|
389
|
+
spacing = this.panelSpacing,
|
324
390
|
containerSize = this.getContainerSize();
|
325
391
|
|
326
392
|
// the kwicks-processed class ensures that panels are absolutely positioned, but on our
|
@@ -351,20 +417,6 @@
|
|
351
417
|
}
|
352
418
|
};
|
353
419
|
|
354
|
-
/**
|
355
|
-
* Sets initial styles on the container element and panels
|
356
|
-
*/
|
357
|
-
Kwick.prototype.initStyles = function() {
|
358
|
-
var opts = this.opts,
|
359
|
-
$container = this.$container,
|
360
|
-
$panels = this.$panels,
|
361
|
-
numPanels = $panels.length,
|
362
|
-
pDim = this.primaryDimension,
|
363
|
-
sDim = this.secondaryDimension;
|
364
|
-
|
365
|
-
this.updatePanelStyles();
|
366
|
-
};
|
367
|
-
|
368
420
|
/**
|
369
421
|
* Assuming for a moment that out-of-the-box behaviors aren't a horrible idea, this method
|
370
422
|
* encapsulates the initialization logic thereof.
|
@@ -372,27 +424,82 @@
|
|
372
424
|
Kwick.prototype.initBehavior = function() {
|
373
425
|
if (!this.opts.behavior) return;
|
374
426
|
|
375
|
-
var $container = this.$container;
|
376
427
|
switch (this.opts.behavior) {
|
377
428
|
case 'menu':
|
378
|
-
this
|
379
|
-
$container.kwicks('expand', -1);
|
380
|
-
}).children().on('mouseover', function() {
|
381
|
-
$(this).kwicks('expand');
|
382
|
-
}).click(function() {
|
383
|
-
$(this).kwicks('select');
|
384
|
-
});
|
429
|
+
this.initMenuBehavior();
|
385
430
|
break;
|
386
431
|
case 'slideshow':
|
387
|
-
this
|
388
|
-
$(this).kwicks('select');
|
389
|
-
});
|
432
|
+
this.initSlideshowBehavior();
|
390
433
|
break;
|
391
434
|
default:
|
392
435
|
throw new Error('Unrecognized behavior option: ' + this.opts.behavior);
|
393
436
|
}
|
394
437
|
};
|
395
438
|
|
439
|
+
/**
|
440
|
+
* Initializes the menu behavior.
|
441
|
+
*/
|
442
|
+
Kwick.prototype.initMenuBehavior = function() {
|
443
|
+
var self = this,
|
444
|
+
opts = self.opts;
|
445
|
+
|
446
|
+
this.addEventHandler(this.$container, 'mouseleave', function() {
|
447
|
+
self.$container.kwicks('expand', -1, { delay: opts.delayMouseOut });
|
448
|
+
});
|
449
|
+
|
450
|
+
this.addEventHandler(this.$panels, 'mouseenter', function() {
|
451
|
+
$(this).kwicks('expand', { delay: opts.delayMouseIn });
|
452
|
+
});
|
453
|
+
|
454
|
+
if (!opts.selectOnClick && !opts.deselectOnClick) return;
|
455
|
+
|
456
|
+
this.addEventHandler(this.$panels, 'click', function() {
|
457
|
+
var $this = $(this),
|
458
|
+
isSelected = $this.hasClass('kwicks-selected');
|
459
|
+
|
460
|
+
if (isSelected && opts.deselectOnClick) {
|
461
|
+
$this.parent().kwicks('select', -1);
|
462
|
+
} else if (!isSelected && opts.selectOnClick) {
|
463
|
+
$this.kwicks('select');
|
464
|
+
}
|
465
|
+
});
|
466
|
+
};
|
467
|
+
|
468
|
+
/**
|
469
|
+
* Initializes the slideshow behavior.
|
470
|
+
*/
|
471
|
+
Kwick.prototype.initSlideshowBehavior = function() {
|
472
|
+
var self = this,
|
473
|
+
numSlides = this.$panels.length,
|
474
|
+
curSlide = 0,
|
475
|
+
// flag to handle weird corner cases
|
476
|
+
running = false,
|
477
|
+
intervalId;
|
478
|
+
|
479
|
+
var start = function() {
|
480
|
+
if (running) return;
|
481
|
+
intervalId = setInterval(function() {
|
482
|
+
self.$container.kwicks('expand', ++curSlide % numSlides);
|
483
|
+
}, self.opts.interval);
|
484
|
+
running = true;
|
485
|
+
};
|
486
|
+
var pause = function() {
|
487
|
+
clearInterval(intervalId);
|
488
|
+
running = false;
|
489
|
+
};
|
490
|
+
|
491
|
+
start();
|
492
|
+
this.onDestroy(pause);
|
493
|
+
|
494
|
+
if (!this.opts.interactive) return;
|
495
|
+
|
496
|
+
this.addEventHandler(this.$container, 'mouseenter', pause);
|
497
|
+
this.addEventHandler(this.$container, 'mouseleave', start);
|
498
|
+
this.addEventHandler(this.$panels, 'mouseenter', function() {
|
499
|
+
curSlide = $(this).kwicks('expand').index();
|
500
|
+
});
|
501
|
+
};
|
502
|
+
|
396
503
|
/**
|
397
504
|
* Sets up a throttled window resize handler that triggers resize logic for the panels
|
398
505
|
* todo: hideous code, needs refactor for the eye bleeds
|
@@ -402,7 +509,8 @@
|
|
402
509
|
|
403
510
|
var self = this,
|
404
511
|
prevTime = 0,
|
405
|
-
execScheduled = false
|
512
|
+
execScheduled = false,
|
513
|
+
$window = $(window);
|
406
514
|
|
407
515
|
var onResize = function(e) {
|
408
516
|
// if there's no event, then this is a scheduled from our setTimeout
|
@@ -420,29 +528,10 @@
|
|
420
528
|
|
421
529
|
// throttle rate is satisfied, go ahead and run
|
422
530
|
prevTime = now;
|
423
|
-
self.resize();
|
424
|
-
}
|
425
|
-
$(window).on('resize', onResize);
|
426
|
-
};
|
427
|
-
|
428
|
-
/**
|
429
|
-
* Initialize Slide Show behavior
|
430
|
-
*/
|
431
|
-
Kwick.prototype.initSlideShow = function() {
|
432
|
-
if (!this.opts.showSpeed || this.opts.behavior !== "slideshow") return;
|
433
|
-
if (isNaN(this.opts.showSpeed)) {
|
434
|
-
throw new Error('Invalid slideShow option (not a number): ' + this.opts.slideShow);
|
435
|
-
}
|
531
|
+
self.resize();
|
532
|
+
};
|
436
533
|
|
437
|
-
|
438
|
-
speed = parseInt(this.opts.showSpeed)*1000,
|
439
|
-
numSlides = this.$panels.length,
|
440
|
-
curSlide = 0;
|
441
|
-
|
442
|
-
clearInterval(this.slideShowInterval);
|
443
|
-
this.slideShowInterval = setInterval(function(){
|
444
|
-
self.expand(curSlide++ % numSlides);
|
445
|
-
},speed);
|
534
|
+
this.addEventHandler($window, 'resize', onResize);
|
446
535
|
};
|
447
536
|
|
448
537
|
/**
|
@@ -462,27 +551,76 @@
|
|
462
551
|
* Gets a reference to the currently expanded panel (if there is one)
|
463
552
|
*/
|
464
553
|
Kwick.prototype.getExpandedPanel = function() {
|
465
|
-
return this.expandedIndex
|
554
|
+
return this.$panels[this.expandedIndex] || null;
|
466
555
|
};
|
467
556
|
|
468
557
|
/**
|
469
|
-
* Gets a reference to the currently collapsed panels
|
558
|
+
* Gets a reference to the currently collapsed panels
|
470
559
|
*/
|
471
560
|
Kwick.prototype.getCollapsedPanels = function() {
|
472
|
-
|
561
|
+
if (this.expandedIndex === -1) return [];
|
562
|
+
return this.$panels.not(this.getExpandedPanel()).get();
|
473
563
|
};
|
474
564
|
|
475
565
|
/**
|
476
566
|
* Gets a reference to the currently selected panel (if there is one)
|
477
567
|
*/
|
478
568
|
Kwick.prototype.getSelectedPanel = function() {
|
479
|
-
return this.selectedIndex
|
569
|
+
return this.$panels[this.selectedIndex] || null;
|
570
|
+
};
|
571
|
+
|
572
|
+
/**
|
573
|
+
* Gets a reference to the currently unselected panels
|
574
|
+
*/
|
575
|
+
Kwick.prototype.getUnselectedPanels = function() {
|
576
|
+
return this.$panels.not(this.getSelectedPanel()).get();
|
577
|
+
};
|
578
|
+
|
579
|
+
/**
|
580
|
+
* Registers a handler to be invoked if/when 'destroy' is invoked
|
581
|
+
*/
|
582
|
+
Kwick.prototype.onDestroy = function(handler) {
|
583
|
+
this.onDestroyHandlers.push(handler);
|
584
|
+
};
|
585
|
+
|
586
|
+
/**
|
587
|
+
* Adds an event handler and automatically registers it to be removed if/when
|
588
|
+
* the plugin is destroyed.
|
589
|
+
*/
|
590
|
+
Kwick.prototype.addEventHandler = function($el, eventName, handler) {
|
591
|
+
$el.on(eventName, handler);
|
592
|
+
this.onDestroy(function() {
|
593
|
+
$el.off(eventName, handler);
|
594
|
+
});
|
595
|
+
};
|
596
|
+
|
597
|
+
/**
|
598
|
+
* "Destroys" this Kwicks instance plugin by performing the following:
|
599
|
+
* 1) Stops any currently running animations
|
600
|
+
* 2) Invokes all destroy handlers
|
601
|
+
* 3) Clears out all style attributes on panels
|
602
|
+
* 4) Removes all kwicks class names from panels and container
|
603
|
+
* 5) Removes the 'kwicks' data value from the container
|
604
|
+
*/
|
605
|
+
Kwick.prototype.destroy = function() {
|
606
|
+
this.$timer.stop();
|
607
|
+
for (var i = 0, len = this.onDestroyHandlers.length; i < len; i++) {
|
608
|
+
this.onDestroyHandlers[i]();
|
609
|
+
}
|
610
|
+
this.$panels
|
611
|
+
.attr('style', '')
|
612
|
+
.removeClass('kwicks-expanded kwicks-selected kwicks-collapsed');
|
613
|
+
this.$container
|
614
|
+
// note: kwicks and kwicks-<orientation> classes have extra smarts around them
|
615
|
+
// back in the constructor
|
616
|
+
.removeClass('kwicks-processed')
|
617
|
+
.removeData('kwicks');
|
480
618
|
};
|
481
619
|
|
482
620
|
/**
|
483
621
|
* Forces the panels to be updated in response to the container being resized.
|
484
622
|
*/
|
485
|
-
Kwick.prototype.resize = function(
|
623
|
+
Kwick.prototype.resize = function() {
|
486
624
|
// bail out if container size hasn't changed
|
487
625
|
if (this.getContainerSize() === this.getContainerSize(true)) return;
|
488
626
|
|
@@ -500,27 +638,25 @@
|
|
500
638
|
};
|
501
639
|
|
502
640
|
/**
|
503
|
-
* Selects
|
641
|
+
* Selects the panel with the specified index (use -1 to select none)
|
504
642
|
*/
|
505
643
|
Kwick.prototype.select = function(index) {
|
506
644
|
// make sure the panel isn't already selected
|
507
|
-
if (index === this.selectedIndex)
|
508
|
-
// it's possible through the API to have a panel already selected but not expanded,
|
509
|
-
// so ensure that the panel really is expanded
|
510
|
-
return this.expand(index);
|
511
|
-
}
|
645
|
+
if (index === this.selectedIndex) return;
|
512
646
|
|
513
|
-
this.getSelectedPanel().removeClass('kwicks-selected');
|
647
|
+
$(this.getSelectedPanel()).removeClass('kwicks-selected');
|
514
648
|
this.selectedIndex = index;
|
515
|
-
this.getSelectedPanel().addClass('kwicks-selected');
|
516
|
-
this.expand(index);
|
649
|
+
$(this.getSelectedPanel()).addClass('kwicks-selected');
|
517
650
|
};
|
518
651
|
|
519
652
|
/**
|
520
653
|
* Expands the panel with the specified index (use -1 to expand none)
|
521
654
|
*/
|
522
655
|
Kwick.prototype.expand = function(index) {
|
523
|
-
var self = this
|
656
|
+
var self = this,
|
657
|
+
// used for expand-complete event later on
|
658
|
+
oldIndex = this.expandedIndex,
|
659
|
+
oldExpanded = this.getExpandedPanel();
|
524
660
|
|
525
661
|
// if the index is -1, then default it to the currently selected index (which will also be
|
526
662
|
// -1 if no panels are currently selected)
|
@@ -529,11 +665,11 @@
|
|
529
665
|
// make sure the panel isn't already expanded
|
530
666
|
if (index === this.expandedIndex) return;
|
531
667
|
|
532
|
-
this.getExpandedPanel().removeClass('kwicks-expanded');
|
533
|
-
this.getCollapsedPanels().removeClass('kwicks-collapsed');
|
668
|
+
$(this.getExpandedPanel()).removeClass('kwicks-expanded');
|
669
|
+
$(this.getCollapsedPanels()).removeClass('kwicks-collapsed');
|
534
670
|
this.expandedIndex = index;
|
535
|
-
this.getExpandedPanel().addClass('kwicks-expanded');
|
536
|
-
this.getCollapsedPanels().addClass('kwicks-collapsed');
|
671
|
+
$(this.getExpandedPanel()).addClass('kwicks-expanded');
|
672
|
+
$(this.getCollapsedPanels()).addClass('kwicks-collapsed');
|
537
673
|
|
538
674
|
// handle panel animation
|
539
675
|
var $timer = this.$timer,
|
@@ -548,6 +684,7 @@
|
|
548
684
|
duration: this.opts.duration,
|
549
685
|
easing: this.opts.easing,
|
550
686
|
step: function(progress) {
|
687
|
+
// check if we've resized mid-animation (yes, we're thorough)
|
551
688
|
if (self._dirtyOffsets) {
|
552
689
|
offsets = self.offsets;
|
553
690
|
targetOffsets = self.getOffsetsForExpanded();
|
@@ -563,6 +700,15 @@
|
|
563
700
|
},
|
564
701
|
complete: function() {
|
565
702
|
self.isAnimated = false;
|
703
|
+
self.$container.trigger('expand-complete.kwicks', {
|
704
|
+
index: index,
|
705
|
+
expanded: self.getExpandedPanel(),
|
706
|
+
collapsed: self.getCollapsedPanels(),
|
707
|
+
oldIndex: oldIndex,
|
708
|
+
oldExpanded: oldExpanded,
|
709
|
+
// note: this will always be false but is included to match expand event
|
710
|
+
isAnimated: false
|
711
|
+
});
|
566
712
|
}
|
567
713
|
});
|
568
714
|
};
|
metadata
CHANGED
@@ -1,14 +1,14 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: jquery_kwicks_rails
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version:
|
4
|
+
version: 2.2.0
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Guillermo Guerrero
|
8
8
|
autorequire:
|
9
9
|
bindir: bin
|
10
10
|
cert_chain: []
|
11
|
-
date: 2013-
|
11
|
+
date: 2013-10-27 00:00:00.000000000 Z
|
12
12
|
dependencies:
|
13
13
|
- !ruby/object:Gem::Dependency
|
14
14
|
name: rails
|