feat: init board plugin

packages/board/src/index.ts

@@ -1,6 +1,6 @@
 import { 
   TypeScreenPosition, TypeScreenSize, TypeScreenContext, TypePoint, TypePointCursor,
-  TypeBoardOptions, TypeBoardSizeOptions, } from '@idraw/types';
+  TypeBoardOptions, TypeBoardSizeOptions, TypePlugin, } from '@idraw/types';
 import util from '@idraw/util';
 // import { Watcher } from './lib/watcher';
 import { ScreenWatcher } from './lib/screen-watcher';
@@ -9,12 +9,12 @@ import Context from './lib/context';
 import { TypeBoardEventArgMap } from './lib/event';
 import { Scroller } from './lib/scroller';
 import { Screen } from './lib/screen';
-// import { TempData } from './lib/watcher-temp';
+import { TempData } from './lib/temp';
 import {
   _canvas, _displayCanvas, _mount, _opts, _hasRendered, _ctx, _displayCtx,
   _originCtx, _watcher, _render, _parsePrivateOptions, _scroller,
   _initEvent, _doScrollX, _doScrollY, _doMoveScroll, _resetContext,
-  _screen,
+  _screen, _tempData
 } from './names';
 
 const { throttle } = util.time;
@@ -36,8 +36,11 @@ class Board {
   private [_watcher]: ScreenWatcher;
   private [_scroller]: Scroller;
   private [_screen]: Screen;
+  private [_tempData]: TempData;
 
   constructor(mount: HTMLDivElement, opts: TypeBoardOptions) {
+    this[_tempData] = new TempData(opts);
+
     this[_mount] = mount;
     this[_canvas] = document.createElement('canvas');
     this[_displayCanvas] = document.createElement('canvas');
@@ -135,6 +138,10 @@ class Board {
     return { position, size };
   }
 
+  addPlugin(plugin: TypePlugin) {
+    this[_tempData].get('plugins').push(plugin);
+  }
+
   clear() {
     this[_displayCtx].clearRect(0, 0, this[_displayCanvas].width, this[_displayCanvas].height);
   }
@@ -201,6 +208,7 @@ class Board {
     return screenPoint;
   }
 
+
   private [_render]() {
     if (this[_hasRendered] === true) {
       return;

packages/board/src/lib/temp.ts

@@ -1,14 +1,37 @@
-type TempDataDesc = {}
+import { TypePlugin, TypeBoardOptions } from '@idraw/types';
+import Context from './context';
+
+type TempDataDesc = {
+  plugins: TypePlugin[],
+  ctx: Context,
+
+}
+
+function createDefaultData(opts: TypeBoardOptions) {
+  const canvas = document.createElement('canvas');
+  const ctx2d = canvas.getContext('2d') as CanvasRenderingContext2D;
+  const ctx = new Context(ctx2d, {
+    width: opts.width,
+    height: opts.height,
+    contextWidth: opts.contextWidth,
+    contextHeight: opts.contextHeight,
+    devicePixelRatio: opts.devicePixelRatio || window.devicePixelRatio || 1,
+  });
+
+  return {
+    plugins: [],
+    ctx: ctx
+  }
+}
+
 
 
 export class TempData {
 
   private _temp: TempDataDesc
 
-  constructor() {
-    this._temp = {
-      prevClickPoint: null
-    }
+  constructor(opts: TypeBoardOptions) {
+    this._temp = createDefaultData(opts)
   }
 
   set<T extends keyof TempDataDesc >(name: T, value:  TempDataDesc[T]) {
@@ -19,9 +42,7 @@ export class TempData {
     return this._temp[name];
   }
 
-  clear() {
-    this._temp = {
-      prevClickPoint: null,
-    }
+  clear(opts: TypeBoardOptions) {
+    this._temp = createDefaultData(opts)
   }
 }

packages/types/src/index.ts

@@ -7,4 +7,5 @@ export * from './lib/helper';
 export * from './lib/config';
 export * from './lib/core';
 export * from './lib/screen';
-export * from './lib/device';
+export * from './lib/device';
+export * from './lib/plugin';

packages/types/src/lib/plugin.ts

@@ -0,0 +1,7 @@
+import { TypeContext } from './context';
+
+export interface TypePlugin {
+  drawTopContext?(ctx: TypeContext): void;
+  drawTopDisplayContext?(ctx2d: CanvasRenderingContext2D): void;
+  drawBottomDisplayContext?(ctx2d: CanvasRenderingContext2D): void;
+}