order info

1 files changed, 163 insertions, 7 deletions

diff --git a/StoneIsland/www/js/lib/account/OrdersView.js b/StoneIsland/www/js/lib/account/OrdersView.js
index 7283b65c..6465792f 100644
--- a/StoneIsland/www/js/lib/account/OrdersView.js
+++ b/StoneIsland/www/js/lib/account/OrdersView.js
@@ -1,29 +1,185 @@
-var OrdersView = View.extend({
+var OrdersView = ScrollableView.extend({
 
   el: "#orders",
+  
+  loaded: false,
+  
+  list_template: $("#orders .list_template").html(),
+  item_template: $("#orders .item_template").html(),
 
   events: {
     "click .back": "back",
-    "click .details": "load_single",
+    "click .item": "load_single",
   },
 
   initialize: function(){
-    this.single = new SingleOrder ({ parent: this })
-    this.list = new OrderList ({ parent: this })
+    this.$list = this.$(".list")
+    this.$empty = this.$(".empty")
+    this.$single_order = this.$("#single_order")
+
+    this.$rows = this.$(".rows")
+    this.$subtotal = this.$(".subtotal")
+    this.$shipping = this.$(".shipping")
+    this.$tax = this.$(".tax")
+    this.$total = this.$(".total")
+    
+    this.$shipping_address = this.$(".shipping_address")
+    this.$shipping_method = this.$(".shipping_method")
+
+    this.scroller = new IScroll('#orders', app.iscroll_options)
   },
 
   show: function(){
     if (! auth.logged_in()) { return app.router.go("intro") }
+    app.header.set_back(false)
     app.footer.hide()
     document.body.className = "orders"
-    this.el.className = "list"
+    this.el.className = ""
+    
+    if (this.loaded) {
+      this.populate()
+    }
+    else {
+      this.fetch()
+    }
+  },
+  
+  orders: null,
+  orderLookup: {},
+  
+  fetch: function(){
+    this.$list.empty()
+    this.$empty.hide()
+    this.loader = new Loader(this.ready.bind(this))
+    app.curtain.show("loading")
+    sdk.account.fetch_orders({
+      success: function(data){
+        this.loader.register("orders")
+        this.orders = data.OrderDetails
+        data.OrderDetails.forEach(function(row){
+          this.loader.register(row.OrderNumber)
+          sdk.account.fetch_single_order({
+            id: row.OrderNumber,
+            success: function(row_data){
+              this.orderLookup[ row.OrderNumber ] = row_data.OrderFullDetails
+              this.loader.ready(row.OrderNumber)
+            }.bind(this),
+            error: function(){
+              this.orderLookup[ row.OrderNumber ] = null
+              this.loader.ready(row.OrderNumber)
+            }.bind(this),
+          })
+        }.bind(this))
+        this.loader.ready("orders")
+      }.bind(this),
+      error: function(){
+        console.log("error fetching orders")
+      }.bind(this),
+    })
+  },
+  
+  ready: function(){
+    this.populate()
+    app.curtain.hide("loading")
+  },
+  
+  populate: function(){
+    this.$list.empty()
+
+    if (! this.orders.length) {
+      this.$empty.show()
+      return
+    }
+    else {
+      this.$empty.hide()
+    }
+    this.orders.forEach(function(row){
+      var order = this.orderLookup[ row.OrderNumber ]
+      if (! order) { return }
+      var t = this.list_template.replace(/{{date}}/g, moment(order['Date']).format("ddd MM/DD/YYYY").toUpperCase())
+                                .replace(/{{id}}/g, row.OrderNumber)
+                                .replace(/{{total}}/g, as_cash( order.TotalAmount ))
+      var $t = $(t), $images = $t.find(".images")
+      order.Items.forEach(function(item){
+        var img = new Image ()
+        img.src = sdk.image(item['Code10'], "11_f")
+        $images.append(img)
+      }.bind(this))
+      this.$list.append($t)
+    }.bind(this))
+
+    this.refreshScroller()
   },
+  
+  load_single: function(e){
+    var id = $(e.currentTarget).data("id")
+    var order = this.orderLookup[ id ]
+    if (! order) { return }
+    
+    console.log(order)
+    
+    order.Items.forEach(function(item){
+      var $el = $("<div class='item'><img src='img/spinner.gif'></div>")
+      this.$rows.append($el)
+      var code_ten = item.Code10
+
+      var code = code_ten.substr(0, 8)
+      app.product.find(code, function(data, details){
+        var descriptions = app.product.get_descriptions( details )
+
+        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
 
-  load_single: function(){
+        details.Item.ModelColors.some(function(color){
+          if (color['Code10'] == code_ten) {
+            color_name = color['ColorDescription']
+            return true
+          }
+          return false
+        })
+        size_name = item.DefaultSize + " " + item.DefaultSizeClassFamily
+
+        var t = this.item_template
+                    .replace(/{{image}}/, sdk.image(item['Code10'], '11_f'))
+                    .replace(/{{sku}}/, num)
+                    .replace(/{{title}}/, title)
+                    .replace(/{{type}}/, type)
+                    .replace(/{{size}}/, size_name || "DEFAULT")
+                    .replace(/{{color}}/, color_name || "DEFAULT")
+                    .replace(/{{quantity}}/, 1)
+                    .replace(/{{price}}/, as_cash(details.Item.Price.DiscountedPrice))
+        $el.data("price", details.Item.Price.DiscountedPrice)
+        $el.html(t)
+        this.refreshScroller()
+      }.bind(this))
+    }.bind(this))
+    
+    var subtotal = order.ItemsTotalAmount
+    var shipping_cost = order.Delivery.Amount
+    var tax = order.SalesTaxAmount
+    var total = order.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) )
+
+    var street = order.Delivery.Address.replace(/\n$/,"").replace("\n","<br>")
+    var address = order.Delivery.Name + "<br>" + street + "<br>" + order.Delivery.City + " " + order.Delivery.ZipCode
+    this.$shipping_address.html(address)
+    this.$shipping_method.html(order.Delivery.Type + " - " + order.Delivery.Time)
+    
+    app.header.set_back(true)
+    this.$el.addClass("single")
   },
 
   back: function(){
-    this.list.show()
+    this.el.className = ""
   },
 
 })
+