Commit c811ece5 authored by Ronan's avatar Ronan

feat(ui/modules/Common/Menus): Big API changes, better and cleaner

parent 4fa94882
......@@ -221,10 +221,10 @@
<file>ui/modules/Common/Image/Icon.qml</file>
<file>ui/modules/Common/Image/RoundedImage.qml</file>
<file>ui/modules/Common/Indicators/VuMeter.qml</file>
<file>ui/modules/Common/Menus/ActionMenuEntry.qml</file>
<file>ui/modules/Common/Menus/ActionMenu.qml</file>
<file>ui/modules/Common/Menus/ApplicationMenu.qml</file>
<file>ui/modules/Common/Menus/DropDownDynamicMenu.qml</file>
<file>ui/modules/Common/Menus/Menu.qml</file>
<file>ui/modules/Common/Menus/DropDownStaticMenuEntry.qml</file>
<file>ui/modules/Common/Menus/DropDownStaticMenu.qml</file>
<file>ui/modules/Common/Misc/Borders.qml</file>
<file>ui/modules/Common/Misc/Collapse.qml</file>
<file>ui/modules/Common/Misc/ForceScrollBar.qml</file>
......@@ -261,8 +261,8 @@
<file>ui/modules/Common/Styles/Form/Tab/TabContainerStyle.qml</file>
<file>ui/modules/Common/Styles/Form/TransparentTextInputStyle.qml</file>
<file>ui/modules/Common/Styles/Indicators/VuMeterStyle.qml</file>
<file>ui/modules/Common/Styles/Menus/ActionMenuStyle.qml</file>
<file>ui/modules/Common/Styles/Menus/MenuStyle.qml</file>
<file>ui/modules/Common/Styles/Menus/ApplicationMenuStyle.qml</file>
<file>ui/modules/Common/Styles/Menus/DropDownStaticMenuStyle.qml</file>
<file>ui/modules/Common/Styles/Misc/CollapseStyle.qml</file>
<file>ui/modules/Common/Styles/Misc/ForceScrollBarStyle.qml</file>
<file>ui/modules/Common/Styles/Misc/PanedStyle.qml</file>
......
......@@ -33,7 +33,7 @@ Item {
// ---------------------------------------------------------------------------
function hideMenu () {
function closeMenu () {
if (!_isOpen) {
return
}
......@@ -41,7 +41,7 @@ Item {
_isOpen = false
}
function showMenu () {
function openMenu () {
if (_isOpen) {
return
}
......@@ -68,16 +68,16 @@ Item {
icon: 'search'
width: parent.width
Keys.onEscapePressed: searchBox.hideMenu()
Keys.onEscapePressed: searchBox.closeMenu()
Keys.onReturnPressed: {
searchBox.hideMenu()
searchBox.closeMenu()
searchBox.enterPressed()
}
onActiveFocusChanged: {
if (activeFocus && !_isOpen) {
searchBox.menuRequested()
searchBox.showMenu()
searchBox.openMenu()
}
}
......@@ -96,7 +96,7 @@ Item {
// So It's necessary to map the keys events.
Keys.forwardTo: searchField
onMenuClosed: searchBox.hideMenu()
onClosed: searchBox.closeMenu()
ScrollableListView {
id: list
......@@ -121,7 +121,7 @@ Item {
ScriptAction {
script: {
menu.show()
menu.open()
searchBox.menuOpened()
}
......@@ -134,7 +134,7 @@ Item {
ScriptAction {
script: {
menu.hide()
menu.close()
searchField.focus = false
searchBox.menuClosed()
......
......@@ -38,7 +38,7 @@ Item {
// ---------------------------------------------------------------------------
function hideMenu () {
function closeMenu () {
if (!_isOpen) {
return
}
......@@ -46,7 +46,7 @@ Item {
_isOpen = false
}
function showMenu () {
function openMenu () {
if (_isOpen) {
return
}
......@@ -60,7 +60,7 @@ Item {
}
function _handleCoords () {
searchBox.hideMenu()
searchBox.closeMenu()
var point = searchBox.mapToItem(null, 0, searchBox.height)
......@@ -82,16 +82,16 @@ Item {
icon: 'search'
width: parent.width
Keys.onEscapePressed: searchBox.hideMenu()
Keys.onEscapePressed: searchBox.closeMenu()
Keys.onReturnPressed: {
searchBox.hideMenu()
searchBox.closeMenu()
searchBox.enterPressed()
}
onActiveFocusChanged: {
if (activeFocus && !_isOpen) {
searchBox.menuRequested()
searchBox.showMenu()
searchBox.openMenu()
}
}
......@@ -118,7 +118,7 @@ Item {
requestActivate: true
onVisibleChanged: !visible && searchBox.hideMenu()
onVisibleChanged: !visible && searchBox.closeMenu()
DropDownDynamicMenu {
id: menu
......@@ -127,7 +127,7 @@ Item {
// So It's necessary to map the keys events.
Keys.forwardTo: searchField
onMenuClosed: searchBox.hideMenu()
onClosed: searchBox.closeMenu()
ScrollableListView {
id: list
......@@ -153,8 +153,8 @@ Item {
ScriptAction {
script: {
menu.show()
desktopPopup.show()
menu.open()
desktopPopup.open()
searchBox.menuOpened()
}
......@@ -167,9 +167,9 @@ Item {
ScriptAction {
script: {
menu.hide()
menu.close()
searchField.focus = false
desktopPopup.hide()
desktopPopup.close()
searchBox.menuClosed()
}
......
import QtQuick 2.7
import QtQuick.Layouts 1.3
import Common.Styles 1.0
// =============================================================================
ColumnLayout {
id: menu
spacing: ActionMenuStyle.spacing
property int entryHeight
property int entryWidth
}
......@@ -35,7 +35,7 @@ Rectangle {
// ---------------------------------------------------------------------------
color: MenuStyle.backgroundColor
color: ApplicationMenuStyle.backgroundColor
implicitHeight: content.height
width: entryWidth
......@@ -43,19 +43,19 @@ Rectangle {
id: content
anchors.centerIn: parent
spacing: MenuStyle.spacing
spacing: ApplicationMenuStyle.spacing
Repeater {
model: entries
Rectangle {
color: mouseArea.pressed
? MenuStyle.entry.color.pressed
? ApplicationMenuStyle.entry.color.pressed
: (_selectedEntry === index
? MenuStyle.entry.color.selected
? ApplicationMenuStyle.entry.color.selected
: (mouseArea.containsMouse
? MenuStyle.entry.color.hovered
: MenuStyle.entry.color.normal
? ApplicationMenuStyle.entry.color.hovered
: ApplicationMenuStyle.entry.color.normal
)
)
height: menu.entryHeight
......@@ -64,13 +64,13 @@ Rectangle {
RowLayout {
anchors {
left: parent.left
leftMargin: MenuStyle.entry.leftMargin
leftMargin: ApplicationMenuStyle.entry.leftMargin
right: parent.right
rightMargin: MenuStyle.entry.rightMargin
rightMargin: ApplicationMenuStyle.entry.rightMargin
verticalCenter: parent.verticalCenter
}
spacing: MenuStyle.entry.spacing
spacing: ApplicationMenuStyle.entry.spacing
Icon {
icon: modelData.icon + (
......@@ -78,15 +78,15 @@ Rectangle {
? '_selected'
: '_normal'
)
iconSize: MenuStyle.entry.iconSize
iconSize: ApplicationMenuStyle.entry.iconSize
}
Text {
Layout.fillWidth: true
color: _selectedEntry === index
? MenuStyle.entry.text.color.selected
: MenuStyle.entry.text.color.normal
font.pointSize: MenuStyle.entry.text.fontSize
? ApplicationMenuStyle.entry.text.color.selected
: ApplicationMenuStyle.entry.text.color.normal
font.pointSize: ApplicationMenuStyle.entry.text.fontSize
height: parent.height
text: modelData.entryName
verticalAlignment: Text.AlignVCenter
......@@ -100,9 +100,9 @@ Rectangle {
height: parent.height
color: _selectedEntry === index
? MenuStyle.entry.indicator.color
? ApplicationMenuStyle.entry.indicator.color
: 'transparent'
width: MenuStyle.entry.indicator.width
width: ApplicationMenuStyle.entry.indicator.width
}
MouseArea {
......
......@@ -22,17 +22,17 @@ Item {
// ---------------------------------------------------------------------------
signal menuClosed
signal menuOpened
signal closed
signal opened
// ---------------------------------------------------------------------------
function show () {
popup.show()
function open () {
popup.open()
}
function hide () {
popup.hide()
function close () {
popup.close()
}
// ---------------------------------------------------------------------------
......@@ -63,11 +63,15 @@ Item {
// ---------------------------------------------------------------------------
visible: false
// ---------------------------------------------------------------------------
Popup {
id: popup
onShown: menu.menuOpened()
onHidden: menu.menuClosed()
onOpened: menu.opened()
onClosed: menu.closed()
Item {
id: menuContent
......
import QtQuick 2.7
import QtQuick.Layouts 1.3
import Common 1.0
import Common.Styles 1.0
// =============================================================================
Item {
id: menu
// ---------------------------------------------------------------------------
property alias relativeTo: popup.relativeTo
property alias relativeX: popup.relativeX
property alias relativeY: popup.relativeY
property alias entryHeight: menuContent.entryHeight
property alias entryWidth: menuContent.entryWidth
default property alias _content: menuContent.data
// ---------------------------------------------------------------------------
signal closed
signal opened
// ---------------------------------------------------------------------------
function open () {
popup.open()
}
function close () {
popup.close()
}
// ---------------------------------------------------------------------------
visible: false
// ---------------------------------------------------------------------------
Popup {
id: popup
onOpened: menu.opened()
onClosed: menu.closed()
ColumnLayout {
id: menuContent
property int entryHeight
property int entryWidth
spacing: DropDownStaticMenuStyle.spacing
height: menu._content.length
width: menu.entryWidth
}
}
}
......@@ -12,10 +12,10 @@ Rectangle {
signal clicked
color: mouseArea.pressed
? ActionMenuStyle.entry.color.pressed
? DropDownStaticMenuStyle.entry.color.pressed
: (mouseArea.containsMouse
? ActionMenuStyle.entry.color.hovered
: ActionMenuStyle.entry.color.normal
? DropDownStaticMenuStyle.entry.color.hovered
: DropDownStaticMenuStyle.entry.color.normal
)
height: parent.entryHeight
width: parent.entryWidth
......@@ -25,14 +25,14 @@ Rectangle {
anchors {
left: parent.left
leftMargin: ActionMenuStyle.entry.leftMargin
leftMargin: DropDownStaticMenuStyle.entry.leftMargin
right: parent.right
rightMargin: ActionMenuStyle.entry.rightMargin
rightMargin: DropDownStaticMenuStyle.entry.rightMargin
}
color: ActionMenuStyle.entry.text.color
color: DropDownStaticMenuStyle.entry.text.color
elide: Text.ElideRight
font.pointSize: ActionMenuStyle.entry.text.fontSize
font.pointSize: DropDownStaticMenuStyle.entry.text.fontSize
height: parent.height
verticalAlignment: Text.AlignVCenter
......
......@@ -10,24 +10,24 @@ Item {
// ---------------------------------------------------------------------------
property alias popupX: popup.x
property alias popupY: popup.y
property alias popupX: window.x
property alias popupY: window.y
property bool requestActivate: false
property int flags: Qt.SplashScreen
readonly property alias popupWidth: popup.width
readonly property alias popupHeight: popup.height
readonly property alias popupWidth: window.width
readonly property alias popupHeight: window.height
default property alias _content: content.data
property bool _isOpen: false
// ---------------------------------------------------------------------------
function show () {
function open () {
_isOpen = true
}
function hide () {
function close () {
_isOpen = false
}
......@@ -45,7 +45,7 @@ Item {
y: 0
Window {
id: popup
id: window
// Used for internal purposes only. Like Notifications.
objectName: '__internalWindow'
......@@ -70,7 +70,7 @@ Item {
PropertyChanges {
opacity: 1.0
target: popup
target: window
}
}
......@@ -81,10 +81,10 @@ Item {
ScriptAction {
script: {
popup.showNormal()
window.showNormal()
if (wrapper.requestActivate) {
popup.requestActivate()
window.requestActivate()
}
}
}
......@@ -95,7 +95,7 @@ Item {
to: ''
ScriptAction {
script: popup.hide()
script: window.hide()
}
}
]
......
......@@ -18,14 +18,12 @@ Item {
// ---------------------------------------------------------------------------
signal hidden
signal shown
signal closed
signal opened
// ---------------------------------------------------------------------------
visible: false
function show () {
function open () {
if (popup.visible) {
return
}
......@@ -51,7 +49,7 @@ Item {
popup.open()
}
function hide () {
function close () {
if (!popup.visible) {
return
}
......@@ -64,6 +62,10 @@ Item {
// ---------------------------------------------------------------------------
visible: false
// ---------------------------------------------------------------------------
Controls.Popup {
id: popup
......@@ -85,7 +87,7 @@ Item {
Component.onCompleted: parent = Utils.getTopParent(this)
onClosed: wrapper.hidden()
onOpened: wrapper.shown()
onClosed: wrapper.closed()
onOpened: wrapper.opened()
}
}
......@@ -40,8 +40,8 @@ singleton TabContainerStyle 1.0 Form/Tab/TabContainerStyle.qml
singleton VuMeterStyle 1.0 Indicators/VuMeterStyle.qml
singleton ActionMenuStyle 1.0 Menus/ActionMenuStyle.qml
singleton MenuStyle 1.0 Menus/MenuStyle.qml
singleton ApplicationMenuStyle 1.0 Menus/ApplicationMenuStyle.qml
singleton DropDownStaticMenuStyle 1.0 Menus/DropDownStaticMenuStyle.qml
singleton CollapseStyle 1.0 Misc/CollapseStyle.qml
singleton ForceScrollBarStyle 1.0 Misc/ForceScrollBarStyle.qml
......
......@@ -61,10 +61,10 @@ RoundedImage 1.0 Image/RoundedImage.qml
VuMeter 1.0 Indicators/VuMeter.qml
ActionMenu 1.0 Menus/ActionMenu.qml
ActionMenuEntry 1.0 Menus/ActionMenuEntry.qml
ApplicationMenu 1.0 Menus/ApplicationMenu.qml
DropDownDynamicMenu 1.0 Menus/DropDownDynamicMenu.qml
Menu 1.0 Menus/Menu.qml
DropDownStaticMenu 1.0 Menus/DropDownStaticMenu.qml
DropDownStaticMenuEntry 1.0 Menus/DropDownStaticMenuEntry.qml
Borders 1.0 Misc/Borders.qml
Collapse 1.0 Misc/Collapse.qml
......
......@@ -59,30 +59,26 @@ ListView {
: 'burger_menu'
iconSize: CallsStyle.entry.iconMenuSize
onClicked: popup.show()
onClicked: menu.open()
Popup {
id: popup
DropDownStaticMenu {
id: menu
relativeTo: callControls
relativeX: callControls.width
ActionMenu {
id: actionMenu
entryHeight: CallsStyle.entry.height
entryWidth: CallsStyle.entry.width
entryHeight: CallsStyle.entry.height
entryWidth: CallsStyle.entry.width
Repeater {
model: params.actions
Repeater {
model: params.actions
DropDownStaticMenuEntry {
entryName: modelData.name
ActionMenuEntry {
entryName: modelData.name
onClicked: {
popup.hide()
params.actions[index].handler()
}
onClicked: {
menu.close()
params.actions[index].handler()
}
}
}
......
......@@ -18,7 +18,7 @@ Item {
// ---------------------------------------------------------------------------
function show () {
function open () {
var length = sipAddresses.length
if (!length) {
return
......@@ -28,7 +28,7 @@ Item {
return sipAddressesMenu.sipAddressClicked(sipAddresses[0])
}
menu.show()
menu.open()
}
function _fillModel () {
......@@ -104,7 +104,7 @@ Item {
hoverEnabled: true
onClicked: {
menu.hide()
menu.close()
sipAddressesMenu.sipAddressClicked($sipAddress)
}
}
......
......@@ -91,7 +91,7 @@ SearchBox {
ActionButton {
icon: 'video_call'
onClicked: {
searchBox.hideMenu()
searchBox.closeMenu()
searchBox.launchVideoCall(interpretableSipAddress)
}
}
......@@ -99,7 +99,7 @@ SearchBox {
ActionButton {
icon: 'call'
onClicked: {
searchBox.hideMenu()
searchBox.closeMenu()
searchBox.launchCall(interpretableSipAddress)
}
}
......@@ -107,7 +107,7 @@ SearchBox {
ActionButton {
icon: 'chat'
onClicked: {
searchBox.hideMenu()
searchBox.closeMenu()
searchBox.launchChat(interpretableSipAddress)
}
}
......@@ -127,7 +127,7 @@ SearchBox {
width: parent.width
onClicked: {
searchBox.hideMenu()
searchBox.closeMenu()
searchBox.addContact(interpretableSipAddress)
}
......@@ -218,7 +218,7 @@ SearchBox {
hoverEnabled: true
onClicked: {
searchBox.hideMenu()
searchBox.closeMenu()
searchBox.entryClicked($entry)
}
}
......@@ -234,7 +234,7 @@ SearchBox {
ActionButton {
icon: 'video_call'
onClicked: {
searchBox.hideMenu()
searchBox.closeMenu()
searchBox.launchVideoCall($entry.sipAddress)
}
}
......@@ -242,7 +242,7 @@ SearchBox {
ActionButton {
icon: 'call'
onClicked: {
searchBox.hideMenu()
searchBox.closeMenu()
searchBox.launchCall($entry.sipAddress)
}
}
......@@ -250,7 +250,7 @@ SearchBox {
ActionButton {
icon: 'chat'
onClicked: {
searchBox.hideMenu()
searchBox.closeMenu()
searchBox.launchChat($entry.sipAddress)
}
}
......
......@@ -24,7 +24,7 @@ function handleStatusChanged (status) {
}
telKeypad.visible = false
callStatistics.hide()
callStatistics.close()
}
}
......
......@@ -70,7 +70,7 @@ Rectangle {
iconSize: CallStyle.header.iconSize
useStates: false
onClicked: callStatistics.show()
onClicked: callStatistics.open()
// See: http://www.linphone.org/docs/liblinphone/group__call__misc.html#ga62c7d3d08531b0cc634b797e273a0a73
Timer {
......
......@@ -123,7 +123,7 @@ ColumnLayout {
ActionButton {
icon: 'history'
onClicked: sipAddressesMenu.showMenu()