diff options
| -rw-r--r-- | StoneIsland/www/css/vendor/imageviewer.css | 4 | ||||
| -rwxr-xr-x | StoneIsland/www/js/index.js | 1 | ||||
| -rwxr-xr-x | StoneIsland/www/js/lib/blogs/HubView.js | 10 | ||||
| -rwxr-xr-x | StoneIsland/www/js/lib/products/GalleryView.js | 7 | ||||
| -rw-r--r-- | StoneIsland/www/js/vendor/imageviewer.js | 38 | ||||
| -rwxr-xr-x | proxy/index.js | 2 |
6 files changed, 40 insertions, 22 deletions
diff --git a/StoneIsland/www/css/vendor/imageviewer.css b/StoneIsland/www/css/vendor/imageviewer.css index 5f7d326e..c5709bb4 100644 --- a/StoneIsland/www/css/vendor/imageviewer.css +++ b/StoneIsland/www/css/vendor/imageviewer.css @@ -8,7 +8,7 @@ /***** image viewer css *****/ #iv-container { position: fixed; - background: #0d0d0d; + background: #ffffff; width: 100%; height: 100%; top: 0; @@ -41,7 +41,7 @@ content: ""; height: 4px; width: 32px; - background: #FFF; + background: #000; position: absolute; left: 0; top: 50%; diff --git a/StoneIsland/www/js/index.js b/StoneIsland/www/js/index.js index 164d98cc..9b54ad44 100755 --- a/StoneIsland/www/js/index.js +++ b/StoneIsland/www/js/index.js @@ -127,6 +127,7 @@ var app = (function(){ if (window.deepLinkRoute) { app.router.go(window.deepLinkRoute) } + app.fullscreenViewer = ImageViewer() $("body").removeClass("loading") } diff --git a/StoneIsland/www/js/lib/blogs/HubView.js b/StoneIsland/www/js/lib/blogs/HubView.js index 20046fdf..c09dd3b3 100755 --- a/StoneIsland/www/js/lib/blogs/HubView.js +++ b/StoneIsland/www/js/lib/blogs/HubView.js @@ -74,7 +74,7 @@ var HubView = ScrollableView.extend({ el.className = "item" $gallery.append(el) }) - this.galleries[row.id] = new Flickity( ".gallery-" + row.id, { + var gallery = this.galleries[row.id] = new Flickity( ".gallery-" + row.id, { selector: '.item', cellAlign: 'center', autoPlay: false, @@ -86,6 +86,10 @@ var HubView = ScrollableView.extend({ contain: true, draggable: true, }) + gallery.on('staticClick', function(e){ + var url = gallery.selectedElement.style.backgroundImage.replace(/url\(\"?/,"").replace(/\"?\)/,"") + app.fullscreenViewer.show(url, url) + }) } else { // single image @@ -108,6 +112,10 @@ var HubView = ScrollableView.extend({ var ytid = (url.match(/v=([-_a-zA-Z0-9]{11})/i) || url.match(/youtu.be\/([-_a-zA-Z0-9]{11})/i) || url.match(/embed\/([-_a-zA-Z0-9]{11})/i))[1].split('&')[0]; e.style.backgroundImage = "url(https://i.ytimg.com/vi/" + ytid + "/maxresdefault.jpg" } + } else { + $(el).click(function(){ + app.fullscreenViewer.show(row.image[0].uri) + }) } $t.find(".gallery-left").remove() $t.find(".gallery-right").remove() diff --git a/StoneIsland/www/js/lib/products/GalleryView.js b/StoneIsland/www/js/lib/products/GalleryView.js index bc8ddbac..0c928739 100755 --- a/StoneIsland/www/js/lib/products/GalleryView.js +++ b/StoneIsland/www/js/lib/products/GalleryView.js @@ -58,7 +58,7 @@ var GalleryView = View.extend({ }) }, click: function(e){ - var currentImage = this.gallery.selectedElement.style.backgroundImage.replace("url(","").replace(")","") + var currentImage = this.gallery.selectedElement.style.backgroundImage.replace(/url\(\"?/,"").replace(/\"?\)/,"") var partz = currentImage.split("_") var head = partz[0] var size = partz[1] @@ -67,10 +67,7 @@ var GalleryView = View.extend({ var style = end_partz[0] var largest_size = this.large_styles[style] var hiresImage = [head, largest_size, tail].join("_") - console.log(currentImage, hiresImage) - var viewer = ImageViewer({ - }) - viewer.show(currentImage, hiresImage) + app.fullscreenViewer.show(currentImage, hiresImage) }, touchstart: function(e){ }, diff --git a/StoneIsland/www/js/vendor/imageviewer.js b/StoneIsland/www/js/vendor/imageviewer.js index 3917e34e..9f7087da 100644 --- a/StoneIsland/www/js/vendor/imageviewer.js +++ b/StoneIsland/www/js/vendor/imageviewer.js @@ -689,21 +689,27 @@ $window.off(eventSuffix); return null; }, - load: function (image, hiResImg) { + load: function (image, hiResImgSrc) { var self = this, container = this.container; container.find('.iv-snap-image,.iv-large-image').remove(); var snapImageWrap = this.container.find('.iv-snap-image-wrap'); - snapImageWrap.prepend('<img class="iv-snap-image" src="' + image + '" />'); - this.imageWrap.prepend('<img class="iv-large-image" src="' + image + '" />'); - if (hiResImg) { - this.imageWrap.append('<img class="iv-large-image" src="' + hiResImg + '" />') - } + var snapImage = new Image + snapImage.className = 'iv-snap-image' + snapImage.src = image + + var largeImage = new Image + largeImage.className = 'iv-large-image' + + var hiResImg; + + snapImageWrap.prepend(snapImage); + this.imageWrap.prepend(largeImage); - var currentImg = this.currentImg = this.container.find('.iv-large-image'); - this.snapImg = this.container.find('.iv-snap-image'); + var currentImg = this.currentImg = $(largeImage); + this.snapImg = $(snapImage); self.loaded = false; //show loader @@ -725,13 +731,19 @@ //hide loader container.find('.iv-loader').hide(); } - console.log(currentImg[0]) - if (imageLoaded(currentImg[0])) { - refreshView(); + + var loaded = false + largeImage.onload = function(){ + if (loaded) return + loaded = true + refreshView() + } + if (hiResImgSrc) { + largeImage.src = hiResImgSrc } else { - $(currentImg[0]).on('load', refreshView); + largeImage.src = image } - + if (largeImage.complete) largeImage.onload() } } diff --git a/proxy/index.js b/proxy/index.js index 425f97f6..18d61f13 100755 --- a/proxy/index.js +++ b/proxy/index.js @@ -8,7 +8,7 @@ var PORT = 9090 var cache = {} var DEBUG = false -var USE_CACHE = false +var USE_CACHE = true var server = http.createServer().listen(PORT, function(){ console.log('Proxy listening on: http://lvh.me:%s', PORT) |