Dynamic tables

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

@@ -18,14 +18,6 @@ App.SectionController = Ember.ObjectController.extend
     addSection: -> @modal 'add_section', model: @get('model')
     addTables: -> @modal 'section_add_tables', model: @get('model')
     arrangeTables: -> @modal 'section_arrange_tables', model: @get('model')
-    editTable: (table)->
-      @modal 'edit_table',
-        model: table
-        title_path: 'table.edit.modal.title'
-        ok: ->
-          table.save()
-        close: ->
-          table.rollback()
     destroySection: ->
       @modal 'confirm',
         title_path: 'helpers.links.are_you_sure'

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

@@ -7,10 +7,6 @@ App.TablesIndexController = Ember.ArrayController.extend
       @modal 'table_edit',
         model: table
         close: -> table.deleteRecord()
-    editTable: (table)->
-      @modal 'table_edit',
-        model: table
-        close: -> table.rollback()
     destroyTable: (table)->
       @modal 'confirm',
         title: t('table.destroy.modal.title', number: table.get('number'))

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

@@ -1,8 +1,8 @@
 attr = DS.attr
 App.Table = DS.Model.extend
   number: attr 'number', defaultValue: 0
-  width: attr 'number', defaultValue: 1
-  height: attr 'number', defaultValue: 1
+  width: attr 'number', defaultValue: 0.8
+  height: attr 'number', defaultValue: 0.8
   position_x: attr 'number'
   position_y: attr 'number'
   # occupied: attr 'boolean'

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

@@ -102,6 +102,10 @@ App.ApplicationRoute = Ember.Route.extend
       new_rotation = 90 + record.get('rotation')
       new_rotation -= 360 if new_rotation >= 360
       record.set 'rotation', new_rotation
+    editTable: (table)->
+      @send 'openModal', 'table_edit',
+        model: table
+        close: -> table.rollback()
   events:
     list_needs_help: (data) ->
       if list = @store.getById('list', data.id)

app/assets/javascripts/supplier/app/templates/modals/table_edit.emblem

@@ -5,6 +5,12 @@ p=t 'table.edit.modal.body_header'
 .form-row.section
   .form-label=t 'models.section'
   .form-field= view "select" content=sections selectionBinding="model.section" optionLabelPath="content.title" optionValuePath="content.id"
+.form-row.width
+  .form-label=t 'attributes.table.width'
+  .form-field= input type="number" valueBinding="model.width"
+.form-row.height
+  .form-label=t 'attributes.table.height'
+  .form-field= input type="number" valueBinding="model.height"
 hr
 button.modal-close{action "close"}=t 'section.add_tables.modal.close_button'
 button.modal-confirm.right{action "save"}=t 'section.add_tables.modal.add_button'

app/assets/javascripts/supplier/app/views/section/table_view.js.coffee

@@ -20,9 +20,13 @@ App.SectionTableView = Ember.View.extend DragNDrop.Draggable,
     (@get('dpm') || 0) * (@get('content.position_y') || 0)
   ).property('dpm', 'content.position_y')
 
-  style: (->
-    "position:absolute;width:83px;height:48px;left:#{@get('offsetX')}px;top:#{@get('offsetY')}px"
-  ).property('offsetX', 'offsetY')
+  myHeight: (-> Math.max((@get('dpm') || 0 ) * @get('content.height'), 60)).property('dpm', 'content.height')
+  myWidth: (-> Math.max((@get('dpm') || 0 ) * @get('content.width'), 60)).property('dpm', 'content.width')
+  #style: (->
+    #"position:absolute;width:83px;height:48px;left:#{@get('offsetX')}px;top:#{@get('offsetY')}px"
+  #).property('offsetX', 'offsetY')
+  style: Ember.computed 'offsetX', 'offsetY', 'myWidth', 'myHeight', ->
+    "position:absolute;width:#{@get('myWidth')}px;height:#{@get('myHeight')}px;left:#{@get('offsetX')}px;top:#{@get('offsetY')}px"
 
   draggable: (->  if @get('controller.editmode') then 'true' else 'false' ).property('controller.editmode')
   placeInSection: ->
@@ -42,4 +46,7 @@ App.SectionTableView = Ember.View.extend DragNDrop.Draggable,
     @$('.table-actions').hide()
     @$el.on 'click', =>
       # duplication of .table-actions because variable gets unshadowed
-      @$('.table-actions').toggle() if @$el.hasClass('occupied') and not @get('controller.editmode')
+      if @get('controller.editmode')
+        @get('controller').send 'editTable', @get('content')
+      else
+        @$('.table-actions').toggle() if @$el.hasClass('occupied')