a1bee6f8a7
Buttons are exported as a global "options" in the factory. Additionally the theme's buttons are also exported. The thme decided based on the custom button positions property which one to use. In the kcm the button options are also exported.
326 lines
15 KiB
QML
326 lines
15 KiB
QML
/********************************************************************
|
|
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
|
|
import org.kde.plasma.core 0.1 as PlasmaCore
|
|
|
|
Decoration {
|
|
function updateState() {
|
|
if (!decoration.active && decoration.maximized && backgroundSvg.supportsMaximizedInactive) {
|
|
root.state = "maximized-inactive";
|
|
} else if (decoration.maximized && backgroundSvg.supportsMaximized) {
|
|
root.state = "maximized";
|
|
} else if (!decoration.active && backgroundSvg.supportsInactive) {
|
|
root.state = "inactive";
|
|
} else {
|
|
root.state = "active";
|
|
}
|
|
}
|
|
id: root
|
|
borderLeft: Math.max(0, auroraeTheme.borderLeft)
|
|
borderRight: Math.max(0, auroraeTheme.borderRight)
|
|
borderTop: Math.max(0, auroraeTheme.borderTop)
|
|
borderBottom: Math.max(0, auroraeTheme.borderBottom)
|
|
borderLeftMaximized: Math.max(0, auroraeTheme.borderLeftMaximized)
|
|
borderRightMaximized: Math.max(0, auroraeTheme.borderRightMaximized)
|
|
borderBottomMaximized: Math.max(0, auroraeTheme.borderBottomMaximized)
|
|
borderTopMaximized: Math.max(0, auroraeTheme.borderTopMaximized)
|
|
paddingLeft: auroraeTheme.paddingLeft
|
|
paddingRight: auroraeTheme.paddingRight
|
|
paddingBottom: auroraeTheme.paddingBottom
|
|
paddingTop: auroraeTheme.paddingTop
|
|
Component.onCompleted: updateState()
|
|
PlasmaCore.FrameSvg {
|
|
property bool supportsInactive: hasElementPrefix("decoration-inactive")
|
|
property bool supportsMaximized: hasElementPrefix("decoration-maximized")
|
|
property bool supportsMaximizedInactive: hasElementPrefix("decoration-maximized-inactive")
|
|
property bool supportsInnerBorderInactive: hasElementPrefix("innerborder-inactive")
|
|
id: backgroundSvg
|
|
imagePath: auroraeTheme.decorationPath
|
|
}
|
|
PlasmaCore.FrameSvgItem {
|
|
id: decorationActive
|
|
anchors.fill: parent
|
|
imagePath: backgroundSvg.imagePath
|
|
prefix: "decoration"
|
|
}
|
|
PlasmaCore.FrameSvgItem {
|
|
id: decorationInactive
|
|
anchors.fill: parent
|
|
imagePath: backgroundSvg.imagePath
|
|
prefix: "decoration-inactive"
|
|
opacity: 0
|
|
}
|
|
PlasmaCore.FrameSvgItem {
|
|
id: decorationMaximized
|
|
anchors {
|
|
left: parent.left
|
|
right: parent.right
|
|
top: parent.top
|
|
leftMargin: parent.paddingLeft
|
|
rightMargin: parent.paddingRight
|
|
topMargin: parent.paddingTop
|
|
}
|
|
imagePath: backgroundSvg.imagePath
|
|
prefix: "decoration-maximized"
|
|
opacity: 0
|
|
height: parent.borderTopMaximized
|
|
}
|
|
PlasmaCore.FrameSvgItem {
|
|
id: decorationMaximizedInactive
|
|
anchors {
|
|
left: parent.left
|
|
right: parent.right
|
|
top: parent.top
|
|
leftMargin: parent.paddingLeft
|
|
rightMargin: parent.paddingRight
|
|
topMargin: parent.paddingTop
|
|
}
|
|
imagePath: backgroundSvg.imagePath
|
|
prefix: "decoration-maximized-inactive"
|
|
opacity: 0
|
|
height: parent.borderTopMaximized
|
|
}
|
|
AuroraeButtonGroup {
|
|
id: leftButtonGroup
|
|
buttons: options.customButtonPositions ? options.leftButtons : auroraeTheme.defaultButtonsLeft
|
|
width: childrenRect.width
|
|
anchors {
|
|
top: parent.top
|
|
left: parent.left
|
|
leftMargin: auroraeTheme.titleEdgeLeft + root.paddingLeft
|
|
topMargin: root.paddingTop + auroraeTheme.titleEdgeTop + auroraeTheme.buttonMarginTop
|
|
}
|
|
transitions: [
|
|
Transition {
|
|
to: "normal"
|
|
ParallelAnimation {
|
|
NumberAnimation { target: leftButtonGroup; property: "anchors.leftMargin"; to: auroraeTheme.titleEdgeLeft + root.paddingLeft; duration: auroraeTheme.animationTime }
|
|
NumberAnimation { target: leftButtonGroup; property: "anchors.topMargin"; to: root.paddingTop + auroraeTheme.titleEdgeTop + auroraeTheme.buttonMarginTop; duration: auroraeTheme.animationTime }
|
|
}
|
|
},
|
|
Transition {
|
|
to: "maximized"
|
|
ParallelAnimation {
|
|
NumberAnimation { target: leftButtonGroup; property: "anchors.leftMargin"; to: auroraeTheme.titleEdgeLeftMaximized + root.paddingLeft; duration: auroraeTheme.animationTime }
|
|
NumberAnimation { target: leftButtonGroup; property: "anchors.topMargin"; to: root.paddingTop + auroraeTheme.titleEdgeTopMaximized + auroraeTheme.buttonMarginTop; duration: auroraeTheme.animationTime }
|
|
}
|
|
}
|
|
]
|
|
}
|
|
AuroraeButtonGroup {
|
|
id: rightButtonGroup
|
|
buttons: options.customButtonPositions ? options.rightButtons : auroraeTheme.defaultButtonsRight
|
|
width: childrenRect.width
|
|
anchors {
|
|
top: parent.top
|
|
right: parent.right
|
|
rightMargin: auroraeTheme.titleEdgeRight + root.paddingRight
|
|
topMargin: root.paddingTop + auroraeTheme.titleEdgeTop + auroraeTheme.buttonMarginTop
|
|
}
|
|
transitions: [
|
|
Transition {
|
|
to: "normal"
|
|
ParallelAnimation {
|
|
NumberAnimation { target: rightButtonGroup; property: "anchors.rightMargin"; to: auroraeTheme.titleEdgeRight + root.paddingRight; duration: auroraeTheme.animationTime }
|
|
NumberAnimation { target: rightButtonGroup; property: "anchors.topMargin"; to: root.paddingTop + auroraeTheme.titleEdgeTop + auroraeTheme.buttonMarginTop; duration: auroraeTheme.animationTime }
|
|
}
|
|
},
|
|
Transition {
|
|
to: "maximized"
|
|
ParallelAnimation {
|
|
NumberAnimation { target: rightButtonGroup; property: "anchors.rightMargin"; to: auroraeTheme.titleEdgeRightMaximized + root.paddingRight; duration: auroraeTheme.animationTime }
|
|
NumberAnimation { target: rightButtonGroup; property: "anchors.topMargin"; to: root.paddingTop + auroraeTheme.titleEdgeTopMaximized + auroraeTheme.buttonMarginTop; duration: auroraeTheme.animationTime }
|
|
}
|
|
}
|
|
]
|
|
}
|
|
Text {
|
|
id: caption
|
|
text: decoration.caption
|
|
horizontalAlignment: auroraeTheme.horizontalAlignment
|
|
verticalAlignment: auroraeTheme.verticalAlignment
|
|
elide: Text.ElideRight
|
|
height: auroraeTheme.titleHeight
|
|
anchors {
|
|
left: leftButtonGroup.right
|
|
right: rightButtonGroup.left
|
|
top: root.top
|
|
topMargin: root.paddingTop + auroraeTheme.titleEdgeTop
|
|
leftMargin: auroraeTheme.titleBorderLeft
|
|
rightMargin: auroraeTheme.titleBorderRight
|
|
}
|
|
MouseArea {
|
|
acceptedButtons: Qt.LeftButton | Qt.RightButton | Qt.MiddleButton
|
|
anchors.fill: parent
|
|
onDoubleClicked: decoration.titlebarDblClickOperation()
|
|
onPressed: decoration.titlePressed(mouse.button, mouse.buttons)
|
|
onReleased: decoration.titleReleased(mouse.button, mouse.buttons)
|
|
}
|
|
}
|
|
PlasmaCore.FrameSvgItem {
|
|
function checkVisible() {
|
|
if (decoration.maximized) {
|
|
state = "invisible";
|
|
} else {
|
|
if (!decoration.active && backgroundSvg.supportsInnerBorderInactive) {
|
|
state = "invisible";
|
|
} else {
|
|
state = "visible";
|
|
}
|
|
}
|
|
}
|
|
id: innerBorder
|
|
anchors {
|
|
fill: parent
|
|
leftMargin: parent.paddingLeft + parent.borderLeft - margins.left
|
|
rightMargin: parent.paddingRight + parent.borderRight - margins.right
|
|
topMargin: parent.paddingTop + parent.borderTop - margins.top
|
|
bottomMargin: parent.paddingBottom + parent.borderBottom - margins.bottom
|
|
}
|
|
imagePath: backgroundSvg.imagePath
|
|
prefix: "innerborder"
|
|
states: [
|
|
State { name: "visible" },
|
|
State { name: "invisible" }
|
|
]
|
|
transitions: [
|
|
Transition {
|
|
to: "visible"
|
|
ParallelAnimation {
|
|
NumberAnimation { target: innerBorder; property: "opacity"; to: 1; duration: auroraeTheme.animationTime }
|
|
}
|
|
},
|
|
Transition {
|
|
to: "invisible"
|
|
ParallelAnimation {
|
|
NumberAnimation { target: innerBorder; property: "opacity"; to: 0; duration: auroraeTheme.animationTime }
|
|
}
|
|
}
|
|
]
|
|
Component.onCompleted: checkVisible()
|
|
Connections {
|
|
target: decoration
|
|
onActiveChanged: innerBorder.checkVisible()
|
|
onMaximizedChanged: innerBorder.checkVisible()
|
|
}
|
|
}
|
|
PlasmaCore.FrameSvgItem {
|
|
function checkVisible() {
|
|
if (decoration.maximized) {
|
|
state = "invisible";
|
|
} else {
|
|
if (!decoration.active && backgroundSvg.supportsInnerBorderInactive) {
|
|
state = "visible";
|
|
} else {
|
|
state = "invisible";
|
|
}
|
|
}
|
|
}
|
|
id: innerBorderInactive
|
|
anchors {
|
|
fill: parent
|
|
leftMargin: parent.paddingLeft + parent.borderLeft - margins.left
|
|
rightMargin: parent.paddingRight + parent.borderRight - margins.right
|
|
topMargin: parent.paddingTop + parent.borderTop - margins.top
|
|
bottomMargin: parent.paddingBottom + parent.borderBottom - margins.bottom
|
|
}
|
|
imagePath: backgroundSvg.imagePath
|
|
prefix: "innerborder-inactive"
|
|
states: [
|
|
State { name: "visible" },
|
|
State { name: "invisible" }
|
|
]
|
|
transitions: [
|
|
Transition {
|
|
to: "visible"
|
|
ParallelAnimation {
|
|
NumberAnimation { target: innerBorderInactive; property: "opacity"; to: 1; duration: auroraeTheme.animationTime }
|
|
}
|
|
},
|
|
Transition {
|
|
to: "invisible"
|
|
ParallelAnimation {
|
|
NumberAnimation { target: innerBorderInactive; property: "opacity"; to: 0; duration: auroraeTheme.animationTime }
|
|
}
|
|
}
|
|
]
|
|
Component.onCompleted: checkVisible()
|
|
Connections {
|
|
target: decoration
|
|
onActiveChanged: innerBorderInactive.checkVisible()
|
|
onMaximizedChanged: innerBorderInactive.checkVisible()
|
|
}
|
|
}
|
|
states: [
|
|
State { name: "active" },
|
|
State { name: "inactive" },
|
|
State { name: "maximized" },
|
|
State { name: "maximized-inactive" }
|
|
]
|
|
transitions: [
|
|
Transition {
|
|
to: "active"
|
|
// Cross fade from inactive to active
|
|
ParallelAnimation {
|
|
NumberAnimation { target: decorationActive; property: "opacity"; to: 1; duration: auroraeTheme.animationTime }
|
|
NumberAnimation { target: decorationInactive; property: "opacity"; to: 0; duration: auroraeTheme.animationTime }
|
|
NumberAnimation { target: decorationMaximized; property: "opacity"; to: 0; duration: auroraeTheme.animationTime }
|
|
ColorAnimation { target: caption; property: "color"; to: auroraeTheme.activeTextColor; duration: auroraeTheme.animationTime }
|
|
NumberAnimation { target: caption; property: "anchors.topMargin"; to: root.paddingTop + auroraeTheme.titleEdgeTop; duration: auroraeTheme.animationTime }
|
|
}
|
|
},
|
|
Transition {
|
|
to: "inactive"
|
|
// Cross fade from active to inactive
|
|
ParallelAnimation {
|
|
NumberAnimation { target: decorationActive; property: "opacity"; to: 0; duration: auroraeTheme.animationTime }
|
|
NumberAnimation { target: decorationInactive; property: "opacity"; to: 1; duration: auroraeTheme.animationTime }
|
|
NumberAnimation { target: decorationMaximized; property: "opacity"; to: 0; duration: auroraeTheme.animationTime }
|
|
NumberAnimation { target: decorationMaximizedInactive; property: "opacity"; to: 0; duration: auroraeTheme.animationTime }
|
|
ColorAnimation { target: caption; property: "color"; to: auroraeTheme.inactiveTextColor; duration: auroraeTheme.animationTime }
|
|
NumberAnimation { target: caption; property: "anchors.topMargin"; to: root.paddingTop + auroraeTheme.titleEdgeTop; duration: auroraeTheme.animationTime }
|
|
}
|
|
},
|
|
Transition {
|
|
to: "maximized"
|
|
ParallelAnimation {
|
|
NumberAnimation { target: decorationActive; property: "opacity"; to: 0; duration: auroraeTheme.animationTime }
|
|
NumberAnimation { target: decorationInactive; property: "opacity"; to: 0; duration: auroraeTheme.animationTime }
|
|
NumberAnimation { target: decorationMaximizedInactive; property: "opacity"; to: 0; duration: auroraeTheme.animationTime }
|
|
NumberAnimation { target: decorationMaximized; property: "opacity"; to: 1; duration: auroraeTheme.animationTime }
|
|
ColorAnimation { target: caption; property: "color"; to: auroraeTheme.activeTextColor; duration: auroraeTheme.animationTime }
|
|
NumberAnimation { target: caption; property: "anchors.topMargin"; to: root.paddingTop + auroraeTheme.titleEdgeTopMaximized; duration: auroraeTheme.animationTime }
|
|
}
|
|
},
|
|
Transition {
|
|
to: "maximized-inactive"
|
|
ParallelAnimation {
|
|
NumberAnimation { target: decorationActive; property: "opacity"; to: 0; duration: auroraeTheme.animationTime }
|
|
NumberAnimation { target: decorationInactive; property: "opacity"; to: 0; duration: auroraeTheme.animationTime }
|
|
NumberAnimation { target: decorationMaximizedInactive; property: "opacity"; to: 1; duration: auroraeTheme.animationTime }
|
|
NumberAnimation { target: decorationMaximized; property: "opacity"; to: 0; duration: auroraeTheme.animationTime }
|
|
ColorAnimation { target: caption; property: "color"; to: auroraeTheme.inactiveTextColor; duration: auroraeTheme.animationTime }
|
|
NumberAnimation { target: caption; property: "anchors.topMargin"; to: root.paddingTop + auroraeTheme.titleEdgeTopMaximized; duration: auroraeTheme.animationTime }
|
|
}
|
|
}
|
|
]
|
|
Connections {
|
|
target: decoration
|
|
onActiveChanged: updateState()
|
|
onMaximizedChanged: updateState()
|
|
}
|
|
}
|