diff options
| -rw-r--r-- | js/app.js | 9 | ||||
| -rw-r--r-- | js/gallery.js | 4 | ||||
| -rw-r--r-- | js/galleryfileaction.js | 15 | ||||
| -rw-r--r-- | js/galleryview.js | 4 | ||||
| -rw-r--r-- | js/slideshow.js | 113 |
5 files changed, 76 insertions, 69 deletions
@@ -1,4 +1,4 @@ -/* global OC, $, _, Gallery */ +/* global OC, $, _, Gallery, SlideShow */ $(document).ready(function () { "use strict"; Gallery.hideSearch(); @@ -22,7 +22,12 @@ $(document).ready(function () { .then(function (config) { Gallery.config = new Gallery.Config(config); Gallery.getFiles().then(function () { - window.onhashchange(); + Gallery.activeSlideShow = new SlideShow(); + $.when(Gallery.activeSlideShow.init(false, null)) + .then(function () { + window.onhashchange(); + }); + }); }); diff --git a/js/gallery.js b/js/gallery.js index c39a8de4..93e398f6 100644 --- a/js/gallery.js +++ b/js/gallery.js @@ -1,4 +1,4 @@ -/* global Album, GalleryImage */ +/* global Album, GalleryImage, SlideShow */ (function (OC, $, t) { "use strict"; var Gallery = { @@ -235,7 +235,7 @@ * * @param event */ - showSaveForm: function (event) { + showSaveForm: function () { $(this).hide(); $('.save-form').css('display', 'inline'); $('#remote_address').focus(); diff --git a/js/galleryfileaction.js b/js/galleryfileaction.js index 53423cdd..9fb5a3ad 100644 --- a/js/galleryfileaction.js +++ b/js/galleryfileaction.js @@ -1,5 +1,5 @@ /* global oc_requesttoken, FileList, SlideShow */ -(function (OC ,OCA, $, oc_requesttoken) { +(function (OC, OCA, $, oc_requesttoken) { "use strict"; var galleryFileAction = { config: null, @@ -108,10 +108,17 @@ } if ($.isEmptyObject(galleryFileAction.slideShow)) { - galleryFileAction.slideShow = new SlideShow($('#slideshow')); - galleryFileAction.slideShow.init(false, null); + galleryFileAction.slideShow = new SlideShow(); + $.when(galleryFileAction.slideShow.init(false, null)) + .then(function () { + galleryFileAction._startSlideshow(images, start); + }); + } else { + galleryFileAction._startSlideshow(images, start); } + }, + _startSlideshow: function (images, start) { galleryFileAction.slideShow.setImages(images); var scrollTop = galleryFileAction.scrollContainer.scrollTop(); @@ -141,7 +148,7 @@ }; window.galleryFileAction = galleryFileAction; -}(OC ,OCA, jQuery, oc_requesttoken)); +}(OC, OCA, jQuery, oc_requesttoken)); $(document).ready(function () { "use strict"; diff --git a/js/galleryview.js b/js/galleryview.js index 4af069e9..a2b2d5ad 100644 --- a/js/galleryview.js +++ b/js/galleryview.js @@ -1,4 +1,4 @@ -/* global Gallery, SlideShow */ +/* global Gallery */ (function (OC, t, $, _) { "use strict"; /** @@ -44,8 +44,6 @@ $('#sort-date-button').click(Gallery.sorter); $('#save #save-button').click(Gallery.showSaveForm); $('.save-form').submit(Gallery.saveForm); - Gallery.activeSlideShow = new SlideShow($('#slideshow')); - Gallery.activeSlideShow.init(false, null); } this.viewAlbum(albumPath); } diff --git a/js/slideshow.js b/js/slideshow.js index cfe11af0..30861e4f 100644 --- a/js/slideshow.js +++ b/js/slideshow.js @@ -1,4 +1,4 @@ -/* global $, OC, OCA, t, Gallery */ +/* global Gallery */ (function ($, OC, OCA, t) { "use strict"; /** @@ -10,6 +10,7 @@ }; SlideShow.prototype = { + slideshowTemplate: null, container: null, zoomablePreviewContainer: null, controls: null, @@ -27,26 +28,44 @@ * @param {int} interval */ init: function (autoPlay, interval) { - this.container = $('#slideshow'); - this.zoomablePreviewContainer = this.container.find('.bigshotContainer'); // FIXME: This should come from the configuration /**@param {int} maxScale*/ this.maxScale = 1; - // Stop the slideshow when backing out. - var self = this; - if (history && history.pushState) { - $(window).bind('popstate.slideshow', function () { - if (self.active === true) { - self.active = false; - self.controls.stop(); - } - }); - } - this.zoomablePreview = new SlideShow.ZoomablePreview(this.container); - this.controls = - new SlideShow.Controls(this, this.container, this.zoomablePreview, interval); - this.controls.init(); + return $.when(this._getSlideshowTemplate()).then(function ($tmpl) { + // Move the slideshow outside the content so we can hide the content + $('body').append($tmpl); + this.container = $('#slideshow'); + this.zoomablePreviewContainer = this.container.find('.bigshotContainer'); + this.zoomablePreview = new SlideShow.ZoomablePreview(this.container); + this.controls = + new SlideShow.Controls(this, this.container, this.zoomablePreview, interval); + this.controls.init(); + + this._initControlsAutoFader(); + + // Replace all Owncloud svg images with png images for ancient browsers + if (!OC.Util.hasSVGSupport()) { + OC.Util.replaceSVG(this.$el); + } + + // Don't show the download button on the "Files" slideshow + if (OCA.Files) { + this.container.find('.downloadImage').hide(); + } + + // Stop the slideshow when backing out. + if (history && history.pushState) { + $(window).bind('popstate.slideshow', function () { + if (this.active === true) { + this.active = false; + this.controls.stop(); + } + }.bind(this)); + } + }.bind(this)).fail(function () { + OC.Notification.show(t('core', 'Error loading slideshow template')); + }); }, /** @@ -224,6 +243,23 @@ }, /** + * Automatically fades the controls after 3 seconds + * @private + */ + _initControlsAutoFader: function () { + var inactiveCallback = function () { + this.container.addClass('inactive'); + }.bind(this); + var inactiveTimeout = setTimeout(inactiveCallback, 3000); + + this.container.on('mousemove touchstart', function () { + this.container.removeClass('inactive'); + clearTimeout(inactiveTimeout); + inactiveTimeout = setTimeout(inactiveCallback, 3000); + }.bind(this)); + }, + + /** * Changes the browser Url, based on the current image * * @param {string} path @@ -283,8 +319,9 @@ * Retrieves the slideshow's template * * @returns {*} + * @private */ - getSlideshowTemplate: function () { + _getSlideshowTemplate: function () { var defer = $.Deferred(); if (!this.$slideshowTemplate) { var self = this; @@ -350,43 +387,3 @@ window.SlideShow = SlideShow; })(jQuery, OC, OCA, t); - -$(document).ready(function () { - // Deactivates slideshow on login page - if ($('#body-login').length > 0) { - return true; - } - // Deactivates slideshow on public preview page - if ($('#imgframe').length > 0) { - return true; - } - - var slideshow = new window.SlideShow(); - - $.when(slideshow.getSlideshowTemplate()).then(function ($tmpl) { - $('body').append($tmpl); //move the slideshow outside the content so we can hide the content - - var inactiveCallback = function () { - $('#slideshow').addClass('inactive'); - }; - var inactiveTimeout = setTimeout(inactiveCallback, 3000); - - $('#slideshow').on('mousemove touchstart', function () { - $('#slideshow').removeClass('inactive'); - clearTimeout(inactiveTimeout); - inactiveTimeout = setTimeout(inactiveCallback, 3000); - }); - - // replace all Owncloud svg images with png images for browser that don't support svg - if (!OC.Util.hasSVGSupport()) { - OC.Util.replaceSVG(this.$el); - } - - if (OCA.Files) { - // Don't show the download button on the "Files" slideshow - $('#slideshow').find('.downloadImage').hide(); - } - }).fail(function () { - OC.Notification.show(t('core', 'Error loading slideshow template')); - }); -}); |