Przeglądaj źródła

feat: update whiteboard

wxyyxc1992 6 lat temu
rodzic
commit
17224f23b0

+ 2
- 2
dist/cjs/board/Drawboard/index.js Wyświetl plik

46
             if (_this.source.imgSrc) {
46
             if (_this.source.imgSrc) {
47
                 _this.target.style.display = 'none';
47
                 _this.target.style.display = 'none';
48
             }
48
             }
49
-            _this.boardHolder.style.opacity = '0';
49
+            _this.boardHolder.style.visibility = 'hidden';
50
             _this.boardHolder.style.zIndex = '-1';
50
             _this.boardHolder.style.zIndex = '-1';
51
             if (_this.toolbar) {
51
             if (_this.toolbar) {
52
                 _this.toolbar.hide();
52
                 _this.toolbar.hide();
56
             if (_this.source.imgSrc) {
56
             if (_this.source.imgSrc) {
57
                 _this.target.style.display = 'block';
57
                 _this.target.style.display = 'block';
58
             }
58
             }
59
-            _this.boardHolder.style.opacity = '1';
59
+            _this.boardHolder.style.opacity = 'visible';
60
             _this.boardHolder.style.zIndex = '9999';
60
             _this.boardHolder.style.zIndex = '9999';
61
             if (_this.toolbar) {
61
             if (_this.toolbar) {
62
                 _this.toolbar.show();
62
                 _this.toolbar.show();

+ 15
- 2
dist/cjs/board/Whiteboard/index.js Wyświetl plik

47
         }
47
         }
48
         this.init();
48
         this.init();
49
     }
49
     }
50
+    Object.defineProperty(Whiteboard.prototype, "activePage", {
51
+        get: function () {
52
+            return this.pages[this.visiblePageIndex];
53
+        },
54
+        enumerable: true,
55
+        configurable: true
56
+    });
50
     Whiteboard.prototype.open = function () {
57
     Whiteboard.prototype.open = function () {
51
         var _this = this;
58
         var _this = this;
52
         this.pages.forEach(function (page, i) {
59
         this.pages.forEach(function (page, i) {
61
             clearInterval(this.emitInterval);
68
             clearInterval(this.emitInterval);
62
         }
69
         }
63
     };
70
     };
71
+    Whiteboard.prototype.show = function () {
72
+        this.activePage.show();
73
+    };
74
+    Whiteboard.prototype.hide = function () {
75
+        this.activePage.hide();
76
+    };
64
     Whiteboard.prototype.snap = function () {
77
     Whiteboard.prototype.snap = function () {
65
         return {
78
         return {
66
             id: this.id,
79
             id: this.id,
88
                 eventHub: _this.eventHub,
101
                 eventHub: _this.eventHub,
89
                 parentContainer: _this.pagesContainer
102
                 parentContainer: _this.pagesContainer
90
             });
103
             });
91
-            page.container.style.opacity = '0';
104
+            page.container.style.visibility = 'hidden';
92
             _this.pages.push(page);
105
             _this.pages.push(page);
93
         });
106
         });
94
         this.initSiema();
107
         this.initSiema();
201
                     parentContainer: _this.pagesContainer
214
                     parentContainer: _this.pagesContainer
202
                 });
215
                 });
203
                 page.id = pageIds[i];
216
                 page.id = pageIds[i];
204
-                page.container.style.opacity = '0';
217
+                page.container.style.opacity = 'hidden';
205
                 _this.pages.push(page);
218
                 _this.pages.push(page);
206
                 page.open();
219
                 page.open();
207
             });
220
             });

+ 2
- 2
dist/cjs/toolbar/Toolbar.js Wyświetl plik

21
         this.clickHandler = clickHandler;
21
         this.clickHandler = clickHandler;
22
     }
22
     }
23
     Toolbar.prototype.hide = function () {
23
     Toolbar.prototype.hide = function () {
24
-        this.toolbarUI.style.opacity = '0';
24
+        this.toolbarUI.style.visibility = 'hidden';
25
         this.toolbarUI.style.zIndex = '-1';
25
         this.toolbarUI.style.zIndex = '-1';
26
     };
26
     };
27
     Toolbar.prototype.show = function () {
27
     Toolbar.prototype.show = function () {
28
-        this.toolbarUI.style.opacity = '1';
28
+        this.toolbarUI.style.visibility = 'visible';
29
         this.toolbarUI.style.zIndex = '999';
29
         this.toolbarUI.style.zIndex = '999';
30
     };
30
     };
31
     return Toolbar;
31
     return Toolbar;

+ 1
- 1
dist/index.js
Plik diff jest za duży
Wyświetl plik


+ 3
- 0
dist/types/board/Whiteboard/index.d.ts Wyświetl plik

18
     mode: WhiteboardMode;
18
     mode: WhiteboardMode;
19
     isFullscreen: boolean;
19
     isFullscreen: boolean;
20
     pages: WhitePage[];
20
     pages: WhitePage[];
21
+    readonly activePage: WhitePage;
21
     siema: any;
22
     siema: any;
22
     isInitialized: boolean;
23
     isInitialized: boolean;
23
     visiblePageIndex: number;
24
     visiblePageIndex: number;
30
     });
31
     });
31
     open(): void;
32
     open(): void;
32
     close(): void;
33
     close(): void;
34
+    show(): void;
35
+    hide(): void;
33
     snap(): SerializableWhiteboard;
36
     snap(): SerializableWhiteboard;
34
     private init;
37
     private init;
35
     private initMaster;
38
     private initMaster;

+ 2
- 2
src/board/Drawboard/index.ts Wyświetl plik

85
       this.target.style.display = 'none';
85
       this.target.style.display = 'none';
86
     }
86
     }
87
     // 这里不使用 display:none,是为了保证在隐藏时候仍然可以执行更新
87
     // 这里不使用 display:none,是为了保证在隐藏时候仍然可以执行更新
88
-    this.boardHolder.style.opacity = '0';
88
+    this.boardHolder.style.visibility = 'hidden';
89
     this.boardHolder.style.zIndex = '-1';
89
     this.boardHolder.style.zIndex = '-1';
90
 
90
 
91
     if (this.toolbar) {
91
     if (this.toolbar) {
98
       this.target.style.display = 'block';
98
       this.target.style.display = 'block';
99
     }
99
     }
100
 
100
 
101
-    this.boardHolder.style.opacity = '1';
101
+    this.boardHolder.style.opacity = 'visible';
102
     this.boardHolder.style.zIndex = '9999';
102
     this.boardHolder.style.zIndex = '9999';
103
 
103
 
104
     if (this.toolbar) {
104
     if (this.toolbar) {

+ 14
- 2
src/board/Whiteboard/index.ts Wyświetl plik

41
 
41
 
42
   /** 句柄 */
42
   /** 句柄 */
43
   pages: WhitePage[] = [];
43
   pages: WhitePage[] = [];
44
+  get activePage() {
45
+    return this.pages[this.visiblePageIndex];
46
+  }
44
   siema: any;
47
   siema: any;
45
 
48
 
46
   /** State | 内部状态 */
49
   /** State | 内部状态 */
113
     }
116
     }
114
   }
117
   }
115
 
118
 
119
+  /** 展示当前的 WhitePage */
120
+  public show() {
121
+    this.activePage.show();
122
+  }
123
+
124
+  public hide() {
125
+    this.activePage.hide();
126
+  }
127
+
116
   /** 获取当前快照 */
128
   /** 获取当前快照 */
117
   public snap(): SerializableWhiteboard {
129
   public snap(): SerializableWhiteboard {
118
     return {
130
     return {
155
       );
167
       );
156
 
168
 
157
       // 这里隐藏 Dashboard 的图片源,Siema 切换的是占位图片
169
       // 这里隐藏 Dashboard 的图片源,Siema 切换的是占位图片
158
-      page.container.style.opacity = '0';
170
+      page.container.style.visibility = 'hidden';
159
 
171
 
160
       this.pages.push(page);
172
       this.pages.push(page);
161
     });
173
     });
306
         page.id = pageIds[i];
318
         page.id = pageIds[i];
307
 
319
 
308
         // 这里隐藏 Dashboard 的图片源,Siema 切换的是占位图片
320
         // 这里隐藏 Dashboard 的图片源,Siema 切换的是占位图片
309
-        page.container.style.opacity = '0';
321
+        page.container.style.opacity = 'hidden';
310
 
322
 
311
         this.pages.push(page);
323
         this.pages.push(page);
312
 
324
 

+ 2
- 2
src/toolbar/Toolbar.ts Wyświetl plik

33
   };
33
   };
34
 
34
 
35
   public hide() {
35
   public hide() {
36
-    this.toolbarUI.style.opacity = '0';
36
+    this.toolbarUI.style.visibility = 'hidden';
37
     this.toolbarUI.style.zIndex = '-1';
37
     this.toolbarUI.style.zIndex = '-1';
38
   }
38
   }
39
 
39
 
40
   public show() {
40
   public show() {
41
-    this.toolbarUI.style.opacity = '1';
41
+    this.toolbarUI.style.visibility = 'visible';
42
     this.toolbarUI.style.zIndex = '999';
42
     this.toolbarUI.style.zIndex = '999';
43
   }
43
   }
44
 }
44
 }