swipebox 0.1.3 → 1.2.9
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/README.md +65 -0
- data/Rakefile +0 -14
- data/lib/swipebox/version.rb +1 -1
- data/test/dummy/log/test.log +30 -62
- data/test/dummy/tmp/cache/assets/test/sass/{f9c6a267bff4dbc4c014a32d65f455fee642ff7f → 723883a196861294bbe8325180066fa58ee6de9e}/swipebox.css.scssc +0 -0
- data/test/dummy/tmp/cache/assets/test/sass/771d9f27082f7556112a4648ca8fc905f2173465/swipebox.css.scssc +0 -0
- data/test/dummy/tmp/cache/assets/test/sprockets/0591d8c51084171b76a2c6f20926bb51 +0 -0
- data/test/dummy/tmp/cache/assets/test/sprockets/09898caf5a9a94ec51afecb80bca3cf2 +0 -0
- data/test/dummy/tmp/cache/assets/test/sprockets/{52844af88f25171d8b2bd9b3841fc531 → 0bff44572e887b09daf68fed28839bb2} +0 -0
- data/test/dummy/tmp/cache/assets/test/sprockets/12326d2e44748b6b542dc270fba7390e +0 -0
- data/test/dummy/tmp/cache/assets/test/sprockets/1e17757dcb9ada88ed012e3675f1f95b +0 -0
- data/test/dummy/tmp/cache/assets/test/sprockets/1e47b6dbbf210735d6bfe9862e84f0cb +0 -0
- data/test/dummy/tmp/cache/assets/test/sprockets/{ad7154cc55f39a227d2bc6415f58932d → 1f74808b9e463d137a33f7ba77e3bbd4} +0 -0
- data/test/dummy/tmp/cache/assets/test/sprockets/2269a00fea39582a928db1d2c81983d8 +0 -0
- data/test/dummy/tmp/cache/assets/test/sprockets/25353c00952a3362331091a317a12bbc +0 -0
- data/test/dummy/tmp/cache/assets/test/sprockets/27915565888f61eae343f8223ece43a0 +0 -0
- data/test/dummy/tmp/cache/assets/test/sprockets/440dfe1de5fd9a862fed9bd0decb24b8 +0 -0
- data/test/dummy/tmp/cache/assets/test/sprockets/51010d13321d8992a932534ff1d41627 +0 -0
- data/test/dummy/tmp/cache/assets/test/sprockets/59bd4e64e2c90d2cbdca021507d81564 +0 -0
- data/test/dummy/tmp/cache/assets/test/sprockets/6450c3ebafe929a16bfea6cf4c35bf92 +0 -0
- data/test/dummy/tmp/cache/assets/test/sprockets/6fd4a72d818051674433e4a7a53ffd59 +0 -0
- data/test/dummy/tmp/cache/assets/test/sprockets/75c485a1ef3aafa76047132f5497eaba +0 -0
- data/test/dummy/tmp/cache/assets/test/sprockets/78fc9fc0f7b099f33eab93ec417fe39f +0 -0
- data/test/dummy/tmp/cache/assets/test/sprockets/79e92ecae5bf8e962811eb44d8ed5da6 +0 -0
- data/test/dummy/tmp/cache/assets/test/sprockets/7a6158d95c2641c1991a8ebd3fbe4213 +0 -0
- data/test/dummy/tmp/cache/assets/test/sprockets/{9540837ee939a819ff3def6208986d2b → 86ffbc5132d97ef7634efb42901ca7e0} +0 -0
- data/test/dummy/tmp/cache/assets/test/sprockets/93057c6caa3e3b29af35e2323e5748c4 +0 -0
- data/test/dummy/tmp/cache/assets/test/sprockets/{58b5fb0ecf84f52f0afa100b0b4c8cba → 993de32fb37ad35f29a29a85c872f978} +0 -0
- data/test/dummy/tmp/cache/assets/test/sprockets/af78a815232b7bdf67f2f7d3b5535d5f +0 -0
- data/test/dummy/tmp/cache/assets/test/sprockets/{2417663820f12194df84f901aeddf205 → b3a2d244fee52557c6bf0cc5acb01ff0} +0 -0
- data/test/dummy/tmp/cache/assets/test/sprockets/c53be797596ba6b9af102c9ac7423796 +0 -0
- data/test/dummy/tmp/cache/assets/test/sprockets/{7cad4e0f6c155aee86ff849175d87485 → cde695242acc016b4f03a22a92cae318} +0 -0
- data/test/dummy/tmp/cache/assets/test/sprockets/ff9d1dac658ef3c703c5dfe984eb94d5 +0 -0
- data/test/integration/swipebox_integration_test.rb +2 -2
- data/test/test_helper.rb +1 -1
- data/vendor/assets/javascripts/swipebox.js +549 -351
- data/vendor/assets/stylesheets/swipebox.css.scss +141 -155
- metadata +92 -91
- data/test/dummy/log/development.log +0 -56
- data/test/dummy/tmp/cache/assets/development/sprockets/13fe41fee1fe35b49d145bcc06610705 +0 -0
- data/test/dummy/tmp/cache/assets/development/sprockets/2f5173deea6c795b8fdde723bb4b63af +0 -0
- data/test/dummy/tmp/cache/assets/development/sprockets/357970feca3ac29060c1e3861e2c0953 +0 -0
- data/test/dummy/tmp/cache/assets/development/sprockets/cffd775d018f68ce5dba1ee0d951a994 +0 -0
- data/test/dummy/tmp/cache/assets/development/sprockets/d771ace226fc8215a3572e0aa35bb0d6 +0 -0
- data/test/dummy/tmp/cache/assets/development/sprockets/f7cbd26ba1d28d48de824f0e94586655 +0 -0
- data/test/dummy/tmp/cache/assets/test/sprockets/0f1d51342ac8ff8f51fe8661bffccff4 +0 -0
- data/test/dummy/tmp/cache/assets/test/sprockets/299e5c3e6fe902ee2248d4f551e2a736 +0 -0
- data/test/dummy/tmp/cache/assets/test/sprockets/2d27104a6b2153e05b2475dd0ab3ec77 +0 -0
- data/test/dummy/tmp/cache/assets/test/sprockets/39a4691fbee5b5d7a15a61d39e8298c9 +0 -0
- data/test/dummy/tmp/cache/assets/test/sprockets/4f1e7de5e274edb0299126f2903969f0 +0 -0
- data/test/dummy/tmp/cache/assets/test/sprockets/556916ec527010707833ceeb7f3c04f4 +0 -0
- data/test/dummy/tmp/cache/assets/test/sprockets/56e10a99c9cb1099b3bba550c304510e +0 -0
- data/test/dummy/tmp/cache/assets/test/sprockets/5ef9b0cd9731bc93b50f72a671e604c0 +0 -0
- data/test/dummy/tmp/cache/assets/test/sprockets/60bdda9adeb105627bebe3a083e0e6f9 +0 -0
- data/test/dummy/tmp/cache/assets/test/sprockets/b76f694c0efb9b770a71012f8113728b +0 -0
- data/test/dummy/tmp/cache/assets/test/sprockets/bb9dec5421199706d294d48f86f003d8 +0 -0
- data/test/dummy/tmp/cache/assets/test/sprockets/beb2f84cd51827292ad2888716099203 +0 -0
- data/test/dummy/tmp/cache/assets/test/sprockets/c8a722e046ca0658031e47b6a3f6b80a +0 -0
- data/test/dummy/tmp/cache/assets/test/sprockets/e49d90ad8c6a6ec12d0f897fe441722f +0 -0
- data/test/dummy/tmp/cache/assets/test/sprockets/f8832e909e8abc5a5f26e98546d2f7ca +0 -0
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA1:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 51f0fa45917438717caa31372e3db87de179813e
|
4
|
+
data.tar.gz: 87c4357aabff614f0654676b5951af77cb46d9ab
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 977f93f0bd6cb60647f65145bd5ba22910f441a8164ac908f48041a6f1b4c66590bba7970609da4d431e2f26d090a8b37cc5fd04e72edab708f1644917513962
|
7
|
+
data.tar.gz: ce7906b22290bb0d18c70ba5f62f8c1597f5940a5cbfbe9acf2ab8631f65d5b9cb122c0f775ce9e4b27ae814b5c9bb4d14bde929e0a8aab02f19d3555d460c7d
|
data/README.md
ADDED
@@ -0,0 +1,65 @@
|
|
1
|
+
# Swipebox for Rails
|
2
|
+
|
3
|
+
[![Gem Version](https://badge.fury.io/rb/swipebox.png)](http://badge.fury.io/rb/swipebox)
|
4
|
+
[![Build Status](https://travis-ci.org/mrfoto/swipebox.png?branch=master)](https://travis-ci.org/mrfoto/swipebox)
|
5
|
+
[![Code Climate](https://codeclimate.com/github/mrfoto/swipebox.png)](https://codeclimate.com/github/mrfoto/swipebox)
|
6
|
+
[![Dependency Status](https://gemnasium.com/mrfoto/swipebox.png)](https://gemnasium.com/mrfoto/swipebox)
|
7
|
+
|
8
|
+
[Swipebox | A touchable jQuery lightbox](http://brutaldesign.github.io/swipebox/) for the Rails asset pipeline
|
9
|
+
|
10
|
+
## Installation
|
11
|
+
|
12
|
+
Add this line to your application's Gemfile:
|
13
|
+
|
14
|
+
```ruby
|
15
|
+
gem 'swipebox'
|
16
|
+
```
|
17
|
+
|
18
|
+
## Usage
|
19
|
+
|
20
|
+
In your CSS manifest file:
|
21
|
+
|
22
|
+
```css
|
23
|
+
*= require swipebox
|
24
|
+
```
|
25
|
+
|
26
|
+
In your JavaScript manifest file:
|
27
|
+
|
28
|
+
```js
|
29
|
+
//= require swipebox
|
30
|
+
```
|
31
|
+
|
32
|
+
Use a specific class for your links and use the title attribute as caption.
|
33
|
+
|
34
|
+
```html
|
35
|
+
<a href="big/image.jpg" class="swipebox" title="My Caption">
|
36
|
+
```
|
37
|
+
|
38
|
+
Bind the swipebox behaviour on every link with the 'swipebox' class.
|
39
|
+
|
40
|
+
```javascript
|
41
|
+
$('.swipebox').swipebox();
|
42
|
+
```
|
43
|
+
|
44
|
+
###Options
|
45
|
+
|
46
|
+
```javascript
|
47
|
+
useCSS : true, // false will force the use of jQuery for animations
|
48
|
+
initialIndexOnArray: 0, // which image index to init when a array is passed
|
49
|
+
hideBarsOnMobile : true, // false will show the caption and navbar on mobile devices
|
50
|
+
hideBarsDelay : 3000, // 0 to always show caption and action bar
|
51
|
+
videoMaxWidth : 1140, // videos max width
|
52
|
+
beforeOpen: function(){} , // called before opening
|
53
|
+
afterClose: function(){}, // called after closing
|
54
|
+
loopAtEnd: false // true will return to the first image after the last image is reached
|
55
|
+
```
|
56
|
+
|
57
|
+
Look at the original [Swipebox repo](https://github.com/brutaldesign/swipebox#usage) for more.
|
58
|
+
|
59
|
+
I have modified source a bit from the 1.2.9 version:
|
60
|
+
- SCSS instead of CSS because we need the `asset-url` helpers
|
61
|
+
- .png -> .svg via class not hardcoded image path
|
62
|
+
|
63
|
+
## License
|
64
|
+
|
65
|
+
[The MIT License](MIT-LICENSE)
|
data/Rakefile
CHANGED
@@ -4,19 +4,6 @@ rescue LoadError
|
|
4
4
|
puts 'You must `gem install bundler` and `bundle install` to run rake tasks'
|
5
5
|
end
|
6
6
|
|
7
|
-
require 'rdoc/task'
|
8
|
-
|
9
|
-
RDoc::Task.new(:rdoc) do |rdoc|
|
10
|
-
rdoc.rdoc_dir = 'rdoc'
|
11
|
-
rdoc.title = 'Swipebox'
|
12
|
-
rdoc.options << '--line-numbers'
|
13
|
-
rdoc.rdoc_files.include('README.rdoc')
|
14
|
-
rdoc.rdoc_files.include('lib/**/*.rb')
|
15
|
-
end
|
16
|
-
|
17
|
-
|
18
|
-
|
19
|
-
|
20
7
|
Bundler::GemHelper.install_tasks
|
21
8
|
|
22
9
|
require 'rake/testtask'
|
@@ -28,5 +15,4 @@ Rake::TestTask.new(:test) do |t|
|
|
28
15
|
t.verbose = false
|
29
16
|
end
|
30
17
|
|
31
|
-
|
32
18
|
task default: :test
|
data/lib/swipebox/version.rb
CHANGED
data/test/dummy/log/test.log
CHANGED
@@ -1,62 +1,30 @@
|
|
1
|
-
|
2
|
-
|
3
|
-
Started GET "/assets/
|
4
|
-
|
5
|
-
|
6
|
-
Started GET "/assets/swipebox.css" for 127.0.0.1 at 2013-
|
7
|
-
|
8
|
-
|
9
|
-
Started GET "/assets/
|
10
|
-
|
11
|
-
|
12
|
-
Started GET "/assets/swipebox.
|
13
|
-
|
14
|
-
|
15
|
-
Started GET "/assets/
|
16
|
-
|
17
|
-
|
18
|
-
Started GET "/assets/swipebox.css" for 127.0.0.1 at 2013-
|
19
|
-
Started GET "/assets/swipebox.
|
20
|
-
Started GET "/assets/
|
21
|
-
Started GET "/assets/swipebox.
|
22
|
-
Started GET "/assets/swipebox.
|
23
|
-
Started GET "/assets/swipebox.css" for 127.0.0.1 at 2013-
|
24
|
-
Started GET "/assets/swipebox.
|
25
|
-
Started GET "/assets/swipebox.js" for 127.0.0.1 at
|
26
|
-
Started GET "/assets/swipebox.css" for 127.0.0.1 at
|
27
|
-
Started GET "/assets/swipebox.css" for 127.0.0.1 at
|
28
|
-
Started GET "/assets/swipebox.
|
29
|
-
Started GET "/assets/swipebox.
|
30
|
-
Started GET "/assets/swipebox.
|
31
|
-
Started GET "/assets/swipebox.js" for 127.0.0.1 at 2013-10-20 22:45:24 +0200
|
32
|
-
Started GET "/assets/swipebox.css" for 127.0.0.1 at 2013-10-20 22:45:24 +0200
|
33
|
-
Started GET "/assets/swipebox.js" for 127.0.0.1 at 2013-10-21 15:28:52 +0200
|
34
|
-
Started GET "/assets/swipebox.css" for 127.0.0.1 at 2013-10-21 15:28:52 +0200
|
35
|
-
Started GET "/assets/swipebox.js" for 127.0.0.1 at 2013-10-21 15:29:07 +0200
|
36
|
-
Started GET "/assets/swipebox.css" for 127.0.0.1 at 2013-10-21 15:29:07 +0200
|
37
|
-
Started GET "/assets/swipebox.css" for 127.0.0.1 at 2013-10-21 17:43:23 +0200
|
38
|
-
Started GET "/assets/swipebox.js" for 127.0.0.1 at 2013-10-21 17:43:23 +0200
|
39
|
-
Started GET "/assets/swipebox.js" for 127.0.0.1 at 2013-10-22 11:02:46 +0200
|
40
|
-
Started GET "/assets/swipebox.css" for 127.0.0.1 at 2013-10-22 11:02:46 +0200
|
41
|
-
Started GET "/assets/swipebox.css" for 127.0.0.1 at 2013-10-22 11:02:46 +0200
|
42
|
-
Started GET "/assets/swipebox.css" for 127.0.0.1 at 2013-10-22 11:03:12 +0200
|
43
|
-
Started GET "/assets/swipebox.css" for 127.0.0.1 at 2013-10-22 11:03:12 +0200
|
44
|
-
Started GET "/assets/swipebox.js" for 127.0.0.1 at 2013-10-22 11:03:12 +0200
|
45
|
-
Started GET "/assets/swipebox.js" for 127.0.0.1 at 2013-10-22 11:04:26 +0200
|
46
|
-
Started GET "/assets/swipebox.css" for 127.0.0.1 at 2013-10-22 11:04:26 +0200
|
47
|
-
Started GET "/assets/swipebox.css" for 127.0.0.1 at 2013-10-22 11:04:26 +0200
|
48
|
-
Started GET "/assets/swipebox.css" for 127.0.0.1 at 2013-10-22 11:05:25 +0200
|
49
|
-
Started GET "/assets/swipebox.js" for 127.0.0.1 at 2013-10-22 11:05:25 +0200
|
50
|
-
Started GET "/assets/swipebox.css" for 127.0.0.1 at 2013-10-22 11:05:25 +0200
|
51
|
-
Started GET "/assets/swipebox.js" for 127.0.0.1 at 2013-10-22 11:08:01 +0200
|
52
|
-
Started GET "/assets/swipebox.css" for 127.0.0.1 at 2013-10-22 11:08:01 +0200
|
53
|
-
Started GET "/assets/swipebox.css" for 127.0.0.1 at 2013-10-22 11:08:01 +0200
|
54
|
-
Started GET "/assets/swipebox.js" for 127.0.0.1 at 2013-10-28 18:54:19 +0100
|
55
|
-
Started GET "/assets/swipebox.css" for 127.0.0.1 at 2013-10-28 18:54:19 +0100
|
56
|
-
Started GET "/assets/swipebox.css" for 127.0.0.1 at 2013-10-28 18:54:19 +0100
|
57
|
-
Started GET "/assets/swipebox.css" for 127.0.0.1 at 2013-10-28 18:54:49 +0100
|
58
|
-
Started GET "/assets/swipebox.js" for 127.0.0.1 at 2013-10-28 18:54:49 +0100
|
59
|
-
Started GET "/assets/swipebox.css" for 127.0.0.1 at 2013-10-28 18:54:49 +0100
|
60
|
-
Started GET "/assets/swipebox.js" for 127.0.0.1 at 2013-10-28 18:55:18 +0100
|
61
|
-
Started GET "/assets/swipebox.css" for 127.0.0.1 at 2013-10-28 18:55:18 +0100
|
62
|
-
Started GET "/assets/swipebox.css" for 127.0.0.1 at 2013-10-28 18:55:18 +0100
|
1
|
+
|
2
|
+
|
3
|
+
Started GET "/assets/swipebox.js" for 127.0.0.1 at 2013-12-04 17:13:52 +0100
|
4
|
+
|
5
|
+
|
6
|
+
Started GET "/assets/swipebox.css" for 127.0.0.1 at 2013-12-04 17:13:52 +0100
|
7
|
+
|
8
|
+
|
9
|
+
Started GET "/assets/swipebox.css" for 127.0.0.1 at 2013-12-04 17:13:52 +0100
|
10
|
+
|
11
|
+
|
12
|
+
Started GET "/assets/swipebox.js" for 127.0.0.1 at 2013-12-04 17:14:12 +0100
|
13
|
+
|
14
|
+
|
15
|
+
Started GET "/assets/swipebox.css" for 127.0.0.1 at 2013-12-04 17:14:12 +0100
|
16
|
+
|
17
|
+
|
18
|
+
Started GET "/assets/swipebox.css" for 127.0.0.1 at 2013-12-04 17:14:12 +0100
|
19
|
+
Started GET "/assets/swipebox.js" for 127.0.0.1 at 2013-12-04 17:16:28 +0100
|
20
|
+
Started GET "/assets/swipebox.css" for 127.0.0.1 at 2013-12-04 17:16:28 +0100
|
21
|
+
Started GET "/assets/swipebox.css" for 127.0.0.1 at 2013-12-04 17:16:28 +0100
|
22
|
+
Started GET "/assets/swipebox.js" for 127.0.0.1 at 2013-12-04 17:16:37 +0100
|
23
|
+
Started GET "/assets/swipebox.css" for 127.0.0.1 at 2013-12-04 17:16:37 +0100
|
24
|
+
Started GET "/assets/swipebox.css" for 127.0.0.1 at 2013-12-04 17:16:37 +0100
|
25
|
+
Started GET "/assets/swipebox.js" for 127.0.0.1 at 2014-09-03 16:45:29 +0200
|
26
|
+
Started GET "/assets/swipebox.css" for 127.0.0.1 at 2014-09-03 16:45:29 +0200
|
27
|
+
Started GET "/assets/swipebox.css" for 127.0.0.1 at 2014-09-03 16:45:29 +0200
|
28
|
+
Started GET "/assets/swipebox.css" for 127.0.0.1 at 2014-09-03 16:47:35 +0200
|
29
|
+
Started GET "/assets/swipebox.css" for 127.0.0.1 at 2014-09-03 16:47:35 +0200
|
30
|
+
Started GET "/assets/swipebox.js" for 127.0.0.1 at 2014-09-03 16:47:35 +0200
|
File without changes
|
Binary file
|
Binary file
|
Binary file
|
Binary file
|
Binary file
|
Binary file
|
Binary file
|
@@ -8,7 +8,7 @@ describe "swipebox integration" do
|
|
8
8
|
|
9
9
|
it "provides swipebox.css on the asset pipeline" do
|
10
10
|
visit '/assets/swipebox.css'
|
11
|
-
page.text.must_include '.swipebox {'
|
11
|
+
page.text.must_include 'html.swipebox-html.swipebox-touch {'
|
12
12
|
end
|
13
13
|
|
14
14
|
it "includes images from assets in the compiled css" do
|
@@ -17,4 +17,4 @@ describe "swipebox integration" do
|
|
17
17
|
page.text.must_include '/assets/swipebox-icons.png'
|
18
18
|
page.text.must_include '/assets/swipebox-loader.gif'
|
19
19
|
end
|
20
|
-
end
|
20
|
+
end
|
data/test/test_helper.rb
CHANGED
@@ -1,596 +1,794 @@
|
|
1
|
-
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
6
|
-
|
7
|
-
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
|
18
|
-
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
|
26
|
-
|
27
|
-
|
28
|
-
|
29
|
-
|
30
|
-
|
31
|
-
|
32
|
-
|
33
|
-
|
34
|
-
|
35
|
-
|
36
|
-
|
37
|
-
|
38
|
-
|
39
|
-
|
40
|
-
|
41
|
-
|
42
|
-
|
43
|
-
|
44
|
-
|
45
|
-
|
46
|
-
|
47
|
-
|
48
|
-
|
49
|
-
|
50
|
-
|
51
|
-
|
52
|
-
|
1
|
+
/*! Swipebox v1.2.9 | Constantin Saguin csag.co | MIT License | github.com/brutaldesign/swipebox */
|
2
|
+
|
3
|
+
;( function ( window, document, $, undefined ) {
|
4
|
+
|
5
|
+
$.swipebox = function( elem, options ) {
|
6
|
+
|
7
|
+
// Default options
|
8
|
+
var ui,
|
9
|
+
defaults = {
|
10
|
+
useCSS : true,
|
11
|
+
useSVG : true,
|
12
|
+
initialIndexOnArray : 0,
|
13
|
+
closeBySwipe: true,
|
14
|
+
hideBarsOnMobile : true,
|
15
|
+
hideBarsDelay : 3000,
|
16
|
+
videoMaxWidth : 1140,
|
17
|
+
vimeoColor : 'CCCCCC',
|
18
|
+
beforeOpen: null,
|
19
|
+
afterOpen: null,
|
20
|
+
afterClose: null,
|
21
|
+
loopAtEnd: false
|
22
|
+
},
|
23
|
+
|
24
|
+
plugin = this,
|
25
|
+
elements = [], // slides array [ { href:'...', title:'...' }, ...],
|
26
|
+
$elem,
|
27
|
+
selector = elem.selector,
|
28
|
+
$selector = $( selector ),
|
29
|
+
isMobile = navigator.userAgent.match( /(iPad)|(iPhone)|(iPod)|(Android)|(PlayBook)|(BB10)|(BlackBerry)|(Opera Mini)|(IEMobile)|(webOS)|(MeeGo)/i ),
|
30
|
+
isTouch = isMobile !== null || document.createTouch !== undefined || ( 'ontouchstart' in window ) || ( 'onmsgesturechange' in window ) || navigator.msMaxTouchPoints,
|
31
|
+
supportSVG = !! document.createElementNS && !! document.createElementNS( 'http://www.w3.org/2000/svg', 'svg').createSVGRect,
|
32
|
+
winWidth = window.innerWidth ? window.innerWidth : $( window ).width(),
|
33
|
+
winHeight = window.innerHeight ? window.innerHeight : $( window ).height(),
|
34
|
+
/* jshint multistr: true */
|
35
|
+
html = '<div id="swipebox-overlay">\
|
36
|
+
<div id="swipebox-slider"></div>\
|
37
|
+
<div id="swipebox-caption"></div>\
|
38
|
+
<div id="swipebox-action">\
|
39
|
+
<a id="swipebox-close"></a>\
|
40
|
+
<a id="swipebox-prev"></a>\
|
41
|
+
<a id="swipebox-next"></a>\
|
42
|
+
</div>\
|
43
|
+
</div>';
|
44
|
+
|
45
|
+
plugin.settings = {};
|
46
|
+
|
47
|
+
$.swipebox.close = function (){
|
48
|
+
ui.closeSlide();
|
49
|
+
};
|
50
|
+
|
51
|
+
$.swipebox.extend = function (){
|
52
|
+
return ui;
|
53
|
+
}
|
54
|
+
|
55
|
+
plugin.init = function() {
|
56
|
+
|
57
|
+
plugin.settings = $.extend( {}, defaults, options );
|
58
|
+
|
59
|
+
if ( $.isArray( elem ) ) {
|
53
60
|
|
54
61
|
elements = elem;
|
55
|
-
ui.target = $(window);
|
56
|
-
ui.init(plugin.settings.initialIndexOnArray);
|
62
|
+
ui.target = $( window );
|
63
|
+
ui.init( plugin.settings.initialIndexOnArray );
|
64
|
+
|
65
|
+
} else {
|
66
|
+
|
67
|
+
$( document ).on( 'click', selector, function( event ) {
|
68
|
+
|
69
|
+
// console.log( isTouch );
|
70
|
+
|
71
|
+
if ( event.target.parentNode.className === 'slide current' ) {
|
57
72
|
|
58
|
-
|
73
|
+
return false;
|
74
|
+
|
75
|
+
}
|
76
|
+
|
77
|
+
if ( ! $.isArray( elem ) ) {
|
78
|
+
ui.destroy();
|
79
|
+
$elem = $( selector );
|
80
|
+
ui.actions();
|
81
|
+
}
|
59
82
|
|
60
|
-
$selector.click(function(e){
|
61
83
|
elements = [];
|
62
84
|
var index , relType, relVal;
|
63
85
|
|
64
|
-
|
86
|
+
// Allow for HTML5 compliant attribute before legacy use of rel
|
87
|
+
if ( ! relVal ) {
|
88
|
+
relType = 'data-rel';
|
89
|
+
relVal = $( this ).attr( relType );
|
90
|
+
}
|
91
|
+
|
92
|
+
if ( ! relVal ) {
|
65
93
|
relType = 'rel';
|
66
|
-
relVal
|
94
|
+
relVal = $( this ).attr( relType );
|
67
95
|
}
|
68
96
|
|
69
|
-
if (relVal && relVal !== '' && relVal !== 'nofollow') {
|
70
|
-
$elem = $selector.filter('[' + relType + '="' + relVal + '"]');
|
71
|
-
}else{
|
72
|
-
$elem = $(selector);
|
97
|
+
if ( relVal && relVal !== '' && relVal !== 'nofollow' ) {
|
98
|
+
$elem = $selector.filter( '[' + relType + '="' + relVal + '"]' );
|
99
|
+
} else {
|
100
|
+
$elem = $( selector );
|
73
101
|
}
|
74
102
|
|
75
|
-
$elem.each(function(){
|
103
|
+
$elem.each( function() {
|
76
104
|
|
77
|
-
var title = null,
|
105
|
+
var title = null,
|
106
|
+
href = null;
|
107
|
+
|
108
|
+
if ( $( this ).attr( 'title' ) ) {
|
109
|
+
title = $( this ).attr( 'title' );
|
110
|
+
}
|
78
111
|
|
79
|
-
if( $(this).attr('title') )
|
80
|
-
title = $(this).attr('title');
|
81
112
|
|
82
|
-
if( $(this).attr('href') )
|
83
|
-
href = $(this).attr('href');
|
113
|
+
if ( $( this ).attr( 'href' ) ) {
|
114
|
+
href = $( this ).attr( 'href' );
|
115
|
+
}
|
84
116
|
|
85
|
-
elements.push({
|
117
|
+
elements.push( {
|
86
118
|
href: href,
|
87
119
|
title: title
|
88
|
-
});
|
89
|
-
});
|
90
|
-
|
91
|
-
index = $elem.index($(this));
|
92
|
-
|
93
|
-
|
94
|
-
ui.target = $(
|
95
|
-
ui.init(index);
|
96
|
-
});
|
97
|
-
}
|
98
|
-
}
|
99
|
-
|
100
|
-
plugin.refresh = function() {
|
101
|
-
if (!$.isArray(elem)) {
|
102
|
-
ui.destroy();
|
103
|
-
$elem = $(selector);
|
104
|
-
ui.actions();
|
120
|
+
} );
|
121
|
+
} );
|
122
|
+
|
123
|
+
index = $elem.index( $( this ) );
|
124
|
+
event.preventDefault();
|
125
|
+
event.stopPropagation();
|
126
|
+
ui.target = $( event.target );
|
127
|
+
ui.init( index );
|
128
|
+
} );
|
105
129
|
}
|
106
|
-
}
|
130
|
+
};
|
107
131
|
|
108
|
-
|
132
|
+
ui = {
|
109
133
|
|
110
|
-
|
111
|
-
|
134
|
+
/**
|
135
|
+
* Initiate Swipebox
|
136
|
+
*/
|
137
|
+
init : function( index ) {
|
138
|
+
if ( plugin.settings.beforeOpen ) {
|
112
139
|
plugin.settings.beforeOpen();
|
113
|
-
|
140
|
+
}
|
141
|
+
this.target.trigger( 'swipebox-start' );
|
114
142
|
$.swipebox.isOpen = true;
|
115
143
|
this.build();
|
116
|
-
this.openSlide(index);
|
117
|
-
this.openMedia(index);
|
118
|
-
this.preloadMedia(index+1);
|
119
|
-
this.preloadMedia(index-1);
|
144
|
+
this.openSlide( index );
|
145
|
+
this.openMedia( index );
|
146
|
+
this.preloadMedia( index+1 );
|
147
|
+
this.preloadMedia( index-1 );
|
148
|
+
if ( plugin.settings.afterOpen ) {
|
149
|
+
plugin.settings.afterOpen();
|
150
|
+
}
|
120
151
|
},
|
121
152
|
|
122
|
-
|
123
|
-
|
153
|
+
/**
|
154
|
+
* Built HTML containers and fire main functions
|
155
|
+
*/
|
156
|
+
build : function () {
|
157
|
+
var $this = this, bg;
|
124
158
|
|
125
|
-
$('body').append(html);
|
159
|
+
$( 'body' ).append( html );
|
126
160
|
|
127
|
-
if($this.doCssTrans()){
|
128
|
-
$('#swipebox-slider').css({
|
161
|
+
if ( $this.doCssTrans() ) {
|
162
|
+
$( '#swipebox-slider' ).css( {
|
129
163
|
'-webkit-transition' : 'left 0.4s ease',
|
130
164
|
'-moz-transition' : 'left 0.4s ease',
|
131
165
|
'-o-transition' : 'left 0.4s ease',
|
132
166
|
'-khtml-transition' : 'left 0.4s ease',
|
133
167
|
'transition' : 'left 0.4s ease'
|
134
|
-
});
|
135
|
-
$('#swipebox-overlay').css({
|
168
|
+
} );
|
169
|
+
$( '#swipebox-overlay' ).css( {
|
136
170
|
'-webkit-transition' : 'opacity 1s ease',
|
137
171
|
'-moz-transition' : 'opacity 1s ease',
|
138
172
|
'-o-transition' : 'opacity 1s ease',
|
139
173
|
'-khtml-transition' : 'opacity 1s ease',
|
140
174
|
'transition' : 'opacity 1s ease'
|
141
|
-
});
|
142
|
-
$('#swipebox-action, #swipebox-caption').css({
|
175
|
+
} );
|
176
|
+
$( '#swipebox-action, #swipebox-caption' ).css( {
|
143
177
|
'-webkit-transition' : '0.5s',
|
144
178
|
'-moz-transition' : '0.5s',
|
145
179
|
'-o-transition' : '0.5s',
|
146
180
|
'-khtml-transition' : '0.5s',
|
147
181
|
'transition' : '0.5s'
|
148
|
-
});
|
182
|
+
} );
|
149
183
|
}
|
150
184
|
|
185
|
+
if ( supportSVG && plugin.settings.useSVG === true ) {
|
186
|
+
$('#swipebox-prev, #swipebox-next, #swipebox-close').addClass('svg');
|
187
|
+
}
|
151
188
|
|
152
|
-
if(
|
153
|
-
$('#swipebox-action #swipebox-
|
189
|
+
if ( isMobile && plugin.settings.hideBarsOnMobile === true ) {
|
190
|
+
$( '#swipebox-action, #swipebox-caption' ).hide();
|
154
191
|
}
|
155
192
|
|
156
|
-
$.each( elements, function(){
|
157
|
-
$('#swipebox-slider').append('<div class="slide"></div>');
|
158
|
-
});
|
193
|
+
$.each( elements, function() {
|
194
|
+
$( '#swipebox-slider' ).append( '<div class="slide"></div>' );
|
195
|
+
} );
|
159
196
|
|
160
197
|
$this.setDim();
|
161
198
|
$this.actions();
|
199
|
+
|
200
|
+
if ( isTouch ) {
|
201
|
+
$this.gesture();
|
202
|
+
}
|
203
|
+
|
204
|
+
// Devices can have both touch and keyboard input so always allow key events
|
162
205
|
$this.keyboard();
|
163
|
-
|
206
|
+
|
164
207
|
$this.animBars();
|
165
208
|
$this.resize();
|
166
209
|
|
167
210
|
},
|
168
211
|
|
169
|
-
|
212
|
+
/**
|
213
|
+
* Set dimensions depending on windows width and height
|
214
|
+
*/
|
215
|
+
setDim : function () {
|
170
216
|
|
171
217
|
var width, height, sliderCss = {};
|
172
218
|
|
173
|
-
|
219
|
+
// Reset dimensions on mobile orientation change
|
220
|
+
if ( 'onorientationchange' in window ) {
|
174
221
|
|
175
|
-
window.addEventListener(
|
176
|
-
if( window.orientation
|
222
|
+
window.addEventListener( 'orientationchange', function() {
|
223
|
+
if ( window.orientation === 0 ) {
|
177
224
|
width = winWidth;
|
178
225
|
height = winHeight;
|
179
|
-
}else if( window.orientation
|
226
|
+
} else if ( window.orientation === 90 || window.orientation === -90 ) {
|
180
227
|
width = winHeight;
|
181
228
|
height = winWidth;
|
182
229
|
}
|
183
|
-
}, false);
|
230
|
+
}, false );
|
184
231
|
|
185
232
|
|
186
|
-
}else{
|
233
|
+
} else {
|
187
234
|
|
188
|
-
width = window.innerWidth ? window.innerWidth : $(window).width();
|
189
|
-
height = window.innerHeight ? window.innerHeight : $(window).height();
|
235
|
+
width = window.innerWidth ? window.innerWidth : $( window ).width();
|
236
|
+
height = window.innerHeight ? window.innerHeight : $( window ).height();
|
190
237
|
}
|
191
238
|
|
192
239
|
sliderCss = {
|
193
240
|
width : width,
|
194
241
|
height : height
|
195
|
-
}
|
196
|
-
|
242
|
+
};
|
197
243
|
|
198
|
-
$('#swipebox-overlay').css(sliderCss);
|
244
|
+
$( '#swipebox-overlay' ).css( sliderCss );
|
199
245
|
|
200
246
|
},
|
201
247
|
|
202
|
-
|
248
|
+
/**
|
249
|
+
* Reset dimensions on window resize envent
|
250
|
+
*/
|
251
|
+
resize : function () {
|
203
252
|
var $this = this;
|
204
253
|
|
205
|
-
$(window).resize(function() {
|
254
|
+
$( window ).resize( function() {
|
206
255
|
$this.setDim();
|
207
|
-
}).resize();
|
256
|
+
} ).resize();
|
208
257
|
},
|
209
258
|
|
210
|
-
|
211
|
-
|
212
|
-
|
213
|
-
|
259
|
+
/**
|
260
|
+
* Check if device supports CSS transitions
|
261
|
+
*/
|
262
|
+
supportTransition : function () {
|
263
|
+
|
264
|
+
var prefixes = 'transition WebkitTransition MozTransition OTransition msTransition KhtmlTransition'.split( ' ' ),
|
265
|
+
i;
|
266
|
+
|
267
|
+
for ( i = 0; i < prefixes.length; i++ ) {
|
268
|
+
if ( document.createElement( 'div' ).style[ prefixes[i] ] !== undefined ) {
|
214
269
|
return prefixes[i];
|
215
270
|
}
|
216
271
|
}
|
217
272
|
return false;
|
218
273
|
},
|
219
274
|
|
220
|
-
|
221
|
-
|
275
|
+
/**
|
276
|
+
* Check if CSS transitions are allowed (options + devicesupport)
|
277
|
+
*/
|
278
|
+
doCssTrans : function () {
|
279
|
+
if ( plugin.settings.useCSS && this.supportTransition() ) {
|
222
280
|
return true;
|
223
281
|
}
|
224
282
|
},
|
225
283
|
|
226
|
-
|
227
|
-
|
228
|
-
|
284
|
+
/**
|
285
|
+
* Touch navigation
|
286
|
+
*/
|
287
|
+
gesture : function () {
|
288
|
+
|
289
|
+
var $this = this,
|
229
290
|
distance = null,
|
291
|
+
vDistance = null,
|
292
|
+
vSwipe = false,
|
230
293
|
swipMinDistance = 10,
|
294
|
+
vSwipMinDistance = 50,
|
231
295
|
startCoords = {},
|
232
|
-
endCoords = {}
|
233
|
-
|
296
|
+
endCoords = {},
|
297
|
+
|
298
|
+
bars = $( '#swipebox-caption, #swipebox-action' ),
|
299
|
+
slider = $( '#swipebox-slider' );
|
300
|
+
|
301
|
+
bars.addClass( 'visible-bars' );
|
302
|
+
$this.setTimeout();
|
234
303
|
|
235
|
-
|
236
|
-
$this.setTimeout();
|
304
|
+
$( 'body' ).bind( 'touchstart', function( event ) {
|
237
305
|
|
238
|
-
$(
|
306
|
+
$( this ).addClass( 'touching' );
|
239
307
|
|
240
|
-
|
308
|
+
endCoords = event.originalEvent.targetTouches[0];
|
309
|
+
startCoords.pageX = event.originalEvent.targetTouches[0].pageX;
|
310
|
+
startCoords.pageY = event.originalEvent.targetTouches[0].pageY;
|
241
311
|
|
242
|
-
|
243
|
-
|
312
|
+
$( '.touching' ).bind( 'touchmove',function( event ) {
|
313
|
+
event.preventDefault();
|
314
|
+
event.stopPropagation();
|
315
|
+
endCoords = event.originalEvent.targetTouches[0];
|
244
316
|
|
245
|
-
|
246
|
-
|
247
|
-
|
248
|
-
|
317
|
+
if ( plugin.settings.closeBySwipe ) {
|
318
|
+
vDistance = endCoords.pageY - startCoords.pageY;
|
319
|
+
if ( Math.abs( vDistance ) >= vSwipMinDistance || vSwipe ) {
|
320
|
+
var opacity = 0.75 - Math.abs(vDistance) / slider.height();
|
249
321
|
|
250
|
-
|
322
|
+
slider.css( { 'top': vDistance + 'px' } );
|
323
|
+
slider.css( { 'opacity': opacity } );
|
251
324
|
|
252
|
-
|
325
|
+
vSwipe = true;
|
326
|
+
}
|
327
|
+
}
|
328
|
+
|
329
|
+
} );
|
330
|
+
|
331
|
+
return false;
|
332
|
+
|
333
|
+
} ).bind( 'touchend',function( event ) {
|
334
|
+
event.preventDefault();
|
335
|
+
event.stopPropagation();
|
336
|
+
|
337
|
+
if ( plugin.settings.closeBySwipe ) {
|
338
|
+
if ( slider.css( 'opacity' ) <= 0.5) {
|
339
|
+
var vOffset = vDistance > 0 ? slider.height() : - slider.height();
|
340
|
+
slider.animate( { top: vOffset + 'px', 'opacity': 0 },
|
341
|
+
300,
|
342
|
+
function () {
|
343
|
+
$this.closeSlide();
|
344
|
+
} );
|
345
|
+
} else {
|
346
|
+
slider.animate( { top: 0, 'opacity': 1 }, 300 );
|
347
|
+
}
|
253
348
|
|
254
|
-
|
255
|
-
|
256
|
-
|
349
|
+
if ( vSwipe ) {
|
350
|
+
vSwipe = false;
|
351
|
+
return;
|
352
|
+
}
|
353
|
+
}
|
257
354
|
|
258
|
-
|
355
|
+
distance = endCoords.pageX - startCoords.pageX;
|
259
356
|
|
260
|
-
|
357
|
+
if ( distance >= swipMinDistance ) {
|
261
358
|
|
262
|
-
|
263
|
-
|
359
|
+
// swipeLeft
|
360
|
+
$this.getPrev();
|
264
361
|
|
265
|
-
|
362
|
+
} else if ( distance <= - swipMinDistance ) {
|
266
363
|
|
267
|
-
|
268
|
-
|
364
|
+
// swipeRight
|
365
|
+
$this.getNext();
|
269
366
|
|
270
|
-
|
271
|
-
|
272
|
-
|
367
|
+
} else {
|
368
|
+
// tap
|
369
|
+
if ( ! bars.hasClass( 'visible-bars' ) ) {
|
273
370
|
$this.showBars();
|
274
371
|
$this.setTimeout();
|
275
|
-
}else{
|
372
|
+
} else {
|
276
373
|
$this.clearTimeout();
|
277
374
|
$this.hideBars();
|
278
375
|
}
|
376
|
+
}
|
279
377
|
|
280
|
-
|
281
|
-
|
282
|
-
$('.touching').off('touchmove').removeClass('touching');
|
378
|
+
$( '.touching' ).off( 'touchmove' ).removeClass( 'touching' );
|
283
379
|
|
284
|
-
|
380
|
+
} );
|
285
381
|
|
286
|
-
}
|
287
382
|
},
|
288
383
|
|
289
|
-
|
290
|
-
|
384
|
+
/**
|
385
|
+
* Set timer to hide the action bars
|
386
|
+
*/
|
387
|
+
setTimeout: function () {
|
388
|
+
if ( plugin.settings.hideBarsDelay > 0 ) {
|
291
389
|
var $this = this;
|
292
390
|
$this.clearTimeout();
|
293
|
-
$this.timeout = window.setTimeout( function(){
|
294
|
-
|
391
|
+
$this.timeout = window.setTimeout( function() {
|
392
|
+
$this.hideBars();
|
393
|
+
},
|
394
|
+
|
295
395
|
plugin.settings.hideBarsDelay
|
296
396
|
);
|
297
397
|
}
|
298
398
|
},
|
299
399
|
|
300
|
-
|
301
|
-
|
400
|
+
/**
|
401
|
+
* Clear timer
|
402
|
+
*/
|
403
|
+
clearTimeout: function () {
|
404
|
+
window.clearTimeout( this.timeout );
|
302
405
|
this.timeout = null;
|
303
406
|
},
|
304
407
|
|
305
|
-
|
306
|
-
|
307
|
-
|
308
|
-
|
309
|
-
|
310
|
-
|
311
|
-
|
312
|
-
|
313
|
-
|
314
|
-
},
|
408
|
+
/**
|
409
|
+
* Show navigation and title bars
|
410
|
+
*/
|
411
|
+
showBars : function () {
|
412
|
+
var bars = $( '#swipebox-caption, #swipebox-action' );
|
413
|
+
if ( this.doCssTrans() ) {
|
414
|
+
bars.addClass( 'visible-bars' );
|
415
|
+
} else {
|
416
|
+
$( '#swipebox-caption' ).animate( { top : 0 }, 500 );
|
417
|
+
$( '#swipebox-action' ).animate( { bottom : 0 }, 500 );
|
418
|
+
setTimeout( function() {
|
419
|
+
bars.addClass( 'visible-bars' );
|
420
|
+
}, 1000 );
|
315
421
|
}
|
316
422
|
},
|
317
423
|
|
318
|
-
|
319
|
-
|
320
|
-
|
321
|
-
|
322
|
-
|
323
|
-
|
324
|
-
|
325
|
-
|
326
|
-
|
327
|
-
},
|
424
|
+
/**
|
425
|
+
* Hide navigation and title bars
|
426
|
+
*/
|
427
|
+
hideBars : function () {
|
428
|
+
var bars = $( '#swipebox-caption, #swipebox-action' );
|
429
|
+
if ( this.doCssTrans() ) {
|
430
|
+
bars.removeClass( 'visible-bars' );
|
431
|
+
} else {
|
432
|
+
$( '#swipebox-caption' ).animate( { top : '-50px' }, 500 );
|
433
|
+
$( '#swipebox-action' ).animate( { bottom : '-50px' }, 500 );
|
434
|
+
setTimeout( function() {
|
435
|
+
bars.removeClass( 'visible-bars' );
|
436
|
+
}, 1000 );
|
328
437
|
}
|
329
438
|
},
|
330
439
|
|
331
|
-
|
332
|
-
|
333
|
-
|
440
|
+
/**
|
441
|
+
* Animate navigation and top bars
|
442
|
+
*/
|
443
|
+
animBars : function () {
|
444
|
+
var $this = this,
|
445
|
+
bars = $( '#swipebox-caption, #swipebox-action' );
|
334
446
|
|
335
|
-
bars.addClass('visible-bars');
|
447
|
+
bars.addClass( 'visible-bars' );
|
336
448
|
$this.setTimeout();
|
337
449
|
|
338
|
-
$('#swipebox-slider').click(function(
|
339
|
-
if(!bars.hasClass('visible-bars')){
|
450
|
+
$( '#swipebox-slider' ).click( function() {
|
451
|
+
if ( ! bars.hasClass( 'visible-bars' ) ) {
|
340
452
|
$this.showBars();
|
341
453
|
$this.setTimeout();
|
342
454
|
}
|
343
|
-
});
|
455
|
+
} );
|
344
456
|
|
345
|
-
$('#swipebox-action').hover(function() {
|
346
|
-
|
347
|
-
|
348
|
-
|
457
|
+
$( '#swipebox-action' ).hover( function() {
|
458
|
+
$this.showBars();
|
459
|
+
bars.addClass( 'visible-bars' );
|
460
|
+
$this.clearTimeout();
|
349
461
|
|
350
|
-
},function() {
|
351
|
-
|
462
|
+
}, function() {
|
463
|
+
if (plugin.settings.hideBarsDelay > 0){
|
464
|
+
bars.removeClass( 'visible-bars' );
|
352
465
|
$this.setTimeout();
|
466
|
+
}
|
467
|
+
|
468
|
+
} );
|
353
469
|
|
354
|
-
});
|
355
470
|
},
|
356
471
|
|
357
|
-
|
472
|
+
/**
|
473
|
+
* Keyboard navigation
|
474
|
+
*/
|
475
|
+
keyboard : function () {
|
358
476
|
var $this = this;
|
359
|
-
$(window).bind('keyup', function(
|
360
|
-
|
361
|
-
|
362
|
-
|
477
|
+
$( window ).bind( 'keyup', function( event ) {
|
478
|
+
event.preventDefault();
|
479
|
+
event.stopPropagation();
|
480
|
+
|
481
|
+
if ( event.keyCode === 37 ) {
|
482
|
+
|
363
483
|
$this.getPrev();
|
364
|
-
|
365
|
-
else if (
|
484
|
+
|
485
|
+
} else if ( event.keyCode === 39 ) {
|
486
|
+
|
366
487
|
$this.getNext();
|
367
|
-
|
368
|
-
else if (
|
488
|
+
|
489
|
+
} else if ( event.keyCode === 27 ) {
|
490
|
+
|
369
491
|
$this.closeSlide();
|
492
|
+
|
370
493
|
}
|
371
|
-
});
|
494
|
+
} );
|
372
495
|
},
|
373
496
|
|
374
|
-
|
375
|
-
|
497
|
+
/**
|
498
|
+
* Navigation events : go to next slide, go to prevous slide and close
|
499
|
+
*/
|
500
|
+
actions : function () {
|
501
|
+
var $this = this,
|
502
|
+
action = 'touchend click'; // Just detect for both event types to allow for multi-input
|
376
503
|
|
377
|
-
if( elements.length < 2 ){
|
378
|
-
|
379
|
-
|
380
|
-
|
381
|
-
|
382
|
-
|
504
|
+
if ( elements.length < 2 ) {
|
505
|
+
|
506
|
+
$( '#swipebox-prev, #swipebox-next' ).hide();
|
507
|
+
|
508
|
+
} else {
|
509
|
+
$( '#swipebox-prev' ).bind( action, function( event ) {
|
510
|
+
event.preventDefault();
|
511
|
+
event.stopPropagation();
|
383
512
|
$this.getPrev();
|
384
513
|
$this.setTimeout();
|
385
|
-
});
|
514
|
+
} );
|
386
515
|
|
387
|
-
$('#swipebox-next').bind(
|
388
|
-
|
389
|
-
|
516
|
+
$( '#swipebox-next' ).bind( action, function( event ) {
|
517
|
+
event.preventDefault();
|
518
|
+
event.stopPropagation();
|
390
519
|
$this.getNext();
|
391
520
|
$this.setTimeout();
|
392
|
-
});
|
521
|
+
} );
|
393
522
|
}
|
394
523
|
|
395
|
-
$('#swipebox-close').bind(
|
524
|
+
$( '#swipebox-close' ).bind( action, function() {
|
396
525
|
$this.closeSlide();
|
397
|
-
});
|
526
|
+
} );
|
398
527
|
},
|
399
528
|
|
400
|
-
|
529
|
+
/**
|
530
|
+
* Set current slide
|
531
|
+
*/
|
532
|
+
setSlide : function ( index, isFirst ) {
|
401
533
|
isFirst = isFirst || false;
|
402
534
|
|
403
|
-
var slider = $('#swipebox-slider');
|
535
|
+
var slider = $( '#swipebox-slider' );
|
404
536
|
|
405
|
-
if(this.doCssTrans()){
|
406
|
-
slider.css({ left : (-index*100)+'%' });
|
407
|
-
}else{
|
408
|
-
slider.animate({ left : (-index*100)+'%' });
|
537
|
+
if ( this.doCssTrans() ) {
|
538
|
+
slider.css( { left : ( -index*100 )+'%' } );
|
539
|
+
} else {
|
540
|
+
slider.animate( { left : ( -index*100 )+'%' } );
|
409
541
|
}
|
410
542
|
|
411
|
-
$('#swipebox-slider .slide').removeClass('current');
|
412
|
-
$('#swipebox-slider .slide').eq(index).addClass('current');
|
413
|
-
this.setTitle(index);
|
543
|
+
$( '#swipebox-slider .slide' ).removeClass( 'current' );
|
544
|
+
$( '#swipebox-slider .slide' ).eq( index ).addClass( 'current' );
|
545
|
+
this.setTitle( index );
|
414
546
|
|
415
|
-
if( isFirst ){
|
547
|
+
if ( isFirst ) {
|
416
548
|
slider.fadeIn();
|
417
549
|
}
|
418
550
|
|
419
|
-
$('#swipebox-prev, #swipebox-next').removeClass('disabled');
|
420
|
-
if(index == 0){
|
421
|
-
$('#swipebox-prev').addClass('disabled');
|
422
|
-
}else if( index == elements.length - 1 ){
|
423
|
-
$('#swipebox-next').addClass('disabled');
|
424
|
-
}
|
551
|
+
$( '#swipebox-prev, #swipebox-next' ).removeClass( 'disabled' );
|
425
552
|
|
426
|
-
if (
|
427
|
-
$('#swipebox-
|
553
|
+
if ( index === 0 ) {
|
554
|
+
$( '#swipebox-prev' ).addClass( 'disabled' );
|
555
|
+
} else if ( index === elements.length - 1 && plugin.settings.loopAtEnd != true) {
|
556
|
+
$( '#swipebox-next' ).addClass( 'disabled' );
|
428
557
|
}
|
429
558
|
},
|
430
559
|
|
431
|
-
|
432
|
-
|
433
|
-
|
434
|
-
|
560
|
+
/**
|
561
|
+
* Open slide
|
562
|
+
*/
|
563
|
+
openSlide : function ( index ) {
|
564
|
+
$( 'html' ).addClass( 'swipebox-html' );
|
565
|
+
if ( isTouch ) {
|
566
|
+
$( 'html' ).addClass( 'swipebox-touch' );
|
567
|
+
}
|
568
|
+
$( window ).trigger( 'resize' ); // fix scroll bar visibility on desktop
|
569
|
+
this.setSlide( index, true );
|
435
570
|
},
|
436
571
|
|
437
|
-
|
438
|
-
|
572
|
+
/**
|
573
|
+
* Set a time out if the media is a video
|
574
|
+
*/
|
575
|
+
preloadMedia : function ( index ) {
|
576
|
+
var $this = this,
|
577
|
+
src = null;
|
439
578
|
|
440
|
-
if( elements[index] !== undefined )
|
579
|
+
if ( elements[index] !== undefined ) {
|
441
580
|
src = elements[index].href;
|
581
|
+
}
|
442
582
|
|
443
|
-
if(
|
444
|
-
setTimeout(function(){
|
445
|
-
$this.openMedia(index);
|
583
|
+
if ( ! $this.isVideo( src ) ) {
|
584
|
+
setTimeout( function() {
|
585
|
+
$this.openMedia( index );
|
446
586
|
}, 1000);
|
447
|
-
}else{
|
448
|
-
$this.openMedia(index);
|
587
|
+
} else {
|
588
|
+
$this.openMedia( index );
|
449
589
|
}
|
450
590
|
},
|
451
591
|
|
452
|
-
|
453
|
-
|
592
|
+
/**
|
593
|
+
* Open
|
594
|
+
*/
|
595
|
+
openMedia : function ( index ) {
|
596
|
+
var $this = this,
|
597
|
+
src = null;
|
454
598
|
|
455
|
-
if( elements[index] !== undefined )
|
599
|
+
if ( elements[index] !== undefined ) {
|
456
600
|
src = elements[index].href;
|
601
|
+
}
|
457
602
|
|
458
|
-
if(index < 0 || index >= elements.length){
|
603
|
+
if (index < 0 || index >= elements.length) {
|
459
604
|
return false;
|
460
605
|
}
|
461
606
|
|
462
|
-
if(
|
463
|
-
$this.loadMedia(src, function(){
|
464
|
-
$('#swipebox-slider .slide').eq(index).html(this);
|
465
|
-
});
|
466
|
-
}else{
|
467
|
-
$('#swipebox-slider .slide').eq(index).html($this.getVideo(src));
|
607
|
+
if ( ! $this.isVideo( src ) ) {
|
608
|
+
$this.loadMedia( src, function() {
|
609
|
+
$( '#swipebox-slider .slide' ).eq( index ).html( this );
|
610
|
+
} );
|
611
|
+
} else {
|
612
|
+
$( '#swipebox-slider .slide' ).eq( index ).html( $this.getVideo( src ) );
|
468
613
|
}
|
469
614
|
|
470
615
|
},
|
471
616
|
|
472
|
-
|
617
|
+
/**
|
618
|
+
* Set link title attribute as caption
|
619
|
+
*/
|
620
|
+
setTitle : function ( index ) {
|
473
621
|
var title = null;
|
474
622
|
|
475
|
-
$('#swipebox-caption').empty();
|
623
|
+
$( '#swipebox-caption' ).empty();
|
476
624
|
|
477
|
-
if( elements[index] !== undefined )
|
625
|
+
if ( elements[index] !== undefined ) {
|
478
626
|
title = elements[index].title;
|
627
|
+
}
|
479
628
|
|
480
|
-
if(title){
|
481
|
-
$('#swipebox-caption').append(title);
|
629
|
+
if ( title ) {
|
630
|
+
$( '#swipebox-caption' ).append( title );
|
482
631
|
}
|
483
632
|
},
|
484
633
|
|
485
|
-
|
634
|
+
/**
|
635
|
+
* Check if the URL is a video
|
636
|
+
*/
|
637
|
+
isVideo : function ( src ) {
|
486
638
|
|
487
|
-
if( src ){
|
488
|
-
if(
|
489
|
-
src.match(/youtube\.com\/watch\?v=([a-zA-Z0-9\-_]+)/)
|
490
|
-
|| src.match(/vimeo\.com\/([0-9]*)/)
|
491
|
-
){
|
639
|
+
if ( src ) {
|
640
|
+
if ( src.match( /youtube\.com\/watch\?v=([a-zA-Z0-9\-_]+)/) || src.match( /vimeo\.com\/([0-9]*)/ ) || src.match( /youtu\.be\/([a-zA-Z0-9\-_]+)/ ) ) {
|
492
641
|
return true;
|
493
642
|
}
|
643
|
+
|
644
|
+
if (src.toLowerCase().indexOf( "swipeboxvideo=1" ) >= 0){
|
645
|
+
|
646
|
+
return true;
|
647
|
+
}
|
494
648
|
}
|
495
649
|
|
496
650
|
},
|
497
651
|
|
498
|
-
|
499
|
-
|
500
|
-
|
501
|
-
|
502
|
-
var
|
503
|
-
|
504
|
-
|
505
|
-
|
652
|
+
/**
|
653
|
+
* Get video iframe code from URL
|
654
|
+
*/
|
655
|
+
getVideo : function( url ) {
|
656
|
+
var iframe = '',
|
657
|
+
youtubeUrl = url.match( /watch\?v=([a-zA-Z0-9\-_]+)/ ),
|
658
|
+
youtubeShortUrl = url.match(/youtu\.be\/([a-zA-Z0-9\-_]+)/),
|
659
|
+
vimeoUrl = url.match( /vimeo\.com\/([0-9]*)/ );
|
660
|
+
if ( youtubeUrl || youtubeShortUrl) {
|
661
|
+
if ( youtubeShortUrl ) {
|
662
|
+
youtubeUrl = youtubeShortUrl;
|
663
|
+
}
|
664
|
+
iframe = '<iframe width="560" height="315" src="//www.youtube.com/embed/' + youtubeUrl[1] + '" frameborder="0" allowfullscreen></iframe>';
|
506
665
|
|
507
|
-
}else if(vimeoUrl){
|
666
|
+
} else if ( vimeoUrl ) {
|
508
667
|
|
509
|
-
iframe = '<iframe width="560" height="315" src="
|
668
|
+
iframe = '<iframe width="560" height="315" src="//player.vimeo.com/video/' + vimeoUrl[1] + '?byline=0&portrait=0&color='+plugin.settings.vimeoColor+'" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>';
|
510
669
|
|
511
670
|
}
|
512
671
|
|
513
|
-
|
672
|
+
if (youtubeShortUrl || youtubeShortUrl || vimeoUrl){
|
673
|
+
|
674
|
+
} else {
|
675
|
+
iframe = '<iframe width="560" height="315" src="' + url + '" frameborder="0" allowfullscreen></iframe>';
|
676
|
+
}
|
677
|
+
|
678
|
+
return '<div class="swipebox-video-container" style="max-width:' + plugin.settings.videomaxWidth + 'px"><div class="swipebox-video">'+iframe+'</div></div>';
|
514
679
|
},
|
515
680
|
|
516
|
-
|
517
|
-
|
518
|
-
|
519
|
-
|
520
|
-
|
681
|
+
/**
|
682
|
+
* Load image
|
683
|
+
*/
|
684
|
+
loadMedia : function ( src, callback ) {
|
685
|
+
if ( ! this.isVideo( src ) ) {
|
686
|
+
var img = $( '<img>' ).on( 'load', function() {
|
687
|
+
callback.call( img );
|
688
|
+
} );
|
521
689
|
|
522
|
-
img.attr('src',src);
|
690
|
+
img.attr( 'src', src );
|
523
691
|
}
|
524
692
|
},
|
525
693
|
|
526
|
-
|
527
|
-
|
528
|
-
|
529
|
-
|
694
|
+
/**
|
695
|
+
* Get next slide
|
696
|
+
*/
|
697
|
+
getNext : function () {
|
698
|
+
var $this = this,
|
699
|
+
index = $( '#swipebox-slider .slide' ).index( $( '#swipebox-slider .slide.current' ) );
|
700
|
+
if ( index+1 < elements.length ) {
|
701
|
+
var src = $( '#swipebox-slider .slide' ).eq(index).contents().find("iframe").attr("src");
|
702
|
+
$( '#swipebox-slider .slide' ).eq(index).contents().find("iframe").attr("src",src);
|
530
703
|
index++;
|
531
|
-
$this.setSlide(index);
|
532
|
-
$this.preloadMedia(index+1);
|
533
|
-
}
|
534
|
-
|
535
|
-
|
536
|
-
|
537
|
-
|
538
|
-
|
539
|
-
|
704
|
+
$this.setSlide( index );
|
705
|
+
$this.preloadMedia( index+1 );
|
706
|
+
} else {
|
707
|
+
|
708
|
+
if (plugin.settings.loopAtEnd === true){
|
709
|
+
var src = $( '#swipebox-slider .slide' ).eq(index).contents().find("iframe").attr("src");
|
710
|
+
$( '#swipebox-slider .slide' ).eq(index).contents().find("iframe").attr("src",src);
|
711
|
+
index = 0;
|
712
|
+
$this.preloadMedia( index );
|
713
|
+
$this.setSlide( index );
|
714
|
+
$this.preloadMedia( index + 1 );
|
715
|
+
} else {
|
716
|
+
$( '#swipebox-slider' ).addClass( 'rightSpring' );
|
717
|
+
setTimeout( function() {
|
718
|
+
$( '#swipebox-slider' ).removeClass( 'rightSpring' );
|
719
|
+
}, 500 );
|
720
|
+
}
|
540
721
|
}
|
541
722
|
},
|
542
723
|
|
543
|
-
|
544
|
-
|
545
|
-
|
724
|
+
/**
|
725
|
+
* Get previous slide
|
726
|
+
*/
|
727
|
+
getPrev : function () {
|
728
|
+
var index = $( '#swipebox-slider .slide' ).index( $( '#swipebox-slider .slide.current' ) );
|
729
|
+
if ( index > 0 ) {
|
730
|
+
var src = $( '#swipebox-slider .slide' ).eq(index).contents().find("iframe").attr("src");
|
731
|
+
$( '#swipebox-slider .slide' ).eq(index).contents().find("iframe").attr("src",src);
|
546
732
|
index--;
|
547
|
-
this.setSlide(index);
|
548
|
-
this.preloadMedia(index-1);
|
549
|
-
}
|
550
|
-
|
551
|
-
|
552
|
-
|
553
|
-
|
554
|
-
|
555
|
-
},500);
|
556
|
-
}
|
733
|
+
this.setSlide( index );
|
734
|
+
this.preloadMedia( index-1 );
|
735
|
+
} else {
|
736
|
+
$( '#swipebox-slider' ).addClass( 'leftSpring' );
|
737
|
+
setTimeout( function() {
|
738
|
+
$( '#swipebox-slider' ).removeClass( 'leftSpring' );
|
739
|
+
}, 500 );
|
740
|
+
}
|
557
741
|
},
|
558
742
|
|
559
|
-
|
560
|
-
|
561
|
-
|
562
|
-
|
743
|
+
/**
|
744
|
+
* Close
|
745
|
+
*/
|
746
|
+
closeSlide : function () {
|
747
|
+
$( 'html' ).removeClass( 'swipebox-html' );
|
748
|
+
$( 'html' ).removeClass( 'swipebox-touch' );
|
749
|
+
$( window ).trigger( 'resize' );
|
563
750
|
this.destroy();
|
564
751
|
},
|
565
752
|
|
566
|
-
|
567
|
-
|
568
|
-
|
569
|
-
|
570
|
-
$(
|
571
|
-
$('
|
572
|
-
$('
|
573
|
-
|
574
|
-
|
575
|
-
|
576
|
-
|
753
|
+
/**
|
754
|
+
* Destroy the whole thing
|
755
|
+
*/
|
756
|
+
destroy : function () {
|
757
|
+
$( window ).unbind( 'keyup' );
|
758
|
+
$( 'body' ).unbind( 'touchstart' );
|
759
|
+
$( 'body' ).unbind( 'touchmove' );
|
760
|
+
$( 'body' ).unbind( 'touchend' );
|
761
|
+
$( '#swipebox-slider' ).unbind();
|
762
|
+
$( '#swipebox-overlay' ).remove();
|
763
|
+
|
764
|
+
if ( ! $.isArray( elem ) ) {
|
765
|
+
elem.removeData( '_swipebox' );
|
766
|
+
}
|
767
|
+
|
768
|
+
if ( this.target ) {
|
769
|
+
this.target.trigger( 'swipebox-destroy' );
|
770
|
+
}
|
771
|
+
|
577
772
|
$.swipebox.isOpen = false;
|
578
|
-
|
773
|
+
|
774
|
+
if ( plugin.settings.afterClose ){
|
579
775
|
plugin.settings.afterClose();
|
776
|
+
}
|
580
777
|
}
|
581
|
-
|
582
778
|
};
|
583
779
|
|
584
780
|
plugin.init();
|
585
781
|
|
586
782
|
};
|
587
783
|
|
588
|
-
$.fn.swipebox = function(options){
|
589
|
-
|
590
|
-
|
591
|
-
this
|
784
|
+
$.fn.swipebox = function( options ) {
|
785
|
+
|
786
|
+
if ( ! $.data( this, '_swipebox' ) ) {
|
787
|
+
var swipebox = new $.swipebox( this, options );
|
788
|
+
this.data( '_swipebox', swipebox );
|
592
789
|
}
|
593
|
-
return this.data('_swipebox');
|
594
|
-
|
790
|
+
return this.data( '_swipebox' );
|
791
|
+
|
792
|
+
};
|
595
793
|
|
596
|
-
}(window, document, jQuery));
|
794
|
+
}( window, document, jQuery ) );
|