diff --git a/src/asset_manager/view/FileUploader.js b/src/asset_manager/view/FileUploader.js index ef5a42338..e58a0c3d3 100644 --- a/src/asset_manager/view/FileUploader.js +++ b/src/asset_manager/view/FileUploader.js @@ -290,7 +290,8 @@ module.exports = Backbone.View.extend( */ /* - // Show local video files + // Show local video files, http://jsfiddle.net/dsbonev/cCCZ2/embedded/result,js,html,css/ + var URL = window.URL || window.webkitURL var file = this.files[0] var type = file.type var videoNode = document.createElement('video'); diff --git a/src/canvas/index.js b/src/canvas/index.js index 8e3398cf4..12d1a10a9 100644 --- a/src/canvas/index.js +++ b/src/canvas/index.js @@ -1,4 +1,5 @@ import { on, off } from 'utils/mixins'; +import Droppable from 'utils/Droppable'; module.exports = () => { var c = {}, @@ -393,6 +394,10 @@ module.exports = () => { return [this.getFrameEl().contentWindow, this.getElement()]; }, + postRender() { + this.droppable = new Droppable(c.em); + }, + /** * Returns wrapper element * @return {HTMLElement} diff --git a/src/dom_components/model/Component.js b/src/dom_components/model/Component.js index 3486c9965..96ba79524 100644 --- a/src/dom_components/model/Component.js +++ b/src/dom_components/model/Component.js @@ -690,6 +690,15 @@ const Component = Backbone.Model.extend(Styleable).extend( return attrs.id || this.ccid || this.cid; }, + /** + * Get the DOM element of the model. This works only of the + * model is alredy rendered + * @return {HTMLElement} + */ + getEl() { + return this.view && this.view.el; + }, + /** * Return script in string format, cleans 'function() {..' from scripts * if it's a function diff --git a/src/utils/Droppable.js b/src/utils/Droppable.js index 29ba28c96..f165cbf68 100644 --- a/src/utils/Droppable.js +++ b/src/utils/Droppable.js @@ -1,13 +1,14 @@ import { on, off } from 'utils/mixins'; import { bindAll } from 'underscore'; -export class Droppable { +export default class Droppable { constructor(em) { this.em = em; - this.el = this.em + const el = em .get('DomComponents') .getWrapper() .getEl(); + this.el = el; this.counter = 0; bindAll( this, @@ -47,32 +48,29 @@ export class Droppable { } handleDragEnter(ev) { + const em = this.em; this.updateCounter(1); if (this.over) return; this.over = 1; console.log('IM IN'); - var utils = this.em.get('Utils'); - var canvas = this.em.get('Canvas'); + const utils = em.get('Utils'); + const canvas = em.get('Canvas'); this.sorter = new utils.Sorter({ + em, + wmargin: 1, + nested: 1, + canvasRelative: 1, + direction: 'a', container: canvas.getBody(), placer: canvas.getPlacerEl(), eventMoving: 'mousemove dragover', containerSel: '*', itemSel: '*', pfx: 'gjs-', - onStart: () => { - this.em.stopDefault(); - }, - onEndMove: () => { - this.em.runDefault(); - }, - document: canvas.getFrameEl().contentDocument, - direction: 'a', - wmargin: 1, - nested: 1, - em, - canvasRelative: 1 + onStart: () => em.stopDefault(), + onEndMove: () => em.runDefault(), + document: canvas.getFrameEl().contentDocument }); const content = this.getContentByData(ev.dataTransfer) || '
'; this.sorter.setDropContent(content); // should not be empty