Commit fbcbb7e1 authored by Ronan Abhamon's avatar Ronan Abhamon

feat(app): add many links between components

parent 6fa3026c
...@@ -119,7 +119,7 @@ ...@@ -119,7 +119,7 @@
</message> </message>
<message> <message>
<source>addContact</source> <source>addContact</source>
<translation></translation> <translation>ADD CONTACTS</translation>
</message> </message>
<message> <message>
<source>displayTooltip</source> <source>displayTooltip</source>
......
...@@ -119,7 +119,7 @@ ...@@ -119,7 +119,7 @@
</message> </message>
<message> <message>
<source>addContact</source> <source>addContact</source>
<translation></translation> <translation>AJOUTER CONTACTS</translation>
</message> </message>
<message> <message>
<source>displayTooltip</source> <source>displayTooltip</source>
......
...@@ -118,10 +118,10 @@ ScrollableListView { ...@@ -118,10 +118,10 @@ ScrollableListView {
id: loader id: loader
source: $type === 'message' source: $type === 'message'
? ( ? (
'qrc:/ui/Linphone/Chat/' + 'qrc:/ui/modules/Linphone/Chat/' +
($outgoing ? 'Outgoing' : 'Incoming') + ($outgoing ? 'Outgoing' : 'Incoming') +
'Message.qml' 'Message.qml'
) : 'qrc:/ui/Linphone/Chat/Event.qml' ) : 'qrc:/ui/modules/Linphone/Chat/Event.qml'
} }
} }
......
...@@ -24,10 +24,10 @@ ColumnLayout { ...@@ -24,10 +24,10 @@ ColumnLayout {
model: entries model: entries
Rectangle { Rectangle {
color: _selectedEntry === index color: mouseArea.pressed
? MenuStyle.entry.color.selected ? MenuStyle.entry.color.pressed
: (mouseArea.pressed : (_selectedEntry === index
? MenuStyle.entry.color.pressed ? MenuStyle.entry.color.selected
: (mouseArea.containsMouse : (mouseArea.containsMouse
? MenuStyle.entry.color.hovered ? MenuStyle.entry.color.hovered
: MenuStyle.entry.color.normal : MenuStyle.entry.color.normal
...@@ -76,10 +76,8 @@ ColumnLayout { ...@@ -76,10 +76,8 @@ ColumnLayout {
hoverEnabled: true hoverEnabled: true
onClicked: { onClicked: {
if (_selectedEntry !== index) { _selectedEntry = index
_selectedEntry = index entrySelected(index)
entrySelected(index)
}
} }
} }
} }
......
...@@ -5,86 +5,86 @@ import QtQuick.Layouts 1.3 ...@@ -5,86 +5,86 @@ import QtQuick.Layouts 1.3
import Linphone 1.0 import Linphone 1.0
ColumnLayout { ColumnLayout {
spacing: 0 spacing: 0
Rectangle { Rectangle {
Layout.fillWidth: true Layout.fillWidth: true
Layout.preferredHeight: 102 Layout.preferredHeight: 102
color: '#D1D1D1' color: '#D1D1D1'
RowLayout { RowLayout {
anchors.left: parent.left anchors.left: parent.left
anchors.leftMargin: 40 anchors.leftMargin: 40
anchors.right: parent.right anchors.right: parent.right
anchors.rightMargin: 10 anchors.rightMargin: 10
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
height: 80 height: 80
spacing: 0 spacing: 0
width: parent.width width: parent.width
Avatar { Avatar {
Layout.fillHeight: true Layout.fillHeight: true
Layout.preferredWidth: 80 Layout.preferredWidth: 80
Layout.rightMargin: 30 Layout.rightMargin: 30
presence: 'connected' // TODO: Use C++. presence: 'connected' // TODO: Use C++.
username: 'Cameron Andrews' // TODO: Use C++. username: 'Cameron Andrews' // TODO: Use C++.
} }
// TODO: Replace by text edit. // TODO: Replace by text edit.
// Component: EditableContactDescription. // Component: EditableContactDescription.
ContactDescription { ContactDescription {
Layout.fillHeight: true Layout.fillHeight: true
Layout.fillWidth: true Layout.fillWidth: true
username: 'Cameron Andrews' // TODO: Use C++. username: 'Cameron Andrews' // TODO: Use C++.
} }
ActionBar { ActionBar {
iconSize: 32 iconSize: 32
Layout.alignment: Qt.AlignBottom | Qt.AlignRight Layout.alignment: Qt.AlignBottom | Qt.AlignRight
ActionButton { ActionButton {
icon: 'delete' icon: 'history'
onClicked: console.log('clicked!!!') onClicked: window.setView('Conversation')
} }
ActionButton { ActionButton {
icon: 'contact' icon: 'delete'
onClicked: console.log('clicked!!!') onClicked: console.log('clicked!!!')
}
}
} }
}
} }
}
Flickable { Flickable {
Layout.fillHeight: true Layout.fillHeight: true
Layout.fillWidth: true Layout.fillWidth: true
ScrollBar.vertical: ForceScrollBar { } ScrollBar.vertical: ForceScrollBar { }
boundsBehavior: Flickable.StopAtBounds boundsBehavior: Flickable.StopAtBounds
clip: true clip: true
contentHeight: content.height contentHeight: content.height
flickableDirection: Flickable.VerticalFlick flickableDirection: Flickable.VerticalFlick
ColumnLayout { ColumnLayout {
anchors.left: parent.left anchors.left: parent.left
anchors.margins: 20 anchors.margins: 20
anchors.right: parent.right anchors.right: parent.right
id: content id: content
ListForm { ListForm {
title: qsTr('sipAccounts') title: qsTr('sipAccounts')
} }
ListForm { ListForm {
title: qsTr('address') title: qsTr('address')
} }
ListForm { ListForm {
title: qsTr('emails') title: qsTr('emails')
} }
ListForm { ListForm {
title: qsTr('webSites') title: qsTr('webSites')
} }
}
} }
}
} }
This diff is collapsed.
...@@ -5,147 +5,147 @@ import QtQuick.Layouts 1.3 ...@@ -5,147 +5,147 @@ import QtQuick.Layouts 1.3
import Linphone 1.0 import Linphone 1.0
ColumnLayout { ColumnLayout {
spacing: 0 spacing: 0
// Contact bar.
Rectangle {
Layout.fillWidth: true
Layout.preferredHeight: 102
color: '#D1D1D1'
RowLayout {
anchors.left: parent.left
anchors.leftMargin: 40
anchors.right: parent.right
anchors.rightMargin: 40
anchors.verticalCenter: parent.verticalCenter
height: 80
spacing: 50
width: parent.width
Avatar {
Layout.fillHeight: true
Layout.preferredWidth: 80
presence: 'connected' // TODO: Use C++.
username: 'Cameron Andrews' // TODO: Use C++.
}
// Contact bar. Column {
Rectangle { Layout.fillHeight: true
Layout.fillWidth: true Layout.fillWidth: true
Layout.preferredHeight: 102
color: '#D1D1D1' // Contact description.
ContactDescription {
RowLayout { height: parent.height * 0.60
anchors.left: parent.left sipAddress: 'cam.andrews@sip.linphone.org' // TODO: Use C++.
anchors.leftMargin: 40 username: 'Cameron Andrews' // TODO: Use C++.
anchors.right: parent.right width: parent.width
anchors.rightMargin: 40 }
anchors.verticalCenter: parent.verticalCenter
height: 80 // Contact actions.
spacing: 50 Row {
width: parent.width height: parent.height * 0.40
width: parent.width
Avatar {
Layout.fillHeight: true ActionBar {
Layout.preferredWidth: 80 iconSize: 32
presence: 'connected' // TODO: Use C++. width: parent.width / 2
username: 'Cameron Andrews' // TODO: Use C++.
ActionButton {
icon: 'cam'
onClicked: console.log('clicked!!!')
} }
Column { ActionButton {
Layout.fillHeight: true icon: 'call'
Layout.fillWidth: true onClicked: console.log('clicked!!!')
// Contact description.
ContactDescription {
height: parent.height * 0.60
sipAddress: 'cam.andrews@sip.linphone.org' // TODO: Use C++.
username: 'Cameron Andrews' // TODO: Use C++.
width: parent.width
}
// Contact actions.
Row {
height: parent.height * 0.40
width: parent.width
ActionBar {
iconSize: 32
width: parent.width / 2
ActionButton {
icon: 'cam'
onClicked: console.log('clicked!!!')
}
ActionButton {
icon: 'call'
onClicked: console.log('clicked!!!')
}
}
ActionBar {
iconSize: 32
layoutDirection: Qt.RightToLeft
width: parent.width / 2
ActionButton {
icon: 'delete'
onClicked: console.log('clicked!!!')
}
ActionButton {
icon: 'contact'
onClicked: console.log('clicked!!!')
}
}
}
} }
} }
}
// Messages/Calls filter. ActionBar {
Rectangle { iconSize: 32
Layout.fillWidth: true layoutDirection: Qt.RightToLeft
Layout.preferredHeight: 40 width: parent.width / 2
color: '#C7C7C7'
ActionButton {
Rectangle { icon: 'delete'
anchors.fill: parent onClicked: console.log('clicked!!!')
anchors.leftMargin: 1
ExclusiveButtons {
anchors.left: parent.left
anchors.leftMargin: 40
anchors.verticalCenter: parent.verticalCenter
texts: [
qsTr('displayCallsAndMessages'),
qsTr('displayCalls'),
qsTr('displayMessages')
]
} }
ActionButton {
icon: 'contact'
onClicked: window.setView('Contact')
}
}
} }
}
} }
}
// Messages/Calls filter.
Rectangle {
Layout.fillWidth: true
Layout.preferredHeight: 40
color: '#C7C7C7'
Rectangle { Rectangle {
Layout.fillHeight: true anchors.fill: parent
Layout.fillWidth: true anchors.leftMargin: 1
border.color: '#C7C7C7'
border.width: 1 ExclusiveButtons {
id: messagesArea anchors.left: parent.left
anchors.leftMargin: 40
Chat { anchors.verticalCenter: parent.verticalCenter
ScrollBar.vertical: ForceScrollBar { } texts: [
anchors.bottomMargin: messagesArea.border.width qsTr('displayCallsAndMessages'),
anchors.fill: parent qsTr('displayCalls'),
anchors.topMargin: messagesArea.border.width qsTr('displayMessages')
} ]
}
}
}
Rectangle {
Layout.fillHeight: true
Layout.fillWidth: true
border.color: '#C7C7C7'
border.width: 1
id: messagesArea
Chat {
ScrollBar.vertical: ForceScrollBar { }
anchors.bottomMargin: messagesArea.border.width
anchors.fill: parent
anchors.topMargin: messagesArea.border.width
} }
}
// Send area. // Send area.
Rectangle { Rectangle {
Layout.fillWidth: true Layout.fillWidth: true
Layout.preferredHeight: 70 Layout.preferredHeight: 70
border.color: textArea.activeFocus ? '#8E8E8E' : '#C7C7C7' border.color: textArea.activeFocus ? '#8E8E8E' : '#C7C7C7'
border.width: 1 border.width: 1
id: newMessageArea id: newMessageArea
RowLayout {
anchors.fill: parent
Flickable {
Layout.preferredHeight: parent.height
Layout.fillWidth: true
ScrollBar.vertical: ScrollBar { }
TextArea.flickable: TextArea {
id: textArea
placeholderText: qsTr('newMessagePlaceholder')
wrapMode: TextArea.Wrap
}
}
DropZone { RowLayout {
Layout.preferredHeight: parent.height - newMessageArea.border.width * 2 anchors.fill: parent
Layout.preferredWidth: 40
} Flickable {
Layout.preferredHeight: parent.height
Layout.fillWidth: true
ScrollBar.vertical: ScrollBar { }
TextArea.flickable: TextArea {
id: textArea
placeholderText: qsTr('newMessagePlaceholder')
wrapMode: TextArea.Wrap
} }
}
DropZone {
Layout.preferredHeight: parent.height - newMessageArea.border.width * 2
Layout.preferredWidth: 40
}
} }
}
} }
...@@ -6,56 +6,56 @@ import Linphone 1.0 ...@@ -6,56 +6,56 @@ import Linphone 1.0
// =================================================================== // ===================================================================
ColumnLayout { ColumnLayout {
spacing: 0 spacing: 0
ColumnLayout { ColumnLayout {
Layout.alignment: Qt.AlignTop Layout.alignment: Qt.AlignTop
Layout.fillHeight: true Layout.fillHeight: true
Layout.fillWidth: true Layout.fillWidth: true
Layout.leftMargin: 50 Layout.leftMargin: 50
Layout.topMargin: 50 Layout.topMargin: 50
spacing: 30 spacing: 30
// Invit friends. // Invit friends.
Column { Column {
spacing: 8 spacing: 8
Text { Text {
color: '#5A585B' color: '#5A585B'
font.bold: true font.bold: true
font.pointSize: 11 font.pointSize: 11
text: qsTr('invitContactQuestion') text: qsTr('invitContactQuestion')
} }
TextButtonB { TextButtonB {
text: qsTr('invitContact') text: qsTr('invitContact')
} }
}
// Add contacts.
Column {
spacing: 8
Text {
color: '#5A585B'
font.bold: true
font.pointSize: 11
text: qsTr('addContactQuestion')
}
TextButtonB {
text: qsTr('addContact')
}
}
} }
// Tooltip checkbox area. // Add contacts.
CheckBoxText { Column {
Layout.alignment: Qt.AlignBottom spacing: 8
Layout.fillWidth: true
Layout.leftMargin: 50
Layout.preferredHeight: 70
text: qsTr('displayTooltip') Text {
color: '#5A585B'
font.bold: true
font.pointSize: 11
text: qsTr('addContactQuestion')
}
TextButtonB {
text: qsTr('addContact')
}
} }
}
// Tooltip checkbox area.
CheckBoxText {
Layout.alignment: Qt.AlignBottom
Layout.fillWidth: true
Layout.leftMargin: 50
Layout.preferredHeight: 70
text: qsTr('displayTooltip')
}
} }
...@@ -7,7 +7,12 @@ import Linphone 1.0 ...@@ -7,7 +7,12 @@ import Linphone 1.0
import 'qrc:/ui/scripts/utils.js' as Utils import 'qrc:/ui/scripts/utils.js' as Utils
ApplicationWindow { ApplicationWindow {
id: mainWindow id: window
function setView (view) {
loaderContent.source = 'qrc:/ui/views/MainWindow/' + view + '.qml'
}
maximumHeight: 70 maximumHeight: 70
minimumHeight: 70 minimumHeight: 70
minimumWidth: 780 minimumWidth: 780
...@@ -32,7 +37,7 @@ ApplicationWindow { ...@@ -32,7 +37,7 @@ ApplicationWindow {
Layout.fillHeight: parent.height Layout.fillHeight: parent.height
id: collapse id: collapse
onCollapsed: mainWindowStates.state = isCollapsed() onCollapsed: windowStates.state = isCollapsed()
? 'collapsed' ? 'collapsed'
: '' : ''
} }
...@@ -48,12 +53,12 @@ ApplicationWindow { ...@@ -48,12 +53,12 @@ ApplicationWindow {
// User actions. // User actions.
ActionButton { ActionButton {
Layout.preferredWidth: 16 Layout.preferredWidth: 16
onClicked: Utils.openWindow('ManageAccounts', mainWindow) onClicked: Utils.openWindow('ManageAccounts', window)
} }
ActionButton { ActionButton {
Layout.preferredWidth: 16 Layout.preferredWidth: 16
onClicked: Utils.openWindow('NewCall', mainWindow) onClicked: Utils.openWindow('NewCall', window)
} }
// Search. // Search.
...@@ -212,6 +217,12 @@ ApplicationWindow { ...@@ -212,6 +217,12 @@ ApplicationWindow {
onEntrySelected: { onEntrySelected: {
console.log('entry', entry) console.log('entry', entry)
if (entry === 0) {
setView('Home')
} else if (entry === 1) {
setView('Contacts')
}
} }
} }
...@@ -273,6 +284,8 @@ ApplicationWindow { ...@@ -273,6 +284,8 @@ ApplicationWindow {
// Main content. // Main content.
Loader { Loader {
id: loaderContent
Layout.fillHeight: true Layout.fillHeight: true
Layout.fillWidth: true Layout.fillWidth: true
source: 'qrc:/ui/views/MainWindow/Home.qml' source: 'qrc:/ui/views/MainWindow/Home.qml'
...@@ -280,7 +293,7 @@ ApplicationWindow { ...@@ -280,7 +293,7 @@ ApplicationWindow {
} }
StateGroup { StateGroup {
id: mainWindowStates id: windowStates
states: State { states: State {
name: 'collapsed' name: 'collapsed'
...@@ -290,7 +303,7 @@ ApplicationWindow { ...@@ -290,7 +303,7 @@ ApplicationWindow {
maximumHeight: 99999 maximumHeight: 99999
maximumWidth: 99999 maximumWidth: 99999
minimumHeight: 480 minimumHeight: 480
target: mainWindow target: window
} }
} }
} }
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment