From 77eb19a44a50a0e9866fba006ad1a735a9f7df99 Mon Sep 17 00:00:00 2001 From: Markus Grigull Date: Thu, 12 Jan 2017 16:24:46 +0100 Subject: [PATCH] Drop widgets at cursor position. Add widget delete Add widget delete button in modal widget dialogs Add widget edit hint in edit layout --- app/components/draggable-dropzone.js | 9 ++++++++- app/components/draggable-item.js | 3 +++ app/components/widget-label.js | 9 ++++++++- app/components/widget-table.js | 7 +++++++ app/components/widget-value.js | 7 +++++++ app/controllers/visualization/edit.js | 8 ++++---- app/templates/components/widget-label.hbs | 1 + app/templates/components/widget-table.hbs | 1 + app/templates/components/widget-value.hbs | 1 + app/templates/dialog/widget/value.hbs | 5 ----- app/templates/visualization/edit.hbs | 4 ++++ 11 files changed, 44 insertions(+), 11 deletions(-) delete mode 100644 app/templates/dialog/widget/value.hbs diff --git a/app/components/draggable-dropzone.js b/app/components/draggable-dropzone.js index d0497dc..6fd48a7 100644 --- a/app/components/draggable-dropzone.js +++ b/app/components/draggable-dropzone.js @@ -29,7 +29,14 @@ export default Ember.Component.extend({ drop(event) { var data = event.dataTransfer.getData('text/data'); - this.sendAction('dropped', data); + var position = { + x: event.originalEvent.pageX - $(event.target).offset().left - parseFloat(event.dataTransfer.getData('offset/x')), + y: event.originalEvent.pageY - $(event.target).offset().top - parseFloat(event.dataTransfer.getData('offset/y')) + } + + console.log(position); + + this.sendAction('dropped', data, position); set(this, 'dragClass', 'deactivated'); } diff --git a/app/components/draggable-item.js b/app/components/draggable-item.js index 087c843..71d5dee 100644 --- a/app/components/draggable-item.js +++ b/app/components/draggable-item.js @@ -17,6 +17,9 @@ export default Ember.Component.extend({ draggable: 'true', dragStart(event) { + event.dataTransfer.setData('offset/x', event.originalEvent.pageX - $(event.target).offset().left); + event.dataTransfer.setData('offset/y', event.originalEvent.pageY - $(event.target).offset().top); + return event.dataTransfer.setData('text/data', get(this, 'content')); } }); diff --git a/app/components/widget-label.js b/app/components/widget-label.js index c94115c..732430e 100644 --- a/app/components/widget-label.js +++ b/app/components/widget-label.js @@ -47,6 +47,13 @@ export default WidgetAbstract.extend({ cancelModal() { this.set('isShowingModal', false); - } + }, + + deleteModal() { + // delete widget + this.get('widget').destroyRecord(); + + this.set('isShowingModal', false); + }, } }); diff --git a/app/components/widget-table.js b/app/components/widget-table.js index e3117ef..2bd1f77 100644 --- a/app/components/widget-table.js +++ b/app/components/widget-table.js @@ -150,6 +150,13 @@ export default WidgetAbstract.extend({ this.set('isShowingModal', false); }, + deleteModal() { + // delete widget + this.get('widget').destroyRecord(); + + this.set('isShowingModal', false); + }, + selectSimulationModel(simulationModelName) { // save simulation model this.set('simulationModelName', simulationModelName); diff --git a/app/components/widget-value.js b/app/components/widget-value.js index 1381705..485e0af 100644 --- a/app/components/widget-value.js +++ b/app/components/widget-value.js @@ -123,6 +123,13 @@ export default WidgetAbstract.extend({ this.set('isShowingModal', false); }, + deleteModal() { + // delete widget + this.get('widget').destroyRecord(); + + this.set('isShowingModal', false); + }, + selectSimulationModel(simulationModelName) { // save simulation model this.set('simulationModelName', simulationModelName); diff --git a/app/controllers/visualization/edit.js b/app/controllers/visualization/edit.js index c79f261..930629d 100644 --- a/app/controllers/visualization/edit.js +++ b/app/controllers/visualization/edit.js @@ -22,7 +22,7 @@ export default Ember.Controller.extend(FetchLiveDataMixin, { signal: null, actions: { - addWidget(name) { + addWidget(name, position) { // get first simulator id let defaultSimulatorid = 0; @@ -36,11 +36,11 @@ export default Ember.Controller.extend(FetchLiveDataMixin, { let widget = null; if (name === 'label') { - widget = this.store.createRecord('widget', { name: 'Label', type: 'widget-label', width: 100, height: 20 }); + widget = this.store.createRecord('widget', { name: 'Label', type: 'widget-label', width: 100, height: 20, x: position.x, y: position.y }); } else if (name === 'table') { - widget = this.store.createRecord('widget', { name: 'Table 1', type: 'widget-table', width: 500, height: 200, widgetData: { simulator: defaultSimulatorid } }); + widget = this.store.createRecord('widget', { name: 'Table 1', type: 'widget-table', width: 500, height: 200, x: position.x, y: position.y, widgetData: { simulator: defaultSimulatorid } }); } else if (name === 'value') { - widget = this.store.createRecord('widget', { name: 'Value 1', type: 'widget-value', width: 250, height: 20, widgetData: { signal: 0, simulator: defaultSimulatorid } }); + widget = this.store.createRecord('widget', { name: 'Value 1', type: 'widget-value', width: 250, height: 20, x: position.x, y: position.y, widgetData: { signal: 0, simulator: defaultSimulatorid } }); } else { // DEBUG console.log('Add widget ' + name); diff --git a/app/templates/components/widget-label.hbs b/app/templates/components/widget-label.hbs index fa0b636..1c0aefe 100644 --- a/app/templates/components/widget-label.hbs +++ b/app/templates/components/widget-label.hbs @@ -18,6 +18,7 @@ + diff --git a/app/templates/components/widget-table.hbs b/app/templates/components/widget-table.hbs index 082c40a..bb84841 100644 --- a/app/templates/components/widget-table.hbs +++ b/app/templates/components/widget-table.hbs @@ -47,6 +47,7 @@ + diff --git a/app/templates/components/widget-value.hbs b/app/templates/components/widget-value.hbs index c38f79a..6bfb445 100644 --- a/app/templates/components/widget-value.hbs +++ b/app/templates/components/widget-value.hbs @@ -42,6 +42,7 @@ + diff --git a/app/templates/dialog/widget/value.hbs b/app/templates/dialog/widget/value.hbs deleted file mode 100644 index 8f11e5f..0000000 --- a/app/templates/dialog/widget/value.hbs +++ /dev/null @@ -1,5 +0,0 @@ -

Test

- - - - diff --git a/app/templates/visualization/edit.hbs b/app/templates/visualization/edit.hbs index ebc1358..9d68285 100644 --- a/app/templates/visualization/edit.hbs +++ b/app/templates/visualization/edit.hbs @@ -13,6 +13,10 @@ {{#draggable-item content='label'}} Label {{/draggable-item}} + +

+ Hint: Double click widgets to edit or delete them. +

{{#draggable-dropzone dropped='addWidget'}}