Refactor for better order marking buttons

app/assets/javascripts/supplier/app/controllers/index_controller.js.coffee

@@ -33,20 +33,5 @@ App.IndexController = Ember.ObjectController.extend
     toggleDashboardLists: -> @set 'show_lists', !@get('show_lists')
     toggleDashboardOrders: ->@set 'show_orders', !@get('show_orders')
 
-    markOrderDelivered: (id)->
-      #$.post('/supplier/order_is_delivered', order_id: id)
-      Ember.$.post Routes.mark_delivered_suppliers_order_path(id)
-      if order = App.Order.findCached(id)
-        order.set('state', 'delivered')
-
-    markOrderActive: (id)->
-      #$.post('/supplier/mark_order_in_process', order_id: id)
-      Ember.$.post Routes.mark_in_process_suppliers_order_path(id)
-      if order = App.Order.findCached(id)
-        order.set('state', 'active')
-    cancelOrder: (order)->
-      #$.post "/supplier/orders/#{order.id}/cancel"
-      Ember.$.post Routes.cancel_suppliers_order_path(order.id)
-      order.set 'state', 'cancelled'
     showList: (id)->
       @transitionToRoute 'list', id

app/assets/javascripts/supplier/app/models/list.js.coffee

@@ -18,19 +18,19 @@ App.List = DS.Model.extend
   section: DS.belongsTo('section')
   section_id: attr('string')
   active: ( -> @get('state') is 'active' ).property('state')
-  markClosed: ->
+  isClosed: ->
     @set('state', 'closed')
     #@set 'has_active_orders', false
     @set 'table', null
-    @markHelped()
+    @isHelped()
-    @markIsPaid()
+    @isPaid()
-  markHelped: ->
+  iskHelped: ->
     @set 'needs_help', false
-  markNeedsHelp: ->
+  isNeedingHelp: ->
     @set 'needs_help', true
-  markNeedsPayment: ->
+  isNeedingPayment: ->
     @set 'needs_payment', true
-  markIsPaid: ->
+  isPaid: ->
     @set 'needs_payment', false
   relevant_orders: (-> @get('orders').filter((o)->o.get('state') isnt 'cancelled')).property('orders.@each.state')
   active_orders: (-> @get('orders').filter((o)->o.get('state') is 'placed' or o.get('state') is 'active')).property('orders.@each.state')

app/assets/javascripts/supplier/app/models/order.js.coffee

@@ -12,19 +12,24 @@ App.Order = DS.Model.extend
   placed: (-> @get('state') == 'placed').property('state')
   needs_supplier_attention: (-> (@get('state') == 'placed') || (@get('state') == 'active')).property('state')
 
-  #display: (->
+  isClosed: ->
-    #return '' unless @get('product_orders')
-    #@get('product_orders').map((po)-> "#{po.product_name} (#{po.quantity})").join(',')
-  #).property('product_orders')
-
-  markClosed: ->
     @set 'state', 'closed'
-  markCancelled: ->
+  isCancelled: ->
     @set 'state', 'cancelled'
-  markDelivered: ->
+  isDelivered: ->
-    @set 'state', 'closed'
+    @set 'state', 'delivered'
-  markActive: ->
+  isActive: ->
     @set 'state', 'active'
+  mark_active: ->
+    #$.post('/supplier/mark_order_in_process', order_id: id)
+    Ember.$.post Routes.mark_in_process_suppliers_order_path @get('id')
+    @isActive()
+  mark_delivered: ->
+    Ember.$.post Routes.mark_delivered_suppliers_order_path @get('id')
+    @isDelivered()
+  mark_cancelled: ->
+    Ember.$.post Routes.cancel_suppliers_order_path @get('id')
+    @isCancelled()
   total: (->
     @get('product_orders').getEach('total').reduce(((sum, total) -> sum + total), 0)
   ).property('product_orders.@each.total')

app/assets/javascripts/supplier/app/routes/application_route.js.coffee.erb

@@ -97,17 +97,17 @@ App.ApplicationRoute = Ember.Route.extend
   events:
     list_needs_help: (data) ->
       if list = @store.getById('list', data.id)
-        list.markNeedsHelp()
+        list.isNeedingHelp()
         controller = @controllerFor('application')
         return if controller.get('active_section.id') and list.get('section.id') isnt controller.get('active_section.id')
         try ion.sound.play 'bell_ring'
     list_needs_payment: (data) ->
       if list = @store.getById('list', data.id)
-        list.markNeedsPayment()
+        list.isNeedingPayment()
         controller = @controllerFor('application')
         return if controller.get('active_section.id') and list.get('section.id') isnt controller.get('active_section.id')
         try ion.sound.play 'water_droplet_3'
-    list_is_paid: (data) -> list.markIsPaid() if list = @store.getById('list', data.id)
+    list_is_paid: (data) -> list.isPaid() if list = @store.getById('list', data.id)
     list_update: (data) ->
       if data.new_order_id
         @send 'newOrder', data.new_order_id
@@ -117,13 +117,13 @@ App.ApplicationRoute = Ember.Route.extend
       #@store.findById('list', data.list.id).then (list)->
       #  list.get('table').then (table)->table.set('active_list', list)
     list_changed_table: (data) -> @store.pushPayload('list', lists: [data.list])
-    list_closed: (data) -> list.markClosed() if list = @store.getById('list', data.id)
+    list_closed: (data) -> list.isClosed() if list = @store.getById('list', data.id)
-    list_helped: (data) -> list.markHelped() if list = @store.getById('list', data.id)
+    list_helped: (data) -> list.isHelped() if list = @store.getById('list', data.id)
     remove_list_needs_payment: (data) -> list.set('needs_payment', false) if list = @store.getById('list', data.id)
-    order_closed: (data) -> order.markClosed() if order = @store.getById('order', data.id)
+    order_closed: (data) -> order.isClosed() if order = @store.getById('order', data.id)
-    order_being_processed: (data) -> order.markActive() if order = @store.getById('order', data.id)
+    order_being_processed: (data) -> order.isActive() if order = @store.getById('order', data.id)
-    order_being_delivered: (data) -> order.markDelivered() if order = @store.getById('order', data.id)
+    order_being_delivered: (data) -> order.isDelivered() if order = @store.getById('order', data.id)
-    order_cancelled: (data) -> order.markCancelled() if order = @store.getById('order', data.id)
+    order_cancelled: (data) -> order.isCancelled() if order = @store.getById('order', data.id)
     orders_in_process_count: (data) -> @set('supplier.orders_in_process_count', data.count)
     orders_placed_count: (data) -> @set('supplier.orders_placed_count', data.count)
 

app/assets/javascripts/supplier/app/templates/_list_content.emblem

@@ -22,6 +22,10 @@ if list.sorted_orders
         = order.display
         span.currency= currency order.total
         span.created_at= time order.created_at
+        .list-order-actions
+          view mark-order-active order=order
+          view mark-order-delivered order=order
+          view mark-order-cancelled order=order
     if showTotal
       .list-orders-total.total
         = t 'total'

app/assets/javascripts/supplier/app/templates/active_order.emblem

@@ -10,19 +10,6 @@ td.section_title= link-to 'section' view.content.list.table.section.id: span=vie
 td.currency=currency view.content.total
 td.time= time view.content.created_at format="HH:mm"
 td.actions
-  if view.content.placed
+  view mark-order-active order=view.content
-    button.mark_order_active{ action "markOrderActive" view.content.id}
+  view mark-order-delivered order=view.content
-      span.fa.fa-check.fa-2x
+  view mark-order-cancelled order=view.content
-      /span.button-text=t 'order.being_processed'
-    /button.hide.mark-order-active{ action "markOrderActive" view.content.id}
-      span.button-icon
-      span.button-text=t 'order.being_processed'
-  button.mark_order_delivered{ action "markOrderDelivered" view.content.id }
-    span.fa.fa-2x.fa-shifted-stack
-      span.fa-shifted.fa-check
-      span.fa-shifted.fa-check
-    /span.button-text= t 'order.being_served'
-  /button.hide.mark-order-delivered{ action "markOrderDelivered" view.content.id}
-    span.button-icon
-    span.button-text= t 'order.being_served'
-  button.remove-order{ action "cancelOrder" view.content }: span

app/assets/javascripts/supplier/app/templates/buttons/mark-order-active.emblem

@@ -0,0 +1 @@
+span.fa.fa-check.fa-2x

app/assets/javascripts/supplier/app/templates/buttons/mark-order-cancelled.emblem

@@ -0,0 +1 @@
+span

app/assets/javascripts/supplier/app/templates/buttons/mark-order-delivered.emblem

@@ -0,0 +1,3 @@
+span.fa.fa-2x.fa-shifted-stack
+  span.fa-shifted.fa-check
+  span.fa-shifted.fa-check

app/assets/javascripts/supplier/app/views/mark-order-active.js.coffee

@@ -0,0 +1,6 @@
+App.MarkOrderActiveView = Ember.View.extend
+  tagName: 'button'
+  templateName: 'buttons/mark-order-active'
+  classNames: ['mark_order_active']
+  classNameBindings: ['order.placed:active:hide']
+  click: -> @get('order').mark_active()

app/assets/javascripts/supplier/app/views/mark-order-cancelled.js.coffee

@@ -0,0 +1,10 @@
+App.MarkOrderCancelledView = Ember.View.extend
+  tagName: 'button'
+  templateName: 'buttons/mark-order-cancelled'
+  classNames: ['remove-order']
+  classNameBindings: ['showButton:active:hide']
+  showButton: Ember.computed 'order.state', ->
+    state = @get('order.state')
+    state is 'placed' or state is 'active'
+  click: -> @get('order').mark_cancelled()
+

app/assets/javascripts/supplier/app/views/mark-order-delivered.js.coffee

@@ -0,0 +1,10 @@
+App.MarkOrderDeliveredView = Ember.View.extend
+  tagName: 'button'
+  templateName: 'buttons/mark-order-delivered'
+  classNames: ['mark_order_delivered']
+  classNameBindings: ['showButton:active:hide']
+  showButton: Ember.computed 'order.state', ->
+    state = @get('order.state')
+    state is 'placed' or state is 'active'
+  click: -> @get('order').mark_delivered()
+

app/assets/javascripts/supplier/app/views/section_tables_view.js.coffee

@@ -12,7 +12,9 @@ App.SectionTablesView = Ember.View.extend DragNDrop.Droppable,
   observeSectionDimensions: (->
     return unless @get('element')
     @$el = $(@get('element'))
-    width = @$el.width()
+    viewport_width = $(window).width()
+    @$el.css 'width', viewport_width
+    width = viewport_width
     height =  width * @get('controller.model.height') / @get('controller.model.width')
     viewport_height = $(window).height() - 52
     if height > viewport_height

wip.md

@@ -10,6 +10,8 @@ Supplier
 - Add qr print functionality offering to send the stickers
 - Add qr-print button to tables
 - Product variants
+- Order product buttons to views
+- Use modernizr svg to determine svg handling capabilities
 
 
 User