Supplier closed list and mark list helped refactor

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

@@ -16,13 +16,15 @@ Qsupplier.App.IndexController = Ember.ObjectController.extend
   ).property('orders.@each.state', 'active_section.id')
 
   actions:
+    ###
     markListAsHelped: (id)->
       if list = Qsupplier.App.List.findCached(id)
         list.is_helped()
 
-    closeList: (id)->
+    closeList: (list)->
-      if list = Qsupplier.App.List.findCached(id)
+      @send 'openModal', 'modal_close_list', list
-        list.close()
+      # list.close()
+    ###
 
     markOrderDelivered: (id)->
       $.post('/supplier/order_is_delivered', order_id: id)

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

@@ -0,0 +1,7 @@
+Qsupplier.App.ModalCloseListController = Ember.ObjectController.extend
+  actions:
+    close: ->
+      @send 'closeModal'
+    confirm: ->
+      @get('model').close()
+      @send 'closeModal'

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

@@ -2,8 +2,11 @@ Qsupplier.App.SectionController = Ember.ObjectController.extend
   needs: ['application', 'sections', 'section'] #wtf? section, otherwise an Ember error
   editmode: false
   actions:
+    ###
     markListAsHelped: (list) -> list.is_helped() if list
-    closeList: (list)-> list.close() if list
+    closeList: (list)->
+      @send 'openModal', 'modal_close_list', list
+    ###
     makeEditable: -> @set('editmode', true)
     finishEditable: ->
       @set('editmode', false)

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

@@ -7,7 +7,11 @@ if list.closed_at
     .display-field=time list.closed_at
 .display-row
   .display-label=t 'attributes.list.state'
-  .display-field=state 'list' list.state
+  .display-field
+    =state 'list' list.state
+.display-row
+  .display-label  
+  .display-field: Qsupplier.App.CloseListButtonView content=list
 .row
   each user in list.users
     img.facebook-image src="http://graph.facebook.com/#{unbound user.facebook_id}/picture?type=square" alt="f"

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

@@ -8,13 +8,12 @@ td.numeric.table_number: Qsupplier.App.TableNumberWithInfoView contextBinding="v
 td.section_title {{view.content.section.title}}
 td.currency.total_list_amount {{currency view.content.total}}
 td.actions
-  if view.content.needs_help
+  / if view.content.needs_help
     button.mark_list_as_helped{ action markListAsHelped view.content.id}
       span.fa-stack.fa-2x.fa-stack-sized
         i.fa.fa-bell.fa-stack-small
         i.fa.fa-ban.revoke
-  button.close_list{ action closeList view.content.id}
+  Qsupplier.App.MarkListHelpedButtonView content=view.content
-    span.fa-stack.fa-2x.fa-stack-sized
+  Qsupplier.App.CloseListButtonView content=view.content
-      i.fa.fa-credit-card
+
-      i.fa-stack-check
   button.show-list.button{action "showList" view.content.id}: span

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

@@ -0,0 +1,3 @@
+span.fa-stack.fa-2x.fa-stack-sized
+  i.fa.fa-credit-card
+  i.fa-stack-check

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

@@ -0,0 +1,3 @@
+span.fa-stack.fa-2x.fa-stack-sized
+  i.fa.fa-bell.fa-stack-small
+  i.fa.fa-ban.revoke

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

@@ -0,0 +1,10 @@
+modal-dialog action="close"
+  .modal-header
+    h3.flush--top=t 'list.close.modal.title'
+    hr
+  .modal-body
+    p=t 'list.close.modal.message'
+  .modal-footer
+    hr
+    button.confirm-cancel{action "close"}=t 'list.close.modal.cancel'
+    button.confirm-ok.right{action "confirm"}=t 'list.close.modal.close_list'

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

@@ -4,15 +4,12 @@
   span.needs_help
   span.active_order
 div class="table-actions table-actions-#{unbound table.id}"
-  .title {{table.number}}
+  .title= table.number
-  if table.active_list.needs_help
-    .table-action-row
-      button{ action markListAsHelped table.active_list } class="btn btn-info btn-small list-is-helped-button-#{unbound table.active_list.id}" {{t "list.is_helped_button"}}
   if table.active_list
     .table-action-row
-      button{ action closeList table.active_list } class="btn btn-warning btn-small close-list" {{t 'list.close_list'}}
+      Qsupplier.App.MarkListHelpedButtonView content=table.active_list
-  /.table-action-row
+      Qsupplier.App.CloseListButtonView content=table.active_list
-    a href="suppliers_table_path(@table)" {{t 'section.tables_view.table_actions.got_to_table'}}
+    .table-action-row=currency table.active_list.total
   each user in table.active_list.users
     img src=user.facebook_image
 if editmodedisabled

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

@@ -0,0 +1,7 @@
+Qsupplier.App.CloseListButtonView = Ember.View.extend
+  templateName: 'close_list_button'
+  classNames: ['close-list-button']
+  classNameBindings: ['content.active:show:hide']
+  tagName: 'button'
+  click: (e)->
+    @get('controller').send 'openModal', 'modal_close_list', @get('content')

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

@@ -0,0 +1,7 @@
+Qsupplier.App.MarkListHelpedButtonView = Ember.View.extend
+  templateName: 'mark_list_helped_button'
+  classNames: ['mark_list_as_helped']
+  classNameBindings: ['content.needs_help:show:hide']
+  tagName: 'button'
+  click: (e)->
+    @get('content').is_helped()

app/assets/javascripts/supplier/foundation1/application.js.erb

@@ -17,6 +17,7 @@
 //= require moment
 var Qstorage = localStorage;
 
+
 $.extend($translations.en, <%= I18n.t('supplier', locale: :en).to_json %>);
 $.extend($translations.nl, <%= I18n.t('supplier', locale: :nl).to_json %>);
 

app/assets/stylesheets/supplier/foundation1/components/_dashboard.css.sass

@@ -6,18 +6,6 @@ $button-spacing: 8px
     width: calc(100% - 30px)
 .active-lists-table
   width: 100%
-  .mark_list_as_helped
-    +button-icon-only
-    vertical-align: top
-    padding-left: 8px //do not ask me why, just looks
-    padding-right: 2px //do not ask me why, just looks
-    margin-right: $button-spacing
-  .close_list
-    +button-icon-only
-    //span
-      @extend .fa
-      @extend .fa-2x
-      @extend .fa-times // This is not good!!!
   .show-list
     +button-icon-only
     margin-left: $button-spacing
@@ -25,7 +13,14 @@ $button-spacing: 8px
       @extend .fa
       @extend .fa-2x
       @extend .fa-list
-
+.mark_list_as_helped
+  +button-icon-only
+  vertical-align: top
+  padding-left: 8px //do not ask me why, just looks
+  padding-right: 2px //do not ask me why, just looks
+  margin-right: $button-spacing
+.close-list-button
+  +button-icon-only
 .active-orders-table
   width: 100%
   .mark_order_active

config/locales/supplier.en.yml

@@ -34,6 +34,12 @@ en:
       close_list: Close!
       none_found: 'No ${models.plural.list|downcase}'
       go_to_lists: Go to lists
+      close:
+        modal:
+          title: Are you sure yout want to close the ${models.list}
+          message: After closing a list the customer can open a new one
+          cancel: Cancel
+          close_list: Close ${models.list}
     order:
       being_processed: 'In process!'
       being_served: 'Is delivered!'

config/locales/supplier.nl.yml

@@ -34,6 +34,12 @@ nl:
       close_list: Afsluiten!
       none_found: 'Geen ${models.plural.list|downcase}'
       go_to_lists: Naar lijsten
+      close:
+        modal:
+          title: Wil je de ${models.list} afsluiten?
+          message: Hierna kunnen gebruikers weer een nieuwe lijst openen
+          cancel: Nog niet
+          close_list:  ${models.list} afsluiten
     order:
       being_processed: 'Ben bezig!'
       being_served: 'Ik kom het brengen!'