diff options
Diffstat (limited to 'StoneIsland/platforms/ios/www/js/lib/blogs')
5 files changed, 146 insertions, 22 deletions
diff --git a/StoneIsland/platforms/ios/www/js/lib/blogs/ArchiveView.js b/StoneIsland/platforms/ios/www/js/lib/blogs/ArchiveView.js index 34e8b109..051ef0c9 100644 --- a/StoneIsland/platforms/ios/www/js/lib/blogs/ArchiveView.js +++ b/StoneIsland/platforms/ios/www/js/lib/blogs/ArchiveView.js @@ -1,4 +1,4 @@ -var ArchiveView = View.extend({ +var ArchiveView = ScrollableView.extend({ el: "#archive", template: $("#archive .template").html(), @@ -9,10 +9,12 @@ var ArchiveView = View.extend({ initialize: function(){ this.$content = this.$(".content") this.$loader = this.$(".loader") - this.scroller = new IScroll('#archive .scroll') + this.scroller = new IScroll('#archive', app.iscroll_options) }, show: function(){ + this.deferScrollToTop() + app.footer.hide() document.body.className = "archive" }, @@ -20,14 +22,14 @@ var ArchiveView = View.extend({ this.data = data this.$loader.hide() this.$content.empty() + + // id title images[ uri label code caption ] this.data.forEach(function(row){ - var t = this.template.replace(/{{image}}/, row.image.url) + var t = this.template.replace(/{{image}}/, row.images[0].uri) .replace(/{{code}}/, row.code) .replace(/{{title}}/, row.title) - .replace(/{{body}}/, row.body) this.$content.append(t) }.bind(this)) }, - })
\ No newline at end of file diff --git a/StoneIsland/platforms/ios/www/js/lib/blogs/BlogView.js b/StoneIsland/platforms/ios/www/js/lib/blogs/BlogView.js index 70fc910a..19666f8b 100644 --- a/StoneIsland/platforms/ios/www/js/lib/blogs/BlogView.js +++ b/StoneIsland/platforms/ios/www/js/lib/blogs/BlogView.js @@ -17,17 +17,31 @@ var BlogView = View.extend({ }, success: function(data){ + + if (this.loaded) return + this.loaded = true this.data = data - this.loader.preloadImage(data.archive[0].image.url, function(img){ + + this.loader.preloadImage(data.archive[0].images[0].uri, function(img){ app.archive.populate(data.archive) }) - this.loader.preloadImage(data.hub[0].image.url, function(img){ + this.loader.preloadImage(data.hub[0].image[0].uri, function(img){ app.hub.populate(data.hub) }) - this.loader.preloadImage(data.story[0].image.url, function(img){ + this.loader.preloadImage(data.story[0].image.uri, function(img){ app.story.populate(data.story) }) + data.page.forEach(function(page){ + app[page.tag].populate(page) + + }) + app.collection.setCollectionName( data.store[0].collection ) + + app.closed.populate(data.store[0].ClosedStoreImages) + if (data.store[0].StoreIsOpen !== "true") { + app.closed.storeIsClosed = true + } }, })
\ No newline at end of file diff --git a/StoneIsland/platforms/ios/www/js/lib/blogs/HubView.js b/StoneIsland/platforms/ios/www/js/lib/blogs/HubView.js index ea9b3048..3b2900ad 100644 --- a/StoneIsland/platforms/ios/www/js/lib/blogs/HubView.js +++ b/StoneIsland/platforms/ios/www/js/lib/blogs/HubView.js @@ -1,18 +1,21 @@ -var HubView = View.extend({ +var HubView = ScrollableView.extend({ el: "#hub", template: $("#hub .template").html(), events: { + "click .store": "store_link", }, initialize: function(){ this.$content = this.$(".content") this.$loader = this.$(".loader") - this.scroller = new IScroll('#hub .scroll') + this.scroller = new IScroll('#hub', app.iscroll_optionsx) }, show: function(){ + this.deferScrollToTop() + app.footer.hide() document.body.className = "hub" }, @@ -20,17 +23,65 @@ var HubView = View.extend({ this.data = data this.$loader.hide() this.$content.empty() + // id date subtitle body link store image[uri caption] this.data.forEach(function(row){ - var t = this.template.replace(/{{image}}/, row.image.url) - .replace(/{{date}}/, row.date) - .replace(/{{code}}/, row.code) + // console.log(row) + var t = this.template.replace(/{{id}}/, row.id) + .replace(/{{date}}/, moment(row.date).format("MM.DD.YYYY")) .replace(/{{title}}/, row.title) .replace(/{{subtitle}}/, row.subtitle) .replace(/{{link}}/, row.link) - .replace(/{{body}}/, row.body) - this.$content.append(t) + .replace(/{{body}}/, row.body.replace(/\n/g, "<br>")) + var $t = $(t) + if (row.store != "true") { + $t.find(".store").remove() + } + this.$content.append($t) + + if (row.image.length > 1) { + // image gallery + var $gallery = $(".gallery-" + row.id) + row.image.forEach(function(img){ + var el = document.createElement("div") + el.style.backgroundImage = "url(" + img.uri + ")" + el.className = "item" + $gallery.append(el) + }) + new Flickity( ".gallery-" + row.id, { + selector: '.item', + cellAlign: 'center', + autoPlay: false, + freeScroll: false, + wrapAround: true, + imagesLoaded: true, + prevNextButtons: false, + pageDots: false, + contain: true, + draggable: true, + }) + } + else { + // single image + var el = document.createElement("div") + el.style.backgroundImage = "url(" + row.image[0].uri + ")" + el.className = "item" + $(".gallery-" + row.id).append(el) + + // video, append play button + if (row.link.match(/youtube|youtu.be|vimeo/)) { + var play = document.createElement("div") + play.className = "play" + $(".gallery-" + row.id).append(play) + } + } + }.bind(this)) + + this.deferScrollToTop() + }, + + store_link: function(){ + app.router.go("store") }, - })
\ No newline at end of file diff --git a/StoneIsland/platforms/ios/www/js/lib/blogs/PageView.js b/StoneIsland/platforms/ios/www/js/lib/blogs/PageView.js new file mode 100644 index 00000000..4bf05430 --- /dev/null +++ b/StoneIsland/platforms/ios/www/js/lib/blogs/PageView.js @@ -0,0 +1,24 @@ +var PageView = ScrollableView.extend({ + + events: { + }, + + initialize: function(opt){ + this.page = opt.page + this.setElement("#" + opt.page) + this.$content = this.$(".content") + this.$loader = this.$(".loader") + this.scroller = new IScroll('#' + this.page, app.iscroll_options) + }, + + show: function(){ + this.deferScrollToTop() + app.footer.hide() + document.body.className = this.page + }, + + populate: function(data){ + this.$content.html(data.body.replace(/\n/g, "<br>")) + }, + +})
\ No newline at end of file diff --git a/StoneIsland/platforms/ios/www/js/lib/blogs/StoryView.js b/StoneIsland/platforms/ios/www/js/lib/blogs/StoryView.js index 7f9b30a1..84684ff7 100644 --- a/StoneIsland/platforms/ios/www/js/lib/blogs/StoryView.js +++ b/StoneIsland/platforms/ios/www/js/lib/blogs/StoryView.js @@ -1,32 +1,65 @@ -var StoryView = View.extend({ +var StoryView = ScrollableView.extend({ + + loaded: false, el: "#story", template: $("#story .template").html(), events: { + "click .links li": "pick", }, initialize: function(){ + this.sections = {} + this.$img = this.$("img") this.$content = this.$(".content") + this.$links = this.$(".links") this.$loader = this.$(".loader") - this.scroller = new IScroll('#story .scroll') + this.scroller = new IScroll('#story', app.iscroll_options) }, show: function(){ + this.deferScrollToTop() + app.footer.hide() document.body.className = "story" }, populate: function(data){ + if (this.loaded) { console.warn("populate called twice"); return } + this.loaded = true this.data = data this.$loader.hide() this.$content.empty() + // id title image[uri caption] body this.data.forEach(function(row){ - var t = this.template.replace(/{{image}}/, row.image.url) - .replace(/{{date}}/, row.date) - .replace(/{{title}}/, row.title) - .replace(/{{body}}/, row.body) + var t = this.template.replace(/{{id}}/, row.id) + .replace(/{{body}}/, row.body.replace(/\n/g, "<br>")) + var li = document.createElement("li") + li.dataset.id = row.id + li.innerHTML = row.title + this.sections[row.id] = row + this.$links.append(li) this.$content.append(t) }.bind(this)) + + this.set_active( this.data[0].id ) + }, + + pick: function(e){ + var id = e.currentTarget.dataset.id + this.set_active(id) + }, + + set_active: function(id){ + this.$links.find(".active").removeClass("active") + this.$links.find("[data-id=" + id + "]").addClass("active") + + this.$content.find(".active").removeClass("active") + this.$content.find("[data-id=" + id + "]").addClass("active") + + var section = this.sections[id] + this.$img.attr("src", section.image.uri) + this.deferScrollToTop() }, })
\ No newline at end of file |