From 14217efad38b70ae751e8a7da2a5a6d4c4469778 Mon Sep 17 00:00:00 2001 From: Benjamin ter Kuile Date: Mon, 31 Mar 2014 17:43:51 +0200 Subject: [PATCH] Design and style upgrades --- .../supplier/app/templates/active_list.emblem | 17 +++++-- .../app/templates/active_order.emblem | 18 ++++++- .../supplier/app/templates/index.emblem | 1 + .../application_controller.js.coffee | 5 +- .../user/app/templates/application.emblem | 15 +++--- .../menu_item_list_needs_help.emblem | 2 +- .../menu_item_list_needs_payment.emblem | 2 +- ...products.emblem => menu_item_table.emblem} | 0 .../user/app/views/menu_item_view.js.coffee | 5 +- .../base1-shared/active_lists.css.sass | 31 ++++++++++++ .../supplier/base1-shared/icons.css.sass | 38 ++++++++++++++ .../supplier/basic1/active_lists.css.sass | 50 ------------------- .../supplier/wood1/active_lists.css.sass | 50 ------------------- .../user/foundation/structure.css.sass | 8 +++ .../user_extended_list_serializer.rb | 3 +- 15 files changed, 126 insertions(+), 119 deletions(-) rename app/assets/javascripts/user/app/templates/{menu_item_list_products.emblem => menu_item_table.emblem} (100%) create mode 100644 app/assets/stylesheets/supplier/base1-shared/active_lists.css.sass create mode 100644 app/assets/stylesheets/supplier/base1-shared/icons.css.sass delete mode 100644 app/assets/stylesheets/supplier/basic1/active_lists.css.sass delete mode 100644 app/assets/stylesheets/supplier/wood1/active_lists.css.sass diff --git a/app/assets/javascripts/supplier/app/templates/active_list.emblem b/app/assets/javascripts/supplier/app/templates/active_list.emblem index af9184e3..1902b15c 100644 --- a/app/assets/javascripts/supplier/app/templates/active_list.emblem +++ b/app/assets/javascripts/supplier/app/templates/active_list.emblem @@ -1,14 +1,21 @@ td.list-status if view.content.needs_help - span.list-needs-help-indicator ? + span.icon.needs-help if view.content.needs_payment - span.list-needs-payment-indicator € + | + span.icon.needs-payment td.numeric.table_number {{view.content.table_number}} td.section_title {{view.content.section.title}} td.currency.total_list_amount {{currency view.content.price}} td.actions if view.content.needs_help - button.btn.btn-info.mark_list_as_helped{ action markListAsHelped view.content.id} {{t 'list.is_helped_button'}} - button.btn.btn-warning.close_list{ action closeList view.content.id} {{t 'list.close_list' }} - a.btn href="/supplier/lists/{{unbound view.content.id}}" + button.mark_list_as_helped{ action markListAsHelped view.content.id} + span.fa-stack + i.fa.fa-bell.fa-stack-1x + i.fa.fa-ban.fa-stack-2x.revoke + span.button-text=t 'list.is_helped_button' + button.close_list{ action closeList view.content.id} + span.fa.fa-times.fa-2x + span.button-text=t 'list.close_list' + a.btn.hide href="/supplier/lists/{{unbound view.content.id}}" span.icon-list   diff --git a/app/assets/javascripts/supplier/app/templates/active_order.emblem b/app/assets/javascripts/supplier/app/templates/active_order.emblem index 8152eed0..225fc00d 100644 --- a/app/assets/javascripts/supplier/app/templates/active_order.emblem +++ b/app/assets/javascripts/supplier/app/templates/active_order.emblem @@ -1,3 +1,5 @@ +td.status-icons + span.active-order.fa.fa-check.fa-lg td {{view.content.display}} td.numeric.table_number view Qsupplier.App.ActiveOrderTableNumberView contextBinding=view.content @@ -5,5 +7,17 @@ td.section_title {{view.content.section.title}} td.currency {{currency view.content.total }} td.actions if view.content.placed - button.btn.btn-success{ action markOrderActive view.content.id} {{t 'order.being_processed'}} - button.btn.btn-inverse{ action markOrderDelivered view.content.id} {{t 'order.being_served' }} + button{ action markOrderActive view.content.id} + span.fa.fa-check.fa-2x + 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{ action markOrderDelivered view.content.id} + span.fa-shifted-stack + i.fa.fa-check.fa-2x + i.fa.fa-check.fa-2x + 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' diff --git a/app/assets/javascripts/supplier/app/templates/index.emblem b/app/assets/javascripts/supplier/app/templates/index.emblem index 4d0b75cd..26039855 100644 --- a/app/assets/javascripts/supplier/app/templates/index.emblem +++ b/app/assets/javascripts/supplier/app/templates/index.emblem @@ -21,6 +21,7 @@ table.active-orders-table.table thead tr + th.status-icons th {{t 'models.order'}} th.numeric {{t 'table_number'}} th {{t 'models.section'}} diff --git a/app/assets/javascripts/user/app/controllers/application_controller.js.coffee b/app/assets/javascripts/user/app/controllers/application_controller.js.coffee index 54f012f1..109b78ff 100644 --- a/app/assets/javascripts/user/app/controllers/application_controller.js.coffee +++ b/app/assets/javascripts/user/app/controllers/application_controller.js.coffee @@ -17,7 +17,10 @@ App.ApplicationController = Ember.Controller.extend list_needs_help: -> @set 'list.needs_help', true # incoming from other users list_is_paid: -> @set 'list.needs_payment', false list_needs_payment: -> @set 'list.needs_payment', true # incoming from other users - list_closed: -> @set 'list', null + list_closed: (data)-> + @transitionToRoute('list', data.id).then => + @set 'list.state', 'closed' + @set 'list', null join_request_approved: (data)-> @setCurrentList -> @transitionToRoute('active_list') order_being_processed: (data)-> diff --git a/app/assets/javascripts/user/app/templates/application.emblem b/app/assets/javascripts/user/app/templates/application.emblem index a0e2e018..f09b5e5e 100644 --- a/app/assets/javascripts/user/app/templates/application.emblem +++ b/app/assets/javascripts/user/app/templates/application.emblem @@ -12,7 +12,7 @@ .right if list.id App.MenuItemView route="active_list" - App.MenuItemView route='list_products' + App.MenuItemView route='table' route_param=list.table.id App.MenuItemListNeedsHelpView App.MenuItemListNeedsPaymentView aside.left-off-canvas-menu @@ -25,12 +25,13 @@ li a{action scanQr bubbles=false} span Scan QR - li - =link-to 'list_products' - span= t 'list_products.title' - li - =link-to 'active_list' - span= t 'active_list.title' + if list.id + li + =link-to 'table' list.table.id + span= t 'list_products.title' + li + =link-to 'active_list' + span= t 'active_list.title' li =link-to 'lists' span= t 'models.plural.list' diff --git a/app/assets/javascripts/user/app/templates/menu_item_list_needs_help.emblem b/app/assets/javascripts/user/app/templates/menu_item_list_needs_help.emblem index 55a1cbac..be87cf53 100644 --- a/app/assets/javascripts/user/app/templates/menu_item_list_needs_help.emblem +++ b/app/assets/javascripts/user/app/templates/menu_item_list_needs_help.emblem @@ -1 +1 @@ -span.needs-help.fa.fa-hand-o-up.fa-lg +span.icon.needs-help diff --git a/app/assets/javascripts/user/app/templates/menu_item_list_needs_payment.emblem b/app/assets/javascripts/user/app/templates/menu_item_list_needs_payment.emblem index 995283bf..18daad01 100644 --- a/app/assets/javascripts/user/app/templates/menu_item_list_needs_payment.emblem +++ b/app/assets/javascripts/user/app/templates/menu_item_list_needs_payment.emblem @@ -1 +1 @@ -span.needs-payment.fa.fa-money.fa-lg +span.icon.needs-payment diff --git a/app/assets/javascripts/user/app/templates/menu_item_list_products.emblem b/app/assets/javascripts/user/app/templates/menu_item_table.emblem similarity index 100% rename from app/assets/javascripts/user/app/templates/menu_item_list_products.emblem rename to app/assets/javascripts/user/app/templates/menu_item_table.emblem diff --git a/app/assets/javascripts/user/app/views/menu_item_view.js.coffee b/app/assets/javascripts/user/app/views/menu_item_view.js.coffee index 6db2588c..c94b4a9a 100644 --- a/app/assets/javascripts/user/app/views/menu_item_view.js.coffee +++ b/app/assets/javascripts/user/app/views/menu_item_view.js.coffee @@ -2,7 +2,10 @@ App.MenuItemView = Ember.View.extend classNames: 'menu-list-item' classNameBindings: ['active'] click: -> - @get('controller').transitionToRoute(@route) + if @route_param + @get('controller').transitionToRoute(@route, @route_param) + else + @get('controller').transitionToRoute(@route) active: (-> if @get('controller.currentPath') == @route then 'active' else '' ).property('controller.currentPath') diff --git a/app/assets/stylesheets/supplier/base1-shared/active_lists.css.sass b/app/assets/stylesheets/supplier/base1-shared/active_lists.css.sass new file mode 100644 index 00000000..85cab2d7 --- /dev/null +++ b/app/assets/stylesheets/supplier/base1-shared/active_lists.css.sass @@ -0,0 +1,31 @@ +.button-text + // Only icons for now + display: none +.active-orders-table + .status-icons + span + display: none + .active + .status-icons + .active-order + display: inline-block +.active-orders-table + tbody + tr + td + .active_order_table_number + position: relative + .extra-list-info + // Facebook profiles + display: none + $extra-info-width: 220px + position: absolute + width: $extra-info-width + // 7px is padding + border, 5px is extra spacing + right: -$extra-info-width - 7px*2 - 5px + top: -7px*2 + padding: 4px + border: 3px solid #aaa + border-radius: 3px + background-color: white + text-align: left diff --git a/app/assets/stylesheets/supplier/base1-shared/icons.css.sass b/app/assets/stylesheets/supplier/base1-shared/icons.css.sass new file mode 100644 index 00000000..38704154 --- /dev/null +++ b/app/assets/stylesheets/supplier/base1-shared/icons.css.sass @@ -0,0 +1,38 @@ +@import font-awesome +span.icon + @extend .fa + @extend .fa-lg + &.needs-help + @extend .fa-bell + &.needs-payment + @extend .fa-money +.fa-stack + .revoke + color: #b94a48 + +.button-icon + display: inline-block + width: 2em + height: 2em + line-height: 2em + vertical-align: middle + background-repeat: no-repeat + background-position: center center +.mark-order-active .button-icon + background-image: image-url('icons/order-check.png') +.mark-order-delivered .button-icon + background-image: image-url('icons/order-doublecheck.png') + +.fa-shifted-stack + position: relative + display: inline-block + width: 2.5em + height: 2em + line-height: 2em + vertical-align: middle + .fa + position: absolute + width: 100% + left: 20% + &:first-child + left: -10% diff --git a/app/assets/stylesheets/supplier/basic1/active_lists.css.sass b/app/assets/stylesheets/supplier/basic1/active_lists.css.sass deleted file mode 100644 index 25ebba2a..00000000 --- a/app/assets/stylesheets/supplier/basic1/active_lists.css.sass +++ /dev/null @@ -1,50 +0,0 @@ -.list-status - .list-needs-help-indicator - display: inline-block - width: 30px - color: #400 - background-color: #aaf - text-align: center - margin-right: 7px - &.hide - display: none - .list-needs-payment-indicator - display: inline-block - width: 30px - color: #440 - background-color: #faa - text-align: center - margin-right: 7px - &.hide - display: none -.active-orders-table - tbody - tr - td - &:first-child - padding-left: 35px - background-position: 5px center - background-repeat: no-repeat - .active_order_table_number - position: relative - .extra-list-info - display: none - $extra-info-width: 220px - position: absolute - width: $extra-info-width - // 7px is padding + border, 5px is extra spacing - right: -$extra-info-width - 7px*2 - 5px - top: -7px*2 - padding: 4px - border: 3px solid #aaa - border-radius: 3px - background-color: white - text-align: left - &.active - td - &:first-child - background-image: image-url('icons/order-check.png') - &.delivered - td - &:first-child - background-image: image-url('icons/order-doublecheck.png') diff --git a/app/assets/stylesheets/supplier/wood1/active_lists.css.sass b/app/assets/stylesheets/supplier/wood1/active_lists.css.sass deleted file mode 100644 index 25ebba2a..00000000 --- a/app/assets/stylesheets/supplier/wood1/active_lists.css.sass +++ /dev/null @@ -1,50 +0,0 @@ -.list-status - .list-needs-help-indicator - display: inline-block - width: 30px - color: #400 - background-color: #aaf - text-align: center - margin-right: 7px - &.hide - display: none - .list-needs-payment-indicator - display: inline-block - width: 30px - color: #440 - background-color: #faa - text-align: center - margin-right: 7px - &.hide - display: none -.active-orders-table - tbody - tr - td - &:first-child - padding-left: 35px - background-position: 5px center - background-repeat: no-repeat - .active_order_table_number - position: relative - .extra-list-info - display: none - $extra-info-width: 220px - position: absolute - width: $extra-info-width - // 7px is padding + border, 5px is extra spacing - right: -$extra-info-width - 7px*2 - 5px - top: -7px*2 - padding: 4px - border: 3px solid #aaa - border-radius: 3px - background-color: white - text-align: left - &.active - td - &:first-child - background-image: image-url('icons/order-check.png') - &.delivered - td - &:first-child - background-image: image-url('icons/order-doublecheck.png') diff --git a/app/assets/stylesheets/user/foundation/structure.css.sass b/app/assets/stylesheets/user/foundation/structure.css.sass index 056150c7..afa0712f 100644 --- a/app/assets/stylesheets/user/foundation/structure.css.sass +++ b/app/assets/stylesheets/user/foundation/structure.css.sass @@ -1,3 +1,4 @@ +@import font-awesome section.main-section height: 100% .top-menu @@ -13,6 +14,13 @@ section.main-section &.active color: yellow border-color: yellow +span.icon + @extend .fa + @extend .fa-lg + &.needs-help + @extend .fa-bell + &.needs-payment + @extend .fa-money #notice a color: white diff --git a/app/serializers/user_extended_list_serializer.rb b/app/serializers/user_extended_list_serializer.rb index de9013d6..ebb75484 100644 --- a/app/serializers/user_extended_list_serializer.rb +++ b/app/serializers/user_extended_list_serializer.rb @@ -11,7 +11,7 @@ class UserExtendedListSerializer < Qwaiter::Serializer embed :ids, include: true attributes :extended_version, :state, :needs_help, :needs_payment, :is_paid, :price, :table_id, :table_number, :section_id, :user_ids, - :supplier_orders_in_process_count, :supplier_orders_placed_count + :supplier_orders_in_process_count, :supplier_orders_placed_count, :supplier_id def has_active_orders object.has_active_orders? @@ -21,6 +21,7 @@ class UserExtendedListSerializer < Qwaiter::Serializer has_one :table, serializer: UserExtendedTableSerializer has_many :join_requests has_many :users, serializer: UserUserSerializer + #has_one :supplier def extended_version true