Ember temp commit

app/assets/javascripts/qwaiter.js.coffee

@@ -42,7 +42,3 @@ window.Qwaiter=
           currency(Mustache.render(val, this))
     )
     Mustache.to_html($(selector).html(), locs)
-
-jQuery.ajaxSetup
-  'beforeSend': (xhr) ->
-    xhr.setRequestHeader("Accept", "text/javascript")

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

@@ -0,0 +1,3 @@
+Qsupplier.App = Ember.Application.create
+  LOG_TRANSITIONS: true
+  rootElement: '#app'

app/assets/javascripts/supplier/app/application.js.coffee

@@ -0,0 +1,6 @@
+#= require handlebars
+#= require ember
+#= require ember-data
+#= require_directory ./modifications
+#= require ./app
+#= require_tree .

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

@@ -0,0 +1,17 @@
+Qsupplier.App.IndexController = Ember.ObjectController.extend
+  active_lists: (->
+    @get('lists').filterProperty('state', 'active')
+  ).property('lists.@each.state')
+
+  active_orders: (->
+    @get('orders').filter (o)->(o.get('state') == 'active')
+  ).property('orders.@each.state')
+
+  markListAsHelped: (id)->
+    list = Qsupplier.App.List.find(id)
+    list.set('needs_help', false)
+    $.post '/supplier/mark_list_as_helped', {list_id: id}
+  closeList: (id)->
+    list = Qsupplier.App.List.find(id)
+    list.set('state', 'closed')
+    $.post '/supplier/close_list', {list_id: id}

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

@@ -0,0 +1,13 @@
+Qsupplier.App.SectionController = Ember.ObjectController.extend
+  #width: -> $('.section-tables-active').width()
+  #height: -> $('.section-tables-active').height()
+  dummy: -> 3
+  editmode: false
+  makeEditable: -> @set('editmode', true)
+  finishEditable: -> 
+    @set('editmode', false)
+    @get('model').save()
+  addTables: ->
+    $('#add-tables-modal').modal()
+  arrangeTables: ->
+    $('#arrange-tables-modal').modal()

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

@@ -0,0 +1 @@
+Qsupplier.App.SectionsController = Ember.ArrayController.extend {}

app/assets/javascripts/supplier/app/helpers/currency_helper.js.coffee

@@ -0,0 +1,2 @@
+Ember.Handlebars.registerBoundHelper 'currency', (amount, params..., options)->
+  new Handlebars.SafeString Qwaiter.currency(amount)

app/assets/javascripts/supplier/app/helpers/drag_n_drop.js.coffee

@@ -0,0 +1,43 @@
+# on why local storage is used in the enter events
+# http://stackoverflow.com/questions/8762635/getting-the-filename-during-the-dragenter-event
+DragNDrop = Ember.Namespace.create()
+DragNDrop.cancel = (e)->
+    e.preventDefault()
+    false
+
+DragNDrop.Draggable = Ember.Mixin.create
+  attributeBindings: 'draggable'
+  draggable: 'true'
+  dragStart: (e)->
+    @set 'content.isDragging', true
+    localStorage.setItem('draggingView', @get('elementId'))
+    dataTransfer = e.originalEvent.dataTransfer
+    dataTransfer.setData 'Text', @get('elementId')
+  dragEnd: (e)->
+    @set 'content.isDragging', false
+    localStorage.removeItem 'draggingView' if localStorage.getItem 'draggingView'
+
+DragNDrop.Droppable = Ember.Mixin.create
+  dragEnter: (e)->
+    if @dragEntered
+      e.preventDefault()
+      viewId = localStorage.getItem 'draggingView'
+      view = Ember.View.views[viewId]
+      @dragEntered view
+    else
+      DragNDrop.cancel(e)
+  dragOver: DragNDrop.cancel
+  drop: (e)->
+    e.preventDefault()
+    viewId = e.originalEvent.dataTransfer.getData('Text')
+    view = Ember.View.views[viewId]
+    return unless view
+    # Calculate drop position relative to container
+    position =
+      left: Math.max(e.originalEvent.pageX - view.$el.offsetParent().offset().left - (view.$el.outerWidth()/2), 0)
+      top:  Math.max(e.originalEvent.pageY - view.$el.offsetParent().offset().top - (view.$el.outerHeight()/2), 0)
+
+    @dropped view, position if @dropped
+    false
+
+@DragNDrop = DragNDrop

app/assets/javascripts/supplier/app/helpers/route_helper.js.coffee

@@ -0,0 +1,8 @@
+Ember.Handlebars.registerHelper 'route', (route_name, params..., options)->
+  opts = options.hash
+  if scope = @get('content')
+    params = params.map (a) -> scope.get(a)
+    for k,v of opts
+      opts[k] = scope.get(v) if typeof(v) == 'string' && scope.get(v)
+  route = if params.length then Routes[route_name].call(this, params, opts) else Routes[route_name].call(this, opts)
+  new Handlebars.SafeString route

app/assets/javascripts/supplier/app/helpers/translation.js.coffee

@@ -0,0 +1,4 @@
+Ember.Handlebars.registerHelper 't', (path, params..., options)->
+  text = t(path)
+  tag = if options.hash.bare then text else "<span data-t=\"#{path}\">#{text}</span>"
+  new Handlebars.SafeString tag

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

@@ -0,0 +1,11 @@
+attr = DS.attr
+Qsupplier.App.List = DS.Model.extend
+  state: attr 'string'
+  needs_help: attr 'boolean'
+  needs_payment: attr 'boolean'
+  is_paid: attr 'boolean'
+  has_active_orders: attr 'boolean'
+  price: attr 'number'
+  table_number: attr 'number'
+  table: DS.belongsTo('Qsupplier.App.Table', inverse: 'active_list')
+  orders: DS.hasMany('Qsupplier.App.Order')

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

@@ -0,0 +1,9 @@
+attr = DS.attr
+Qsupplier.App.Order = DS.Model.extend
+  state: attr('string')
+  list: DS.belongsTo('Qsupplier.App.List')
+  total_amount: attr('number')
+  #products: attr('object')
+  products: DS.hasMany('Qsupplier.App.Product')
+  active: (-> @get('state') == 'active').property('state')
+  delivered: (-> @get('state') == 'delivered').property('state')

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

@@ -0,0 +1,3 @@
+attr = DS.attr
+Qsupplier.App.Product = DS.Model.extend
+  order: DS.belongsTo('Qsupplier.App.Order')

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

@@ -0,0 +1,6 @@
+attr = DS.attr
+Qsupplier.App.Section = DS.Model.extend
+  title: attr 'string'
+  width: attr 'number'
+  height: attr 'number'
+  tables: DS.hasMany('Qsupplier.App.Table')

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

@@ -0,0 +1,10 @@
+attr = DS.attr
+Qsupplier.App.Table = DS.Model.extend
+  number: attr 'number'
+  width: attr 'number'
+  height: attr 'number'
+  position_x: attr 'number'
+  position_y: attr 'number'
+  occupied: attr 'boolean'
+  section: DS.belongsTo('Qsupplier.App.Section')
+  active_list: DS.belongsTo('Qsupplier.App.List')

app/assets/javascripts/supplier/app/modifications/attribute_types.js.coffee

@@ -0,0 +1,5 @@
+DS.JSONTransforms['object'] =
+  deserialize: (serialized)->
+    serialized
+  serialize: (deserialized)->
+    deserialized

app/assets/javascripts/supplier/app/modifications/model_extensions.js.coffee

@@ -0,0 +1,11 @@
+DS.Model.reopen
+  created_at: DS.attr('string')
+  updated_at: DS.attr('string')
+DS.Model.reopenClass
+  findCached: (id)->
+    @all().findProperty('id', id)
+  updateOrCreate: (attributes)->
+    if cached = @findCached(attributes.id)
+      cached.setProperties attributes
+    else
+      @createRecord(attributes)

app/assets/javascripts/supplier/app/router.js.coffee

@@ -0,0 +1,9 @@
+# For more information see: http://emberjs.com/guides/routing/
+Qsupplier.App.Router.reopen
+  location: 'history'
+  rootURL: '/supplier'
+
+Qsupplier.App.Router.map ->
+  @resource 'sections', ->
+    @resource 'section', path: ':section_id'
+

app/assets/javascripts/supplier/app/routes/index_route.js.coffee

@@ -0,0 +1,11 @@
+Qsupplier.App.IndexRoute = Ember.Route.extend
+  model: ->
+    Ember.Object.create
+      lists: Qsupplier.App.List.find({state: 'active'})
+      orders: Qsupplier.App.Order.find()
+  #setupController: (controller, model)->
+    #controller.set('model', model)
+    #controller.set 'lists', Qsupplier.App.List.all() #.filterProperty('state', 'active')
+    #controller.set 'orders', Qsupplier.App.Order.all()
+    #controller.set 'lists', model.get('lists')
+    #controller.set 'orders', model.get('orders')

app/assets/javascripts/supplier/app/routes/section_route.js.coffee

@@ -0,0 +1,3 @@
+Qsupplier.App.SectionRoute = Ember.Route.extend
+  renderTemplate: ->
+    @render 'section'

app/assets/javascripts/supplier/app/routes/sections_route.js.coffee

@@ -0,0 +1,5 @@
+Qsupplier.App.SectionsRoute = Ember.Route.extend
+  model: -> Qsupplier.App.Section.find()
+
+  setupController: (controller, collection) ->
+    controller.set 'content', collection

app/assets/javascripts/supplier/app/store.js.coffee

@@ -0,0 +1,7 @@
+# http://emberjs.com/guides/models/defining-a-store/
+
+Qsupplier.App.Store = DS.Store.extend
+  revision: 11
+  adapter: DS.RESTAdapter.create
+    namespace: 'supplier'
+

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

@@ -0,0 +1,14 @@
+td.list-status
+  if view.content.needs_help
+    span.list-needs-help-indicator ?
+  if view.content.needs_payment
+    span.list-needs-payment-indicator €
+td.numeric.table_number {{view.content.table_number}}
+td.section_title {{view.content.section_title}}
+td.currency.total_list_amount {{currency total_amount}}
+td.actions
+  if view.content.needs_help
+    button.btn.btn-info{ action markListAsHelped view.content.id} {{t 'list.is_helped_button'}}
+  button.btn.btn-warning{ action closeList view.content.id} {{t 'list.close_list' }}
+  a.btn href="/supplier/lists/{{unbound view.content.id}}"
+    span.icon-list  

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

@@ -0,0 +1,8 @@
+td {{view.content.display}}
+td.numeric.table_number {{view.content.table_number}}
+td.section_title {{view.content.section_title}}
+td.currency {{currency total_amount}}
+td.actions
+  /*<button id="order-in-process-button-{{id}}" class="btn btn-success {{^can_process}}hide{{/can_process}}" onclick="Qsupplier.mark_order_in_process('{{id}}')" data-t="order.being_processed"></button>*/
+  /*<button class="btn btn-inverse" onclick="Qsupplier.mark_order_delivered('{{id}}')" data-t="order.being_served"></button>*/
+  ' Actions

app/assets/javascripts/supplier/app/templates/application.hbs

@@ -0,0 +1 @@
+{{outlet}}

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

@@ -0,0 +1,28 @@
+.page-header
+  h3 {{t 'active_lists.title'}}
+.well
+  table.active-lists-table.table
+    thead
+      tr
+        th.status-icons
+        th.numeric {{t 'table_number'}}
+        th {{t 'models.section'}}
+        th.currency {{t 'active_lists.price'}}
+        th.actions
+    tbody
+      each list in controller.active_lists
+        ' {{view 'Qsupplier.App.ActiveListView' contentBinding=list}}
+.page-header
+  h3 {{t 'active_orders.title' }}
+.well
+  table.active-orders-table.table
+    thead
+      tr
+        th {{t 'models.order'}}
+        th.numeric {{t 'table_number'}}
+        th {{t 'models.section'}}
+        th.currency {{t 'active_orders.price'}}
+        th.actions
+    tbody
+      each order in controller.active_orders
+        ' {{view 'Qsupplier.App.ActiveOrderView' contentBinding=order}}

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

@@ -0,0 +1,26 @@
+.section-manage-tables.pull-right
+  if editmode
+    .btn-group
+      a.btn.dropdown-toggle data-toggle="dropdown" href="#"
+        span Action
+        span.caret
+      ul.dropdown-menu
+        li
+          a{action addTables} {{t 'section.add_tables.button_label'}}
+        li
+          a{action arrangeTables} {{t 'section.arrange_tables.modal.title'}}
+        li
+          a href="{{route 'qr_codes_suppliers_tables_path' section_id=id}}" {{t 'tables.qr_codes.link'}}
+        li
+          a href="{{route 'suppliers_section_path' id}}" data-method="delete" data-confirm="{{t 'helpers.links.are_you_sure' bare=true}}" {{t 'helpers.links.destroy'}}
+    view Ember.TextField valueBinding="title"
+    view Ember.TextField valueBinding="width" classNames="dimension"
+    span x
+    view Ember.TextField valueBinding="height" classNames="dimension"
+    a.btn.btn-mini{ action finishEditable}
+      span.icon-ok
+  else
+    a.btn.btn-mini{ action makeEditable }
+      span.icon-pencil
+each table in tables
+  view 'Qsupplier.App.SectionTableView' contentBinding="table"

app/assets/javascripts/supplier/app/templates/sections.hbs

@@ -0,0 +1,6 @@
+<ul class="nav nav-tabs">
+  {{#each section in controller}}
+    {{#link-to "section" section tagName="li" href=false}}{{view 'Qsupplier.App.SectionTabHeaderView' contentBinding="section"}}{{/link-to}}
+  {{/each}}
+</ul>
+{{outlet}}

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

@@ -0,0 +1,5 @@
+.table-number {{table.number}}
+.status-icons
+  span.needs_payment.icon-flag
+  span.needs_help.icon-bell
+  span.active_order.icon-glass

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

@@ -0,0 +1,3 @@
+Qsupplier.App.ActiveListView = Ember.View.extend
+  tagName: 'tr'
+  templateName: 'active_list'

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

@@ -0,0 +1,6 @@
+Qsupplier.App.ActiveOrderView = Ember.View.extend
+  tagName: 'tr'
+  templateName: 'active_order'
+  classNameBindings: ['content.active:active', 'content.delivered:delivered']
+  didInsertElement: ->
+    debugger

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

@@ -0,0 +1,19 @@
+Qsupplier.App.SectionTabHeaderView = Ember.View.extend DragNDrop.Droppable,
+  template: Ember.Handlebars.compile('{{view.content.title}}')
+  tagName: 'a'
+  attributeBindings: ['href']
+  href: (-> Routes.suppliers_section_path(@content.id)).property()
+  dragEntered: (view)->
+    return false
+    # Changing the route for now is too difficult. Just do a move
+    #if view.constructor.toString().match(/SectionTableView$/)
+      #@get('controller').transitionToRoute 'section', @get('content')
+  dropped: (view)->
+    if view.constructor.toString().match(/SectionTableView$/)
+      table = view.get('content')
+      table.set 'section', @content
+      console.log "dirty? #{table.get('isDirty')}"
+      #table.get('transaction').commit()
+      table.save()
+  didInsertElement: ->
+    @$el = $ @get('element')

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

@@ -0,0 +1,40 @@
+Qsupplier.App.SectionTableView = Ember.View.extend DragNDrop.Draggable,
+  templateName: 'table'
+  classNames: ['section-table']
+  classNameBindings: [
+    'content.active_list:occupied',
+    'controller.editmode:draggable',
+    'content.active_list.needs_help:needs_help',
+    'content.active_list.needs_payment:needs_payment',
+    'content.active_list.has_active_orders:active_order'
+  ]
+  offsetX: ->
+    (@content.get('position_x') || 0) * @containerWidth() / (@content.get('section').get('width') || 1)
+  offsetY: (->
+    (@content.get('position_y') || 0) * @containerHeight() / (@content.get('section').get('height') || 1)
+  )
+  activeList: (->
+    !!@get('content.active_list_id')
+  ).property('content.active_list_id')
+  attributeBindings: ['style']
+  style: (-> 
+    "position:absolute;width:83px;height:48px"
+  ).property()
+  draggable: (->  if @get('controller.editmode') then 'true' else 'false' ).property('controller.editmode')
+  placeInSection: ->
+    @$el.css 'left', @offsetX()
+    @$el.css 'top', @offsetY()
+  didInsertElement: ->
+    @$el = $ @get('element')
+    @placeInSection()
+  positionChange: (position)->
+    @$el.css 'left', position.left
+    @$el.css 'top', position.top
+    @content.setProperties
+      position_x: position.left*@content.get('section').get('width') / @containerWidth()
+      position_y: position.top *@content.get('section').get('height') / @containerHeight()
+    @content.get('transaction').commit()
+  containerWidth: ->
+    $(@get('parentView.element')).width()
+  containerHeight: ->
+    $(@get('parentView.element')).height()

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

@@ -0,0 +1,14 @@
+Qsupplier.App.SectionView = Ember.View.extend DragNDrop.Droppable,
+  classNames: ['well', 'section-tables-container', 'section-tables-active']
+  didInsertElement: ->
+    @$el = $(@get('element'))
+    height = @$el.width() * @get('controller.model.height') / @get('controller.model.width')
+    @$el.css('height', height)
+  dropped: (view, position)->
+    view.positionChange(position, @content)
+  observeSectionDimensions: (->
+    return unless @get('element')
+    @$el = $(@get('element'))
+    height = @$el.width() * @get('controller.model.height') / @get('controller.model.width')
+    @$el.css('height', height)
+  ).observes('controller.model.height', 'controller.model.width')

app/assets/javascripts/supplier/application.js

@@ -17,10 +17,13 @@
 // require bootstrap-popover
 // require bootstrap-typeahead
 //= require bootstrap
-//= require handlebars
-//= require faye
-//= require supplier/base
+//= require js-routes
 //= require qwaiter
+//= require ./qsupplier
+//= require handlebars
+//= require ./app/application
+//= require faye
+//= require ./base
 //= require qtip
 //= require_directory .
 //= require_self

app/assets/javascripts/supplier/qsupplier.js.coffee

@@ -4,29 +4,33 @@ root.Qsupplier=
     faye = new Faye.Client(event_host)
     faye.subscribe "/supplier/"+supplier_id, (e)=>
       if(e.event == 'new_order')
+        Qsupplier.App.Order.create(e.data.order)
+        # old stuff
         body = $('#active-orders-table tbody')
-        order = new Order(e.data)
+        order = new Order(e.data.order)
         if body.length
           body.append @mustache('#active-order-template', order)
         $('.section-table-list-'+order.list_id()).addClass('active_order')
       else if(e.event == 'list_needs_help')
+        if list = Qsupplier.App.List.findCached(e.data.id)
+          list.set('needs_help', true)
+        # old stuff
         $('#list-needs-help-indicator-'+e.data.id).removeClass('hide')
         $('#list-is-helped-button-'+e.data.id).removeClass('hide')
         $('.section-table-list-'+e.data.id).addClass('needs_help')
       else if(e.event == 'list_needs_payment')
+        if list = Qsupplier.App.List.findCached(e.data.id)
+          list.set('needs_payment', true)
+        # old stuff
         $('#list-needs-payment-indicator-'+e.data.id).removeClass('hide')
         $('.section-table-list-'+e.data.id).addClass('needs_payment')
-      else if(e.event == 'list_added') # DEPRICATED now handled by list_update
-        list = new List(e.data)
-        $('#active-lists-table tbody').append @mustache('#active-list-template', list)
-        # Add classes to section table view
-        table = $('#section-table-'+list.table_id())
-        table.addClass('section-table-list-'+list.id())
-        table.addClass('occupied')
-        table.addClass('needs_help') if list.needs_help()
-        table.addClass('needs_payment') if list.needs_payment()
+      else if(e.event == 'list_is_paid')
+        if list = Qsupplier.App.List.findCached(e.data.id)
+          list.set('needs_payment', false)
       else if e.event == 'list_update'
-        list = new List(e.data)
+        Qsupplier.App.List.updateOrCreate(e.data.list)
+        # old stuff
+        list = new List(e.data.list)
         row = $('#list-row-'+list.id())
         content = @mustache('#active-list-template', list)
         if row.length then row.replaceWith(content) else $('#active-lists-table tbody').append(content)
@@ -38,11 +42,16 @@ root.Qsupplier=
           table.addClass('needs_payment') if list.needs_payment()
           table.addClass('active_order') if list.has_active_orders()
       else if e.event == 'list_closed'
+        if list = Qsupplier.App.List.findCached(e.data.id)
+          list.set('table', null)
+          list.set('state', 'closed')
         $('#list-row-'+e.data.id).remove()
         $('.of-list-'+e.data.id).remove()
         table_list_class = 'section-table-list-'+e.data.id
         $('.'+table_list_class).removeClass('occupied needs_help needs_payment active_order').removeClass(table_list_class)
       else if e.event == 'list_helped'
+        if list = Qsupplier.App.List.findCached(e.data.id)
+          list.set('needs_help', false)
         list_id = e.data.id
         $('#list-needs-help-indicator-'+list_id).addClass('hide')
         $('#list-is-helped-button-'+list_id).addClass('hide')

app/assets/javascripts/supplier/translations.js.erb

@@ -15,6 +15,7 @@ var $translations = {
   }
 }
 
+
 $transformation_mappings = {
   downcase: 'toLowerCase',
   upcase: 'toUpperCase'

app/assets/stylesheets/supplier/active_lists.css.sass

@@ -17,7 +17,7 @@
     margin-right: 7px
     &.hide
       display: none
-#active-orders-table
+.active-orders-table
   tbody
     tr
       td

app/assets/stylesheets/supplier/section_tables.css.sass

@@ -1,4 +1,3 @@
-$table-width: 83px
 .section-title
   font-size: 24px
   padding: 4px 0px
@@ -7,9 +6,10 @@ $table-width: 83px
     margin: -26px 6px 4px 6px
   .section-table
     background-color: #ccc
+    //TODO remove width and height for ember control
     height: 48px
+    width: 83px
     background-repeat: no-repeat
-    width: $table-width
     color: black
     a
       color: black

app/assets/stylesheets/supplier/structure.css.sass

@@ -31,6 +31,10 @@ body
       margin: 0
 .location_picker_search
   float: left
+.draggable
+  cursor: move !important
+input.dimension
+  width: 40px
 .location_picker_map
   width: 600px
   height: 500px