Better Maximized/Restore button

Use just one button with the two variants embedded. Makes the state
transitions more robust.

clients/aurorae/src/CMakeLists.txt

@@ -21,6 +21,7 @@ install( FILES
     qml/aurorae.qml
     qml/AuroraeButton.qml
     qml/AuroraeButtonGroup.qml
+    qml/AuroraeMaximizeButton.qml
     qml/Decoration.qml
     qml/DecorationButton.qml
     qml/MenuButton.qml

clients/aurorae/src/qml/AuroraeButton.qml

@@ -193,9 +193,6 @@ DecorationButton {
         } else {
             visible = buttonSvg.imagePath != "";
         }
-        if (buttonType == "R") {
-            visible = decoration.maximized;
-        }
     }
     onHoveredChanged: {
         if (state == "active-pressed" || state == "inactive-pressed") {
@@ -331,22 +328,5 @@ DecorationButton {
                 state = "active";
             }
         }
-        onMaximizedChanged: {
-            if (buttonType != "A" && buttonType != "R") {
-                return;
-            }
-            if (auroraeTheme.restoreButtonPath != "") {
-                if (buttonType == "A") {
-                    visible = !decoration.maximized;
-                } else if (buttonType == "R") {
-                    visible = decoration.maximized;
-                }
-                if (!decoration.active && buttonSvg.supportsInactive) {
-                    state = "inactive";
-                } else {
-                    state = "active";
-                }
-            }
-        }
     }
 }

clients/aurorae/src/qml/AuroraeButtonGroup.qml

@@ -35,11 +35,11 @@ Item {
             } else if (buttons.charAt(i) == "M") {
                 Qt.createQmlObject("import QtQuick 1.1; MenuButton { width: auroraeTheme.buttonWidthMenu; height: auroraeTheme.buttonHeight }",
                     groupRow, "menuButton" + buttons + i);
+            } else if (buttons.charAt(i) == "A") {
+                var maximizeComponent = Qt.createComponent("AuroraeMaximizeButton.qml");
+                maximizeComponent.createObject(groupRow);
             } else {
                 component.createObject(groupRow, {buttonType: buttons.charAt(i)});
-                if (buttons.charAt(i) == "A") {
-                    component.createObject(groupRow, {buttonType: "R"});
-                }
             }
         }
     }

clients/aurorae/src/qml/AuroraeMaximizeButton.qml

@@ -0,0 +1,66 @@
+/********************************************************************
+Copyright (C) 2012 Martin Gräßlin <mgraesslin@kde.org>
+
+This program is free software; you can redistribute it and/or modify
+it under the terms of the GNU General Public License as published by
+the Free Software Foundation; either version 2 of the License, or
+(at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+General Public License for more details.
+
+You should have received a copy of the GNU General Public License
+along with this program.  If not, see <http://www.gnu.org/licenses/>.
+*********************************************************************/
+import QtQuick 1.1
+
+Item {
+    function checkState() {
+        if (decoration.maximized && auroraeTheme.restoreButtonPath != "") {
+            button.state = "restore";
+        } else {
+            button.state = "maximize";
+        }
+    }
+    id: button
+    width: auroraeTheme.buttonWidthMaximizeRestore
+    height: auroraeTheme.buttonHeight
+    states: [
+        State { name: "maximize" },
+        State { name: "restore" }
+    ]
+    AuroraeButton {
+        id: maximizeButton
+        anchors.fill: parent
+        buttonType: "A"
+    }
+    AuroraeButton {
+        id: restoreButton
+        anchors.fill: parent
+        buttonType: "R"
+        opacity: 0
+    }
+    transitions: [
+        Transition {
+            to: "maximize"
+            ParallelAnimation {
+                NumberAnimation { target: maximizeButton; property: "opacity"; to: 1; duration: auroraeTheme.animationTime }
+                NumberAnimation { target: restoreButton; property: "opacity"; to: 0; duration: auroraeTheme.animationTime }
+            }
+        },
+        Transition {
+            to: "restore"
+            ParallelAnimation {
+                NumberAnimation { target: maximizeButton; property: "opacity"; to: 0; duration: auroraeTheme.animationTime }
+                NumberAnimation { target: restoreButton; property: "opacity"; to: 1; duration: auroraeTheme.animationTime }
+            }
+        }
+    ]
+    Connections {
+        target: decoration
+        onMaximizedChanged: button.checkState()
+    }
+    Component.onCompleted: button.checkState()
+}