Lomiri
OptionToggle.qml
1 /*
2  * Copyright (C) 2014-2016 Canonical Ltd.
3  *
4  * This program is free software; you can redistribute it and/or modify
5  * it under the terms of the GNU General Public License as published by
6  * the Free Software Foundation; version 3.
7  *
8  * This program is distributed in the hope that it will be useful,
9  * but WITHOUT ANY WARRANTY; without even the implied warranty of
10  * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
11  * GNU General Public License for more details.
12  *
13  * You should have received a copy of the GNU General Public License
14  * along with this program. If not, see <http://www.gnu.org/licenses/>.
15  */
16 
17 import QtQuick 2.12
18 import Lomiri.Components 1.3
19 import Lomiri.Components.ListItems 1.3 as ListItem
20 import Lomiri.Components.Popups 1.3
21 
22 Rectangle {
23  id: optionToggle
24 
25  property bool expanded
26  property var model
27  property int startIndex
28  readonly property double itemHeight: units.gu(4)
29 
30  signal triggered(string id)
31 
32  color: theme.palette.normal.background
33  height: expanded ? (optionToggleRepeater.count - startIndex) * itemHeight : itemHeight
34  width: parent.width
35  radius: units.gu(0.6)
36  clip: true
37  border.width: units.dp(1)
38  border.color: theme.palette.normal.base
39 
40  Column {
41  id: optionToggleContent
42  width: parent.width
43 
44  Repeater {
45  id: optionToggleRepeater
46  model: optionToggle.model
47 
48  delegate: Loader {
49  asynchronous: true
50  visible: status === Loader.Ready
51  property string actionLabel: label
52  property string actionId: id
53  readonly property var splitLabel: actionLabel.match(/(^([-a-z0-9]+):)?(.*)$/)
54 
55  Component {
56  id: optionToggleEntry
57 
58  AbstractButton {
59  objectName: "notify_button" + index
60  width: optionToggleContent.width
61  height: optionToggle.itemHeight
62 
63  onClicked: {
64  if (index === startIndex) {
65  optionToggle.expanded = !optionToggle.expanded
66  } else {
67  optionToggle.triggered(actionId)
68  }
69  }
70 
71  ListItem.ThinDivider {
72  visible: index > startIndex
73  }
74 
75  Icon {
76  id: delegateIcon
77  anchors {
78  left: parent.left
79  leftMargin: units.gu(1)
80  verticalCenter: parent.verticalCenter
81  }
82  visible: index !== startIndex
83  width: units.gu(2)
84  height: width
85  name: splitLabel[2] !== undefined ? splitLabel[2] : ""
86  }
87 
88  Label {
89  id: delegateLabel
90  anchors {
91  left: delegateIcon.visible ? delegateIcon.right : parent.left
92  leftMargin: delegateIcon.visible ? units.gu(1) : units.gu(2)
93  right: parent.right
94  rightMargin: units.gu(1)
95  verticalCenter: delegateIcon.visible ? delegateIcon.verticalCenter : parent.verticalCenter
96  }
97 
98  width: parent.width
99  text: splitLabel[3]
100  color: theme.palette.normal.backgroundSecondaryText
101  fontSize: "small"
102  font.weight: Font.Light
103  maximumLineCount: 1
104  elide: Text.ElideRight
105  }
106 
107  Icon {
108  anchors {
109  right: parent.right
110  rightMargin: units.gu(1)
111  verticalCenter: delegateIcon.verticalCenter
112  }
113 
114  visible: index === startIndex
115  name: optionToggle.height === optionToggle.itemHeight ? "down" : "up"
116  width: units.gu(2)
117  height: width
118  }
119  }
120  }
121  sourceComponent: (index >= startIndex) ? optionToggleEntry : undefined
122  }
123  }
124  }
125 }