diff options
Diffstat (limited to 'StoneIsland/platforms/ios/www/js/lib')
39 files changed, 1698 insertions, 233 deletions
diff --git a/StoneIsland/platforms/ios/www/js/lib/_router.js b/StoneIsland/platforms/ios/www/js/lib/_router.js index 08b8b819..b70d9be8 100644 --- a/StoneIsland/platforms/ios/www/js/lib/_router.js +++ b/StoneIsland/platforms/ios/www/js/lib/_router.js @@ -4,20 +4,48 @@ var SiteRouter = Router.extend({ routeByHash: true, routes: { - '/': 'intro', - '/intro': 'intro', - '/store': 'store', - '/hub': 'hub', - '/story': 'story', - '/archive': 'archive', + '/': 'intro', + '/intro': 'intro', + '/hub': 'hub', + '/story': 'story', + '/archive': 'archive', - '/faq': 'faq', - '/search': 'search', + '/store': 'collection', + '/store/closed': 'closed', + '/store/:code': 'product', - '/cart': 'cart', + '/account/login': 'login', + '/account/logout': 'logout', + '/account/signup': 'signup', + '/account/profile': 'profile', + '/account/payment': 'payment', + '/account/shipping': 'shipping', + '/account/orders': 'orders', + '/account/settings': 'settings', + + '/page/terms': 'terms', + '/page/privacy': 'privacy', + '/page/returns': 'returns', + '/page/care': 'care', + + '/search': 'search', + + '/cart': 'cart.summary', + '/cart/summary': 'cart.summary', + '/cart/payment': 'cart.payment', + '/cart/shipping': 'cart.shipping', + '/cart/confirm': 'cart.confirm', + '/cart/thanks': 'cart.thanks', }, initialize: function(){ + var fn + for (var route in this.routes) { + fn = this.routes[route] + if (! this[fn]) { + this[fn] = this.default_view(fn) + } + } }, go: function(url){ @@ -27,35 +55,39 @@ var SiteRouter = Router.extend({ window.location.href = "#/" + url this.parseRoute(url) }, + + default_view: function(name){ + var fn = function(){ + console.log(name) + if (app.view != app.login && app.view != app.signin) { + app.last_view = app.view + } + if (app.view && app.view.hide) { + app.view.hide() + } + if (name.match(/\./)) { + var n = name.split(".") + console.log(name, n) + app.view = app[n[0]][n[1]] + } + else { + app.view = app[name] + } + app.header.set_back( !! app.view.back ) + app.view.show() + }.bind(this) + return fn + }, - intro: function(){ - app.view = app.intro - app.intro.show() - }, - - store: function(){ - app.view = app.store - app.collection.show() - }, - - hub: function(){ - app.view = app.hub - app.hub.show() - }, - - story: function(){ - app.view = app.story - app.story.show() - }, - - archive: function(){ - app.view = app.archive - app.archive.show() - }, - - cart: function(){ - app.view = app.cart - app.cart.show() + product: function(code){ + if (app.view && app.view.hide) { + app.view.hide() + } + app.view = app.product + app.header.set_back( true ) + app.product.load(code) + app.product.show() }, }) + diff --git a/StoneIsland/platforms/ios/www/js/lib/account/AccountView.js b/StoneIsland/platforms/ios/www/js/lib/account/AccountView.js new file mode 100644 index 00000000..cbd9a9c6 --- /dev/null +++ b/StoneIsland/platforms/ios/www/js/lib/account/AccountView.js @@ -0,0 +1,70 @@ +var AccountView = View.extend({ + + initialize: function(){ + }, + + connect: function(cb){ + auth.init(this.ready.bind(this, cb)) + }, + + ready: function(cb){ + if (auth.logged_in()) { + this.logged_in(cb) + } + else { + this.logged_out(cb) + } + }, + + populateAddresses: function(data){ + console.log("populate addresses:", data) + if (! data.AddressBook) { + console.log("no addresses") + return + } + // console.log(data.AddressBook) + data.AddressBook.addressBookItem.forEach(function(item){ + if (item.isDefault) { + // populate app.shipping.address + } + else if (item.isBillingDefault) { + // populate app.billing.address + } + }) + }, + + logged_in: function(cb){ + sdk.address.list({ + success: this.populateAddresses.bind(this) + }) + $("#nav .login").hide() + $("#nav .account, #nav .logout").show() + if (app.last_view && app.last_view != app.login && app.last_view != app.signin && app.last_view != app.logout) { + app.view && app.view.hide && app.view.hide() + app.view = app.last_view + app.view.show() + } + else { + cb && cb() + } + if ( ! auth.has_cart() ) { + auth.create_cart(auth.add_deferred_product_to_cart) + } + else { + if (auth.deferred_product) { + auth.add_deferred_product_to_cart() + } + else { + app.cart.load() + } + } + }, + + logged_out: function(cb){ + $("#nav .login").show() + $("#nav .account, #nav .logout").hide() + $("#nav").removeClass("account") + cb && cb() + }, + +}) diff --git a/StoneIsland/platforms/ios/www/js/lib/account/OrdersView.js b/StoneIsland/platforms/ios/www/js/lib/account/OrdersView.js new file mode 100644 index 00000000..7283b65c --- /dev/null +++ b/StoneIsland/platforms/ios/www/js/lib/account/OrdersView.js @@ -0,0 +1,29 @@ +var OrdersView = View.extend({ + + el: "#orders", + + events: { + "click .back": "back", + "click .details": "load_single", + }, + + initialize: function(){ + this.single = new SingleOrder ({ parent: this }) + this.list = new OrderList ({ parent: this }) + }, + + show: function(){ + if (! auth.logged_in()) { return app.router.go("intro") } + app.footer.hide() + document.body.className = "orders" + this.el.className = "list" + }, + + load_single: function(){ + }, + + back: function(){ + this.list.show() + }, + +}) diff --git a/StoneIsland/platforms/ios/www/js/lib/account/PaymentView.js b/StoneIsland/platforms/ios/www/js/lib/account/PaymentView.js new file mode 100644 index 00000000..d61ab5ab --- /dev/null +++ b/StoneIsland/platforms/ios/www/js/lib/account/PaymentView.js @@ -0,0 +1,25 @@ +var PaymentView = FormView.extend({ + + el: "#payment", + + events: { + }, + + initialize: function(){ + this.$form = this.$("form") + this.$msg = this.$(".msg") + this.address = new AddressView ({ parent: this }) + this.cc = new CreditCardView ({ parent: this }) + this.scroller = new IScroll('#payment', app.iscroll_options) + }, + + show: function(){ + if (! auth.logged_in()) { return app.router.go("intro") } + app.footer.show("SAVE", "CANCEL") + document.body.className = "payment" + }, + + save: function(){ + }, + +}) diff --git a/StoneIsland/platforms/ios/www/js/lib/account/ProfileView.js b/StoneIsland/platforms/ios/www/js/lib/account/ProfileView.js new file mode 100644 index 00000000..9150f874 --- /dev/null +++ b/StoneIsland/platforms/ios/www/js/lib/account/ProfileView.js @@ -0,0 +1,100 @@ +var ProfileView = FormView.extend({ + + el: "#profile", + + events: { + }, + + initialize: function(){ + this.$form = this.$("form") + this.$msg = this.$(".msg") + this.scroller = new IScroll('#profile', app.iscroll_options) + }, + + show: function(){ + if (! auth.logged_in()) { return app.router.go("intro") } + app.footer.show("SAVE", "CANCEL") + document.body.className = "profile" + + this.preload(auth.user) + }, + + validate_presence: { + "Name": "Please enter your first name.", + "Surname": "Please enter your last name.", + "Email": "Please enter a valid email address.", + }, + + validate_fields: function(data, errors){ + if (! data.Email.match("@")) { errors.push([ "Email", "Email address is not valid." ]) } + if (! data.CurrentPassword && (data.NewPassword || data.Email !== auth.user.Email)) { errors.push([ "CurrentPassword", "Please enter your current password." ]) } + if (data.CurrentPassword && ! data.NewPassword) { errors.push([ "NewPassword", "Please enter your new password." ]) } + if (data.NewPassword && data.NewPassword.length < 7) { errors.push([ "CurrentPassword", "New password must be 7 characters or more." ]) } + if (data.Gender === "NONE") { errors.push([ "Gender", "Please supply your gender." ]) } + + data.BirthDay += "T00:00:00Z" + data.YooxLetter = data.YooxLetter || "false" + }, + + save: function(e){ + e && e.preventDefault() + + var valid = this.validate() + if (valid.errors.length) { + this.show_errors(valid.errors) + return + } + else { + this.hide_errors() + } + + var data = valid.data + if (data.CurrentPassword && (data.NewPassword || data.Email !== auth.user.Email)) { + data.NewPassword = data.NewPassword || data.CurrentPassword + data.NewEmail = data.NewEmail || auth.user.Email + + sdk.account.update_mail_and_password({ + data: { + Password: data.CurrentPassword, + NewPassword: data.NewPassword || data.CurrentPassword, + Email: auth.user, + NewEmail: data.NewEmail || auth.user.Email, + }, + success: function(){ console.log("updated password") }, + error: function(){ console.log("error updating password") }, + }) + } + + var submissible_data = _.pick(valid.data, "Name Surname BirthDay Gender YooxLetter".split(" ")) + + submissible_data.idUser = auth.user_id + submissible_data.AccessToken = auth.access_token + submissible_data.Premium = "false" + submissible_data.LanguageId = "" + submissible_data.SiteCode = "STONEISLAND_US" + submissible_data.FuriganaName = "" + submissible_data.FuriganaSurname = "" + submissible_data.UserPromocode = "" + submissible_data.DataProfiling = "true" + + app.curtain.show("loading") + sdk.account.update({ + data: submissible_data, + success: function(data){ + app.curtain.hide("loading") + this.success(data) + }.bind(this), + error: function(data){ + app.curtain.hide("loading") + this.error(data) + }.bind(this), + }) + }, + + success: function(data){ + }, + + error: function(data){ + }, + +})
\ No newline at end of file diff --git a/StoneIsland/platforms/ios/www/js/lib/account/SettingsView.js b/StoneIsland/platforms/ios/www/js/lib/account/SettingsView.js new file mode 100644 index 00000000..81b8b5cc --- /dev/null +++ b/StoneIsland/platforms/ios/www/js/lib/account/SettingsView.js @@ -0,0 +1,23 @@ +var SettingsView = FormView.extend({ + + el: "#settings", + + events: { + }, + + initialize: function(){ + this.$form = this.$("form") + this.$msg = this.$(".msg") + this.scroller = new IScroll('#settings', app.iscroll_options) + }, + + show: function(){ + if (! auth.logged_in()) { return app.router.go("intro") } + app.footer.show("SAVE", "CANCEL") + document.body.className = "settings" + }, + + save: function(){ + }, + +})
\ No newline at end of file diff --git a/StoneIsland/platforms/ios/www/js/lib/account/ShippingView.js b/StoneIsland/platforms/ios/www/js/lib/account/ShippingView.js new file mode 100644 index 00000000..f5bf1661 --- /dev/null +++ b/StoneIsland/platforms/ios/www/js/lib/account/ShippingView.js @@ -0,0 +1,24 @@ +var ShippingView = FormView.extend({ + + el: "#shipping", + + events: { + }, + + initialize: function(){ + this.$form = this.$("form") + this.$msg = this.$(".msg") + this.address = new AddressView ({ parent: this }) + this.scroller = new IScroll('#shipping', app.iscroll_options) + }, + + show: function(){ + if (! auth.logged_in()) { return app.router.go("intro") } + app.footer.show("SAVE", "CANCEL") + document.body.className = "shipping" + }, + + save: function(){ + }, + +})
\ No newline at end of file diff --git a/StoneIsland/platforms/ios/www/js/lib/account/orders/OrderList.js b/StoneIsland/platforms/ios/www/js/lib/account/orders/OrderList.js new file mode 100644 index 00000000..876f609e --- /dev/null +++ b/StoneIsland/platforms/ios/www/js/lib/account/orders/OrderList.js @@ -0,0 +1,17 @@ +var OrderList = ScrollableView.extend({ + + el: "#order_list", + + template: $("#order_list .template"), + + initialize: function(opt){ + this.parent = opt.parent + this.scroller = new IScroll('#order_list', app.iscroll_options) + }, + + show: function(){ + document.body.className = "orders" + app.orders.el.className = "list" + }, + +}) diff --git a/StoneIsland/platforms/ios/www/js/lib/account/orders/SingleOrder.js b/StoneIsland/platforms/ios/www/js/lib/account/orders/SingleOrder.js new file mode 100644 index 00000000..21416401 --- /dev/null +++ b/StoneIsland/platforms/ios/www/js/lib/account/orders/SingleOrder.js @@ -0,0 +1,18 @@ +var SingleOrder = ScrollableView.extend({ + + el: "#single_order", + + template: $("#single_order .template"), + + initialize: function(opt){ + this.parent = opt.parent + this.scroller = new IScroll('#single_order', app.iscroll_options) + }, + + show: function(id){ + document.body.className = "orders" + app.orders.el.className = "single" + this.deferScrollToTop() + }, + +}) diff --git a/StoneIsland/platforms/ios/www/js/lib/auth/LoginView.js b/StoneIsland/platforms/ios/www/js/lib/auth/LoginView.js new file mode 100644 index 00000000..1f7438cc --- /dev/null +++ b/StoneIsland/platforms/ios/www/js/lib/auth/LoginView.js @@ -0,0 +1,53 @@ +var LoginView = FormView.extend({ + + el: "#login", + + action: sdk.account.login, + + events: { + "click .newuser": "new_user", + "submit form": "save", + }, + + initialize: function(){ + this.$form = this.$("form") + this.$msg = this.$(".msg") + this.scroller = new IScroll('#login', app.iscroll_options) + }, + + show: function(){ + if (auth.logged_in()) { + app.router.go("intro") + return + } + var msg = "* Your personal and payment<br>information will always remain private" + app.footer.show("SUBMIT", "CANCEL") + this.$form.get(0).reset() + this.$msg.html(msg) + document.body.className = "login" + }, + + new_user: function(){ + app.router.go("account/signup") + }, + + validate_presence: { + "Email": "Please enter a valid email address.", + "Password": "Please enter your password.", + }, + + success: function(data){ + // console.log(data) + app.account.logged_in(function(){ app.router.go("store") }) + }, + + error: function(data){ + this.$msg.html("There was an error logging you in. Bad password?") + this.$msg.addClass('alert-notice') + }, + + cancel: function(){ + auth.deferred_product = null + }, + +}) diff --git a/StoneIsland/platforms/ios/www/js/lib/auth/LogoutView.js b/StoneIsland/platforms/ios/www/js/lib/auth/LogoutView.js new file mode 100644 index 00000000..735c0242 --- /dev/null +++ b/StoneIsland/platforms/ios/www/js/lib/auth/LogoutView.js @@ -0,0 +1,15 @@ +var LogoutView = View.extend({ + + el: "#logout", + + events: { + }, + + show: function(){ + document.body.className = "logout" + app.footer.hide() + app.account.logged_out() + auth.clear_user() + }, + +})
\ No newline at end of file diff --git a/StoneIsland/platforms/ios/www/js/lib/auth/SignupView.js b/StoneIsland/platforms/ios/www/js/lib/auth/SignupView.js new file mode 100644 index 00000000..7f894c3c --- /dev/null +++ b/StoneIsland/platforms/ios/www/js/lib/auth/SignupView.js @@ -0,0 +1,103 @@ +var SignupView = FormView.extend({ + + el: "#signup", + + action: sdk.account.signup, + last_data: null, + + test_data: { + "Email": "testit.account" + Math.floor(Math.random() * 10000000) + "@yoox.com", + "Password": "TestPassword", + "Password2": "TestPassword", + "Gender": "U", + "Name": "TestName", + "Surname": "TestSurname", + "BirthDay": "1978-11-12", + "DataProfiling": true, + "DataProfiling2": true, + }, + + events: { + "click .privacy-msg": "privacy_link", + "submit form": "save", + }, + + initialize: function(){ + this.$form = this.$("form") + this.$msg = this.$(".msg") + this.scroller = new IScroll('#signup', app.iscroll_options) + }, + + show: function(){ + if (auth.logged_in()) { + app.router.go("intro") + return + } + var msg = "* Your personal and payment<br>information will always remain private" + app.footer.show("SUBMIT", "CANCEL") + this.$form.get(0).reset() + this.$msg.html(msg) + document.body.className = "signup" + + this.preload() + }, + + validate_presence: { + "Name": "Please enter your first name.", + "Surname": "Please enter your last name.", + "Email": "Please enter a valid email address.", + "ConfirmEmail": "Please enter a valid email address.", + "Password": "Please enter your password.", + "Password2": "Please enter your password again.", + "DataProfiling": "You must agree to data profiling.", + }, + + validate_fields: function(data, errors){ + if (data.Password.length < 7) { errors.push([ "Password", "Password must be 7 characters or more." ]) } + if (data.Password !== data.Password2) { errors.push([ "Password2", "Passwords don't match." ]) } + if (! data.Email.match("@")) { errors.push([ "Email", "Email address is not valid." ]) } + if (data.Email.toLowerCase() !== data.ConfirmEmail.toLowerCase()) { errors.push([ "ConfirmEmail", "Email addresses don't match." ]) } + if (data.Gender === "NONE") { errors.push([ "Gender", "Please supply your gender." ]) } + if (data.DataProfiling !== "true") { errors.push([ "DataProfiling", "You must consent to use this service." ]) } + if (data.DataProfiling2 !== "true") { errors.push([ "DataProfiling2", "You must consent to use this service." ]) } + if (! data.YooxLetter) { data.YooxLetter = false } + + delete data.DataProfiling2 + delete data.ConfirmEmail + + data.BirthDay += "T00:00:00Z" + + this.last_data = data + console.log(data) + }, + + privacy_link: function(){ + // rewrite app.privacy instance temporarily + app.privacy.back = function(){ + app.router.go("account/signup") + } + app.privacy.hide = function(){ + app.privacy.back = app.privacy.hide = null + } + app.router.go("page/privacy") + }, + + success: function(data){ + console.log('success', data) + auth.user = auth.user || {} + auth.user.Name = this.last_data.Name + auth.user.Surname = this.last_data.Surname + auth.user.Email = this.last_data.Email + auth.user.BirthDay = this.last_data.BirthDay + app.account.logged_in(function(){ app.router.go("store") }) + }, + + error: function(data){ + console.log('error', data) + }, + + cancel: function(){ + auth.deferred_product = null + }, + +})
\ No newline at end of file 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 diff --git a/StoneIsland/platforms/ios/www/js/lib/cart/CartBilling.js b/StoneIsland/platforms/ios/www/js/lib/cart/CartBilling.js deleted file mode 100644 index f3c9cbe2..00000000 --- a/StoneIsland/platforms/ios/www/js/lib/cart/CartBilling.js +++ /dev/null @@ -1,11 +0,0 @@ -var CartBilling = View.extend({ - - el: "#billing", - - events: { - }, - - initialize: function(){ - }, - -})
\ No newline at end of file diff --git a/StoneIsland/platforms/ios/www/js/lib/cart/CartConfirm.js b/StoneIsland/platforms/ios/www/js/lib/cart/CartConfirm.js new file mode 100644 index 00000000..687f3a93 --- /dev/null +++ b/StoneIsland/platforms/ios/www/js/lib/cart/CartConfirm.js @@ -0,0 +1,29 @@ +var CartConfirm = FormView.extend({ + + el: "#cart_confirm", + + events: { + }, + + initialize: function(opt){ + this.parent = opt.parent + this.scroller = new IScroll('#cart_confirm', app.iscroll_options) + }, + + show: function(){ + document.body.className = "cart" + app.cart.el.className = "confirm" + app.footer.show("PLACE ORDER", "CANCEL") + this.deferScrollToTop() + }, + + populate: function(){ + }, + + save: function(){ + }, + + cancel: function(){ + }, + +})
\ No newline at end of file diff --git a/StoneIsland/platforms/ios/www/js/lib/cart/CartPayment.js b/StoneIsland/platforms/ios/www/js/lib/cart/CartPayment.js new file mode 100644 index 00000000..19d21ffd --- /dev/null +++ b/StoneIsland/platforms/ios/www/js/lib/cart/CartPayment.js @@ -0,0 +1,40 @@ +var CartPayment = FormView.extend({ + + el: "#cart_payment", + + events: { + }, + + initialize: function(opt){ + this.parent = opt.parent + this.$form = this.$("form") + this.$msg = this.$(".msg") + this.address = new AddressView ({ parent: this }) + this.cc = new CreditCardView ({ parent: this }) + this.scroller = new IScroll('#cart_payment', app.iscroll_options) + }, + + // sdk.cart.set_credit_card + // sdk.payment.list_credit_cards + // sdk.payment.add_credit_card + // sdk.payment.delete_credit_card + // sdk.payment.get_payment_types + // sdk.cart.use_stored_credit_card + + show: function(){ + document.body.className = "cart" + app.cart.el.className = "payment" + app.footer.show("CONFIRM >", "CANCEL") + + this.deferScrollToTop() + + sdk.cart.set_payment_type({ data: payment_id }) + }, + + save: function(){ + }, + + cancel: function(){ + }, + +})
\ No newline at end of file diff --git a/StoneIsland/platforms/ios/www/js/lib/cart/CartShipping.js b/StoneIsland/platforms/ios/www/js/lib/cart/CartShipping.js index beaf6bd2..7d7c8540 100644 --- a/StoneIsland/platforms/ios/www/js/lib/cart/CartShipping.js +++ b/StoneIsland/platforms/ios/www/js/lib/cart/CartShipping.js @@ -1,11 +1,33 @@ -var CartShipping = View.extend({ +var CartShipping = FormView.extend({ - el: "#shipping", + el: "#cart_shipping", events: { }, + + initialize: function(opt){ + this.parent = opt.parent + this.$form = this.$("form") + this.$msg = this.$(".msg") + this.address = new AddressView ({ parent: this }) + this.scroller = new IScroll('#cart_shipping', app.iscroll_options) + }, + + show: function(){ + document.body.className = "cart" + app.cart.el.className = "shipping" + app.footer.show("PAYMENT >", "CANCEL") + this.deferScrollToTop() + }, + + // sdk.cart.set_shipping_address + // sdk.shipping.get_delivery_types + // sdk.shipping.set_delivery_type + + save: function(){ + }, - initialize: function(){ + cancel: function(){ }, })
\ No newline at end of file diff --git a/StoneIsland/platforms/ios/www/js/lib/cart/CartSummary.js b/StoneIsland/platforms/ios/www/js/lib/cart/CartSummary.js index 37400dd0..209e3102 100644 --- a/StoneIsland/platforms/ios/www/js/lib/cart/CartSummary.js +++ b/StoneIsland/platforms/ios/www/js/lib/cart/CartSummary.js @@ -1,11 +1,184 @@ -var CartSummary = View.extend({ +var CartSummary = ScrollableView.extend({ - el: "#summary", + el: "#cart_summary", + + template: $("#cart_summary .template").html(), events: { + "click .remove": "remove_item", + }, + + data: null, + + initialize: function(opt){ + this.parent = opt.parent + this.$loader = this.$(".loader") + this.$cart_body = this.$(".cart_body") + this.$cart_empty = this.$(".cart_empty") + this.scroller = new IScroll('#cart_summary', app.iscroll_options) + + this.$rows = this.$(".rows") + this.$subtotal = this.$(".subtotal") + this.$shipping = this.$(".shipping") + this.$tax = this.$(".tax") + this.$total = this.$(".total") + }, + + show: function(){ + document.body.className = "cart" + app.cart.el.className = "summary" + if (auth.has_cart()) { + this.load() + } + else { + this.empty() + } + }, + + load: function(){ + this.el.className = "loading" + app.footer.show("SHIPPING >", "CANCEL") + sdk.cart.get_status({ + success: this.populate.bind(this), + error: this.empty.bind(this), + }) + }, + + populate: function(data){ + this.data = data + + console.log("CART", data) + + if (! data.Cart.Items || data.Cart.Items.length == 0) { + return this.empty() + } + + this.updateCounts() + + this.$rows.empty() + + data.Cart.Items.forEach(function(item){ + var code_ten = item['Code10'] + var code = code_ten.substr(0, 8) + var size_id = item['Size'] + + var $el = $("<div>").addClass("cart_item_row") + $el.data({ + code: code_ten, + size: size_id, + }) + this.$rows.append($el) + app.product.find(code, function(data, details){ + // console.log(data, details) + + var descriptions = app.product.get_descriptions( details ) + // console.log(descriptions) + + var name_partz = descriptions['ModelNames'].split(' ') + var num = name_partz.shift() + var title = name_partz.join(' ') + var type = title_case( descriptions['MicroCategory'] ) + + var color_name, size_name + // console.log(code) + details.Item.ModelColors.some(function(color){ + if (color['Code10'] == code_ten) { + color_name = color['ColorDescription'] + // console.log(color) + return true + } + return false + }) + details.Item.ModelSizes.some(function(size){ + if (size['SizeId'] == size_id) { + // console.log(size) + size_name = size['Default']['Text'] + size_name = SIZE_LOOKUP[ size_name ] || size_name + return true + } + return false + }) + + var t = this.template + .replace(/{{image}}/, sdk.image(item['Code10'], '11_f')) + .replace(/{{sku}}/, num) + .replace(/{{title}}/, title) + .replace(/{{type}}/, type) + .replace(/{{size}}/, size_name) + .replace(/{{color}}/, color_name) + .replace(/{{quantity}}/, 1) + .replace(/{{price}}/, as_cash(details.Item.Price.DiscountedPrice)) + $el.data("price", details.Item.Price.DiscountedPrice) + $el.html(t) + this.deferScrollToTop() + }.bind(this)) + }.bind(this)) + + this.updateTotals() + + this.el.className = "full" + this.deferScrollToTop() + }, + + updateCounts: function(){ + app.header.set_cart_count(this.data.Cart.Items.length) + this.parent.$itemcount.html(pluralize(this.data.Cart.Items.length, "ITEM", "S")) + }, + + updateTotals: function(){ + var subtotal = this.data.Cart.Totals.TotalWithoutPromotions + var shipping_cost = this.data.Cart.DeliveryMethod.Selected.Amount.Total + var tax = 0 + var total = this.data.Cart.Totals.TotalToPay + + this.$subtotal.html( as_cash(subtotal) ) + this.$shipping.html( as_cash(shipping_cost) ) + this.$tax.html( as_cash(tax) ) + this.$total.html( as_cash(total) ) + }, + + empty: function(){ + app.footer.hide() + app.header.set_cart_count(0) + this.parent.$itemcount.html("0 ITEMS") + this.el.className = "empty" + }, + + save: function(){ + app.router.go('cart/shipping') + }, + + cancel: function(){ + app.router.go('intro') }, - initialize: function(){ + remove_item: function(e){ + var $el = $( e.currentTarget ).closest(".cart_item_row") + var data = $el.data() + data.Cart.Totals.TotalWithoutPromotions -= data.price + data.Cart.Totals.TotalToPay -= data.price + + this.data.Cart.Items = this.data.Cart.Items.filter(function(item){ + return ( item['Code10'] !== data.code || item['Size'] !== data.size) + }) + + this.updateTotals() + this.updateCounts() + $el.remove() + + if (this.data.Cart.Items.length == 0) { + this.empty() + } + + sdk.cart.delete_item({ + data: { + Code10: data.code, + Size: data.size, + }, + success: function(){ + console.log("damn") + }, + }) }, })
\ No newline at end of file diff --git a/StoneIsland/platforms/ios/www/js/lib/cart/CartThanks.js b/StoneIsland/platforms/ios/www/js/lib/cart/CartThanks.js new file mode 100644 index 00000000..993fd9ac --- /dev/null +++ b/StoneIsland/platforms/ios/www/js/lib/cart/CartThanks.js @@ -0,0 +1,23 @@ +var CartThanks = View.extend({ + + el: "#cart_thanks", + + events: { + }, + + initialize: function(opt){ + this.parent = opt.parent + }, + + show: function(){ + document.body.className = "cart" + app.cart.el.className = "thanks" + app.footer.show("< BACK TO COLLECTION") + app.footer.hide() + }, + + ok: function(){ + app.router.go("store") + }, + +})
\ No newline at end of file diff --git a/StoneIsland/platforms/ios/www/js/lib/cart/CartView.js b/StoneIsland/platforms/ios/www/js/lib/cart/CartView.js index 5d741492..8bea43dc 100644 --- a/StoneIsland/platforms/ios/www/js/lib/cart/CartView.js +++ b/StoneIsland/platforms/ios/www/js/lib/cart/CartView.js @@ -3,16 +3,48 @@ var CartView = View.extend({ el: "#cart", events: { + "click .summary_step": "show_summary", + "click .shipping_step": "show_shipping", + "click .payment_step": "show_payment", }, initialize: function(){ - this.summary = new CartSummary () - this.billing = new CartBilling () - this.shipping = new CartShipping () + this.summary = new CartSummary ({ parent: this }) + this.payment = new CartPayment ({ parent: this }) + this.shipping = new CartShipping ({ parent: this }) + this.confirm = new CartConfirm ({ parent: this }) + this.thanks = new CartThanks ({ parent: this }) + + this.$itemcount = this.$(".itemcount") + }, + + load: function(){ + sdk.cart.get_status({ + success: function(data){ + this.summary.data = data + this.summary.updateCounts() + }.bind(this), + error: function(data){ + console.log(data) + }, + }) }, show: function(){ document.body.className = "cart" + this.show_summary() + }, + + show_summary: function(){ + this.summary.show() + }, + + show_shipping: function(){ + this.shipping.show() + }, + + show_payment: function(){ + this.payment.show() }, })
\ No newline at end of file diff --git a/StoneIsland/platforms/ios/www/js/lib/nav/AddressView.js b/StoneIsland/platforms/ios/www/js/lib/nav/AddressView.js new file mode 100644 index 00000000..15a5784d --- /dev/null +++ b/StoneIsland/platforms/ios/www/js/lib/nav/AddressView.js @@ -0,0 +1,39 @@ + +var AddressView = SerializableView.extend({ + + template: $("#address_template").html(), + + events: { + }, + + initialize: function(opt){ + this.parent = opt.parent + this.$el = this.parent.$(".address") + this.el = this.$el[0] + this.$el.html(this.template) + }, + + populate: function(data){ + this.parent.$(".address input").val("") + Object.keys(data).forEach(function(key){ + this.parent$(".address [name=" + key + "]").val(data[key]) + }.bind(this)) + }, + + deserialize: function(){ + }, + + validate_presence: { + "Name": "Please enter your first name.", + "Surname": "Please enter your last name.", + "Address1": "Please enter your street address.", + "City": "Please enter your city.", + "State": "Please choose your state.", + "Phone": "Please enter your phone number.", + }, + + validate_fields: function(data, errors){ + if (data.Phone.replace(/[^0-9]/g, "").length < 10) { errors.push([ "Phone", "Phone numbers must be at least 10 digits." ]) } + }, + +}) diff --git a/StoneIsland/platforms/ios/www/js/lib/nav/CreditCardView.js b/StoneIsland/platforms/ios/www/js/lib/nav/CreditCardView.js new file mode 100644 index 00000000..33ecab79 --- /dev/null +++ b/StoneIsland/platforms/ios/www/js/lib/nav/CreditCardView.js @@ -0,0 +1,27 @@ + +var CreditCardView = View.extend({ + + template: $("#creditcard_template").html(), + + events: { + }, + + initialize: function(opt){ + this.parent = opt.parent + this.parent.$(".cc").html(this.template) + }, + + populate: function(data){ + this.parent.$(".cc input").val("") + Object.keys(data).forEach(function(key){ + this.parent$(".cc [name=" + key + "]").val(data[key]) + }.bind(this)) + }, + + validate_presence: { + }, + + validate_fields: function(data, errors){ + }, + +}) diff --git a/StoneIsland/platforms/ios/www/js/lib/nav/CurtainView.js b/StoneIsland/platforms/ios/www/js/lib/nav/CurtainView.js index ba10e232..d444fd60 100644 --- a/StoneIsland/platforms/ios/www/js/lib/nav/CurtainView.js +++ b/StoneIsland/platforms/ios/www/js/lib/nav/CurtainView.js @@ -9,20 +9,30 @@ var CurtainView = View.extend({ initialize: function(){ }, - show: function(){ + klass: null, + show: function(klass){ this.$el.addClass("visible") + if (klass) { + this.klass = klass + this.$el.addClass(klass) + } }, - hide: function(){ + hide: function(k){ this.$el.removeClass("visible") + if (this.klass) { + setTimeout( function(){ + this.$el.removeClass(this.klass) + }.bind(this), 200 ) + } }, click: function(){ if (document.body.classList.contains("nav")) { app.nav.hide() } - else if (document.body.classList.contains("login")) { - app.login.hide() + if (app.selector.visible) { + app.selector.hide() } }, diff --git a/StoneIsland/platforms/ios/www/js/lib/nav/FooterView.js b/StoneIsland/platforms/ios/www/js/lib/nav/FooterView.js index 76126102..74b249e6 100644 --- a/StoneIsland/platforms/ios/www/js/lib/nav/FooterView.js +++ b/StoneIsland/platforms/ios/www/js/lib/nav/FooterView.js @@ -3,28 +3,38 @@ var FooterView = View.extend({ el: "#footer", events: { - "click .filter": "filter", - "click .buynow": "buynow", - "click .addtocart": "addtocart", + "click .ok": "ok", "click .cancel": "cancel", - "click .checkout": "checkout", - "click .checkout_proceed": "checkout_proceed", }, initialize: function(){ + this.$ok = this.$(".ok") + this.$cancel = this.$(".cancel") }, - filter: function(){ + show: function(ok, cancel){ + if (cancel) { + this.$ok.removeClass("wide") + this.$cancel.show().html(cancel) + } + else { + this.$ok.addClass("wide") + this.$cancel.hide() + } + this.$ok.html(ok) + this.$el.show() }, - buynow: function(){ + + hide: function(){ + this.$el.hide() }, - addtocart: function(){ + + ok: function(){ + (app.view.save || app.view.ok).bind(app.view)() }, + cancel: function(){ + app.view.cancel ? app.view.cancel() : app.intro.show() }, - checkout: function(){ - }, - checkout_proceed: function(){ - }, - + })
\ No newline at end of file diff --git a/StoneIsland/platforms/ios/www/js/lib/nav/HeaderView.js b/StoneIsland/platforms/ios/www/js/lib/nav/HeaderView.js index bbf18274..7563be2d 100644 --- a/StoneIsland/platforms/ios/www/js/lib/nav/HeaderView.js +++ b/StoneIsland/platforms/ios/www/js/lib/nav/HeaderView.js @@ -9,10 +9,27 @@ var HeaderView = View.extend({ }, initialize: function(){ + this.$burger = this.$(".burger") + this.$cart = this.$(".cart") + this.$cart_count = this.$(".cart_count") + }, + + set_back: function(state){ + if (state) { + this.$burger[0].className = "burger ion-ios-arrow-left" + } + else { + this.$burger[0].className = "burger ion-android-menu" + } }, nav: function(){ - app.nav.show() + if (app.view.back) { + app.view.back() + } + else { + app.nav.show() + } }, logo: function(){ @@ -22,5 +39,17 @@ var HeaderView = View.extend({ cart: function(){ app.router.go("cart") }, + + count: 0, + set_cart_count: function(n){ + this.count = n + this.$cart_count.html(n) + }, + increment_cart_count: function(){ + this.$cart_count.html( ++this.count ) + }, + decrement_cart_count: function(){ + this.$cart_count.html( --this.count ) + }, })
\ No newline at end of file diff --git a/StoneIsland/platforms/ios/www/js/lib/nav/IntroView.js b/StoneIsland/platforms/ios/www/js/lib/nav/IntroView.js index 93602eb5..87e68959 100644 --- a/StoneIsland/platforms/ios/www/js/lib/nav/IntroView.js +++ b/StoneIsland/platforms/ios/www/js/lib/nav/IntroView.js @@ -17,6 +17,7 @@ var IntroView = View.extend({ show: function(){ document.body.className = "intro" window.addEventListener("deviceorientation", this.orient) + app.footer.hide() this.orient({ alpha: 0 }) // get location.. }, diff --git a/StoneIsland/platforms/ios/www/js/lib/nav/LoginView.js b/StoneIsland/platforms/ios/www/js/lib/nav/LoginView.js deleted file mode 100644 index 60f6263e..00000000 --- a/StoneIsland/platforms/ios/www/js/lib/nav/LoginView.js +++ /dev/null @@ -1,57 +0,0 @@ -var LoginView = View.extend({ - - el: "#login", - - events: { - "click .close": "hide", - "click .login_ask": "login", - "click .signup_ask": "signup", - "submit form": "submit", - }, - - mode: null, - - initialize: function(){ - this.$form = this.$("form") - this.$email = this.$("[name=email]") - this.$password = this.$("[name=password]") - }, - - show: function(){ - this.$form.hide() - this.$email.val("") - this.$password.val("") - app.curtain.show() - document.body.classList.add("login") - }, - - hide: function(){ - app.curtain.hide() - document.body.classList.remove("login") - }, - - login: function(){ - this.mode = "login" - this.$form.show() - }, - - signup: function(){ - this.mode = "signup" - this.$form.show() - }, - - submit: function(e){ - e.preventDefault() - if (this.mode == "login") { - // login api - } - else { - // signup api - } - }, - - success: function(){ - // change login in ui to logout or whatever - }, - -})
\ No newline at end of file diff --git a/StoneIsland/platforms/ios/www/js/lib/nav/NavView.js b/StoneIsland/platforms/ios/www/js/lib/nav/NavView.js index 3949c3c5..1445a0d5 100644 --- a/StoneIsland/platforms/ios/www/js/lib/nav/NavView.js +++ b/StoneIsland/platforms/ios/www/js/lib/nav/NavView.js @@ -3,33 +3,61 @@ var NavView = View.extend({ el: "#nav", events: { + "click .logo": "intro", + "click .store": "store", "click .hub": "hub", "click .story": "story", "click .archive": "archive", "click .login": "login", + "click .logout": "logout", + "click .account": "account", "click .faq": "faq", "click .search": "search", + "click .main": "back", + "click .account_back": "back", + "click .profile": "profile", + "click .payment": "payment", + "click .shipping": "shipping", + "click .settings": "settings", + "click .orders": "orders", + "click .return_link": "return_link", + + "click .faq_back": "back", + "click .privacy": "privacy", + "click .returns": "returns", + "click .terms": "terms", + "click .care": "care", + "click .fb": "fb", "click .insta": "insta", "click .tw": "tw", }, - initialize: function(){ - }, + initialize: function(){ + }, - show: function(){ + show: function(klass){ $("body").addClass("nav") - app.curtain.show() + app.curtain.show("dark") + if (klass) { + setTimeout(function(){ + this.addClass(klass) + }.bind(this), 500) + } }, hide: function(){ $("body").removeClass("nav") - app.curtain.hide() + app.curtain.hide("dark") }, + intro: function(){ + this.hide() + app.router.go("intro") + }, store: function(){ this.hide() app.router.go("store") @@ -49,18 +77,74 @@ var NavView = View.extend({ login: function(){ this.hide() - app.router.go("login") + auth.last_view = app.view + app.router.go("account/login") + }, + logout: function(){ + this.hide() + auth.last_view = app.view + app.router.go("account/logout") + }, + account: function(){ + this.el.className = "account" }, - search: function(){ + back: function(){ + this.el.className = "" + }, + + profile: function(){ this.hide() - app.router.go("search") + app.router.go("account/profile") + }, + payment: function(){ + this.hide() + app.router.go("account/payment") }, + shipping: function(){ + this.hide() + app.router.go("account/shipping") + }, + orders: function(){ + this.hide() + app.router.go("account/orders") + }, + settings: function(){ + this.hide() + app.router.go("account/settings") + }, + return_link: function(){ + window.open("http://www.stoneisland.com/", '_system') + }, + + faq: function(){ + this.el.className = "faq" + }, + privacy: function(){ this.hide() - app.router.go("faq") + app.router.go("page/privacy") + }, + returns: function(){ + this.hide() + app.router.go("page/returns") + }, + terms: function(){ + this.hide() + app.router.go("page/terms") + }, + care: function(){ + this.hide() + app.router.go("page/care") + }, + + + search: function(){ + this.hide() + app.router.go("search") }, + fb: function(){ window.open("https://www.facebook.com/StoneIsland", '_system') }, @@ -70,6 +154,5 @@ var NavView = View.extend({ tw: function(){ window.open("https://twitter.com/stoneisland", '_system') }, - }) diff --git a/StoneIsland/platforms/ios/www/js/lib/nav/SearchView.js b/StoneIsland/platforms/ios/www/js/lib/nav/SearchView.js new file mode 100644 index 00000000..f21634a5 --- /dev/null +++ b/StoneIsland/platforms/ios/www/js/lib/nav/SearchView.js @@ -0,0 +1,16 @@ +var SearchView = View.extend({ + + el: "#search", + + events: { + }, + + show: function(){ + app.footer.show("SEARCH", "CANCEL") + document.body.className = "search" + }, + + save: function(){ + }, + +})
\ No newline at end of file diff --git a/StoneIsland/platforms/ios/www/js/lib/products/ClosedStoreView.js b/StoneIsland/platforms/ios/www/js/lib/products/ClosedStoreView.js new file mode 100644 index 00000000..77dc15b1 --- /dev/null +++ b/StoneIsland/platforms/ios/www/js/lib/products/ClosedStoreView.js @@ -0,0 +1,47 @@ +var ClosedStoreView = View.extend({ + + el: "#closed", + + storeIsClosed: false, + + events: { + "click .website_link": "website_link", + }, + + delay: 8000, + + timeout: -1, + images: null, + + initialize: function(){ + this.loader = new Loader () + }, + + show: function(){ + document.body.className = "closed" + this.animate() + app.footer.hide() + }, + + hide: function(){ + clearTimeout(this.timeout) + }, + + animate: function(){ + this.timeout = setTimeout(this.animate.bind(this), this.delay) + if (! this.images) return + var url = choice(this.images) + this.loader.preloadImage(url, function(img){ + this.el.style.backgroundImage = 'url(' + img.src + ')' + }.bind(this)) + }, + + populate: function(data){ + this.images = data.map(function(img){ return img.uri }) + }, + + website_link: function(){ + window.open("http://www.stoneisland.com/", '_system') + }, + +})
\ No newline at end of file diff --git a/StoneIsland/platforms/ios/www/js/lib/products/CollectionView.js b/StoneIsland/platforms/ios/www/js/lib/products/CollectionView.js index 987804fc..8ea03bd4 100644 --- a/StoneIsland/platforms/ios/www/js/lib/products/CollectionView.js +++ b/StoneIsland/platforms/ios/www/js/lib/products/CollectionView.js @@ -1,4 +1,5 @@ -var CollectionView = View.extend({ + +var CollectionView = ScrollableView.extend({ el: "#collection", template: $("#collection .template").html(), @@ -7,16 +8,27 @@ var CollectionView = View.extend({ items: {}, events: { - "click .item": "pick", + "touchstart .item": "touchstart", + "touchmove .item": "touchmove", + "touchend .item": "touchend", + "mousedown .item": "touchstart", + "mousemove .item": "touchmove", + "mouseup .item": "touchend", }, initialize: function(){ + this.$title = this.$("h1") this.$content = this.$(".content") this.$loader = this.$(".loader") - this.scroller = new IScroll('#collection .scroll') + this.scroller = new IScroll('#collection', app.iscroll_options) + this.filterView = new CategoryFilter ({ parent: this }) }, - + show: function(){ + if (app.closed.storeIsClosed) { + return app.closed.show() + } + app.footer.show("FILTER") document.body.className = "collection" if (this.loaded) { return this.populate(this.data) @@ -24,32 +36,77 @@ var CollectionView = View.extend({ this.fetch() }, + ok: function(){ + this.filterView.filter() + }, + fetch: function(){ + if (this.loaded) return this.$loader.show() sdk.product.collection({ - gallery_id: 31617, + gallery_id: 32780, success: this.populate.bind(this) }) }, populate: function(data){ - this.$loader.hide() - this.$content.empty() - // DefaultCode10 - console.log(data) - data.SearchResponseFull.Results.Items.forEach(function(item){ - this.items[ item['Code8'] ] = item - var t = this.template.replace(/{{image}}/, sdk.image(item['DefaultCode10'])) - .replace(/{{code8}}/, item['Code8']) - this.$content.append(t) - - }.bind(this)) + if (this.loaded && ! data) { + data = this.data + } + else { + this.data = data + } + if (! this.loaded) { + this.loaded = true + this.$loader.hide() + this.$content.empty() + // DefaultCode10 + data.SearchResponseFull.Results.Items.forEach(this.append.bind(this)) + this.deferScrollToTop() + } + this.afterFetchCallback && this.afterFetchCallback() + }, + + append: function(item){ + this.items[ item['Code8'] ] = item + var t = this.template.replace(/{{image}}/, sdk.image(item['DefaultCode10'], '11_f')) + .replace(/{{code8}}/, item['Code8']) + this.$content.append(t) }, pick: function(e){ var code = $(e.currentTarget).data("code") var data = this.items[code] - app.product.load(data) + app.product.load(code, data) + }, + + collectionName: "STONE ISLAND", + setCollectionName: function(name){ + this.collectionName = name + this.$title.html(this.collectionName) + }, + + firstTouch: { x: 0, y: 0, id: "" }, + lastTouch: { x: 0, y: 0, id: "" }, + touchstart: function(e){ + var p = e.originalEvent.touches ? e.originalEvent.touches[0] : e.originalEvent + this.firstTouch.x = this.lastTouch.x = p.pageX + this.firstTouch.y = this.lastTouch.y = p.pageY + this.firstTouch.id = e.currentTarget.dataset.id + }, + touchmove: function(e){ + var p = e.originalEvent.touches ? e.originalEvent.touches[0] : e.originalEvent + this.lastTouch.x = p.pageX + this.lastTouch.y = p.pageY + this.lastTouch.id = e.currentTarget.dataset.id + }, + touchend: function(e){ + var first = app.collection.firstTouch + var last = app.collection.lastTouch + var distance = Math.sqrt( Math.pow(first.x - last.x, 2) + Math.pow(first.y - last.y, 2) ) + if (distance < 20) { + this.pick(e) + } }, }) diff --git a/StoneIsland/platforms/ios/www/js/lib/products/GalleryView.js b/StoneIsland/platforms/ios/www/js/lib/products/GalleryView.js index 2eabe2a6..ea4637eb 100644 --- a/StoneIsland/platforms/ios/www/js/lib/products/GalleryView.js +++ b/StoneIsland/platforms/ios/www/js/lib/products/GalleryView.js @@ -1,22 +1,54 @@ var GalleryView = View.extend({ el: "#gallery", + template: $("#gallery .template").html(), events: { "click .left": "prev", "click .right": "next", - "touchstart .gallery": "touchstart", - "touchmove .gallery": "touchmove", - "touchend .gallery": "touchend", +// "touchstart .gallery": "touchstart", +// "touchmove .gallery": "touchmove", +// "touchend .gallery": "touchend", }, initialize: function(){ - this.$prev = this.$(".prev") - this.$next = this.$(".next") - this.$slider = this.$(".slider") + this.$(".template").remove() }, - populate: function(){ + reset: function(){ + this.gallery && this.gallery.destroy() + this.$el.empty() + }, + + populate: function(code, image_ids){ + var valid_styles = {} + image_ids.forEach(function(id){ + if (id.indexOf("_") == -1) return + var partz = id.split("_") + var size = parseInt(partz[0]), style = partz[1] + if (size > 13) return; + if (! valid_styles[style] || valid_styles[style] < size) { + valid_styles[style] = size + } + }) + Object.keys(valid_styles).forEach(function(style){ + var id = valid_styles[style] + "_" + style + var t = this.template.replace(/{{image}}/, sdk.image(code, id)) + this.$el.append(t) + }.bind(this)) + + this.gallery = new Flickity( "#gallery", { + selector: '.item', + cellAlign: 'center', + autoPlay: false, + freeScroll: false, + wrapAround: true, + imagesLoaded: true, + prevNextButtons: false, + pageDots: false, + contain: true, + draggable: true, + }) }, prev: function(){ diff --git a/StoneIsland/platforms/ios/www/js/lib/products/ProductView.js b/StoneIsland/platforms/ios/www/js/lib/products/ProductView.js index 76527c8b..c99ff0ab 100644 --- a/StoneIsland/platforms/ios/www/js/lib/products/ProductView.js +++ b/StoneIsland/platforms/ios/www/js/lib/products/ProductView.js @@ -1,14 +1,5 @@ -var SIZE_LOOKUP = { - "XS": "X-SMALL", - "S": "SMALL", - "M": "MEDIUM", - "L": "LARGE", - "XL": "X-LARGE", - "XXL": "XX-LARGE", - "XXXL": "XXX-LARGE", -}; -var ProductView = View.extend({ +var ProductView = ScrollableView.extend({ el: "#product", @@ -20,6 +11,7 @@ var ProductView = View.extend({ initialize: function(){ this.gallery = new GalleryView () + this.scroller = new IScroll('#product', app.iscroll_options) this.$num = this.$(".num") this.$title = this.$(".title") @@ -31,54 +23,170 @@ var ProductView = View.extend({ }, show: function(){ + app.footer.show("ADD TO CART", "BUY NOW") document.body.className = "product" }, hide: function(){ }, item: null, + details: null, size: null, color: null, code: null, + + sizes: null, + colors: null, + + cache: {}, - load: function(data){ + find: function(code, cb){ + data = app.collection.items[code] + if (code in this.cache) { + return cb(data, this.cache[code]) + } + sdk.product.item({ + code: code + }).done(function(details){ + this.cache[code] = details + cb(data, details) + }.bind(this)) + }, + + load: function(code, data){ + this.gallery.reset() + this.show() + if (app.view && app.view.hide) { + app.view.hide() + } + app.view = this + app.header.set_back(true) + + if (! app.collection.loaded) { + this.el.className = "loading" + app.collection.afterFetchCallback = this.load.bind(this, code, data) + app.collection.fetch() + return + } + else { + app.collection.afterFetchCallback = null + } + window.location.href = "#/store/" + code + + console.log(data) + if (data) { + app.collection.items[code] = data + } + + this.el.className = "loading" + this.find(code, this.populate.bind(this)) + }, + + populate: function(data, details){ + this.el.className = "" + + console.log(data, details) + + var descriptions = this.get_descriptions(details) + + this.gallery.populate( data['Code8'], details['Item']['ImageTypes'] ) + var name_partz = data['ModelNames'].split(' ') var num = name_partz.shift() var title = name_partz.join(' ') - var type = data['MicroCategory'].toUpperCase() + var type = title_case( data['MicroCategory'] ) var price = "$" + data['DiscountedPrice'] + ".00" - var size = data['Sizes'][0] - var size_label = SIZE_LOOKUP[size] - var color = data['Colors'][0] - var color_label = color['Text'] - var body = "" - + var body = descriptions['EditorialDescription'].replace(/<br>/g, "<br><br>") + + var default_color_id = this.populate_selectors(data, details) + + var color = this.colors[default_color_id] + var color_label = color.label + var sizes = this.find_sizes_for_color(default_color_id) + var size = sizes[0] + var size_label = this.sizes[size].label + + // console.log(color, color_label, size, size_label) + this.item = data + this.details = details['Item'] + this.code = data['DefaultCode10'] + this.color = color this.size = size - this.code = data['DefaultCode10'] this.$num.html(num) this.$title.html(title) this.$type.html(type) this.$price.html(price) - this.$size.html(size_label) - this.$color.html(color) this.$body.html(body) - // TODO: fetch product from item API, get other Code10s so you can populate the gallery + this.$size.html(size_label) + if (color_label) { + this.$color.show().html(color_label) + } + else { + this.$color.hide() + } + + this.deferScrollToTop() }, - select_size: function(){ - if (this.item['Sizes'].length == 0) { return } - var mapped_sizes = this.item['Sizes'].map(function(size){ - return { - id: size['Id'], - label: SIZE_LOOKUP[ size['Text'] ], - value: size, + get_descriptions: function (details){ + var descriptions = {} + details['Item']['Descriptions'].forEach(function(pair){ + descriptions[pair.Key] = pair.Value + }) + return descriptions + }, + find_sizes_for_color: function(color_id){ + return Object.keys( this.colors[color_id].sizes ).sort(function(a,b){ + var ao = SIZE_ORDER[ a.label ], bo = SIZE_ORDER[ b.label ] + return ao<bo?-1:ao==bo?0:1 + }) + }, + find_colors_for_size: function(size_id){ + return Object.keys( this.sizes[size_id].colors ) + }, + + populate_selectors: function(data, details){ + var sizes = {}, colors = {}, size_lookup = {}, default_color + details['Item']['ModelColors'].forEach(function(color, index){ + if (! default_color || color['Code10'] == data['DefaultCode10']) { + default_color = color['ColorId'] + } + colors[ color['ColorId'] ] = { + id: color['Code10'], + code: color['Code10'], + label: color['ColorDescription'], + sizes: {}, } }) - app.selector.select(mapped_sizes, function(size){ + details['Item']['ModelSizes'].forEach(function(size){ + var label = SIZE_LOOKUP[ size['Default']['Text'] ] + size_lookup[ label ] = size['SizeId'] + sizes[ size['SizeId'] ] = { + id: label, + label: label, + colors: {}, + } + }) + details['Item']['ModelColorSize'].forEach(function(cs){ + colors[ cs['IdColor'] ].sizes[ cs['IdSize'] ] = true + sizes[ cs['IdSize'] ].colors[ cs['IdColor'] ] = true + }) + + this.sizes = sizes + this.colors = colors + return default_color + }, + + select_size: function(){ + if (this.item['Sizes'].length == 0) { return } + var sizes = Object.keys(this.sizes).map(function(key){ + return this.sizes[key] + }.bind(this)) + app.selector.select(sizes, function(size){ this.size = size.value this.$size.html(size.label) }.bind(this)) @@ -86,27 +194,79 @@ var ProductView = View.extend({ select_color: function(){ if (this.item['Colors'].length == 0) { return } - var mapped_colors = this.item['Colors'].map(function(color){ - return { - id: color['Id'], - label: color['Text'], - value: color, - } - }) - app.selector.select(mapped_colors, function(color){ - this.color = color.value + var colors = Object.keys(this.colors).map(function(key){ + return this.colors[key] + }.bind(this)) + app.selector.select(colors, function(color){ + this.code = color.code this.$color.html(color.label) }.bind(this)) }, + + // ADD TO CART + save: function(){ + auth.deferred_product = { Size: this.size, Code10: this.code } + if ( ! auth.logged_in() ) { + app.router.go("account/login") + app.last_view = app.cart + } + else if ( ! auth.has_cart() ) { + auth.create_cart(function(){ + auth.add_deferred_product_to_cart(function(){ + app.router.go("cart") + }) + }) + } + else { + auth.add_deferred_product_to_cart(function(){ + app.router.go("cart") + }) + } + }, + + // BUY NOW + cancel: function(){ + auth.deferred_product = { Size: this.size, Code10: this.code } + if ( ! auth.logged_in() ) { + app.router.go("account/login") + app.last_view = app.cart + } + else if ( ! auth.has_cart() ) { + auth.create_cart(function(){ + auth.add_deferred_product_to_cart(function(){ + app.router.go("cart") + }) + }) + } + else { + auth.add_deferred_product_to_cart(function(){ + app.router.go("cart") + }) + } + }, + + back: function(){ + app.router.go('store') + }, share: function(){ }, }) +var SIZE_LOOKUP = { + "XS": "X-SMALL", + "S": "SMALL", + "M": "MEDIUM", + "L": "LARGE", + "XL": "X-LARGE", + "XXL": "XX-LARGE", + "3XL": "3X-LARGE", +} + +var SIZE_ORDER = "XS S M L XL XXL 3XL".split(" ") /* - { "Code8": "41504876", "BrandName": "STONE ISLAND", @@ -191,4 +351,28 @@ var ProductView = View.extend({ "MicroCategoryId": 1319 }, +DESCRIPTIONS: + +Age: "Adult" +Appliqué: "Logo detail" +ColoreFoto_ID: "3140" +Composition: "100% Cotton" +CustomsInvoiceDescr: "Woven" +Design: "Solid color" +EditorialDescription: "20081 DATA DRIP PIN<br>Short sleeve T-Shirt in cotton jersey. Garment dyed.<br>Stone Island Compass logo print on the front, made up of a series of numbers." +ItemDescription: "Logo detail<br>Jersey<br>Round collar<br>Solid color<br>" +KeywordDescription: "Logo detail Jersey Round collar Solid color Jersey Woven not made of fur " +Kind of fabric: "Woven" +MFC: "631520081CC-6315-81V0060" +MacroCategory: "POLO SHIRTS & T-SHIRTS" +MadeIn: "Made In Turkmenistan" +MadeInIsoCode: "TN" +MainMaterial: "Cotton" +Material Description: "Jersey" +MicroCategory: "Short sleeve t-shirt" +MicroCategoryPlural: "Short sleeve t-shirts" +ModelFabric: "631520081CC-6315-81" +ModelNames: "20081 DATA DRIP PIN" +Neckline: "Claudine or round collar" + */
\ No newline at end of file diff --git a/StoneIsland/platforms/ios/www/js/lib/products/Selector.js b/StoneIsland/platforms/ios/www/js/lib/products/Selector.js index 1580624b..76c498ec 100644 --- a/StoneIsland/platforms/ios/www/js/lib/products/Selector.js +++ b/StoneIsland/platforms/ios/www/js/lib/products/Selector.js @@ -5,7 +5,7 @@ var Selector = View.extend({ events: { "click .close": "hide", - "click span": "pick", + "click .options div": "pick", }, initialize: function(){ @@ -15,26 +15,32 @@ var Selector = View.extend({ lookup: null, callback: null, select: function(options, callback){ - var lookup = this.lookup = {} + this.lookup = {} + this.callback = callback || function(item){ console.log(item) } this.$options.empty() options.forEach(function(opt){ - lookup[opt.id] = opt + this.lookup[String(opt.id)] = opt var t = this.template.replace(/{{id}}/, opt.id) .replace(/{{label}}/, opt.label) this.$options.append(t) - }) + }.bind(this)) this.$el.show() + app.curtain.show("white") + this.visible = true }, hide: function(){ this.lookup = this.callback = null this.$el.hide() + app.curtain.hide() + this.visible = false }, pick: function(e){ var $option = $(e.currentTarget) - var id = $option.data("id") + var id = String($option.data("id")) var selection = this.lookup[id] + this.callback( selection ) this.hide() }, diff --git a/StoneIsland/platforms/ios/www/js/lib/products/filters/CategoryFilter.js b/StoneIsland/platforms/ios/www/js/lib/products/filters/CategoryFilter.js new file mode 100644 index 00000000..4e6baf62 --- /dev/null +++ b/StoneIsland/platforms/ios/www/js/lib/products/filters/CategoryFilter.js @@ -0,0 +1,40 @@ +var CategoryFilter = View.extend({ + + initialize: function(opt){ + this.parent = opt.parent + }, + + filter: function(){ + var cats = this.parent.data.SearchResponseFull.Refinements.Filters.Categories.map(function(cat){ + return { + id: cat.Id, + label: cat.Value + } + }) + if (this.last_choice) { + cats.push({ + id: "__remove_filter", + label: "REMOVE FILTER", + }) + } + app.selector.select(cats, this.pick.bind(this)) + }, + + last_choice: null, + + pick: function(choice){ + this.parent.$content.empty() + if (choice.id == "__remove_filter") { + this.last_choice = null + this.parent.data.SearchResponseFull.Results.Items.forEach(this.parent.append.bind(this.parent)) + } + else { + this.last_choice = choice + this.parent.data.SearchResponseFull.Results.Items.filter(function(item){ + return item.MacroCategory == choice.label + }).forEach(this.parent.append.bind(this.parent)) + } + this.parent.deferScrollToTop() + }, + +}) |