gl-draw 0.6.1 → 0.6.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "gl-draw",
-  "version": "0.6.1",
+  "version": "0.6.2",
   "author": "gitplus <hstits@gmail.com>",
   "scripts": {
     "start": "PORT=3003 bundler-dev",
@@ -71,7 +71,8 @@
     "vue": "^3.2.31",
     "vue-auto-routing": "^1.0.1",
     "vue-bundler": "^0.1.56",
-    "vue-router": "^4.0.14"
+    "vue-router": "^4.0.14",
+    "three": "^0.144.0"
   },
   "dependencies": {
     "@turf/boolean-clockwise": "^6.5.0",
@@ -85,8 +86,7 @@
     "earcut": "2",
     "idb-keyval": "^6.1.0",
     "lil-gui": "^0.17.0",
-    "popmotion": "^11.0.5",
-    "three": "^0.136.0"
+    "popmotion": "^11.0.5"
   },
   "msw": {
     "workerDirectory": "public"

package/dist/constants.d.ts

@@ -1,4 +0,0 @@
-export declare const ENTIRE_SCENE = 0;
-export declare const BLOOM_SCENE = 1;
-export declare const IS_DEV: boolean;
-export declare const WEBGLE2_AVAILABLE: boolean;

package/dist/core/BaseObject.d.ts

@@ -1,45 +0,0 @@
-import * as THREE from 'three';
-import type Pencil from '../core/Pencil';
-export { CSS3DObject, CSS3DSprite, } from 'three/examples/jsm/renderers/CSS3DRenderer';
-export { CSS2DObject } from 'three/examples/jsm/renderers/CSS2DRenderer';
-export default class BaseObject {
-    objecttype__: string;
-    key: string;
-    pencil: Pencil;
-    object3d: THREE.Object3D;
-    userData: Record<string, any>;
-    get parent(): IBaseObject | THREE.Scene;
-    get children(): IBaseObject[];
-    pm: {
-        promise: Promise<any>;
-        resolve: (value?: any) => void;
-        reject: (value?: any) => void;
-    };
-    visible: boolean;
-    init(): void;
-    create(): void;
-    render(): void;
-    update(delta: number, elapsed: number): void;
-    resize(width: number, height: number): void;
-    show(): this;
-    hide(): this;
-    isVisible(): boolean;
-    createMesh(...args: ConstructorParameters<typeof THREE.Mesh>): this;
-    createGroup(): this;
-    createPoints(...args: ConstructorParameters<typeof THREE.Points>): this;
-    createCSS2DObject(dom: HTMLElement): this;
-    createCSS3DObject(dom: HTMLElement): this;
-    createCSS3DSprite(dom: HTMLElement): this;
-    createSprite(material: THREE.SpriteMaterial): this;
-    add(...args: Parameters<THREE.Object3D['add']>): this;
-    remove(...args: Parameters<THREE.Object3D['remove']>): this;
-    getSize(): {
-        min: THREE.Vector3;
-        max: THREE.Vector3;
-        size: THREE.Vector3;
-    };
-    traverse(fn: (o: IBaseObject) => void): void;
-    dispose(): void;
-}
-export interface IBaseObject extends BaseObject {
-}

package/dist/core/CSSRenderer/CSS2DRenderer.d.ts

@@ -1,17 +0,0 @@
-import {Scene, Camera} from 'three';
-
-export type CSS2DParameters = {
-  element?: HTMLElement;
-};
-
-export class CSS2DRenderer {
-  constructor(parameters?: CSS2DParameters);
-
-  domElement: HTMLElement;
-
-  getSize(): {width: number; height: number};
-
-  setSize(width: number, height: number): void;
-
-  render(scene: Scene, camera: Camera): void;
-}

package/dist/core/CSSRenderer/index.d.ts

@@ -1,19 +0,0 @@
-import * as THREE from 'three';
-import { CSS3DRenderer } from 'three/examples/jsm/renderers/CSS3DRenderer';
-import { CSS2DRenderer } from './CSS2DRenderer';
-export interface CSSRendererParams {
-    zIndex: string;
-}
-export declare const defaultCSSRendererParams: {
-    zIndex: string;
-};
-export default class {
-    css2Drenderer?: CSS2DRenderer;
-    css3Drenderer?: CSS3DRenderer;
-    container: HTMLElement;
-    constructor(container: HTMLElement);
-    addRenderer(type: 'css2d' | 'css3d', cssRendererParams: CSSRendererParams): void;
-    setSize(width: number, height: number): void;
-    render(scene: THREE.Scene, camera: THREE.PerspectiveCamera): void;
-    dispose(): void;
-}

package/dist/core/Camera.d.ts

@@ -1,30 +0,0 @@
-import * as THREE from 'three';
-import GUI from 'lil-gui';
-export interface CameraParams {
-    fov: number;
-    near: number;
-    far: number;
-}
-export declare const defaultCameraParams: {
-    fov: number;
-    near: number;
-    far: number;
-};
-interface Options {
-    width: number;
-    height: number;
-    isdev: boolean;
-    cameraParams: CameraParams | THREE.PerspectiveCamera;
-}
-export default class {
-    options: Options;
-    camera: THREE.PerspectiveCamera;
-    oldCameraPosition: THREE.Vector3;
-    oldCameraRotation: THREE.Euler;
-    customCamera: boolean;
-    checkCameraChange(): boolean;
-    constructor(options: Options);
-    setSize(width: number, height: number): void;
-    setGui(gui: GUI): void;
-}
-export {};

package/dist/core/Composer.d.ts

@@ -1,60 +0,0 @@
-import * as THREE from 'three';
-import GUI from 'lil-gui';
-import { EffectComposer } from 'three/examples/jsm/postprocessing/EffectComposer';
-import { RenderPass } from 'three/examples/jsm/postprocessing/RenderPass';
-import { ShaderPass } from 'three/examples/jsm/postprocessing/ShaderPass';
-import { SMAAPass } from 'three/examples/jsm/postprocessing/SMAAPass';
-import { SSAARenderPass } from 'three/examples/jsm/postprocessing/SSAARenderPass';
-import BloomController, { BloomParams } from './pass/bloom';
-import OutlineController, { OutlineParams } from './pass/outline';
-import SSRController, { SSRParams } from './pass/ssr';
-export interface ComposerParams {
-    multisampling: number;
-    type: THREE.TextureDataType;
-    encoding: THREE.TextureEncoding;
-}
-interface Options {
-    renderer: THREE.WebGLRenderer;
-    scene: THREE.Scene;
-    camera: THREE.Camera;
-    gui?: GUI;
-    composerParams: ComposerParams;
-}
-export default class {
-    renderer: THREE.WebGLRenderer;
-    scene: THREE.Scene;
-    camera: THREE.Camera;
-    finalComposer: EffectComposer;
-    renderPass: RenderPass;
-    copyPass?: ShaderPass;
-    gammaCorrectionPass?: ShaderPass;
-    smaaPass?: SMAAPass;
-    fxaaPass?: ShaderPass;
-    ssaaPass?: SSAARenderPass;
-    bloomController?: BloomController;
-    outlineController?: OutlineController;
-    ssrController?: SSRController;
-    renderTarget: THREE.WebGLRenderTarget;
-    options: Options;
-    active: boolean;
-    constructor(options: Options);
-    createRenderTarget(): THREE.WebGLRenderTarget;
-    addRenderPasss(): void;
-    addCopyPass(): void;
-    addGammaCorrectionPass(): void;
-    addFXAAPass(): void;
-    addSMAAPass(): void;
-    addSSAAPass(): void;
-    addBloomPass(bloomParams: BloomParams): void;
-    addOutlinePass(outlineParams: OutlineParams): void;
-    addSSRPass(ssrParams: SSRParams): void;
-    getSize(): THREE.Vector2;
-    enable(): void;
-    disable(): void;
-    checkCopyPass(): void;
-    setSize(width: number, height: number): void;
-    setFXAAPassSize(width: number, height: number): void;
-    render(): void;
-    dispose(): void;
-}
-export {};

package/dist/core/Control.d.ts

@@ -1,28 +0,0 @@
-import * as THREE from 'three';
-import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls';
-export interface ControlParams {
-    domElement: HTMLElement;
-}
-export declare const defaultControlParams: {};
-interface Options {
-    camera: THREE.Camera;
-    controlParams: ControlParams;
-    mapControl?: boolean;
-}
-export default class {
-    options: Options;
-    control: OrbitControls;
-    private limitPanV?;
-    constructor(options: Options);
-    limitPan({ maxX, minX, maxZ, minZ, maxY, minY, }: {
-        maxX?: number | undefined;
-        minX?: number | undefined;
-        maxZ?: number | undefined;
-        minZ?: number | undefined;
-        maxY?: number | undefined;
-        minY?: number | undefined;
-    }): void;
-    update(): void;
-    dispose(): void;
-}
-export {};

package/dist/core/GUIObject.d.ts

@@ -1,24 +0,0 @@
-import GUI from 'lil-gui';
-interface GuiParams {
-    [key: string]: {
-        [key: string]: {
-            value?: any;
-            name?: string;
-            items?: string[] | object;
-            min?: number;
-            max?: number;
-            step?: number;
-            paramMap?: string;
-            target?: () => any;
-            onChange?: (value: any) => any;
-        };
-    };
-}
-export default class GUIObject {
-    guiParams: GuiParams;
-    constructor(guiParams?: GuiParams);
-    showGui(gui?: GUI): void;
-    setTargetValue(key: string, param: string, value: any, paramMap?: string): void;
-    setTargetValueByParams(): void;
-}
-export {};

package/dist/core/Pencil.d.ts

@@ -1,146 +0,0 @@
-/// <reference types="node" />
-import * as THREE from 'three';
-import { EventEmitter } from 'events';
-import Stats from 'three/examples/jsm/libs/stats.module';
-import GUI from 'lil-gui';
-import { RendererParams } from '../core/Renderer';
-import { CameraParams } from '../core/Camera';
-import SceneController, { SceneParams } from '../core/Scene';
-import ControlController, { ControlParams } from '../core/Control';
-import CSSRendererController, { CSSRendererParams } from '../core/CSSRenderer';
-import ComposerController from '../core/Composer';
-import { BloomParams } from '../core/pass/bloom';
-import { OutlineParams } from '../core/pass/outline';
-import { SSRParams } from '../core/pass/ssr';
-declare type DeepRequired<T> = T extends Function | HTMLElement ? T : T extends object ? {
-    [P in keyof T]-?: DeepRequired<T[P]>;
-} : T;
-interface Options {
-    container: HTMLElement;
-    isdev?: boolean;
-    stats?: boolean;
-    gui?: boolean;
-    axesHelper?: boolean;
-    control?: boolean;
-    mapControl?: boolean;
-    controlParams?: Partial<ControlParams>;
-    resizeObserver?: boolean;
-    renderer?: {
-        antialias?: false | 'fxaa' | 'smaa' | 'ssaa' | 'msaa';
-    } & Omit<Partial<RendererParams>, 'antialias'>;
-    multisampling?: number;
-    staticRender?: boolean;
-    scene?: Partial<SceneParams>;
-    camera?: Partial<CameraParams> | THREE.PerspectiveCamera;
-    bloom?: boolean;
-    bloomParams?: Partial<BloomParams>;
-    outline?: boolean;
-    outlineParams?: Partial<OutlineParams>;
-    ssr?: boolean;
-    ssrParams?: Partial<SSRParams>;
-    css2DRenderer?: boolean;
-    css2DRendererParams?: Partial<CSSRendererParams>;
-    css3DRenderer?: boolean;
-    css3DRendererParams?: Partial<CSSRendererParams>;
-}
-export default class Pencil {
-    options: Omit<DeepRequired<Options>, 'controlParams'> & Pick<Options, 'controlParams'>;
-    composerController: ComposerController;
-    private rendererController;
-    cssRendererController?: CSSRendererController;
-    private cameraController;
-    controlController?: ControlController;
-    sceneController: SceneController;
-    stats?: Stats;
-    gui?: GUI;
-    private resizeObserver;
-    private raycaster;
-    installPlugins: Map<any, boolean>;
-    get renderer(): THREE.WebGLRenderer;
-    get control(): import("three/examples/jsm/controls/OrbitControls").OrbitControls | undefined;
-    get camera(): THREE.PerspectiveCamera;
-    get scene(): THREE.Scene;
-    event: EventEmitter;
-    clock: THREE.Clock;
-    static options: {
-        isdev: boolean;
-        stats: boolean;
-        gui: boolean;
-        axesHelper: boolean;
-        control: boolean;
-        resizeObserver: boolean;
-        renderer: {
-            antialias: string;
-            devicePixelRatio: number;
-            powerPreference: string;
-            toneMapping: string;
-            toneMappingExposure: number;
-            alpha: boolean;
-            outputEncoding: THREE.TextureEncoding;
-            logarithmicDepthBuffer: boolean;
-            preserveDrawingBuffer: boolean;
-            context: null;
-        };
-        staticRender: boolean;
-        multisampling: number;
-        scene: {
-            background: null;
-        };
-        camera: {
-            fov: number;
-            near: number;
-            far: number;
-        };
-        bloom: boolean;
-        bloomParams: {
-            threshold: number;
-            strength: number;
-            radius: number;
-        };
-        outline: boolean;
-        outlineParams: {
-            edgeStrength: number;
-            edgeGlow: number;
-            edgeThickness: number;
-            pulsePeriod: number;
-            rotate: boolean;
-            usePatternTexture: boolean;
-            visibleEdgeColor: string;
-            hiddenEdgeColor: string;
-        };
-        css2DRenderer: boolean;
-        ssr: boolean;
-        ssrParams: {
-            maxDistance: number;
-            selects: boolean;
-        };
-        css2DRendererParams: {
-            zIndex: string;
-        };
-        css3DRenderer: boolean;
-        css3DRendererParams: {
-            zIndex: string;
-        };
-    };
-    constructor(options: Options);
-    use(plugin: any, ...args: any[]): void;
-    private init;
-    private initComposer;
-    private initCSSRenderer;
-    private initControl;
-    getSize(): {
-        width: number;
-        height: number;
-    };
-    initResizeObserver(): void;
-    private handeleResize;
-    pick(event: MouseEvent, objects?: THREE.Object3D[], recursive?: boolean): {
-        object: THREE.Object3D<THREE.Event>;
-        intersects: THREE.Intersection<THREE.Object3D<THREE.Event>>[];
-    } | undefined;
-    render(): void;
-    start(): void;
-    stop(): void;
-    dispose(): void;
-}
-export {};

package/dist/core/Renderer.d.ts

@@ -1,51 +0,0 @@
-import * as THREE from 'three';
-import GUI from 'lil-gui';
-declare const toneMappingOptions: {
-    None: THREE.ToneMapping;
-    Linear: THREE.ToneMapping;
-    Reinhard: THREE.ToneMapping;
-    Cineon: THREE.ToneMapping;
-    ACESFilmic: THREE.ToneMapping;
-};
-export interface RendererParams {
-    antialias: boolean;
-    devicePixelRatio: number;
-    powerPreference: 'high-performance' | 'low-power' | 'default';
-    toneMapping: keyof typeof toneMappingOptions;
-    toneMappingExposure: number;
-    alpha: boolean;
-    outputEncoding: THREE.TextureEncoding;
-    logarithmicDepthBuffer: boolean;
-    preserveDrawingBuffer: boolean;
-    context: WebGLRenderingContext | undefined;
-}
-export declare const defaultRendererParams: {
-    antialias: boolean;
-    devicePixelRatio: number;
-    powerPreference: string;
-    toneMapping: string;
-    toneMappingExposure: number;
-    alpha: boolean;
-    outputEncoding: THREE.TextureEncoding;
-    logarithmicDepthBuffer: boolean;
-    preserveDrawingBuffer: boolean;
-    context: null;
-};
-interface Options {
-    isdev: boolean;
-    width: number;
-    height: number;
-    scene: THREE.Scene;
-    camera: THREE.Camera;
-    rendererParams: RendererParams;
-}
-export default class {
-    renderer: THREE.WebGLRenderer;
-    options: Options;
-    constructor(options: Options);
-    setSize(width: number, height: number): void;
-    render(): void;
-    setGui(gui: GUI): void;
-    dispose(): void;
-}
-export {};

package/dist/core/Scene.d.ts

@@ -1,19 +0,0 @@
-import * as THREE from 'three';
-export interface SceneParams {
-    background: THREE.Scene['background'];
-}
-export declare const defaultSceneParams: {
-    background: null;
-};
-interface Options {
-    camera: THREE.Camera;
-    sceneParams: SceneParams;
-}
-export default class {
-    options: Options;
-    scene: THREE.Scene;
-    constructor(options: Options);
-    addAxesHelper(): void;
-    dispose(): void;
-}
-export {};

package/dist/core/pass/bloom/UnrealBloomPass.d.ts

@@ -1,46 +0,0 @@
-import { Color, MeshBasicMaterial, ShaderMaterial, Texture, Vector2, Vector3, WebGLRenderer, WebGLRenderTarget } from 'three';
-import { Pass, FullScreenQuad } from 'three/examples/jsm/postprocessing/Pass';
-/**
- * Thanks to https://github.com/mrdoob/three.js/issues/14104#issuecomment-429664412 for this fragmentShaderfix
- *
- * UnrealBloomPass is inspired by the bloom pass of Unreal Engine. It creates a
- * mip map chain of bloom textures and blurs them with different radii. Because
- * of the weighted combination of mips, and because larger blurs are done on
- * higher mips, this effect provides good quality and performance.
- *
- * Reference:
- * - https://docs.unrealengine.com/latest/INT/Engine/Rendering/PostProcessEffects/Bloom/
- */
-declare class UnrealBloomPass extends Pass {
-    strength: number;
-    radius: number;
-    threshold: number;
-    resolution: Vector2;
-    clearColor: Color;
-    renderTargetsHorizontal: any[];
-    renderTargetsVertical: any[];
-    nMips: number;
-    renderTargetBright: WebGLRenderTarget;
-    highPassUniforms: any;
-    materialHighPassFilter: ShaderMaterial;
-    separableBlurMaterials: any[];
-    compositeMaterial: ShaderMaterial;
-    bloomTintColors: Vector3[];
-    copyUniforms: any;
-    materialCopy: ShaderMaterial;
-    _oldClearColor: Color;
-    oldClearAlpha: number;
-    basic: MeshBasicMaterial;
-    fsQuad: FullScreenQuad;
-    static BlurDirectionX: any;
-    static BlurDirectionY: any;
-    constructor(resolution: Vector2, strength: number, radius: number, threshold: number);
-    dispose(): void;
-    setSize(width: number, height: number): void;
-    render(renderer: WebGLRenderer, writeBuffer: any, readBuffer: {
-        texture: Texture;
-    }, deltaTime: any, maskActive: any): void;
-    getSeperableBlurMaterial(kernelRadius: number): ShaderMaterial;
-    getCompositeMaterial(nMips: number): ShaderMaterial;
-}
-export { UnrealBloomPass };

package/dist/core/pass/bloom/index.d.ts

@@ -1,33 +0,0 @@
-import * as THREE from 'three';
-import { ShaderPass } from 'three/examples/jsm/postprocessing/ShaderPass';
-import { EffectComposer } from 'three/examples/jsm/postprocessing/EffectComposer';
-import GUI from 'lil-gui';
-import ComposerController from '../../../core/Composer';
-import { UnrealBloomPass } from './UnrealBloomPass';
-export interface BloomParams {
-    threshold: number;
-    strength: number;
-    radius: number;
-}
-export declare const defaultBloomParams: {
-    threshold: number;
-    strength: number;
-    radius: number;
-};
-export default class {
-    composerController: ComposerController;
-    bloomComposer: EffectComposer;
-    bloomPass: UnrealBloomPass;
-    finalPass: ShaderPass;
-    options: BloomParams;
-    materials: Record<string, any>;
-    bloomLayer: THREE.Layers;
-    active: boolean;
-    constructor(composerController: ComposerController, options: BloomParams);
-    enable(): void;
-    disable(): void;
-    render(scene: THREE.Scene): void;
-    setSize(width: number, height: number): void;
-    setGui(gui: GUI): void;
-    dispose(): void;
-}

package/dist/core/pass/outline/index.d.ts

@@ -1,37 +0,0 @@
-import * as THREE from 'three';
-import { OutlinePass } from 'three/examples/jsm/postprocessing/OutlinePass';
-import GUIObject from '../../../core/GUIObject';
-import ComposerController from '../../../core/Composer';
-export interface OutlineParams {
-    edgeStrength: number;
-    edgeGlow: number;
-    edgeThickness: number;
-    pulsePeriod: number;
-    rotate: boolean;
-    usePatternTexture: boolean;
-    visibleEdgeColor: string;
-    hiddenEdgeColor: string;
-}
-export declare const defaultOutlineParams: {
-    edgeStrength: number;
-    edgeGlow: number;
-    edgeThickness: number;
-    pulsePeriod: number;
-    rotate: boolean;
-    usePatternTexture: boolean;
-    visibleEdgeColor: string;
-    hiddenEdgeColor: string;
-};
-export default class {
-    composerController: ComposerController;
-    outlinePass: OutlinePass;
-    options: OutlineParams;
-    selectedObjects: THREE.Mesh[];
-    active: boolean;
-    outlineGui: GUIObject;
-    constructor(composerController: ComposerController, options: OutlineParams);
-    enable(): void;
-    disable(): void;
-    setGui(): void;
-    dispose(): void;
-}

package/dist/core/pass/ssr/index.d.ts

@@ -1,38 +0,0 @@
-import * as THREE from 'three';
-import { SSRPass } from 'three/examples/jsm/postprocessing/SSRPass';
-import { ReflectorForSSRPass } from 'three/examples/jsm/objects/ReflectorForSSRPass';
-import ComposerController from '../../../core/Composer';
-import GUIObject from '../../../core/GUIObject';
-export interface SSRParams {
-    maxDistance: number;
-    selects: boolean;
-}
-export declare const defaultSSRParams: {
-    maxDistance: number;
-    selects: boolean;
-};
-interface GroundReflectorParams {
-    width: number;
-    height: number;
-    clipBias: number;
-    color: number;
-    useDepthTexture: boolean;
-}
-export default class {
-    composerController: ComposerController;
-    ssrPass: SSRPass;
-    options: SSRParams;
-    selectedObjects: THREE.Mesh[];
-    groundReflector?: ReflectorForSSRPass;
-    ssrGui: GUIObject;
-    active: boolean;
-    constructor(composerController: ComposerController, options: SSRParams);
-    addGroundReflector(options?: Partial<GroundReflectorParams>): void;
-    removeaGroundReflector(): void;
-    enable(): void;
-    disable(): void;
-    setSize(width: number, height: number): void;
-    setGui(): void;
-    dispose(): void;
-}
-export {};

package/dist/effect/bloom.d.ts

@@ -1,14 +0,0 @@
-import type { IBaseObject } from '../core/BaseObject';
-interface Options {
-    exclude?: THREE.Mesh[];
-    include?: THREE.Mesh[];
-}
-export default class {
-    object: IBaseObject;
-    options: Options;
-    constructor(object: IBaseObject, options?: Options);
-    private check;
-    enable(): void;
-    disable(): void;
-}
-export {};

package/dist/effect/index.d.ts

@@ -1,5 +0,0 @@
-export { default as Bloom } from './bloom';
-export { default as Outline } from './outline';
-export { default as SSR } from './ssr';
-export { default as Scan } from './scan';
-export { default as Scan2 } from './scan2';