Make aware of rotation the shape selrect.

src/uxbox/data/workspace.cljs

@@ -286,7 +286,7 @@
             shapes (->> selected
                         (map #(get shapes-by-id %))
                         (map #(assoc % :group sid)))
-            [width height x y] (sh/group-size-and-position shapes)
+            {:keys [width height x y]} (sh/group-size-and-position shapes)
             group {:type :builtin/group
                    :id sid
                    :name (str "Group " (rand-int 1000))

src/uxbox/shapes.cljs

@@ -1,4 +1,6 @@
-(ns uxbox.shapes)
+(ns uxbox.shapes
+  (:require [uxbox.util.matrix :as mtx]
+            [uxbox.util.math :as mth]))
 
 ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
 ;; Types
@@ -67,6 +69,57 @@
 ;; Helpers
 ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
 
+(defn container-rect
+  [{:keys [x y width height rotation] :as shape}]
+  (let [center-x (+ x (/ width 2))
+        center-y (+ y (/ height 2))
+
+        angle (mth/radians (or rotation 0))
+        x1 (- x center-x)
+        y1 (- y center-y)
+
+        x2 (- (+ x width) center-x)
+        y2 (- y center-y)
+
+        rx1 (- (* x1 (mth/cos angle))
+               (* y1 (mth/sin angle)))
+        ry1 (+ (* x1 (mth/sin angle))
+               (* y1 (mth/cos angle)))
+
+        rx2 (- (* x2 (mth/cos angle))
+               (* y2 (mth/sin angle)))
+        ry2 (+ (* x2 (mth/sin angle))
+               (* y2 (mth/cos angle)))
+
+        [d1 d2] (cond
+                  (and (>= rotation 0)
+                       (< rotation 90))
+                  [(mth/abs ry1)
+                   (mth/abs rx2)]
+
+                  (and (>= rotation 90)
+                       (< rotation 180))
+                  [(mth/abs ry2)
+                   (mth/abs rx1)]
+
+                  (and (>= rotation 180)
+                       (< rotation 270))
+                  [(mth/abs ry1)
+                   (mth/abs rx2)]
+
+                  (and (>= rotation 270)
+                       (<= rotation 360))
+                  [(mth/abs ry2)
+                   (mth/abs rx1)])
+        final-x (- center-x d2)
+        final-y (- center-y d1)
+        final-width (* d2 2)
+        final-height (* d1 2)]
+    {:x final-x
+     :y final-y
+     :width final-width
+     :height final-height}))
+
 (defn group-size-and-position
   "Given a collection of shapes, calculates the
   dimensions of possible envolving rect.
@@ -74,13 +127,18 @@
   Mainly used for calculate the selection
   rect or shapes grop size."
   [shapes]
-  (let [x (apply min (map :x shapes))
+  {:pre [(seq shapes)]}
+  (let [shapes (map container-rect shapes)
+        x (apply min (map :x shapes))
         y (apply min (map :y shapes))
         x' (apply max (map (fn [{:keys [x width]}] (+ x width)) shapes))
         y' (apply max (map (fn [{:keys [y height]}] (+ y height)) shapes))
         width (- x' x)
         height (- y' y)]
-    [width height x y]))
+    {:width (- x' x)
+     :height (- y' y)
+     :x x
+     :y y}))
 
 (defn translate-coords
   "Given a shape and initial coords, transform

src/uxbox/ui/workspace/selrect.cljs

@@ -49,7 +49,7 @@
 (defn shapes-selrect-render
   [own shapes]
   (when (seq shapes)
-    (let [[width height x y] (sh/group-size-and-position shapes)]
+    (let [{:keys [width height x y]} (sh/group-size-and-position shapes)]
       (html
        [:g.controls
         [:rect {:x x :y y :width width :height height