From 7d7fca198fbc2036c27684c394f46b078081cbc8 Mon Sep 17 00:00:00 2001
From: linbingquan <695601626@qq.com>
Date: Mon, 13 May 2024 22:51:26 +0800
Subject: [PATCH] Editor: load image as Plane

---
 editor/js/Loader.js | 32 ++++++++++++++++++++++++++++++++
 1 file changed, 32 insertions(+)

diff --git a/editor/js/Loader.js b/editor/js/Loader.js
index d085e7d57009de..90ed36cc443691 100644
--- a/editor/js/Loader.js
+++ b/editor/js/Loader.js
@@ -698,6 +698,15 @@ fileHandlers[ 'zip' ] = function ( editor, manager, reader, file ) {
 
 };
 
+fileHandlers[ 'png' ] = handleImages;
+fileHandlers[ 'jpg' ] = handleImages;
+fileHandlers[ 'jpeg' ] = handleImages;
+fileHandlers[ 'bmp' ] = handleImages;
+fileHandlers[ 'webp' ] = handleImages;
+fileHandlers[ 'gif' ] = handleImages;
+fileHandlers[ 'avif' ] = handleImages;
+fileHandlers[ 'png' ] = handleImages;
+
 Loader.getSupportedFileFormats = function () {
 
 	return Object.keys( fileHandlers ).sort();
@@ -784,6 +793,29 @@ function handleJSON( editor, texturePath, data ) {
 
 }
 
+function handleImages( editor, manager, reader, file ) {
+
+	const image = new Image();
+	image.src = URL.createObjectURL( file );
+
+	image.onload = function () {
+
+		const texture = new THREE.Texture( image );
+		texture.colorSpace = THREE.SRGBColorSpace;
+		texture.needsUpdate = true;
+
+		const size = 4;
+		const geometry = new THREE.PlaneGeometry( size * image.width / image.height, size );
+		const material = new THREE.MeshBasicMaterial( { map: texture } );
+		const mesh = new THREE.Mesh( geometry, material );
+		mesh.name = file.name;
+
+		editor.execute( new AddObjectCommand( editor, mesh ) );
+
+	};
+
+}
+
 async function handleZIP( editor, contents ) {
 
 	const zip = unzipSync( new Uint8Array( contents ) );