feat: 优化popover的拖动窗口，只有标题栏触发拖动

JuckZ · Oct 20, 2023 · eaa6c0f · eaa6c0f
1 parent e255482
commit eaa6c0f
Showing 1 changed file with 6 additions and 17 deletions.
diff --git a/src/ui/popover.ts b/src/ui/popover.ts
@@ -180,18 +180,18 @@ export class HoverEditor extends nosuper(HoverPopover) {
         this.titleEl = this.document.defaultView!.createDiv('popover-titlebar');
         this.titleEl.createDiv('popover-title');
         const popoverActions = this.titleEl.createDiv('popover-actions');
-
         const closeEl = popoverActions.createEl('a', 'popover-action mod-close');
         setIcon(closeEl, 'x');
         const minEl = popoverActions.createEl('a', 'popover-action mod-minimize');
         setIcon(minEl, 'minus');
         const maxEl = popoverActions.createEl('a', 'popover-action mod-maximize');
         setIcon(maxEl, 'maximize');
+        // eslint-disable-next-line @typescript-eslint/no-this-alias
         const _self = this;
         interact(this.hoverEl).draggable({
             // origin: 'body',
             // inertia: true,
-            // allowFrom: '.popover-titlebar',
+            allowFrom: '.popover-titlebar',
             modifiers: [
                 // TODO 边缘吸附，留出10px的操作空间
                 interact.modifiers.restrict({
@@ -202,32 +202,21 @@ export class HoverEditor extends nosuper(HoverPopover) {
             ],
             listeners: {
                 start(event: DragEvent) {
-                    console.log(event);
+                    // console.log(event);
                 },
                 move(event) {
                     _self.thePosition.x += event.dx;
                     _self.thePosition.y += event.dy;
                     event.target.style.transform = `translate(${_self.thePosition.x}px, ${_self.thePosition.y}px)`;
                 },
                 end(event: DragEvent) {
-                    console.log(event);
+                    // console.log(event);
                 },
             },
         });
 
-        minEl.addEventListener('click', event => {
-            // restorePopover(this.hoverEl);
-            // this.toggleMinimized();
-        });
-        maxEl.addEventListener('click', event => {
-            if (this.hoverEl.hasClass('snap-to-viewport')) {
-                // restorePopover(this.hoverEl);
-                return;
-            }
-            // const offset = calculateOffsets(this.document);
-            // storeDimensions(this.hoverEl);
-            // snapToEdge(this.hoverEl, 'viewport', offset);
-        });
+        minEl.addEventListener('click', event => {});
+        maxEl.addEventListener('click', event => {});
         closeEl.addEventListener('click', event => {
             this.hide();
         });