@leapfrog/interactive-canvas 2.0.8 → 2.0.9-beta.0

package/dist/object/abstract-canvas-object.d.ts

@@ -0,0 +1,207 @@
+import { Observable } from "rxjs";
+import { ICanvasProfile, ILayoutManager, IMargin, IObjectDimensions, IOverflow, IPosition, ObjectType } from "..";
+import { ICanvasObject } from "./canvas-object.interface";
+import { CanvasObjectData } from "./canvas-object-data";
+import { IInteractiveCanvas } from "../interactive-canvas.interface";
+import { Object } from "fabric/fabric-impl";
+export declare abstract class AbstractCanvasObject<T extends Object> implements ICanvasObject {
+    protected pinToBottomDistance: number;
+    protected canvas: IInteractiveCanvas;
+    protected fabricObject: T;
+    protected data: CanvasObjectData;
+    private readonly dimensions$;
+    private readonly opacity$;
+    /**
+     * Create a new instance.
+     * @param type Object type.
+     * @param canvas Interactive canvas that the field will be rendered on.
+     * @param fabricObject The fabric object to bind this field to.
+     * @param data Existing persisted field data to load from, if applicable.
+     */
+    protected constructor(type: ObjectType, canvas: IInteractiveCanvas, fabricObject: any, data?: CanvasObjectData);
+    /**
+     * @override
+     * @inheritDoc
+     */
+    getId(): string;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    getType(): ObjectType;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    getDescription(): string;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setSortCaption(value: boolean): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    isSortCaption(): boolean;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    getDimensions(): IObjectDimensions;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    getDimensions$(): Observable<IObjectDimensions>;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    getOpacity(): number;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    getOpacity$(): Observable<number>;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setOpacity(value: number): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    getMargin(): IMargin;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setMargin(margin: IMargin): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    getColumnWidthPercent(): number;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setColumnWidthPercent(percent: number): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    bringForward(): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    bringToFront(): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    sendBackward(): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    sendToBack(): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    moveUp(): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    moveDown(): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    delete(): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    persist(): CanvasObjectData;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    isPinToBottom(): boolean;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setPinToBottom(value?: boolean): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setLeft(left: number): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setTop(top: number): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setHeight(height: number): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setWidth(width: number): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setAngle(angle: number): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setScaleX(scale: number): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setScaleY(scale: number): void;
+    /**
+     * Get the underlying fabric object.
+     * (Internal use only, do not expose this outside the canvas module).
+     */
+    getFabricObjectInternal(): T;
+    setPosition(position: IPosition): void;
+    setCoords(): void;
+    updateDimensions(): void;
+    getBoundingBox(): {
+        top: number;
+        left: number;
+        width: number;
+        height: number;
+    };
+    moveToPinnedPosition(): void;
+    protected updatePinToBottomDistance(): void;
+    protected redraw(): void;
+    protected onProfileChange(profile: ICanvasProfile): void;
+    protected onLayoutManagerChange(layoutManager: ILayoutManager): void;
+    protected onMove(event: any): void;
+    protected onRotate(event: any): void;
+    protected onScale(event: any): void;
+    protected afterScale(event: any): void;
+    protected onDelete(): void;
+    protected preventLeavingCanvas(): void;
+    protected getCanvasOverflow(): IOverflow;
+    protected centerHorizontallyInternal(): void;
+    protected centerVerticallyInternal(): void;
+    protected nudgeInternal(x?: number, y?: number): void;
+    protected updateFabricObjectBehavior(): void;
+}

package/dist/object/canvas-object-data.d.ts

@@ -0,0 +1,24 @@
+import { IMargin, IRect, ObjectType } from "..";
+/**
+ * Data for a persisted canvas object.
+ */
+export declare class CanvasObjectData {
+    type: ObjectType;
+    id: string;
+    fieldName?: string;
+    pinToBottom?: boolean;
+    margin?: IMargin;
+    columnWidthPercent?: number;
+    color?: string;
+    strokeWidth?: number;
+    padding?: IRect;
+    editable?: boolean;
+    prefillType: string;
+    sortCaption?: boolean;
+    resizeCanvas: boolean;
+    placeholder?: string;
+    userText?: string;
+    bulleted?: boolean;
+    imagePath?: string;
+    constructor(type: ObjectType, id: string);
+}

package/dist/object/canvas-object.interface.d.ts

@@ -0,0 +1,109 @@
+import { Observable } from "rxjs";
+import { IMargin, IObjectDimensions, ObjectType } from "..";
+import { CanvasObjectData } from "./canvas-object-data";
+/**
+ * An object rendered on the {@link IInteractiveCanvas Interactive Canvas}.
+ */
+export interface ICanvasObject {
+    /**
+     * Get the field id.
+     */
+    getId(): string;
+    /**
+     * Get the field type.
+     */
+    getType(): ObjectType;
+    /**
+     * Get the field description, a user-friendly version of Type.
+     */
+    getDescription(): string;
+    /**
+     * Set whether this field is to be used for the sort caption.
+     */
+    setSortCaption(value: boolean): void;
+    /**
+     * True if this field is a sort caption.
+     */
+    isSortCaption(): boolean;
+    /**
+     * Get object dimensions.
+     * @see IObjectDimensions.
+     */
+    getDimensions(): IObjectDimensions;
+    /**
+     * Get an observable for the field dimensions.
+     */
+    getDimensions$(): Observable<IObjectDimensions>;
+    /**
+     * Get object opacity.
+     */
+    getOpacity(): number;
+    /**
+     * Get an observable for the object opacity.
+     */
+    getOpacity$(): Observable<number>;
+    /**
+     * Set the object opacity.
+     * @param value Opacity.
+     */
+    setOpacity(value: number): void;
+    /**
+     * Get the component margin.
+     */
+    getMargin(): IMargin;
+    /**
+     * Set component margin.
+     * @param margin New margin.
+     */
+    setMargin(margin: IMargin): void;
+    /**
+     * Get the column width percentage.
+     */
+    getColumnWidthPercent(): number;
+    /**
+     * Set column width percentage.
+     * @param percent New value.
+     */
+    setColumnWidthPercent(percent: number): void;
+    /**
+     * Bring object to front.
+     */
+    bringToFront(): void;
+    /**
+     * Bring object forward one place.
+     */
+    bringForward(): void;
+    /**
+     * Send object backward one place.
+     */
+    sendBackward(): void;
+    /**
+     * Send object to the back.
+     */
+    sendToBack(): void;
+    /**
+     * Move the object up in the object list.
+     */
+    moveUp(): void;
+    /**
+     * Move the object down in the object list.
+     */
+    moveDown(): void;
+    /**
+     * Delete this object, removing it from the canvas.
+     */
+    delete(): void;
+    /**
+     * Persist this object, returning a copy of the data block.
+     */
+    persist(): CanvasObjectData;
+    /**
+     * Get whether the object is pinned to the bottom of the canvas.
+     */
+    isPinToBottom(): boolean;
+    /**
+     * Set whether the object is pinned to the bottom of the canvas.
+     * @param value New value.
+     */
+    setPinToBottom(value?: boolean): void;
+}

package/dist/object/impl/background-image.d.ts

@@ -0,0 +1,38 @@
+import { AbstractCanvasObject, CanvasObjectData, IDimensionRestrictions, IInteractiveCanvas, IMutableImage } from "../..";
+import { ICanvasObject } from "../canvas-object.interface";
+import { fabric } from "fabric";
+import { Observable } from "rxjs";
+export interface IBackgroundImage extends ICanvasObject, IMutableImage {
+    updatePosition(): void;
+}
+export declare class BackgroundImage extends AbstractCanvasObject<fabric.Image> implements IBackgroundImage {
+    private readonly imageUrl$;
+    constructor(canvas: IInteractiveCanvas, fabricObject: fabric.Image, persistedField?: CanvasObjectData);
+    updatePosition(): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    protected updateFabricObjectBehavior(): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    getImageUrl(): string;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    getImageUrl$(): Observable<string>;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setImageUrl(url: string): Promise<void>;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setImageWidth(px: number, sizeRestrictions: IDimensionRestrictions): number;
+    private setCanvasImage;
+}

package/dist/object/impl/border.d.ts

@@ -0,0 +1,70 @@
+import { Observable } from "rxjs";
+import { ICanvasObject } from "../canvas-object.interface";
+import { IInteractiveCanvas, IMutableColor, IRect } from "../..";
+import { AbstractCanvasObject } from "../abstract-canvas-object";
+import { CanvasObjectData } from "../canvas-object-data";
+import { fabric } from "fabric";
+/**
+ * Border field. A rectangle with a stroke width that automatically follows the canvas border.
+ */
+export interface IBorder extends ICanvasObject, IMutableColor {
+    /**
+     * Get the width of the border stroke.
+     */
+    getStrokeWidth(): number;
+    /**
+     * Get an observable of the width of the cutoff stroke.
+     */
+    getStrokeWidth$(): Observable<number>;
+    /**
+     * Set the border stroke width.
+     * @param width New width.
+     */
+    setStrokeWidth(width: number): void;
+    /**
+     * Get the padding within the border.
+     */
+    getPadding(): IRect;
+    /**
+     * Set the padding within the border.
+     * @param padding New padding.
+     */
+    setPadding(padding: any): void;
+}
+export declare class Border extends AbstractCanvasObject<fabric.Rect> implements IBorder {
+    private readonly strokeWidth$;
+    constructor(canvas: IInteractiveCanvas, fabricObject: fabric.Rect, persistedField?: CanvasObjectData);
+    /**
+     * @override
+     * @inheritDoc
+     */
+    getColor(): string;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setColor(color: string): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    getStrokeWidth(): number;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    getStrokeWidth$(): Observable<number>;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setStrokeWidth(width: number): void;
+    getPadding(): IRect;
+    setPadding(padding: any): void;
+    updatePosition(): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    protected updateFabricObjectBehavior(): void;
+}

package/dist/object/impl/cutoff.d.ts

@@ -0,0 +1,59 @@
+import { Observable } from "rxjs";
+import { ICanvasObject } from "../canvas-object.interface";
+import { IInteractiveCanvas, IMutableColor } from "../..";
+import { AbstractCanvasObject } from "../abstract-canvas-object";
+import { CanvasObjectData } from "../canvas-object-data";
+import { fabric } from "fabric";
+/**
+ * Cutoff field. A cutoff rule that sits on the bottom of the canvas.
+ */
+export interface ICutoff extends ICanvasObject, IMutableColor {
+    /**
+     * Get the width of the cutoff stroke.
+     */
+    getStrokeWidth(): number;
+    /**
+     * Get an observable of the width of the cutoff stroke.
+     */
+    getStrokeWidth$(): Observable<number>;
+    /**
+     * Set the cutoff stroke width.
+     * @param width New width.
+     */
+    setStrokeWidth(width: number): void;
+}
+export declare class Cutoff extends AbstractCanvasObject<fabric.Rect> implements ICutoff {
+    private readonly strokeWidth$;
+    constructor(canvas: IInteractiveCanvas, fabricObject: fabric.Rect, persistedField?: CanvasObjectData);
+    /**
+     * @override
+     * @inheritDoc
+     */
+    getColor(): string;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setColor(color: string): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    getStrokeWidth(): number;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    getStrokeWidth$(): Observable<number>;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setStrokeWidth(width: number): void;
+    updatePosition(): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    protected updateFabricObjectBehavior(): void;
+}

package/dist/object/impl/extended-fabric-object.interface.d.ts

@@ -0,0 +1,7 @@
+import { fabric } from "fabric";
+export interface ExtendedFabricObject extends fabric.Object {
+    /**
+     * If true, this object is a slave object controlled by another object and not directly by the user, such as the line markers in an ordered list.
+     */
+    _isSlaveObject?: boolean;
+}

package/dist/object/impl/extended-fabric-textbox.interface.d.ts

@@ -0,0 +1,7 @@
+import { fabric } from "fabric";
+import { ExtendedFabricObject } from "./extended-fabric-object.interface";
+export interface ExtendedFabricTextbox extends fabric.Textbox, ExtendedFabricObject {
+    _isOrderedList?: boolean;
+    _orderedListStart?: number;
+    _orderedListMarkerEntities?: fabric.Textbox[];
+}

package/dist/object/impl/horizontal-rule.d.ts

@@ -0,0 +1,83 @@
+import { Observable } from "rxjs";
+import { ICanvasObject } from "../canvas-object.interface";
+import { IInteractiveCanvas, IMutableColor, IMutablePosition } from "../..";
+import { AbstractCanvasObject } from "../abstract-canvas-object";
+import { CanvasObjectData } from "../canvas-object-data";
+import { fabric } from "fabric";
+/**
+ * Horizontal rule. A basic block of color in a thin line across the canvas.
+ */
+export interface IHorizontalRule extends ICanvasObject, IMutableColor, IMutablePosition {
+    /**
+     * Get the width of the rule.
+     */
+    getStrokeWidth(): number;
+    /**
+     * Get an observable of the width of the rule.
+     */
+    getStrokeWidth$(): Observable<number>;
+    /**
+     * Set the rule width.
+     * @param width New width.
+     */
+    setStrokeWidth(width: number): void;
+}
+export declare class HorizontalRule extends AbstractCanvasObject<fabric.Rect> implements IHorizontalRule {
+    private readonly strokeWidth$;
+    constructor(canvas: IInteractiveCanvas, fabricObject: fabric.Rect, persistedField?: CanvasObjectData);
+    /**
+     * @override
+     * @inheritDoc
+     */
+    getStrokeWidth(): number;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    getStrokeWidth$(): Observable<number>;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setStrokeWidth(value: number): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    getColor(): string;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setColor(color: string): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    centerHorizontally(): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    centerVertically(): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    nudgeUp(): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    nudgeDown(): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    nudgeLeft(): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    nudgeRight(): void;
+}

package/dist/object/impl/image.d.ts

@@ -0,0 +1,76 @@
+import { IDimensionRestrictions, IInteractiveCanvas, IMutableImage, IMutablePosition, IPosition } from "../..";
+import { ICanvasObject } from "../canvas-object.interface";
+import { AbstractCanvasObject } from "../abstract-canvas-object";
+import { Observable } from "rxjs";
+import { CanvasObjectData } from "../canvas-object-data";
+import { fabric } from "fabric";
+/**
+ * Image field. Displays a custom image on the canvas.
+ */
+export interface IImage extends ICanvasObject, IMutableImage, IMutablePosition {
+}
+export declare class Image extends AbstractCanvasObject<fabric.Image> implements IImage {
+    private readonly DEFAULT_RESTRICTIONS;
+    private layoutWidth;
+    private readonly imageUrl$;
+    constructor(canvas: IInteractiveCanvas, fabricObject: fabric.Image, persistedField?: CanvasObjectData);
+    /**
+     * @override
+     * @inheritDoc
+     */
+    getImageUrl(): string;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    getImageUrl$(): Observable<string>;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setImageUrl(url: string): Promise<void>;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setImageWidth(px: number, sizeRestrictions?: IDimensionRestrictions): number;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    centerHorizontally(): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    centerVertically(): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    nudgeUp(): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    nudgeDown(): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    nudgeLeft(): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    nudgeRight(): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setPosition(position: IPosition): void;
+    private centerHorizontallyInLayoutWidth;
+    private setCanvasImage;
+    private getMinWidthBasedOnMinHeight;
+    private getMaxWidthBasedOnMaxHeight;
+}