@combos-fun/plugin-renderer-3d-img 0.0.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/plugin-renderer-3d-img.cjs.js +190 -0
- package/dist/plugin-renderer-3d-img.cjs.js.map +1 -0
- package/dist/plugin-renderer-3d-img.cjs.prod.js +1 -0
- package/dist/plugin-renderer-3d-img.d.ts +49 -0
- package/dist/plugin-renderer-3d-img.esm.js +187 -0
- package/dist/plugin-renderer-3d-img.esm.js.map +1 -0
- package/index.js +7 -0
- package/package.json +23 -0
|
@@ -0,0 +1,190 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var tslib = require('tslib');
|
|
4
|
+
var engine = require('@combos-fun/engine');
|
|
5
|
+
var inspectorDecorator = require('@combos-fun/inspector-decorator');
|
|
6
|
+
var pluginRenderer3d = require('@combos-fun/plugin-renderer-3d');
|
|
7
|
+
var three = require('three');
|
|
8
|
+
|
|
9
|
+
class Img3D extends engine.Component {
|
|
10
|
+
constructor() {
|
|
11
|
+
super(...arguments);
|
|
12
|
+
this.resource = '';
|
|
13
|
+
this.positionX = 0;
|
|
14
|
+
this.positionY = 0;
|
|
15
|
+
this.positionZ = 0;
|
|
16
|
+
this.rotationX = 0;
|
|
17
|
+
this.rotationY = 0;
|
|
18
|
+
this.rotationZ = 0;
|
|
19
|
+
this.scaleX = 1;
|
|
20
|
+
this.scaleY = 1;
|
|
21
|
+
this.opacity = 1;
|
|
22
|
+
this.doubleSide = false;
|
|
23
|
+
}
|
|
24
|
+
static { this.componentName = 'Img3D'; }
|
|
25
|
+
init(obj) {
|
|
26
|
+
if (obj)
|
|
27
|
+
Object.assign(this, obj);
|
|
28
|
+
}
|
|
29
|
+
}
|
|
30
|
+
tslib.__decorate([
|
|
31
|
+
inspectorDecorator.type('string')
|
|
32
|
+
], Img3D.prototype, "resource", void 0);
|
|
33
|
+
tslib.__decorate([
|
|
34
|
+
inspectorDecorator.type('number'),
|
|
35
|
+
inspectorDecorator.step(0.1)
|
|
36
|
+
], Img3D.prototype, "positionX", void 0);
|
|
37
|
+
tslib.__decorate([
|
|
38
|
+
inspectorDecorator.type('number'),
|
|
39
|
+
inspectorDecorator.step(0.1)
|
|
40
|
+
], Img3D.prototype, "positionY", void 0);
|
|
41
|
+
tslib.__decorate([
|
|
42
|
+
inspectorDecorator.type('number'),
|
|
43
|
+
inspectorDecorator.step(0.1)
|
|
44
|
+
], Img3D.prototype, "positionZ", void 0);
|
|
45
|
+
tslib.__decorate([
|
|
46
|
+
inspectorDecorator.type('number'),
|
|
47
|
+
inspectorDecorator.step(0.01)
|
|
48
|
+
], Img3D.prototype, "rotationX", void 0);
|
|
49
|
+
tslib.__decorate([
|
|
50
|
+
inspectorDecorator.type('number'),
|
|
51
|
+
inspectorDecorator.step(0.01)
|
|
52
|
+
], Img3D.prototype, "rotationY", void 0);
|
|
53
|
+
tslib.__decorate([
|
|
54
|
+
inspectorDecorator.type('number'),
|
|
55
|
+
inspectorDecorator.step(0.01)
|
|
56
|
+
], Img3D.prototype, "rotationZ", void 0);
|
|
57
|
+
tslib.__decorate([
|
|
58
|
+
inspectorDecorator.type('number'),
|
|
59
|
+
inspectorDecorator.step(0.1)
|
|
60
|
+
], Img3D.prototype, "scaleX", void 0);
|
|
61
|
+
tslib.__decorate([
|
|
62
|
+
inspectorDecorator.type('number'),
|
|
63
|
+
inspectorDecorator.step(0.1)
|
|
64
|
+
], Img3D.prototype, "scaleY", void 0);
|
|
65
|
+
tslib.__decorate([
|
|
66
|
+
inspectorDecorator.type('number'),
|
|
67
|
+
inspectorDecorator.step(0.01)
|
|
68
|
+
], Img3D.prototype, "opacity", void 0);
|
|
69
|
+
tslib.__decorate([
|
|
70
|
+
inspectorDecorator.type('boolean')
|
|
71
|
+
], Img3D.prototype, "doubleSide", void 0);
|
|
72
|
+
|
|
73
|
+
let Img3DSystem = class Img3DSystem extends pluginRenderer3d.Renderer3D {
|
|
74
|
+
constructor() {
|
|
75
|
+
super(...arguments);
|
|
76
|
+
this.name = 'Img3DSystem';
|
|
77
|
+
this.imgs = new Map();
|
|
78
|
+
this.textureLoader = new three.TextureLoader();
|
|
79
|
+
}
|
|
80
|
+
static { this.systemName = 'Img3DSystem'; }
|
|
81
|
+
init() {
|
|
82
|
+
const renderer3DSystem = this.game.getSystem(pluginRenderer3d.Renderer3DSystem);
|
|
83
|
+
renderer3DSystem.rendererManager.register(this);
|
|
84
|
+
}
|
|
85
|
+
componentChanged(changed) {
|
|
86
|
+
if (changed.componentName !== 'Img3D')
|
|
87
|
+
return;
|
|
88
|
+
if (changed.type === engine.OBSERVER_TYPE.ADD) {
|
|
89
|
+
this.handleAdd(changed.gameObject, changed.component);
|
|
90
|
+
}
|
|
91
|
+
else if (changed.type === engine.OBSERVER_TYPE.REMOVE) {
|
|
92
|
+
this.handleRemove(changed.gameObject.id);
|
|
93
|
+
}
|
|
94
|
+
else {
|
|
95
|
+
this.handleChange(changed);
|
|
96
|
+
}
|
|
97
|
+
}
|
|
98
|
+
rendererUpdate(gameObject) {
|
|
99
|
+
const component = gameObject.getComponent(Img3D);
|
|
100
|
+
if (!component)
|
|
101
|
+
return;
|
|
102
|
+
const entry = this.imgs.get(gameObject.id);
|
|
103
|
+
if (!entry)
|
|
104
|
+
return;
|
|
105
|
+
entry.mesh.position.set(component.positionX, component.positionY, component.positionZ);
|
|
106
|
+
entry.mesh.rotation.set(component.rotationX, component.rotationY, component.rotationZ);
|
|
107
|
+
entry.mesh.scale.set(component.scaleX, component.scaleY, 1);
|
|
108
|
+
}
|
|
109
|
+
async handleAdd(gameObject, component) {
|
|
110
|
+
if (!component.resource)
|
|
111
|
+
return;
|
|
112
|
+
const asyncId = this.increaseAsyncId(gameObject.id);
|
|
113
|
+
const texture = await this.loadTexture(component.resource);
|
|
114
|
+
if (!this.validateAsyncId(gameObject.id, asyncId)) {
|
|
115
|
+
texture.dispose();
|
|
116
|
+
return;
|
|
117
|
+
}
|
|
118
|
+
const aspectRatio = texture.image.width / texture.image.height;
|
|
119
|
+
const geometry = new three.PlaneGeometry(aspectRatio, 1);
|
|
120
|
+
const material = new three.MeshBasicMaterial({
|
|
121
|
+
map: texture,
|
|
122
|
+
transparent: true,
|
|
123
|
+
opacity: component.opacity,
|
|
124
|
+
side: component.doubleSide ? three.DoubleSide : three.FrontSide,
|
|
125
|
+
});
|
|
126
|
+
const mesh = new three.Mesh(geometry, material);
|
|
127
|
+
mesh.position.set(component.positionX, component.positionY, component.positionZ);
|
|
128
|
+
mesh.rotation.set(component.rotationX, component.rotationY, component.rotationZ);
|
|
129
|
+
mesh.scale.set(component.scaleX, component.scaleY, 1);
|
|
130
|
+
this.threeContext.scene.add(mesh);
|
|
131
|
+
this.imgs.set(gameObject.id, { mesh, texture });
|
|
132
|
+
}
|
|
133
|
+
async handleChange(changed) {
|
|
134
|
+
const component = changed.component;
|
|
135
|
+
const changedProp = changed.prop?.prop?.[0];
|
|
136
|
+
const entry = this.imgs.get(changed.gameObject.id);
|
|
137
|
+
if (changedProp === 'resource') {
|
|
138
|
+
this.handleRemove(changed.gameObject.id);
|
|
139
|
+
this.handleAdd(changed.gameObject, component);
|
|
140
|
+
return;
|
|
141
|
+
}
|
|
142
|
+
if (!entry)
|
|
143
|
+
return;
|
|
144
|
+
const material = entry.mesh.material;
|
|
145
|
+
if (changedProp === 'opacity') {
|
|
146
|
+
material.opacity = component.opacity;
|
|
147
|
+
}
|
|
148
|
+
if (changedProp === 'doubleSide') {
|
|
149
|
+
material.side = component.doubleSide ? three.DoubleSide : three.FrontSide;
|
|
150
|
+
material.needsUpdate = true;
|
|
151
|
+
}
|
|
152
|
+
}
|
|
153
|
+
handleRemove(id) {
|
|
154
|
+
this.increaseAsyncId(id);
|
|
155
|
+
const entry = this.imgs.get(id);
|
|
156
|
+
if (!entry)
|
|
157
|
+
return;
|
|
158
|
+
this.threeContext.scene.remove(entry.mesh);
|
|
159
|
+
entry.mesh.geometry.dispose();
|
|
160
|
+
entry.mesh.material.dispose();
|
|
161
|
+
entry.texture.dispose();
|
|
162
|
+
this.imgs.delete(id);
|
|
163
|
+
}
|
|
164
|
+
loadTexture(url) {
|
|
165
|
+
return new Promise((resolve, reject) => {
|
|
166
|
+
this.textureLoader.load(url, resolve, undefined, reject);
|
|
167
|
+
});
|
|
168
|
+
}
|
|
169
|
+
onDestroy() {
|
|
170
|
+
for (const [id] of this.imgs) {
|
|
171
|
+
this.handleRemove(id);
|
|
172
|
+
}
|
|
173
|
+
this.imgs.clear();
|
|
174
|
+
}
|
|
175
|
+
};
|
|
176
|
+
Img3DSystem = tslib.__decorate([
|
|
177
|
+
engine.decorators.componentObserver({
|
|
178
|
+
Img3D: [
|
|
179
|
+
'resource', 'opacity', 'doubleSide',
|
|
180
|
+
'positionX', 'positionY', 'positionZ',
|
|
181
|
+
'rotationX', 'rotationY', 'rotationZ',
|
|
182
|
+
'scaleX', 'scaleY',
|
|
183
|
+
],
|
|
184
|
+
})
|
|
185
|
+
], Img3DSystem);
|
|
186
|
+
var Img3DSystem_default = Img3DSystem;
|
|
187
|
+
|
|
188
|
+
exports.Img3D = Img3D;
|
|
189
|
+
exports.Img3DSystem = Img3DSystem_default;
|
|
190
|
+
//# sourceMappingURL=plugin-renderer-3d-img.cjs.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"plugin-renderer-3d-img.cjs.js","sources":["../lib/component.ts","../lib/system.ts"],"sourcesContent":["import { Component } from '@combos-fun/engine';\nimport { type, step } from '@combos-fun/inspector-decorator';\n\nexport interface Img3DParams {\n resource?: string;\n positionX?: number;\n positionY?: number;\n positionZ?: number;\n rotationX?: number;\n rotationY?: number;\n rotationZ?: number;\n scaleX?: number;\n scaleY?: number;\n opacity?: number;\n doubleSide?: boolean;\n}\n\nexport default class Img3D extends Component<Img3DParams> {\n static componentName: string = 'Img3D';\n\n @type('string') resource: string = '';\n @type('number') @step(0.1) positionX: number = 0;\n @type('number') @step(0.1) positionY: number = 0;\n @type('number') @step(0.1) positionZ: number = 0;\n @type('number') @step(0.01) rotationX: number = 0;\n @type('number') @step(0.01) rotationY: number = 0;\n @type('number') @step(0.01) rotationZ: number = 0;\n @type('number') @step(0.1) scaleX: number = 1;\n @type('number') @step(0.1) scaleY: number = 1;\n @type('number') @step(0.01) opacity: number = 1;\n @type('boolean') doubleSide: boolean = false;\n\n init(obj?: Img3DParams) {\n if (obj) Object.assign(this, obj);\n }\n}\n","import { decorators, ComponentChanged, OBSERVER_TYPE, GameObject } from '@combos-fun/engine';\nimport { Renderer3D, Renderer3DSystem } from '@combos-fun/plugin-renderer-3d';\nimport {\n TextureLoader,\n PlaneGeometry,\n MeshBasicMaterial,\n Mesh,\n DoubleSide,\n FrontSide,\n} from 'three';\nimport type { Texture } from 'three';\nimport Img3D from './component';\n\ninterface Img3DEntry {\n mesh: Mesh;\n texture: Texture;\n}\n\n@decorators.componentObserver({\n Img3D: [\n 'resource', 'opacity', 'doubleSide',\n 'positionX', 'positionY', 'positionZ',\n 'rotationX', 'rotationY', 'rotationZ',\n 'scaleX', 'scaleY',\n ],\n})\nexport default class Img3DSystem extends Renderer3D {\n static systemName = 'Img3DSystem';\n name: string = 'Img3DSystem';\n\n private imgs: Map<number, Img3DEntry> = new Map();\n private textureLoader = new TextureLoader();\n\n init() {\n const renderer3DSystem = this.game.getSystem(Renderer3DSystem) as Renderer3DSystem;\n renderer3DSystem.rendererManager.register(this);\n }\n\n componentChanged(changed: ComponentChanged) {\n if (changed.componentName !== 'Img3D') return;\n\n if (changed.type === OBSERVER_TYPE.ADD) {\n this.handleAdd(changed.gameObject, changed.component as Img3D);\n } else if (changed.type === OBSERVER_TYPE.REMOVE) {\n this.handleRemove(changed.gameObject.id);\n } else {\n this.handleChange(changed);\n }\n }\n\n rendererUpdate(gameObject: GameObject) {\n const component = gameObject.getComponent(Img3D) as Img3D;\n if (!component) return;\n\n const entry = this.imgs.get(gameObject.id);\n if (!entry) return;\n\n entry.mesh.position.set(component.positionX, component.positionY, component.positionZ);\n entry.mesh.rotation.set(component.rotationX, component.rotationY, component.rotationZ);\n entry.mesh.scale.set(component.scaleX, component.scaleY, 1);\n }\n\n private async handleAdd(gameObject: GameObject, component: Img3D) {\n if (!component.resource) return;\n\n const asyncId = this.increaseAsyncId(gameObject.id);\n\n const texture = await this.loadTexture(component.resource);\n if (!this.validateAsyncId(gameObject.id, asyncId)) {\n texture.dispose();\n return;\n }\n\n const aspectRatio = texture.image.width / texture.image.height;\n const geometry = new PlaneGeometry(aspectRatio, 1);\n const material = new MeshBasicMaterial({\n map: texture,\n transparent: true,\n opacity: component.opacity,\n side: component.doubleSide ? DoubleSide : FrontSide,\n });\n const mesh = new Mesh(geometry, material);\n mesh.position.set(component.positionX, component.positionY, component.positionZ);\n mesh.rotation.set(component.rotationX, component.rotationY, component.rotationZ);\n mesh.scale.set(component.scaleX, component.scaleY, 1);\n\n this.threeContext.scene.add(mesh);\n this.imgs.set(gameObject.id, { mesh, texture });\n }\n\n private async handleChange(changed: ComponentChanged) {\n const component = changed.component as Img3D;\n const changedProp = changed.prop?.prop?.[0];\n const entry = this.imgs.get(changed.gameObject.id);\n\n if (changedProp === 'resource') {\n this.handleRemove(changed.gameObject.id);\n this.handleAdd(changed.gameObject, component);\n return;\n }\n\n if (!entry) return;\n\n const material = entry.mesh.material as MeshBasicMaterial;\n\n if (changedProp === 'opacity') {\n material.opacity = component.opacity;\n }\n if (changedProp === 'doubleSide') {\n material.side = component.doubleSide ? DoubleSide : FrontSide;\n material.needsUpdate = true;\n }\n }\n\n private handleRemove(id: number) {\n this.increaseAsyncId(id);\n const entry = this.imgs.get(id);\n if (!entry) return;\n\n this.threeContext.scene.remove(entry.mesh);\n entry.mesh.geometry.dispose();\n (entry.mesh.material as MeshBasicMaterial).dispose();\n entry.texture.dispose();\n this.imgs.delete(id);\n }\n\n private loadTexture(url: string): Promise<Texture> {\n return new Promise((resolve, reject) => {\n this.textureLoader.load(url, resolve, undefined, reject);\n });\n }\n\n onDestroy() {\n for (const [id] of this.imgs) {\n this.handleRemove(id);\n }\n this.imgs.clear();\n }\n}\n"],"names":["Component","__decorate","type","step","Renderer3D","TextureLoader","Renderer3DSystem","OBSERVER_TYPE","PlaneGeometry","MeshBasicMaterial","DoubleSide","FrontSide","Mesh","decorators"],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";var e=require("tslib"),t=require("@combos-fun/engine"),o=require("@combos-fun/inspector-decorator"),i=require("@combos-fun/plugin-renderer-3d"),s=require("three");class r extends t.Component{constructor(){super(...arguments),this.resource="",this.positionX=0,this.positionY=0,this.positionZ=0,this.rotationX=0,this.rotationY=0,this.rotationZ=0,this.scaleX=1,this.scaleY=1,this.opacity=1,this.doubleSide=!1}static{this.componentName="Img3D"}init(e){e&&Object.assign(this,e)}}e.__decorate([o.type("string")],r.prototype,"resource",void 0),e.__decorate([o.type("number"),o.step(.1)],r.prototype,"positionX",void 0),e.__decorate([o.type("number"),o.step(.1)],r.prototype,"positionY",void 0),e.__decorate([o.type("number"),o.step(.1)],r.prototype,"positionZ",void 0),e.__decorate([o.type("number"),o.step(.01)],r.prototype,"rotationX",void 0),e.__decorate([o.type("number"),o.step(.01)],r.prototype,"rotationY",void 0),e.__decorate([o.type("number"),o.step(.01)],r.prototype,"rotationZ",void 0),e.__decorate([o.type("number"),o.step(.1)],r.prototype,"scaleX",void 0),e.__decorate([o.type("number"),o.step(.1)],r.prototype,"scaleY",void 0),e.__decorate([o.type("number"),o.step(.01)],r.prototype,"opacity",void 0),e.__decorate([o.type("boolean")],r.prototype,"doubleSide",void 0);let n=class extends i.Renderer3D{constructor(){super(...arguments),this.name="Img3DSystem",this.imgs=new Map,this.textureLoader=new s.TextureLoader}static{this.systemName="Img3DSystem"}init(){this.game.getSystem(i.Renderer3DSystem).rendererManager.register(this)}componentChanged(e){"Img3D"===e.componentName&&(e.type===t.OBSERVER_TYPE.ADD?this.handleAdd(e.gameObject,e.component):e.type===t.OBSERVER_TYPE.REMOVE?this.handleRemove(e.gameObject.id):this.handleChange(e))}rendererUpdate(e){const t=e.getComponent(r);if(!t)return;const o=this.imgs.get(e.id);o&&(o.mesh.position.set(t.positionX,t.positionY,t.positionZ),o.mesh.rotation.set(t.rotationX,t.rotationY,t.rotationZ),o.mesh.scale.set(t.scaleX,t.scaleY,1))}async handleAdd(e,t){if(!t.resource)return;const o=this.increaseAsyncId(e.id),i=await this.loadTexture(t.resource);if(!this.validateAsyncId(e.id,o))return void i.dispose();const r=i.image.width/i.image.height,n=new s.PlaneGeometry(r,1),a=new s.MeshBasicMaterial({map:i,transparent:!0,opacity:t.opacity,side:t.doubleSide?s.DoubleSide:s.FrontSide}),d=new s.Mesh(n,a);d.position.set(t.positionX,t.positionY,t.positionZ),d.rotation.set(t.rotationX,t.rotationY,t.rotationZ),d.scale.set(t.scaleX,t.scaleY,1),this.threeContext.scene.add(d),this.imgs.set(e.id,{mesh:d,texture:i})}async handleChange(e){const t=e.component,o=e.prop?.prop?.[0],i=this.imgs.get(e.gameObject.id);if("resource"===o)return this.handleRemove(e.gameObject.id),void this.handleAdd(e.gameObject,t);if(!i)return;const r=i.mesh.material;"opacity"===o&&(r.opacity=t.opacity),"doubleSide"===o&&(r.side=t.doubleSide?s.DoubleSide:s.FrontSide,r.needsUpdate=!0)}handleRemove(e){this.increaseAsyncId(e);const t=this.imgs.get(e);t&&(this.threeContext.scene.remove(t.mesh),t.mesh.geometry.dispose(),t.mesh.material.dispose(),t.texture.dispose(),this.imgs.delete(e))}loadTexture(e){return new Promise((t,o)=>{this.textureLoader.load(e,t,void 0,o)})}onDestroy(){for(const[e]of this.imgs)this.handleRemove(e);this.imgs.clear()}};n=e.__decorate([t.decorators.componentObserver({Img3D:["resource","opacity","doubleSide","positionX","positionY","positionZ","rotationX","rotationY","rotationZ","scaleX","scaleY"]})],n);var a=n;exports.Img3D=r,exports.Img3DSystem=a;
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
import { Component, ComponentChanged, GameObject } from '@combos-fun/engine';
|
|
2
|
+
import { Renderer3D } from '@combos-fun/plugin-renderer-3d';
|
|
3
|
+
|
|
4
|
+
interface Img3DParams {
|
|
5
|
+
resource?: string;
|
|
6
|
+
positionX?: number;
|
|
7
|
+
positionY?: number;
|
|
8
|
+
positionZ?: number;
|
|
9
|
+
rotationX?: number;
|
|
10
|
+
rotationY?: number;
|
|
11
|
+
rotationZ?: number;
|
|
12
|
+
scaleX?: number;
|
|
13
|
+
scaleY?: number;
|
|
14
|
+
opacity?: number;
|
|
15
|
+
doubleSide?: boolean;
|
|
16
|
+
}
|
|
17
|
+
declare class Img3D extends Component<Img3DParams> {
|
|
18
|
+
static componentName: string;
|
|
19
|
+
resource: string;
|
|
20
|
+
positionX: number;
|
|
21
|
+
positionY: number;
|
|
22
|
+
positionZ: number;
|
|
23
|
+
rotationX: number;
|
|
24
|
+
rotationY: number;
|
|
25
|
+
rotationZ: number;
|
|
26
|
+
scaleX: number;
|
|
27
|
+
scaleY: number;
|
|
28
|
+
opacity: number;
|
|
29
|
+
doubleSide: boolean;
|
|
30
|
+
init(obj?: Img3DParams): void;
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
declare class Img3DSystem extends Renderer3D {
|
|
34
|
+
static systemName: string;
|
|
35
|
+
name: string;
|
|
36
|
+
private imgs;
|
|
37
|
+
private textureLoader;
|
|
38
|
+
init(): void;
|
|
39
|
+
componentChanged(changed: ComponentChanged): void;
|
|
40
|
+
rendererUpdate(gameObject: GameObject): void;
|
|
41
|
+
private handleAdd;
|
|
42
|
+
private handleChange;
|
|
43
|
+
private handleRemove;
|
|
44
|
+
private loadTexture;
|
|
45
|
+
onDestroy(): void;
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
export { Img3D, Img3DSystem };
|
|
49
|
+
export type { Img3DParams };
|
|
@@ -0,0 +1,187 @@
|
|
|
1
|
+
import { __decorate } from 'tslib';
|
|
2
|
+
import { Component, OBSERVER_TYPE, decorators } from '@combos-fun/engine';
|
|
3
|
+
import { type, step } from '@combos-fun/inspector-decorator';
|
|
4
|
+
import { Renderer3D, Renderer3DSystem } from '@combos-fun/plugin-renderer-3d';
|
|
5
|
+
import { TextureLoader, PlaneGeometry, MeshBasicMaterial, DoubleSide, FrontSide, Mesh } from 'three';
|
|
6
|
+
|
|
7
|
+
class Img3D extends Component {
|
|
8
|
+
constructor() {
|
|
9
|
+
super(...arguments);
|
|
10
|
+
this.resource = '';
|
|
11
|
+
this.positionX = 0;
|
|
12
|
+
this.positionY = 0;
|
|
13
|
+
this.positionZ = 0;
|
|
14
|
+
this.rotationX = 0;
|
|
15
|
+
this.rotationY = 0;
|
|
16
|
+
this.rotationZ = 0;
|
|
17
|
+
this.scaleX = 1;
|
|
18
|
+
this.scaleY = 1;
|
|
19
|
+
this.opacity = 1;
|
|
20
|
+
this.doubleSide = false;
|
|
21
|
+
}
|
|
22
|
+
static { this.componentName = 'Img3D'; }
|
|
23
|
+
init(obj) {
|
|
24
|
+
if (obj)
|
|
25
|
+
Object.assign(this, obj);
|
|
26
|
+
}
|
|
27
|
+
}
|
|
28
|
+
__decorate([
|
|
29
|
+
type('string')
|
|
30
|
+
], Img3D.prototype, "resource", void 0);
|
|
31
|
+
__decorate([
|
|
32
|
+
type('number'),
|
|
33
|
+
step(0.1)
|
|
34
|
+
], Img3D.prototype, "positionX", void 0);
|
|
35
|
+
__decorate([
|
|
36
|
+
type('number'),
|
|
37
|
+
step(0.1)
|
|
38
|
+
], Img3D.prototype, "positionY", void 0);
|
|
39
|
+
__decorate([
|
|
40
|
+
type('number'),
|
|
41
|
+
step(0.1)
|
|
42
|
+
], Img3D.prototype, "positionZ", void 0);
|
|
43
|
+
__decorate([
|
|
44
|
+
type('number'),
|
|
45
|
+
step(0.01)
|
|
46
|
+
], Img3D.prototype, "rotationX", void 0);
|
|
47
|
+
__decorate([
|
|
48
|
+
type('number'),
|
|
49
|
+
step(0.01)
|
|
50
|
+
], Img3D.prototype, "rotationY", void 0);
|
|
51
|
+
__decorate([
|
|
52
|
+
type('number'),
|
|
53
|
+
step(0.01)
|
|
54
|
+
], Img3D.prototype, "rotationZ", void 0);
|
|
55
|
+
__decorate([
|
|
56
|
+
type('number'),
|
|
57
|
+
step(0.1)
|
|
58
|
+
], Img3D.prototype, "scaleX", void 0);
|
|
59
|
+
__decorate([
|
|
60
|
+
type('number'),
|
|
61
|
+
step(0.1)
|
|
62
|
+
], Img3D.prototype, "scaleY", void 0);
|
|
63
|
+
__decorate([
|
|
64
|
+
type('number'),
|
|
65
|
+
step(0.01)
|
|
66
|
+
], Img3D.prototype, "opacity", void 0);
|
|
67
|
+
__decorate([
|
|
68
|
+
type('boolean')
|
|
69
|
+
], Img3D.prototype, "doubleSide", void 0);
|
|
70
|
+
|
|
71
|
+
let Img3DSystem = class Img3DSystem extends Renderer3D {
|
|
72
|
+
constructor() {
|
|
73
|
+
super(...arguments);
|
|
74
|
+
this.name = 'Img3DSystem';
|
|
75
|
+
this.imgs = new Map();
|
|
76
|
+
this.textureLoader = new TextureLoader();
|
|
77
|
+
}
|
|
78
|
+
static { this.systemName = 'Img3DSystem'; }
|
|
79
|
+
init() {
|
|
80
|
+
const renderer3DSystem = this.game.getSystem(Renderer3DSystem);
|
|
81
|
+
renderer3DSystem.rendererManager.register(this);
|
|
82
|
+
}
|
|
83
|
+
componentChanged(changed) {
|
|
84
|
+
if (changed.componentName !== 'Img3D')
|
|
85
|
+
return;
|
|
86
|
+
if (changed.type === OBSERVER_TYPE.ADD) {
|
|
87
|
+
this.handleAdd(changed.gameObject, changed.component);
|
|
88
|
+
}
|
|
89
|
+
else if (changed.type === OBSERVER_TYPE.REMOVE) {
|
|
90
|
+
this.handleRemove(changed.gameObject.id);
|
|
91
|
+
}
|
|
92
|
+
else {
|
|
93
|
+
this.handleChange(changed);
|
|
94
|
+
}
|
|
95
|
+
}
|
|
96
|
+
rendererUpdate(gameObject) {
|
|
97
|
+
const component = gameObject.getComponent(Img3D);
|
|
98
|
+
if (!component)
|
|
99
|
+
return;
|
|
100
|
+
const entry = this.imgs.get(gameObject.id);
|
|
101
|
+
if (!entry)
|
|
102
|
+
return;
|
|
103
|
+
entry.mesh.position.set(component.positionX, component.positionY, component.positionZ);
|
|
104
|
+
entry.mesh.rotation.set(component.rotationX, component.rotationY, component.rotationZ);
|
|
105
|
+
entry.mesh.scale.set(component.scaleX, component.scaleY, 1);
|
|
106
|
+
}
|
|
107
|
+
async handleAdd(gameObject, component) {
|
|
108
|
+
if (!component.resource)
|
|
109
|
+
return;
|
|
110
|
+
const asyncId = this.increaseAsyncId(gameObject.id);
|
|
111
|
+
const texture = await this.loadTexture(component.resource);
|
|
112
|
+
if (!this.validateAsyncId(gameObject.id, asyncId)) {
|
|
113
|
+
texture.dispose();
|
|
114
|
+
return;
|
|
115
|
+
}
|
|
116
|
+
const aspectRatio = texture.image.width / texture.image.height;
|
|
117
|
+
const geometry = new PlaneGeometry(aspectRatio, 1);
|
|
118
|
+
const material = new MeshBasicMaterial({
|
|
119
|
+
map: texture,
|
|
120
|
+
transparent: true,
|
|
121
|
+
opacity: component.opacity,
|
|
122
|
+
side: component.doubleSide ? DoubleSide : FrontSide,
|
|
123
|
+
});
|
|
124
|
+
const mesh = new Mesh(geometry, material);
|
|
125
|
+
mesh.position.set(component.positionX, component.positionY, component.positionZ);
|
|
126
|
+
mesh.rotation.set(component.rotationX, component.rotationY, component.rotationZ);
|
|
127
|
+
mesh.scale.set(component.scaleX, component.scaleY, 1);
|
|
128
|
+
this.threeContext.scene.add(mesh);
|
|
129
|
+
this.imgs.set(gameObject.id, { mesh, texture });
|
|
130
|
+
}
|
|
131
|
+
async handleChange(changed) {
|
|
132
|
+
const component = changed.component;
|
|
133
|
+
const changedProp = changed.prop?.prop?.[0];
|
|
134
|
+
const entry = this.imgs.get(changed.gameObject.id);
|
|
135
|
+
if (changedProp === 'resource') {
|
|
136
|
+
this.handleRemove(changed.gameObject.id);
|
|
137
|
+
this.handleAdd(changed.gameObject, component);
|
|
138
|
+
return;
|
|
139
|
+
}
|
|
140
|
+
if (!entry)
|
|
141
|
+
return;
|
|
142
|
+
const material = entry.mesh.material;
|
|
143
|
+
if (changedProp === 'opacity') {
|
|
144
|
+
material.opacity = component.opacity;
|
|
145
|
+
}
|
|
146
|
+
if (changedProp === 'doubleSide') {
|
|
147
|
+
material.side = component.doubleSide ? DoubleSide : FrontSide;
|
|
148
|
+
material.needsUpdate = true;
|
|
149
|
+
}
|
|
150
|
+
}
|
|
151
|
+
handleRemove(id) {
|
|
152
|
+
this.increaseAsyncId(id);
|
|
153
|
+
const entry = this.imgs.get(id);
|
|
154
|
+
if (!entry)
|
|
155
|
+
return;
|
|
156
|
+
this.threeContext.scene.remove(entry.mesh);
|
|
157
|
+
entry.mesh.geometry.dispose();
|
|
158
|
+
entry.mesh.material.dispose();
|
|
159
|
+
entry.texture.dispose();
|
|
160
|
+
this.imgs.delete(id);
|
|
161
|
+
}
|
|
162
|
+
loadTexture(url) {
|
|
163
|
+
return new Promise((resolve, reject) => {
|
|
164
|
+
this.textureLoader.load(url, resolve, undefined, reject);
|
|
165
|
+
});
|
|
166
|
+
}
|
|
167
|
+
onDestroy() {
|
|
168
|
+
for (const [id] of this.imgs) {
|
|
169
|
+
this.handleRemove(id);
|
|
170
|
+
}
|
|
171
|
+
this.imgs.clear();
|
|
172
|
+
}
|
|
173
|
+
};
|
|
174
|
+
Img3DSystem = __decorate([
|
|
175
|
+
decorators.componentObserver({
|
|
176
|
+
Img3D: [
|
|
177
|
+
'resource', 'opacity', 'doubleSide',
|
|
178
|
+
'positionX', 'positionY', 'positionZ',
|
|
179
|
+
'rotationX', 'rotationY', 'rotationZ',
|
|
180
|
+
'scaleX', 'scaleY',
|
|
181
|
+
],
|
|
182
|
+
})
|
|
183
|
+
], Img3DSystem);
|
|
184
|
+
var Img3DSystem_default = Img3DSystem;
|
|
185
|
+
|
|
186
|
+
export { Img3D, Img3DSystem_default as Img3DSystem };
|
|
187
|
+
//# sourceMappingURL=plugin-renderer-3d-img.esm.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"plugin-renderer-3d-img.esm.js","sources":["../lib/component.ts","../lib/system.ts"],"sourcesContent":["import { Component } from '@combos-fun/engine';\nimport { type, step } from '@combos-fun/inspector-decorator';\n\nexport interface Img3DParams {\n resource?: string;\n positionX?: number;\n positionY?: number;\n positionZ?: number;\n rotationX?: number;\n rotationY?: number;\n rotationZ?: number;\n scaleX?: number;\n scaleY?: number;\n opacity?: number;\n doubleSide?: boolean;\n}\n\nexport default class Img3D extends Component<Img3DParams> {\n static componentName: string = 'Img3D';\n\n @type('string') resource: string = '';\n @type('number') @step(0.1) positionX: number = 0;\n @type('number') @step(0.1) positionY: number = 0;\n @type('number') @step(0.1) positionZ: number = 0;\n @type('number') @step(0.01) rotationX: number = 0;\n @type('number') @step(0.01) rotationY: number = 0;\n @type('number') @step(0.01) rotationZ: number = 0;\n @type('number') @step(0.1) scaleX: number = 1;\n @type('number') @step(0.1) scaleY: number = 1;\n @type('number') @step(0.01) opacity: number = 1;\n @type('boolean') doubleSide: boolean = false;\n\n init(obj?: Img3DParams) {\n if (obj) Object.assign(this, obj);\n }\n}\n","import { decorators, ComponentChanged, OBSERVER_TYPE, GameObject } from '@combos-fun/engine';\nimport { Renderer3D, Renderer3DSystem } from '@combos-fun/plugin-renderer-3d';\nimport {\n TextureLoader,\n PlaneGeometry,\n MeshBasicMaterial,\n Mesh,\n DoubleSide,\n FrontSide,\n} from 'three';\nimport type { Texture } from 'three';\nimport Img3D from './component';\n\ninterface Img3DEntry {\n mesh: Mesh;\n texture: Texture;\n}\n\n@decorators.componentObserver({\n Img3D: [\n 'resource', 'opacity', 'doubleSide',\n 'positionX', 'positionY', 'positionZ',\n 'rotationX', 'rotationY', 'rotationZ',\n 'scaleX', 'scaleY',\n ],\n})\nexport default class Img3DSystem extends Renderer3D {\n static systemName = 'Img3DSystem';\n name: string = 'Img3DSystem';\n\n private imgs: Map<number, Img3DEntry> = new Map();\n private textureLoader = new TextureLoader();\n\n init() {\n const renderer3DSystem = this.game.getSystem(Renderer3DSystem) as Renderer3DSystem;\n renderer3DSystem.rendererManager.register(this);\n }\n\n componentChanged(changed: ComponentChanged) {\n if (changed.componentName !== 'Img3D') return;\n\n if (changed.type === OBSERVER_TYPE.ADD) {\n this.handleAdd(changed.gameObject, changed.component as Img3D);\n } else if (changed.type === OBSERVER_TYPE.REMOVE) {\n this.handleRemove(changed.gameObject.id);\n } else {\n this.handleChange(changed);\n }\n }\n\n rendererUpdate(gameObject: GameObject) {\n const component = gameObject.getComponent(Img3D) as Img3D;\n if (!component) return;\n\n const entry = this.imgs.get(gameObject.id);\n if (!entry) return;\n\n entry.mesh.position.set(component.positionX, component.positionY, component.positionZ);\n entry.mesh.rotation.set(component.rotationX, component.rotationY, component.rotationZ);\n entry.mesh.scale.set(component.scaleX, component.scaleY, 1);\n }\n\n private async handleAdd(gameObject: GameObject, component: Img3D) {\n if (!component.resource) return;\n\n const asyncId = this.increaseAsyncId(gameObject.id);\n\n const texture = await this.loadTexture(component.resource);\n if (!this.validateAsyncId(gameObject.id, asyncId)) {\n texture.dispose();\n return;\n }\n\n const aspectRatio = texture.image.width / texture.image.height;\n const geometry = new PlaneGeometry(aspectRatio, 1);\n const material = new MeshBasicMaterial({\n map: texture,\n transparent: true,\n opacity: component.opacity,\n side: component.doubleSide ? DoubleSide : FrontSide,\n });\n const mesh = new Mesh(geometry, material);\n mesh.position.set(component.positionX, component.positionY, component.positionZ);\n mesh.rotation.set(component.rotationX, component.rotationY, component.rotationZ);\n mesh.scale.set(component.scaleX, component.scaleY, 1);\n\n this.threeContext.scene.add(mesh);\n this.imgs.set(gameObject.id, { mesh, texture });\n }\n\n private async handleChange(changed: ComponentChanged) {\n const component = changed.component as Img3D;\n const changedProp = changed.prop?.prop?.[0];\n const entry = this.imgs.get(changed.gameObject.id);\n\n if (changedProp === 'resource') {\n this.handleRemove(changed.gameObject.id);\n this.handleAdd(changed.gameObject, component);\n return;\n }\n\n if (!entry) return;\n\n const material = entry.mesh.material as MeshBasicMaterial;\n\n if (changedProp === 'opacity') {\n material.opacity = component.opacity;\n }\n if (changedProp === 'doubleSide') {\n material.side = component.doubleSide ? DoubleSide : FrontSide;\n material.needsUpdate = true;\n }\n }\n\n private handleRemove(id: number) {\n this.increaseAsyncId(id);\n const entry = this.imgs.get(id);\n if (!entry) return;\n\n this.threeContext.scene.remove(entry.mesh);\n entry.mesh.geometry.dispose();\n (entry.mesh.material as MeshBasicMaterial).dispose();\n entry.texture.dispose();\n this.imgs.delete(id);\n }\n\n private loadTexture(url: string): Promise<Texture> {\n return new Promise((resolve, reject) => {\n this.textureLoader.load(url, resolve, undefined, reject);\n });\n }\n\n onDestroy() {\n for (const [id] of this.imgs) {\n this.handleRemove(id);\n }\n this.imgs.clear();\n }\n}\n"],"names":[],"mappings":"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"}
|
package/index.js
ADDED
package/package.json
ADDED
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@combos-fun/plugin-renderer-3d-img",
|
|
3
|
+
"version": "0.0.6",
|
|
4
|
+
"description": "@combos-fun/plugin-renderer-3d-img",
|
|
5
|
+
"main": "index.js",
|
|
6
|
+
"module": "dist/plugin-renderer-3d-img.esm.js",
|
|
7
|
+
"bundle": "CombosFun.plugin.renderer.3d.img",
|
|
8
|
+
"unpkg": "dist/CombosFun.plugin.renderer.3d.img.min.js",
|
|
9
|
+
"types": "dist/plugin-renderer-3d-img.d.ts",
|
|
10
|
+
"files": [
|
|
11
|
+
"index.js",
|
|
12
|
+
"dist"
|
|
13
|
+
],
|
|
14
|
+
"dependencies": {
|
|
15
|
+
"three": "^0.172.0",
|
|
16
|
+
"@combos-fun/engine": "0.0.6",
|
|
17
|
+
"@combos-fun/inspector-decorator": "0.0.6",
|
|
18
|
+
"@combos-fun/plugin-renderer-3d": "0.0.6"
|
|
19
|
+
},
|
|
20
|
+
"scripts": {
|
|
21
|
+
"build": "node ../../scripts/build-package.mjs"
|
|
22
|
+
}
|
|
23
|
+
}
|