@wonderlandengine/editor-api 1.2.0-dev.0 → 1.2.0-dev.2

package/dist/data.d.ts

@@ -2,6 +2,8 @@
 export type ObjectReference = string | null;
 /** Mesh reference */
 export type MeshReference = string | null;
+/** Morph targets reference */
+export type MorphTargetsReference = string | null;
 /** Texture reference */
 export type TextureReference = string | null;
 /** Shader reference */
@@ -33,14 +35,28 @@ export declare class SkySettings {
 /** Bloom settings */
 export declare class BloomSettings {
     enabled: boolean;
-    kernelSize: number;
     passes: number;
     threshold: number;
     intensity: number;
+    width: number;
+}
+/** Tonemapping mode enum */
+export declare enum TonemappingMode {
+    /** No tonemapping */
+    None = "none",
+    /** Tonemapping with a polynomial fit of the ACES transform */
+    ACES = "aces",
+    /** Tonemapping with a simpler fit of the ACES transform */
+    ACESApproximated = "aces approximated",
+    /** Tonemapping with the global Reinhard operator */
+    Reinhard = "reinhard",
+    /** Tonemapping with an exponential curve */
+    Exponential = "exponential"
 }
 /** HDR settings */
 export declare class HdrSettings {
     exposure: number;
+    tonemapping: TonemappingMode;
 }
 /** Texture streaming settings */
 export declare class TextureStreamingSettings {
@@ -436,6 +452,7 @@ export declare class MeshComponent {
     material: MaterialReference;
     mesh: MeshReference;
     skin: SkinReference;
+    morphTargets: MorphTargetsReference;
 }
 /** Text effect type enum */
 export declare enum TextEffectType {
@@ -445,7 +462,7 @@ export declare enum TextEffectType {
 /** 'text' component configuration */
 export declare class TextComponent {
     alignment: string;
-    justification: string;
+    verticalAlignment: string;
     characterSpacing: number;
     lineSpacing: number;
     effect: TextEffectType;
@@ -624,7 +641,7 @@ export declare class LanguageResource {
     };
 }
 /**
- * @brief Access to Wonderland Editor's data
+ * Access to Wonderland Editor's data.
  *
  * Hold control and hover any field in Wonderland Editor to see its JSON path.
  * The path is equivalent to how you find the matching chain of properties.

package/dist/data.js

@@ -13,14 +13,29 @@ export class SkySettings {
 /** Bloom settings */
 export class BloomSettings {
     enabled = false;
-    kernelSize = 6;
-    passes = 1;
+    passes = 3;
     threshold = 1.25;
     intensity = 2.0;
-}
+    width = 0.5;
+}
+/** Tonemapping mode enum */
+export var TonemappingMode;
+(function (TonemappingMode) {
+    /** No tonemapping */
+    TonemappingMode["None"] = "none";
+    /** Tonemapping with a polynomial fit of the ACES transform */
+    TonemappingMode["ACES"] = "aces";
+    /** Tonemapping with a simpler fit of the ACES transform */
+    TonemappingMode["ACESApproximated"] = "aces approximated";
+    /** Tonemapping with the global Reinhard operator */
+    TonemappingMode["Reinhard"] = "reinhard";
+    /** Tonemapping with an exponential curve */
+    TonemappingMode["Exponential"] = "exponential";
+})(TonemappingMode || (TonemappingMode = {}));
 /** HDR settings */
 export class HdrSettings {
-    exposure = 1.5;
+    exposure = 1.0;
+    tonemapping = TonemappingMode.Reinhard;
 }
 /** Texture streaming settings */
 export class TextureStreamingSettings {
@@ -433,6 +448,7 @@ export class MeshComponent {
     material = null;
     mesh = null;
     skin = null;
+    morphTargets = null;
 }
 /** Text effect type enum */
 export var TextEffectType;
@@ -443,7 +459,7 @@ export var TextEffectType;
 /** 'text' component configuration */
 export class TextComponent {
     alignment = 'center';
-    justification = 'middle';
+    verticalAlignment = 'middle';
     characterSpacing = 0.0;
     lineSpacing = 1.2;
     effect = TextEffectType.None;
@@ -622,7 +638,7 @@ export class LanguageResource {
     strings = {};
 }
 /**
- * @brief Access to Wonderland Editor's data
+ * Access to Wonderland Editor's data.
  *
  * Hold control and hover any field in Wonderland Editor to see its JSON path.
  * The path is equivalent to how you find the matching chain of properties.

package/dist/native.d.ts

@@ -7,14 +7,19 @@ interface NativeToolsAPI {
 }
 interface NativeUiAPI {
     freeImage(id: number): void;
-    loadImage(path: string, cb: (id: number) => void): void;
+    loadImage(data: ArrayBuffer): [number, number];
     text(text: string): void;
     label(text: string): void;
     button(label: string): boolean;
     image(id: number, width: number, height: number): boolean;
     inputText(label: string, value: string): string | null;
+    checkbox(label: string, value: boolean): boolean | null;
+    colorEdit4(label: string, value: Float32Array): boolean;
     dummy(width: number, height: number): void;
     sameLine(offset: number): void;
+    separator(): void;
+    beginGroup(): void;
+    endGroup(): void;
 }
 declare global {
     function _wl_internalBinding(moduleName: 'tools'): NativeToolsAPI;

package/dist/tools.d.ts

@@ -1,3 +1,5 @@
+/** @hidden */
+export declare function awaitJob(jobId: number): Promise<void>;
 /**
  * Package the current project
  * @param destDir Destination directory into which to package, default `'<project-root>/deploy'`.

package/dist/tools.js

@@ -1,5 +1,6 @@
 const tools = _wl_internalBinding('tools');
-function awaitJob(jobId) {
+/** @hidden */
+export function awaitJob(jobId) {
     return new Promise((resolve, reject) => {
         tools.awaitJob(jobId, (success) => {
             if (success)

package/dist/ui.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="node" resolution-mode="require"/>
 /** Image to be used in the {@ref Ui}. */
 export declare class UiImage {
     _id: number;
@@ -17,7 +18,7 @@ export declare const label: (text: string) => void;
  * @example
  * In a draw function of a plugin, use as follows:
  * ```ts
- * if(WLE.button('Click me!')) {
+ * if(ui.button('Click me!')) {
  *     console.log('You clicked the button.');
  * }
  * ```
@@ -33,21 +34,67 @@ export declare const button: (label: string) => boolean;
  * In a draw function of a plugin, use as follows:
  * ```ts
  * this.thumbnail = null;
- * loadUiImage("cache/plugins/my-plugin/downloads/thumbnail.png")
+ * loadImage(fs.readFileSync("cache/plugins/my-plugin/downloads/thumbnail.png"))
  *     .then((img) => this.thumbnail = img);
  * ```
  *
  * @see image()
  */
-export declare function loadUiImage(filepath: string): Promise<UiImage>;
+export declare function loadImage(data: ArrayBuffer | Buffer): Promise<UiImage>;
 export declare function image(image: UiImage, width: number, height: number): boolean;
 /**
  * Text input field.
  *
- * @usage
- * s = ui.inputText("change this:", s) || s;
+ * @param label Label to display next to the field.
+ * @param value Current value to set the field to.
+ * @returns The new string value when changed by the user this frame, otherwise `null`.
+ *
+ * @example
+ *     s = ui.inputText("change this:", s) || s;
  */
 export declare const inputText: (label: string, value: string) => string | null;
-export declare function inputColor4(label: string, value: ArrayLike<number>): boolean;
+/**
+ * Checkbox.
+ *
+ * @param label Label to display next to the checkbox.
+ * @param value Current value to set the checkbox to.
+ * @returns The new boolean value when changed by the user this frame, otherwise `null`.
+ *
+ * @example
+ *     const n = ui.checkbox("change this:", myBool);
+ *     if(n !== null) myBool = n;
+ */
+export declare const checkbox: (label: string, value: boolean) => boolean | null;
+/**
+ * Color picker for RGBA color.
+ *
+ * @param label Label to display next to the picker.
+ * @param value Value to be in-place edited.
+ * @returns `true` if changed by the user this frame, `false` otherwise.
+ *
+ * @example
+ *     const col = new Float32Array(4);
+ *     if(ui.colorEdit4("My color:", col)) {
+ *         console.log("Changed!");
+ *     }
+ */
+export declare const colorEdit4: (label: string, value: Float32Array) => boolean;
+/**
+ * Dummy element (space).
+ *
+ * @param width Width of the dummy element
+ * @param height Height of the dummy element
+ */
 export declare const dummy: (width: number, height: number) => void;
+/**
+ * Draw next widget on the same line.
+ *
+ * @param offset Offset on the x axis.
+ */
 export declare const sameLine: (offset: number) => void;
+/** Separator line. */
+export declare const separator: () => void;
+/** Begin a widget group. */
+export declare const beginGroup: () => void;
+/** End a widget group. */
+export declare const endGroup: () => void;

package/dist/ui.js

@@ -1,3 +1,4 @@
+import { awaitJob } from './tools.js';
 const ui = _wl_internalBinding('ui');
 /** Image to be used in the {@ref Ui}. */
 export class UiImage {
@@ -23,7 +24,7 @@ export const label = ui.label.bind(ui);
  * @example
  * In a draw function of a plugin, use as follows:
  * ```ts
- * if(WLE.button('Click me!')) {
+ * if(ui.button('Click me!')) {
  *     console.log('You clicked the button.');
  * }
  * ```
@@ -39,41 +40,85 @@ export const button = ui.button.bind(ui);
  * In a draw function of a plugin, use as follows:
  * ```ts
  * this.thumbnail = null;
- * loadUiImage("cache/plugins/my-plugin/downloads/thumbnail.png")
+ * loadImage(fs.readFileSync("cache/plugins/my-plugin/downloads/thumbnail.png"))
  *     .then((img) => this.thumbnail = img);
  * ```
  *
  * @see image()
  */
-export function loadUiImage(filepath) {
-    // Wrapper around a GL::Texture. People will be tempted calling
-    // this in weird places, so better just throw it on the JobSystem
-    // for the MainThread and spread it over time.
-    return new Promise((resolve, reject) => {
-        ui.loadImage(filepath, (id) => {
-            if (id < 0) {
-                reject();
-                return;
-            }
-            resolve(new UiImage(id));
-        });
-    });
+export async function loadImage(data) {
+    if (!(data instanceof ArrayBuffer)) {
+        const converted = new Uint8Array(data.byteLength);
+        for (let i = 0; i < data.byteLength; ++i) {
+            converted[i] = data[i];
+        }
+        data = converted.buffer;
+    }
+    /* Wrapper around a GL::Texture. People will be tempted calling
+     * this in weird places, so better just throw it on the JobSystem
+     * for the MainThread and spread it over time. */
+    const [job, imageId] = ui.loadImage(data);
+    await awaitJob(job);
+    return new UiImage(imageId);
 }
 export function image(image, width, height) {
-    // Since ImGui expects GL::Texture, we load the image for the user
-    // from filepath. Avoids them pulling in pngjs and other mistakes
+    /* Since ImGui expects GL::Texture, we load the image for the user
+     * from filepath. Avoids them pulling in pngjs and other mistakes */
     return ui.image(image._id, width, height);
 }
 /**
  * Text input field.
  *
- * @usage
- * s = ui.inputText("change this:", s) || s;
+ * @param label Label to display next to the field.
+ * @param value Current value to set the field to.
+ * @returns The new string value when changed by the user this frame, otherwise `null`.
+ *
+ * @example
+ *     s = ui.inputText("change this:", s) || s;
  */
 export const inputText = ui.inputText.bind(ui);
-export function inputColor4(label, value) {
-    // We can in-place edit Float32Array, probably even number array
-    return false;
-}
+/**
+ * Checkbox.
+ *
+ * @param label Label to display next to the checkbox.
+ * @param value Current value to set the checkbox to.
+ * @returns The new boolean value when changed by the user this frame, otherwise `null`.
+ *
+ * @example
+ *     const n = ui.checkbox("change this:", myBool);
+ *     if(n !== null) myBool = n;
+ */
+export const checkbox = ui.checkbox.bind(ui);
+/**
+ * Color picker for RGBA color.
+ *
+ * @param label Label to display next to the picker.
+ * @param value Value to be in-place edited.
+ * @returns `true` if changed by the user this frame, `false` otherwise.
+ *
+ * @example
+ *     const col = new Float32Array(4);
+ *     if(ui.colorEdit4("My color:", col)) {
+ *         console.log("Changed!");
+ *     }
+ */
+export const colorEdit4 = ui.colorEdit4.bind(ui);
+/**
+ * Dummy element (space).
+ *
+ * @param width Width of the dummy element
+ * @param height Height of the dummy element
+ */
 export const dummy = ui.dummy.bind(ui);
+/**
+ * Draw next widget on the same line.
+ *
+ * @param offset Offset on the x axis.
+ */
 export const sameLine = ui.sameLine.bind(ui);
+/** Separator line. */
+export const separator = ui.separator.bind(ui);
+/** Begin a widget group. */
+export const beginGroup = ui.beginGroup.bind(ui);
+/** End a widget group. */
+export const endGroup = ui.endGroup.bind(ui);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wonderlandengine/editor-api",
-  "version": "1.2.0-dev.0",
+  "version": "1.2.0-dev.2",
   "description": "Wonderland Engine's Editor API for plugins - very experimental.",
   "main": "./dist/index.js",
   "module": "./dist/index.js",
@@ -24,23 +24,25 @@
     "url": "https://discord.wonderlandengine.com/"
   },
   "homepage": "https://wonderlandengine.com/editor/plugins/",
+  "prettier": "@wonderlandengine/prettier-config",
   "scripts": {
     "build": "tsc",
     "build:watch": "tsc --watch",
     "defaults": "npm run build && npm run doc && node scripts/generate-defaults.mjs ./doc.json",
-    "pretty": "prettier --config ./prettierrc.json --write ./src",
+    "pretty": "prettier --write ./src",
+    "pretty:check": "prettier --check \"src/**/*.ts\" \"test/**/*.ts\"",
     "doc": "typedoc --entryPoints ./src/index.ts --tsconfig tsconfig.json --json ./doc.json",
-    "json-diff": "npm run defaults && npx json-diff ../../src/WonderlandEditor/defaults.json defaults.json",
-    "prepublishOnly": "npm run build"
+    "json-diff": "npm run defaults && npx json-diff ../../src/WonderlandEditor/Test/defaults.json defaults.json",
+    "prepack": "npm run build"
   },
-  "peerDependencies": {},
   "devDependencies": {
     "@types/node": "^18.11.9",
+    "@wonderlandengine/prettier-config": "^1.0.0",
     "prettier": "^2.8.0",
     "typedoc": "^0.23.21",
     "typescript": "^4.9.3"
   },
   "files": [
-      "dist"
+    "dist"
   ]
 }