Skip to content

Commit 697b493

Browse files
iejerryiejerry
committed
add the multiple model
1 parent 3b587a0 commit 697b493

File tree

4 files changed

+103
-47
lines changed

4 files changed

+103
-47
lines changed

‎demo/index.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -46,7 +46,7 @@ <h2>Example</h2>
4646
<h3>Vertical</h3>
4747
<pre class="has-example"><code class="language-markup"></code></pre>
4848
<div class="example">
49-
<ul data-direction="vertical" data-initial-index="1" data-event="click" class="-accordion -accordion--basic -accordion--vertical">
49+
<ul data-direction="vertical" data-multiple="true" data-initial-index="[1,2]" data-event="click" class="-accordion -accordion--basic -accordion--vertical">
5050
<li class="-accordion__panel">
5151
<span class="-accordion__heading">Section 1<i class="-icon -icon--right"></i></span>
5252
<div class="-accordion__expander">This's tab1. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce velit tortor, dictum in gravida nec, aliquet non lorem. pellentesque. ipiscing elit. Fusce veli tortor.</div>
@@ -67,7 +67,7 @@ <h3>Vertical</h3>
6767
<h3>Horizontal</h3>
6868
<pre class="has-example"><code class="language-markup"></code></pre>
6969
<div class="example">
70-
<ul data-direction="horizontal" data-initial-index="0" data-event="click" class="-accordion -accordion--box -accordion--horizontal">
70+
<ul data-direction="horizontal" data-multiple="true" data-initial-index="[0,2]" data-event="click" class="-accordion -accordion--box -accordion--horizontal">
7171
<li class="-accordion__panel">
7272
<span class="-accordion__heading">Section 1<i class="-icon -icon--left"></i></span>
7373
<div class="-accordion__expander">This's tab1. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce velit tortor, dictum in gravida nec, aliquet non lorem. pellentesque. ipiscing elit. Fusce veli tortor.</div>

‎dist/jquery-asAccordion.js

+50-22
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
/*! jQuery asAccordion - v0.1.0 - 2014-10-23
1+
/*! jQuery asAccordion - v0.1.0 - 2014-11-06
22
* https://github.com/amazingSurge/jquery-asAccordion
33
* Copyright (c) 2014 amazingSurge; Licensed GPL */
44
(function(window, document, $, undefined) {
@@ -49,7 +49,6 @@
4949
this.initialIndex = this.options.initialIndex;
5050
this.initialized = false;
5151
this.disabled = false;
52-
this.actived = false;
5352
this.current = null;
5453

5554
this.classes = {
@@ -112,14 +111,13 @@
112111
this.set(this.initialIndex);
113112
this.current = this.initialIndex;
114113

114+
this.initialized = true;
115+
115116
this.responsive.init(this);
116117
$(window).on('resize', this._throttle(function(){
117118
self.responsive.init(self);
118119
}, 250));
119120

120-
121-
this.initialized = true;
122-
123121
this._trigger('ready');
124122
},
125123

@@ -142,16 +140,18 @@
142140

143141
responsive: {
144142
init: function(self) {
145-
if ($('html, body').outerWidth() <= self.options.mobile_breakpoint) {
143+
if ($('html, body').outerWidth() <= self.options.mobile_breakpoint && !this.responsive) {
146144
if (self.options.direction === 'vertical') {
147145
return false;
148146
}
147+
this.responsive = true;
149148

150149
this.resize(self);
151150
}else {
152151
if (typeof self.default_direction === 'undefined' || self.default_direction === 'vertical') {
153152
return false;
154153
}
154+
this.responsive = false;
155155

156156
this.resize(self);
157157
}
@@ -174,22 +174,34 @@
174174
self.$element.addClass(self.classes.direction);
175175

176176
style[self.animateProperty] = self.distance;
177-
self.$panel.css(style);
177+
self.$panel.css(style).removeClass(self.classes.active);
178178

179-
if (typeof self.current !== 'undefined') {
179+
if (self.current.length >= 0 || self.current >= 0) {
180180
var index = self.current;
181-
self.current = null;
181+
self.current = self.current.length >= 0 ? [] : null;
182182
self.set(index);
183183
}
184184
}
185185
},
186186

187187
set: function(index) {
188+
if ($.isArray(index)) {
189+
for(var key in index) {
190+
this.set(index[key]);
191+
}
192+
return;
193+
}
194+
195+
if (index >= this.size || index < 0) {
196+
return;
197+
}
198+
188199
var self = this,
189200
$panel = this.$panel.eq(index),
190201
$oldPanel = this.$element.find('.' + this.classes.active),
191202
distance,
192203
duration,
204+
current = false,
193205
style = {},
194206
old_style = {};
195207

@@ -206,29 +218,44 @@
206218
}
207219
duration = Math.ceil(duration);
208220

209-
if (index === this.current) {
210-
this.current = null;
221+
if ($panel.hasClass(this.classes.active)) {
211222
distance = this.distance;
212223
$panel.removeClass(this.classes.active);
213-
}else {
214-
if (index >= this.size) {
215-
index = this.size - 1;
216-
}else if (index < 0) {
217-
index = 0;
218-
}
219224

225+
if (this.options.multiple) {
226+
var number;
227+
for (var key in this.current) {
228+
if (this.current[key] == index) {
229+
number = key;
230+
}else {
231+
continue;
232+
}
233+
this.current.splice(key, 1);
234+
}
235+
} else {
236+
this.current = null;
237+
}
238+
}else {
220239
if (this.options.direction === 'vertical') {
221240
distance = $panel.find('.' + this.namespace + '__expander').outerHeight() + this.distance;
222241
} else {
223242
distance = $panel.find('.' + this.namespace + '__expander').outerWidth() + this.distance;
224243
}
225244

226-
this.current = index;
245+
if (this.options.multiple && $.isArray(this.current)) {
246+
this.current.push(index);
247+
} else {
248+
this.current = index;
249+
}
227250

228-
old_style[this.animateProperty] = this.distance; // used to remove the original distance
229-
this.animate($oldPanel, old_style, duration, this.options.easing, moveEnd);
251+
if (this.options.multiple) {
252+
$panel.addClass(this.classes.active);
253+
} else {
254+
old_style[this.animateProperty] = this.distance; // used to remove the original distance
255+
this.animate($oldPanel, old_style, duration, this.options.easing, moveEnd);
230256

231-
$panel.addClass(this.classes.active).siblings().removeClass(this.classes.active);
257+
$panel.addClass(this.classes.active).siblings().removeClass(this.classes.active);
258+
}
232259
}
233260

234261
style[this.animateProperty] = distance;
@@ -336,7 +363,8 @@
336363
easing: 'ease-in-out',
337364
speed: 500,
338365
direction: 'vertical',
339-
event: 'click'
366+
event: 'click',
367+
multiple: false
340368
};
341369

342370
$.fn[pluginName] = function(options) {

‎dist/jquery-asAccordion.min.js

+2-2
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)