hzzt-kfb-slide 0.0.1 → 0.0.2

package/types/components/KfbView/index.d.ts

@@ -0,0 +1,233 @@
+import { Process } from "@/components/toolbox/instances.ts";
+import { type Component } from "vue";
+import { DigitalSlide } from "@/instances.ts";
+export interface Label {
+    id?: number;
+    parent_id?: number;
+    lineWidth?: number;
+    strokeStyle?: string;
+    fillStyle?: string;
+    fontSize?: number;
+    description?: string;
+    text?: string;
+    angle?: number;
+    measure?: boolean;
+    points?: Point[];
+    tool?: string;
+    src?: string;
+    scale?: number;
+    region?: Rect;
+    move?: boolean;
+    resize?: boolean;
+    isROI?: boolean;
+    isClose?: boolean;
+    select?: boolean;
+    show?: boolean;
+    is_ai?: boolean;
+    custom?: boolean;
+    cls?: string;
+    score?: number;
+    imageUrl?: string;
+    __other__: any;
+}
+export interface Point {
+    x: number;
+    y: number;
+    minus?: (point: Point) => Point;
+    clone?: () => Point;
+}
+export interface Rect {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+}
+export interface ViewportInterface {
+    setRotation: (angle?: number) => void;
+    toggleFlip: () => void;
+    getCenter: (center?: boolean) => Point;
+    panTo: (point: Point) => void;
+    viewportToImageZoom: (zoom: number) => number;
+    imageToViewportZoom: (zoom: number) => number;
+    zoomTo: (zoom: number) => void;
+    zoomBy: (zoom: number) => void;
+    applyConstraints: () => void;
+    containerSize: Point;
+    getZoom: (flag?: boolean) => number;
+    panBy: (point: Point, flag?: boolean) => void;
+    deltaPointsFromPixels: (point: Point) => Point;
+}
+export interface DrawerInterface {
+    canvas: HTMLCanvasElement;
+}
+export interface KfbEvent {
+    preventDefault: boolean;
+    position: {
+        x: number;
+        y: number;
+    };
+    degrees?: number;
+    zoom?: number;
+    center?: Point;
+}
+export interface ViewerInterface {
+    viewport: ViewportInterface;
+    drawer: DrawerInterface;
+    addHandler: (name: string, func: (e: KfbEvent) => void) => void;
+    removeHandler: (name: string, func: (e: KfbEvent) => void) => void;
+    forceRedraw: () => void;
+    world?: {
+        getItemAt: (number: number) => TiledImage;
+        tiledImage: TiledImage;
+        removeItem: (tile: TiledImage) => void;
+    };
+    addTiledImage: (options: Record<any, any>) => void;
+}
+export interface Channel {
+    r: string | number;
+    g: string | number;
+    b: string | number;
+    eqt_num: string;
+}
+export interface FileInterface {
+    width: number;
+    height: number;
+    fileNum: number;
+    scanScale: number;
+    fileName: string;
+    ratiomap: Record<string, number>;
+    tileWidth?: number;
+    tileHeight?: number;
+    imageBlockLen?: number;
+    previewImg?: string;
+    labelImg?: string;
+    thumbnailImg?: string;
+    scanDuration?: number;
+    imageCapRes?: number;
+    scanResolution?: number;
+    scanTime?: string;
+    channel?: Channel[];
+    ext?: {
+        machineNum?: string;
+    };
+}
+export interface TiledImage {
+    draw: () => void;
+    tilesMatrix: Record<any, any>;
+}
+export interface KfbViewInterface {
+    labelList?: Label[];
+    viewer: ViewerInterface;
+    destroy?: () => void;
+    initLabelList?: (data: Label[]) => void;
+    $on?: (event?: string, func?: (data: any) => any) => void;
+    $options: Record<string, any>;
+    board?: {
+        startDraw: (options: any) => void;
+        endDraw: () => void;
+    };
+    grid?: {
+        updated: (options: any) => void;
+    };
+    graduation?: {
+        updated: (options: any) => void;
+    };
+    area?: {
+        moveToLabel: (point: Point) => void;
+        getCenterPoint: (rect: Rect) => Point;
+        imageToViewerElementRectangle: (rect: Rect) => Rect;
+    };
+    navigator?: {
+        element: HTMLElement;
+        drawPointList: (data: any) => void;
+    };
+    tailoring: {
+        init: (data: {
+            left: number;
+            top: number;
+            height: number;
+            width: number;
+            now?: boolean;
+            color?: string;
+        }) => void;
+    };
+}
+export interface TileParams {
+    file: string;
+    x: number;
+    y: number;
+    scale: string;
+    level: number;
+    channel?: string;
+}
+export interface Menu {
+    label: string;
+    value: string;
+    icon?: string | Component;
+    children?: {
+        label: string;
+        value: string;
+        icon?: string | Component;
+    }[];
+}
+export interface Microscope {
+    shape: string;
+    width: number;
+    color: string;
+    borderWidth: number;
+}
+export declare const DEFAULT_MICROSCOPE: {
+    shape: string;
+    width: number;
+    color: string;
+    borderWidth: number;
+};
+export interface KfbProps {
+    slide: DigitalSlide;
+    fileHandle: (slide: DigitalSlide) => Promise<FileInterface>;
+    labelHandle: (type: string, slide: DigitalSlide, data?: any) => Promise<Label[]>;
+    tileHandle: (params: TileParams) => string;
+    navigatorHandle?: (type: string, slide: DigitalSlide, data?: any) => Promise<any>;
+    pathologyHandle?: (slide: DigitalSlide) => Promise<boolean>;
+    options?: Record<string, any>;
+    process?: Process;
+    microscope?: Microscope;
+    menus?: Menu[];
+    aiLabelList?: Label[];
+    hotmap?: {
+        enable: boolean;
+        type: string;
+        file: string;
+        info?: [];
+        roi?: [];
+    };
+    syncPosition?: boolean;
+    syncZoom?: boolean;
+}
+export interface Hotmap {
+    url: string;
+    x: number;
+    y: number;
+    img?: HTMLImageElement;
+    load: string;
+}
+export interface KfbViewRefInterface {
+    kfbView: KfbViewInterface;
+    degrees: number;
+    currentAngle: number;
+    zoom: number;
+    startDraw: (options?: unknown) => void;
+    shotScreen: (options?: unknown) => void;
+    updateGrid: (options?: unknown) => void;
+    updateGraduation: (options?: unknown) => void;
+    updateNavigator: (options?: unknown) => void;
+    forceRedraw: (options?: unknown) => void;
+    scopeChange: (options?: unknown) => void;
+    fastMove: (options?: unknown) => void;
+    endDraw: () => void;
+    info: () => void;
+    zoomTo: (options?: unknown) => void;
+    toggleFlip: (options?: unknown) => void;
+    reloadLabelList: () => void;
+    selectLabel: (label: Label) => void;
+}

package/types/components/KfbView/index.vue.d.ts

@@ -0,0 +1,270 @@
+import { type Ref } from "vue";
+import { KfbProps, KfbViewInterface, Label, Rect } from "@/components/KfbView/index.ts";
+declare function startDraw(options: any): void;
+declare function endDraw(): void;
+declare function toggleFlip(): void;
+declare function scopeChange(options: any): void;
+declare function info(): void;
+declare function updateGrid(options: any): void;
+declare function updateGraduation(options: any): void;
+declare function updateNavigator(flag: any): void;
+declare function zoomTo(zoom: any): void;
+declare var __VLS_89: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_89) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<KfbProps, {
+    kfbView: Ref<{
+        labelList?: {
+            id?: number | undefined;
+            parent_id?: number | undefined;
+            lineWidth?: number | undefined;
+            strokeStyle?: string | undefined;
+            fillStyle?: string | undefined;
+            fontSize?: number | undefined;
+            description?: string | undefined;
+            text?: string | undefined;
+            angle?: number | undefined;
+            measure?: boolean | undefined;
+            points?: {
+                x: number;
+                y: number;
+                minus?: ((point: import("@/components/KfbView/index.ts").Point) => import("@/components/KfbView/index.ts").Point) | undefined;
+                clone?: (() => import("@/components/KfbView/index.ts").Point) | undefined;
+            }[] | undefined;
+            tool?: string | undefined;
+            src?: string | undefined;
+            scale?: number | undefined;
+            region?: {
+                x: number;
+                y: number;
+                width: number;
+                height: number;
+            } | undefined;
+            move?: boolean | undefined;
+            resize?: boolean | undefined;
+            isROI?: boolean | undefined;
+            isClose?: boolean | undefined;
+            select?: boolean | undefined;
+            show?: boolean | undefined;
+            is_ai?: boolean | undefined;
+            custom?: boolean | undefined;
+            cls?: string | undefined;
+            score?: number | undefined;
+            imageUrl?: string | undefined;
+            __other__: any;
+        }[] | undefined;
+        viewer: {
+            viewport: {
+                setRotation: (angle?: number) => void;
+                toggleFlip: () => void;
+                getCenter: (center?: boolean) => import("@/components/KfbView/index.ts").Point;
+                panTo: (point: import("@/components/KfbView/index.ts").Point) => void;
+                viewportToImageZoom: (zoom: number) => number;
+                imageToViewportZoom: (zoom: number) => number;
+                zoomTo: (zoom: number) => void;
+                zoomBy: (zoom: number) => void;
+                applyConstraints: () => void;
+                containerSize: {
+                    x: number;
+                    y: number;
+                    minus?: ((point: import("@/components/KfbView/index.ts").Point) => import("@/components/KfbView/index.ts").Point) | undefined;
+                    clone?: (() => import("@/components/KfbView/index.ts").Point) | undefined;
+                };
+                getZoom: (flag?: boolean) => number;
+                panBy: (point: import("@/components/KfbView/index.ts").Point, flag?: boolean) => void;
+                deltaPointsFromPixels: (point: import("@/components/KfbView/index.ts").Point) => import("@/components/KfbView/index.ts").Point;
+            };
+            drawer: {
+                canvas: HTMLCanvasElement;
+            };
+            addHandler: (name: string, func: (e: import("@/components/KfbView/index.ts").KfbEvent) => void) => void;
+            removeHandler: (name: string, func: (e: import("@/components/KfbView/index.ts").KfbEvent) => void) => void;
+            forceRedraw: () => void;
+            world?: {
+                getItemAt: (number: number) => import("@/components/KfbView/index.ts").TiledImage;
+                tiledImage: {
+                    draw: () => void;
+                    tilesMatrix: Record<any, any>;
+                };
+                removeItem: (tile: import("@/components/KfbView/index.ts").TiledImage) => void;
+            } | undefined;
+            addTiledImage: (options: Record<any, any>) => void;
+        };
+        destroy?: (() => void) | undefined;
+        initLabelList?: ((data: Label[]) => void) | undefined;
+        $on?: ((event?: string, func?: (data: any) => any) => void) | undefined;
+        $options: Record<string, any>;
+        board?: {
+            startDraw: (options: any) => void;
+            endDraw: () => void;
+        } | undefined;
+        grid?: {
+            updated: (options: any) => void;
+        } | undefined;
+        graduation?: {
+            updated: (options: any) => void;
+        } | undefined;
+        area?: {
+            moveToLabel: (point: import("@/components/KfbView/index.ts").Point) => void;
+            getCenterPoint: (rect: Rect) => import("@/components/KfbView/index.ts").Point;
+            imageToViewerElementRectangle: (rect: Rect) => Rect;
+        } | undefined;
+        navigator?: {
+            element: HTMLElement;
+            drawPointList: (data: any) => void;
+        } | undefined;
+        tailoring: {
+            init: (data: {
+                left: number;
+                top: number;
+                height: number;
+                width: number;
+                now?: boolean;
+                color?: string;
+            }) => void;
+        };
+    }, KfbViewInterface | {
+        labelList?: {
+            id?: number | undefined;
+            parent_id?: number | undefined;
+            lineWidth?: number | undefined;
+            strokeStyle?: string | undefined;
+            fillStyle?: string | undefined;
+            fontSize?: number | undefined;
+            description?: string | undefined;
+            text?: string | undefined;
+            angle?: number | undefined;
+            measure?: boolean | undefined;
+            points?: {
+                x: number;
+                y: number;
+                minus?: ((point: import("@/components/KfbView/index.ts").Point) => import("@/components/KfbView/index.ts").Point) | undefined;
+                clone?: (() => import("@/components/KfbView/index.ts").Point) | undefined;
+            }[] | undefined;
+            tool?: string | undefined;
+            src?: string | undefined;
+            scale?: number | undefined;
+            region?: {
+                x: number;
+                y: number;
+                width: number;
+                height: number;
+            } | undefined;
+            move?: boolean | undefined;
+            resize?: boolean | undefined;
+            isROI?: boolean | undefined;
+            isClose?: boolean | undefined;
+            select?: boolean | undefined;
+            show?: boolean | undefined;
+            is_ai?: boolean | undefined;
+            custom?: boolean | undefined;
+            cls?: string | undefined;
+            score?: number | undefined;
+            imageUrl?: string | undefined;
+            __other__: any;
+        }[] | undefined;
+        viewer: {
+            viewport: {
+                setRotation: (angle?: number) => void;
+                toggleFlip: () => void;
+                getCenter: (center?: boolean) => import("@/components/KfbView/index.ts").Point;
+                panTo: (point: import("@/components/KfbView/index.ts").Point) => void;
+                viewportToImageZoom: (zoom: number) => number;
+                imageToViewportZoom: (zoom: number) => number;
+                zoomTo: (zoom: number) => void;
+                zoomBy: (zoom: number) => void;
+                applyConstraints: () => void;
+                containerSize: {
+                    x: number;
+                    y: number;
+                    minus?: ((point: import("@/components/KfbView/index.ts").Point) => import("@/components/KfbView/index.ts").Point) | undefined;
+                    clone?: (() => import("@/components/KfbView/index.ts").Point) | undefined;
+                };
+                getZoom: (flag?: boolean) => number;
+                panBy: (point: import("@/components/KfbView/index.ts").Point, flag?: boolean) => void;
+                deltaPointsFromPixels: (point: import("@/components/KfbView/index.ts").Point) => import("@/components/KfbView/index.ts").Point;
+            };
+            drawer: {
+                canvas: HTMLCanvasElement;
+            };
+            addHandler: (name: string, func: (e: import("@/components/KfbView/index.ts").KfbEvent) => void) => void;
+            removeHandler: (name: string, func: (e: import("@/components/KfbView/index.ts").KfbEvent) => void) => void;
+            forceRedraw: () => void;
+            world?: {
+                getItemAt: (number: number) => import("@/components/KfbView/index.ts").TiledImage;
+                tiledImage: {
+                    draw: () => void;
+                    tilesMatrix: Record<any, any>;
+                };
+                removeItem: (tile: import("@/components/KfbView/index.ts").TiledImage) => void;
+            } | undefined;
+            addTiledImage: (options: Record<any, any>) => void;
+        };
+        destroy?: (() => void) | undefined;
+        initLabelList?: ((data: Label[]) => void) | undefined;
+        $on?: ((event?: string, func?: (data: any) => any) => void) | undefined;
+        $options: Record<string, any>;
+        board?: {
+            startDraw: (options: any) => void;
+            endDraw: () => void;
+        } | undefined;
+        grid?: {
+            updated: (options: any) => void;
+        } | undefined;
+        graduation?: {
+            updated: (options: any) => void;
+        } | undefined;
+        area?: {
+            moveToLabel: (point: import("@/components/KfbView/index.ts").Point) => void;
+            getCenterPoint: (rect: Rect) => import("@/components/KfbView/index.ts").Point;
+            imageToViewerElementRectangle: (rect: Rect) => Rect;
+        } | undefined;
+        navigator?: {
+            element: HTMLElement;
+            drawPointList: (data: any) => void;
+        } | undefined;
+        tailoring: {
+            init: (data: {
+                left: number;
+                top: number;
+                height: number;
+                width: number;
+                now?: boolean;
+                color?: string;
+            }) => void;
+        };
+    }>;
+    degrees: Ref<number, number>;
+    zoom: Ref<number, number>;
+    forceRedraw: (process?: import("../toolbox/instances.ts").Process) => void;
+    toggleFlip: typeof toggleFlip;
+    startDraw: typeof startDraw;
+    endDraw: typeof endDraw;
+    shotScreen: (now?: boolean) => void;
+    info: typeof info;
+    scopeChange: typeof scopeChange;
+    updateGrid: typeof updateGrid;
+    updateGraduation: typeof updateGraduation;
+    updateNavigator: typeof updateNavigator;
+    fastMove: ({ name, value }: {
+        name: string;
+        value: any;
+    }) => void;
+    zoomTo: typeof zoomTo;
+    selectLabel: (label: Label) => void;
+    reloadLabelList: () => void;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    tool: (action: string, value?: any) => any;
+}, string, import("vue").PublicProps, Readonly<KfbProps> & Readonly<{
+    onTool?: ((action: string, value?: any) => any) | undefined;
+}>, {
+    microscope: import("@/components/KfbView/index.ts").Microscope;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/types/components/KfbView/useDot.d.ts

@@ -0,0 +1,3 @@
+export declare function useDot(): {
+    drawDot: (ctx: CanvasRenderingContext2D, color: string) => void;
+};

package/types/components/KfbView/useHotmap.d.ts

@@ -0,0 +1,38 @@
+import { type Ref } from 'vue';
+import { Hotmap, KfbProps, KfbViewInterface, Point, TileParams } from "@/components/KfbView/index.ts";
+export declare function useHotmap(props: KfbProps, kfbView: Ref<KfbViewInterface>): {
+    getHotmapUrl: (url: string, params: TileParams, hotmapInfo: Record<string, boolean>) => string | undefined;
+    hotmapImgs: Ref<{
+        url: string;
+        x: number;
+        y: number;
+        img?: HTMLImageElement | undefined;
+        load: string;
+    }[], Hotmap[] | {
+        url: string;
+        x: number;
+        y: number;
+        img?: HTMLImageElement | undefined;
+        load: string;
+    }[]>;
+    handlerImage: (e: {
+        context: CanvasRenderingContext2D;
+        sourceWidth: number;
+        sourceHeight: number;
+        position: {
+            x: number;
+            y: number;
+            original: Point;
+        };
+        size: Point;
+        initRendered: {
+            canvas: HTMLCanvasElement;
+        };
+        tile: {
+            getUrl: () => string;
+        };
+        pixelDensityRatio: number;
+    }) => void;
+    hotmapLine: Ref<number, number>;
+    lineMouseDown: (e: MouseEvent) => void;
+};

package/types/components/KfbView/useImageProcess.d.ts

@@ -0,0 +1,16 @@
+import { Process } from "@/components/toolbox/instances.ts";
+import { KfbProps } from "@/components/KfbView/index.ts";
+export declare function useImageProcess(props: KfbProps): {
+    imageProcess: {
+        r: number;
+        g: number;
+        b: number;
+        c: number;
+        s: number;
+        l: number;
+        ga: number;
+    };
+    matrixValues: import("vue").ComputedRef<string>;
+    saturateValues: import("vue").ComputedRef<string>;
+    forceRedraw: (process?: Process) => void;
+};

package/types/components/KfbView/useLabel.d.ts

@@ -0,0 +1,85 @@
+import { type Ref } from 'vue';
+import { KfbProps, KfbViewInterface, Label } from "@/components/KfbView/index.ts";
+export declare function useLabel(props: KfbProps, kfbView: Ref<KfbViewInterface>): {
+    currentLabel: Ref<{
+        id?: number | undefined;
+        parent_id?: number | undefined;
+        lineWidth?: number | undefined;
+        strokeStyle?: string | undefined;
+        fillStyle?: string | undefined;
+        fontSize?: number | undefined;
+        description?: string | undefined;
+        text?: string | undefined;
+        angle?: number | undefined;
+        measure?: boolean | undefined;
+        points?: {
+            x: number;
+            y: number;
+            minus?: ((point: import("@/components/KfbView/index.ts").Point) => import("@/components/KfbView/index.ts").Point) | undefined;
+            clone?: (() => import("@/components/KfbView/index.ts").Point) | undefined;
+        }[] | undefined;
+        tool?: string | undefined;
+        src?: string | undefined;
+        scale?: number | undefined;
+        region?: {
+            x: number;
+            y: number;
+            width: number;
+            height: number;
+        } | undefined;
+        move?: boolean | undefined;
+        resize?: boolean | undefined;
+        isROI?: boolean | undefined;
+        isClose?: boolean | undefined;
+        select?: boolean | undefined;
+        show?: boolean | undefined;
+        is_ai?: boolean | undefined;
+        custom?: boolean | undefined;
+        cls?: string | undefined;
+        score?: number | undefined;
+        imageUrl?: string | undefined;
+        __other__: any;
+    } | undefined, Label | {
+        id?: number | undefined;
+        parent_id?: number | undefined;
+        lineWidth?: number | undefined;
+        strokeStyle?: string | undefined;
+        fillStyle?: string | undefined;
+        fontSize?: number | undefined;
+        description?: string | undefined;
+        text?: string | undefined;
+        angle?: number | undefined;
+        measure?: boolean | undefined;
+        points?: {
+            x: number;
+            y: number;
+            minus?: ((point: import("@/components/KfbView/index.ts").Point) => import("@/components/KfbView/index.ts").Point) | undefined;
+            clone?: (() => import("@/components/KfbView/index.ts").Point) | undefined;
+        }[] | undefined;
+        tool?: string | undefined;
+        src?: string | undefined;
+        scale?: number | undefined;
+        region?: {
+            x: number;
+            y: number;
+            width: number;
+            height: number;
+        } | undefined;
+        move?: boolean | undefined;
+        resize?: boolean | undefined;
+        isROI?: boolean | undefined;
+        isClose?: boolean | undefined;
+        select?: boolean | undefined;
+        show?: boolean | undefined;
+        is_ai?: boolean | undefined;
+        custom?: boolean | undefined;
+        cls?: string | undefined;
+        score?: number | undefined;
+        imageUrl?: string | undefined;
+        __other__: any;
+    } | undefined>;
+    initLabel: () => void;
+    selectLabel: (label: Label) => void;
+    reloadLabelList: () => void;
+    eventHandel: (type: string) => (label?: Label) => Promise<void>;
+};

package/types/components/KfbView/useMove.d.ts

@@ -0,0 +1,9 @@
+import { type Ref } from 'vue';
+import { KfbViewInterface } from "@/components/KfbView/index.ts";
+export declare function useMove(kfbView: Ref<KfbViewInterface>, zoom: Ref<number>): {
+    moveEvent: () => void;
+    fastMove: ({ name, value }: {
+        name: string;
+        value: any;
+    }) => void;
+};

package/types/components/KfbView/usePointer.d.ts

@@ -0,0 +1,12 @@
+import { KfbViewInterface } from "@/components/KfbView/index.ts";
+import { Ref, ShallowRef } from "vue";
+interface PointerConfig {
+    panSensitivity: number;
+    zoomSensitivity: number;
+    damping: number;
+    minThreshold: number;
+}
+export declare function usePointer(kfbView: Ref<KfbViewInterface>, mainKfbViewRef: ShallowRef<HTMLDivElement | null>, config?: Partial<PointerConfig>): {
+    setConfig: (newConfig: Partial<PointerConfig>) => void;
+};
+export {};

package/types/components/KfbView/useSync.d.ts

@@ -0,0 +1,5 @@
+import { type Ref, type ShallowRef } from 'vue';
+import { KfbProps, KfbViewInterface } from "@/components/KfbView/index.ts";
+export declare function useSync(props: KfbProps, kfbView: Ref<KfbViewInterface>, kfbViewRef: ShallowRef<HTMLDivElement | null>): {
+    initSync: () => void;
+};

package/types/components/KfbView/useTailor.d.ts

@@ -0,0 +1,7 @@
+import { KfbViewInterface } from "@/components/KfbView/index.ts";
+import type { Ref } from "vue";
+import { Emits } from "@/instances.ts";
+export declare function useTailor(emit: Emits, kfbView: Ref<KfbViewInterface>): {
+    tailorEvent: () => void;
+    shotScreen: (now?: boolean) => void;
+};