Add backload
This commit is contained in:
@@ -0,0 +1,71 @@
|
||||
@charset "UTF-8";
|
||||
/*
|
||||
* blueimp Gallery Indicator CSS
|
||||
* https://github.com/blueimp/Gallery
|
||||
*
|
||||
* Copyright 2013, Sebastian Tschan
|
||||
* https://blueimp.net
|
||||
*
|
||||
* Licensed under the MIT license:
|
||||
* http://www.opensource.org/licenses/MIT
|
||||
*/
|
||||
|
||||
.blueimp-gallery > .indicator {
|
||||
position: absolute;
|
||||
top: auto;
|
||||
right: 15px;
|
||||
bottom: 15px;
|
||||
left: 15px;
|
||||
margin: 0 40px;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
text-align: center;
|
||||
line-height: 10px;
|
||||
display: none;
|
||||
}
|
||||
.blueimp-gallery > .indicator > li {
|
||||
display: inline-block;
|
||||
width: 9px;
|
||||
height: 9px;
|
||||
margin: 6px 3px 0 3px;
|
||||
-webkit-box-sizing: content-box;
|
||||
-moz-box-sizing: content-box;
|
||||
box-sizing: content-box;
|
||||
border: 1px solid transparent;
|
||||
background: #ccc;
|
||||
background: rgba(255, 255, 255, 0.25) center no-repeat;
|
||||
border-radius: 5px;
|
||||
box-shadow: 0 0 2px #000;
|
||||
opacity: 0.5;
|
||||
cursor: pointer;
|
||||
}
|
||||
.blueimp-gallery > .indicator > li:hover,
|
||||
.blueimp-gallery > .indicator > .active {
|
||||
background-color: #fff;
|
||||
border-color: #fff;
|
||||
opacity: 1;
|
||||
}
|
||||
.blueimp-gallery-controls > .indicator {
|
||||
display: block;
|
||||
/* Fix z-index issues (controls behind slide element) on Android: */
|
||||
-webkit-transform: translateZ(0);
|
||||
-moz-transform: translateZ(0);
|
||||
-ms-transform: translateZ(0);
|
||||
-o-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
}
|
||||
.blueimp-gallery-single > .indicator {
|
||||
display: none;
|
||||
}
|
||||
.blueimp-gallery > .indicator {
|
||||
-webkit-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
/* IE7 fixes */
|
||||
*+html .blueimp-gallery > .indicator > li {
|
||||
display: inline;
|
||||
}
|
||||
@@ -0,0 +1,87 @@
|
||||
@charset "UTF-8";
|
||||
/*
|
||||
* blueimp Gallery Video Factory CSS
|
||||
* https://github.com/blueimp/Gallery
|
||||
*
|
||||
* Copyright 2013, Sebastian Tschan
|
||||
* https://blueimp.net
|
||||
*
|
||||
* Licensed under the MIT license:
|
||||
* http://www.opensource.org/licenses/MIT
|
||||
*/
|
||||
|
||||
.blueimp-gallery > .slides > .slide > .video-content > img {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
margin: auto;
|
||||
width: auto;
|
||||
height: auto;
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
/* Prevent artifacts in Mozilla Firefox: */
|
||||
-moz-backface-visibility: hidden;
|
||||
}
|
||||
.blueimp-gallery > .slides > .slide > .video-content > video {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.blueimp-gallery > .slides > .slide > .video-content > iframe {
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border: none;
|
||||
}
|
||||
.blueimp-gallery > .slides > .slide > .video-playing > iframe {
|
||||
top: 0;
|
||||
}
|
||||
.blueimp-gallery > .slides > .slide > .video-content > a {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 0;
|
||||
left: 0;
|
||||
margin: -64px auto 0;
|
||||
width: 128px;
|
||||
height: 128px;
|
||||
background: url(../img/video-play.png) center no-repeat;
|
||||
opacity: 0.8;
|
||||
cursor: pointer;
|
||||
}
|
||||
.blueimp-gallery > .slides > .slide > .video-content > a:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
.blueimp-gallery > .slides > .slide > .video-playing > a,
|
||||
.blueimp-gallery > .slides > .slide > .video-playing > img {
|
||||
display: none;
|
||||
}
|
||||
.blueimp-gallery > .slides > .slide > .video-content > video {
|
||||
display: none;
|
||||
}
|
||||
.blueimp-gallery > .slides > .slide > .video-playing > video {
|
||||
display: block;
|
||||
}
|
||||
.blueimp-gallery > .slides > .slide > .video-loading > a {
|
||||
background: url(../img/loading.gif) center no-repeat;
|
||||
background-size: 64px 64px;
|
||||
}
|
||||
|
||||
/* Replace PNGs with SVGs for capable browsers (excluding IE<9) */
|
||||
body:last-child .blueimp-gallery > .slides > .slide > .video-content:not(.video-loading) > a {
|
||||
background-image: url(../img/video-play.svg);
|
||||
}
|
||||
|
||||
/* IE7 fixes */
|
||||
*+html .blueimp-gallery > .slides > .slide > .video-content {
|
||||
height: 100%;
|
||||
}
|
||||
*+html .blueimp-gallery > .slides > .slide > .video-content > a {
|
||||
left: 50%;
|
||||
margin-left: -64px;
|
||||
}
|
||||
@@ -0,0 +1,226 @@
|
||||
@charset "UTF-8";
|
||||
/*
|
||||
* blueimp Gallery CSS
|
||||
* https://github.com/blueimp/Gallery
|
||||
*
|
||||
* Copyright 2013, Sebastian Tschan
|
||||
* https://blueimp.net
|
||||
*
|
||||
* Licensed under the MIT license:
|
||||
* http://www.opensource.org/licenses/MIT
|
||||
*/
|
||||
|
||||
.blueimp-gallery,
|
||||
.blueimp-gallery > .slides > .slide > .slide-content {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
/* Prevent artifacts in Mozilla Firefox: */
|
||||
-moz-backface-visibility: hidden;
|
||||
}
|
||||
.blueimp-gallery > .slides > .slide > .slide-content {
|
||||
margin: auto;
|
||||
width: auto;
|
||||
height: auto;
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
opacity: 1;
|
||||
}
|
||||
.blueimp-gallery {
|
||||
position: fixed;
|
||||
z-index: 999999;
|
||||
overflow: hidden;
|
||||
background: #000;
|
||||
background: rgba(0, 0, 0, 0.9);
|
||||
opacity: 0;
|
||||
display: none;
|
||||
direction: ltr;
|
||||
-ms-touch-action: none;
|
||||
touch-action: none;
|
||||
}
|
||||
.blueimp-gallery-carousel {
|
||||
position: relative;
|
||||
z-index: auto;
|
||||
margin: 1em auto;
|
||||
/* Set the carousel width/height ratio to 16/9: */
|
||||
padding-bottom: 56.25%;
|
||||
box-shadow: 0 0 10px #000;
|
||||
-ms-touch-action: pan-y;
|
||||
touch-action: pan-y;
|
||||
}
|
||||
.blueimp-gallery-display {
|
||||
display: block;
|
||||
opacity: 1;
|
||||
}
|
||||
.blueimp-gallery > .slides {
|
||||
position: relative;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
.blueimp-gallery-carousel > .slides {
|
||||
position: absolute;
|
||||
}
|
||||
.blueimp-gallery > .slides > .slide {
|
||||
position: relative;
|
||||
float: left;
|
||||
height: 100%;
|
||||
text-align: center;
|
||||
-webkit-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
|
||||
-moz-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
|
||||
-ms-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
|
||||
-o-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
|
||||
transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
|
||||
}
|
||||
.blueimp-gallery,
|
||||
.blueimp-gallery > .slides > .slide > .slide-content {
|
||||
-webkit-transition: opacity 0.5s linear;
|
||||
-moz-transition: opacity 0.5s linear;
|
||||
-ms-transition: opacity 0.5s linear;
|
||||
-o-transition: opacity 0.5s linear;
|
||||
transition: opacity 0.5s linear;
|
||||
}
|
||||
.blueimp-gallery > .slides > .slide-loading {
|
||||
background: url(../img/loading.gif) center no-repeat;
|
||||
background-size: 64px 64px;
|
||||
}
|
||||
.blueimp-gallery > .slides > .slide-loading > .slide-content {
|
||||
opacity: 0;
|
||||
}
|
||||
.blueimp-gallery > .slides > .slide-error {
|
||||
background: url(../img/error.png) center no-repeat;
|
||||
}
|
||||
.blueimp-gallery > .slides > .slide-error > .slide-content {
|
||||
display: none;
|
||||
}
|
||||
.blueimp-gallery > .prev,
|
||||
.blueimp-gallery > .next {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 15px;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
margin-top: -23px;
|
||||
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
font-size: 60px;
|
||||
font-weight: 100;
|
||||
line-height: 30px;
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
text-shadow: 0 0 2px #000;
|
||||
text-align: center;
|
||||
background: #222;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
-webkit-box-sizing: content-box;
|
||||
-moz-box-sizing: content-box;
|
||||
box-sizing: content-box;
|
||||
border: 3px solid #fff;
|
||||
-webkit-border-radius: 23px;
|
||||
-moz-border-radius: 23px;
|
||||
border-radius: 23px;
|
||||
opacity: 0.5;
|
||||
cursor: pointer;
|
||||
display: none;
|
||||
}
|
||||
.blueimp-gallery > .next {
|
||||
left: auto;
|
||||
right: 15px;
|
||||
}
|
||||
.blueimp-gallery > .close,
|
||||
.blueimp-gallery > .title {
|
||||
position: absolute;
|
||||
top: 15px;
|
||||
left: 15px;
|
||||
margin: 0 40px 0 0;
|
||||
font-size: 20px;
|
||||
line-height: 30px;
|
||||
color: #fff;
|
||||
text-shadow: 0 0 2px #000;
|
||||
opacity: 0.8;
|
||||
display: none;
|
||||
}
|
||||
.blueimp-gallery > .close {
|
||||
padding: 15px;
|
||||
right: 15px;
|
||||
left: auto;
|
||||
margin: -15px;
|
||||
font-size: 30px;
|
||||
text-decoration: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
.blueimp-gallery > .play-pause {
|
||||
position: absolute;
|
||||
right: 15px;
|
||||
bottom: 15px;
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
background: url(../img/play-pause.png) 0 0 no-repeat;
|
||||
cursor: pointer;
|
||||
opacity: 0.5;
|
||||
display: none;
|
||||
}
|
||||
.blueimp-gallery-playing > .play-pause {
|
||||
background-position: -15px 0;
|
||||
}
|
||||
.blueimp-gallery > .prev:hover,
|
||||
.blueimp-gallery > .next:hover,
|
||||
.blueimp-gallery > .close:hover,
|
||||
.blueimp-gallery > .title:hover,
|
||||
.blueimp-gallery > .play-pause:hover {
|
||||
color: #fff;
|
||||
opacity: 1;
|
||||
}
|
||||
.blueimp-gallery-controls > .prev,
|
||||
.blueimp-gallery-controls > .next,
|
||||
.blueimp-gallery-controls > .close,
|
||||
.blueimp-gallery-controls > .title,
|
||||
.blueimp-gallery-controls > .play-pause {
|
||||
display: block;
|
||||
/* Fix z-index issues (controls behind slide element) on Android: */
|
||||
-webkit-transform: translateZ(0);
|
||||
-moz-transform: translateZ(0);
|
||||
-ms-transform: translateZ(0);
|
||||
-o-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
}
|
||||
.blueimp-gallery-single > .prev,
|
||||
.blueimp-gallery-left > .prev,
|
||||
.blueimp-gallery-single > .next,
|
||||
.blueimp-gallery-right > .next,
|
||||
.blueimp-gallery-single > .play-pause {
|
||||
display: none;
|
||||
}
|
||||
.blueimp-gallery > .slides > .slide > .slide-content,
|
||||
.blueimp-gallery > .prev,
|
||||
.blueimp-gallery > .next,
|
||||
.blueimp-gallery > .close,
|
||||
.blueimp-gallery > .play-pause {
|
||||
-webkit-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
/* Replace PNGs with SVGs for capable browsers (excluding IE<9) */
|
||||
body:last-child .blueimp-gallery > .slides > .slide-error {
|
||||
background-image: url(../img/error.svg);
|
||||
}
|
||||
body:last-child .blueimp-gallery > .play-pause {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
background-size: 40px 20px;
|
||||
background-image: url(../img/play-pause.svg);
|
||||
}
|
||||
body:last-child .blueimp-gallery-playing > .play-pause {
|
||||
background-position: -20px 0;
|
||||
}
|
||||
|
||||
/* IE7 fixes */
|
||||
*+html .blueimp-gallery > .slides > .slide {
|
||||
min-height: 300px;
|
||||
}
|
||||
*+html .blueimp-gallery > .slides > .slide > .slide-content {
|
||||
position: relative;
|
||||
}
|
||||
@@ -0,0 +1,3 @@
|
||||
@import (inline) 'blueimp-gallery.css';
|
||||
@import (inline) 'blueimp-gallery-indicator.css';
|
||||
@import (inline) 'blueimp-gallery-video.css';
|
||||
File diff suppressed because one or more lines are too long
Binary file not shown.
|
After Width: | Height: | Size: 2.2 KiB |
@@ -0,0 +1,5 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="64" height="64">
|
||||
<circle cx="32" cy="32" r="25" stroke="red" stroke-width="7" fill="black" fill-opacity="0.2"/>
|
||||
<rect x="28" y="7" width="8" height="50" fill="red" transform="rotate(45, 32, 32)"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 306 B |
Binary file not shown.
|
After Width: | Height: | Size: 3.8 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 606 B |
@@ -0,0 +1,6 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="30" height="15">
|
||||
<polygon points="2,1 2,14 13,7" stroke="black" stroke-width="1" fill="white"/>
|
||||
<rect x="17" y="2" width="4" height="11" stroke="black" stroke-width="1" fill="white"/>
|
||||
<rect x="24" y="2" width="4" height="11" stroke="black" stroke-width="1" fill="white"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 382 B |
Binary file not shown.
|
After Width: | Height: | Size: 2.7 KiB |
@@ -0,0 +1,5 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="64" height="64">
|
||||
<circle cx="32" cy="32" r="25" stroke="white" stroke-width="7" fill="black" fill-opacity="0.2"/>
|
||||
<polygon points="26,22 26,42 43,32" fill="white"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 274 B |
@@ -0,0 +1,89 @@
|
||||
/*
|
||||
* blueimp Gallery Fullscreen JS
|
||||
* https://github.com/blueimp/Gallery
|
||||
*
|
||||
* Copyright 2013, Sebastian Tschan
|
||||
* https://blueimp.net
|
||||
*
|
||||
* Licensed under the MIT license:
|
||||
* http://www.opensource.org/licenses/MIT
|
||||
*/
|
||||
|
||||
/* global define, window, document */
|
||||
|
||||
;(function (factory) {
|
||||
'use strict'
|
||||
if (typeof define === 'function' && define.amd) {
|
||||
// Register as an anonymous AMD module:
|
||||
define([
|
||||
'./blueimp-helper',
|
||||
'./blueimp-gallery'
|
||||
], factory)
|
||||
} else {
|
||||
// Browser globals:
|
||||
factory(
|
||||
window.blueimp.helper || window.jQuery,
|
||||
window.blueimp.Gallery
|
||||
)
|
||||
}
|
||||
}(function ($, Gallery) {
|
||||
'use strict'
|
||||
|
||||
$.extend(Gallery.prototype.options, {
|
||||
// Defines if the gallery should open in fullscreen mode:
|
||||
fullScreen: false
|
||||
})
|
||||
|
||||
var initialize = Gallery.prototype.initialize
|
||||
var close = Gallery.prototype.close
|
||||
|
||||
$.extend(Gallery.prototype, {
|
||||
getFullScreenElement: function () {
|
||||
return document.fullscreenElement ||
|
||||
document.webkitFullscreenElement ||
|
||||
document.mozFullScreenElement ||
|
||||
document.msFullscreenElement
|
||||
},
|
||||
|
||||
requestFullScreen: function (element) {
|
||||
if (element.requestFullscreen) {
|
||||
element.requestFullscreen()
|
||||
} else if (element.webkitRequestFullscreen) {
|
||||
element.webkitRequestFullscreen()
|
||||
} else if (element.mozRequestFullScreen) {
|
||||
element.mozRequestFullScreen()
|
||||
} else if (element.msRequestFullscreen) {
|
||||
element.msRequestFullscreen()
|
||||
}
|
||||
},
|
||||
|
||||
exitFullScreen: function () {
|
||||
if (document.exitFullscreen) {
|
||||
document.exitFullscreen()
|
||||
} else if (document.webkitCancelFullScreen) {
|
||||
document.webkitCancelFullScreen()
|
||||
} else if (document.mozCancelFullScreen) {
|
||||
document.mozCancelFullScreen()
|
||||
} else if (document.msExitFullscreen) {
|
||||
document.msExitFullscreen()
|
||||
}
|
||||
},
|
||||
|
||||
initialize: function () {
|
||||
initialize.call(this)
|
||||
if (this.options.fullScreen && !this.getFullScreenElement()) {
|
||||
this.requestFullScreen(this.container[0])
|
||||
}
|
||||
},
|
||||
|
||||
close: function () {
|
||||
if (this.getFullScreenElement() === this.container[0]) {
|
||||
this.exitFullScreen()
|
||||
}
|
||||
close.call(this)
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
return Gallery
|
||||
}))
|
||||
@@ -0,0 +1,155 @@
|
||||
/*
|
||||
* blueimp Gallery Indicator JS
|
||||
* https://github.com/blueimp/Gallery
|
||||
*
|
||||
* Copyright 2013, Sebastian Tschan
|
||||
* https://blueimp.net
|
||||
*
|
||||
* Licensed under the MIT license:
|
||||
* http://www.opensource.org/licenses/MIT
|
||||
*/
|
||||
|
||||
/* global define, window, document */
|
||||
|
||||
;(function (factory) {
|
||||
'use strict'
|
||||
if (typeof define === 'function' && define.amd) {
|
||||
// Register as an anonymous AMD module:
|
||||
define([
|
||||
'./blueimp-helper',
|
||||
'./blueimp-gallery'
|
||||
], factory)
|
||||
} else {
|
||||
// Browser globals:
|
||||
factory(
|
||||
window.blueimp.helper || window.jQuery,
|
||||
window.blueimp.Gallery
|
||||
)
|
||||
}
|
||||
}(function ($, Gallery) {
|
||||
'use strict'
|
||||
|
||||
$.extend(Gallery.prototype.options, {
|
||||
// The tag name, Id, element or querySelector of the indicator container:
|
||||
indicatorContainer: 'ol',
|
||||
// The class for the active indicator:
|
||||
activeIndicatorClass: 'active',
|
||||
// The list object property (or data attribute) with the thumbnail URL,
|
||||
// used as alternative to a thumbnail child element:
|
||||
thumbnailProperty: 'thumbnail',
|
||||
// Defines if the gallery indicators should display a thumbnail:
|
||||
thumbnailIndicators: true
|
||||
})
|
||||
|
||||
var initSlides = Gallery.prototype.initSlides
|
||||
var addSlide = Gallery.prototype.addSlide
|
||||
var resetSlides = Gallery.prototype.resetSlides
|
||||
var handleClick = Gallery.prototype.handleClick
|
||||
var handleSlide = Gallery.prototype.handleSlide
|
||||
var handleClose = Gallery.prototype.handleClose
|
||||
|
||||
$.extend(Gallery.prototype, {
|
||||
createIndicator: function (obj) {
|
||||
var indicator = this.indicatorPrototype.cloneNode(false)
|
||||
var title = this.getItemProperty(obj, this.options.titleProperty)
|
||||
var thumbnailProperty = this.options.thumbnailProperty
|
||||
var thumbnailUrl
|
||||
var thumbnail
|
||||
if (this.options.thumbnailIndicators) {
|
||||
if (thumbnailProperty) {
|
||||
thumbnailUrl = this.getItemProperty(obj, thumbnailProperty)
|
||||
}
|
||||
if (thumbnailUrl === undefined) {
|
||||
thumbnail = obj.getElementsByTagName && $(obj).find('img')[0]
|
||||
if (thumbnail) {
|
||||
thumbnailUrl = thumbnail.src
|
||||
}
|
||||
}
|
||||
if (thumbnailUrl) {
|
||||
indicator.style.backgroundImage = 'url("' + thumbnailUrl + '")'
|
||||
}
|
||||
}
|
||||
if (title) {
|
||||
indicator.title = title
|
||||
}
|
||||
return indicator
|
||||
},
|
||||
|
||||
addIndicator: function (index) {
|
||||
if (this.indicatorContainer.length) {
|
||||
var indicator = this.createIndicator(this.list[index])
|
||||
indicator.setAttribute('data-index', index)
|
||||
this.indicatorContainer[0].appendChild(indicator)
|
||||
this.indicators.push(indicator)
|
||||
}
|
||||
},
|
||||
|
||||
setActiveIndicator: function (index) {
|
||||
if (this.indicators) {
|
||||
if (this.activeIndicator) {
|
||||
this.activeIndicator
|
||||
.removeClass(this.options.activeIndicatorClass)
|
||||
}
|
||||
this.activeIndicator = $(this.indicators[index])
|
||||
this.activeIndicator
|
||||
.addClass(this.options.activeIndicatorClass)
|
||||
}
|
||||
},
|
||||
|
||||
initSlides: function (reload) {
|
||||
if (!reload) {
|
||||
this.indicatorContainer = this.container.find(
|
||||
this.options.indicatorContainer
|
||||
)
|
||||
if (this.indicatorContainer.length) {
|
||||
this.indicatorPrototype = document.createElement('li')
|
||||
this.indicators = this.indicatorContainer[0].children
|
||||
}
|
||||
}
|
||||
initSlides.call(this, reload)
|
||||
},
|
||||
|
||||
addSlide: function (index) {
|
||||
addSlide.call(this, index)
|
||||
this.addIndicator(index)
|
||||
},
|
||||
|
||||
resetSlides: function () {
|
||||
resetSlides.call(this)
|
||||
this.indicatorContainer.empty()
|
||||
this.indicators = []
|
||||
},
|
||||
|
||||
handleClick: function (event) {
|
||||
var target = event.target || event.srcElement
|
||||
var parent = target.parentNode
|
||||
if (parent === this.indicatorContainer[0]) {
|
||||
// Click on indicator element
|
||||
this.preventDefault(event)
|
||||
this.slide(this.getNodeIndex(target))
|
||||
} else if (parent.parentNode === this.indicatorContainer[0]) {
|
||||
// Click on indicator child element
|
||||
this.preventDefault(event)
|
||||
this.slide(this.getNodeIndex(parent))
|
||||
} else {
|
||||
return handleClick.call(this, event)
|
||||
}
|
||||
},
|
||||
|
||||
handleSlide: function (index) {
|
||||
handleSlide.call(this, index)
|
||||
this.setActiveIndicator(index)
|
||||
},
|
||||
|
||||
handleClose: function () {
|
||||
if (this.activeIndicator) {
|
||||
this.activeIndicator
|
||||
.removeClass(this.options.activeIndicatorClass)
|
||||
}
|
||||
handleClose.call(this)
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
return Gallery
|
||||
}))
|
||||
@@ -0,0 +1,170 @@
|
||||
/*
|
||||
* blueimp Gallery Video Factory JS
|
||||
* https://github.com/blueimp/Gallery
|
||||
*
|
||||
* Copyright 2013, Sebastian Tschan
|
||||
* https://blueimp.net
|
||||
*
|
||||
* Licensed under the MIT license:
|
||||
* http://www.opensource.org/licenses/MIT
|
||||
*/
|
||||
|
||||
/* global define, window, document */
|
||||
|
||||
;(function (factory) {
|
||||
'use strict'
|
||||
if (typeof define === 'function' && define.amd) {
|
||||
// Register as an anonymous AMD module:
|
||||
define([
|
||||
'./blueimp-helper',
|
||||
'./blueimp-gallery'
|
||||
], factory)
|
||||
} else {
|
||||
// Browser globals:
|
||||
factory(
|
||||
window.blueimp.helper || window.jQuery,
|
||||
window.blueimp.Gallery
|
||||
)
|
||||
}
|
||||
}(function ($, Gallery) {
|
||||
'use strict'
|
||||
|
||||
$.extend(Gallery.prototype.options, {
|
||||
// The class for video content elements:
|
||||
videoContentClass: 'video-content',
|
||||
// The class for video when it is loading:
|
||||
videoLoadingClass: 'video-loading',
|
||||
// The class for video when it is playing:
|
||||
videoPlayingClass: 'video-playing',
|
||||
// The list object property (or data attribute) for the video poster URL:
|
||||
videoPosterProperty: 'poster',
|
||||
// The list object property (or data attribute) for the video sources array:
|
||||
videoSourcesProperty: 'sources'
|
||||
})
|
||||
|
||||
var handleSlide = Gallery.prototype.handleSlide
|
||||
|
||||
$.extend(Gallery.prototype, {
|
||||
handleSlide: function (index) {
|
||||
handleSlide.call(this, index)
|
||||
if (this.playingVideo) {
|
||||
this.playingVideo.pause()
|
||||
}
|
||||
},
|
||||
|
||||
videoFactory: function (obj, callback, videoInterface) {
|
||||
var that = this
|
||||
var options = this.options
|
||||
var videoContainerNode = this.elementPrototype.cloneNode(false)
|
||||
var videoContainer = $(videoContainerNode)
|
||||
var errorArgs = [{
|
||||
type: 'error',
|
||||
target: videoContainerNode
|
||||
}]
|
||||
var video = videoInterface || document.createElement('video')
|
||||
var url = this.getItemProperty(obj, options.urlProperty)
|
||||
var type = this.getItemProperty(obj, options.typeProperty)
|
||||
var title = this.getItemProperty(obj, options.titleProperty)
|
||||
var posterUrl = this.getItemProperty(obj, options.videoPosterProperty)
|
||||
var posterImage
|
||||
var sources = this.getItemProperty(
|
||||
obj,
|
||||
options.videoSourcesProperty
|
||||
)
|
||||
var source
|
||||
var playMediaControl
|
||||
var isLoading
|
||||
var hasControls
|
||||
videoContainer.addClass(options.videoContentClass)
|
||||
if (title) {
|
||||
videoContainerNode.title = title
|
||||
}
|
||||
if (video.canPlayType) {
|
||||
if (url && type && video.canPlayType(type)) {
|
||||
video.src = url
|
||||
} else {
|
||||
while (sources && sources.length) {
|
||||
source = sources.shift()
|
||||
url = this.getItemProperty(source, options.urlProperty)
|
||||
type = this.getItemProperty(source, options.typeProperty)
|
||||
if (url && type && video.canPlayType(type)) {
|
||||
video.src = url
|
||||
break
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
if (posterUrl) {
|
||||
video.poster = posterUrl
|
||||
posterImage = this.imagePrototype.cloneNode(false)
|
||||
$(posterImage).addClass(options.toggleClass)
|
||||
posterImage.src = posterUrl
|
||||
posterImage.draggable = false
|
||||
videoContainerNode.appendChild(posterImage)
|
||||
}
|
||||
playMediaControl = document.createElement('a')
|
||||
playMediaControl.setAttribute('target', '_blank')
|
||||
if (!videoInterface) {
|
||||
playMediaControl.setAttribute('download', title)
|
||||
}
|
||||
playMediaControl.href = url
|
||||
if (video.src) {
|
||||
video.controls = true
|
||||
;(videoInterface || $(video))
|
||||
.on('error', function () {
|
||||
that.setTimeout(callback, errorArgs)
|
||||
})
|
||||
.on('pause', function () {
|
||||
isLoading = false
|
||||
videoContainer
|
||||
.removeClass(that.options.videoLoadingClass)
|
||||
.removeClass(that.options.videoPlayingClass)
|
||||
if (hasControls) {
|
||||
that.container.addClass(that.options.controlsClass)
|
||||
}
|
||||
delete that.playingVideo
|
||||
if (that.interval) {
|
||||
that.play()
|
||||
}
|
||||
})
|
||||
.on('playing', function () {
|
||||
isLoading = false
|
||||
videoContainer
|
||||
.removeClass(that.options.videoLoadingClass)
|
||||
.addClass(that.options.videoPlayingClass)
|
||||
if (that.container.hasClass(that.options.controlsClass)) {
|
||||
hasControls = true
|
||||
that.container.removeClass(that.options.controlsClass)
|
||||
} else {
|
||||
hasControls = false
|
||||
}
|
||||
})
|
||||
.on('play', function () {
|
||||
window.clearTimeout(that.timeout)
|
||||
isLoading = true
|
||||
videoContainer.addClass(that.options.videoLoadingClass)
|
||||
that.playingVideo = video
|
||||
})
|
||||
$(playMediaControl).on('click', function (event) {
|
||||
that.preventDefault(event)
|
||||
if (isLoading) {
|
||||
video.pause()
|
||||
} else {
|
||||
video.play()
|
||||
}
|
||||
})
|
||||
videoContainerNode.appendChild(
|
||||
(videoInterface && videoInterface.element) || video
|
||||
)
|
||||
}
|
||||
videoContainerNode.appendChild(playMediaControl)
|
||||
this.setTimeout(callback, [{
|
||||
type: 'load',
|
||||
target: videoContainerNode
|
||||
}])
|
||||
return videoContainerNode
|
||||
}
|
||||
})
|
||||
|
||||
return Gallery
|
||||
}))
|
||||
@@ -0,0 +1,213 @@
|
||||
/*
|
||||
* blueimp Gallery Vimeo Video Factory JS
|
||||
* https://github.com/blueimp/Gallery
|
||||
*
|
||||
* Copyright 2013, Sebastian Tschan
|
||||
* https://blueimp.net
|
||||
*
|
||||
* Licensed under the MIT license:
|
||||
* http://www.opensource.org/licenses/MIT
|
||||
*/
|
||||
|
||||
/* global define, window, document, $f */
|
||||
|
||||
;(function (factory) {
|
||||
'use strict'
|
||||
if (typeof define === 'function' && define.amd) {
|
||||
// Register as an anonymous AMD module:
|
||||
define([
|
||||
'./blueimp-helper',
|
||||
'./blueimp-gallery-video'
|
||||
], factory)
|
||||
} else {
|
||||
// Browser globals:
|
||||
factory(
|
||||
window.blueimp.helper || window.jQuery,
|
||||
window.blueimp.Gallery
|
||||
)
|
||||
}
|
||||
}(function ($, Gallery) {
|
||||
'use strict'
|
||||
|
||||
if (!window.postMessage) {
|
||||
return Gallery
|
||||
}
|
||||
|
||||
$.extend(Gallery.prototype.options, {
|
||||
// The list object property (or data attribute) with the Vimeo video id:
|
||||
vimeoVideoIdProperty: 'vimeo',
|
||||
// The URL for the Vimeo video player, can be extended with custom parameters:
|
||||
// https://developer.vimeo.com/player/embedding
|
||||
vimeoPlayerUrl: '//player.vimeo.com/video/VIDEO_ID?api=1&player_id=PLAYER_ID',
|
||||
// The prefix for the Vimeo video player ID:
|
||||
vimeoPlayerIdPrefix: 'vimeo-player-',
|
||||
// Require a click on the native Vimeo player for the initial playback:
|
||||
vimeoClickToPlay: true
|
||||
})
|
||||
|
||||
var textFactory = Gallery.prototype.textFactory ||
|
||||
Gallery.prototype.imageFactory
|
||||
var VimeoPlayer = function (url, videoId, playerId, clickToPlay) {
|
||||
this.url = url
|
||||
this.videoId = videoId
|
||||
this.playerId = playerId
|
||||
this.clickToPlay = clickToPlay
|
||||
this.element = document.createElement('div')
|
||||
this.listeners = {}
|
||||
}
|
||||
var counter = 0
|
||||
|
||||
$.extend(VimeoPlayer.prototype, {
|
||||
canPlayType: function () {
|
||||
return true
|
||||
},
|
||||
|
||||
on: function (type, func) {
|
||||
this.listeners[type] = func
|
||||
return this
|
||||
},
|
||||
|
||||
loadAPI: function () {
|
||||
var that = this
|
||||
var apiUrl = '//f.vimeocdn.com/js/froogaloop2.min.js'
|
||||
var scriptTags = document.getElementsByTagName('script')
|
||||
var i = scriptTags.length
|
||||
var scriptTag
|
||||
var called
|
||||
function callback () {
|
||||
if (!called && that.playOnReady) {
|
||||
that.play()
|
||||
}
|
||||
called = true
|
||||
}
|
||||
while (i) {
|
||||
i -= 1
|
||||
if (scriptTags[i].src === apiUrl) {
|
||||
scriptTag = scriptTags[i]
|
||||
break
|
||||
}
|
||||
}
|
||||
if (!scriptTag) {
|
||||
scriptTag = document.createElement('script')
|
||||
scriptTag.src = apiUrl
|
||||
}
|
||||
$(scriptTag).on('load', callback)
|
||||
scriptTags[0].parentNode.insertBefore(scriptTag, scriptTags[0])
|
||||
// Fix for cached scripts on IE 8:
|
||||
if (/loaded|complete/.test(scriptTag.readyState)) {
|
||||
callback()
|
||||
}
|
||||
},
|
||||
|
||||
onReady: function () {
|
||||
var that = this
|
||||
this.ready = true
|
||||
this.player.addEvent('play', function () {
|
||||
that.hasPlayed = true
|
||||
that.onPlaying()
|
||||
})
|
||||
this.player.addEvent('pause', function () {
|
||||
that.onPause()
|
||||
})
|
||||
this.player.addEvent('finish', function () {
|
||||
that.onPause()
|
||||
})
|
||||
if (this.playOnReady) {
|
||||
this.play()
|
||||
}
|
||||
},
|
||||
|
||||
onPlaying: function () {
|
||||
if (this.playStatus < 2) {
|
||||
this.listeners.playing()
|
||||
this.playStatus = 2
|
||||
}
|
||||
},
|
||||
|
||||
onPause: function () {
|
||||
this.listeners.pause()
|
||||
delete this.playStatus
|
||||
},
|
||||
|
||||
insertIframe: function () {
|
||||
var iframe = document.createElement('iframe')
|
||||
iframe.src = this.url
|
||||
.replace('VIDEO_ID', this.videoId)
|
||||
.replace('PLAYER_ID', this.playerId)
|
||||
iframe.id = this.playerId
|
||||
this.element.parentNode.replaceChild(iframe, this.element)
|
||||
this.element = iframe
|
||||
},
|
||||
|
||||
play: function () {
|
||||
var that = this
|
||||
if (!this.playStatus) {
|
||||
this.listeners.play()
|
||||
this.playStatus = 1
|
||||
}
|
||||
if (this.ready) {
|
||||
if (!this.hasPlayed && (this.clickToPlay || (window.navigator &&
|
||||
/iP(hone|od|ad)/.test(window.navigator.platform)))) {
|
||||
// Manually trigger the playing callback if clickToPlay
|
||||
// is enabled and to workaround a limitation in iOS,
|
||||
// which requires synchronous user interaction to start
|
||||
// the video playback:
|
||||
this.onPlaying()
|
||||
} else {
|
||||
this.player.api('play')
|
||||
}
|
||||
} else {
|
||||
this.playOnReady = true
|
||||
if (!window.$f) {
|
||||
this.loadAPI()
|
||||
} else if (!this.player) {
|
||||
this.insertIframe()
|
||||
this.player = $f(this.element)
|
||||
this.player.addEvent('ready', function () {
|
||||
that.onReady()
|
||||
})
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
pause: function () {
|
||||
if (this.ready) {
|
||||
this.player.api('pause')
|
||||
} else if (this.playStatus) {
|
||||
delete this.playOnReady
|
||||
this.listeners.pause()
|
||||
delete this.playStatus
|
||||
}
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
$.extend(Gallery.prototype, {
|
||||
VimeoPlayer: VimeoPlayer,
|
||||
|
||||
textFactory: function (obj, callback) {
|
||||
var options = this.options
|
||||
var videoId = this.getItemProperty(obj, options.vimeoVideoIdProperty)
|
||||
if (videoId) {
|
||||
if (this.getItemProperty(obj, options.urlProperty) === undefined) {
|
||||
obj[options.urlProperty] = '//vimeo.com/' + videoId
|
||||
}
|
||||
counter += 1
|
||||
return this.videoFactory(
|
||||
obj,
|
||||
callback,
|
||||
new VimeoPlayer(
|
||||
options.vimeoPlayerUrl,
|
||||
videoId,
|
||||
options.vimeoPlayerIdPrefix + counter,
|
||||
options.vimeoClickToPlay
|
||||
)
|
||||
)
|
||||
}
|
||||
return textFactory.call(this, obj, callback)
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
return Gallery
|
||||
}))
|
||||
@@ -0,0 +1,228 @@
|
||||
/*
|
||||
* blueimp Gallery YouTube Video Factory JS
|
||||
* https://github.com/blueimp/Gallery
|
||||
*
|
||||
* Copyright 2013, Sebastian Tschan
|
||||
* https://blueimp.net
|
||||
*
|
||||
* Licensed under the MIT license:
|
||||
* http://www.opensource.org/licenses/MIT
|
||||
*/
|
||||
|
||||
/* global define, window, document, YT */
|
||||
|
||||
;(function (factory) {
|
||||
'use strict'
|
||||
if (typeof define === 'function' && define.amd) {
|
||||
// Register as an anonymous AMD module:
|
||||
define([
|
||||
'./blueimp-helper',
|
||||
'./blueimp-gallery-video'
|
||||
], factory)
|
||||
} else {
|
||||
// Browser globals:
|
||||
factory(
|
||||
window.blueimp.helper || window.jQuery,
|
||||
window.blueimp.Gallery
|
||||
)
|
||||
}
|
||||
}(function ($, Gallery) {
|
||||
'use strict'
|
||||
|
||||
if (!window.postMessage) {
|
||||
return Gallery
|
||||
}
|
||||
|
||||
$.extend(Gallery.prototype.options, {
|
||||
// The list object property (or data attribute) with the YouTube video id:
|
||||
youTubeVideoIdProperty: 'youtube',
|
||||
// Optional object with parameters passed to the YouTube video player:
|
||||
// https://developers.google.com/youtube/player_parameters
|
||||
youTubePlayerVars: {
|
||||
wmode: 'transparent'
|
||||
},
|
||||
// Require a click on the native YouTube player for the initial playback:
|
||||
youTubeClickToPlay: true
|
||||
})
|
||||
|
||||
var textFactory = Gallery.prototype.textFactory ||
|
||||
Gallery.prototype.imageFactory
|
||||
var YouTubePlayer = function (videoId, playerVars, clickToPlay) {
|
||||
this.videoId = videoId
|
||||
this.playerVars = playerVars
|
||||
this.clickToPlay = clickToPlay
|
||||
this.element = document.createElement('div')
|
||||
this.listeners = {}
|
||||
}
|
||||
|
||||
$.extend(YouTubePlayer.prototype, {
|
||||
canPlayType: function () {
|
||||
return true
|
||||
},
|
||||
|
||||
on: function (type, func) {
|
||||
this.listeners[type] = func
|
||||
return this
|
||||
},
|
||||
|
||||
loadAPI: function () {
|
||||
var that = this
|
||||
var onYouTubeIframeAPIReady = window.onYouTubeIframeAPIReady
|
||||
var apiUrl = '//www.youtube.com/iframe_api'
|
||||
var scriptTags = document.getElementsByTagName('script')
|
||||
var i = scriptTags.length
|
||||
var scriptTag
|
||||
window.onYouTubeIframeAPIReady = function () {
|
||||
if (onYouTubeIframeAPIReady) {
|
||||
onYouTubeIframeAPIReady.apply(this)
|
||||
}
|
||||
if (that.playOnReady) {
|
||||
that.play()
|
||||
}
|
||||
}
|
||||
while (i) {
|
||||
i -= 1
|
||||
if (scriptTags[i].src === apiUrl) {
|
||||
return
|
||||
}
|
||||
}
|
||||
scriptTag = document.createElement('script')
|
||||
scriptTag.src = apiUrl
|
||||
scriptTags[0].parentNode.insertBefore(scriptTag, scriptTags[0])
|
||||
},
|
||||
|
||||
onReady: function () {
|
||||
this.ready = true
|
||||
if (this.playOnReady) {
|
||||
this.play()
|
||||
}
|
||||
},
|
||||
|
||||
onPlaying: function () {
|
||||
if (this.playStatus < 2) {
|
||||
this.listeners.playing()
|
||||
this.playStatus = 2
|
||||
}
|
||||
},
|
||||
|
||||
onPause: function () {
|
||||
Gallery.prototype.setTimeout.call(
|
||||
this,
|
||||
this.checkSeek,
|
||||
null,
|
||||
2000
|
||||
)
|
||||
},
|
||||
|
||||
checkSeek: function () {
|
||||
if (this.stateChange === YT.PlayerState.PAUSED ||
|
||||
this.stateChange === YT.PlayerState.ENDED) {
|
||||
// check if current state change is actually paused
|
||||
this.listeners.pause()
|
||||
delete this.playStatus
|
||||
}
|
||||
},
|
||||
|
||||
onStateChange: function (event) {
|
||||
switch (event.data) {
|
||||
case YT.PlayerState.PLAYING:
|
||||
this.hasPlayed = true
|
||||
this.onPlaying()
|
||||
break
|
||||
case YT.PlayerState.PAUSED:
|
||||
case YT.PlayerState.ENDED:
|
||||
this.onPause()
|
||||
break
|
||||
}
|
||||
// Save most recent state change to this.stateChange
|
||||
this.stateChange = event.data
|
||||
},
|
||||
|
||||
onError: function (event) {
|
||||
this.listeners.error(event)
|
||||
},
|
||||
|
||||
play: function () {
|
||||
var that = this
|
||||
if (!this.playStatus) {
|
||||
this.listeners.play()
|
||||
this.playStatus = 1
|
||||
}
|
||||
if (this.ready) {
|
||||
if (!this.hasPlayed && (this.clickToPlay || (window.navigator &&
|
||||
/iP(hone|od|ad)/.test(window.navigator.platform)))) {
|
||||
// Manually trigger the playing callback if clickToPlay
|
||||
// is enabled and to workaround a limitation in iOS,
|
||||
// which requires synchronous user interaction to start
|
||||
// the video playback:
|
||||
this.onPlaying()
|
||||
} else {
|
||||
this.player.playVideo()
|
||||
}
|
||||
} else {
|
||||
this.playOnReady = true
|
||||
if (!(window.YT && YT.Player)) {
|
||||
this.loadAPI()
|
||||
} else if (!this.player) {
|
||||
this.player = new YT.Player(this.element, {
|
||||
videoId: this.videoId,
|
||||
playerVars: this.playerVars,
|
||||
events: {
|
||||
onReady: function () {
|
||||
that.onReady()
|
||||
},
|
||||
onStateChange: function (event) {
|
||||
that.onStateChange(event)
|
||||
},
|
||||
onError: function (event) {
|
||||
that.onError(event)
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
pause: function () {
|
||||
if (this.ready) {
|
||||
this.player.pauseVideo()
|
||||
} else if (this.playStatus) {
|
||||
delete this.playOnReady
|
||||
this.listeners.pause()
|
||||
delete this.playStatus
|
||||
}
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
$.extend(Gallery.prototype, {
|
||||
YouTubePlayer: YouTubePlayer,
|
||||
|
||||
textFactory: function (obj, callback) {
|
||||
var options = this.options
|
||||
var videoId = this.getItemProperty(obj, options.youTubeVideoIdProperty)
|
||||
if (videoId) {
|
||||
if (this.getItemProperty(obj, options.urlProperty) === undefined) {
|
||||
obj[options.urlProperty] = '//www.youtube.com/watch?v=' + videoId
|
||||
}
|
||||
if (this.getItemProperty(obj, options.videoPosterProperty) === undefined) {
|
||||
obj[options.videoPosterProperty] = '//img.youtube.com/vi/' + videoId +
|
||||
'/maxresdefault.jpg'
|
||||
}
|
||||
return this.videoFactory(
|
||||
obj,
|
||||
callback,
|
||||
new YouTubePlayer(
|
||||
videoId,
|
||||
options.youTubePlayerVars,
|
||||
options.youTubeClickToPlay
|
||||
)
|
||||
)
|
||||
}
|
||||
return textFactory.call(this, obj, callback)
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
return Gallery
|
||||
}))
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
@@ -0,0 +1,190 @@
|
||||
/*
|
||||
* blueimp helper JS
|
||||
* https://github.com/blueimp/Gallery
|
||||
*
|
||||
* Copyright 2013, Sebastian Tschan
|
||||
* https://blueimp.net
|
||||
*
|
||||
* Licensed under the MIT license:
|
||||
* http://www.opensource.org/licenses/MIT
|
||||
*/
|
||||
|
||||
/* global define, window, document */
|
||||
|
||||
;(function () {
|
||||
'use strict'
|
||||
|
||||
function extend (obj1, obj2) {
|
||||
var prop
|
||||
for (prop in obj2) {
|
||||
if (obj2.hasOwnProperty(prop)) {
|
||||
obj1[prop] = obj2[prop]
|
||||
}
|
||||
}
|
||||
return obj1
|
||||
}
|
||||
|
||||
function Helper (query) {
|
||||
if (!this || this.find !== Helper.prototype.find) {
|
||||
// Called as function instead of as constructor,
|
||||
// so we simply return a new instance:
|
||||
return new Helper(query)
|
||||
}
|
||||
this.length = 0
|
||||
if (query) {
|
||||
if (typeof query === 'string') {
|
||||
query = this.find(query)
|
||||
}
|
||||
if (query.nodeType || query === query.window) {
|
||||
// Single HTML element
|
||||
this.length = 1
|
||||
this[0] = query
|
||||
} else {
|
||||
// HTML element collection
|
||||
var i = query.length
|
||||
this.length = i
|
||||
while (i) {
|
||||
i -= 1
|
||||
this[i] = query[i]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Helper.extend = extend
|
||||
|
||||
Helper.contains = function (container, element) {
|
||||
do {
|
||||
element = element.parentNode
|
||||
if (element === container) {
|
||||
return true
|
||||
}
|
||||
} while (element)
|
||||
return false
|
||||
}
|
||||
|
||||
Helper.parseJSON = function (string) {
|
||||
return window.JSON && JSON.parse(string)
|
||||
}
|
||||
|
||||
extend(Helper.prototype, {
|
||||
find: function (query) {
|
||||
var container = this[0] || document
|
||||
if (typeof query === 'string') {
|
||||
if (container.querySelectorAll) {
|
||||
query = container.querySelectorAll(query)
|
||||
} else if (query.charAt(0) === '#') {
|
||||
query = container.getElementById(query.slice(1))
|
||||
} else {
|
||||
query = container.getElementsByTagName(query)
|
||||
}
|
||||
}
|
||||
return new Helper(query)
|
||||
},
|
||||
|
||||
hasClass: function (className) {
|
||||
if (!this[0]) {
|
||||
return false
|
||||
}
|
||||
return new RegExp('(^|\\s+)' + className +
|
||||
'(\\s+|$)').test(this[0].className)
|
||||
},
|
||||
|
||||
addClass: function (className) {
|
||||
var i = this.length
|
||||
var element
|
||||
while (i) {
|
||||
i -= 1
|
||||
element = this[i]
|
||||
if (!element.className) {
|
||||
element.className = className
|
||||
return this
|
||||
}
|
||||
if (this.hasClass(className)) {
|
||||
return this
|
||||
}
|
||||
element.className += ' ' + className
|
||||
}
|
||||
return this
|
||||
},
|
||||
|
||||
removeClass: function (className) {
|
||||
var regexp = new RegExp('(^|\\s+)' + className + '(\\s+|$)')
|
||||
var i = this.length
|
||||
var element
|
||||
while (i) {
|
||||
i -= 1
|
||||
element = this[i]
|
||||
element.className = element.className.replace(regexp, ' ')
|
||||
}
|
||||
return this
|
||||
},
|
||||
|
||||
on: function (eventName, handler) {
|
||||
var eventNames = eventName.split(/\s+/)
|
||||
var i
|
||||
var element
|
||||
while (eventNames.length) {
|
||||
eventName = eventNames.shift()
|
||||
i = this.length
|
||||
while (i) {
|
||||
i -= 1
|
||||
element = this[i]
|
||||
if (element.addEventListener) {
|
||||
element.addEventListener(eventName, handler, false)
|
||||
} else if (element.attachEvent) {
|
||||
element.attachEvent('on' + eventName, handler)
|
||||
}
|
||||
}
|
||||
}
|
||||
return this
|
||||
},
|
||||
|
||||
off: function (eventName, handler) {
|
||||
var eventNames = eventName.split(/\s+/)
|
||||
var i
|
||||
var element
|
||||
while (eventNames.length) {
|
||||
eventName = eventNames.shift()
|
||||
i = this.length
|
||||
while (i) {
|
||||
i -= 1
|
||||
element = this[i]
|
||||
if (element.removeEventListener) {
|
||||
element.removeEventListener(eventName, handler, false)
|
||||
} else if (element.detachEvent) {
|
||||
element.detachEvent('on' + eventName, handler)
|
||||
}
|
||||
}
|
||||
}
|
||||
return this
|
||||
},
|
||||
|
||||
empty: function () {
|
||||
var i = this.length
|
||||
var element
|
||||
while (i) {
|
||||
i -= 1
|
||||
element = this[i]
|
||||
while (element.hasChildNodes()) {
|
||||
element.removeChild(element.lastChild)
|
||||
}
|
||||
}
|
||||
return this
|
||||
},
|
||||
|
||||
first: function () {
|
||||
return new Helper(this[0])
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
if (typeof define === 'function' && define.amd) {
|
||||
define(function () {
|
||||
return Helper
|
||||
})
|
||||
} else {
|
||||
window.blueimp = window.blueimp || {}
|
||||
window.blueimp.helper = Helper
|
||||
}
|
||||
}())
|
||||
@@ -0,0 +1,83 @@
|
||||
/*
|
||||
* blueimp Gallery jQuery plugin
|
||||
* https://github.com/blueimp/Gallery
|
||||
*
|
||||
* Copyright 2013, Sebastian Tschan
|
||||
* https://blueimp.net
|
||||
*
|
||||
* Licensed under the MIT license:
|
||||
* http://www.opensource.org/licenses/MIT
|
||||
*/
|
||||
|
||||
/* global define, window, document */
|
||||
|
||||
;(function (factory) {
|
||||
'use strict'
|
||||
if (typeof define === 'function' && define.amd) {
|
||||
define([
|
||||
'jquery',
|
||||
'./blueimp-gallery'
|
||||
], factory)
|
||||
} else {
|
||||
factory(
|
||||
window.jQuery,
|
||||
window.blueimp.Gallery
|
||||
)
|
||||
}
|
||||
}(function ($, Gallery) {
|
||||
'use strict'
|
||||
|
||||
// Global click handler to open links with data-gallery attribute
|
||||
// in the Gallery lightbox:
|
||||
$(document).on('click', '[data-gallery]', function (event) {
|
||||
// Get the container id from the data-gallery attribute:
|
||||
var id = $(this).data('gallery')
|
||||
var widget = $(id)
|
||||
var container = (widget.length && widget) ||
|
||||
$(Gallery.prototype.options.container)
|
||||
var callbacks = {
|
||||
onopen: function () {
|
||||
container
|
||||
.data('gallery', this)
|
||||
.trigger('open')
|
||||
},
|
||||
onopened: function () {
|
||||
container.trigger('opened')
|
||||
},
|
||||
onslide: function () {
|
||||
container.trigger('slide', arguments)
|
||||
},
|
||||
onslideend: function () {
|
||||
container.trigger('slideend', arguments)
|
||||
},
|
||||
onslidecomplete: function () {
|
||||
container.trigger('slidecomplete', arguments)
|
||||
},
|
||||
onclose: function () {
|
||||
container.trigger('close')
|
||||
},
|
||||
onclosed: function () {
|
||||
container
|
||||
.trigger('closed')
|
||||
.removeData('gallery')
|
||||
}
|
||||
}
|
||||
var options = $.extend(
|
||||
// Retrieve custom options from data-attributes
|
||||
// on the Gallery widget:
|
||||
container.data(),
|
||||
{
|
||||
container: container[0],
|
||||
index: this,
|
||||
event: event
|
||||
},
|
||||
callbacks
|
||||
)
|
||||
// Select all links with the same data-gallery attribute:
|
||||
var links = $('[data-gallery="' + id + '"]')
|
||||
if (options.filter) {
|
||||
links = links.filter(options.filter)
|
||||
}
|
||||
return new Gallery(links, options)
|
||||
})
|
||||
}))
|
||||
File diff suppressed because one or more lines are too long
@@ -0,0 +1,52 @@
|
||||
{
|
||||
"name": "blueimp-gallery",
|
||||
"version": "2.20.0",
|
||||
"title": "blueimp Gallery",
|
||||
"description": "blueimp Gallery is a touch-enabled, responsive and customizable image and video gallery, carousel and lightbox, optimized for both mobile and desktop web browsers. It features swipe, mouse and keyboard navigation, transition effects, slideshow functionality, fullscreen support and on-demand content loading and can be extended to display additional content types.",
|
||||
"keywords": [
|
||||
"image",
|
||||
"video",
|
||||
"gallery",
|
||||
"carousel",
|
||||
"lightbox",
|
||||
"mobile",
|
||||
"desktop",
|
||||
"touch",
|
||||
"responsive",
|
||||
"swipe",
|
||||
"mouse",
|
||||
"keyboard",
|
||||
"navigation",
|
||||
"transition",
|
||||
"effects",
|
||||
"slideshow",
|
||||
"fullscreen"
|
||||
],
|
||||
"homepage": "https://github.com/blueimp/Gallery",
|
||||
"author": {
|
||||
"name": "Sebastian Tschan",
|
||||
"url": "https://blueimp.net"
|
||||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git://github.com/blueimp/Gallery.git"
|
||||
},
|
||||
"license": "MIT",
|
||||
"devDependencies": {
|
||||
"less": "2.5.3",
|
||||
"less-plugin-clean-css": "1.5.1",
|
||||
"standard": "6.0.7",
|
||||
"uglify-js": "2.6.1"
|
||||
},
|
||||
"scripts": {
|
||||
"test": "standard js/*.js",
|
||||
"build:js": "cd js && uglifyjs blueimp-helper.js blueimp-gallery.js blueimp-gallery-fullscreen.js blueimp-gallery-indicator.js blueimp-gallery-video.js blueimp-gallery-vimeo.js blueimp-gallery-youtube.js -c -m -o blueimp-gallery.min.js --source-map blueimp-gallery.min.js.map",
|
||||
"build:jquery": "cd js && uglifyjs blueimp-gallery.js blueimp-gallery-fullscreen.js blueimp-gallery-indicator.js blueimp-gallery-video.js blueimp-gallery-vimeo.js blueimp-gallery-youtube.js jquery.blueimp-gallery.js -c -m -o jquery.blueimp-gallery.min.js --source-map jquery.blueimp-gallery.min.js.map",
|
||||
"build:less": "cd css && lessc --clean-css --source-map blueimp-gallery.less blueimp-gallery.min.css",
|
||||
"build": "npm run build:js && npm run build:jquery && npm run build:less",
|
||||
"preversion": "npm test",
|
||||
"version": "npm run build && git add -A js",
|
||||
"postversion": "git push --tags origin master master:gh-pages && npm publish"
|
||||
},
|
||||
"main": "js/blueimp-gallery.js"
|
||||
}
|
||||
Reference in New Issue
Block a user