diff --git a/app/views/modules/gallery_little/.gitkeep b/app/views/modules/gallery_little/.gitkeep new file mode 100644 index 0000000000000000000000000000000000000000..e69de29bb2d1d6434b8b29ae775ad8c2e48c5391 diff --git a/app/views/modules/gallery_little/aquarelle_2.jpg b/app/views/modules/gallery_little/aquarelle_2.jpg new file mode 100644 index 0000000000000000000000000000000000000000..ca473411289f8e219fd3a72e95870055548cd8da Binary files /dev/null and b/app/views/modules/gallery_little/aquarelle_2.jpg differ diff --git a/app/views/modules/gallery_little/default.jpg b/app/views/modules/gallery_little/default.jpg new file mode 100644 index 0000000000000000000000000000000000000000..e04b9dc94032025832d3d140f5ad587b90fc711d Binary files /dev/null and b/app/views/modules/gallery_little/default.jpg differ diff --git a/app/views/modules/gallery_little/edit.js b/app/views/modules/gallery_little/edit.js new file mode 100644 index 0000000000000000000000000000000000000000..fa6c655a01645202c8968290c4bf56e84a4d8d8a --- /dev/null +++ b/app/views/modules/gallery_little/edit.js @@ -0,0 +1,19 @@ +$('.editGalleryImage').click(function () { + let id = this.id.split("-")[1] + let img=this.id.split("-")[2] + $("#siteOptionsModal").modal('open') + $("a[href=#options-medias]").click() + MediaManagment.render(true, "uglyForm-"+id+"-imgUrl"+img) + initMainSaveBtn() +}) +$('.removeGalleryImage').click(function () { + let id = this.id.split("-")[1] + let field= this.id.split("-")[2] + $('#uglyForm input[name=uglyForm-'+id+'-'+field+']').val(""); + $('#moduleValue-'+field).attr('src', 'app/views/modules/gallery/default.png') + console.log(field) + setTimeout(function () { + $('.carousel.carousel-slider').carousel({fullWidth: true,indicators: true }); + },200) + initMainSaveBtn() +}) \ No newline at end of file diff --git a/app/views/modules/gallery_little/info.json b/app/views/modules/gallery_little/info.json new file mode 100644 index 0000000000000000000000000000000000000000..72edd53a42c153bdc736f275ed88f902f22965f1 --- /dev/null +++ b/app/views/modules/gallery_little/info.json @@ -0,0 +1,413 @@ +{ + "name": "gallery_little", + "title": "Galerie petites colonnes", + "description": "Module permettant de presenter jusqu'a 100 images sous forme d'un portfolio", + "tags": "moduleTag-img moduleTag-animated", + "hidden" : false, + "fields": { + "title": { + "type": "text", + "value": "
Galerie
" + }, + "imgUrl0": { + "type": "text", + "value": "app/views/modules/gallery/aquarelle_2.jpg" + }, + "imgUrl1": { + "type": "text", + "value": "" + }, + "imgUrl2": { + "type": "text", + "value": "" + }, + "imgUrl3": { + "type": "text", + "value": "" + }, + "imgUrl4": { + "type": "text", + "value": "" + }, + "imgUrl5": { + "type": "text", + "value": "" + }, + "imgUrl6": { + "type": "text", + "value": "" + }, + "imgUrl7": { + "type": "text", + "value": "" + }, + "imgUrl8": { + "type": "text", + "value": "" + }, + "imgUrl9": { + "type": "text", + "value": "" + }, + "imgUrl10": { + "type": "text", + "value": "" + }, + "imgUrl11": { + "type": "text", + "value": "" + }, + "imgUrl12": { + "type": "text", + "value": "" + }, + "imgUrl13": { + "type": "text", + "value": "" + }, + "imgUrl14": { + "type": "text", + "value": "" + }, + "imgUrl15": { + "type": "text", + "value": "" + }, + "imgUrl16": { + "type": "text", + "value": "" + }, + "imgUrl17": { + "type": "text", + "value": "" + }, + "imgUrl18": { + "type": "text", + "value": "" + }, + "imgUrl19": { + "type": "text", + "value": "" + }, + "imgUrl20": { + "type": "text", + "value": "" + }, + "imgUrl21": { + "type": "text", + "value": "" + }, + "imgUrl22": { + "type": "text", + "value": "" + }, + "imgUrl23": { + "type": "text", + "value": "" + }, + "imgUrl24": { + "type": "text", + "value": "" + }, + "imgUrl25": { + "type": "text", + "value": "" + }, + "imgUrl26": { + "type": "text", + "value": "" + }, + "imgUrl27": { + "type": "text", + "value": "" + }, + "imgUrl28": { + "type": "text", + "value": "" + }, + "imgUrl29": { + "type": "text", + "value": "" + }, + "imgUrl30": { + "type": "text", + "value": "" + }, + "imgUrl31": { + "type": "text", + "value": "" + }, + "imgUrl32": { + "type": "text", + "value": "" + }, + "imgUrl33": { + "type": "text", + "value": "" + }, + "imgUrl34": { + "type": "text", + "value": "" + }, + "imgUrl35": { + "type": "text", + "value": "" + }, + "imgUrl36": { + "type": "text", + "value": "" + }, + "imgUrl37": { + "type": "text", + "value": "" + }, + "imgUrl38": { + "type": "text", + "value": "" + }, + "imgUrl39": { + "type": "text", + "value": "" + }, + "imgUrl40": { + "type": "text", + "value": "" + }, + "imgUrl41": { + "type": "text", + "value": "" + }, + "imgUrl42": { + "type": "text", + "value": "" + }, + "imgUrl43": { + "type": "text", + "value": "" + }, + "imgUrl44": { + "type": "text", + "value": "" + }, + "imgUrl45": { + "type": "text", + "value": "" + }, + "imgUrl46": { + "type": "text", + "value": "" + }, + "imgUrl47": { + "type": "text", + "value": "" + }, + "imgUrl48": { + "type": "text", + "value": "" + }, + "imgUrl49": { + "type": "text", + "value": "" + }, + "imgUrl50": { + "type": "text", + "value": "" + }, + "imgUrl51": { + "type": "text", + "value": "" + }, + "imgUrl52": { + "type": "text", + "value": "" + }, + "imgUrl53": { + "type": "text", + "value": "" + }, + "imgUrl54": { + "type": "text", + "value": "" + }, + "imgUrl55": { + "type": "text", + "value": "" + }, + "imgUrl56": { + "type": "text", + "value": "" + }, + "imgUrl57": { + "type": "text", + "value": "" + }, + "imgUrl58": { + "type": "text", + "value": "" + }, + "imgUrl59": { + "type": "text", + "value": "" + }, + "imgUrl60": { + "type": "text", + "value": "" + }, + "imgUrl61": { + "type": "text", + "value": "" + }, + "imgUrl62": { + "type": "text", + "value": "" + }, + "imgUrl63": { + "type": "text", + "value": "" + }, + "imgUrl64": { + "type": "text", + "value": "" + }, + "imgUrl65": { + "type": "text", + "value": "" + }, + "imgUrl66": { + "type": "text", + "value": "" + }, + "imgUrl67": { + "type": "text", + "value": "" + }, + "imgUrl68": { + "type": "text", + "value": "" + }, + "imgUrl69": { + "type": "text", + "value": "" + }, + "imgUrl70": { + "type": "text", + "value": "" + }, + "imgUrl71": { + "type": "text", + "value": "" + }, + "imgUrl72": { + "type": "text", + "value": "" + }, + "imgUrl73": { + "type": "text", + "value": "" + }, + "imgUrl74": { + "type": "text", + "value": "" + }, + "imgUrl75": { + "type": "text", + "value": "" + }, + "imgUrl76": { + "type": "text", + "value": "" + }, + "imgUrl77": { + "type": "text", + "value": "" + }, + "imgUrl78": { + "type": "text", + "value": "" + }, + "imgUrl79": { + "type": "text", + "value": "" + }, + "imgUrl80": { + "type": "text", + "value": "" + }, + "imgUrl81": { + "type": "text", + "value": "" + }, + "imgUrl82": { + "type": "text", + "value": "" + }, + "imgUrl83": { + "type": "text", + "value": "" + }, + "imgUrl84": { + "type": "text", + "value": "" + }, + "imgUrl85": { + "type": "text", + "value": "" + }, + "imgUrl86": { + "type": "text", + "value": "" + }, + "imgUrl87": { + "type": "text", + "value": "" + }, + "imgUrl88": { + "type": "text", + "value": "" + }, + "imgUrl89": { + "type": "text", + "value": "" + }, + "imgUrl90": { + "type": "text", + "value": "" + }, + "imgUrl91": { + "type": "text", + "value": "" + }, + "imgUrl92": { + "type": "text", + "value": "" + }, + "imgUrl93": { + "type": "text", + "value": "" + }, + "imgUrl94": { + "type": "text", + "value": "" + }, + "imgUrl95": { + "type": "text", + "value": "" + }, + "imgUrl96": { + "type": "text", + "value": "" + }, + "imgUrl97": { + "type": "text", + "value": "" + }, + "imgUrl98": { + "type": "text", + "value": "" + }, + "imgUrl99": { + "type": "text", + "value": "" + } + } +} diff --git a/app/views/modules/gallery_little/module.htm b/app/views/modules/gallery_little/module.htm new file mode 100644 index 0000000000000000000000000000000000000000..d40dc9b8f2b7d6ea86f0fa5029c0ac3748c8222b --- /dev/null +++ b/app/views/modules/gallery_little/module.htm @@ -0,0 +1,41 @@ + +
+
+ +
+

+ Seules les images complétées seront visibles par vos visiteurs +

+
+
+ + +
+ +
+ diff --git a/app/views/modules/gallery_little/preview.png b/app/views/modules/gallery_little/preview.png new file mode 100644 index 0000000000000000000000000000000000000000..0bb6f51d8366d04ee85863ac157d8be9a2be23a9 Binary files /dev/null and b/app/views/modules/gallery_little/preview.png differ diff --git a/app/views/modules/gallery_little/show.js b/app/views/modules/gallery_little/show.js new file mode 100644 index 0000000000000000000000000000000000000000..4943d430681b5b011d8553347df4c389dd867220 --- /dev/null +++ b/app/views/modules/gallery_little/show.js @@ -0,0 +1,545 @@ +/*! Lightbox v2.10.0 +* by Lokesh Dhakar +* +* More info: + * http://lokeshdhakar.com/projects/lightbox2/ + * +* Copyright 2007, 2018 Lokesh Dhakar +* Released under the MIT license +* https://github.com/lokesh/lightbox2/blob/master/LICENSE +* +* @preserve +*/ + +// Uses Node, AMD or browser globals to create a module. +(function (root, factory) { + if (typeof define === 'function' && define.amd) { + // AMD. Register as an anonymous module. + define(['jquery'], factory); + } else if (typeof exports === 'object') { + // Node. Does not work with strict CommonJS, but + // only CommonJS-like environments that support module.exports, + // like Node. + module.exports = factory(require('jquery')); + } else { + // Browser globals (root is window) + root.lightbox = factory(root.jQuery); + } +}(this, function ($) { + + function Lightbox(options) { + this.album = []; + this.currentImageIndex = void 0; + this.init(); + + // options + this.options = $.extend({}, this.constructor.defaults); + this.option(options); + } + + // Descriptions of all options available on the demo site: + // http://lokeshdhakar.com/projects/lightbox2/index.html#options + Lightbox.defaults = { + albumLabel: 'Image %1 of %2', + alwaysShowNavOnTouchDevices: false, + fadeDuration: 600, + fitImagesInViewport: true, + imageFadeDuration: 600, + // maxWidth: 800, + // maxHeight: 600, + positionFromTop: 50, + resizeDuration: 700, + showImageNumberLabel: true, + wrapAround: false, + disableScrolling: false, + /* + Sanitize Title + If the caption data is trusted, for example you are hardcoding it in, then leave this to false. + This will free you to add html tags, such as links, in the caption. + + If the caption data is user submitted or from some other untrusted source, then set this to true + to prevent xss and other injection attacks. + */ + sanitizeTitle: false + }; + + Lightbox.prototype.option = function (options) { + $.extend(this.options, options); + }; + + Lightbox.prototype.imageCountLabel = function (currentImageNum, totalImages) { + return this.options.albumLabel.replace(/%1/g, currentImageNum).replace(/%2/g, totalImages); + }; + + Lightbox.prototype.init = function () { + var self = this; + // Both enable and build methods require the body tag to be in the DOM. + $(document).ready(function () { + self.enable(); + self.build(); + }); + }; + + // Loop through anchors and areamaps looking for either data-lightbox attributes or rel attributes + // that contain 'lightbox'. When these are clicked, start lightbox. + Lightbox.prototype.enable = function () { + var self = this; + $('body').on('click', 'a[rel^=lightbox], area[rel^=lightbox], a[data-lightbox], area[data-lightbox]', function (event) { + self.start($(event.currentTarget)); + return false; + }); + }; + + // Build html for the lightbox and the overlay. + // Attach event handlers to the new DOM elements. click click click + Lightbox.prototype.build = function () { + if ($('#lightbox').length > 0) { + return; + } + + var self = this; + $('
').appendTo($('body')); + + // Cache jQuery objects + this.$lightbox = $('#lightbox'); + this.$overlay = $('#lightboxOverlay'); + this.$outerContainer = this.$lightbox.find('.lb-outerContainer'); + this.$container = this.$lightbox.find('.lb-container'); + this.$image = this.$lightbox.find('.lb-image'); + this.$nav = this.$lightbox.find('.lb-nav'); + + // Store css values for future lookup + this.containerPadding = { + top: parseInt(this.$container.css('padding-top'), 10), + right: parseInt(this.$container.css('padding-right'), 10), + bottom: parseInt(this.$container.css('padding-bottom'), 10), + left: parseInt(this.$container.css('padding-left'), 10) + }; + + this.imageBorderWidth = { + top: parseInt(this.$image.css('border-top-width'), 10), + right: parseInt(this.$image.css('border-right-width'), 10), + bottom: parseInt(this.$image.css('border-bottom-width'), 10), + left: parseInt(this.$image.css('border-left-width'), 10) + }; + + // Attach event handlers to the newly minted DOM elements + this.$overlay.hide().on('click', function () { + self.end(); + return false; + }); + + this.$lightbox.hide().on('click', function (event) { + if ($(event.target).attr('id') === 'lightbox') { + self.end(); + } + return false; + }); + + this.$outerContainer.on('click', function (event) { + if ($(event.target).attr('id') === 'lightbox') { + self.end(); + } + return false; + }); + + this.$lightbox.find('.lb-prev').on('click', function () { + if (self.currentImageIndex === 0) { + self.changeImage(self.album.length - 1); + } else { + self.changeImage(self.currentImageIndex - 1); + } + return false; + }); + + this.$lightbox.find('.lb-next').on('click', function () { + if (self.currentImageIndex === self.album.length - 1) { + self.changeImage(0); + } else { + self.changeImage(self.currentImageIndex + 1); + } + return false; + }); + + /* + Show context menu for image on right-click + + There is a div containing the navigation that spans the entire image and lives above of it. If + you right-click, you are right clicking this div and not the image. This prevents users from + saving the image or using other context menu actions with the image. + + To fix this, when we detect the right mouse button is pressed down, but not yet clicked, we + set pointer-events to none on the nav div. This is so that the upcoming right-click event on + the next mouseup will bubble down to the image. Once the right-click/contextmenu event occurs + we set the pointer events back to auto for the nav div so it can capture hover and left-click + events as usual. + */ + this.$nav.on('mousedown', function (event) { + if (event.which === 3) { + self.$nav.css('pointer-events', 'none'); + + self.$lightbox.one('contextmenu', function () { + setTimeout(function () { + this.$nav.css('pointer-events', 'auto'); + }.bind(self), 0); + }); + } + }); + + + this.$lightbox.find('.lb-loader, .lb-close').on('click', function () { + self.end(); + return false; + }); + }; + + // Show overlay and lightbox. If the image is part of a set, add siblings to album array. + Lightbox.prototype.start = function ($link) { + var self = this; + var $window = $(window); + + $window.on('resize', $.proxy(this.sizeOverlay, this)); + + $('select, object, embed').css({ + visibility: 'hidden' + }); + + this.sizeOverlay(); + + this.album = []; + var imageNumber = 0; + + function addToAlbum($link) { + self.album.push({ + alt: $link.attr('data-alt'), + link: $link.attr('href'), + title: $link.attr('data-title') || $link.attr('title') + }); + } + + // Support both data-lightbox attribute and rel attribute implementations + var dataLightboxValue = $link.attr('data-lightbox'); + var $links; + + if (dataLightboxValue) { + $links = $($link.prop('tagName') + '[data-lightbox="' + dataLightboxValue + '"]'); + for (var i = 0; i < $links.length; i = ++i) { + addToAlbum($($links[i])); + if ($links[i] === $link[0]) { + imageNumber = i; + } + } + } else { + if ($link.attr('rel') === 'lightbox') { + // If image is not part of a set + addToAlbum($link); + } else { + // If image is part of a set + $links = $($link.prop('tagName') + '[rel="' + $link.attr('rel') + '"]'); + for (var j = 0; j < $links.length; j = ++j) { + addToAlbum($($links[j])); + if ($links[j] === $link[0]) { + imageNumber = j; + } + } + } + } + + // Position Lightbox + var top = $window.scrollTop() + this.options.positionFromTop; + var left = $window.scrollLeft(); + this.$lightbox.css({ + top: top + 'px', + left: left + 'px' + }).fadeIn(this.options.fadeDuration); + + // Disable scrolling of the page while open + if (this.options.disableScrolling) { + $('html').addClass('lb-disable-scrolling'); + } + + this.changeImage(imageNumber); + }; + + // Hide most UI elements in preparation for the animated resizing of the lightbox. + Lightbox.prototype.changeImage = function (imageNumber) { + var self = this; + + this.disableKeyboardNav(); + var $image = this.$lightbox.find('.lb-image'); + + this.$overlay.fadeIn(this.options.fadeDuration); + + $('.lb-loader').fadeIn('slow'); + this.$lightbox.find('.lb-image, .lb-nav, .lb-prev, .lb-next, .lb-dataContainer, .lb-numbers, .lb-caption').hide(); + + this.$outerContainer.addClass('animating'); + + // When image to show is preloaded, we send the width and height to sizeContainer() + var preloader = new Image(); + preloader.onload = function () { + var $preloader; + var imageHeight; + var imageWidth; + var maxImageHeight; + var maxImageWidth; + var windowHeight; + var windowWidth; + + $image.attr({ + 'alt': self.album[imageNumber].alt, + 'src': self.album[imageNumber].link + }); + + $preloader = $(preloader); + + $image.width(preloader.width); + $image.height(preloader.height); + + if (self.options.fitImagesInViewport) { + // Fit image inside the viewport. + // Take into account the border around the image and an additional 10px gutter on each side. + + windowWidth = $(window).width(); + windowHeight = $(window).height(); + maxImageWidth = windowWidth - self.containerPadding.left - self.containerPadding.right - self.imageBorderWidth.left - self.imageBorderWidth.right - 20; + maxImageHeight = windowHeight - self.containerPadding.top - self.containerPadding.bottom - self.imageBorderWidth.top - self.imageBorderWidth.bottom - 120; + + // Check if image size is larger then maxWidth|maxHeight in settings + if (self.options.maxWidth && self.options.maxWidth < maxImageWidth) { + maxImageWidth = self.options.maxWidth; + } + if (self.options.maxHeight && self.options.maxHeight < maxImageWidth) { + maxImageHeight = self.options.maxHeight; + } + + // Is the current image's width or height is greater than the maxImageWidth or maxImageHeight + // option than we need to size down while maintaining the aspect ratio. + if ((preloader.width > maxImageWidth) || (preloader.height > maxImageHeight)) { + if ((preloader.width / maxImageWidth) > (preloader.height / maxImageHeight)) { + imageWidth = maxImageWidth; + imageHeight = parseInt(preloader.height / (preloader.width / imageWidth), 10); + $image.width(imageWidth); + $image.height(imageHeight); + } else { + imageHeight = maxImageHeight; + imageWidth = parseInt(preloader.width / (preloader.height / imageHeight), 10); + $image.width(imageWidth); + $image.height(imageHeight); + } + } + } + self.sizeContainer($image.width(), $image.height()); + }; + + preloader.src = this.album[imageNumber].link; + this.currentImageIndex = imageNumber; + }; + + // Stretch overlay to fit the viewport + Lightbox.prototype.sizeOverlay = function () { + this.$overlay + .width($(document).width()) + .height($(document).height()); + }; + + // Animate the size of the lightbox to fit the image we are showing + Lightbox.prototype.sizeContainer = function (imageWidth, imageHeight) { + var self = this; + + var oldWidth = this.$outerContainer.outerWidth(); + var oldHeight = this.$outerContainer.outerHeight(); + var newWidth = imageWidth + this.containerPadding.left + this.containerPadding.right + this.imageBorderWidth.left + this.imageBorderWidth.right; + var newHeight = imageHeight + this.containerPadding.top + this.containerPadding.bottom + this.imageBorderWidth.top + this.imageBorderWidth.bottom; + + function postResize() { + self.$lightbox.find('.lb-dataContainer').width(newWidth); + self.$lightbox.find('.lb-prevLink').height(newHeight); + self.$lightbox.find('.lb-nextLink').height(newHeight); + self.showImage(); + } + + if (oldWidth !== newWidth || oldHeight !== newHeight) { + this.$outerContainer.animate({ + width: newWidth, + height: newHeight + }, this.options.resizeDuration, 'swing', function () { + postResize(); + }); + } else { + postResize(); + } + }; + + // Display the image and its details and begin preload neighboring images. + Lightbox.prototype.showImage = function () { + this.$lightbox.find('.lb-loader').stop(true).hide(); + this.$lightbox.find('.lb-image').fadeIn(this.options.imageFadeDuration); + + this.updateNav(); + this.updateDetails(); + this.preloadNeighboringImages(); + this.enableKeyboardNav(); + }; + + // Display previous and next navigation if appropriate. + Lightbox.prototype.updateNav = function () { + // Check to see if the browser supports touch events. If so, we take the conservative approach + // and assume that mouse hover events are not supported and always show prev/next navigation + // arrows in image sets. + var alwaysShowNav = false; + try { + document.createEvent('TouchEvent'); + alwaysShowNav = (this.options.alwaysShowNavOnTouchDevices) ? true : false; + } catch (e) { + } + + this.$lightbox.find('.lb-nav').show(); + + if (this.album.length > 1) { + if (this.options.wrapAround) { + if (alwaysShowNav) { + this.$lightbox.find('.lb-prev, .lb-next').css('opacity', '1'); + } + this.$lightbox.find('.lb-prev, .lb-next').show(); + } else { + if (this.currentImageIndex > 0) { + this.$lightbox.find('.lb-prev').show(); + if (alwaysShowNav) { + this.$lightbox.find('.lb-prev').css('opacity', '1'); + } + } + if (this.currentImageIndex < this.album.length - 1) { + this.$lightbox.find('.lb-next').show(); + if (alwaysShowNav) { + this.$lightbox.find('.lb-next').css('opacity', '1'); + } + } + } + } + }; + + // Display caption, image number, and closing button. + Lightbox.prototype.updateDetails = function () { + var self = this; + + // Enable anchor clicks in the injected caption html. + // Thanks Nate Wright for the fix. @https://github.com/NateWr + if (typeof this.album[this.currentImageIndex].title !== 'undefined' && + this.album[this.currentImageIndex].title !== '') { + var $caption = this.$lightbox.find('.lb-caption'); + if (this.options.sanitizeTitle) { + $caption.text(this.album[this.currentImageIndex].title); + } else { + $caption.html(this.album[this.currentImageIndex].title); + } + $caption.fadeIn('fast') + .find('a').on('click', function (event) { + if ($(this).attr('target') !== undefined) { + window.open($(this).attr('href'), $(this).attr('target')); + } else { + location.href = $(this).attr('href'); + } + }); + } + + if (this.album.length > 1 && this.options.showImageNumberLabel) { + var labelText = this.imageCountLabel(this.currentImageIndex + 1, this.album.length); + this.$lightbox.find('.lb-number').text(labelText).fadeIn('fast'); + } else { + this.$lightbox.find('.lb-number').hide(); + } + + this.$outerContainer.removeClass('animating'); + + this.$lightbox.find('.lb-dataContainer').fadeIn(this.options.resizeDuration, function () { + return self.sizeOverlay(); + }); + }; + + // Preload previous and next images in set. + Lightbox.prototype.preloadNeighboringImages = function () { + if (this.album.length > this.currentImageIndex + 1) { + var preloadNext = new Image(); + preloadNext.src = this.album[this.currentImageIndex + 1].link; + } + if (this.currentImageIndex > 0) { + var preloadPrev = new Image(); + preloadPrev.src = this.album[this.currentImageIndex - 1].link; + } + }; + + Lightbox.prototype.enableKeyboardNav = function () { + $(document).on('keyup.keyboard', $.proxy(this.keyboardAction, this)); + }; + + Lightbox.prototype.disableKeyboardNav = function () { + $(document).off('.keyboard'); + }; + + Lightbox.prototype.keyboardAction = function (event) { + var KEYCODE_ESC = 27; + var KEYCODE_LEFTARROW = 37; + var KEYCODE_RIGHTARROW = 39; + + var keycode = event.keyCode; + var key = String.fromCharCode(keycode).toLowerCase(); + if (keycode === KEYCODE_ESC || key.match(/x|o|c/)) { + this.end(); + } else if (key === 'p' || keycode === KEYCODE_LEFTARROW) { + if (this.currentImageIndex !== 0) { + this.changeImage(this.currentImageIndex - 1); + } else if (this.options.wrapAround && this.album.length > 1) { + this.changeImage(this.album.length - 1); + } + } else if (key === 'n' || keycode === KEYCODE_RIGHTARROW) { + if (this.currentImageIndex !== this.album.length - 1) { + this.changeImage(this.currentImageIndex + 1); + } else if (this.options.wrapAround && this.album.length > 1) { + this.changeImage(0); + } + } + }; + + // Closing time. :-( + Lightbox.prototype.end = function () { + this.disableKeyboardNav(); + $(window).off('resize', this.sizeOverlay); + this.$lightbox.fadeOut(this.options.fadeDuration); + this.$overlay.fadeOut(this.options.fadeDuration); + $('select, object, embed').css({ + visibility: 'visible' + }); + if (this.options.disableScrolling) { + $('html').removeClass('lb-disable-scrolling'); + } + }; + + return new Lightbox(); +})); + +$(document).ready(function () { + lightbox.option({ + 'alwaysShowNavOnTouchDevices': true, + 'resizeDuration': 300, + 'wrapAround': true, + 'showImageNumberLabel': "" + }) + + // $('.carousselImage').hover( + // function () { + // $(this).animate({ + // 'padding-top' : 0, + // 'padding-right' : 0, + // 'padding-bottom' : 0, + // 'padding-left' : 0, + // }, "medium") + // }, function () { + // $(this).animate({ + // 'padding-top' : 7, + // 'padding-right' : 7, + // 'padding-bottom' : 7, + // 'padding-left' : 7, + // }, "medium") + // }) +});