restore the tabbar in the top panel

containments/panel/contents/ui/main.qml

@@ -44,7 +44,7 @@ PlasmaCore.ColorScope {
     }
 
     function addApplet(applet, x, y) {
-        var container = appletContainerComponent.createObject(layout)
+        var container = appletContainerComponent.createObject(tabGroup)
         container.visible = true
         print("Applet added: " + applet + " " + applet.title)
 
@@ -52,48 +52,22 @@ PlasmaCore.ColorScope {
         var appletHeight = applet.height;
         applet.parent = container;
         container.applet = applet;
-        //applet.anchors.fill = container;
+        applet.anchors.fill = container;
-        applet.anchors.left = container.left;
-        applet.anchors.right = container.right;
-        applet.height = units.iconSizes.medium;
         applet.visible = true;
         container.visible = true;
 
-        // If the provided position is valid, use it.
+        //container.parent = tabs;
-        if (x >= 0 && y >= 0) {
-            var index = LayoutManager.insertAtCoordinates(container, x , y);
 
-        // Fall through to determining an appropriate insert position.
+        //The tab
-        } else {
+        var tab = tabComponent.createObject(tabBar.layout);
-            var before = null;
+        tab.iconSource = applet.icon;
-
+        tab.tab = container;
-            if (lastSpacer.parent === layout) {
-                before = lastSpacer;
-            }
-
-            if (before) {
-                LayoutManager.insertBefore(before, container);
-
-            // Fall through to adding at the end.
-            } else {
-                container.parent = layout;
-            }
-
-            //event compress the enable of animations
-            //startupTimer.restart();
-        }
-
-        if (applet.Layout.fillWidth) {
-            lastSpacer.parent = root;
-        } else {
-            lastSpacer.parent = layout;
-        }
     }
 
     Component.onCompleted: {
         LayoutManager.plasmoid = plasmoid;
         LayoutManager.root = root;
-        LayoutManager.layout = layout;
+        LayoutManager.layout = appletsLayout;
         LayoutManager.restore();
     }
 
@@ -117,46 +91,11 @@ PlasmaCore.ColorScope {
     Component {
         id: appletContainerComponent
         Item {
-            id: containerItem
+            //not used yet
+            property bool animationsEnabled: false
             property Item applet
             Layout.fillWidth: true
-            clip: true
+            Layout.fillHeight: true
-            anchors {
-               left: parent.left
-               right: parent.right
-            }
-            height: applet && (applet.expanded || plasmoid.applets.count == 1) ? Math.max(applet.fullRepresentationItem.Layout.minimumHeight, units.iconSizes.medium) : units.iconSizes.medium
-            Behavior on height {
-                NumberAnimation {
-                    duration: units.shortDuration
-                    easing.type: Easing.InOutQuad
-                }
-            }
-
-            Connections {
-                target: applet
-                onExpandedChanged: {
-
-                    if (!applet.expanded && root.expandedApplet == applet) {
-                        root.expandedApplet = null;
-                        return;
-                    }
-                    if (root.expandedApplet && root.expandedApplet != applet) {
-                        root.expandedApplet.expanded = false;
-                    }
-                    root.expandedApplet = applet;
-                }
-            }
-
-            MouseArea {
-                id: mouseArea
-
-                property bool wasExpanded: false
-
-                anchors.fill: parent
-                onPressed: wasExpanded = applet.expanded
-                onClicked: applet.expanded = !wasExpanded
-            }
         }
     }
 
@@ -286,17 +225,27 @@ PlasmaCore.ColorScope {
         contents: Item {
             id: panelContents
             anchors.fill: parent
-            clip: true
 
-            Item {
+            PlasmaComponents.TabBar {
-                id: lastSpacer
+                id: tabBar
-                Layout.fillWidth: true
+                visible: plasmoid.applets.length > 1
-                Layout.fillHeight: true
+                anchors {
+                    left: parent.left
+                    top: parent.top
+                    right: parent.right
+                    margins: units.smallSpacing
+                }
+                height: units.iconSizes.huge
+            }
+            PlasmaComponents.TabGroup {
+                id: tabGroup
+                anchors {
+                    left: parent.left
+                    top: plasmoid.applets.length > 1 ? tabBar.bottom : parent.top
+                    right: parent.right
+                    bottom: parent.bottom
+                    margins: units.smallSpacing
                 }
-            Column {
-                id: layout
-                anchors.fill: parent
-                spacing: units.smallSpacing
             }
         }
     }

shell/contents/applet/CompactApplet.qml

@@ -57,8 +57,9 @@ Item {
     }
 
     Row {
+        id: label
         height: units.iconSizes.medium
-        anchors.left: compactRepresentation ? compactRepresentation.right : undefined
+        anchors.left: compactRepresentation ? compactRepresentation.right : parent.left
         PlasmaCore.SvgItem {
             svg: PlasmaCore.Svg {
                 id: arrowSvg
@@ -78,7 +79,11 @@ Item {
 
     Rectangle {
         id: expandedItem
-        anchors.fill: parent
+        anchors {
+            left: parent.left
+            right: parent.right
+        }
+        height: units.iconSizes.medium
         color: PlasmaCore.ColorScope.highlightColor
         opacity: plasmoid.expanded ? 0.3 : 0
         Behavior on opacity {
@@ -92,17 +97,13 @@ Item {
     Item {
         id: appletParent
         opacity: plasmoid.expanded ? 1 : 0
-        anchors.top: parent.bottom
+        anchors.top: label.bottom
-        Layout.minimumWidth: (fullRepresentation && fullRepresentation.Layout) ? fullRepresentation.Layout.minimumWidth : 0
+        width: parent.width
-        Layout.minimumHeight: (fullRepresentation && fullRepresentation.Layout) ? fullRepresentation.Layout.minimumHeight: 0
+        height: units.gridUnit * 20 - units.iconSizes.medium
-        Layout.maximumWidth: (fullRepresentation && fullRepresentation.Layout) ? fullRepresentation.Layout.maximumWidth : Infinity
-        Layout.maximumHeight: (fullRepresentation && fullRepresentation.Layout) ? fullRepresentation.Layout.maximumHeight: Infinity
-        width: Math.max(parent.width, Layout.minimumWidth)
-        height: Layout.minimumHeight
 
         Behavior on opacity {
             OpacityAnimator {
-                duration: units.shortDuration
+                duration: units.longDuration
                 easing.type: Easing.InOutQuad
             }
         }