@leafer/interface 1.0.0-beta.4 → 1.0.0-beta.6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@leafer/interface",
-  "version": "1.0.0-beta.4",
+  "version": "1.0.0-beta.6",
   "description": "@leafer/interface",
   "author": "Chao (Leafer) Wan",
   "license": "MIT",

package/src/app/ILeafer.ts

@@ -15,6 +15,7 @@ import { IZoomView } from '../display/IView'
 import { IApp } from './IApp'
 import { ILeaferImage, ILeaferImageConfig } from '../image/ILeaferImage'
 import { IControl } from '../control/IControl'
+import { IFunction } from '../function/IFunction'
 
 
 export type ILeaferType = 'draw' | 'design' | 'board' | 'document' | 'user'
@@ -32,6 +33,7 @@ export interface ILeafer extends IZoomView, IControl {
     running: boolean
     ready: boolean
     viewReady: boolean
+    readonly viewLoaded: boolean
 
     pixelRatio: number
 
@@ -57,8 +59,10 @@ export interface ILeafer extends IZoomView, IControl {
     __eventIds: IEventListenerId[]
 
     init(userConfig?: ILeaferConfig, parentApp?: IApp): void
+    setZoomLayer(zoomLayer: ILeaf, moveLayer?: ILeaf): void
     forceFullRender(): void
     resize(size: IScreenSizeData): void
+    waitViewLoaded(fun: IFunction): void
 }
 
 export interface ILeaferTypeCreator {

package/src/canvas/ICanvas.ts

@@ -67,6 +67,10 @@ declare var CanvasGradient: {
     new(): CanvasGradient
 }
 
+interface ImageDataSettings {
+    colorSpace?: PredefinedColorSpace
+}
+
 interface CanvasImageData {
     createImageData(sw: number, sh: number, settings?: ImageDataSettings): ImageData
     createImageData(imagedata: ImageData): ImageData

package/src/canvas/ILeaferCanvas.ts

@@ -117,6 +117,7 @@ interface ICanvasMethod {
     copyWorld(canvas: ILeaferCanvas, fromBounds?: IBoundsData, toBounds?: IBoundsData, blendMode?: string): void
     copyWorldToInner(canvas: ILeaferCanvas, fromWorld: IMatrixWithBoundsData, toInnerBounds: IBoundsData, blendMode?: string): void
     useMask(maskCanvas: ILeaferCanvas, fromBounds?: IBoundsData, toBounds?: IBoundsData): void
+    useEraser(eraserCanvas: ILeaferCanvas, fromBounds?: IBoundsData, toBounds?: IBoundsData): void
 
     fillWorld(bounds: IBoundsData, color: string | object, blendMode?: string): void
     strokeWorld(bounds: IBoundsData, color: string | object, blendMode?: string): void
@@ -139,7 +140,10 @@ export interface ILeaferCanvas extends ICanvasAttr, ICanvasMethod, IPathDrawer {
     pixelRatio: number
     readonly pixelWidth: number
     readonly pixelHeight: number
+
     readonly allowBackgroundColor?: boolean
+    backgroundColor?: string
+    hittable?: boolean
 
     bounds: IBounds
 
@@ -162,14 +166,15 @@ export interface ILeaferCanvas extends ICanvasAttr, ICanvasMethod, IPathDrawer {
 
     init(): void
 
-    setBackgroundColor(color: string): void
-    setHittable(hittable: boolean): void
+    toBlob(type?: string, quality?: number): Promise<IBlob>
+    toDataURL(type?: string, quality?: number): string
+    saveAs(filename: string, quality?: number): Promise<boolean>
 
     startAutoLayout(autoBounds: IAutoBounds, listener: IResizeEventListener): void
     stopAutoLayout(): void
 
     resize(size: IScreenSizeData): void
-    setViewSize(size: IScreenSizeData): void
+    updateViewSize(): void
 
     // other
     isSameSize(options: ILeaferCanvasConfig): boolean
@@ -182,4 +187,10 @@ export interface ILeaferCanvas extends ICanvasAttr, ICanvasMethod, IPathDrawer {
 }
 
 
-export type IHitCanvas = ILeaferCanvas
+export type IHitCanvas = ILeaferCanvas
+
+export interface IBlobFunction {
+    (blob: IBlob | null): void
+}
+
+export type IBlob = any

package/src/canvas/ISkiaCanvas.ts

@@ -0,0 +1,20 @@
+import { IExportFileType, IExportImageType } from '../file/IFileType'
+
+export type ICanvasType = 'skia' | 'canvas'
+
+export interface ISkiaCanvas {
+    toBuffer(format: IExportFileType, config: ISkiaCanvasExportConfig): Promise<any>
+    toBufferSync(format: IExportFileType, config: ISkiaCanvasExportConfig): any
+    toDataURL(format: IExportImageType, config: ISkiaCanvasExportConfig): Promise<string>
+    toDataURLSync(format: IExportImageType, config: ISkiaCanvasExportConfig): string
+    saveAs(filename: string, config: ISkiaCanvasExportConfig): Promise<void>
+    saveAsSync(filename: string, config: ISkiaCanvasExportConfig): void
+}
+
+export interface ISkiaCanvasExportConfig {
+    page?: number,
+    matte?: string,
+    density?: number,
+    quality?: number,
+    outline?: boolean
+}

package/src/data/ILeafData.ts

@@ -5,6 +5,10 @@ export interface IDataProcessor extends IObject {
     __leaf: ILeaf
     __input: IObject
     __middle: IObject
+
+    __single: boolean
+    __checkSingle(): void
+
     __get(name: string): unknown
 
     __setInput(name: string, value: unknown): void
@@ -14,6 +18,7 @@ export interface IDataProcessor extends IObject {
 
     __setMiddle(name: string, value: unknown): void
     __getMiddle(name: string): unknown
+
     destroy(): void
 }
 

package/src/display/IBranch.ts

@@ -1,9 +1,8 @@
+import { ILeaferCanvas } from '../canvas/ILeaferCanvas'
+import { IRenderOptions } from '../renderer/IRenderer'
 import { ILeaf } from './ILeaf'
 
 export interface IBranch extends ILeaf {
     children: ILeaf[]
-
-    // __updateSortChildren(): void
-    // add(child: ILeaf, index?: number): void
-    // remove(child?: ILeaf): void
+    __renderBranch?(canvas: ILeaferCanvas, options: IRenderOptions): void
 }

package/src/display/ILeaf.ts

@@ -35,6 +35,7 @@ export interface ILeafAttrData {
     opacity: __Number
     visible: __Boolean
     isMask: __Boolean
+    isEraser?: __Boolean
     zIndex: __Number
 
     // layout data
@@ -100,6 +101,7 @@ export interface ILeafInputData {
     opacity?: __Number
     visible?: __Boolean
     isMask?: __Boolean
+    isEraser?: __Boolean
     zIndex?: __Number
 
     // layout data
@@ -131,6 +133,7 @@ export interface ILeafComputedData {
     opacity?: number
     visible?: boolean
     isMask?: boolean
+    isEraser?: boolean
     zIndex?: number
 
     // layout data
@@ -195,6 +198,7 @@ export interface ILeaf extends ILeafMask, ILeafRender, ILeafHit, ILeafBounds, IL
     __tempNumber?: number // 用于临时运算储存状态
 
     __hasMask?: boolean
+    __hasEraser?: boolean
     __hitCanvas?: IHitCanvas
 
     readonly __onlyHitMask: boolean
@@ -238,6 +242,7 @@ export interface ILeaf extends ILeafMask, ILeafRender, ILeafHit, ILeafBounds, IL
     __onUpdateSize(): void
 
     // IBranchMask ->
+    __updateEraser(value?: boolean): void
     __updateMask(value?: boolean): void
     __renderMask(canvas: ILeaferCanvas, content: ILeaferCanvas, mask: ILeaferCanvas): void
     __removeMask(child?: ILeaf): void
@@ -251,6 +256,10 @@ export interface ILeaf extends ILeafMask, ILeafRender, ILeafHit, ILeafBounds, IL
     worldToInner(world: IPointData, to?: IPointData, isMovePoint?: boolean): void
     innerToWorld(inner: IPointData, to?: IPointData, isMovePoint?: boolean): void
 
+    move(x: number, y?: number): void
+    scaleOf(origin: IPointData, x: number, y?: number): void
+    rotateOf(origin: IPointData, rotation: number): void
+
     // ILeafHit ->
     __hitWorld(point: IRadiusPointData): boolean
     __hit(local: IRadiusPointData): boolean

package/src/display/module/IBranchRender.ts

@@ -0,0 +1,10 @@
+import { ILeaferCanvas } from '../../canvas/ILeaferCanvas'
+import { IRenderOptions } from '../../renderer/IRenderer'
+import { IBranch } from '../IBranch'
+import { ILeafRender } from './ILeafRender'
+
+export type IBranchRenderModule = IBranchRender & ThisType<IBranch>
+
+export interface IBranchRender extends ILeafRender {
+    __renderBranch?(canvas: ILeaferCanvas, options: IRenderOptions): void
+}

package/src/display/module/ILeafMask.ts

@@ -4,6 +4,7 @@ import { ILeaferCanvas } from '../../canvas/ILeaferCanvas'
 export type ILeafMaskModule = ILeafMask & ThisType<ILeaf>
 
 export interface ILeafMask {
+    __updateEraser?(value?: boolean): void
     __updateMask?(value?: boolean): void
     __renderMask?(canvas: ILeaferCanvas, content: ILeaferCanvas, mask: ILeaferCanvas): void
     __removeMask?(child?: ILeaf): void

package/src/event/IEvent.ts

@@ -5,19 +5,19 @@ import { ILeaf } from '../display/ILeaf'
 import { IScreenSizeData } from '../math/IMath'
 
 export interface IEvent {
-    type: string
-    target: IEventTarget
-    current: IEventTarget
+    type?: string
+    target?: IEventTarget
+    current?: IEventTarget
 
     bubbles?: boolean
     phase?: number
 
-    isStopDefault: boolean
-    isStop: boolean
-    isStopNow: boolean
-    stopDefault(): void
-    stopNow(): void
-    stop(): void
+    isStopDefault?: boolean
+    isStop?: boolean
+    isStopNow?: boolean
+    stopDefault?(): void
+    stopNow?(): void
+    stop?(): void
 }
 
 export interface IEventTarget extends IEventer {
@@ -32,6 +32,10 @@ export interface IRenderEvent {
 
 }
 
+export interface IAnimateEvent {
+
+}
+
 export interface IChildEvent extends IEvent {
     parent?: ILeaf
     child?: ILeaf

package/src/event/IUIEvent.ts

@@ -7,33 +7,29 @@ export interface IUIEvent extends IEvent {
     x: number
     y: number
 
-    altKey: boolean
-    ctrlKey: boolean
-    shiftKey: boolean
-    metaKey: boolean
-    readonly spaceKey: boolean
-
-    readonly left: boolean
-    readonly right: boolean
-    readonly middle: boolean
-    buttons: number
-
-    path: ILeafList
+    altKey?: boolean
+    ctrlKey?: boolean
+    shiftKey?: boolean
+    metaKey?: boolean
+    readonly spaceKey?: boolean
+
+    readonly left?: boolean
+    readonly right?: boolean
+    readonly middle?: boolean
+    buttons?: number
+
+    path?: ILeafList
     throughPath?: ILeafList // 穿透path，不受层级影响，从上到下只要碰撞到区域就算，一般点击的时候
 
-    origin: IObject
-
-    stopDefault(): void
-    stopNow(): void
-    stop(): void
+    origin?: IObject
 }
 
 
 export interface IPointerEvent extends IUIEvent {
-    width: number
-    height: number
-    pointerType: PointerType
-    pressure: number
+    width?: number
+    height?: number
+    pointerType?: PointerType
+    pressure?: number
     tangentialPressure?: number
     tiltX?: number
     tiltY?: number

package/src/file/IFileType.ts

@@ -0,0 +1,2 @@
+export type IExportImageType = 'jpg' | 'png' | 'webp'
+export type IExportFileType = IExportImageType | 'svg' | 'pdf' | 'json'

package/src/image/IImageManager.ts

@@ -1,7 +1,10 @@
 import { ILeaferImage, ILeaferImageConfig } from './ILeaferImage'
-
+import { ITaskProcessor } from '../task/ITaskProcessor'
+import { IFunction } from '../function/IFunction'
 
 export interface IImageManager {
+    tasker: ITaskProcessor
     get(config: ILeaferImageConfig): ILeaferImage
+    load(image: ILeaferImage, onSuccess: IFunction, onError: IFunction): void
     destory(): void
 }

package/src/image/ILeaferImage.ts

@@ -18,7 +18,7 @@ export interface ILeaferImage {
     width: number
     height: number
     ready: boolean
-    load(onSuccess?: ILeaferImageOnLoaded, onError?: ILeaferImageOnError): void
+    load(onSuccess?: ILeaferImageOnLoaded, onError?: ILeaferImageOnError): Promise<void>
     getCanvas(width: number, height: number, opacity?: number, _filters?: IObject): unknown
 }
 

package/src/index.ts

@@ -15,6 +15,7 @@ export { ILeafHit, ILeafHitModule } from './display/module/ILeafHit'
 export { ILeafRender, ILeafRenderModule } from './display/module/ILeafRender'
 export { ILeafEventer, ILeafEventerModule } from './display/module/ILeafEventer'
 export { ILeafMask, ILeafMaskModule } from './display/module/ILeafMask'
+export { IBranchRender, IBranchRenderModule } from './display/module/IBranchRender'
 
 export { IRenderer, IRendererConfig, IRenderOptions } from './renderer/IRenderer'
 export { IWatcher, IWatchEventData, IWatcherConfig } from './watcher/IWatcher'
@@ -25,21 +26,25 @@ export { ICanvasManager } from './canvas/ICanvasManager'
 export { IHitCanvasManager } from './canvas/IHitCanvasManager'
 export { IImageManager } from './image/IImageManager'
 
+export { ITaskProcessor, ITaskProcessorConfig } from './task/ITaskProcessor'
+
 
 export { IControl } from './control/IControl'
 export { IPlatform } from './platform/IPlatform'
 export { IPlugin } from './plugin/IPlugin'
 
 
-export { ILeaferCanvas, IHitCanvas, ICanvasAttr, ICanvasStrokeOptions, ILeaferCanvasConfig, IHitCanvasConfig } from './canvas/ILeaferCanvas'
+export { ILeaferCanvas, IHitCanvas, ICanvasAttr, ICanvasStrokeOptions, ILeaferCanvasConfig, IHitCanvasConfig, IBlobFunction, IBlob } from './canvas/ILeaferCanvas'
+export { ISkiaCanvas, ISkiaCanvasExportConfig, ICanvasType } from './canvas/ISkiaCanvas'
 export { IPathDrawer, IPathCreator } from './path/IPathDrawer'
 export { IWindingRule, ICanvasContext2D, ITextMetrics, IPath2D } from './canvas/ICanvas'
 export { CanvasPathCommand, IPathCommandData, MCommandData, HCommandData, VCommandData, LCommandData, CCommandData, SCommandData, QCommandData, TCommandData, ZCommandData, ACommandData, RectCommandData, RoundRectCommandData, EllipseCommandData, ArcCommandData, ArcToCommandData } from './path/IPathCommand'
 
 export { ILeaferImage, ILeaferImageConfig, ILeaferImageOnLoaded, ILeaferImageOnError } from './image/ILeaferImage'
+export { IExportFileType, IExportImageType } from './file/IFileType'
 
 export { InnerId, IEventer, IEventListener, IEventListenerOptions, IEventListenerMap, IEventListenerItem, IEventListenerId } from './event/IEventer'
-export { IEventTarget, IEvent, ILeaferEvent, IPropertyEvent, ILayoutEvent, IRenderEvent, IChildEvent, IResizeEvent, IResizeEventListener, IUpdateEvent, IWatchEvent, ITransformEvent, ITransformEventData, TransformMode } from './event/IEvent'
+export { IEventTarget, IEvent, ILeaferEvent, IPropertyEvent, ILayoutEvent, IRenderEvent, IAnimateEvent, IChildEvent, IResizeEvent, IResizeEventListener, IUpdateEvent, IWatchEvent, ITransformEvent, ITransformEventData, TransformMode } from './event/IEvent'
 export { IUIEvent, IPointerEvent, PointerType, IDragEvent, IDropEvent, ISwipeEvent, IMoveEvent, IZoomEvent, IRotateEvent, IKeyEvent, IImageEvent } from './event/IUIEvent'
 export { IInteraction, IInteractionCanvas, IInteractionConfig, IWheelConfig, IPointerConfig } from './interaction/IInteraction'
 

package/src/layout/ILeafLayout.ts

@@ -31,6 +31,7 @@ export interface ILeafLayout {
     // matrix changed
     matrixChanged: boolean // include positionChanged scaleChanged skewChanged
     positionChanged: boolean // x, y
+    originChanged?: boolean // originX originY
     scaleChanged: boolean // scaleX scaleY
     rotationChanged: boolean // rotaiton, skewX scaleY 数据更新
 
@@ -60,7 +61,7 @@ export interface ILeafLayout {
     strokeBoxSpread: number
     renderShapeSpread: number
 
-    checkUpdate(): void
+    checkUpdate(force?: boolean): void
 
     getTransform(locationType: ILayoutLocationType): IMatrixData
     decomposeTransform(locationType: ILayoutLocationType): IMatrixDecompositionData

package/src/math/IMath.ts

@@ -152,16 +152,16 @@ export interface IMatrix extends IMatrixData {
     translateInner(x: number, y: number): IMatrix
 
     scale(x: number, y?: number): IMatrix
-    scaleOf(center: IPointData, x: number, y?: number): IMatrix
-    scaleOfInner(center: IPointData, x: number, y?: number): IMatrix
+    scaleOfOuter(origin: IPointData, x: number, y?: number): IMatrix
+    scaleOfInner(origin: IPointData, x: number, y?: number): IMatrix
 
     rotate(angle: number): IMatrix
-    rotateOf(center: IPointData, angle: number): IMatrix
-    rotateOfInner(center: IPointData, angle: number): IMatrix
+    rotateOfOuter(origin: IPointData, angle: number): IMatrix
+    rotateOfInner(origin: IPointData, angle: number): IMatrix
 
     skew(x: number, y?: number): IMatrix
-    skewOf(center: IPointData, x: number, y?: number): IMatrix
-    skewOfInner(center: IPointData, x: number, y?: number): IMatrix
+    skewOfOuter(origin: IPointData, x: number, y?: number): IMatrix
+    skewOfInner(origin: IPointData, x: number, y?: number): IMatrix
 
     multiply(matrix: IMatrixData): IMatrix
     divide(matrix: IMatrixData): IMatrix

package/src/platform/IPlatform.ts

@@ -1,6 +1,7 @@
 import { IFunction } from '../function/IFunction'
 import { ILeaferCanvas } from '../canvas/ILeaferCanvas'
 import { ILeaf } from '../display/ILeaf'
+import { IExportFileType, IExportImageType } from '../file/IFileType'
 
 export interface IPlatform {
     requestRender?(render: IFunction): void
@@ -11,17 +12,13 @@ export interface IPlatform {
     conicGradientSupport?: boolean
     conicGradientRotate90?: boolean // fixfox need rotate
     fullImageShadow?: boolean // safari need 
-    layout(target: ILeaf): void
+    layout?(target: ILeaf): void
+    realtimeLayout?: boolean
     origin?: {
-        createCanvas: ICreateCanvasFunction,
-        loadImage: ILoadImageFunction
+        createCanvas(width: number, height: number, format?: 'svg' | 'pdf'): any
+        canvasToDataURL(canvas: any, type?: IExportImageType, quality?: number): string
+        canvasToBolb(canvas: any, type?: IExportFileType, quality?: number): Promise<any>
+        canvasSaveAs(canvas: any, filename: string, quality?: number): Promise<void>
+        loadImage(url: string): Promise<any>
     }
-}
-
-interface ICreateCanvasFunction {
-    (width: number, height: number, format?: 'svg' | 'pdf'): any
-}
-
-interface ILoadImageFunction {
-    (url: string): Promise<any>
 }

package/src/task/ITaskProcessor.ts

@@ -0,0 +1,28 @@
+import { IFunction } from '../function/IFunction'
+
+export interface ITaskProcessorConfig {
+    onComplete?: IFunction
+    onTask?: IFunction
+    onError?: IFunction
+    parallel?: number
+}
+
+export interface ITaskProcessor {
+    config: ITaskProcessorConfig
+    running: boolean
+    isComplete: boolean
+    percent: number
+    total: number
+    index: number
+    finishedIndex: number
+    remain: number
+    start(): void
+    pause(): void
+    resume(): void
+    skip(): void
+    stop(): void
+    add(taskCallback: IFunction, taskTime?: number): void
+    addParallel(taskCallback: IFunction, taskTime?: number): void
+    addEmpty(callback?: IFunction): void
+    destory(): void
+}