From 02bbb23319400d3c7a227e59100e7488447b8071 Mon Sep 17 00:00:00 2001 From: Julien Moreau-Mathis Date: Tue, 28 May 2019 13:59:27 +0200 Subject: [PATCH] Now drag'n'drop textures from texture viewer --- src/tools/textures/viewer.ts | 44 ++++++++++++++++++++++++++++++++++++ 1 file changed, 44 insertions(+) diff --git a/src/tools/textures/viewer.ts b/src/tools/textures/viewer.ts index 85fe6948b..25f099eb0 100644 --- a/src/tools/textures/viewer.ts +++ b/src/tools/textures/viewer.ts @@ -371,6 +371,11 @@ export default class TextureViewer extends EditorPlugin { const texture = new Texture('file:' + file.name, this.editor.core.scene); texture.name = texture.url = texture.name.replace('file:', ''); } + + // Drag'n'drop + const dropListener = this.dragEnd(originalTexture, true); + img.addEventListener('dragstart', () => this.editor.core.engine.getRenderingCanvas().addEventListener('drop', dropListener)); + img.addEventListener('dragend', () => this.editor.core.engine.getRenderingCanvas().removeEventListener('drop', dropListener)); } else { const data = await Tools.ReadFileAsBase64(file); @@ -391,6 +396,11 @@ export default class TextureViewer extends EditorPlugin { const texture = new Texture('file:' + file.name, this.editor.core.scene); texture.name = texture.url = texture.name.replace('file:', ''); } + + // Drag'n'drop + const dropListener = this.dragEnd(originalTexture, false); + img.addEventListener('dragstart', () => this.editor.core.engine.getRenderingCanvas().addEventListener('drop', dropListener)); + img.addEventListener('dragend', () => this.editor.core.engine.getRenderingCanvas().removeEventListener('drop', dropListener)); } // Add text @@ -409,6 +419,40 @@ export default class TextureViewer extends EditorPlugin { parent.appendChild(text); } + /** + * Returns an event called when the user drops a texture on the preview canvas + * @param texture: the texture to drop on a mesh/instanced-mesh + */ + protected dragEnd (texture: BaseTexture, isCube: boolean): (ev: DragEvent) => void { + return (ev: DragEvent) => { + const scene = this.editor.core.scene; + const pick = scene.pick(ev.offsetX, ev.offsetY); + + if (!pick.pickedMesh || !pick.pickedMesh.material) + return; + + // Apply + const material = pick.pickedMesh.material; + + if (isCube) { + UndoRedo.Push({ baseObject: material, object: material, property: 'reflectionTexture', from: material['reflectionTexture'], to: texture }); + material['reflectionTexture'] = texture; + } + else { + if (material instanceof PBRMaterial) { + UndoRedo.Push({ baseObject: material, object: material, property: 'albedoTexture', from: material.albedoTexture, to: texture }); + material.albedoTexture = texture; + } + else { + UndoRedo.Push({ baseObject: material, object: material, property: 'diffuseTexture', from: material['diffuseTexture'], to: texture }); + material['diffuseTexture'] = texture; + } + } + + this.editor.core.onSelectObject.notifyObservers(pick.pickedMesh); + }; + } + /** * Convets a cube texture to */