give more attention to !compositing

--improved all the visual and calculations
for !compositing. During the road also some
fixes introduced for the masking calculations
as the PanelBox exposes more of its settings
publicle to root and that way to
VisibilityManager

containment/contents/ui/PanelBox.qml

@@ -63,7 +63,9 @@ Item{
     }
 
     property int spacing: {
-        if (root.panelAlignment === Latte.Dock.Center || plasmoid.configuration.panelPosition === Latte.Dock.Justify) {
+        if (!Latte.WindowSystem.compositingActive) {
+            return 0;
+        } else if (root.panelAlignment === Latte.Dock.Center || plasmoid.configuration.panelPosition === Latte.Dock.Justify) {
             return root.panelEdgeSpacing/2;
         } else {
             return root.panelEdgeSpacing/4;
@@ -81,6 +83,12 @@ Item{
         value: root.isVertical ? barLine.height : barLine.width
     }
 
+    Binding {
+        target: root
+        property: "totalPanelEdgeSpacing"
+        value: spacing
+    }
+
     /// plasmoid's default panel
     /*  BorderImage{
             anchors.fill:parent
@@ -197,6 +205,13 @@ Item{
             value: shadowsSvgItem.panelSize
         }
 
+        Binding {
+            target: root
+            property: "panelMarginLength"
+            when: shadowsSvgItem
+            value: root.isVertical ? shadowsSvgItem.marginsHeight : shadowsSvgItem.marginsWidth
+        }
+
 
         PlasmaCore.FrameSvgItem{
             id: solidBackground

containment/contents/ui/VisibilityManager.qml

@@ -182,27 +182,29 @@ Item{
 
         if (Latte.WindowSystem.compositingActive) {
             if (root.useThemePanel){
-                space = root.panelEdgeSpacing + 2*root.panelShadow;
+                space = root.totalPanelEdgeSpacing + root.panelMarginLength + 1;
             } else {
                 space = 2;
             }
         } else {
-            if (root.panelAlignment === Latte.Dock.Center || plasmoid.configuration.panelPosition === Latte.Dock.Justify) {
+            space = root.totalPanelEdgeSpacing + root.panelMarginLength;
-                space = root.panelEdgeSpacing/2;
-            } else {
-                space = root.panelEdgeSpacing/4;
-            }
         }
 
         if (normalState) {
             //console.log("entered normal state...");
             //count panel length
-            if(root.isHorizontal) {
+
-                tempLength = plasmoid.configuration.panelPosition === Latte.Dock.Justify ?
+            //used when !compositing and in editMode
-                            layoutsContainer.width + space : mainLayout.width + space;
+            if (!Latte.WindowSystem.compositingActive && root.editMode) {
+                tempLength = root.isHorizontal ? root.width : root.height;
             } else {
-                tempLength = plasmoid.configuration.panelPosition === Latte.Dock.Justify ?
+                if(root.isHorizontal) {
-                            layoutsContainer.height + space : mainLayout.height + space;
+                    tempLength = plasmoid.configuration.panelPosition === Latte.Dock.Justify ?
+                                layoutsContainer.width + space : mainLayout.width + space;
+                } else {
+                    tempLength = plasmoid.configuration.panelPosition === Latte.Dock.Justify ?
+                                layoutsContainer.height + space : mainLayout.height + space;
+                }
             }
 
             tempThickness = thicknessNormal;
@@ -230,7 +232,7 @@ Item{
                 } else if (root.panelAlignment === Latte.Dock.Center) {
                     localX = (dock.width/2) - tempLength/2;
                 } else if (root.panelAlignment === Latte.Dock.Right) {
-                    localX = dock.width - mainLayout.width - (space/2);
+                    localX = dock.width - mainLayout.width - space;
                 }
             } else if ((plasmoid.location === PlasmaCore.Types.LeftEdge) || (plasmoid.location === PlasmaCore.Types.RightEdge)){
                 if (plasmoid.location === PlasmaCore.Types.LeftEdge) {
@@ -246,7 +248,7 @@ Item{
                 } else if (root.panelAlignment === Latte.Dock.Center) {
                     localY = (dock.height/2) - tempLength/2;
                 } else if (root.panelAlignment === Latte.Dock.Bottom) {
-                    localY = dock.height - mainLayout.height - (space/2);
+                    localY = dock.height - mainLayout.height - space;
                 }
             }
         } else {

containment/contents/ui/main.qml

@@ -95,6 +95,7 @@ DragDrop.DropArea {
                                               : height * (plasmoid.configuration.maxLength/100)
 
     property int panelEdgeSpacing: iconSize / 3
+    property int totalPanelEdgeSpacing: 0 //this is set by PanelBox
     //FIXME: this is not needed any more probably
     property int previousAllTasks: -1    //is used to forbit updateAutomaticIconSize when hovering
     property int realSize: iconSize + iconMargin
@@ -103,6 +104,7 @@ DragDrop.DropArea {
     property int realPanelThickness: 0
     //this is set by the PanelBox
     property int panelMargin: 0
+    property int panelMarginLength: 0
     property int panelShadow: 0 //shadowsSize
     property int editShadow: Math.ceil(iconSize / 5)
     property int themePanelSize: {
@@ -501,7 +503,7 @@ DragDrop.DropArea {
         }
 
         dndSpacer.opacity = 0;
-      //  dndSpacer.parent = root;
+        //  dndSpacer.parent = root;
     }
 
     onLatteAppletChanged: {
@@ -1124,21 +1126,26 @@ DragDrop.DropArea {
         sourceComponent: DebugWindow{}
     }
 
-    /*Loader{
+    //! Load a sepia background in order to avoid black background
+    Loader{
         anchors.fill: parent
-        active: root.editMode
+        active: !Latte.WindowSystem.compositingActive && root.editMode
+        sourceComponent: Image{
+            anchors.fill: parent
+            fillMode: Image.Tile
+            source: "../icons/sepiaprint.jpg"
+        }
+    }
 
-        sourceComponent:
-    }*/
 
     EditModeVisual{
         id:editModeVisual
-        z: root.drawShadowsExternal || !Latte.WindowSystem.compositingActive ? 1 : 0
+        z: root.drawShadowsExternal ? 1 : 0
     }
 
     Item{
         anchors.fill:layoutsContainer
-        z: root.drawShadowsExternal || !Latte.WindowSystem.compositingActive ? 0 : 1
+        z: root.drawShadowsExternal ? 0 : 1
 
         PanelBox{}
     }
@@ -1207,7 +1214,7 @@ DragDrop.DropArea {
 
         x: {
             if ( dock && (plasmoid.configuration.panelPosition === Latte.Dock.Justify) && root.isHorizontal
-                    && !root.editMode && Latte.WindowSystem.compositingActive && !root.drawShadowsExternal ){
+                    && !root.editMode && !root.drawShadowsExternal ){
                 return ((dock.width/2) - (root.maxLength/2))
             } else {
                 if ((visibilityManager.inSlidingIn || visibilityManager.inSlidingOut) && root.isVertical){
@@ -1224,7 +1231,7 @@ DragDrop.DropArea {
 
         y: {
             if ( dock && (plasmoid.configuration.panelPosition === Latte.Dock.Justify) && root.isVertical
-                    && !root.editMode && Latte.WindowSystem.compositingActive && !root.drawShadowsExternal ) {
+                    && !root.editMode && !root.drawShadowsExternal ) {
                 return ((dock.height/2) - (root.maxLength/2));
             } else {
                 if ((visibilityManager.inSlidingIn || visibilityManager.inSlidingOut) && root.isHorizontal){