diff options
author | Michael Bohlender <michael.bohlender@kdemail.net> | 2017-09-11 14:43:47 +0200 |
---|---|---|
committer | Michael Bohlender <michael.bohlender@kdemail.net> | 2017-09-11 14:43:47 +0200 |
commit | 0fc4fc7f9b19499fe5922eddd84fce8f01badea2 (patch) | |
tree | cb0255659f342e550a3d7e361ed1e011462e1df6 | |
parent | 82831c9b847e82bd8410a6a414885268d2253756 (diff) | |
download | kube-0fc4fc7f9b19499fe5922eddd84fce8f01badea2.tar.gz kube-0fc4fc7f9b19499fe5922eddd84fce8f01badea2.zip |
add maillist filter field
-rw-r--r-- | framework/qml/MailListView.qml | 334 |
1 files changed, 174 insertions, 160 deletions
diff --git a/framework/qml/MailListView.qml b/framework/qml/MailListView.qml index 1a1bdb6c..94e591e7 100644 --- a/framework/qml/MailListView.qml +++ b/framework/qml/MailListView.qml | |||
@@ -63,199 +63,213 @@ FocusScope { | |||
63 | text: qsTr("Nothing here...") | 63 | text: qsTr("Nothing here...") |
64 | } | 64 | } |
65 | 65 | ||
66 | Kube.ListView { | 66 | ColumnLayout { |
67 | id: listView | ||
68 | |||
69 | anchors.fill: parent | 67 | anchors.fill: parent |
70 | clip: true | ||
71 | focus: true | ||
72 | 68 | ||
73 | //BEGIN keyboard nav | 69 | spacing: 0 |
74 | onActiveFocusChanged: { | ||
75 | if (activeFocus && currentIndex < 0) { | ||
76 | currentIndex = 0 | ||
77 | } | ||
78 | } | ||
79 | 70 | ||
80 | Keys.onDownPressed: { | 71 | Kube.TextField { |
81 | incrementCurrentIndex() | 72 | Layout.fillWidth: true |
82 | } | 73 | placeholderText: "Filter..." |
83 | Keys.onUpPressed: { | 74 | onTextChanged: mailListModel.filter = text |
84 | decrementCurrentIndex() | ||
85 | } | ||
86 | //END keyboard nav | ||
87 | |||
88 | onCurrentItemChanged: { | ||
89 | if (currentItem) { | ||
90 | root.currentMail = currentItem.currentData.mail; | ||
91 | root.isDraft = currentItem.currentData.draft; | ||
92 | root.isTrash = currentItem.currentData.trash; | ||
93 | root.isImportant = currentItem.currentData.important; | ||
94 | root.isUnread = currentItem.currentData.unread; | ||
95 | } | ||
96 | } | 75 | } |
97 | 76 | ||
98 | model: Kube.MailListModel { | 77 | Kube.ListView { |
99 | id: mailListModel | 78 | id: listView |
100 | parentFolder: root.parentFolder | ||
101 | } | ||
102 | |||
103 | delegate: Kube.ListDelegate { | ||
104 | id: delegateRoot | ||
105 | //Required for D&D | ||
106 | property var mail: model.mail | ||
107 | 79 | ||
108 | width: listView.width - Kube.Units.smallSpacing | 80 | Layout.fillWidth: true |
109 | height: Kube.Units.gridUnit * 5 | 81 | Layout.fillHeight: true |
110 | 82 | ||
111 | color: Kube.Colors.viewBackgroundColor | 83 | clip: true |
112 | border.color: Kube.Colors.backgroundColor | 84 | focus: true |
113 | border.width: 1 | ||
114 | 85 | ||
115 | states: [ | 86 | //BEGIN keyboard nav |
116 | State { | 87 | onActiveFocusChanged: { |
117 | name: "dnd" | 88 | if (activeFocus && currentIndex < 0) { |
118 | when: mouseArea.drag.active | 89 | currentIndex = 0 |
90 | } | ||
91 | } | ||
119 | 92 | ||
120 | PropertyChanges {target: mouseArea; cursorShape: Qt.ClosedHandCursor} | 93 | Keys.onDownPressed: { |
121 | PropertyChanges {target: delegateRoot; x: x; y: y} | 94 | incrementCurrentIndex() |
122 | PropertyChanges {target: delegateRoot; parent: root} | 95 | } |
123 | PropertyChanges {target: delegateRoot; opacity: 0.7} | 96 | Keys.onUpPressed: { |
124 | PropertyChanges {target: delegateRoot; highlighted: true} | 97 | decrementCurrentIndex() |
125 | } | 98 | } |
126 | ] | 99 | //END keyboard nav |
127 | 100 | ||
128 | Drag.active: mouseArea.drag.active | 101 | onCurrentItemChanged: { |
129 | Drag.hotSpot.x: mouseArea.mouseX | 102 | if (currentItem) { |
130 | Drag.hotSpot.y: mouseArea.mouseY | 103 | root.currentMail = currentItem.currentData.mail; |
131 | Drag.source: delegateRoot | 104 | root.isDraft = currentItem.currentData.draft; |
132 | 105 | root.isTrash = currentItem.currentData.trash; | |
133 | MouseArea { | 106 | root.isImportant = currentItem.currentData.important; |
134 | id: mouseArea | 107 | root.isUnread = currentItem.currentData.unread; |
135 | anchors.fill: parent | 108 | } |
136 | drag.target: parent | 109 | } |
137 | onReleased: parent.Drag.drop() | 110 | |
138 | onClicked: delegateRoot.clicked() | 111 | model: Kube.MailListModel { |
112 | id: mailListModel | ||
113 | parentFolder: root.parentFolder | ||
139 | } | 114 | } |
140 | 115 | ||
141 | Item { | 116 | delegate: Kube.ListDelegate { |
142 | id: content | 117 | id: delegateRoot |
118 | //Required for D&D | ||
119 | property var mail: model.mail | ||
120 | |||
121 | width: listView.width - Kube.Units.smallSpacing | ||
122 | height: Kube.Units.gridUnit * 5 | ||
123 | |||
124 | color: Kube.Colors.viewBackgroundColor | ||
125 | border.color: Kube.Colors.backgroundColor | ||
126 | border.width: 1 | ||
127 | |||
128 | states: [ | ||
129 | State { | ||
130 | name: "dnd" | ||
131 | when: mouseArea.drag.active | ||
143 | 132 | ||
144 | anchors { | 133 | PropertyChanges {target: mouseArea; cursorShape: Qt.ClosedHandCursor} |
145 | fill: parent | 134 | PropertyChanges {target: delegateRoot; x: x; y: y} |
146 | margins: Kube.Units.smallSpacing | 135 | PropertyChanges {target: delegateRoot; parent: root} |
136 | PropertyChanges {target: delegateRoot; opacity: 0.7} | ||
137 | PropertyChanges {target: delegateRoot; highlighted: true} | ||
147 | } | 138 | } |
148 | property color unreadColor: (model.unread && !delegateRoot.highlighted) ? Kube.Colors.highlightColor : delegateRoot.textColor | 139 | ] |
149 | 140 | ||
150 | //TODO batch editing | 141 | Drag.active: mouseArea.drag.active |
151 | // Kube.CheckBox { | 142 | Drag.hotSpot.x: mouseArea.mouseX |
152 | // id: checkBox | 143 | Drag.hotSpot.y: mouseArea.mouseY |
153 | // | 144 | Drag.source: delegateRoot |
154 | // anchors.verticalCenter: parent.verticalCenter | 145 | |
155 | // visible: (checked || delegateRoot.hovered) && !mouseArea.drag.active | 146 | MouseArea { |
156 | // opacity: 0.9 | 147 | id: mouseArea |
157 | // } | 148 | anchors.fill: parent |
158 | 149 | drag.target: parent | |
159 | Column { | 150 | onReleased: parent.Drag.drop() |
151 | onClicked: delegateRoot.clicked() | ||
152 | } | ||
153 | |||
154 | Item { | ||
155 | id: content | ||
156 | |||
160 | anchors { | 157 | anchors { |
161 | verticalCenter: parent.verticalCenter | 158 | fill: parent |
162 | left: parent.left | 159 | margins: Kube.Units.smallSpacing |
163 | leftMargin: Kube.Units.largeSpacing // + checkBox.width | ||
164 | } | 160 | } |
165 | 161 | property color unreadColor: (model.unread && !delegateRoot.highlighted) ? Kube.Colors.highlightColor : delegateRoot.textColor | |
166 | Kube.Label{ | 162 | |
167 | id: subject | 163 | //TODO batch editing |
168 | width: content.width - Kube.Units.gridUnit * 3 | 164 | // Kube.CheckBox { |
169 | text: model.subject | 165 | // id: checkBox |
170 | color: content.unreadColor | 166 | // |
171 | maximumLineCount: 2 | 167 | // anchors.verticalCenter: parent.verticalCenter |
172 | wrapMode: Text.WordWrap | 168 | // visible: (checked || delegateRoot.hovered) && !mouseArea.drag.active |
173 | elide: Text.ElideRight | 169 | // opacity: 0.9 |
170 | // } | ||
171 | |||
172 | Column { | ||
173 | anchors { | ||
174 | verticalCenter: parent.verticalCenter | ||
175 | left: parent.left | ||
176 | leftMargin: Kube.Units.largeSpacing // + checkBox.width | ||
177 | } | ||
178 | |||
179 | Kube.Label{ | ||
180 | id: subject | ||
181 | width: content.width - Kube.Units.gridUnit * 3 | ||
182 | text: model.subject | ||
183 | color: content.unreadColor | ||
184 | maximumLineCount: 2 | ||
185 | wrapMode: Text.WordWrap | ||
186 | elide: Text.ElideRight | ||
187 | } | ||
188 | |||
189 | Kube.Label { | ||
190 | id: sender | ||
191 | text: model.senderName | ||
192 | color: delegateRoot.textColor | ||
193 | font.italic: true | ||
194 | width: delegateRoot.width - Kube.Units.gridUnit * 3 | ||
195 | elide: Text.ElideRight | ||
196 | } | ||
174 | } | 197 | } |
175 | 198 | ||
176 | Kube.Label { | 199 | Kube.Label { |
177 | id: sender | 200 | id: date |
178 | text: model.senderName | 201 | anchors { |
179 | color: delegateRoot.textColor | 202 | right: parent.right |
203 | bottom: parent.bottom | ||
204 | } | ||
205 | visible: !delegateRoot.hovered | ||
206 | text: Qt.formatDateTime(model.date, "dd MMM yyyy") | ||
180 | font.italic: true | 207 | font.italic: true |
181 | width: delegateRoot.width - Kube.Units.gridUnit * 3 | 208 | color: Kube.Colors.disabledTextColor |
182 | elide: Text.ElideRight | 209 | font.pointSize: Kube.Units.tinyFontSize |
210 | } | ||
211 | |||
212 | Kube.Label { | ||
213 | id: threadCounter | ||
214 | anchors.right: parent.right | ||
215 | text: model.threadSize | ||
216 | color: content.unreadColor | ||
217 | visible: model.threadSize > 1 | ||
183 | } | 218 | } |
184 | } | 219 | } |
185 | 220 | ||
186 | Kube.Label { | 221 | Row { |
187 | id: date | 222 | id: buttons |
223 | |||
188 | anchors { | 224 | anchors { |
189 | right: parent.right | 225 | right: parent.right |
190 | bottom: parent.bottom | 226 | bottom: parent.bottom |
227 | margins: Kube.Units.smallSpacing | ||
191 | } | 228 | } |
192 | visible: !delegateRoot.hovered | ||
193 | text: Qt.formatDateTime(model.date, "dd MMM yyyy") | ||
194 | font.italic: true | ||
195 | color: Kube.Colors.disabledTextColor | ||
196 | font.pointSize: Kube.Units.tinyFontSize | ||
197 | } | ||
198 | 229 | ||
199 | Kube.Label { | 230 | visible: delegateRoot.hovered && !mouseArea.drag.active |
200 | id: threadCounter | ||
201 | anchors.right: parent.right | ||
202 | text: model.threadSize | ||
203 | color: content.unreadColor | ||
204 | visible: model.threadSize > 1 | ||
205 | } | ||
206 | } | ||
207 | |||
208 | Row { | ||
209 | id: buttons | ||
210 | |||
211 | anchors { | ||
212 | right: parent.right | ||
213 | bottom: parent.bottom | ||
214 | margins: Kube.Units.smallSpacing | ||
215 | } | ||
216 | 231 | ||
217 | visible: delegateRoot.hovered && !mouseArea.drag.active | 232 | spacing: Kube.Units.smallSpacing |
233 | opacity: 0.7 | ||
218 | 234 | ||
219 | spacing: Kube.Units.smallSpacing | 235 | Kube.IconButton { |
220 | opacity: 0.7 | 236 | id: readButton |
221 | 237 | iconName: Kube.Icons.markAsRead | |
222 | Kube.IconButton { | 238 | visible: model.unread |
223 | id: readButton | 239 | onClicked: Kube.Fabric.postMessage(Kube.Messages.markAsRead, {"mail": model.mail}) |
224 | iconName: Kube.Icons.markAsRead | 240 | activeFocusOnTab: false |
225 | visible: model.unread | 241 | } |
226 | onClicked: Kube.Fabric.postMessage(Kube.Messages.markAsRead, {"mail": model.mail}) | 242 | Kube.IconButton { |
227 | activeFocusOnTab: false | 243 | id: unreadButton |
228 | } | 244 | iconName: Kube.Icons.markAsUnread |
229 | Kube.IconButton { | 245 | visible: !model.unread |
230 | id: unreadButton | 246 | onClicked: Kube.Fabric.postMessage(Kube.Messages.markAsUnread, {"mail": model.mail}) |
231 | iconName: Kube.Icons.markAsUnread | 247 | activeFocusOnTab: false |
232 | visible: !model.unread | 248 | } |
233 | onClicked: Kube.Fabric.postMessage(Kube.Messages.markAsUnread, {"mail": model.mail}) | ||
234 | activeFocusOnTab: false | ||
235 | } | ||
236 | 249 | ||
237 | Kube.IconButton { | 250 | Kube.IconButton { |
238 | id: importantButton | 251 | id: importantButton |
239 | iconName: Kube.Icons.markImportant | 252 | iconName: Kube.Icons.markImportant |
240 | visible: !!model.mail | 253 | visible: !!model.mail |
241 | onClicked: Kube.Fabric.postMessage(Kube.Messages.toggleImportant, {"mail": model.mail, "important": model.important}) | 254 | onClicked: Kube.Fabric.postMessage(Kube.Messages.toggleImportant, {"mail": model.mail, "important": model.important}) |
242 | activeFocusOnTab: false | 255 | activeFocusOnTab: false |
243 | } | 256 | } |
244 | 257 | ||
245 | Kube.IconButton { | 258 | Kube.IconButton { |
246 | id: deleteButton | 259 | id: deleteButton |
247 | iconName: Kube.Icons.moveToTrash | 260 | iconName: Kube.Icons.moveToTrash |
248 | visible: !!model.mail | 261 | visible: !!model.mail |
249 | onClicked: Kube.Fabric.postMessage(Kube.Messages.moveToTrash, {"mail": model.mail}) | 262 | onClicked: Kube.Fabric.postMessage(Kube.Messages.moveToTrash, {"mail": model.mail}) |
250 | activeFocusOnTab: false | 263 | activeFocusOnTab: false |
251 | } | 264 | } |
252 | 265 | ||
253 | Kube.IconButton { | 266 | Kube.IconButton { |
254 | id: restoreButton | 267 | id: restoreButton |
255 | iconName: Kube.Icons.undo | 268 | iconName: Kube.Icons.undo |
256 | visible: !!model.trash | 269 | visible: !!model.trash |
257 | onClicked: Kube.Fabric.postMessage(Kube.Messages.restoreFromTrash, {"mail": model.mail}) | 270 | onClicked: Kube.Fabric.postMessage(Kube.Messages.restoreFromTrash, {"mail": model.mail}) |
258 | activeFocusOnTab: false | 271 | activeFocusOnTab: false |
272 | } | ||
259 | } | 273 | } |
260 | } | 274 | } |
261 | } | 275 | } |