Drag and drop fixes

2015-08-04 20:01:31 +02:00
parent d4a1052761
commit fcc11a1b87
10 changed files with 31 additions and 27 deletions
@@ -19,8 +19,8 @@ App.SectionAreaComponent = Ember.Component.extend DragNDrop.Draggable,
      "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'
+  draggable: (->  if @get('targetObject.editmode') then true else false ).property('targetObject.editmode')
+  dpm: Ember.computed.alias 'tablesContext.dpm'
  positionChange: (position)->
    dpm = @get('dpm')
    return if !dpm or parseFloat(dpm) is 0
@@ -1,5 +1,6 @@
 Globals = Ember.Object.extend
  current_employee: null
+  isDragging: false
 App.initializer
  name: 'injectCurrent'
  initialize: (container, app)->
@@ -7,4 +8,6 @@ App.initializer
    app.register 'global:variables', Globals, singleton: true

    app.inject 'controller', 'globals', 'global:variables'
+    app.inject 'component', 'globals', 'global:variables'
+    app.inject 'view', 'globals', 'global:variables'
    app.inject 'route', 'globals', 'global:variables'
@@ -11,8 +11,7 @@ DragNDrop.Draggable = Ember.Mixin.create
  draggable: 'true'
  dragStart: (ev)->
    @set 'content.isDragging', true
-    @set 'targetObject.isDragging', true
-    @set 'targetObject.controllers.application.isDragging', true
+    @set 'globals.isDragging', true
    localStorage.setItem('draggingView', @get('elementId'))
    dataTransfer = ev.originalEvent.dataTransfer
    #dataTransfer.setData 'Text', @get('elementId')
@@ -25,8 +24,7 @@ DragNDrop.Draggable = Ember.Mixin.create
      pageY: ev.originalEvent.pageY
  dragEnd: (e)->
    @set 'content.isDragging', false
-    @set 'targetObject.isDragging', false
-    @set 'targetObject.controllers.application.isDragging', false
+    @set 'globals.isDragging', false
    localStorage.removeItem 'draggingView' if localStorage.getItem 'draggingView'
  touchStart: (ev)->
    ev.preventDefault()
@@ -95,8 +93,10 @@ DragNDrop.Droppable = Ember.Mixin.create
  drop: (ev)->
    # e.preventDefault()
    data = JSON.parse(ev.originalEvent.dataTransfer.getData('application/json'))
-    view = Ember.View.views[data.id]
-    return unless view
+    #debugger
+    viewRegistry = App.__container__.lookup("-view-registry:main") || Ember.View.views
+    #view = Ember.View.views[data.id]
+    return unless viewRegistry and view = viewRegistry[data.id]
    view.dragEnd(ev) if view.dragEnd # not triggered on its own on drop

    # Calculate the element's center drop position relative to container
@@ -8,10 +8,10 @@
  a.go-to-orders-list{ action "showDashboardOrders" model }: span
  can manage sections
    if editmode
-      = input type="text" value=title class="section-edit-title-field"
-      = number-field numericValue=width class="dimension section-edit-width-field"
+      = input type="text" value=model.title class="section-edit-title-field"
+      = number-field numericValue=model.width class="dimension section-edit-width-field"
      span.fa.fa-lg.fa-times
-      = number-field numericValue=height class="dimension section-edit-height-field"
+      = number-field numericValue=model.height class="dimension section-edit-height-field"
      a.section-rollback-button{ action "rollbackEditable" }: span
      a.section-normal-mode-button{ action "finishEditable" }: span
    else
@@ -1,6 +1,6 @@
-each section_element in view.section_elements
-  view "section-element" content=section_element
-each section_area in view.section_areas
-  = section-area section_area=section_area
-each table in view.tables
-  = view "section-table" content=table
+each section_element in model.section_elements
+  view "section-element" content=section_element tablesContext=view
+each section_area in model.section_areas
+  = section-area section_area=section_area tablesContext=view
+each table in model.tables
+  = view "section-table" content=table tablesContext=view
@@ -9,7 +9,7 @@ App.SectionElementView = Ember.View.extend DragNDrop.Draggable,
  uniqueClass: (->
    "section-element-#{@get('content.id')}"
  ).property('content.id')
-  draggable: (->  if @get('controller.editmode') then 'true' else 'false' ).property('controller.editmode')
+  draggable: Ember.computed.alias 'context.editmode'
  offsetX: (->
    (@get('dpm') || 0) * (@get('content.position_x') || 0)
  ).property('dpm', 'content.position_x')
@@ -25,7 +25,7 @@ App.SectionElementView = Ember.View.extend DragNDrop.Draggable,
  box_size: (-> (@get('dpm') || 0 ) * @get('content.box_size')).property('dpm', 'content.box_size')
  style: Ember.computed 'offsetX', 'offsetY', 'box_size', 'content.rotation', ->
    "position:absolute;width:#{@get('box_size')}px;height:#{@get('box_size')}px;left:#{@get('offsetX')}px;top:#{@get('offsetY')}px"
-  dpm: Ember.computed.alias 'parentView.dpm'
+  dpm: Ember.computed.alias 'tablesContext.dpm'
  positionChange: (position)->
    dpm = @get('dpm')
    return if !dpm or parseFloat(dpm) is 0
@@ -14,6 +14,7 @@ App.SectionTableView = Ember.View.extend DragNDrop.Draggable,
    "section-table-#{@get('content.id')}"
  ).property('content.id')
  offsetX: (->
+    debugger unless @get('dpm')
    (@get('dpm') || 0) * (@get('content.position_x') || 0)
  ).property('dpm', 'content.position_x')
  offsetY: (->
@@ -28,7 +29,7 @@ App.SectionTableView = Ember.View.extend DragNDrop.Draggable,
  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')
+  draggable: Ember.computed.alias 'context.editmode'
  targetObject: Ember.computed.alias 'controller'
  placeInSection: ->
    @$el.css 'left', @offsetX()
@@ -37,11 +38,11 @@ App.SectionTableView = Ember.View.extend DragNDrop.Draggable,
    dpm = @get('dpm')
    return if !dpm or parseFloat(dpm) is 0

-    @content.setProperties
+    @get('content').setProperties
      position_x: position.left / dpm
      position_y: position.top / dpm
-    @content.save()
-  dpm: Ember.computed.alias 'parentView.dpm'
+    @get('content').save()
+  dpm: Ember.computed.alias 'tablesContext.dpm'
  didInsertElement: ->
    @$el = @$()
    @$('.table-actions').hide()
@@ -4,7 +4,7 @@ App.SectionTablesView = Ember.View.extend DragNDrop.Droppable,
  templateName: 'section/tables'
  dpm: 1
  dropped: (view, position)->
-    view.positionChange(position, @content)
+    view.positionChange(position, @get('content'))
  handleDimensionChange: ->
    return unless @get('element')
    @$el = $(@get('element'))
@@ -23,7 +23,6 @@ App.SectionTablesView = Ember.View.extend DragNDrop.Droppable,
  observeSectionDimensions: (->
    @handleDimensionChange()
  ).observes('controller.model.height', 'controller.model.width')
-  tables: (->@get('content')).property('content.@each')
  didInsertElement: ->
    # the first observable event is triggered without the container having its dimensions
    @get('controller.model').notifyPropertyChange('width') #.notifyPropertyChange('height')
@@ -1,7 +1,7 @@
 App.SectionTabHeaderView = Ember.View.extend DragNDrop.Droppable,
  templateName: 'section_tab_header'
  classNames: ['section-tab-header']
-  classNameBindings: ['section_header_class', 'controller.controllers.application.isDragging:table-dragging', 'section_active']
+  classNameBindings: ['section_header_class', 'controller.globals.isDragging:table-dragging', 'section_active']
  click: (e)->
    @set 'controller.controllers.application.active_section', @get('context')
    @get('controller').transitionToRoute 'section', @get('context.id')