@needle-tools/engine
Version:
Needle Engine is a web-based runtime for 3D apps. It runs on your machine for development with great integrations into editors like Unity or Blender - and can be deployed onto any device! It is flexible, extensible and networking and XR are built-in
117 lines • 3.89 kB
JavaScript
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
return c > 3 && r && Object.defineProperty(target, key, r), r;
};
import { Texture } from 'three';
import { serializable } from '../../engine/engine_serialization_decorator.js';
import { MaskableGraphic } from './Graphic.js';
class Sprite {
texture = null;
rect;
}
__decorate([
serializable(Texture)
], Sprite.prototype, "texture", void 0);
/**
* @category User Interface
* @group Components
*/
export class Image extends MaskableGraphic {
set image(img) {
if (!this.sprite)
this.sprite = new Sprite();
this.sprite.texture = img;
this.onAfterCreated();
}
get image() {
if (this.sprite)
return this.sprite.texture;
return null;
}
get sprite() {
return this._sprite;
}
set sprite(sprite) {
if (this._sprite === sprite)
return;
this._sprite = sprite;
this.onAfterCreated();
}
_sprite;
pixelsPerUnitMultiplier = 1;
isBuiltinSprite() {
const sprite = this.sprite;
switch (sprite?.texture?.name) {
case "InputFieldBackground":
case "UISprite":
case "Background":
case "Knob":
return true;
}
// this is a hack/workaround for production builds where the name of the sprite is missing
// need to remove this!!!!
if (!sprite?.texture?.name?.length && sprite?.texture?.image?.width === 32 && sprite?.texture?.image?.height === 32)
return true;
return false;
}
onBeforeCreate(opts) {
super.onBeforeCreate(opts);
if (this.isBuiltinSprite()) {
opts.borderRadius = 5 / this.pixelsPerUnitMultiplier;
if (this.sprite?.texture?.name === "Knob") {
opts.borderRadius = 999;
}
// opts.borderColor = new Color(.4, .4, .4);
// opts.borderOpacity = this.color.alpha;
// opts.borderWidth = .3;
}
}
onAfterCreated() {
if (!this.__didAwake)
return;
super.onAfterCreated();
// TODO: @swingingtom setting a built-in sprite at runtime doesnt update the image
if (this.isBuiltinSprite())
return;
this.setTexture(this.sprite?.texture);
}
}
__decorate([
serializable(Sprite)
], Image.prototype, "sprite", null);
__decorate([
serializable()
], Image.prototype, "pixelsPerUnitMultiplier", void 0);
/**
* @category User Interface
* @group Components
*/
export class RawImage extends MaskableGraphic {
get mainTexture() {
return this._mainTexture;
}
set mainTexture(texture) {
if (this._mainTexture === texture)
return;
this._mainTexture = texture;
this.onAfterCreated();
}
_mainTexture;
onAfterCreated() {
if (!this.__didAwake)
return;
super.onAfterCreated();
// console.log(this);
// if (this.mainTexture) {
// this.mainTexture.flipY = true;
// this.mainTexture.needsUpdate = true;
// }
this.setTexture(this.mainTexture);
}
}
__decorate([
serializable(Texture)
], RawImage.prototype, "mainTexture", null);
//# sourceMappingURL=Image.js.map