first commit
This commit is contained in:
3425
libraries/fancybox3/js/core.js
Normal file
3425
libraries/fancybox3/js/core.js
Normal file
File diff suppressed because it is too large
Load Diff
173
libraries/fancybox3/js/fullscreen.js
Normal file
173
libraries/fancybox3/js/fullscreen.js
Normal file
@@ -0,0 +1,173 @@
|
||||
// ==========================================================================
|
||||
//
|
||||
// FullScreen
|
||||
// Adds fullscreen functionality
|
||||
//
|
||||
// ==========================================================================
|
||||
(function (document, $) {
|
||||
"use strict";
|
||||
|
||||
// Collection of methods supported by user browser
|
||||
var fn = (function () {
|
||||
var fnMap = [
|
||||
["requestFullscreen", "exitFullscreen", "fullscreenElement", "fullscreenEnabled", "fullscreenchange", "fullscreenerror"],
|
||||
// new WebKit
|
||||
[
|
||||
"webkitRequestFullscreen",
|
||||
"webkitExitFullscreen",
|
||||
"webkitFullscreenElement",
|
||||
"webkitFullscreenEnabled",
|
||||
"webkitfullscreenchange",
|
||||
"webkitfullscreenerror"
|
||||
],
|
||||
// old WebKit (Safari 5.1)
|
||||
[
|
||||
"webkitRequestFullScreen",
|
||||
"webkitCancelFullScreen",
|
||||
"webkitCurrentFullScreenElement",
|
||||
"webkitCancelFullScreen",
|
||||
"webkitfullscreenchange",
|
||||
"webkitfullscreenerror"
|
||||
],
|
||||
[
|
||||
"mozRequestFullScreen",
|
||||
"mozCancelFullScreen",
|
||||
"mozFullScreenElement",
|
||||
"mozFullScreenEnabled",
|
||||
"mozfullscreenchange",
|
||||
"mozfullscreenerror"
|
||||
],
|
||||
["msRequestFullscreen", "msExitFullscreen", "msFullscreenElement", "msFullscreenEnabled", "MSFullscreenChange", "MSFullscreenError"]
|
||||
];
|
||||
|
||||
var ret = {};
|
||||
|
||||
for (var i = 0; i < fnMap.length; i++) {
|
||||
var val = fnMap[i];
|
||||
|
||||
if (val && val[1] in document) {
|
||||
for (var j = 0; j < val.length; j++) {
|
||||
ret[fnMap[0][j]] = val[j];
|
||||
}
|
||||
|
||||
return ret;
|
||||
}
|
||||
}
|
||||
|
||||
return false;
|
||||
})();
|
||||
|
||||
if (fn) {
|
||||
var FullScreen = {
|
||||
request: function (elem) {
|
||||
elem = elem || document.documentElement;
|
||||
|
||||
elem[fn.requestFullscreen](elem.ALLOW_KEYBOARD_INPUT);
|
||||
},
|
||||
exit: function () {
|
||||
document[fn.exitFullscreen]();
|
||||
},
|
||||
toggle: function (elem) {
|
||||
elem = elem || document.documentElement;
|
||||
|
||||
if (this.isFullscreen()) {
|
||||
this.exit();
|
||||
} else {
|
||||
this.request(elem);
|
||||
}
|
||||
},
|
||||
isFullscreen: function () {
|
||||
return Boolean(document[fn.fullscreenElement]);
|
||||
},
|
||||
enabled: function () {
|
||||
return Boolean(document[fn.fullscreenEnabled]);
|
||||
}
|
||||
};
|
||||
|
||||
$.extend(true, $.fancybox.defaults, {
|
||||
btnTpl: {
|
||||
fullScreen: '<button data-fancybox-fullscreen class="fancybox-button fancybox-button--fsenter" title="{{FULL_SCREEN}}">' +
|
||||
'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M7 14H5v5h5v-2H7v-3zm-2-4h2V7h3V5H5v5zm12 7h-3v2h5v-5h-2v3zM14 5v2h3v3h2V5h-5z"/></svg>' +
|
||||
'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M5 16h3v3h2v-5H5zm3-8H5v2h5V5H8zm6 11h2v-3h3v-2h-5zm2-11V5h-2v5h5V8z"/></svg>' +
|
||||
"</button>"
|
||||
},
|
||||
fullScreen: {
|
||||
autoStart: false
|
||||
}
|
||||
});
|
||||
|
||||
$(document).on(fn.fullscreenchange, function () {
|
||||
var isFullscreen = FullScreen.isFullscreen(),
|
||||
instance = $.fancybox.getInstance();
|
||||
|
||||
if (instance) {
|
||||
// If image is zooming, then force to stop and reposition properly
|
||||
if (instance.current && instance.current.type === "image" && instance.isAnimating) {
|
||||
instance.isAnimating = false;
|
||||
|
||||
instance.update(true, true, 0);
|
||||
|
||||
if (!instance.isComplete) {
|
||||
instance.complete();
|
||||
}
|
||||
}
|
||||
|
||||
instance.trigger("onFullscreenChange", isFullscreen);
|
||||
|
||||
instance.$refs.container.toggleClass("fancybox-is-fullscreen", isFullscreen);
|
||||
|
||||
instance.$refs.toolbar
|
||||
.find("[data-fancybox-fullscreen]")
|
||||
.toggleClass("fancybox-button--fsenter", !isFullscreen)
|
||||
.toggleClass("fancybox-button--fsexit", isFullscreen);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
$(document).on({
|
||||
"onInit.fb": function (e, instance) {
|
||||
var $container;
|
||||
|
||||
if (!fn) {
|
||||
instance.$refs.toolbar.find("[data-fancybox-fullscreen]").remove();
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
if (instance && instance.group[instance.currIndex].opts.fullScreen) {
|
||||
$container = instance.$refs.container;
|
||||
|
||||
$container.on("click.fb-fullscreen", "[data-fancybox-fullscreen]", function (e) {
|
||||
e.stopPropagation();
|
||||
e.preventDefault();
|
||||
|
||||
FullScreen.toggle();
|
||||
});
|
||||
|
||||
if (instance.opts.fullScreen && instance.opts.fullScreen.autoStart === true) {
|
||||
FullScreen.request();
|
||||
}
|
||||
|
||||
// Expose API
|
||||
instance.FullScreen = FullScreen;
|
||||
} else if (instance) {
|
||||
instance.$refs.toolbar.find("[data-fancybox-fullscreen]").hide();
|
||||
}
|
||||
},
|
||||
|
||||
"afterKeydown.fb": function (e, instance, current, keypress, keycode) {
|
||||
// "F"
|
||||
if (instance && instance.FullScreen && keycode === 70) {
|
||||
keypress.preventDefault();
|
||||
|
||||
instance.FullScreen.toggle();
|
||||
}
|
||||
},
|
||||
|
||||
"beforeClose.fb": function (e, instance) {
|
||||
if (instance && instance.FullScreen && instance.$refs.container.hasClass("fancybox-is-fullscreen")) {
|
||||
FullScreen.exit();
|
||||
}
|
||||
}
|
||||
});
|
||||
})(document, jQuery);
|
||||
923
libraries/fancybox3/js/guestures.js
Normal file
923
libraries/fancybox3/js/guestures.js
Normal file
@@ -0,0 +1,923 @@
|
||||
// ==========================================================================
|
||||
//
|
||||
// Guestures
|
||||
// Adds touch guestures, handles click and tap events
|
||||
//
|
||||
// ==========================================================================
|
||||
(function (window, document, $) {
|
||||
"use strict";
|
||||
|
||||
var requestAFrame = (function () {
|
||||
return (
|
||||
window.requestAnimationFrame ||
|
||||
window.webkitRequestAnimationFrame ||
|
||||
window.mozRequestAnimationFrame ||
|
||||
window.oRequestAnimationFrame ||
|
||||
// if all else fails, use setTimeout
|
||||
function (callback) {
|
||||
return window.setTimeout(callback, 1000 / 60);
|
||||
}
|
||||
);
|
||||
})();
|
||||
|
||||
var cancelAFrame = (function () {
|
||||
return (
|
||||
window.cancelAnimationFrame ||
|
||||
window.webkitCancelAnimationFrame ||
|
||||
window.mozCancelAnimationFrame ||
|
||||
window.oCancelAnimationFrame ||
|
||||
function (id) {
|
||||
window.clearTimeout(id);
|
||||
}
|
||||
);
|
||||
})();
|
||||
|
||||
var getPointerXY = function (e) {
|
||||
var result = [];
|
||||
|
||||
e = e.originalEvent || e || window.e;
|
||||
e = e.touches && e.touches.length ? e.touches : e.changedTouches && e.changedTouches.length ? e.changedTouches : [e];
|
||||
|
||||
for (var key in e) {
|
||||
if (e[key].pageX) {
|
||||
result.push({
|
||||
x: e[key].pageX,
|
||||
y: e[key].pageY
|
||||
});
|
||||
} else if (e[key].clientX) {
|
||||
result.push({
|
||||
x: e[key].clientX,
|
||||
y: e[key].clientY
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
return result;
|
||||
};
|
||||
|
||||
var distance = function (point2, point1, what) {
|
||||
if (!point1 || !point2) {
|
||||
return 0;
|
||||
}
|
||||
|
||||
if (what === "x") {
|
||||
return point2.x - point1.x;
|
||||
} else if (what === "y") {
|
||||
return point2.y - point1.y;
|
||||
}
|
||||
|
||||
return Math.sqrt(Math.pow(point2.x - point1.x, 2) + Math.pow(point2.y - point1.y, 2));
|
||||
};
|
||||
|
||||
var isClickable = function ($el) {
|
||||
if (
|
||||
$el.is('a,area,button,[role="button"],input,label,select,summary,textarea,video,audio,iframe') ||
|
||||
$.isFunction($el.get(0).onclick) ||
|
||||
$el.data("selectable")
|
||||
) {
|
||||
return true;
|
||||
}
|
||||
|
||||
// Check for attributes like data-fancybox-next or data-fancybox-close
|
||||
for (var i = 0, atts = $el[0].attributes, n = atts.length; i < n; i++) {
|
||||
if (atts[i].nodeName.substr(0, 14) === "data-fancybox-") {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
|
||||
return false;
|
||||
};
|
||||
|
||||
var hasScrollbars = function (el) {
|
||||
var overflowY = window.getComputedStyle(el)["overflow-y"],
|
||||
overflowX = window.getComputedStyle(el)["overflow-x"],
|
||||
vertical = (overflowY === "scroll" || overflowY === "auto") && el.scrollHeight > el.clientHeight,
|
||||
horizontal = (overflowX === "scroll" || overflowX === "auto") && el.scrollWidth > el.clientWidth;
|
||||
|
||||
return vertical || horizontal;
|
||||
};
|
||||
|
||||
var isScrollable = function ($el) {
|
||||
var rez = false;
|
||||
|
||||
while (true) {
|
||||
rez = hasScrollbars($el.get(0));
|
||||
|
||||
if (rez) {
|
||||
break;
|
||||
}
|
||||
|
||||
$el = $el.parent();
|
||||
|
||||
if (!$el.length || $el.hasClass("fancybox-stage") || $el.is("body")) {
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
return rez;
|
||||
};
|
||||
|
||||
var Guestures = function (instance) {
|
||||
var self = this;
|
||||
|
||||
self.instance = instance;
|
||||
|
||||
self.$bg = instance.$refs.bg;
|
||||
self.$stage = instance.$refs.stage;
|
||||
self.$container = instance.$refs.container;
|
||||
|
||||
self.destroy();
|
||||
|
||||
self.$container.on("touchstart.fb.touch mousedown.fb.touch", $.proxy(self, "ontouchstart"));
|
||||
};
|
||||
|
||||
Guestures.prototype.destroy = function () {
|
||||
var self = this;
|
||||
|
||||
self.$container.off(".fb.touch");
|
||||
|
||||
$(document).off(".fb.touch");
|
||||
|
||||
if (self.requestId) {
|
||||
cancelAFrame(self.requestId);
|
||||
self.requestId = null;
|
||||
}
|
||||
|
||||
if (self.tapped) {
|
||||
clearTimeout(self.tapped);
|
||||
self.tapped = null;
|
||||
}
|
||||
};
|
||||
|
||||
Guestures.prototype.ontouchstart = function (e) {
|
||||
var self = this,
|
||||
$target = $(e.target),
|
||||
instance = self.instance,
|
||||
current = instance.current,
|
||||
$slide = current.$slide,
|
||||
$content = current.$content,
|
||||
isTouchDevice = e.type == "touchstart";
|
||||
|
||||
// Do not respond to both (touch and mouse) events
|
||||
if (isTouchDevice) {
|
||||
self.$container.off("mousedown.fb.touch");
|
||||
}
|
||||
|
||||
// Ignore right click
|
||||
if (e.originalEvent && e.originalEvent.button == 2) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Ignore taping on links, buttons, input elements
|
||||
if (!$slide.length || !$target.length || isClickable($target) || isClickable($target.parent())) {
|
||||
return;
|
||||
}
|
||||
// Ignore clicks on the scrollbar
|
||||
if (!$target.is("img") && e.originalEvent.clientX > $target[0].clientWidth + $target.offset().left) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Ignore clicks while zooming or closing
|
||||
if (!current || instance.isAnimating || current.$slide.hasClass("fancybox-animated")) {
|
||||
e.stopPropagation();
|
||||
e.preventDefault();
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
self.realPoints = self.startPoints = getPointerXY(e);
|
||||
|
||||
if (!self.startPoints.length) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Allow other scripts to catch touch event if "touch" is set to false
|
||||
if (current.touch) {
|
||||
e.stopPropagation();
|
||||
}
|
||||
|
||||
self.startEvent = e;
|
||||
|
||||
self.canTap = true;
|
||||
self.$target = $target;
|
||||
self.$content = $content;
|
||||
self.opts = current.opts.touch;
|
||||
|
||||
self.isPanning = false;
|
||||
self.isSwiping = false;
|
||||
self.isZooming = false;
|
||||
self.isScrolling = false;
|
||||
self.canPan = instance.canPan();
|
||||
|
||||
self.startTime = new Date().getTime();
|
||||
self.distanceX = self.distanceY = self.distance = 0;
|
||||
|
||||
self.canvasWidth = Math.round($slide[0].clientWidth);
|
||||
self.canvasHeight = Math.round($slide[0].clientHeight);
|
||||
|
||||
self.contentLastPos = null;
|
||||
self.contentStartPos = $.fancybox.getTranslate(self.$content) || {
|
||||
top: 0,
|
||||
left: 0
|
||||
};
|
||||
self.sliderStartPos = $.fancybox.getTranslate($slide);
|
||||
|
||||
// Since position will be absolute, but we need to make it relative to the stage
|
||||
self.stagePos = $.fancybox.getTranslate(instance.$refs.stage);
|
||||
|
||||
self.sliderStartPos.top -= self.stagePos.top;
|
||||
self.sliderStartPos.left -= self.stagePos.left;
|
||||
|
||||
self.contentStartPos.top -= self.stagePos.top;
|
||||
self.contentStartPos.left -= self.stagePos.left;
|
||||
|
||||
$(document)
|
||||
.off(".fb.touch")
|
||||
.on(isTouchDevice ? "touchend.fb.touch touchcancel.fb.touch" : "mouseup.fb.touch mouseleave.fb.touch", $.proxy(self, "ontouchend"))
|
||||
.on(isTouchDevice ? "touchmove.fb.touch" : "mousemove.fb.touch", $.proxy(self, "ontouchmove"));
|
||||
|
||||
if ($.fancybox.isMobile) {
|
||||
document.addEventListener("scroll", self.onscroll, true);
|
||||
}
|
||||
|
||||
// Skip if clicked outside the sliding area
|
||||
if (!(self.opts || self.canPan) || !($target.is(self.$stage) || self.$stage.find($target).length)) {
|
||||
if ($target.is(".fancybox-image")) {
|
||||
e.preventDefault();
|
||||
}
|
||||
|
||||
if (!($.fancybox.isMobile && $target.parents(".fancybox-caption").length)) {
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
self.isScrollable = isScrollable($target) || isScrollable($target.parent());
|
||||
|
||||
// Check if element is scrollable and try to prevent default behavior (scrolling)
|
||||
if (!($.fancybox.isMobile && self.isScrollable)) {
|
||||
e.preventDefault();
|
||||
}
|
||||
|
||||
// One finger or mouse click - swipe or pan an image
|
||||
if (self.startPoints.length === 1 || current.hasError) {
|
||||
if (self.canPan) {
|
||||
$.fancybox.stop(self.$content);
|
||||
|
||||
self.isPanning = true;
|
||||
} else {
|
||||
self.isSwiping = true;
|
||||
}
|
||||
|
||||
self.$container.addClass("fancybox-is-grabbing");
|
||||
}
|
||||
|
||||
// Two fingers - zoom image
|
||||
if (self.startPoints.length === 2 && current.type === "image" && (current.isLoaded || current.$ghost)) {
|
||||
self.canTap = false;
|
||||
self.isSwiping = false;
|
||||
self.isPanning = false;
|
||||
|
||||
self.isZooming = true;
|
||||
|
||||
$.fancybox.stop(self.$content);
|
||||
|
||||
self.centerPointStartX = (self.startPoints[0].x + self.startPoints[1].x) * 0.5 - $(window).scrollLeft();
|
||||
self.centerPointStartY = (self.startPoints[0].y + self.startPoints[1].y) * 0.5 - $(window).scrollTop();
|
||||
|
||||
self.percentageOfImageAtPinchPointX = (self.centerPointStartX - self.contentStartPos.left) / self.contentStartPos.width;
|
||||
self.percentageOfImageAtPinchPointY = (self.centerPointStartY - self.contentStartPos.top) / self.contentStartPos.height;
|
||||
|
||||
self.startDistanceBetweenFingers = distance(self.startPoints[0], self.startPoints[1]);
|
||||
}
|
||||
};
|
||||
|
||||
Guestures.prototype.onscroll = function (e) {
|
||||
var self = this;
|
||||
|
||||
self.isScrolling = true;
|
||||
|
||||
document.removeEventListener("scroll", self.onscroll, true);
|
||||
};
|
||||
|
||||
Guestures.prototype.ontouchmove = function (e) {
|
||||
var self = this;
|
||||
|
||||
// Make sure user has not released over iframe or disabled element
|
||||
if (e.originalEvent.buttons !== undefined && e.originalEvent.buttons === 0) {
|
||||
self.ontouchend(e);
|
||||
return;
|
||||
}
|
||||
|
||||
if (self.isScrolling) {
|
||||
self.canTap = false;
|
||||
return;
|
||||
}
|
||||
|
||||
self.newPoints = getPointerXY(e);
|
||||
|
||||
if (!(self.opts || self.canPan) || !self.newPoints.length || !self.newPoints.length) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (!(self.isSwiping && self.isSwiping === true)) {
|
||||
e.preventDefault();
|
||||
}
|
||||
|
||||
self.distanceX = distance(self.newPoints[0], self.startPoints[0], "x");
|
||||
self.distanceY = distance(self.newPoints[0], self.startPoints[0], "y");
|
||||
|
||||
self.distance = distance(self.newPoints[0], self.startPoints[0]);
|
||||
|
||||
// Skip false ontouchmove events (Chrome)
|
||||
if (self.distance > 0) {
|
||||
if (self.isSwiping) {
|
||||
self.onSwipe(e);
|
||||
} else if (self.isPanning) {
|
||||
self.onPan();
|
||||
} else if (self.isZooming) {
|
||||
self.onZoom();
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
Guestures.prototype.onSwipe = function (e) {
|
||||
var self = this,
|
||||
instance = self.instance,
|
||||
swiping = self.isSwiping,
|
||||
left = self.sliderStartPos.left || 0,
|
||||
angle;
|
||||
|
||||
// If direction is not yet determined
|
||||
if (swiping === true) {
|
||||
// We need at least 10px distance to correctly calculate an angle
|
||||
if (Math.abs(self.distance) > 10) {
|
||||
self.canTap = false;
|
||||
|
||||
if (instance.group.length < 2 && self.opts.vertical) {
|
||||
self.isSwiping = "y";
|
||||
} else if (instance.isDragging || self.opts.vertical === false || (self.opts.vertical === "auto" && $(window).width() > 800)) {
|
||||
self.isSwiping = "x";
|
||||
} else {
|
||||
angle = Math.abs((Math.atan2(self.distanceY, self.distanceX) * 180) / Math.PI);
|
||||
|
||||
self.isSwiping = angle > 45 && angle < 135 ? "y" : "x";
|
||||
}
|
||||
|
||||
if (self.isSwiping === "y" && $.fancybox.isMobile && self.isScrollable) {
|
||||
self.isScrolling = true;
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
instance.isDragging = self.isSwiping;
|
||||
|
||||
// Reset points to avoid jumping, because we dropped first swipes to calculate the angle
|
||||
self.startPoints = self.newPoints;
|
||||
|
||||
$.each(instance.slides, function (index, slide) {
|
||||
var slidePos, stagePos;
|
||||
|
||||
$.fancybox.stop(slide.$slide);
|
||||
|
||||
slidePos = $.fancybox.getTranslate(slide.$slide);
|
||||
stagePos = $.fancybox.getTranslate(instance.$refs.stage);
|
||||
|
||||
slide.$slide
|
||||
.css({
|
||||
transform: "",
|
||||
opacity: "",
|
||||
"transition-duration": ""
|
||||
})
|
||||
.removeClass("fancybox-animated")
|
||||
.removeClass(function (index, className) {
|
||||
return (className.match(/(^|\s)fancybox-fx-\S+/g) || []).join(" ");
|
||||
});
|
||||
|
||||
if (slide.pos === instance.current.pos) {
|
||||
self.sliderStartPos.top = slidePos.top - stagePos.top;
|
||||
self.sliderStartPos.left = slidePos.left - stagePos.left;
|
||||
}
|
||||
|
||||
$.fancybox.setTranslate(slide.$slide, {
|
||||
top: slidePos.top - stagePos.top,
|
||||
left: slidePos.left - stagePos.left
|
||||
});
|
||||
});
|
||||
|
||||
// Stop slideshow
|
||||
if (instance.SlideShow && instance.SlideShow.isActive) {
|
||||
instance.SlideShow.stop();
|
||||
}
|
||||
}
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
// Sticky edges
|
||||
if (swiping == "x") {
|
||||
if (
|
||||
self.distanceX > 0 &&
|
||||
(self.instance.group.length < 2 || (self.instance.current.index === 0 && !self.instance.current.opts.loop))
|
||||
) {
|
||||
left = left + Math.pow(self.distanceX, 0.8);
|
||||
} else if (
|
||||
self.distanceX < 0 &&
|
||||
(self.instance.group.length < 2 ||
|
||||
(self.instance.current.index === self.instance.group.length - 1 && !self.instance.current.opts.loop))
|
||||
) {
|
||||
left = left - Math.pow(-self.distanceX, 0.8);
|
||||
} else {
|
||||
left = left + self.distanceX;
|
||||
}
|
||||
}
|
||||
|
||||
self.sliderLastPos = {
|
||||
top: swiping == "x" ? 0 : self.sliderStartPos.top + self.distanceY,
|
||||
left: left
|
||||
};
|
||||
|
||||
if (self.requestId) {
|
||||
cancelAFrame(self.requestId);
|
||||
|
||||
self.requestId = null;
|
||||
}
|
||||
|
||||
self.requestId = requestAFrame(function () {
|
||||
if (self.sliderLastPos) {
|
||||
$.each(self.instance.slides, function (index, slide) {
|
||||
var pos = slide.pos - self.instance.currPos;
|
||||
|
||||
$.fancybox.setTranslate(slide.$slide, {
|
||||
top: self.sliderLastPos.top,
|
||||
left: self.sliderLastPos.left + pos * self.canvasWidth + pos * slide.opts.gutter
|
||||
});
|
||||
});
|
||||
|
||||
self.$container.addClass("fancybox-is-sliding");
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
Guestures.prototype.onPan = function () {
|
||||
var self = this;
|
||||
|
||||
// Prevent accidental movement (sometimes, when tapping casually, finger can move a bit)
|
||||
if (distance(self.newPoints[0], self.realPoints[0]) < ($.fancybox.isMobile ? 10 : 5)) {
|
||||
self.startPoints = self.newPoints;
|
||||
return;
|
||||
}
|
||||
|
||||
self.canTap = false;
|
||||
|
||||
self.contentLastPos = self.limitMovement();
|
||||
|
||||
if (self.requestId) {
|
||||
cancelAFrame(self.requestId);
|
||||
}
|
||||
|
||||
self.requestId = requestAFrame(function () {
|
||||
$.fancybox.setTranslate(self.$content, self.contentLastPos);
|
||||
});
|
||||
};
|
||||
|
||||
// Make panning sticky to the edges
|
||||
Guestures.prototype.limitMovement = function () {
|
||||
var self = this;
|
||||
|
||||
var canvasWidth = self.canvasWidth;
|
||||
var canvasHeight = self.canvasHeight;
|
||||
|
||||
var distanceX = self.distanceX;
|
||||
var distanceY = self.distanceY;
|
||||
|
||||
var contentStartPos = self.contentStartPos;
|
||||
|
||||
var currentOffsetX = contentStartPos.left;
|
||||
var currentOffsetY = contentStartPos.top;
|
||||
|
||||
var currentWidth = contentStartPos.width;
|
||||
var currentHeight = contentStartPos.height;
|
||||
|
||||
var minTranslateX, minTranslateY, maxTranslateX, maxTranslateY, newOffsetX, newOffsetY;
|
||||
|
||||
if (currentWidth > canvasWidth) {
|
||||
newOffsetX = currentOffsetX + distanceX;
|
||||
} else {
|
||||
newOffsetX = currentOffsetX;
|
||||
}
|
||||
|
||||
newOffsetY = currentOffsetY + distanceY;
|
||||
|
||||
// Slow down proportionally to traveled distance
|
||||
minTranslateX = Math.max(0, canvasWidth * 0.5 - currentWidth * 0.5);
|
||||
minTranslateY = Math.max(0, canvasHeight * 0.5 - currentHeight * 0.5);
|
||||
|
||||
maxTranslateX = Math.min(canvasWidth - currentWidth, canvasWidth * 0.5 - currentWidth * 0.5);
|
||||
maxTranslateY = Math.min(canvasHeight - currentHeight, canvasHeight * 0.5 - currentHeight * 0.5);
|
||||
|
||||
// ->
|
||||
if (distanceX > 0 && newOffsetX > minTranslateX) {
|
||||
newOffsetX = minTranslateX - 1 + Math.pow(-minTranslateX + currentOffsetX + distanceX, 0.8) || 0;
|
||||
}
|
||||
|
||||
// <-
|
||||
if (distanceX < 0 && newOffsetX < maxTranslateX) {
|
||||
newOffsetX = maxTranslateX + 1 - Math.pow(maxTranslateX - currentOffsetX - distanceX, 0.8) || 0;
|
||||
}
|
||||
|
||||
// \/
|
||||
if (distanceY > 0 && newOffsetY > minTranslateY) {
|
||||
newOffsetY = minTranslateY - 1 + Math.pow(-minTranslateY + currentOffsetY + distanceY, 0.8) || 0;
|
||||
}
|
||||
|
||||
// /\
|
||||
if (distanceY < 0 && newOffsetY < maxTranslateY) {
|
||||
newOffsetY = maxTranslateY + 1 - Math.pow(maxTranslateY - currentOffsetY - distanceY, 0.8) || 0;
|
||||
}
|
||||
|
||||
return {
|
||||
top: newOffsetY,
|
||||
left: newOffsetX
|
||||
};
|
||||
};
|
||||
|
||||
Guestures.prototype.limitPosition = function (newOffsetX, newOffsetY, newWidth, newHeight) {
|
||||
var self = this;
|
||||
|
||||
var canvasWidth = self.canvasWidth;
|
||||
var canvasHeight = self.canvasHeight;
|
||||
|
||||
if (newWidth > canvasWidth) {
|
||||
newOffsetX = newOffsetX > 0 ? 0 : newOffsetX;
|
||||
newOffsetX = newOffsetX < canvasWidth - newWidth ? canvasWidth - newWidth : newOffsetX;
|
||||
} else {
|
||||
// Center horizontally
|
||||
newOffsetX = Math.max(0, canvasWidth / 2 - newWidth / 2);
|
||||
}
|
||||
|
||||
if (newHeight > canvasHeight) {
|
||||
newOffsetY = newOffsetY > 0 ? 0 : newOffsetY;
|
||||
newOffsetY = newOffsetY < canvasHeight - newHeight ? canvasHeight - newHeight : newOffsetY;
|
||||
} else {
|
||||
// Center vertically
|
||||
newOffsetY = Math.max(0, canvasHeight / 2 - newHeight / 2);
|
||||
}
|
||||
|
||||
return {
|
||||
top: newOffsetY,
|
||||
left: newOffsetX
|
||||
};
|
||||
};
|
||||
|
||||
Guestures.prototype.onZoom = function () {
|
||||
var self = this;
|
||||
|
||||
// Calculate current distance between points to get pinch ratio and new width and height
|
||||
var contentStartPos = self.contentStartPos;
|
||||
|
||||
var currentWidth = contentStartPos.width;
|
||||
var currentHeight = contentStartPos.height;
|
||||
|
||||
var currentOffsetX = contentStartPos.left;
|
||||
var currentOffsetY = contentStartPos.top;
|
||||
|
||||
var endDistanceBetweenFingers = distance(self.newPoints[0], self.newPoints[1]);
|
||||
|
||||
var pinchRatio = endDistanceBetweenFingers / self.startDistanceBetweenFingers;
|
||||
|
||||
var newWidth = Math.floor(currentWidth * pinchRatio);
|
||||
var newHeight = Math.floor(currentHeight * pinchRatio);
|
||||
|
||||
// This is the translation due to pinch-zooming
|
||||
var translateFromZoomingX = (currentWidth - newWidth) * self.percentageOfImageAtPinchPointX;
|
||||
var translateFromZoomingY = (currentHeight - newHeight) * self.percentageOfImageAtPinchPointY;
|
||||
|
||||
// Point between the two touches
|
||||
var centerPointEndX = (self.newPoints[0].x + self.newPoints[1].x) / 2 - $(window).scrollLeft();
|
||||
var centerPointEndY = (self.newPoints[0].y + self.newPoints[1].y) / 2 - $(window).scrollTop();
|
||||
|
||||
// And this is the translation due to translation of the centerpoint
|
||||
// between the two fingers
|
||||
var translateFromTranslatingX = centerPointEndX - self.centerPointStartX;
|
||||
var translateFromTranslatingY = centerPointEndY - self.centerPointStartY;
|
||||
|
||||
// The new offset is the old/current one plus the total translation
|
||||
var newOffsetX = currentOffsetX + (translateFromZoomingX + translateFromTranslatingX);
|
||||
var newOffsetY = currentOffsetY + (translateFromZoomingY + translateFromTranslatingY);
|
||||
|
||||
var newPos = {
|
||||
top: newOffsetY,
|
||||
left: newOffsetX,
|
||||
scaleX: pinchRatio,
|
||||
scaleY: pinchRatio
|
||||
};
|
||||
|
||||
self.canTap = false;
|
||||
|
||||
self.newWidth = newWidth;
|
||||
self.newHeight = newHeight;
|
||||
|
||||
self.contentLastPos = newPos;
|
||||
|
||||
if (self.requestId) {
|
||||
cancelAFrame(self.requestId);
|
||||
}
|
||||
|
||||
self.requestId = requestAFrame(function () {
|
||||
$.fancybox.setTranslate(self.$content, self.contentLastPos);
|
||||
});
|
||||
};
|
||||
|
||||
Guestures.prototype.ontouchend = function (e) {
|
||||
var self = this;
|
||||
|
||||
var swiping = self.isSwiping;
|
||||
var panning = self.isPanning;
|
||||
var zooming = self.isZooming;
|
||||
var scrolling = self.isScrolling;
|
||||
|
||||
self.endPoints = getPointerXY(e);
|
||||
self.dMs = Math.max(new Date().getTime() - self.startTime, 1);
|
||||
|
||||
self.$container.removeClass("fancybox-is-grabbing");
|
||||
|
||||
$(document).off(".fb.touch");
|
||||
|
||||
document.removeEventListener("scroll", self.onscroll, true);
|
||||
|
||||
if (self.requestId) {
|
||||
cancelAFrame(self.requestId);
|
||||
|
||||
self.requestId = null;
|
||||
}
|
||||
|
||||
self.isSwiping = false;
|
||||
self.isPanning = false;
|
||||
self.isZooming = false;
|
||||
self.isScrolling = false;
|
||||
|
||||
self.instance.isDragging = false;
|
||||
|
||||
if (self.canTap) {
|
||||
return self.onTap(e);
|
||||
}
|
||||
|
||||
self.speed = 100;
|
||||
|
||||
// Speed in px/ms
|
||||
self.velocityX = (self.distanceX / self.dMs) * 0.5;
|
||||
self.velocityY = (self.distanceY / self.dMs) * 0.5;
|
||||
|
||||
if (panning) {
|
||||
self.endPanning();
|
||||
} else if (zooming) {
|
||||
self.endZooming();
|
||||
} else {
|
||||
self.endSwiping(swiping, scrolling);
|
||||
}
|
||||
|
||||
return;
|
||||
};
|
||||
|
||||
Guestures.prototype.endSwiping = function (swiping, scrolling) {
|
||||
var self = this,
|
||||
ret = false,
|
||||
len = self.instance.group.length,
|
||||
distanceX = Math.abs(self.distanceX),
|
||||
canAdvance = swiping == "x" && len > 1 && ((self.dMs > 130 && distanceX > 10) || distanceX > 50),
|
||||
speedX = 300;
|
||||
|
||||
self.sliderLastPos = null;
|
||||
|
||||
// Close if swiped vertically / navigate if horizontally
|
||||
if (swiping == "y" && !scrolling && Math.abs(self.distanceY) > 50) {
|
||||
// Continue vertical movement
|
||||
$.fancybox.animate(
|
||||
self.instance.current.$slide, {
|
||||
top: self.sliderStartPos.top + self.distanceY + self.velocityY * 150,
|
||||
opacity: 0
|
||||
},
|
||||
200
|
||||
);
|
||||
ret = self.instance.close(true, 250);
|
||||
} else if (canAdvance && self.distanceX > 0) {
|
||||
ret = self.instance.previous(speedX);
|
||||
} else if (canAdvance && self.distanceX < 0) {
|
||||
ret = self.instance.next(speedX);
|
||||
}
|
||||
|
||||
if (ret === false && (swiping == "x" || swiping == "y")) {
|
||||
self.instance.centerSlide(200);
|
||||
}
|
||||
|
||||
self.$container.removeClass("fancybox-is-sliding");
|
||||
};
|
||||
|
||||
// Limit panning from edges
|
||||
// ========================
|
||||
Guestures.prototype.endPanning = function () {
|
||||
var self = this,
|
||||
newOffsetX,
|
||||
newOffsetY,
|
||||
newPos;
|
||||
|
||||
if (!self.contentLastPos) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (self.opts.momentum === false || self.dMs > 350) {
|
||||
newOffsetX = self.contentLastPos.left;
|
||||
newOffsetY = self.contentLastPos.top;
|
||||
} else {
|
||||
// Continue movement
|
||||
newOffsetX = self.contentLastPos.left + self.velocityX * 500;
|
||||
newOffsetY = self.contentLastPos.top + self.velocityY * 500;
|
||||
}
|
||||
|
||||
newPos = self.limitPosition(newOffsetX, newOffsetY, self.contentStartPos.width, self.contentStartPos.height);
|
||||
|
||||
newPos.width = self.contentStartPos.width;
|
||||
newPos.height = self.contentStartPos.height;
|
||||
|
||||
$.fancybox.animate(self.$content, newPos, 366);
|
||||
};
|
||||
|
||||
Guestures.prototype.endZooming = function () {
|
||||
var self = this;
|
||||
|
||||
var current = self.instance.current;
|
||||
|
||||
var newOffsetX, newOffsetY, newPos, reset;
|
||||
|
||||
var newWidth = self.newWidth;
|
||||
var newHeight = self.newHeight;
|
||||
|
||||
if (!self.contentLastPos) {
|
||||
return;
|
||||
}
|
||||
|
||||
newOffsetX = self.contentLastPos.left;
|
||||
newOffsetY = self.contentLastPos.top;
|
||||
|
||||
reset = {
|
||||
top: newOffsetY,
|
||||
left: newOffsetX,
|
||||
width: newWidth,
|
||||
height: newHeight,
|
||||
scaleX: 1,
|
||||
scaleY: 1
|
||||
};
|
||||
|
||||
// Reset scalex/scaleY values; this helps for perfomance and does not break animation
|
||||
$.fancybox.setTranslate(self.$content, reset);
|
||||
|
||||
if (newWidth < self.canvasWidth && newHeight < self.canvasHeight) {
|
||||
self.instance.scaleToFit(150);
|
||||
} else if (newWidth > current.width || newHeight > current.height) {
|
||||
self.instance.scaleToActual(self.centerPointStartX, self.centerPointStartY, 150);
|
||||
} else {
|
||||
newPos = self.limitPosition(newOffsetX, newOffsetY, newWidth, newHeight);
|
||||
|
||||
$.fancybox.animate(self.$content, newPos, 150);
|
||||
}
|
||||
};
|
||||
|
||||
Guestures.prototype.onTap = function (e) {
|
||||
var self = this;
|
||||
var $target = $(e.target);
|
||||
|
||||
var instance = self.instance;
|
||||
var current = instance.current;
|
||||
|
||||
var endPoints = (e && getPointerXY(e)) || self.startPoints;
|
||||
|
||||
var tapX = endPoints[0] ? endPoints[0].x - $(window).scrollLeft() - self.stagePos.left : 0;
|
||||
var tapY = endPoints[0] ? endPoints[0].y - $(window).scrollTop() - self.stagePos.top : 0;
|
||||
|
||||
var where;
|
||||
|
||||
var process = function (prefix) {
|
||||
var action = current.opts[prefix];
|
||||
|
||||
if ($.isFunction(action)) {
|
||||
action = action.apply(instance, [current, e]);
|
||||
}
|
||||
|
||||
if (!action) {
|
||||
return;
|
||||
}
|
||||
|
||||
switch (action) {
|
||||
case "close":
|
||||
instance.close(self.startEvent);
|
||||
|
||||
break;
|
||||
|
||||
case "toggleControls":
|
||||
instance.toggleControls();
|
||||
|
||||
break;
|
||||
|
||||
case "next":
|
||||
instance.next();
|
||||
|
||||
break;
|
||||
|
||||
case "nextOrClose":
|
||||
if (instance.group.length > 1) {
|
||||
instance.next();
|
||||
} else {
|
||||
instance.close(self.startEvent);
|
||||
}
|
||||
|
||||
break;
|
||||
|
||||
case "zoom":
|
||||
if (current.type == "image" && (current.isLoaded || current.$ghost)) {
|
||||
if (instance.canPan()) {
|
||||
instance.scaleToFit();
|
||||
} else if (instance.isScaledDown()) {
|
||||
instance.scaleToActual(tapX, tapY);
|
||||
} else if (instance.group.length < 2) {
|
||||
instance.close(self.startEvent);
|
||||
}
|
||||
}
|
||||
|
||||
break;
|
||||
}
|
||||
};
|
||||
|
||||
// Ignore right click
|
||||
if (e.originalEvent && e.originalEvent.button == 2) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Skip if clicked on the scrollbar
|
||||
if (!$target.is("img") && tapX > $target[0].clientWidth + $target.offset().left) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Check where is clicked
|
||||
if ($target.is(".fancybox-bg,.fancybox-inner,.fancybox-outer,.fancybox-container")) {
|
||||
where = "Outside";
|
||||
} else if ($target.is(".fancybox-slide")) {
|
||||
where = "Slide";
|
||||
} else if (
|
||||
instance.current.$content &&
|
||||
instance.current.$content
|
||||
.find($target)
|
||||
.addBack()
|
||||
.filter($target).length
|
||||
) {
|
||||
where = "Content";
|
||||
} else {
|
||||
return;
|
||||
}
|
||||
|
||||
// Check if this is a double tap
|
||||
if (self.tapped) {
|
||||
// Stop previously created single tap
|
||||
clearTimeout(self.tapped);
|
||||
self.tapped = null;
|
||||
|
||||
// Skip if distance between taps is too big
|
||||
if (Math.abs(tapX - self.tapX) > 50 || Math.abs(tapY - self.tapY) > 50) {
|
||||
return this;
|
||||
}
|
||||
|
||||
// OK, now we assume that this is a double-tap
|
||||
process("dblclick" + where);
|
||||
} else {
|
||||
// Single tap will be processed if user has not clicked second time within 300ms
|
||||
// or there is no need to wait for double-tap
|
||||
self.tapX = tapX;
|
||||
self.tapY = tapY;
|
||||
|
||||
if (current.opts["dblclick" + where] && current.opts["dblclick" + where] !== current.opts["click" + where]) {
|
||||
self.tapped = setTimeout(function () {
|
||||
self.tapped = null;
|
||||
|
||||
if (!instance.isAnimating) {
|
||||
process("click" + where);
|
||||
}
|
||||
}, 500);
|
||||
} else {
|
||||
process("click" + where);
|
||||
}
|
||||
}
|
||||
|
||||
return this;
|
||||
};
|
||||
|
||||
$(document)
|
||||
.on("onActivate.fb", function (e, instance) {
|
||||
if (instance && !instance.Guestures) {
|
||||
instance.Guestures = new Guestures(instance);
|
||||
}
|
||||
})
|
||||
.on("beforeClose.fb", function (e, instance) {
|
||||
if (instance && instance.Guestures) {
|
||||
instance.Guestures.destroy();
|
||||
}
|
||||
});
|
||||
})(window, document, jQuery);
|
||||
210
libraries/fancybox3/js/hash.js
Normal file
210
libraries/fancybox3/js/hash.js
Normal file
@@ -0,0 +1,210 @@
|
||||
// ==========================================================================
|
||||
//
|
||||
// Hash
|
||||
// Enables linking to each modal
|
||||
//
|
||||
// ==========================================================================
|
||||
(function (window, document, $) {
|
||||
"use strict";
|
||||
|
||||
// Simple $.escapeSelector polyfill (for jQuery prior v3)
|
||||
if (!$.escapeSelector) {
|
||||
$.escapeSelector = function (sel) {
|
||||
var rcssescape = /([\0-\x1f\x7f]|^-?\d)|^-$|[^\x80-\uFFFF\w-]/g;
|
||||
var fcssescape = function (ch, asCodePoint) {
|
||||
if (asCodePoint) {
|
||||
// U+0000 NULL becomes U+FFFD REPLACEMENT CHARACTER
|
||||
if (ch === "\0") {
|
||||
return "\uFFFD";
|
||||
}
|
||||
|
||||
// Control characters and (dependent upon position) numbers get escaped as code points
|
||||
return ch.slice(0, -1) + "\\" + ch.charCodeAt(ch.length - 1).toString(16) + " ";
|
||||
}
|
||||
|
||||
// Other potentially-special ASCII characters get backslash-escaped
|
||||
return "\\" + ch;
|
||||
};
|
||||
|
||||
return (sel + "").replace(rcssescape, fcssescape);
|
||||
};
|
||||
}
|
||||
|
||||
// Get info about gallery name and current index from url
|
||||
function parseUrl() {
|
||||
var hash = window.location.hash.substr(1),
|
||||
rez = hash.split("-"),
|
||||
index = rez.length > 1 && /^\+?\d+$/.test(rez[rez.length - 1]) ? parseInt(rez.pop(-1), 10) || 1 : 1,
|
||||
gallery = rez.join("-");
|
||||
|
||||
return {
|
||||
hash: hash,
|
||||
/* Index is starting from 1 */
|
||||
index: index < 1 ? 1 : index,
|
||||
gallery: gallery
|
||||
};
|
||||
}
|
||||
|
||||
// Trigger click evnt on links to open new fancyBox instance
|
||||
function triggerFromUrl(url) {
|
||||
if (url.gallery !== "") {
|
||||
// If we can find element matching 'data-fancybox' atribute,
|
||||
// then triggering click event should start fancyBox
|
||||
$("[data-fancybox='" + $.escapeSelector(url.gallery) + "']")
|
||||
.eq(url.index - 1)
|
||||
.focus()
|
||||
.trigger("click.fb-start");
|
||||
}
|
||||
}
|
||||
|
||||
// Get gallery name from current instance
|
||||
function getGalleryID(instance) {
|
||||
var opts, ret;
|
||||
|
||||
if (!instance) {
|
||||
return false;
|
||||
}
|
||||
|
||||
opts = instance.current ? instance.current.opts : instance.opts;
|
||||
ret = opts.hash || (opts.$orig ? opts.$orig.data("fancybox") || opts.$orig.data("fancybox-trigger") : "");
|
||||
|
||||
return ret === "" ? false : ret;
|
||||
}
|
||||
|
||||
// Start when DOM becomes ready
|
||||
$(function () {
|
||||
// Check if user has disabled this module
|
||||
if ($.fancybox.defaults.hash === false) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Update hash when opening/closing fancyBox
|
||||
$(document).on({
|
||||
"onInit.fb": function (e, instance) {
|
||||
var url, gallery;
|
||||
|
||||
if (instance.group[instance.currIndex].opts.hash === false) {
|
||||
return;
|
||||
}
|
||||
|
||||
url = parseUrl();
|
||||
gallery = getGalleryID(instance);
|
||||
|
||||
// Make sure gallery start index matches index from hash
|
||||
if (gallery && url.gallery && gallery == url.gallery) {
|
||||
instance.currIndex = url.index - 1;
|
||||
}
|
||||
},
|
||||
|
||||
"beforeShow.fb": function (e, instance, current, firstRun) {
|
||||
var gallery;
|
||||
|
||||
if (!current || current.opts.hash === false) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Check if need to update window hash
|
||||
gallery = getGalleryID(instance);
|
||||
|
||||
if (!gallery) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Variable containing last hash value set by fancyBox
|
||||
// It will be used to determine if fancyBox needs to close after hash change is detected
|
||||
instance.currentHash = gallery + (instance.group.length > 1 ? "-" + (current.index + 1) : "");
|
||||
|
||||
// If current hash is the same (this instance most likely is opened by hashchange), then do nothing
|
||||
if (window.location.hash === "#" + instance.currentHash) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (firstRun && !instance.origHash) {
|
||||
instance.origHash = window.location.hash;
|
||||
}
|
||||
|
||||
if (instance.hashTimer) {
|
||||
clearTimeout(instance.hashTimer);
|
||||
}
|
||||
|
||||
// Update hash
|
||||
instance.hashTimer = setTimeout(function () {
|
||||
if ("replaceState" in window.history) {
|
||||
window.history[firstRun ? "pushState" : "replaceState"]({},
|
||||
document.title,
|
||||
window.location.pathname + window.location.search + "#" + instance.currentHash
|
||||
);
|
||||
|
||||
if (firstRun) {
|
||||
instance.hasCreatedHistory = true;
|
||||
}
|
||||
} else {
|
||||
window.location.hash = instance.currentHash;
|
||||
}
|
||||
|
||||
instance.hashTimer = null;
|
||||
}, 300);
|
||||
},
|
||||
|
||||
"beforeClose.fb": function (e, instance, current) {
|
||||
if (!current || current.opts.hash === false) {
|
||||
return;
|
||||
}
|
||||
|
||||
clearTimeout(instance.hashTimer);
|
||||
|
||||
// Goto previous history entry
|
||||
if (instance.currentHash && instance.hasCreatedHistory) {
|
||||
window.history.back();
|
||||
} else if (instance.currentHash) {
|
||||
if ("replaceState" in window.history) {
|
||||
window.history.replaceState({}, document.title, window.location.pathname + window.location.search + (instance.origHash || ""));
|
||||
} else {
|
||||
window.location.hash = instance.origHash;
|
||||
}
|
||||
}
|
||||
|
||||
instance.currentHash = null;
|
||||
}
|
||||
});
|
||||
|
||||
// Check if need to start/close after url has changed
|
||||
$(window).on("hashchange.fb", function () {
|
||||
var url = parseUrl(),
|
||||
fb = null;
|
||||
|
||||
// Find last fancyBox instance that has "hash"
|
||||
$.each(
|
||||
$(".fancybox-container")
|
||||
.get()
|
||||
.reverse(),
|
||||
function (index, value) {
|
||||
var tmp = $(value).data("FancyBox");
|
||||
|
||||
if (tmp && tmp.currentHash) {
|
||||
fb = tmp;
|
||||
return false;
|
||||
}
|
||||
}
|
||||
);
|
||||
|
||||
if (fb) {
|
||||
// Now, compare hash values
|
||||
if (fb.currentHash !== url.gallery + "-" + url.index && !(url.index === 1 && fb.currentHash == url.gallery)) {
|
||||
fb.currentHash = null;
|
||||
|
||||
fb.close();
|
||||
}
|
||||
} else if (url.gallery !== "") {
|
||||
triggerFromUrl(url);
|
||||
}
|
||||
});
|
||||
|
||||
// Check current hash and trigger click event on matching element to start fancyBox, if needed
|
||||
setTimeout(function () {
|
||||
if (!$.fancybox.getInstance()) {
|
||||
triggerFromUrl(parseUrl());
|
||||
}
|
||||
}, 50);
|
||||
});
|
||||
})(window, document, jQuery);
|
||||
290
libraries/fancybox3/js/media.js
Normal file
290
libraries/fancybox3/js/media.js
Normal file
@@ -0,0 +1,290 @@
|
||||
// ==========================================================================
|
||||
//
|
||||
// Media
|
||||
// Adds additional media type support
|
||||
//
|
||||
// ==========================================================================
|
||||
(function ($) {
|
||||
"use strict";
|
||||
|
||||
// Object containing properties for each media type
|
||||
var defaults = {
|
||||
youtube: {
|
||||
matcher: /(youtube\.com|youtu\.be|youtube\-nocookie\.com)\/(watch\?(.*&)?v=|v\/|u\/|embed\/?)?(videoseries\?list=(.*)|[\w-]{11}|\?listType=(.*)&list=(.*))(.*)/i,
|
||||
params: {
|
||||
autoplay: 1,
|
||||
autohide: 1,
|
||||
fs: 1,
|
||||
rel: 0,
|
||||
hd: 1,
|
||||
wmode: "transparent",
|
||||
enablejsapi: 1,
|
||||
html5: 1
|
||||
},
|
||||
paramPlace: 8,
|
||||
type: "iframe",
|
||||
url: "https://www.youtube-nocookie.com/embed/$4",
|
||||
thumb: "https://img.youtube.com/vi/$4/hqdefault.jpg"
|
||||
},
|
||||
|
||||
vimeo: {
|
||||
matcher: /^.+vimeo.com\/(.*\/)?([\d]+)(.*)?/,
|
||||
params: {
|
||||
autoplay: 1,
|
||||
hd: 1,
|
||||
show_title: 1,
|
||||
show_byline: 1,
|
||||
show_portrait: 0,
|
||||
fullscreen: 1
|
||||
},
|
||||
paramPlace: 3,
|
||||
type: "iframe",
|
||||
url: "//player.vimeo.com/video/$2"
|
||||
},
|
||||
|
||||
instagram: {
|
||||
matcher: /(instagr\.am|instagram\.com)\/p\/([a-zA-Z0-9_\-]+)\/?/i,
|
||||
type: "image",
|
||||
url: "//$1/p/$2/media/?size=l"
|
||||
},
|
||||
|
||||
// Examples:
|
||||
// http://maps.google.com/?ll=48.857995,2.294297&spn=0.007666,0.021136&t=m&z=16
|
||||
// https://www.google.com/maps/@37.7852006,-122.4146355,14.65z
|
||||
// https://www.google.com/maps/@52.2111123,2.9237542,6.61z?hl=en
|
||||
// https://www.google.com/maps/place/Googleplex/@37.4220041,-122.0833494,17z/data=!4m5!3m4!1s0x0:0x6c296c66619367e0!8m2!3d37.4219998!4d-122.0840572
|
||||
gmap_place: {
|
||||
matcher: /(maps\.)?google\.([a-z]{2,3}(\.[a-z]{2})?)\/(((maps\/(place\/(.*)\/)?\@(.*),(\d+.?\d+?)z))|(\?ll=))(.*)?/i,
|
||||
type: "iframe",
|
||||
url: function (rez) {
|
||||
return (
|
||||
"//maps.google." +
|
||||
rez[2] +
|
||||
"/?ll=" +
|
||||
(rez[9] ? rez[9] + "&z=" + Math.floor(rez[10]) + (rez[12] ? rez[12].replace(/^\//, "&") : "") : rez[12] + "").replace(/\?/, "&") +
|
||||
"&output=" +
|
||||
(rez[12] && rez[12].indexOf("layer=c") > 0 ? "svembed" : "embed")
|
||||
);
|
||||
}
|
||||
},
|
||||
|
||||
// Examples:
|
||||
// https://www.google.com/maps/search/Empire+State+Building/
|
||||
// https://www.google.com/maps/search/?api=1&query=centurylink+field
|
||||
// https://www.google.com/maps/search/?api=1&query=47.5951518,-122.3316393
|
||||
gmap_search: {
|
||||
matcher: /(maps\.)?google\.([a-z]{2,3}(\.[a-z]{2})?)\/(maps\/search\/)(.*)/i,
|
||||
type: "iframe",
|
||||
url: function (rez) {
|
||||
return "//maps.google." + rez[2] + "/maps?q=" + rez[5].replace("query=", "q=").replace("api=1", "") + "&output=embed";
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
// Formats matching url to final form
|
||||
var format = function (url, rez, params) {
|
||||
if (!url) {
|
||||
return;
|
||||
}
|
||||
|
||||
params = params || "";
|
||||
|
||||
if ($.type(params) === "object") {
|
||||
params = $.param(params, true);
|
||||
}
|
||||
|
||||
$.each(rez, function (key, value) {
|
||||
url = url.replace("$" + key, value || "");
|
||||
});
|
||||
|
||||
if (params.length) {
|
||||
url += (url.indexOf("?") > 0 ? "&" : "?") + params;
|
||||
}
|
||||
|
||||
return url;
|
||||
};
|
||||
|
||||
$(document).on("objectNeedsType.fb", function (e, instance, item) {
|
||||
var url = item.src || "",
|
||||
type = false,
|
||||
media,
|
||||
thumb,
|
||||
rez,
|
||||
params,
|
||||
urlParams,
|
||||
paramObj,
|
||||
provider;
|
||||
|
||||
media = $.extend(true, {}, defaults, item.opts.media);
|
||||
|
||||
// Look for any matching media type
|
||||
$.each(media, function (providerName, providerOpts) {
|
||||
rez = url.match(providerOpts.matcher);
|
||||
|
||||
if (!rez) {
|
||||
return;
|
||||
}
|
||||
|
||||
type = providerOpts.type;
|
||||
provider = providerName;
|
||||
paramObj = {};
|
||||
|
||||
if (providerOpts.paramPlace && rez[providerOpts.paramPlace]) {
|
||||
urlParams = rez[providerOpts.paramPlace];
|
||||
|
||||
if (urlParams[0] == "?") {
|
||||
urlParams = urlParams.substring(1);
|
||||
}
|
||||
|
||||
urlParams = urlParams.split("&");
|
||||
|
||||
for (var m = 0; m < urlParams.length; ++m) {
|
||||
var p = urlParams[m].split("=", 2);
|
||||
|
||||
if (p.length == 2) {
|
||||
paramObj[p[0]] = decodeURIComponent(p[1].replace(/\+/g, " "));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
params = $.extend(true, {}, providerOpts.params, item.opts[providerName], paramObj);
|
||||
|
||||
url =
|
||||
$.type(providerOpts.url) === "function" ? providerOpts.url.call(this, rez, params, item) : format(providerOpts.url, rez, params);
|
||||
|
||||
thumb =
|
||||
$.type(providerOpts.thumb) === "function" ? providerOpts.thumb.call(this, rez, params, item) : format(providerOpts.thumb, rez);
|
||||
|
||||
if (providerName === "youtube") {
|
||||
url = url.replace(/&t=((\d+)m)?(\d+)s/, function (match, p1, m, s) {
|
||||
return "&start=" + ((m ? parseInt(m, 10) * 60 : 0) + parseInt(s, 10));
|
||||
});
|
||||
} else if (providerName === "vimeo") {
|
||||
url = url.replace("&%23", "#");
|
||||
}
|
||||
|
||||
return false;
|
||||
});
|
||||
|
||||
// If it is found, then change content type and update the url
|
||||
|
||||
if (type) {
|
||||
if (!item.opts.thumb && !(item.opts.$thumb && item.opts.$thumb.length)) {
|
||||
item.opts.thumb = thumb;
|
||||
}
|
||||
|
||||
if (type === "iframe") {
|
||||
item.opts = $.extend(true, item.opts, {
|
||||
iframe: {
|
||||
preload: false,
|
||||
attr: {
|
||||
scrolling: "no"
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
$.extend(item, {
|
||||
type: type,
|
||||
src: url,
|
||||
origSrc: item.src,
|
||||
contentSource: provider,
|
||||
contentType: type === "image" ? "image" : provider == "gmap_place" || provider == "gmap_search" ? "map" : "video"
|
||||
});
|
||||
} else if (url) {
|
||||
item.type = item.opts.defaultType;
|
||||
}
|
||||
});
|
||||
|
||||
// Load YouTube/Video API on request to detect when video finished playing
|
||||
var VideoAPILoader = {
|
||||
youtube: {
|
||||
src: "https://www.youtube.com/iframe_api",
|
||||
class: "YT",
|
||||
loading: false,
|
||||
loaded: false
|
||||
},
|
||||
|
||||
vimeo: {
|
||||
src: "https://player.vimeo.com/api/player.js",
|
||||
class: "Vimeo",
|
||||
loading: false,
|
||||
loaded: false
|
||||
},
|
||||
|
||||
load: function (vendor) {
|
||||
var _this = this,
|
||||
script;
|
||||
|
||||
if (this[vendor].loaded) {
|
||||
setTimeout(function () {
|
||||
_this.done(vendor);
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
if (this[vendor].loading) {
|
||||
return;
|
||||
}
|
||||
|
||||
this[vendor].loading = true;
|
||||
|
||||
script = document.createElement("script");
|
||||
script.type = "text/javascript";
|
||||
script.src = this[vendor].src;
|
||||
|
||||
if (vendor === "youtube") {
|
||||
window.onYouTubeIframeAPIReady = function () {
|
||||
_this[vendor].loaded = true;
|
||||
_this.done(vendor);
|
||||
};
|
||||
} else {
|
||||
script.onload = function () {
|
||||
_this[vendor].loaded = true;
|
||||
_this.done(vendor);
|
||||
};
|
||||
}
|
||||
|
||||
document.body.appendChild(script);
|
||||
},
|
||||
done: function (vendor) {
|
||||
var instance, $el, player;
|
||||
|
||||
if (vendor === "youtube") {
|
||||
delete window.onYouTubeIframeAPIReady;
|
||||
}
|
||||
|
||||
instance = $.fancybox.getInstance();
|
||||
|
||||
if (instance) {
|
||||
$el = instance.current.$content.find("iframe");
|
||||
|
||||
if (vendor === "youtube" && YT !== undefined && YT) {
|
||||
player = new YT.Player($el.attr("id"), {
|
||||
events: {
|
||||
onStateChange: function (e) {
|
||||
if (e.data == 0) {
|
||||
instance.next();
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
} else if (vendor === "vimeo" && Vimeo !== undefined && Vimeo) {
|
||||
player = new Vimeo.Player($el);
|
||||
|
||||
player.on("ended", function () {
|
||||
instance.next();
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
$(document).on({
|
||||
"afterShow.fb": function (e, instance, current) {
|
||||
if (instance.group.length > 1 && (current.contentSource === "youtube" || current.contentSource === "vimeo")) {
|
||||
VideoAPILoader.load(current.contentSource);
|
||||
}
|
||||
}
|
||||
});
|
||||
})(jQuery);
|
||||
104
libraries/fancybox3/js/share.js
Normal file
104
libraries/fancybox3/js/share.js
Normal file
@@ -0,0 +1,104 @@
|
||||
//// ==========================================================================
|
||||
//
|
||||
// Share
|
||||
// Displays simple form for sharing current url
|
||||
//
|
||||
// ==========================================================================
|
||||
(function (document, $) {
|
||||
"use strict";
|
||||
|
||||
$.extend(true, $.fancybox.defaults, {
|
||||
btnTpl: {
|
||||
share: '<button data-fancybox-share class="fancybox-button fancybox-button--share" title="{{SHARE}}">' +
|
||||
'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M2.55 19c1.4-8.4 9.1-9.8 11.9-9.8V5l7 7-7 6.3v-3.5c-2.8 0-10.5 2.1-11.9 4.2z"/></svg>' +
|
||||
"</button>"
|
||||
},
|
||||
share: {
|
||||
url: function (instance, item) {
|
||||
return (
|
||||
(!instance.currentHash && !(item.type === "inline" || item.type === "html") ? item.origSrc || item.src : false) || window.location
|
||||
);
|
||||
},
|
||||
tpl: '<div class="fancybox-share">' +
|
||||
"<h1>{{SHARE}}</h1>" +
|
||||
"<p>" +
|
||||
'<a class="fancybox-share__button fancybox-share__button--fb" href="https://www.facebook.com/sharer/sharer.php?u={{url}}">' +
|
||||
'<svg viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg"><path d="m287 456v-299c0-21 6-35 35-35h38v-63c-7-1-29-3-55-3-54 0-91 33-91 94v306m143-254h-205v72h196" /></svg>' +
|
||||
"<span>Facebook</span>" +
|
||||
"</a>" +
|
||||
'<a class="fancybox-share__button fancybox-share__button--tw" href="https://twitter.com/intent/tweet?url={{url}}&text={{descr}}">' +
|
||||
'<svg viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg"><path d="m456 133c-14 7-31 11-47 13 17-10 30-27 37-46-15 10-34 16-52 20-61-62-157-7-141 75-68-3-129-35-169-85-22 37-11 86 26 109-13 0-26-4-37-9 0 39 28 72 65 80-12 3-25 4-37 2 10 33 41 57 77 57-42 30-77 38-122 34 170 111 378-32 359-208 16-11 30-25 41-42z" /></svg>' +
|
||||
"<span>Twitter</span>" +
|
||||
"</a>" +
|
||||
'<a class="fancybox-share__button fancybox-share__button--pt" href="https://www.pinterest.com/pin/create/button/?url={{url}}&description={{descr}}&media={{media}}">' +
|
||||
'<svg viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg"><path d="m265 56c-109 0-164 78-164 144 0 39 15 74 47 87 5 2 10 0 12-5l4-19c2-6 1-8-3-13-9-11-15-25-15-45 0-58 43-110 113-110 62 0 96 38 96 88 0 67-30 122-73 122-24 0-42-19-36-44 6-29 20-60 20-81 0-19-10-35-31-35-25 0-44 26-44 60 0 21 7 36 7 36l-30 125c-8 37-1 83 0 87 0 3 4 4 5 2 2-3 32-39 42-75l16-64c8 16 31 29 56 29 74 0 124-67 124-157 0-69-58-132-146-132z" fill="#fff"/></svg>' +
|
||||
"<span>Pinterest</span>" +
|
||||
"</a>" +
|
||||
"</p>" +
|
||||
'<p><input class="fancybox-share__input" type="text" value="{{url_raw}}" onclick="select()" /></p>' +
|
||||
"</div>"
|
||||
}
|
||||
});
|
||||
|
||||
function escapeHtml(string) {
|
||||
var entityMap = {
|
||||
"&": "&",
|
||||
"<": "<",
|
||||
">": ">",
|
||||
'"': """,
|
||||
"'": "'",
|
||||
"/": "/",
|
||||
"`": "`",
|
||||
"=": "="
|
||||
};
|
||||
|
||||
return String(string).replace(/[&<>"'`=\/]/g, function (s) {
|
||||
return entityMap[s];
|
||||
});
|
||||
}
|
||||
|
||||
$(document).on("click", "[data-fancybox-share]", function () {
|
||||
var instance = $.fancybox.getInstance(),
|
||||
current = instance.current || null,
|
||||
url,
|
||||
tpl;
|
||||
|
||||
if (!current) {
|
||||
return;
|
||||
}
|
||||
|
||||
if ($.type(current.opts.share.url) === "function") {
|
||||
url = current.opts.share.url.apply(current, [instance, current]);
|
||||
}
|
||||
|
||||
tpl = current.opts.share.tpl
|
||||
.replace(/\{\{media\}\}/g, current.type === "image" ? encodeURIComponent(current.src) : "")
|
||||
.replace(/\{\{url\}\}/g, encodeURIComponent(url))
|
||||
.replace(/\{\{url_raw\}\}/g, escapeHtml(url))
|
||||
.replace(/\{\{descr\}\}/g, instance.$caption ? encodeURIComponent(instance.$caption.text()) : "");
|
||||
|
||||
$.fancybox.open({
|
||||
src: instance.translate(instance, tpl),
|
||||
type: "html",
|
||||
opts: {
|
||||
touch: false,
|
||||
animationEffect: false,
|
||||
afterLoad: function (shareInstance, shareCurrent) {
|
||||
// Close self if parent instance is closing
|
||||
instance.$refs.container.one("beforeClose.fb", function () {
|
||||
shareInstance.close(null, 0);
|
||||
});
|
||||
|
||||
// Opening links in a popup window
|
||||
shareCurrent.$content.find(".fancybox-share__button").click(function () {
|
||||
window.open(this.href, "Share", "width=550, height=450");
|
||||
return false;
|
||||
});
|
||||
},
|
||||
mobile: {
|
||||
autoFocus: false
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
})(document, jQuery);
|
||||
205
libraries/fancybox3/js/slideshow.js
Normal file
205
libraries/fancybox3/js/slideshow.js
Normal file
@@ -0,0 +1,205 @@
|
||||
// ==========================================================================
|
||||
//
|
||||
// SlideShow
|
||||
// Enables slideshow functionality
|
||||
//
|
||||
// Example of usage:
|
||||
// $.fancybox.getInstance().SlideShow.start()
|
||||
//
|
||||
// ==========================================================================
|
||||
(function (document, $) {
|
||||
"use strict";
|
||||
|
||||
$.extend(true, $.fancybox.defaults, {
|
||||
btnTpl: {
|
||||
slideShow: '<button data-fancybox-play class="fancybox-button fancybox-button--play" title="{{PLAY_START}}">' +
|
||||
'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M6.5 5.4v13.2l11-6.6z"/></svg>' +
|
||||
'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M8.33 5.75h2.2v12.5h-2.2V5.75zm5.15 0h2.2v12.5h-2.2V5.75z"/></svg>' +
|
||||
"</button>"
|
||||
},
|
||||
slideShow: {
|
||||
autoStart: false,
|
||||
speed: 3000,
|
||||
progress: true
|
||||
}
|
||||
});
|
||||
|
||||
var SlideShow = function (instance) {
|
||||
this.instance = instance;
|
||||
this.init();
|
||||
};
|
||||
|
||||
$.extend(SlideShow.prototype, {
|
||||
timer: null,
|
||||
isActive: false,
|
||||
$button: null,
|
||||
|
||||
init: function () {
|
||||
var self = this,
|
||||
instance = self.instance,
|
||||
opts = instance.group[instance.currIndex].opts.slideShow;
|
||||
|
||||
self.$button = instance.$refs.toolbar.find("[data-fancybox-play]").on("click", function () {
|
||||
self.toggle();
|
||||
});
|
||||
|
||||
if (instance.group.length < 2 || !opts) {
|
||||
self.$button.hide();
|
||||
} else if (opts.progress) {
|
||||
self.$progress = $('<div class="fancybox-progress"></div>').appendTo(instance.$refs.inner);
|
||||
}
|
||||
},
|
||||
|
||||
set: function (force) {
|
||||
var self = this,
|
||||
instance = self.instance,
|
||||
current = instance.current;
|
||||
|
||||
// Check if reached last element
|
||||
if (current && (force === true || current.opts.loop || instance.currIndex < instance.group.length - 1)) {
|
||||
if (self.isActive && current.contentType !== "video") {
|
||||
if (self.$progress) {
|
||||
$.fancybox.animate(self.$progress.show(), {
|
||||
scaleX: 1
|
||||
}, current.opts.slideShow.speed);
|
||||
}
|
||||
|
||||
self.timer = setTimeout(function () {
|
||||
if (!instance.current.opts.loop && instance.current.index == instance.group.length - 1) {
|
||||
instance.jumpTo(0);
|
||||
} else {
|
||||
instance.next();
|
||||
}
|
||||
}, current.opts.slideShow.speed);
|
||||
}
|
||||
} else {
|
||||
self.stop();
|
||||
instance.idleSecondsCounter = 0;
|
||||
instance.showControls();
|
||||
}
|
||||
},
|
||||
|
||||
clear: function () {
|
||||
var self = this;
|
||||
|
||||
clearTimeout(self.timer);
|
||||
|
||||
self.timer = null;
|
||||
|
||||
if (self.$progress) {
|
||||
self.$progress.removeAttr("style").hide();
|
||||
}
|
||||
},
|
||||
|
||||
start: function () {
|
||||
var self = this,
|
||||
current = self.instance.current;
|
||||
|
||||
if (current) {
|
||||
self.$button
|
||||
.attr("title", (current.opts.i18n[current.opts.lang] || current.opts.i18n.en).PLAY_STOP)
|
||||
.removeClass("fancybox-button--play")
|
||||
.addClass("fancybox-button--pause");
|
||||
|
||||
self.isActive = true;
|
||||
|
||||
if (current.isComplete) {
|
||||
self.set(true);
|
||||
}
|
||||
|
||||
self.instance.trigger("onSlideShowChange", true);
|
||||
}
|
||||
},
|
||||
|
||||
stop: function () {
|
||||
var self = this,
|
||||
current = self.instance.current;
|
||||
|
||||
self.clear();
|
||||
|
||||
self.$button
|
||||
.attr("title", (current.opts.i18n[current.opts.lang] || current.opts.i18n.en).PLAY_START)
|
||||
.removeClass("fancybox-button--pause")
|
||||
.addClass("fancybox-button--play");
|
||||
|
||||
self.isActive = false;
|
||||
|
||||
self.instance.trigger("onSlideShowChange", false);
|
||||
|
||||
if (self.$progress) {
|
||||
self.$progress.removeAttr("style").hide();
|
||||
}
|
||||
},
|
||||
|
||||
toggle: function () {
|
||||
var self = this;
|
||||
|
||||
if (self.isActive) {
|
||||
self.stop();
|
||||
} else {
|
||||
self.start();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
$(document).on({
|
||||
"onInit.fb": function (e, instance) {
|
||||
if (instance && !instance.SlideShow) {
|
||||
instance.SlideShow = new SlideShow(instance);
|
||||
}
|
||||
},
|
||||
|
||||
"beforeShow.fb": function (e, instance, current, firstRun) {
|
||||
var SlideShow = instance && instance.SlideShow;
|
||||
|
||||
if (firstRun) {
|
||||
if (SlideShow && current.opts.slideShow.autoStart) {
|
||||
SlideShow.start();
|
||||
}
|
||||
} else if (SlideShow && SlideShow.isActive) {
|
||||
SlideShow.clear();
|
||||
}
|
||||
},
|
||||
|
||||
"afterShow.fb": function (e, instance, current) {
|
||||
var SlideShow = instance && instance.SlideShow;
|
||||
|
||||
if (SlideShow && SlideShow.isActive) {
|
||||
SlideShow.set();
|
||||
}
|
||||
},
|
||||
|
||||
"afterKeydown.fb": function (e, instance, current, keypress, keycode) {
|
||||
var SlideShow = instance && instance.SlideShow;
|
||||
|
||||
// "P" or Spacebar
|
||||
if (SlideShow && current.opts.slideShow && (keycode === 80 || keycode === 32) && !$(document.activeElement).is("button,a,input")) {
|
||||
keypress.preventDefault();
|
||||
|
||||
SlideShow.toggle();
|
||||
}
|
||||
},
|
||||
|
||||
"beforeClose.fb onDeactivate.fb": function (e, instance) {
|
||||
var SlideShow = instance && instance.SlideShow;
|
||||
|
||||
if (SlideShow) {
|
||||
SlideShow.stop();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Page Visibility API to pause slideshow when window is not active
|
||||
$(document).on("visibilitychange", function () {
|
||||
var instance = $.fancybox.getInstance(),
|
||||
SlideShow = instance && instance.SlideShow;
|
||||
|
||||
if (SlideShow && SlideShow.isActive) {
|
||||
if (document.hidden) {
|
||||
SlideShow.clear();
|
||||
} else {
|
||||
SlideShow.set();
|
||||
}
|
||||
}
|
||||
});
|
||||
})(document, jQuery);
|
||||
251
libraries/fancybox3/js/thumbs.js
Normal file
251
libraries/fancybox3/js/thumbs.js
Normal file
@@ -0,0 +1,251 @@
|
||||
// ==========================================================================
|
||||
//
|
||||
// Thumbs
|
||||
// Displays thumbnails in a grid
|
||||
//
|
||||
// ==========================================================================
|
||||
(function (document, $) {
|
||||
"use strict";
|
||||
|
||||
var CLASS = "fancybox-thumbs",
|
||||
CLASS_ACTIVE = CLASS + "-active";
|
||||
|
||||
// Make sure there are default values
|
||||
$.fancybox.defaults = $.extend(
|
||||
true, {
|
||||
btnTpl: {
|
||||
thumbs: '<button data-fancybox-thumbs class="fancybox-button fancybox-button--thumbs" title="{{THUMBS}}">' +
|
||||
'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M14.59 14.59h3.76v3.76h-3.76v-3.76zm-4.47 0h3.76v3.76h-3.76v-3.76zm-4.47 0h3.76v3.76H5.65v-3.76zm8.94-4.47h3.76v3.76h-3.76v-3.76zm-4.47 0h3.76v3.76h-3.76v-3.76zm-4.47 0h3.76v3.76H5.65v-3.76zm8.94-4.47h3.76v3.76h-3.76V5.65zm-4.47 0h3.76v3.76h-3.76V5.65zm-4.47 0h3.76v3.76H5.65V5.65z"/></svg>' +
|
||||
"</button>"
|
||||
},
|
||||
thumbs: {
|
||||
autoStart: false, // Display thumbnails on opening
|
||||
hideOnClose: true, // Hide thumbnail grid when closing animation starts
|
||||
parentEl: ".fancybox-container", // Container is injected into this element
|
||||
axis: "y" // Vertical (y) or horizontal (x) scrolling
|
||||
}
|
||||
},
|
||||
$.fancybox.defaults
|
||||
);
|
||||
|
||||
var FancyThumbs = function (instance) {
|
||||
this.init(instance);
|
||||
};
|
||||
|
||||
$.extend(FancyThumbs.prototype, {
|
||||
$button: null,
|
||||
$grid: null,
|
||||
$list: null,
|
||||
isVisible: false,
|
||||
isActive: false,
|
||||
|
||||
init: function (instance) {
|
||||
var self = this,
|
||||
group = instance.group,
|
||||
enabled = 0;
|
||||
|
||||
self.instance = instance;
|
||||
self.opts = group[instance.currIndex].opts.thumbs;
|
||||
|
||||
instance.Thumbs = self;
|
||||
|
||||
self.$button = instance.$refs.toolbar.find("[data-fancybox-thumbs]");
|
||||
|
||||
// Enable thumbs if at least two group items have thumbnails
|
||||
for (var i = 0, len = group.length; i < len; i++) {
|
||||
if (group[i].thumb) {
|
||||
enabled++;
|
||||
}
|
||||
|
||||
if (enabled > 1) {
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
if (enabled > 1 && !!self.opts) {
|
||||
self.$button.removeAttr("style").on("click", function () {
|
||||
self.toggle();
|
||||
});
|
||||
|
||||
self.isActive = true;
|
||||
} else {
|
||||
self.$button.hide();
|
||||
}
|
||||
},
|
||||
|
||||
create: function () {
|
||||
var self = this,
|
||||
instance = self.instance,
|
||||
parentEl = self.opts.parentEl,
|
||||
list = [],
|
||||
src;
|
||||
|
||||
if (!self.$grid) {
|
||||
// Create main element
|
||||
self.$grid = $('<div class="' + CLASS + " " + CLASS + "-" + self.opts.axis + '"></div>').appendTo(
|
||||
instance.$refs.container
|
||||
.find(parentEl)
|
||||
.addBack()
|
||||
.filter(parentEl)
|
||||
);
|
||||
|
||||
// Add "click" event that performs gallery navigation
|
||||
self.$grid.on("click", "a", function () {
|
||||
instance.jumpTo($(this).attr("data-index"));
|
||||
});
|
||||
}
|
||||
|
||||
// Build the list
|
||||
if (!self.$list) {
|
||||
self.$list = $('<div class="' + CLASS + '__list">').appendTo(self.$grid);
|
||||
}
|
||||
|
||||
$.each(instance.group, function (i, item) {
|
||||
src = item.thumb;
|
||||
|
||||
if (!src && item.type === "image") {
|
||||
src = item.src;
|
||||
}
|
||||
|
||||
list.push(
|
||||
'<a href="javascript:;" tabindex="0" data-index="' +
|
||||
i +
|
||||
'"' +
|
||||
(src && src.length ? ' style="background-image:url(' + src + ')"' : 'class="fancybox-thumbs-missing"') +
|
||||
"></a>"
|
||||
);
|
||||
});
|
||||
|
||||
self.$list[0].innerHTML = list.join("");
|
||||
|
||||
if (self.opts.axis === "x") {
|
||||
// Set fixed width for list element to enable horizontal scrolling
|
||||
self.$list.width(
|
||||
parseInt(self.$grid.css("padding-right"), 10) +
|
||||
instance.group.length *
|
||||
self.$list
|
||||
.children()
|
||||
.eq(0)
|
||||
.outerWidth(true)
|
||||
);
|
||||
}
|
||||
},
|
||||
|
||||
focus: function (duration) {
|
||||
var self = this,
|
||||
$list = self.$list,
|
||||
$grid = self.$grid,
|
||||
thumb,
|
||||
thumbPos;
|
||||
|
||||
if (!self.instance.current) {
|
||||
return;
|
||||
}
|
||||
|
||||
thumb = $list
|
||||
.children()
|
||||
.removeClass(CLASS_ACTIVE)
|
||||
.filter('[data-index="' + self.instance.current.index + '"]')
|
||||
.addClass(CLASS_ACTIVE);
|
||||
|
||||
thumbPos = thumb.position();
|
||||
|
||||
// Check if need to scroll to make current thumb visible
|
||||
if (self.opts.axis === "y" && (thumbPos.top < 0 || thumbPos.top > $list.height() - thumb.outerHeight())) {
|
||||
$list.stop().animate({
|
||||
scrollTop: $list.scrollTop() + thumbPos.top
|
||||
},
|
||||
duration
|
||||
);
|
||||
} else if (
|
||||
self.opts.axis === "x" &&
|
||||
(thumbPos.left < $grid.scrollLeft() || thumbPos.left > $grid.scrollLeft() + ($grid.width() - thumb.outerWidth()))
|
||||
) {
|
||||
$list
|
||||
.parent()
|
||||
.stop()
|
||||
.animate({
|
||||
scrollLeft: thumbPos.left
|
||||
},
|
||||
duration
|
||||
);
|
||||
}
|
||||
},
|
||||
|
||||
update: function () {
|
||||
var that = this;
|
||||
that.instance.$refs.container.toggleClass("fancybox-show-thumbs", this.isVisible);
|
||||
|
||||
if (that.isVisible) {
|
||||
if (!that.$grid) {
|
||||
that.create();
|
||||
}
|
||||
|
||||
that.instance.trigger("onThumbsShow");
|
||||
|
||||
that.focus(0);
|
||||
} else if (that.$grid) {
|
||||
that.instance.trigger("onThumbsHide");
|
||||
}
|
||||
|
||||
// Update content position
|
||||
that.instance.update();
|
||||
},
|
||||
|
||||
hide: function () {
|
||||
this.isVisible = false;
|
||||
this.update();
|
||||
},
|
||||
|
||||
show: function () {
|
||||
this.isVisible = true;
|
||||
this.update();
|
||||
},
|
||||
|
||||
toggle: function () {
|
||||
this.isVisible = !this.isVisible;
|
||||
this.update();
|
||||
}
|
||||
});
|
||||
|
||||
$(document).on({
|
||||
"onInit.fb": function (e, instance) {
|
||||
var Thumbs;
|
||||
|
||||
if (instance && !instance.Thumbs) {
|
||||
Thumbs = new FancyThumbs(instance);
|
||||
|
||||
if (Thumbs.isActive && Thumbs.opts.autoStart === true) {
|
||||
Thumbs.show();
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
"beforeShow.fb": function (e, instance, item, firstRun) {
|
||||
var Thumbs = instance && instance.Thumbs;
|
||||
|
||||
if (Thumbs && Thumbs.isVisible) {
|
||||
Thumbs.focus(firstRun ? 0 : 250);
|
||||
}
|
||||
},
|
||||
|
||||
"afterKeydown.fb": function (e, instance, current, keypress, keycode) {
|
||||
var Thumbs = instance && instance.Thumbs;
|
||||
|
||||
// "G"
|
||||
if (Thumbs && Thumbs.isActive && keycode === 71) {
|
||||
keypress.preventDefault();
|
||||
|
||||
Thumbs.toggle();
|
||||
}
|
||||
},
|
||||
|
||||
"beforeClose.fb": function (e, instance) {
|
||||
var Thumbs = instance && instance.Thumbs;
|
||||
|
||||
if (Thumbs && Thumbs.isVisible && Thumbs.opts.hideOnClose !== false) {
|
||||
Thumbs.$grid.hide();
|
||||
}
|
||||
}
|
||||
});
|
||||
})(document, jQuery);
|
||||
41
libraries/fancybox3/js/wheel.js
Normal file
41
libraries/fancybox3/js/wheel.js
Normal file
@@ -0,0 +1,41 @@
|
||||
// ==========================================================================
|
||||
//
|
||||
// Wheel
|
||||
// Basic mouse weheel support for gallery navigation
|
||||
//
|
||||
// ==========================================================================
|
||||
(function (document, $) {
|
||||
"use strict";
|
||||
|
||||
var prevTime = new Date().getTime();
|
||||
|
||||
$(document).on({
|
||||
"onInit.fb": function (e, instance, current) {
|
||||
instance.$refs.stage.on("mousewheel DOMMouseScroll wheel MozMousePixelScroll", function (e) {
|
||||
var current = instance.current,
|
||||
currTime = new Date().getTime();
|
||||
|
||||
if (instance.group.length < 2 || current.opts.wheel === false || (current.opts.wheel === "auto" && current.type !== "image")) {
|
||||
return;
|
||||
}
|
||||
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
|
||||
if (current.$slide.hasClass("fancybox-animated")) {
|
||||
return;
|
||||
}
|
||||
|
||||
e = e.originalEvent || e;
|
||||
|
||||
if (currTime - prevTime < 250) {
|
||||
return;
|
||||
}
|
||||
|
||||
prevTime = currTime;
|
||||
|
||||
instance[(-e.deltaY || -e.deltaX || e.wheelDelta || -e.detail) < 0 ? "next" : "previous"]();
|
||||
});
|
||||
}
|
||||
});
|
||||
})(document, jQuery);
|
||||
Reference in New Issue
Block a user