Added top resizble features to floatWindow

web/desktop.system

@@ -1131,7 +1131,7 @@
         const maxWindowCount = 100;
         var movingWindow = false;
         var resizingWindow = false;
-        var resizingEdgeID = 0; //Resizing edge. {0, 1, 2, 3, 4, 5} => None, Right, Right Bottom Corner, Bottom, Left Bottom Corner, Left 
+        var resizingEdgeID = 0; //Resizing edge. {0, 1, 2, 3, 4, 5, 6} => None, Right, Right Bottom Corner, Bottom, Left Bottom Corner, Left, TOp
         var stackedFloatWindowListShown = false;
 
         //Laucnh icon related
@@ -1676,6 +1676,14 @@
                 evt.preventDefault();
                 evt.stopImmediatePropagation();
                 fwmove($(this).parent(), evt);
+
+                //Add cusor change on resizble position reach
+                let hoverOffset = [event.pageX - $(this).offset().left, event.pageY - $(this).offset().top];
+                if (hoverOffset[1] <= 3){
+                    $(this).addClass("resizbleCursor");
+                }else{
+                    $(this).removeClass("resizbleCursor");
+                }
             });
             $(".fwdragger").off("mouseup").on("mouseup", function(evt) {
                 evt.preventDefault();
@@ -2017,7 +2025,7 @@
             //Check which edge is the user dragging
             var dx = event.pageX - $(object).find(".iframewrapper").offset().left;
             var dy = event.pageY - $(object).offset().top;
-            
+
             if (dx < 10 && dy > $(object).height() - 10) {
                 //Left Bottom Corner
                 resizingEdgeID = 4;
@@ -2038,7 +2046,9 @@
                 //Bottom Edge
                 resizingEdgeID = 3;
                 $(object).find(".iframewrapper").css('cursor', 's-resize');
-            }
+            } 
+
+            //For upper edge, see fwdown() handler
         }
 
         function resizeMove(object, event) {
@@ -2083,6 +2093,12 @@
                         width: Math.max(newWidth, minxWidth),
                         left: posX
                     });
+                } else if (resizingEdgeID == 6){
+                    var newHeight = $(object).height() - (posY - $(object).offset().top) + 2;
+                    $(object).css({
+                        "top": posY - 2,
+                        "height": Math.max(newHeight,minHeight),
+                    });
                 }
             }
         }
@@ -2171,8 +2187,8 @@
             //Hide all contenxt menus
             hideAllContextMenus();
 
-           //Move the window to the top layer
-           MoveFloatWindowToTop(object);
+            //Move the window to the top layer
+            MoveFloatWindowToTop(object);
             
             //Show the background drag panel
             if ($(object).hasClass("topmost")){
@@ -2187,8 +2203,18 @@
             
             //Get the relative click offset of the down event
             clickDownOffset = [event.pageX - $(object).offset().left, event.pageY - $(object).offset().top];
-            movingWindow = true;
+            if (clickDownOffset[1] <= 3){
+                //Resizing Top Edge
+                resizingWindow = true;
+                resizingWindowTarget = $(object).parent();
+                resizingEdgeID = 6;
+            }else{
+                //Moving Window
+                movingWindow = true;
+                
+            }
             $(object).find(".iframecover").show();
+            
         } 
 
         function fwmove(object, event) {
@@ -2220,9 +2246,9 @@
 
                 $(object).css("left", event.pageX - clickDownOffset[0]);
                 $(object).css("top", event.pageY - clickDownOffset[1]);
+            } else if (resizingWindow && resizingEdgeID == 6){
+                resizeMove($(object), event);
             }
-
-
         }
 
         //Dock the window object to left
@@ -2281,6 +2307,8 @@
                     //Dock to right
                     dockWindowToRight(object);
                 }
+            }else if (resizingWindow && resizingEdgeID == 6){
+                resizeUp($(object), event);
             }
         }
 

web/script/ao.css

@@ -191,3 +191,7 @@ h1, h2, h3, p, span, div { font-family: "Microsoft JhengHei","SimHei", "Apple Li
 .floatWindow .iframewrapper.heighHover{
     cursor:s-resize;
 }
+
+.fwdragger.resizbleCursor{
+    cursor:s-resize;
+}