jquery_kwicks_rails 1.0.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 +7 -0
- data/.gitignore +3 -0
- data/CHANGELOG.md +3 -0
- data/MIT-LICENSE +20 -0
- data/README.md +164 -0
- data/jquery_kwicks_rails.gemspec +28 -0
- data/lib/jquery_kwicks_rails/engine.rb +4 -0
- data/lib/jquery_kwicks_rails/helper.rb +26 -0
- data/lib/jquery_kwicks_rails/version.rb +3 -0
- data/lib/jquery_kwicks_rails.rb +5 -0
- data/vendor/assets/javascripts/kwicks/index.js +4 -0
- data/vendor/assets/javascripts/kwicks/jquery.easing.1.3.js +205 -0
- data/vendor/assets/javascripts/kwicks/jquery.kwicks.js +570 -0
- data/vendor/assets/stylesheets/kwicks/index.css +5 -0
- data/vendor/assets/stylesheets/kwicks/jquery.kwicks.css +42 -0
- metadata +97 -0
checksums.yaml
ADDED
@@ -0,0 +1,7 @@
|
|
1
|
+
---
|
2
|
+
SHA1:
|
3
|
+
metadata.gz: 8fd23e562a03dcdd9c94ee5b0f873b88544213e1
|
4
|
+
data.tar.gz: d6ad753fb99570c75f1a8af96239b3020a118d0c
|
5
|
+
SHA512:
|
6
|
+
metadata.gz: c828c3e7dc01257ec6858fcdadac03d24dd1e2ccd8610c147c9424b964b71ee02b03d2b3cbdfbd45a9f6132b5251a26d5279baf2f0422a0d15aa1f2fa052daf3
|
7
|
+
data.tar.gz: ddaf9ebc82709b103670b9db87b066c30748b0e9bb57260ce9d661e3522e3f2507525c73fcde43f6d5c758a9668a4eef4264f0e12ddc765b920fec68f94e2ea0
|
data/.gitignore
ADDED
data/CHANGELOG.md
ADDED
data/MIT-LICENSE
ADDED
@@ -0,0 +1,20 @@
|
|
1
|
+
Copyright 2013 Guillermo Guerrero
|
2
|
+
|
3
|
+
Permission is hereby granted, free of charge, to any person obtaining
|
4
|
+
a copy of this software and associated documentation files (the
|
5
|
+
"Software"), to deal in the Software without restriction, including
|
6
|
+
without limitation the rights to use, copy, modify, merge, publish,
|
7
|
+
distribute, sublicense, and/or sell copies of the Software, and to
|
8
|
+
permit persons to whom the Software is furnished to do so, subject to
|
9
|
+
the following conditions:
|
10
|
+
|
11
|
+
The above copyright notice and this permission notice shall be
|
12
|
+
included in all copies or substantial portions of the Software.
|
13
|
+
|
14
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
|
15
|
+
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
|
16
|
+
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
|
17
|
+
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
|
18
|
+
LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
|
19
|
+
OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
|
20
|
+
WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
data/README.md
ADDED
@@ -0,0 +1,164 @@
|
|
1
|
+
# Kwicks for RubyOnRails
|
2
|
+
A *Rails* plugin for having <b>Sexy Sliding Panels</b> on your application.
|
3
|
+
|
4
|
+
## Installation
|
5
|
+
You can install this *gem* by
|
6
|
+
|
7
|
+
```
|
8
|
+
$ gem install jquery_kwicks_rails
|
9
|
+
```
|
10
|
+
|
11
|
+
Or bundle it on your app by adding this line at your *Gemfile*
|
12
|
+
|
13
|
+
```ruby
|
14
|
+
gem "jquery_kwicks_rails"
|
15
|
+
```
|
16
|
+
|
17
|
+
|
18
|
+
## Get Started
|
19
|
+
Add this to your *app/assets/javascripts/application.js* file
|
20
|
+
|
21
|
+
```
|
22
|
+
//= require kwicks
|
23
|
+
```
|
24
|
+
|
25
|
+
And this to your *app/assets/stylesheets/application.css* file
|
26
|
+
|
27
|
+
```
|
28
|
+
*= require kwicks
|
29
|
+
```
|
30
|
+
|
31
|
+
You're ready. All the *Kwicks* *JQuery* methods are available now.
|
32
|
+
See [here](http://devsmash.com/projects/kwicks) some usage examples.
|
33
|
+
|
34
|
+
## View Helpers
|
35
|
+
This *gem* adds some view helpers to your app so you can create the HTML that kwicks
|
36
|
+
expect with easy.
|
37
|
+
|
38
|
+
#### Horizontal panels
|
39
|
+
|
40
|
+
```rhtml
|
41
|
+
<%= kwicks do %>
|
42
|
+
<%= kwicks_panel %>
|
43
|
+
<%= kwicks_panel %>
|
44
|
+
<%= kwicks_panel %>
|
45
|
+
<% end %>
|
46
|
+
```
|
47
|
+
|
48
|
+
|
49
|
+
#### Horizontal panels with some content.
|
50
|
+
|
51
|
+
```rhtml
|
52
|
+
<%= kwicks do %>
|
53
|
+
<%= kwicks_panel do %>
|
54
|
+
<%= link_to image_tag('image01.png'), a_path %>
|
55
|
+
<% end %>
|
56
|
+
<%= kwicks_panel do %>
|
57
|
+
<%= link_to image_tag('image02.png'), b_path %>
|
58
|
+
<% end %>
|
59
|
+
<%= kwicks_panel do %>
|
60
|
+
<%= link_to image_tag('image03.png'), c_path %>
|
61
|
+
<% end %>
|
62
|
+
<% end %>
|
63
|
+
```
|
64
|
+
|
65
|
+
#### Vertical panels
|
66
|
+
|
67
|
+
```rhtml
|
68
|
+
<%= kwicks(orientation: 'vertical') do %>
|
69
|
+
<%= kwicks_panel %>
|
70
|
+
<%= kwicks_panel %>
|
71
|
+
<%= kwicks_panel %>
|
72
|
+
<% end %>
|
73
|
+
```
|
74
|
+
|
75
|
+
Or
|
76
|
+
|
77
|
+
```rhtml
|
78
|
+
<%= kwicks_vertical do %>
|
79
|
+
<%= kwicks_panel %>
|
80
|
+
<%= kwicks_panel %>
|
81
|
+
<%= kwicks_panel %>
|
82
|
+
<% end %>
|
83
|
+
```
|
84
|
+
|
85
|
+
|
86
|
+
#### Multidimensional kwicks!
|
87
|
+
|
88
|
+
```rhtml
|
89
|
+
<%= kwicks(id: "the_kwicks", class: "kwicks-rows", orientation: "vertical") do %>
|
90
|
+
<%= kwicks_panel do %>
|
91
|
+
<%= kwicks(class: "kwicks-columns") do %>
|
92
|
+
<%= kwicks_panel %>
|
93
|
+
<%= kwicks_panel %>
|
94
|
+
<%= kwicks_panel %>
|
95
|
+
<% end %>
|
96
|
+
<% end %>
|
97
|
+
<%= kwicks_panel do %>
|
98
|
+
<%= kwicks(class: "kwicks-columns") do %>
|
99
|
+
<%= kwicks_panel %>
|
100
|
+
<%= kwicks_panel %>
|
101
|
+
<%= kwicks_panel %>
|
102
|
+
<% end %>
|
103
|
+
<% end %>
|
104
|
+
<% end %>
|
105
|
+
```
|
106
|
+
|
107
|
+
Where *styling* should look like:
|
108
|
+
|
109
|
+
```scss
|
110
|
+
.kwicks-rows {
|
111
|
+
width: 910px;
|
112
|
+
height: 555px;
|
113
|
+
|
114
|
+
.kwicks-panel {
|
115
|
+
width: 100%;
|
116
|
+
|
117
|
+
/* overridden by kwicks but good for when JavaScript is disabled */
|
118
|
+
height: 275px;
|
119
|
+
margin-top: 5px;
|
120
|
+
}
|
121
|
+
}
|
122
|
+
|
123
|
+
.kwicks-columns {
|
124
|
+
width: 100%;
|
125
|
+
height: 100%;
|
126
|
+
|
127
|
+
.kwicks-panel {
|
128
|
+
height: 100%;
|
129
|
+
|
130
|
+
/* overridden by kwicks but good for when JavaScript is disabled */
|
131
|
+
width: 300px;
|
132
|
+
margin-left: 5px;
|
133
|
+
float: left;
|
134
|
+
|
135
|
+
background-color: #23a543;
|
136
|
+
}
|
137
|
+
}
|
138
|
+
```
|
139
|
+
|
140
|
+
And the *CoffeeScript* should look like:
|
141
|
+
|
142
|
+
```coffeescript
|
143
|
+
$(document).ready ->
|
144
|
+
$(".kwicks-rows").kwicks
|
145
|
+
maxSize: 400
|
146
|
+
behavior: 'menu'
|
147
|
+
spacing: 5
|
148
|
+
isVertical: true
|
149
|
+
$(".kwicks-columns").kwicks
|
150
|
+
maxSize: 600
|
151
|
+
behavior: 'menu'
|
152
|
+
spacing: 5
|
153
|
+
```
|
154
|
+
|
155
|
+
|
156
|
+
## The *Easing* Plugin
|
157
|
+
Go to [JQuery Easing site](http://gsgd.co.uk/sandbox/jquery/easing/) for more info about easing plugin.
|
158
|
+
|
159
|
+
## The *Kwicks* Project
|
160
|
+
Go to [Kwicks project site](http://devsmash.com/projects/kwicks) for more info and examples.
|
161
|
+
Navigate [GitHub Kwicks Project](https://github.com/jmar777/kwicks) for source code.
|
162
|
+
|
163
|
+
## License
|
164
|
+
This project uses [*MIT-LICENSE*](http://en.wikipedia.org/wiki/MIT_License).
|
@@ -0,0 +1,28 @@
|
|
1
|
+
$:.push File.expand_path("../lib", __FILE__)
|
2
|
+
|
3
|
+
# Maintain your gem's version:
|
4
|
+
require "jquery_kwicks_rails/version"
|
5
|
+
|
6
|
+
# Describe your gem and declare its dependencies:
|
7
|
+
Gem::Specification.new do |s|
|
8
|
+
s.name = "jquery_kwicks_rails"
|
9
|
+
s.version = JqueryKwicksRails::VERSION
|
10
|
+
s.authors = ["Guillermo Guerrero"]
|
11
|
+
s.email = ["g.guerrero.bus@gmail.com"]
|
12
|
+
s.homepage = "https://github.com/gguerrero/jquery_kwicks_rails"
|
13
|
+
s.license = 'MIT'
|
14
|
+
s.summary = "JQuery Sexy Sliding Panels for Rails apps"
|
15
|
+
s.description = %(The JQuery Sexy Sliding Panels for Rails
|
16
|
+
applications).strip.gsub(/\s{2,}/, ' ')
|
17
|
+
|
18
|
+
s.files = `git ls-files`.split("\n")
|
19
|
+
s.test_files = Dir["test/**/*"]
|
20
|
+
|
21
|
+
s.has_rdoc = true
|
22
|
+
s.extra_rdoc_files = %w[ README.md MIT-LICENSE ]
|
23
|
+
s.rdoc_options += %w[ --title "JQuery Sexy Sliding Panels for Rails"
|
24
|
+
--inline-source ]
|
25
|
+
|
26
|
+
s.add_dependency "rails", ">= 3.1"
|
27
|
+
s.add_dependency "jquery-rails", ">= 2.0.2"
|
28
|
+
end
|
@@ -0,0 +1,26 @@
|
|
1
|
+
module JqueryKwicksRails
|
2
|
+
module ViewHelpers
|
3
|
+
def kwicks(opts = {})
|
4
|
+
orientation = opts.delete(:orientation)
|
5
|
+
orientation = (orientation == "vertical") ? "vertical" : "horizontal"
|
6
|
+
|
7
|
+
opts[:class] = "#{opts[:class]} kwicks kwicks-#{orientation}".strip
|
8
|
+
content_tag(:ul, opts) { yield }
|
9
|
+
end
|
10
|
+
|
11
|
+
def kwicks_horizontal(opts = {}, &block)
|
12
|
+
kwicks(opts.merge(orientation: "horizontal"), &block)
|
13
|
+
end
|
14
|
+
|
15
|
+
def kwicks_vertical(opts = {}, &block)
|
16
|
+
kwicks(opts.merge(orientation: "vertical"), &block)
|
17
|
+
end
|
18
|
+
|
19
|
+
def kwicks_panel(opts = {})
|
20
|
+
opts[:class] = "#{opts[:class]} kwicks-panel".strip
|
21
|
+
|
22
|
+
(block_given?) ? content_tag(:li, opts) {yield}
|
23
|
+
: content_tag(:li, nil, opts)
|
24
|
+
end
|
25
|
+
end
|
26
|
+
end
|
@@ -0,0 +1,205 @@
|
|
1
|
+
/*
|
2
|
+
* jQuery Easing v1.3 - http://gsgd.co.uk/sandbox/jquery/easing/
|
3
|
+
*
|
4
|
+
* Uses the built in easing capabilities added In jQuery 1.1
|
5
|
+
* to offer multiple easing options
|
6
|
+
*
|
7
|
+
* TERMS OF USE - jQuery Easing
|
8
|
+
*
|
9
|
+
* Open source under the BSD License.
|
10
|
+
*
|
11
|
+
* Copyright © 2008 George McGinley Smith
|
12
|
+
* All rights reserved.
|
13
|
+
*
|
14
|
+
* Redistribution and use in source and binary forms, with or without modification,
|
15
|
+
* are permitted provided that the following conditions are met:
|
16
|
+
*
|
17
|
+
* Redistributions of source code must retain the above copyright notice, this list of
|
18
|
+
* conditions and the following disclaimer.
|
19
|
+
* Redistributions in binary form must reproduce the above copyright notice, this list
|
20
|
+
* of conditions and the following disclaimer in the documentation and/or other materials
|
21
|
+
* provided with the distribution.
|
22
|
+
*
|
23
|
+
* Neither the name of the author nor the names of contributors may be used to endorse
|
24
|
+
* or promote products derived from this software without specific prior written permission.
|
25
|
+
*
|
26
|
+
* THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY
|
27
|
+
* EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF
|
28
|
+
* MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE
|
29
|
+
* COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL,
|
30
|
+
* EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE
|
31
|
+
* GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED
|
32
|
+
* AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
|
33
|
+
* NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED
|
34
|
+
* OF THE POSSIBILITY OF SUCH DAMAGE.
|
35
|
+
*
|
36
|
+
*/
|
37
|
+
|
38
|
+
// t: current time, b: begInnIng value, c: change In value, d: duration
|
39
|
+
jQuery.easing['jswing'] = jQuery.easing['swing'];
|
40
|
+
|
41
|
+
jQuery.extend( jQuery.easing,
|
42
|
+
{
|
43
|
+
def: 'easeOutQuad',
|
44
|
+
swing: function (x, t, b, c, d) {
|
45
|
+
//alert(jQuery.easing.default);
|
46
|
+
return jQuery.easing[jQuery.easing.def](x, t, b, c, d);
|
47
|
+
},
|
48
|
+
easeInQuad: function (x, t, b, c, d) {
|
49
|
+
return c*(t/=d)*t + b;
|
50
|
+
},
|
51
|
+
easeOutQuad: function (x, t, b, c, d) {
|
52
|
+
return -c *(t/=d)*(t-2) + b;
|
53
|
+
},
|
54
|
+
easeInOutQuad: function (x, t, b, c, d) {
|
55
|
+
if ((t/=d/2) < 1) return c/2*t*t + b;
|
56
|
+
return -c/2 * ((--t)*(t-2) - 1) + b;
|
57
|
+
},
|
58
|
+
easeInCubic: function (x, t, b, c, d) {
|
59
|
+
return c*(t/=d)*t*t + b;
|
60
|
+
},
|
61
|
+
easeOutCubic: function (x, t, b, c, d) {
|
62
|
+
return c*((t=t/d-1)*t*t + 1) + b;
|
63
|
+
},
|
64
|
+
easeInOutCubic: function (x, t, b, c, d) {
|
65
|
+
if ((t/=d/2) < 1) return c/2*t*t*t + b;
|
66
|
+
return c/2*((t-=2)*t*t + 2) + b;
|
67
|
+
},
|
68
|
+
easeInQuart: function (x, t, b, c, d) {
|
69
|
+
return c*(t/=d)*t*t*t + b;
|
70
|
+
},
|
71
|
+
easeOutQuart: function (x, t, b, c, d) {
|
72
|
+
return -c * ((t=t/d-1)*t*t*t - 1) + b;
|
73
|
+
},
|
74
|
+
easeInOutQuart: function (x, t, b, c, d) {
|
75
|
+
if ((t/=d/2) < 1) return c/2*t*t*t*t + b;
|
76
|
+
return -c/2 * ((t-=2)*t*t*t - 2) + b;
|
77
|
+
},
|
78
|
+
easeInQuint: function (x, t, b, c, d) {
|
79
|
+
return c*(t/=d)*t*t*t*t + b;
|
80
|
+
},
|
81
|
+
easeOutQuint: function (x, t, b, c, d) {
|
82
|
+
return c*((t=t/d-1)*t*t*t*t + 1) + b;
|
83
|
+
},
|
84
|
+
easeInOutQuint: function (x, t, b, c, d) {
|
85
|
+
if ((t/=d/2) < 1) return c/2*t*t*t*t*t + b;
|
86
|
+
return c/2*((t-=2)*t*t*t*t + 2) + b;
|
87
|
+
},
|
88
|
+
easeInSine: function (x, t, b, c, d) {
|
89
|
+
return -c * Math.cos(t/d * (Math.PI/2)) + c + b;
|
90
|
+
},
|
91
|
+
easeOutSine: function (x, t, b, c, d) {
|
92
|
+
return c * Math.sin(t/d * (Math.PI/2)) + b;
|
93
|
+
},
|
94
|
+
easeInOutSine: function (x, t, b, c, d) {
|
95
|
+
return -c/2 * (Math.cos(Math.PI*t/d) - 1) + b;
|
96
|
+
},
|
97
|
+
easeInExpo: function (x, t, b, c, d) {
|
98
|
+
return (t==0) ? b : c * Math.pow(2, 10 * (t/d - 1)) + b;
|
99
|
+
},
|
100
|
+
easeOutExpo: function (x, t, b, c, d) {
|
101
|
+
return (t==d) ? b+c : c * (-Math.pow(2, -10 * t/d) + 1) + b;
|
102
|
+
},
|
103
|
+
easeInOutExpo: function (x, t, b, c, d) {
|
104
|
+
if (t==0) return b;
|
105
|
+
if (t==d) return b+c;
|
106
|
+
if ((t/=d/2) < 1) return c/2 * Math.pow(2, 10 * (t - 1)) + b;
|
107
|
+
return c/2 * (-Math.pow(2, -10 * --t) + 2) + b;
|
108
|
+
},
|
109
|
+
easeInCirc: function (x, t, b, c, d) {
|
110
|
+
return -c * (Math.sqrt(1 - (t/=d)*t) - 1) + b;
|
111
|
+
},
|
112
|
+
easeOutCirc: function (x, t, b, c, d) {
|
113
|
+
return c * Math.sqrt(1 - (t=t/d-1)*t) + b;
|
114
|
+
},
|
115
|
+
easeInOutCirc: function (x, t, b, c, d) {
|
116
|
+
if ((t/=d/2) < 1) return -c/2 * (Math.sqrt(1 - t*t) - 1) + b;
|
117
|
+
return c/2 * (Math.sqrt(1 - (t-=2)*t) + 1) + b;
|
118
|
+
},
|
119
|
+
easeInElastic: function (x, t, b, c, d) {
|
120
|
+
var s=1.70158;var p=0;var a=c;
|
121
|
+
if (t==0) return b; if ((t/=d)==1) return b+c; if (!p) p=d*.3;
|
122
|
+
if (a < Math.abs(c)) { a=c; var s=p/4; }
|
123
|
+
else var s = p/(2*Math.PI) * Math.asin (c/a);
|
124
|
+
return -(a*Math.pow(2,10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )) + b;
|
125
|
+
},
|
126
|
+
easeOutElastic: function (x, t, b, c, d) {
|
127
|
+
var s=1.70158;var p=0;var a=c;
|
128
|
+
if (t==0) return b; if ((t/=d)==1) return b+c; if (!p) p=d*.3;
|
129
|
+
if (a < Math.abs(c)) { a=c; var s=p/4; }
|
130
|
+
else var s = p/(2*Math.PI) * Math.asin (c/a);
|
131
|
+
return a*Math.pow(2,-10*t) * Math.sin( (t*d-s)*(2*Math.PI)/p ) + c + b;
|
132
|
+
},
|
133
|
+
easeInOutElastic: function (x, t, b, c, d) {
|
134
|
+
var s=1.70158;var p=0;var a=c;
|
135
|
+
if (t==0) return b; if ((t/=d/2)==2) return b+c; if (!p) p=d*(.3*1.5);
|
136
|
+
if (a < Math.abs(c)) { a=c; var s=p/4; }
|
137
|
+
else var s = p/(2*Math.PI) * Math.asin (c/a);
|
138
|
+
if (t < 1) return -.5*(a*Math.pow(2,10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )) + b;
|
139
|
+
return a*Math.pow(2,-10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )*.5 + c + b;
|
140
|
+
},
|
141
|
+
easeInBack: function (x, t, b, c, d, s) {
|
142
|
+
if (s == undefined) s = 1.70158;
|
143
|
+
return c*(t/=d)*t*((s+1)*t - s) + b;
|
144
|
+
},
|
145
|
+
easeOutBack: function (x, t, b, c, d, s) {
|
146
|
+
if (s == undefined) s = 1.70158;
|
147
|
+
return c*((t=t/d-1)*t*((s+1)*t + s) + 1) + b;
|
148
|
+
},
|
149
|
+
easeInOutBack: function (x, t, b, c, d, s) {
|
150
|
+
if (s == undefined) s = 1.70158;
|
151
|
+
if ((t/=d/2) < 1) return c/2*(t*t*(((s*=(1.525))+1)*t - s)) + b;
|
152
|
+
return c/2*((t-=2)*t*(((s*=(1.525))+1)*t + s) + 2) + b;
|
153
|
+
},
|
154
|
+
easeInBounce: function (x, t, b, c, d) {
|
155
|
+
return c - jQuery.easing.easeOutBounce (x, d-t, 0, c, d) + b;
|
156
|
+
},
|
157
|
+
easeOutBounce: function (x, t, b, c, d) {
|
158
|
+
if ((t/=d) < (1/2.75)) {
|
159
|
+
return c*(7.5625*t*t) + b;
|
160
|
+
} else if (t < (2/2.75)) {
|
161
|
+
return c*(7.5625*(t-=(1.5/2.75))*t + .75) + b;
|
162
|
+
} else if (t < (2.5/2.75)) {
|
163
|
+
return c*(7.5625*(t-=(2.25/2.75))*t + .9375) + b;
|
164
|
+
} else {
|
165
|
+
return c*(7.5625*(t-=(2.625/2.75))*t + .984375) + b;
|
166
|
+
}
|
167
|
+
},
|
168
|
+
easeInOutBounce: function (x, t, b, c, d) {
|
169
|
+
if (t < d/2) return jQuery.easing.easeInBounce (x, t*2, 0, c, d) * .5 + b;
|
170
|
+
return jQuery.easing.easeOutBounce (x, t*2-d, 0, c, d) * .5 + c*.5 + b;
|
171
|
+
}
|
172
|
+
});
|
173
|
+
|
174
|
+
/*
|
175
|
+
*
|
176
|
+
* TERMS OF USE - EASING EQUATIONS
|
177
|
+
*
|
178
|
+
* Open source under the BSD License.
|
179
|
+
*
|
180
|
+
* Copyright © 2001 Robert Penner
|
181
|
+
* All rights reserved.
|
182
|
+
*
|
183
|
+
* Redistribution and use in source and binary forms, with or without modification,
|
184
|
+
* are permitted provided that the following conditions are met:
|
185
|
+
*
|
186
|
+
* Redistributions of source code must retain the above copyright notice, this list of
|
187
|
+
* conditions and the following disclaimer.
|
188
|
+
* Redistributions in binary form must reproduce the above copyright notice, this list
|
189
|
+
* of conditions and the following disclaimer in the documentation and/or other materials
|
190
|
+
* provided with the distribution.
|
191
|
+
*
|
192
|
+
* Neither the name of the author nor the names of contributors may be used to endorse
|
193
|
+
* or promote products derived from this software without specific prior written permission.
|
194
|
+
*
|
195
|
+
* THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY
|
196
|
+
* EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF
|
197
|
+
* MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE
|
198
|
+
* COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL,
|
199
|
+
* EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE
|
200
|
+
* GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED
|
201
|
+
* AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
|
202
|
+
* NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED
|
203
|
+
* OF THE POSSIBILITY OF SUCH DAMAGE.
|
204
|
+
*
|
205
|
+
*/
|
@@ -0,0 +1,570 @@
|
|
1
|
+
/*!
|
2
|
+
* Kwicks: Sexy Sliding Panels for jQuery - v2.1.0
|
3
|
+
* http://devsmash.com/projects/kwicks
|
4
|
+
*
|
5
|
+
* Copyright 2013 Jeremy Martin (jmar777)
|
6
|
+
* Contributors: Duke Speer (Duke3D), Guillermo Guerrero (gguerrero)
|
7
|
+
* Released under the MIT license
|
8
|
+
* http://www.opensource.org/licenses/mit-license.php
|
9
|
+
*/
|
10
|
+
|
11
|
+
(function($) {
|
12
|
+
|
13
|
+
/**
|
14
|
+
* API methods for the plugin
|
15
|
+
*/
|
16
|
+
var methods = {
|
17
|
+
init: function(opts) {
|
18
|
+
var defaults = {
|
19
|
+
maxSize: -1,
|
20
|
+
minSize: -1,
|
21
|
+
spacing: 5,
|
22
|
+
duration: 500,
|
23
|
+
isVertical: false,
|
24
|
+
easing: undefined,
|
25
|
+
behavior: null,
|
26
|
+
autoResize: true,
|
27
|
+
showSpeed: undefined
|
28
|
+
};
|
29
|
+
var o = $.extend(defaults, opts);
|
30
|
+
|
31
|
+
// validate and normalize options
|
32
|
+
if (o.minSize !== -1 && o.maxSize !== -1)
|
33
|
+
throw new Error('Kwicks options minSize and maxSize may not both be set');
|
34
|
+
if (o.behavior && o.behavior !== 'menu' && o.behavior !== 'slideshow')
|
35
|
+
throw new Error('Unrecognized Kwicks behavior specified: ' + o.behavior);
|
36
|
+
$.each(['minSize', 'maxSize'], function(i, prop) {
|
37
|
+
var val = o[prop];
|
38
|
+
switch (typeof val) {
|
39
|
+
case 'number':
|
40
|
+
o[prop + 'Units'] = 'px';
|
41
|
+
break;
|
42
|
+
case 'string':
|
43
|
+
if (val.slice(-1) === '%') {
|
44
|
+
o[prop + 'Units'] = '%';
|
45
|
+
o[prop] = +val.slice(0, -1) / 100;
|
46
|
+
} else if (val.slice(-2) === 'px') {
|
47
|
+
o[prop + 'Units'] = 'px';
|
48
|
+
o[prop] = +val.slice(0, -2);
|
49
|
+
} else {
|
50
|
+
throw new Error('Invalid value for Kwicks option ' + prop + ': ' + val);
|
51
|
+
}
|
52
|
+
break;
|
53
|
+
default:
|
54
|
+
throw new Error('Invalid value for Kwicks option ' + prop + ': ' + val);
|
55
|
+
}
|
56
|
+
});
|
57
|
+
|
58
|
+
return this.each(function() {
|
59
|
+
$(this).data('kwicks', new Kwick(this, o));
|
60
|
+
});
|
61
|
+
},
|
62
|
+
expand: function(index) {
|
63
|
+
return this.each(function() {
|
64
|
+
var $this = $(this),
|
65
|
+
$panel;
|
66
|
+
|
67
|
+
// if this is a container, then we require a panel index
|
68
|
+
if ($this.is('.kwicks-processed')) {
|
69
|
+
if (typeof index !== 'number')
|
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();
|
79
|
+
}
|
80
|
+
// if it's not a container or a panel, then this was an erroneous method call
|
81
|
+
else {
|
82
|
+
throw new Error('Cannot call "expand" method on a non-Kwicks element');
|
83
|
+
}
|
84
|
+
|
85
|
+
// try to trigger on panel, but default to container if panel doesn't exist
|
86
|
+
var $target = ($panel && $panel.length) ? $panel : $this;
|
87
|
+
$target.trigger('expand.kwicks', { index: index });
|
88
|
+
});
|
89
|
+
},
|
90
|
+
expanded: function() {
|
91
|
+
var kwick = this.first().data('kwicks');
|
92
|
+
if (!kwick) throw new Error('Cannot called "expanded" method on a non-Kwicks element');
|
93
|
+
return kwick.expandedIndex;
|
94
|
+
},
|
95
|
+
select: function(index) {
|
96
|
+
return this.each(function() {
|
97
|
+
var $this = $(this),
|
98
|
+
$panel;
|
99
|
+
|
100
|
+
// if this is a container, then we require a panel index
|
101
|
+
if ($this.is('.kwicks-processed')) {
|
102
|
+
if (typeof index !== 'number')
|
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);
|
106
|
+
}
|
107
|
+
// otherwise `this` should be a panel already
|
108
|
+
else if ($this.parent().is('.kwicks-processed')) {
|
109
|
+
// don't need panel in this scenario
|
110
|
+
$panel = $this;
|
111
|
+
index = $panel.index();
|
112
|
+
}
|
113
|
+
// if it's not a container or a panel, then this was an erroneous method call
|
114
|
+
else {
|
115
|
+
throw new Error('Cannot call "expand" method on a non-Kwicks element');
|
116
|
+
}
|
117
|
+
|
118
|
+
// try to trigger on panel, but default to container if panel doesn't exist
|
119
|
+
var $target = ($panel && $panel.length) ? $panel : $this;
|
120
|
+
$target.trigger('select.kwicks', { index: index });
|
121
|
+
});
|
122
|
+
},
|
123
|
+
selected: function() {
|
124
|
+
var kwick = this.first().data('kwicks');
|
125
|
+
if (!kwick) throw new Error('Cannot called "selected" method on a non-Kwicks element');
|
126
|
+
return kwick.selectedIndex;
|
127
|
+
},
|
128
|
+
resize: function(index) {
|
129
|
+
return this.each(function() {
|
130
|
+
var $this = $(this),
|
131
|
+
kwick = $this.data('kwicks');
|
132
|
+
|
133
|
+
if (!kwick) {
|
134
|
+
throw new Error('Cannot called "resize" method on a non-Kwicks element');
|
135
|
+
}
|
136
|
+
|
137
|
+
kwick.resize();
|
138
|
+
});
|
139
|
+
}
|
140
|
+
};
|
141
|
+
|
142
|
+
/**
|
143
|
+
* Expose the actual plugin
|
144
|
+
*/
|
145
|
+
$.fn.kwicks = function(opts) {
|
146
|
+
if (methods[opts]) {
|
147
|
+
return methods[opts].apply(this, Array.prototype.slice.call(arguments, 1));
|
148
|
+
} else if (typeof opts === 'object' || !opts) {
|
149
|
+
return methods.init.apply(this, arguments);
|
150
|
+
} else {
|
151
|
+
throw new Error('Unrecognized kwicks method: ' + opts);
|
152
|
+
}
|
153
|
+
};
|
154
|
+
|
155
|
+
/**
|
156
|
+
* Special event for triggering default behavior on 'expand.kwicks' events
|
157
|
+
*/
|
158
|
+
$.event.special.expand = {
|
159
|
+
_default: function(e, data) {
|
160
|
+
if (e.namespace !== 'kwicks') return;
|
161
|
+
var $el = $(e.target);
|
162
|
+
var kwick = $el.data('kwicks') || $el.parent().data('kwicks');
|
163
|
+
// should we throw here?
|
164
|
+
if (!kwick) return;
|
165
|
+
kwick.expand(data.index);
|
166
|
+
}
|
167
|
+
};
|
168
|
+
|
169
|
+
/**
|
170
|
+
* Special event for triggering default behavior on 'select.kwicks' events
|
171
|
+
*/
|
172
|
+
$.event.special.select = {
|
173
|
+
_default: function(e, data) {
|
174
|
+
if (e.namespace !== 'kwicks') return;
|
175
|
+
var $el = $(e.target);
|
176
|
+
var kwick = $el.data('kwicks') || $el.parent().data('kwicks');
|
177
|
+
// should we throw here?
|
178
|
+
if (!kwick) return;
|
179
|
+
kwick.select(data.index);
|
180
|
+
}
|
181
|
+
};
|
182
|
+
|
183
|
+
/**
|
184
|
+
* Instantiates a new Kwick instance using the provided container and options.
|
185
|
+
*/
|
186
|
+
var Kwick = function Kwick(container, opts) {
|
187
|
+
this.opts = opts;
|
188
|
+
|
189
|
+
// references to our DOM elements
|
190
|
+
var orientation = opts.isVertical ? 'vertical' : 'horizontal';
|
191
|
+
this.$container = $(container).addClass('kwicks').addClass('kwicks-' + orientation);
|
192
|
+
this.$panels = this.$container.children();
|
193
|
+
|
194
|
+
// zero-based, -1 for "none"
|
195
|
+
this.selectedIndex = this.$panels.filter('.kwicks-selected').index();
|
196
|
+
this.expandedIndex = this.selectedIndex;
|
197
|
+
|
198
|
+
// each instance has a primary and a secondary dimension (primary is the animated dimension)
|
199
|
+
this.primaryDimension = opts.isVertical ? 'height' : 'width';
|
200
|
+
this.secondaryDimension = opts.isVertical ? 'width' : 'height';
|
201
|
+
|
202
|
+
// initialize panel sizes
|
203
|
+
this.calculatePanelSizes();
|
204
|
+
|
205
|
+
// likewise, we have primary and secondary alignments (all panels but the last use primary,
|
206
|
+
// which uses the secondary alignment). this is to allow the first and last panels to have
|
207
|
+
// fixed offsets. this reduces jittering, which is much more noticeable on the last item.
|
208
|
+
this.primaryAlignment = opts.isVertical ? 'top' : 'left';
|
209
|
+
this.secondaryAlignment = opts.isVertical ? 'bottom' : 'right';
|
210
|
+
|
211
|
+
// object for creating a "master" animation loop for all panel animations
|
212
|
+
this.$timer = $({ progress : 0 });
|
213
|
+
|
214
|
+
// the current offsets for each panel
|
215
|
+
this.offsets = this.getOffsetsForExpanded();
|
216
|
+
|
217
|
+
this.initStyles();
|
218
|
+
this.initBehavior();
|
219
|
+
this.initWindowResizeHandler();
|
220
|
+
this.initSlideShow();
|
221
|
+
};
|
222
|
+
|
223
|
+
/**
|
224
|
+
* Calculates size, minSize, and maxSize based on the current size of the container and the
|
225
|
+
* user-provided options. The results will be stored on this.panelSize, this.panelMinSize, and
|
226
|
+
* this.panelMaxSize. This should be run on initialization and whenever the container's
|
227
|
+
* primary dimension may have changed in size.
|
228
|
+
*/
|
229
|
+
Kwick.prototype.calculatePanelSizes = function() {
|
230
|
+
var opts = this.opts,
|
231
|
+
numPanels = this.$panels.length,
|
232
|
+
containerSize = this.getContainerSize(true),
|
233
|
+
sumSpacing = opts.spacing * (numPanels - 1),
|
234
|
+
sumPanelSize = containerSize - sumSpacing;
|
235
|
+
|
236
|
+
this.panelSize = sumPanelSize / numPanels;
|
237
|
+
|
238
|
+
if (opts.minSize === -1) {
|
239
|
+
if (opts.maxSize === -1) {
|
240
|
+
// if neither minSize or maxSize or set, then we try to pick a sensible default
|
241
|
+
if (numPanels < 5) {
|
242
|
+
this.panelMaxSize = containerSize / 3 * 2;
|
243
|
+
} else {
|
244
|
+
this.panelMaxSize = containerSize / 3;
|
245
|
+
}
|
246
|
+
} else if (opts.maxSizeUnits === '%') {
|
247
|
+
this.panelMaxSize = sumPanelSize * opts.maxSize;
|
248
|
+
} else {
|
249
|
+
this.panelMaxSize = opts.maxSize;
|
250
|
+
}
|
251
|
+
|
252
|
+
// at this point we know that this.panelMaxSize is set
|
253
|
+
this.panelMinSize = (sumPanelSize - this.panelMaxSize) / (numPanels - 1);
|
254
|
+
} else if (opts.maxSize === -1) {
|
255
|
+
// at this point we know that opts.minSize is set
|
256
|
+
if (opts.minSizeUnits === '%') {
|
257
|
+
this.panelMinSize = sumPanelSize * opts.minSize;
|
258
|
+
} else {
|
259
|
+
this.panelMinSize = opts.minSize;
|
260
|
+
}
|
261
|
+
|
262
|
+
// at this point we know that this.panelMinSize is set
|
263
|
+
this.panelMaxSize = sumPanelSize - (this.panelMinSize * (numPanels - 1));
|
264
|
+
}
|
265
|
+
};
|
266
|
+
|
267
|
+
/**
|
268
|
+
* Returns the calculated panel offsets based on the currently expanded panel.
|
269
|
+
*/
|
270
|
+
Kwick.prototype.getOffsetsForExpanded = function() {
|
271
|
+
// todo: cache the offset values
|
272
|
+
var expandedIndex = this.expandedIndex,
|
273
|
+
numPanels = this.$panels.length,
|
274
|
+
spacing = this.opts.spacing,
|
275
|
+
size = this.panelSize,
|
276
|
+
minSize = this.panelMinSize,
|
277
|
+
maxSize = this.panelMaxSize;
|
278
|
+
|
279
|
+
//first panel is always offset by 0
|
280
|
+
var offsets = [0];
|
281
|
+
|
282
|
+
for (var i = 1; i < numPanels; i++) {
|
283
|
+
// no panel is expanded
|
284
|
+
if (expandedIndex === -1) {
|
285
|
+
offsets[i] = i * (size + spacing);
|
286
|
+
}
|
287
|
+
// this panel is before or is the expanded panel
|
288
|
+
else if (i <= expandedIndex) {
|
289
|
+
offsets[i] = i * (minSize + spacing);
|
290
|
+
}
|
291
|
+
// this panel is after the expanded panel
|
292
|
+
else {
|
293
|
+
offsets[i] = maxSize + (minSize * (i - 1)) + (i * spacing);
|
294
|
+
}
|
295
|
+
}
|
296
|
+
|
297
|
+
return offsets;
|
298
|
+
};
|
299
|
+
|
300
|
+
/**
|
301
|
+
* Sets the style attribute on the specified element using the provided value. This probably
|
302
|
+
* doesn't belong on Kwick.prototype, but here it is...
|
303
|
+
*/
|
304
|
+
Kwick.prototype.setStyle = (function() {
|
305
|
+
if ($.support.style) {
|
306
|
+
return function(el, style) { el.setAttribute('style', style); };
|
307
|
+
} else {
|
308
|
+
return function (el, style) { el.style.cssText = style; };
|
309
|
+
}
|
310
|
+
})();
|
311
|
+
|
312
|
+
/**
|
313
|
+
* Updates the offset and size styling of each panel based on the current values in
|
314
|
+
* `this.offsets`. Also does some special handling to convert panels to absolute positioning
|
315
|
+
* the first time this is invoked.
|
316
|
+
*/
|
317
|
+
Kwick.prototype.updatePanelStyles = function() {
|
318
|
+
var offsets = this.offsets,
|
319
|
+
$panels = this.$panels,
|
320
|
+
pDim = this.primaryDimension,
|
321
|
+
pAlign = this.primaryAlignment,
|
322
|
+
sAlign = this.secondaryAlignment,
|
323
|
+
spacing = this.opts.spacing,
|
324
|
+
containerSize = this.getContainerSize();
|
325
|
+
|
326
|
+
// the kwicks-processed class ensures that panels are absolutely positioned, but on our
|
327
|
+
// first pass we need to set offsets, width|length, and positioning atomically to prevent
|
328
|
+
// mid-update repaints
|
329
|
+
var stylePrefix = !!this._stylesInited ? '' : 'position:absolute;',
|
330
|
+
offset, size, prevOffset, style;
|
331
|
+
|
332
|
+
// loop through remaining panels
|
333
|
+
for (var i = $panels.length; i--;) {
|
334
|
+
prevOffset = offset;
|
335
|
+
// todo: maybe we do one last pass at the end and round offsets, rather than on every
|
336
|
+
// update
|
337
|
+
offset = Math.round(offsets[i]);
|
338
|
+
if (i === $panels.length - 1) {
|
339
|
+
size = containerSize - offset;
|
340
|
+
style = sAlign + ':0;' + pDim + ':' + size + 'px;';
|
341
|
+
} else {
|
342
|
+
size = prevOffset - offset - spacing;
|
343
|
+
style = pAlign + ':' + offset + 'px;' + pDim + ':' + size + 'px;';
|
344
|
+
}
|
345
|
+
this.setStyle($panels[i], stylePrefix + style);
|
346
|
+
}
|
347
|
+
|
348
|
+
if (!this._stylesInited) {
|
349
|
+
this.$container.addClass('kwicks-processed');
|
350
|
+
this._stylesInited = true;
|
351
|
+
}
|
352
|
+
};
|
353
|
+
|
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
|
+
/**
|
369
|
+
* Assuming for a moment that out-of-the-box behaviors aren't a horrible idea, this method
|
370
|
+
* encapsulates the initialization logic thereof.
|
371
|
+
*/
|
372
|
+
Kwick.prototype.initBehavior = function() {
|
373
|
+
if (!this.opts.behavior) return;
|
374
|
+
|
375
|
+
var $container = this.$container;
|
376
|
+
switch (this.opts.behavior) {
|
377
|
+
case 'menu':
|
378
|
+
this.$container.on('mouseleave', function() {
|
379
|
+
$container.kwicks('expand', -1);
|
380
|
+
}).children().on('mouseover', function() {
|
381
|
+
$(this).kwicks('expand');
|
382
|
+
}).click(function() {
|
383
|
+
$(this).kwicks('select');
|
384
|
+
});
|
385
|
+
break;
|
386
|
+
case 'slideshow':
|
387
|
+
this.$panels.click(function(){
|
388
|
+
$(this).kwicks('select');
|
389
|
+
});
|
390
|
+
break;
|
391
|
+
default:
|
392
|
+
throw new Error('Unrecognized behavior option: ' + this.opts.behavior);
|
393
|
+
}
|
394
|
+
};
|
395
|
+
|
396
|
+
/**
|
397
|
+
* Sets up a throttled window resize handler that triggers resize logic for the panels
|
398
|
+
* todo: hideous code, needs refactor for the eye bleeds
|
399
|
+
*/
|
400
|
+
Kwick.prototype.initWindowResizeHandler = function() {
|
401
|
+
if (!this.opts.autoResize) return;
|
402
|
+
|
403
|
+
var self = this,
|
404
|
+
prevTime = 0,
|
405
|
+
execScheduled = false;
|
406
|
+
|
407
|
+
var onResize = function(e) {
|
408
|
+
// if there's no event, then this is a scheduled from our setTimeout
|
409
|
+
if (!e) { execScheduled = false; }
|
410
|
+
|
411
|
+
// if we've already run in the last 20ms, then delay execution
|
412
|
+
var now = +new Date();
|
413
|
+
if (now - prevTime < 20) {
|
414
|
+
// if we already scheduled a run, don't do it again
|
415
|
+
if (execScheduled) return;
|
416
|
+
setTimeout(onResize, 20 - (now - prevTime));
|
417
|
+
execScheduled = true;
|
418
|
+
return;
|
419
|
+
}
|
420
|
+
|
421
|
+
// throttle rate is satisfied, go ahead and run
|
422
|
+
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
|
+
}
|
436
|
+
|
437
|
+
var self = this,
|
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);
|
446
|
+
};
|
447
|
+
|
448
|
+
/**
|
449
|
+
* Returns the size in pixels of the container's primary dimension. This value is cached as it
|
450
|
+
* is used repeatedly during animation loops, but the cache can be cleared by passing `true`.
|
451
|
+
* todo: benchmark to see if this caching business is even at all necessary.
|
452
|
+
*/
|
453
|
+
Kwick.prototype.getContainerSize = function(clearCache) {
|
454
|
+
var containerSize = this._containerSize;
|
455
|
+
if (clearCache || !containerSize) {
|
456
|
+
containerSize = this._containerSize = this.$container[this.primaryDimension]();
|
457
|
+
}
|
458
|
+
return containerSize;
|
459
|
+
};
|
460
|
+
|
461
|
+
/**
|
462
|
+
* Gets a reference to the currently expanded panel (if there is one)
|
463
|
+
*/
|
464
|
+
Kwick.prototype.getExpandedPanel = function() {
|
465
|
+
return this.expandedIndex === -1 ? $([]) : this.$panels.eq(this.expandedIndex);
|
466
|
+
};
|
467
|
+
|
468
|
+
/**
|
469
|
+
* Gets a reference to the currently collapsed panels (if there is any)
|
470
|
+
*/
|
471
|
+
Kwick.prototype.getCollapsedPanels = function() {
|
472
|
+
return this.expandedIndex === -1 ? $([]) : this.$panels.not(this.getExpandedPanel());
|
473
|
+
};
|
474
|
+
|
475
|
+
/**
|
476
|
+
* Gets a reference to the currently selected panel (if there is one)
|
477
|
+
*/
|
478
|
+
Kwick.prototype.getSelectedPanel = function() {
|
479
|
+
return this.selectedIndex === -1 ? $([]) : this.$panels.eq(this.selectedIndex);
|
480
|
+
};
|
481
|
+
|
482
|
+
/**
|
483
|
+
* Forces the panels to be updated in response to the container being resized.
|
484
|
+
*/
|
485
|
+
Kwick.prototype.resize = function(index) {
|
486
|
+
// bail out if container size hasn't changed
|
487
|
+
if (this.getContainerSize() === this.getContainerSize(true)) return;
|
488
|
+
|
489
|
+
this.calculatePanelSizes();
|
490
|
+
this.offsets = this.getOffsetsForExpanded();
|
491
|
+
|
492
|
+
// if the panels are currently being animated, we'll just set a flag that can be detected
|
493
|
+
// during the next animation step
|
494
|
+
if (this.isAnimated) {
|
495
|
+
this._dirtyOffsets = true;
|
496
|
+
} else {
|
497
|
+
// otherwise update the styles immediately
|
498
|
+
this.updatePanelStyles();
|
499
|
+
}
|
500
|
+
};
|
501
|
+
|
502
|
+
/**
|
503
|
+
* Selects (and expands) the panel with the specified index (use -1 to select none)
|
504
|
+
*/
|
505
|
+
Kwick.prototype.select = function(index) {
|
506
|
+
// 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
|
+
}
|
512
|
+
|
513
|
+
this.getSelectedPanel().removeClass('kwicks-selected');
|
514
|
+
this.selectedIndex = index;
|
515
|
+
this.getSelectedPanel().addClass('kwicks-selected');
|
516
|
+
this.expand(index);
|
517
|
+
};
|
518
|
+
|
519
|
+
/**
|
520
|
+
* Expands the panel with the specified index (use -1 to expand none)
|
521
|
+
*/
|
522
|
+
Kwick.prototype.expand = function(index) {
|
523
|
+
var self = this;
|
524
|
+
|
525
|
+
// if the index is -1, then default it to the currently selected index (which will also be
|
526
|
+
// -1 if no panels are currently selected)
|
527
|
+
if (index === -1) index = this.selectedIndex;
|
528
|
+
|
529
|
+
// make sure the panel isn't already expanded
|
530
|
+
if (index === this.expandedIndex) return;
|
531
|
+
|
532
|
+
this.getExpandedPanel().removeClass('kwicks-expanded');
|
533
|
+
this.getCollapsedPanels().removeClass('kwicks-collapsed');
|
534
|
+
this.expandedIndex = index;
|
535
|
+
this.getExpandedPanel().addClass('kwicks-expanded');
|
536
|
+
this.getCollapsedPanels().addClass('kwicks-collapsed');
|
537
|
+
|
538
|
+
// handle panel animation
|
539
|
+
var $timer = this.$timer,
|
540
|
+
numPanels = this.$panels.length,
|
541
|
+
startOffsets = this.offsets.slice(),
|
542
|
+
offsets = this.offsets,
|
543
|
+
targetOffsets = this.getOffsetsForExpanded();
|
544
|
+
|
545
|
+
$timer.stop()[0].progress = 0;
|
546
|
+
this.isAnimated = true;
|
547
|
+
$timer.animate({ progress: 1 }, {
|
548
|
+
duration: this.opts.duration,
|
549
|
+
easing: this.opts.easing,
|
550
|
+
step: function(progress) {
|
551
|
+
if (self._dirtyOffsets) {
|
552
|
+
offsets = self.offsets;
|
553
|
+
targetOffsets = self.getOffsetsForExpanded();
|
554
|
+
self._dirtyOffsets = false;
|
555
|
+
}
|
556
|
+
offsets.length = 0;
|
557
|
+
for (var i = 0; i < numPanels; i++) {
|
558
|
+
var targetOffset = targetOffsets[i],
|
559
|
+
newOffset = targetOffset - ((targetOffset - startOffsets[i]) * (1 - progress));
|
560
|
+
offsets[i] = newOffset;
|
561
|
+
}
|
562
|
+
self.updatePanelStyles();
|
563
|
+
},
|
564
|
+
complete: function() {
|
565
|
+
self.isAnimated = false;
|
566
|
+
}
|
567
|
+
});
|
568
|
+
};
|
569
|
+
|
570
|
+
})(jQuery);
|
@@ -0,0 +1,42 @@
|
|
1
|
+
/*!
|
2
|
+
* Kwicks: Sexy Sliding Panels for jQuery - v2.1.0
|
3
|
+
* http://devsmash.com/projects/kwicks
|
4
|
+
*
|
5
|
+
* Copyright 2013 Jeremy Martin (jmar777)
|
6
|
+
* Contributors: Duke Speer (Duke3D), Guillermo Guerrero (gguerrero)
|
7
|
+
* Released under the MIT license
|
8
|
+
* http://www.opensource.org/licenses/mit-license.php
|
9
|
+
*/
|
10
|
+
|
11
|
+
/*
|
12
|
+
* This file contains styles that are common to all kwicks instances based on
|
13
|
+
* jquery_kwicks_rails helpers.
|
14
|
+
* Note that each kwicks instance requires additional styling.
|
15
|
+
*/
|
16
|
+
.kwicks {
|
17
|
+
display: block;
|
18
|
+
list-style-type: none;
|
19
|
+
list-style: none;
|
20
|
+
position: relative;
|
21
|
+
margin: 0;
|
22
|
+
padding: 0;
|
23
|
+
}
|
24
|
+
.kwicks > li.kwicks-panel {
|
25
|
+
display: block;
|
26
|
+
overflow: hidden;
|
27
|
+
padding: 0;
|
28
|
+
margin: 0;
|
29
|
+
}
|
30
|
+
.kwicks.kwicks-processed > li.kwicks-panel {
|
31
|
+
margin: 0;
|
32
|
+
position: absolute;
|
33
|
+
}
|
34
|
+
.kwicks-horizontal > li.kwicks-panel {
|
35
|
+
float: left;
|
36
|
+
}
|
37
|
+
.kwicks-horizontal > li.kwicks-panel:first-child {
|
38
|
+
margin-left: 0;
|
39
|
+
}
|
40
|
+
.kwicks-vertical > li.kwicks-panel:first-child {
|
41
|
+
margin-top: 0;
|
42
|
+
}
|
metadata
ADDED
@@ -0,0 +1,97 @@
|
|
1
|
+
--- !ruby/object:Gem::Specification
|
2
|
+
name: jquery_kwicks_rails
|
3
|
+
version: !ruby/object:Gem::Version
|
4
|
+
version: 1.0.0
|
5
|
+
platform: ruby
|
6
|
+
authors:
|
7
|
+
- Guillermo Guerrero
|
8
|
+
autorequire:
|
9
|
+
bindir: bin
|
10
|
+
cert_chain: []
|
11
|
+
date: 2013-07-21 00:00:00.000000000 Z
|
12
|
+
dependencies:
|
13
|
+
- !ruby/object:Gem::Dependency
|
14
|
+
name: rails
|
15
|
+
requirement: !ruby/object:Gem::Requirement
|
16
|
+
requirements:
|
17
|
+
- - '>='
|
18
|
+
- !ruby/object:Gem::Version
|
19
|
+
version: '3.1'
|
20
|
+
type: :runtime
|
21
|
+
prerelease: false
|
22
|
+
version_requirements: !ruby/object:Gem::Requirement
|
23
|
+
requirements:
|
24
|
+
- - '>='
|
25
|
+
- !ruby/object:Gem::Version
|
26
|
+
version: '3.1'
|
27
|
+
- !ruby/object:Gem::Dependency
|
28
|
+
name: jquery-rails
|
29
|
+
requirement: !ruby/object:Gem::Requirement
|
30
|
+
requirements:
|
31
|
+
- - '>='
|
32
|
+
- !ruby/object:Gem::Version
|
33
|
+
version: 2.0.2
|
34
|
+
type: :runtime
|
35
|
+
prerelease: false
|
36
|
+
version_requirements: !ruby/object:Gem::Requirement
|
37
|
+
requirements:
|
38
|
+
- - '>='
|
39
|
+
- !ruby/object:Gem::Version
|
40
|
+
version: 2.0.2
|
41
|
+
description: The JQuery Sexy Sliding Panels for Rails applications
|
42
|
+
email:
|
43
|
+
- g.guerrero.bus@gmail.com
|
44
|
+
executables: []
|
45
|
+
extensions: []
|
46
|
+
extra_rdoc_files:
|
47
|
+
- README.md
|
48
|
+
- MIT-LICENSE
|
49
|
+
files:
|
50
|
+
- .gitignore
|
51
|
+
- CHANGELOG.md
|
52
|
+
- MIT-LICENSE
|
53
|
+
- README.md
|
54
|
+
- jquery_kwicks_rails.gemspec
|
55
|
+
- lib/jquery_kwicks_rails.rb
|
56
|
+
- lib/jquery_kwicks_rails/engine.rb
|
57
|
+
- lib/jquery_kwicks_rails/helper.rb
|
58
|
+
- lib/jquery_kwicks_rails/version.rb
|
59
|
+
- vendor/assets/javascripts/kwicks/index.js
|
60
|
+
- vendor/assets/javascripts/kwicks/jquery.easing.1.3.js
|
61
|
+
- vendor/assets/javascripts/kwicks/jquery.kwicks.js
|
62
|
+
- vendor/assets/stylesheets/kwicks/index.css
|
63
|
+
- vendor/assets/stylesheets/kwicks/jquery.kwicks.css
|
64
|
+
homepage: https://github.com/gguerrero/jquery_kwicks_rails
|
65
|
+
licenses:
|
66
|
+
- MIT
|
67
|
+
metadata: {}
|
68
|
+
post_install_message:
|
69
|
+
rdoc_options:
|
70
|
+
- --title
|
71
|
+
- '"JQuery'
|
72
|
+
- Sexy
|
73
|
+
- Sliding
|
74
|
+
- Panels
|
75
|
+
- for
|
76
|
+
- Rails"
|
77
|
+
- --inline-source
|
78
|
+
require_paths:
|
79
|
+
- lib
|
80
|
+
required_ruby_version: !ruby/object:Gem::Requirement
|
81
|
+
requirements:
|
82
|
+
- - '>='
|
83
|
+
- !ruby/object:Gem::Version
|
84
|
+
version: '0'
|
85
|
+
required_rubygems_version: !ruby/object:Gem::Requirement
|
86
|
+
requirements:
|
87
|
+
- - '>='
|
88
|
+
- !ruby/object:Gem::Version
|
89
|
+
version: '0'
|
90
|
+
requirements: []
|
91
|
+
rubyforge_project:
|
92
|
+
rubygems_version: 2.0.3
|
93
|
+
signing_key:
|
94
|
+
specification_version: 4
|
95
|
+
summary: JQuery Sexy Sliding Panels for Rails apps
|
96
|
+
test_files: []
|
97
|
+
has_rdoc: true
|