iscroll workin, api fetching, hud populating

2 files changed, 34 insertions, 9 deletions

diff --git a/StoneIsland/www/js/lib/products/CollectionView.js b/StoneIsland/www/js/lib/products/CollectionView.js
index 987804fc..d638171b 100644
--- a/StoneIsland/www/js/lib/products/CollectionView.js
+++ b/StoneIsland/www/js/lib/products/CollectionView.js
@@ -13,7 +13,7 @@ var CollectionView = View.extend({
   initialize: function(){
     this.$content = this.$(".content")
     this.$loader = this.$(".loader")
-    this.scroller = new IScroll('#collection .scroll')
+    this.scroller = new IScroll('#collection', app.iscroll_options)
   },
 
   show: function(){
@@ -39,17 +39,21 @@ var CollectionView = View.extend({
     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']))
+      var t = this.template.replace(/{{image}}/, sdk.image(item['DefaultCode10'], '11_f'))
                            .replace(/{{code8}}/, item['Code8'])
       this.$content.append(t)
-      
     }.bind(this))
+    
+    setTimeout(function(){
+      this.scroller.refresh()
+      app.collection.scroller.scrollTo(0, 0)
+    }.bind(this), 0)
   },
   
   pick: function(e){
     var code = $(e.currentTarget).data("code")
     var data = this.items[code]
-    app.product.load(data)
+    app.product.load(code, data)
   },
 
 })
diff --git a/StoneIsland/www/js/lib/products/ProductView.js b/StoneIsland/www/js/lib/products/ProductView.js
index 76527c8b..c0a1ee79 100644
--- a/StoneIsland/www/js/lib/products/ProductView.js
+++ b/StoneIsland/www/js/lib/products/ProductView.js
@@ -41,7 +41,24 @@ var ProductView = View.extend({
   color: null,
   code: null,
   
-  load: function(data){
+  cache: {},
+  
+  load: function(code, data){
+    window.location.href = "#/product/" + code
+    data = data || app.collection.items[code]
+    if (code in this.cache) {
+      return this.populate(data, this.cache[code])
+    }
+    sdk.product.item({
+      code: code,
+      success: function(details){
+        this.cache[code] = details
+        this.populate(data, details)
+      }.bind(this),
+    })
+  },
+  
+  populate: function(data, details){
     var name_partz = data['ModelNames'].split(' ')
     var num = name_partz.shift()
     var title = name_partz.join(' ')
@@ -50,7 +67,8 @@ var ProductView = View.extend({
     var size = data['Sizes'][0]
     var size_label = SIZE_LOOKUP[size]
     var color = data['Colors'][0]
-    var color_label = color['Text']
+    console.log(color)
+    var color_label = color && color['Text']
     var body = ""
     
     this.item = data
@@ -63,10 +81,13 @@ var ProductView = View.extend({
     this.$type.html(type)
     this.$price.html(price)
     this.$size.html(size_label)
-    this.$color.html(color)
+    if (color_label) {
+      this.$color.show().html(color_label)
+    }
+    else {
+      this.$color.hide()
+    }
     this.$body.html(body)
-    
-    // TODO: fetch product from item API, get other Code10s so you can populate the gallery
   },
 
   select_size: function(){