section improvements, area elements mostly

2015-03-03 16:43:57 +01:00
parent 196f998c38
commit c038ca3954
40 changed files with 679 additions and 55 deletions
@@ -52,7 +52,7 @@ class SvgElementClass
    $(target).css('border', '1px solid black')
    @compileSource()
  compileSource: ->
-    source = @text_field.val()
+    return unless source = @text_field.val()
    results = $(@text_field.data('preview'))
    window.compiledJS = ''
    try
@@ -7,9 +7,11 @@
 #= require shared-ember-helpers/all
 #= require ./app
 #= require_directory ./mixins
+#= require_directory ./services
 #= require ./controllers/modals/base_controller
 #= require ion.sound
 #= require_tree .
+
@$assets_path = '/assets/'
@EmberENV = {FEATURES: {'query-params-new': true}}
@$days = ['sunday', 'monday', 'tuesday', 'wednesday', 'thursday', 'friday', 'saturday']
@@ -0,0 +1,34 @@
+App.SectionAreaComponent = Ember.Component.extend DragNDrop.Draggable,
+  classNames: ['section-area-container']
+  attributeBindings: ['style']
+  classNameBindings: ['vertical', 'right_half:right-half', 'section_area.rounded:rounded']
+  pixelWidth: Ember.computed 'section_area.width', 'dpm', -> @get('dpm') * @get('section_area.width')
+  pixelHeight: Ember.computed 'section_area.height', 'dpm', -> @get('dpm') * @get('section_area.height')
+  offsetX: Ember.computed.product 'dpm', 'content.position_x'
+  offsetY: Ember.computed.product 'dpm', 'content.position_y'
+  vertical: Ember.computed 'section_area.width', 'section_area.height', 'targetObject.editmode', ->
+    not @get('targetObject.editmode') and @get('section_area.height') > @get('section_area.width')
+  right_half: Ember.computed 'section_area.position_x', 'section_area.width', 'section_area.sectino.width', ->
+    @get('section_area.position_x') + (@get('section_area.width') / 2) > (@get('section_area.section.width') / 2)
+  style: Ember.computed  'offsetX', 'offsetY', 'pixelWidth', 'pixelHeight', ->
+    App.CssObject.create(
+      width: @get('pixelWidth')
+      height: @get('pixelHeight')
+      left: @get('offsetX')
+      top: @get('offsetY')
+      "line-height": @get('pixelHeight')
+    ).toString()
+  content: Ember.computed.alias 'section_area'
+  draggable: (->  if @get('targetObject.editmode') then 'true' else 'false' ).property('targetObject.editmode')
+  dpm: Ember.computed.alias 'parentView.dpm'
+  positionChange: (position)->
+    dpm = @get('dpm')
+    return if !dpm or parseFloat(dpm) is 0
+    @get('content').setProperties
+      position_x: position.left / dpm
+      position_y: position.top / dpm
+  click: ->
+    return unless @get('targetObject.editmode')
+    @get('targetObject').modal 'section_area',
+      title_path: 'section_area.modal.title'
+      model: @get('section_area')
@@ -19,17 +19,3 @@ App.modals.SectionAddTablesController = App.modals.BaseController.extend
        #@store.pushPayload 'table', result
        @store.pushPayload result
        @send 'close'
-
-        #TODO remove followin code if Ember pushPayload is working
-        #properly with associations
-        section_id = @get('model.id')
-        tables_that_should_be_in_section = @store.all('table').filter((t)->t.get('section.id') == section_id)
-        current_table_ids = @get('model.tables').mapProperty('id')
-        for table in tables_that_should_be_in_section.toArray()
-          @get('model.tables').pushObject(table) unless table.get('id') in current_table_ids
-        #TODO it still does not work for the second client side action,
-        #soo the good old reload for now for the failing case
-        window.location.reload() if result.tables.length != tables_that_should_be_in_section.toArray().length
-        return
-
-
@@ -9,5 +9,4 @@ App.modals.TableEditController = App.modals.BaseController.extend
    saveTable: ->
      #@set 'model.section', @get('selectedSection')
      @set 'model.section', @get('model.section')
-      #debugger
      @send 'save'
@@ -7,6 +7,7 @@ App.SectionController = Ember.ObjectController.extend
      @set('editmode', false)
      @get('model').save()
      @get('model.section_elements').forEach (section_element) -> section_element.save()
+      @get('model.section_areas').forEach (section_area) -> section_area.save()
    rollbackEditable: ->
      @get('model').rollback()
      @get('model.section_elements').forEach (section_element) ->
@@ -14,6 +15,11 @@ App.SectionController = Ember.ObjectController.extend
          section_element.rollback()
        else
          section_element.deleteRecord()
+      @get('model.section_areas').forEach (section_area) ->
+        if section_area.get('id')
+          section_area.rollback()
+        else
+          section_area.deleteRecord()
      @set('editmode', false)
    addSection: -> @modal 'add_section', model: @get('model')
    addTables: -> @modal 'section_add_tables', model: @get('model')
@@ -28,7 +34,14 @@ App.SectionController = Ember.ObjectController.extend
      @modal 'add_section_element',
        model: @get('model')
        ok: => @send 'makeEditable'
-    removeSectionElement: (section_element)-> section_element.destroy()
+    addSectionArea: ->
+      section_area = @store.createRecord('section-area')
+      section_area.set 'section', @get('model')
+      @modal 'section_area',
+        title_path: 'section_area.add_button'
+        model: section_area
+        ok: => @send 'makeEditable'
+    removeSectionElement: (section_element)-> section_element.destroyRecord()
  textures: ['wood1', 'wood2']

  sections: (-> @get('controllers.sections.model')).property('controllers.sections.model')
@@ -2,7 +2,6 @@ App.SectionsIndexController = Ember.ArrayController.extend
  needs: ['application', 'sections', 'index']
  sections: (-> @get('controllers.sections.model')).property('controllers.sections.model')
  sectionQrCodesUrl: ((a,b,c)->
-    debugger
    Routes.qr_codes_suppliers_tables_path()
  ).property()
  newPath: Routes.new_suppliers_section_path()
@@ -1,5 +1,4 @@
 Ember.Handlebars.helper 'select-hour', (params..., options)->
-  debugger
  result = "<select class=\"select-hour\">"
  result += "<option>#{hour}</option>" for hour in [0..24]
  result += "</select>"
@@ -11,8 +11,8 @@ DragNDrop.Draggable = Ember.Mixin.create
  draggable: 'true'
  dragStart: (ev)->
    @set 'content.isDragging', true
-    @set 'controller.isDragging', true
-    @set 'controller.controllers.application.isDragging', true
+    @set 'targetObject.isDragging', true
+    @set 'targetObject.controllers.application.isDragging', true
    localStorage.setItem('draggingView', @get('elementId'))
    dataTransfer = ev.originalEvent.dataTransfer
    #dataTransfer.setData 'Text', @get('elementId')
@@ -25,8 +25,8 @@ DragNDrop.Draggable = Ember.Mixin.create
      pageY: ev.originalEvent.pageY
  dragEnd: (e)->
    @set 'content.isDragging', false
-    @set 'controller.isDragging', false
-    @set 'controller.controllers.application.isDragging', false
+    @set 'targetObject.isDragging', false
+    @set 'targetObject.controllers.application.isDragging', false
    localStorage.removeItem 'draggingView' if localStorage.getItem 'draggingView'

 DragNDrop.Droppable = Ember.Mixin.create
@@ -0,0 +1,11 @@
+attr = DS.attr
+App.SectionArea = DS.Model.extend Ember.Validations.Mixin,
+  title: attr 'string'
+  width: attr 'number', defaultValue: 2
+  height: attr 'number', defaultValue: 2
+  position_x: attr 'number', defaultValue: 0
+  position_y: attr 'number', defaultValue: 0
+  rounded: attr 'boolean', defaultValue: false
+  section: DS.belongsTo('section')
+  validations:
+    title: {presence: true}
@@ -5,3 +5,4 @@ App.Section = DS.Model.extend
  height: attr 'number'
  tables: DS.hasMany('table')
  section_elements: DS.hasMany('section-element')
+  section_areas: DS.hasMany('section-area')
@@ -45,7 +45,6 @@ DS.Model.reopenClass
      #relation = relation[0]
      #if relation.kind == 'belongsTo' and id = attributes["#{relation.name}_id"]
        #attributes[relation.name] = id unless attributes[relation.name]
-        #debugger if options.debug
        #belongs_tos[relation.name] = id

    nested_attributes = {}
@@ -53,8 +52,6 @@ DS.Model.reopenClass
    # pushPayload makes association back references, just push not yet 2014-06-27
    new_record = @store.pushPayload(nested_attributes)

-    #debugger if options.debug
-
    #promises = []
    #association_names = []
    #Ember.get(@, 'relationships').forEach (model, relation)=>
@@ -64,7 +61,6 @@ DS.Model.reopenClass
        #promises.push @store.find(relation.name, id)
        #association_names.push relation.name
        #Ember.RSVP.all(promises).then (records)->
-          #debugger
          #for record, i in records
            ##console.log "Setting relation #{relation.name} to #{record.get('id')}"
            #new_record.set association_names[i], record
@@ -1,6 +1,7 @@
 App.SectionsRoute = Ember.Route.extend
  beforeModel: ->
    @store.find 'section-element'
+    @store.find 'section-area'
  model: ->  @store.all 'section'

  # setupController: (controller, collection) ->
@@ -0,0 +1,12 @@
+Ember.computed.product = ->
+  args = []
+  for arg in arguments
+    args.push arg
+  callback = ->
+    product = 1
+    for key in args
+      continue unless typeof(key) is 'string'
+      product *= @get(key) || 0
+    product
+  args.push callback
+  Ember.computed.apply(@, args)
@@ -0,0 +1,10 @@
+App.CssObject = Ember.Object.extend
+  pixel_fields: ['width', 'height', 'left', 'top', 'line-height']
+  isNumeric: /^[-+]?(\d+|\d+\.\d+)$/
+  toString: ->
+    ret = ""
+    for k, v of JSON.parse(JSON.stringify(@))
+      if @pixel_fields.indexOf(k) > -1
+        v = "#{v}px" if @isNumeric.test(v)
+      ret += "#{k}:#{v};"
+    ret
@@ -0,0 +1 @@
+.title= section_area.title
@@ -0,0 +1,21 @@
+.form-row.title
+  .form-label=t 'attributes.section_area.title'
+  .form-field
+    = input valueBinding="model.title"
+  .form-info
+    span.dimension m
+    = errors model.errors.title
+.form-row.width
+  .form-label=t 'attributes.section_area.width'
+  .form-field= input type="number" valueBinding="model.width"
+.form-row.height
+  .form-label=t 'attributes.section_area.height'
+  .form-field= input type="number" valueBinding="model.height"
+.form-row.rounded
+  .form-label= t 'attributes.section_area.rounded'
+  .form-field= view "boolean-switch" value=model.rounded
+hr
+button.modal-close{action "close"}=t 'section_area.modal.close_button'
+button.modal-confirm.right{action "save"} disabled=model.isInvalid
+  =t 'section_area.modal.save_button'
+button.modal-destroy.right{action "destroy"}= t 'section_area.modal.destroy_button'
@@ -19,8 +19,9 @@
        ul
          li: a{action "addTables"}: span.section-add-tables-icon=t 'section.add_tables.button_label'
          li: a{action "arrangeTables"}: span.section-arrange-tables-icon=t 'section.arrange_tables.modal.title'
-          li: a href="{{route 'qr_codes_suppliers_tables_path' section_id=id}}" target="_blank": span.qr-icon=t 'table.print_qr_codes'
          li: a{action "addSectionElement"}: span.section-add-section-element-icon= t 'section_element.add_button'
+          li: a{action "addSectionArea"}: span.section-add-section-area-icon= t 'section_area.add_button'
+          li: a href="{{route 'qr_codes_suppliers_tables_path' section_id=id}}" target="_blank": span.qr-icon=t 'table.print_qr_codes'
          li: a.section-destroy{action "destroySection"}: span.section-remove-icon=t 'helpers.links.destroy'
      a.section-edit-mode-button{ action "makeEditable" }: span
 = view "section-tables" contentBinding="tables"
@@ -1,8 +1,9 @@
 .table-number= table.number
-.status-icons
-  span.needs_payment
-  span.needs_help
-  span.active_order
+unless editmode
+  .status-icons
+    span.needs_payment
+    span.needs_help
+    span.active_order
 if table.active_list
  div.table-actions
    .title= table.number
@@ -19,8 +20,3 @@ if table.active_list
      a{action "editTable" table}: span.fa.fa-lg.fa-wrench
    each user in table.active_list.users
      = user.avatar_tag
-if editmodedisabled
-  .table-settings
-    select
-      option Round
-      option rectangular
@@ -1,4 +1,6 @@
-each element in section_elements
-  view "section-element" content=element
+each section_element in section_elements
+  view "section-element" content=section_element
+each section_area in section_areas
+  = section-area section_area=section_area
 each table in tables
  = view "section-table" content=table
@@ -17,6 +17,7 @@ App.SectionElementView = Ember.View.extend DragNDrop.Draggable,
    return 0 unless dpm = @get('dpm')
    dpm * (@get('content.position_y') || 0)
  ).property('dpm', 'content.position_y', 'content.rotation')
+  targetObject: Ember.computed.alias 'controller'
  #myHeight: (-> (@get('dpm') || 0 ) * @get('content.height')).property('dpm', 'content.height')
  #myWidth: (-> (@get('dpm') || 0 ) * @get('content.width')).property('dpm', 'content.width')

@@ -29,6 +29,7 @@ App.SectionTableView = Ember.View.extend DragNDrop.Draggable,
    "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')
+  targetObject: Ember.computed.alias 'controller'
  placeInSection: ->
    @$el.css 'left', @offsetX()
    @$el.css 'top', @offsetY()
@@ -1,21 +1,15 @@
 #App.SectionView = Ember.View.extend {}
  #initFoundation: (->
-    #debugger
    #@$().foundation()
  #).on('didInsertElement')
  #didInsertElement: ->
    #@$().foundation()
-    #debugger
    #true
 #$(document).on 'load', '[data-dropdown]', (a,b,c)->
-  #debugger
  #true
 #$(document).on 'change', '[data-dropdown]', (a,b,c)->
-  #debugger
  #true
 #$(document).on 'ready', '[data-dropdown]', (a,b,c)->
-  #debugger
  #true
 #$(document).on 'click', '[data-dropdown]', (a,b,c)->
-  #debugger
  #true