diff --git a/qml.qrc b/qml.qrc
index 640897b0e06aa7b7f8206e065b7374f2e28459fd..79b1f5204ecdfd91acf4663838a7ed6192079d64 100644
--- a/qml.qrc
+++ b/qml.qrc
@@ -2,8 +2,7 @@
<qresource prefix="/">
<file>src/constant/JamiStrings.qml</file>
<file>src/settingsview/SettingsView.qml</file>
- <file>src/settingsview/components/IconButton.qml</file>
- <file>src/settingsview/components/LeftPanelView.qml</file>
+ <file>src/settingsview/components/SettingsMenu.qml</file>
<file>src/settingsview/components/SettingsHeader.qml</file>
<file>src/settingsview/components/SystemSettings.qml</file>
<file>src/settingsview/components/RecordingSettings.qml</file>
diff --git a/src/commoncomponents/PushButton.qml b/src/commoncomponents/PushButton.qml
index c12fedc820593b4757673974ca8ac150c662946e..7fd80ffd123c49a64b7c350166b174e0eaeceadb 100644
--- a/src/commoncomponents/PushButton.qml
+++ b/src/commoncomponents/PushButton.qml
@@ -54,13 +54,16 @@ AbstractButton {
property string pressedColor: JamiTheme.pressedButtonColor
property string hoveredColor: JamiTheme.hoveredButtonColor
property string normalColor: JamiTheme.normalButtonColor
+ property string checkedColor: pressedColor
+
+ // State transition duration
property int duration: JamiTheme.fadeDuration
// Image properties
property alias source: image.source
property var imageColor: null
property string normalImageSource
- property var checkedColor: null
+ property var checkedImageColor: null
property string checkedImageSource
property alias imagePadding: image.padding
property alias imageOffset: image.offset
@@ -68,7 +71,7 @@ AbstractButton {
width: preferredSize
height: preferredSize
- checkable: true
+ checkable: false
checked: false
hoverEnabled: true
focusPolicy: Qt.TabFocus
@@ -83,35 +86,35 @@ AbstractButton {
radius: preferredSize
states: [
+ State {
+ name: "checked"; when: checked
+ PropertyChanges { target: background; color: checkedColor }
+ },
State {
name: "pressed"; when: pressed
PropertyChanges { target: background; color: pressedColor }
- PropertyChanges { target: image; offset: Qt.point(0, 0.5) }
},
State {
name: "hovered"; when: hovered
PropertyChanges { target: background; color: hoveredColor }
},
State {
- name: "normal"; when: !hovered
+ name: "normal"; when: !hovered && ! checked
PropertyChanges { target: background; color: normalColor }
}
]
transitions: [
Transition {
- to: "normal"; reversible: true
+ to: "normal"; reversible: true; enabled: duration
ColorAnimation { duration: root.duration }
},
Transition {
- to: "pressed"; reversible: true
- ParallelAnimation {
- ColorAnimation { duration: root.duration * 0.5 }
- NumberAnimation { duration: root.duration * 0.5 }
- }
+ to: "pressed"; reversible: true; enabled: duration
+ ColorAnimation { duration: root.duration * 0.5 }
},
Transition {
- to: ""; reversible: true
+ to: ""; reversible: true; enabled: duration
ColorAnimation { duration: root.duration }
}
]
@@ -139,9 +142,12 @@ AbstractButton {
effect: ColorOverlay {
id: overlay
color: {
- if (checked && checkedColor) return checkedColor
- else if (imageColor) return imageColor
- else return JamiTheme.transparentColor
+ if (checked && checkedImageColor)
+ return checkedImageColor
+ else if (imageColor)
+ return imageColor
+ else
+ return JamiTheme.transparentColor
}
}
}
diff --git a/src/mainview/MainView.qml b/src/mainview/MainView.qml
index d393508dcee383f88fd7c399c15ec602f60e7f84..46d522b5c558cfc55e4a3f4a1d38b4ab26087852 100644
--- a/src/mainview/MainView.qml
+++ b/src/mainview/MainView.qml
@@ -156,11 +156,11 @@ Window {
if (inSettingsView) {
if (sidePanelOnly)
- sidePanelViewStack.push(leftPanelSettingsView, StackView.Immediate)
+ sidePanelViewStack.push(settingsMenu, StackView.Immediate)
else {
mainViewStack.pop(welcomePage, StackView.Immediate)
mainViewStack.push(settingsView, StackView.Immediate)
- sidePanelViewStack.push(leftPanelSettingsView, StackView.Immediate)
+ sidePanelViewStack.push(settingsMenu, StackView.Immediate)
var windowCurrentMinimizedSize = settingsViewPreferredWidth
+ sidePanelViewStackPreferredWidth + onWidthChangedTriggerDistance
@@ -294,7 +294,7 @@ Window {
width: mainViewSidePanelRect.width
height: 64
- visible: (mainViewWindowSidePanel.visible || leftPanelSettingsView.visible)
+ visible: (mainViewWindowSidePanel.visible || settingsMenu.visible)
currentIndex: 0
@@ -373,46 +373,20 @@ Window {
id: accountListModel
}
- LeftPanelView {
- id: leftPanelSettingsView
+ SettingsMenu {
+ id: settingsMenu
- objectName: "leftPanelSettingsView"
+ objectName: "settingsMenu"
visible: false
- contentViewportWidth: mainViewSidePanelRect.width
- contentViewPortHeight: mainViewSidePanelRect.height
- Connections {
- target: leftPanelSettingsView.btnAccountSettings
- function onCheckedToggledForRightPanel(checked) {
- settingsView.setSelected(SettingsView.Account)
- if (sidePanelOnly)
- sidePanelViewStack.push(settingsView, StackView.Immediate)
- }
- }
- Connections {
- target: leftPanelSettingsView.btnGeneralSettings
- function onCheckedToggledForRightPanel(checked) {
- settingsView.setSelected(SettingsView.General)
- if (sidePanelOnly)
- sidePanelViewStack.push(settingsView, StackView.Immediate)
- }
- }
- Connections {
- target: leftPanelSettingsView.btnMediaSettings
- function onCheckedToggledForRightPanel(checked) {
- settingsView.setSelected(SettingsView.Media)
- if (sidePanelOnly)
- sidePanelViewStack.push(settingsView, StackView.Immediate)
- }
- }
- Connections {
- target: leftPanelSettingsView.btnPluginSettings
- function onCheckedToggledForRightPanel(checked) {
- settingsView.setSelected(SettingsView.Plugin)
- if (sidePanelOnly)
- sidePanelViewStack.push(settingsView, StackView.Immediate)
- }
+ width: mainViewSidePanelRect.width
+ height: mainViewSidePanelRect.height
+
+ onItemSelected: {
+ settingsView.setSelected(index)
+ if (sidePanelOnly)
+ sidePanelViewStack.push(settingsView, StackView.Immediate)
}
}
@@ -534,7 +508,7 @@ Window {
})
if (inSettingsView) {
- if (sidePanelViewStack.currentItem.objectName !== leftPanelSettingsView.objectName)
+ if (sidePanelViewStack.currentItem.objectName !== settingsMenu.objectName)
sidePanelViewStack.pop(StackView.Immediate)
mainViewStack.push(settingsView, StackView.Immediate)
} else if (inSidePanelViewStack) {
@@ -577,7 +551,7 @@ Window {
if (!inSettingsView) {
toggleSettingsView()
}
- leftPanelSettingsView.btnMediaSettings.clicked()
+ settingsMenu.btnMediaSettings.clicked()
}
}
@@ -588,7 +562,7 @@ Window {
if (!inSettingsView) {
toggleSettingsView()
}
- leftPanelSettingsView.btnGeneralSettings.clicked()
+ settingsMenu.btnGeneralSettings.clicked()
}
}
@@ -599,7 +573,7 @@ Window {
if (!inSettingsView) {
toggleSettingsView()
}
- leftPanelSettingsView.btnAccountSettings.clicked()
+ settingsMenu.btnAccountSettings.clicked()
}
}
@@ -610,7 +584,7 @@ Window {
if (!inSettingsView) {
toggleSettingsView()
}
- leftPanelSettingsView.btnPluginSettings.clicked()
+ settingsMenu.btnPluginSettings.clicked()
}
}
diff --git a/src/mainview/components/CallOverlayButtonGroup.qml b/src/mainview/components/CallOverlayButtonGroup.qml
index cc4b2308a61f9962fa6381a38a297512f9a3b24b..b3d4b182bd080d32f7b8762461f97eb7680a7858 100644
--- a/src/mainview/components/CallOverlayButtonGroup.qml
+++ b/src/mainview/components/CallOverlayButtonGroup.qml
@@ -92,9 +92,9 @@ Rectangle {
normalImageSource: "qrc:/images/icons/mic-24px.svg"
imageColor: JamiTheme.whiteColor
-
+ checkable: true
checkedImageSource: "qrc:/images/icons/mic_off-24px.svg"
- checkedColor: JamiTheme.declineButtonPressedRed
+ checkedImageColor: JamiTheme.declineButtonPressedRed
toolTipText: !checked ? JamiStrings.mute : JamiStrings.unmute
@@ -131,9 +131,9 @@ Rectangle {
normalImageSource: "qrc:/images/icons/videocam-24px.svg"
imageColor: JamiTheme.whiteColor
-
+ checkable: true
checkedImageSource: "qrc:/images/icons/videocam_off-24px.svg"
- checkedColor: JamiTheme.declineButtonPressedRed
+ checkedImageColor: JamiTheme.declineButtonPressedRed
toolTipText: !checked ? JamiStrings.pause : JamiStrings.resume
diff --git a/src/settingsview/SettingsView.qml b/src/settingsview/SettingsView.qml
index da9ca9648352e2dd2187c8b57703e08e39a97e22..92e2586d39333e31bb1dd0a2c59402ecb04f81cd 100644
--- a/src/settingsview/SettingsView.qml
+++ b/src/settingsview/SettingsView.qml
@@ -31,7 +31,7 @@ import "components"
Rectangle {
id: root
- enum SettingsMenu{
+ enum SettingsMenu {
Account,
General,
Media,
@@ -53,8 +53,7 @@ Rectangle {
pageIdCurrentAccountSettings.connectCurrentAccount()
settingsViewRect.stopPreviewing()
selectedMenu = sel
- if(pageIdCurrentAccountSettings.isPhotoBoothOpened())
- {
+ if(pageIdCurrentAccountSettings.isPhotoBoothOpened()) {
settingsViewRect.setAvatar()
}
pageIdCurrentAccountSettings.updateAccountInfoDisplayed()
diff --git a/src/settingsview/components/IconButton.qml b/src/settingsview/components/IconButton.qml
deleted file mode 100644
index 5d5be18b0afa406ee685be158c4f93f7f0d341ab..0000000000000000000000000000000000000000
--- a/src/settingsview/components/IconButton.qml
+++ /dev/null
@@ -1,131 +0,0 @@
-/*
- * Copyright (C) 2019-2020 by Savoir-faire Linux
- * Author: Yang Wang <yang.wang@savoirfairelinux.com>
- *
- * 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 3 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 2.15
-import QtQuick.Window 2.14
-import QtQuick.Controls 2.14
-import QtQuick.Layouts 1.14
-import QtQuick.Controls.Universal 2.12
-import QtGraphicalEffects 1.14
-
-import "../../constant"
-
-Button {
- id: button
- checkable: true
- hoverEnabled: true
-
- property alias imageSource: buttonPix.source
- property alias buttonText: buttonText.text
-
- property string backgroundColor: JamiTheme.normalButtonColor
- property string onPressColor: JamiTheme.pressedButtonColor
- property string onReleaseColor: JamiTheme.normalButtonColor
- property string onEnterColor: JamiTheme.hoveredButtonColor
- property string onExitColor: JamiTheme.transparentColor
- property string checkedColor: JamiTheme.normalButtonColor
-
- signal checkedToggledForLeftPanel(var checked)
- signal checkedToggledForRightPanel(var checked)
-
- function setCheckedState(check, triggerSignal) {
- button.checked = check
- if (triggerSignal) {
- checkedToggledForLeftPanel(check)
- checkedToggledForRightPanel(check)
- }
- button.background.color = check ? button.checkedColor : button.onExitColor
- }
-
- onClicked: {
- setCheckedState(true, true)
- }
-
- Layout.minimumHeight: 64
- Layout.preferredHeight: 64
- Layout.maximumHeight: 64
-
- Layout.fillWidth: true
-
- background: Rectangle {
- anchors.fill: parent
- color: parent.checked ? button.checkedColor : button.onExitColor
-
- RowLayout {
- anchors.fill: parent
- spacing: 24
- Image {
- id: buttonPix
- Layout.minimumHeight: 24
- Layout.preferredHeight: 24
- Layout.maximumHeight: 24
-
- Layout.minimumWidth: 24
- Layout.preferredWidth: 24
- Layout.maximumWidth: 24
-
- Layout.leftMargin: 24
-
- Layout.alignment: Qt.AlignLeft | Qt.AlignVCenter
- }
-
- Label {
- id: buttonText
-
- Layout.alignment: Qt.AlignLeft | Qt.AlignVCenter
-
- Layout.fillHeight: true
- Layout.fillWidth: true
-
- font.pointSize: JamiTheme.textFontSize+2
- font.kerning: true
-
- horizontalAlignment: Text.AlignLeft
- verticalAlignment: Text.AlignVCenter
- }
- }
-
- MouseArea {
- anchors.fill: parent
-
- hoverEnabled: true
-
- onPressed: {
- if (!button.checked) {
- parent.color = button.onPressColor
- }
- }
- onReleased: {
- button.clicked()
- if (!button.checked) {
- parent.color = button.onExitColor
- }
- }
- onEntered: {
- if (!button.checked) {
- parent.color = button.onEnterColor
- }
- }
- onExited: {
- if (!button.checked) {
- parent.color = button.onExitColor
- }
- }
- }
- }
-}
diff --git a/src/settingsview/components/LeftPanelView.qml b/src/settingsview/components/LeftPanelView.qml
deleted file mode 100644
index e1e0a1312cb1aea5cb42a609f527c5f8fc07af16..0000000000000000000000000000000000000000
--- a/src/settingsview/components/LeftPanelView.qml
+++ /dev/null
@@ -1,116 +0,0 @@
-/*
- * Copyright (C) 2019-2020 by Savoir-faire Linux
- * Author: Yang Wang <yang.wang@savoirfairelinux.com>
- *
- * 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 3 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 2.15
-import QtQuick.Window 2.14
-import QtQuick.Controls 1.4 as CT
-import QtQuick.Controls 2.14
-import QtQuick.Controls.Universal 2.12
-import QtQuick.Layouts 1.3
-import QtGraphicalEffects 1.14
-import net.jami.Models 1.0
-
-import "../../commoncomponents"
-import "../../mainview/components"
-
-Rectangle {
- id: leftPanelRect
-
- property int contentViewportWidth: 200
- property int contentViewPortHeight: 768
-
- property alias btnAccountSettings: accountSettingsButton
- property alias btnGeneralSettings: generalSettingsButton
- property alias btnMediaSettings: mediaSettingsButton
- property alias btnPluginSettings: pluginSettingsButton
-
- signal btnExitClicked
-
- Component.onCompleted: {
- accountSettingsButton.setCheckedState(true, true)
- }
-
- anchors.fill: parent
- clip: true
- color: JamiTheme.backgroundColor
-
- ColumnLayout {
- spacing: 0
-
- width: contentViewportWidth
- height: contentViewPortHeight
-
- IconButton {
- id: accountSettingsButton
-
- buttonText: qsTr("Account")
- imageSource: "qrc:/images/icons/baseline-people-24px.svg"
-
- onCheckedToggledForLeftPanel: {
- generalSettingsButton.setCheckedState(!checked, false)
- mediaSettingsButton.setCheckedState(!checked, false)
- pluginSettingsButton.setCheckedState(!checked, false)
- }
- }
-
- IconButton {
- id: generalSettingsButton
-
- buttonText: qsTr("General")
- imageSource: "qrc:/images/icons/round-settings-24px.svg"
-
- onCheckedToggledForLeftPanel: {
- accountSettingsButton.setCheckedState(!checked, false)
- mediaSettingsButton.setCheckedState(!checked, false)
- pluginSettingsButton.setCheckedState(!checked, false)
- }
- }
-
- IconButton {
- id: mediaSettingsButton
-
- buttonText: qsTr("Audio/Video")
- imageSource: "qrc:/images/icons/baseline-desktop_windows-24px.svg"
-
- onCheckedToggledForLeftPanel: {
- generalSettingsButton.setCheckedState(!checked, false)
- accountSettingsButton.setCheckedState(!checked, false)
- pluginSettingsButton.setCheckedState(!checked, false)
- }
- }
-
- IconButton {
- id: pluginSettingsButton
-
- buttonText: qsTr("Plugins")
- imageSource: "qrc:/images/icons/extension_24dp.svg"
-
- onCheckedToggledForLeftPanel: {
- generalSettingsButton.setCheckedState(!checked, false)
- accountSettingsButton.setCheckedState(!checked, false)
- mediaSettingsButton.setCheckedState(!checked, false)
- }
- }
-
- Item {
- Layout.fillWidth: true
- Layout.fillHeight: true
- }
- }
-}
-
diff --git a/src/settingsview/components/SettingsMenu.qml b/src/settingsview/components/SettingsMenu.qml
new file mode 100644
index 0000000000000000000000000000000000000000..90ecf0056d42aed6e046a536d3f9b61aeaa0de18
--- /dev/null
+++ b/src/settingsview/components/SettingsMenu.qml
@@ -0,0 +1,89 @@
+/*
+ * Copyright (C) 2020 by Savoir-faire Linux
+ * Author: Andreas Traczyk <andreas.traczyk@savoirfairelinux.com>
+ *
+ * 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 3 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 2.14
+import QtQuick.Controls 2.14
+import QtQuick.Layouts 1.14
+import net.jami.Models 1.0
+
+// TODO: these includes should generally be resource uris
+import "../../commoncomponents"
+import "../../settingsview"
+
+Rectangle {
+ id: root
+
+ signal itemSelected(int index)
+
+ Component.onCompleted: {
+ listModel.append({ 'type': SettingsView.Account, 'name': qsTr("Account"),
+ 'iconSource': "qrc:/images/icons/baseline-people-24px.svg"})
+ listModel.append({ 'type': SettingsView.General, 'name': qsTr("General"),
+ 'iconSource': "qrc:/images/icons/round-settings-24px.svg"})
+ listModel.append({ 'type': SettingsView.Media, 'name': qsTr("Audio/Video"),
+ 'iconSource': "qrc:/images/icons/baseline-desktop_windows-24px.svg"})
+ listModel.append({ 'type': SettingsView.Plugin, 'name': qsTr("Plugin"),
+ 'iconSource': "qrc:/images/icons/extension_24dp.svg"})
+ }
+
+ anchors.fill: parent
+ color: JamiTheme.backgroundColor
+
+ ButtonGroup {
+ buttons: buttons.children
+ onCheckedButtonChanged: itemSelected(checkedButton.menuType)
+ }
+
+ Column {
+ id: buttons
+
+ spacing: 0
+ anchors.left: parent.left
+ anchors.right: parent.right
+ height: childrenRect.height
+
+ Repeater {
+ id: repeater
+
+ model: ListModel { id: listModel }
+
+ PushButton {
+ property int menuType: type
+
+ Component.onCompleted: checked = type === SettingsView.Account
+
+ width: root.width
+ height: 64
+
+ buttonText: name
+ source: iconSource
+ pressedColor: Qt.lighter(JamiTheme.pressedButtonColor, 1.25)
+ checkedColor: JamiTheme.normalButtonColor
+ hoveredColor: JamiTheme.hoverColor
+ fontPointSize: JamiTheme.textFontSize + 2
+ duration: 0
+ textHAlign: Text.AlignLeft
+ preferredMargin: 24
+ normalColor: root.color
+ checkable: true
+ radius: 0
+ }
+ }
+ }
+}
+