Merge lp:~rpadovani/webbrowser-app/new-tab-landscape-mode into lp:webbrowser-app
- new-tab-landscape-mode
- Merge into trunk
Status: | Merged | ||||
---|---|---|---|---|---|
Merged at revision: | 1128 | ||||
Proposed branch: | lp:~rpadovani/webbrowser-app/new-tab-landscape-mode | ||||
Merge into: | lp:webbrowser-app | ||||
Diff against target: |
304 lines (+233/-23) 2 files modified
src/app/webbrowser/Browser.qml (+62/-23) src/app/webbrowser/NewTabLandscapeView.qml (+171/-0) |
||||
To merge this branch: | bzr merge lp:~rpadovani/webbrowser-app/new-tab-landscape-mode | ||||
Related bugs: |
|
Reviewer | Review Type | Date Requested | Status |
---|---|---|---|
PS Jenkins bot | continuous-integration | Needs Fixing | |
Ugo Riboni (community) | Needs Fixing | ||
Review via email: mp+261327@code.launchpad.net |
Commit message
Add the landscape mode to new tab view
Description of the change
Add the landscape mode accordingly to design spec.
Sections have a slightly different style (no underlined text, no bold text) due the change in the sdk theme. I preferred to implement sections as they're implemented in the sdk instead following browser specs that probably are outdated
PS Jenkins bot (ps-jenkins) wrote : | # |
PS Jenkins bot (ps-jenkins) wrote : | # |
PASSED: Continuous integration, rev:1051
http://
Executed test runs:
SUCCESS: http://
SUCCESS: http://
SUCCESS: http://
deb: http://
SUCCESS: http://
SUCCESS: http://
SUCCESS: http://
deb: http://
SUCCESS: http://
Click here to trigger a rebuild:
http://
Ugo Riboni (uriboni) wrote : | # |
Thanks Riccardo for the work on this.
The bookmarks UrlList needs the limit property to be set on it, or it does not show anything. Design suggests using a limit of 10.
The UI Toolkit team is working on a new component called Sections that will allow you to easily implement the design for the switch between the Top Sites and Bookmarks sections.
You can find the work in this branch: lp:~tpeeters/ubuntu-ui-toolkit/100-SectionBar/
I pushed a branch here, based on yours, that uses the new Sections component: lp:~uriboni/webbrowser-app/new-tab-wide
Please base your branch on the use of Sections, since they will land in the UI toolkit soon.
Finally, the design for this feature calls for remembering the state so that we can go back to the last section that was active when creating a new tab after re-opening the browser.
And you should probably investigate the use of conditional layouts from the UITK to implement the switch between layouts.
- 1052. By Riccardo Padovani
-
Merge from upstream
- 1053. By Riccardo Padovani
-
Set UrlsList limit property
- 1054. By Riccardo Padovani
-
Use conditional layout
- 1055. By Riccardo Padovani
-
Base the new landscape page on the new sections component
- 1056. By Riccardo Padovani
-
Save which section in landscape view user used last time
Riccardo Padovani (rpadovani) wrote : | # |
Thanks for the review!
> The UI Toolkit team is working on a new component called Sections that will
> allow you to easily implement the design for the switch between the Top Sites
> and Bookmarks sections.
> You can find the work in this branch: lp:~tpeeters/ubuntu-ui-
> toolkit/
This is awesome, thanks for pointing it to me, and thanks for your implementation, I used it in my branch!
> And you should probably investigate the use of conditional layouts from the
> UITK to implement the switch between layouts.
I never used them, hope my implementation is good.
Thanks again!
PS Jenkins bot (ps-jenkins) wrote : | # |
FAILED: Continuous integration, rev:1056
http://
Executed test runs:
UNSTABLE: http://
SUCCESS: http://
SUCCESS: http://
deb: http://
SUCCESS: http://
UNSTABLE: http://
SUCCESS: http://
deb: http://
SUCCESS: http://
Click here to trigger a rebuild:
http://
Preview Diff
1 | === modified file 'src/app/webbrowser/Browser.qml' | |||
2 | --- src/app/webbrowser/Browser.qml 2015-06-18 08:12:33 +0000 | |||
3 | +++ src/app/webbrowser/Browser.qml 2015-06-20 09:58:29 +0000 | |||
4 | @@ -20,6 +20,7 @@ | |||
5 | 20 | import QtQuick.Window 2.0 | 20 | import QtQuick.Window 2.0 |
6 | 21 | import Qt.labs.settings 1.0 | 21 | import Qt.labs.settings 1.0 |
7 | 22 | import com.canonical.Oxide 1.5 as Oxide | 22 | import com.canonical.Oxide 1.5 as Oxide |
8 | 23 | import Ubuntu.Layouts 1.0 | ||
9 | 23 | import Ubuntu.Components 1.1 | 24 | import Ubuntu.Components 1.1 |
10 | 24 | import Ubuntu.Components.Popups 1.0 | 25 | import Ubuntu.Components.Popups 1.0 |
11 | 25 | import webbrowserapp.private 0.1 | 26 | import webbrowserapp.private 0.1 |
12 | @@ -98,12 +99,14 @@ | |||
13 | 98 | property string searchEngine: settingsDefaults.searchEngine | 99 | property string searchEngine: settingsDefaults.searchEngine |
14 | 99 | property string allowOpenInBackgroundTab: settingsDefaults.allowOpenInBackgroundTab | 100 | property string allowOpenInBackgroundTab: settingsDefaults.allowOpenInBackgroundTab |
15 | 100 | property bool restoreSession: settingsDefaults.restoreSession | 101 | property bool restoreSession: settingsDefaults.restoreSession |
16 | 102 | property int selectedIndexNewTabViewLandscape: settingsDefaults.selectedIndexNewTabViewLandscape | ||
17 | 101 | 103 | ||
18 | 102 | function restoreDefaults() { | 104 | function restoreDefaults() { |
19 | 103 | homepage = settingsDefaults.homepage | 105 | homepage = settingsDefaults.homepage |
20 | 104 | searchEngine = settingsDefaults.searchEngine | 106 | searchEngine = settingsDefaults.searchEngine |
21 | 105 | allowOpenInBackgroundTab = settingsDefaults.allowOpenInBackgroundTab | 107 | allowOpenInBackgroundTab = settingsDefaults.allowOpenInBackgroundTab |
22 | 106 | restoreSession = settingsDefaults.restoreSession | 108 | restoreSession = settingsDefaults.restoreSession |
23 | 109 | selectedIndexNewTabViewLandscape = settingsDefaults.selectedIndexNewTabViewLandscape | ||
24 | 107 | } | 110 | } |
25 | 108 | } | 111 | } |
26 | 109 | 112 | ||
27 | @@ -114,6 +117,7 @@ | |||
28 | 114 | readonly property string searchEngine: "google" | 117 | readonly property string searchEngine: "google" |
29 | 115 | readonly property string allowOpenInBackgroundTab: "default" | 118 | readonly property string allowOpenInBackgroundTab: "default" |
30 | 116 | readonly property bool restoreSession: true | 119 | readonly property bool restoreSession: true |
31 | 120 | readonly property int selectedIndexNewTabViewLandscape: 0 | ||
32 | 117 | } | 121 | } |
33 | 118 | 122 | ||
34 | 119 | Item { | 123 | Item { |
35 | @@ -209,35 +213,70 @@ | |||
36 | 209 | } | 213 | } |
37 | 210 | } | 214 | } |
38 | 211 | 215 | ||
40 | 212 | sourceComponent: browser.incognito ? newPrivateTabViewComponent : newTabViewComponent | 216 | sourceComponent: newTabViewComponent |
41 | 213 | 217 | ||
42 | 214 | Component { | 218 | Component { |
43 | 215 | id: newTabViewComponent | 219 | id: newTabViewComponent |
44 | 216 | 220 | ||
60 | 217 | NewTabView { | 221 | Layouts { |
61 | 218 | historyModel: browser.historyModel | 222 | id: newTabViewLayouts |
62 | 219 | bookmarksModel: browser.bookmarksModel | 223 | |
63 | 220 | settingsObject: settings | 224 | anchors.fill: parent |
64 | 221 | onBookmarkClicked: { | 225 | |
65 | 222 | chrome.requestedUrl = url | 226 | layouts: [ |
66 | 223 | currentWebview.url = url | 227 | ConditionalLayout { |
67 | 224 | currentWebview.forceActiveFocus() | 228 | name: "newTabView" |
68 | 225 | } | 229 | when: !browser.incognito && Screen.orientation == Screen.primaryOrientation |
69 | 226 | onBookmarkRemoved: browser.bookmarksModel.remove(url) | 230 | |
70 | 227 | onHistoryEntryClicked: { | 231 | NewTabView { |
71 | 228 | chrome.requestedUrl = url | 232 | anchors.fill: parent |
72 | 229 | currentWebview.url = url | 233 | historyModel: browser.historyModel |
73 | 230 | currentWebview.forceActiveFocus() | 234 | bookmarksModel: browser.bookmarksModel |
74 | 231 | } | 235 | settingsObject: settings |
75 | 236 | onBookmarkClicked: { | ||
76 | 237 | chrome.requestedUrl = url | ||
77 | 238 | currentWebview.url = url | ||
78 | 239 | currentWebview.forceActiveFocus() | ||
79 | 240 | } | ||
80 | 241 | onBookmarkRemoved: browser.bookmarksModel.remove(url) | ||
81 | 242 | onHistoryEntryClicked: { | ||
82 | 243 | chrome.requestedUrl = url | ||
83 | 244 | currentWebview.url = url | ||
84 | 245 | currentWebview.forceActiveFocus() | ||
85 | 246 | } | ||
86 | 247 | } | ||
87 | 248 | }, | ||
88 | 249 | ConditionalLayout { | ||
89 | 250 | name: "newTabLandscapeView" | ||
90 | 251 | when: !browser.incognito && Screen.orientation != Screen.primaryOrientation | ||
91 | 252 | |||
92 | 253 | NewTabLandscapeView { | ||
93 | 254 | anchors.fill: parent | ||
94 | 255 | historyModel: browser.historyModel | ||
95 | 256 | bookmarksModel: browser.bookmarksModel | ||
96 | 257 | settingsObject: settings | ||
97 | 258 | onBookmarkClicked: { | ||
98 | 259 | chrome.requestedUrl = url | ||
99 | 260 | currentWebview.url = url | ||
100 | 261 | currentWebview.forceActiveFocus() | ||
101 | 262 | } | ||
102 | 263 | onBookmarkRemoved: browser.bookmarksModel.remove(url) | ||
103 | 264 | onHistoryEntryClicked: { | ||
104 | 265 | chrome.requestedUrl = url | ||
105 | 266 | currentWebview.url = url | ||
106 | 267 | currentWebview.forceActiveFocus() | ||
107 | 268 | } | ||
108 | 269 | } | ||
109 | 270 | }, | ||
110 | 271 | ConditionalLayout { | ||
111 | 272 | name: "newPrivateTabView" | ||
112 | 273 | when: browser.incognito | ||
113 | 274 | |||
114 | 275 | NewPrivateTabView { anchors.fill: parent } | ||
115 | 276 | } | ||
116 | 277 | ] | ||
117 | 232 | } | 278 | } |
118 | 233 | } | 279 | } |
119 | 234 | |||
120 | 235 | Component { | ||
121 | 236 | id: newPrivateTabViewComponent | ||
122 | 237 | |||
123 | 238 | NewPrivateTabView { } | ||
124 | 239 | } | ||
125 | 240 | asynchronous: true | ||
126 | 241 | } | 280 | } |
127 | 242 | 281 | ||
128 | 243 | SearchEngine { | 282 | SearchEngine { |
129 | 244 | 283 | ||
130 | === added file 'src/app/webbrowser/NewTabLandscapeView.qml' | |||
131 | --- src/app/webbrowser/NewTabLandscapeView.qml 1970-01-01 00:00:00 +0000 | |||
132 | +++ src/app/webbrowser/NewTabLandscapeView.qml 2015-06-20 09:58:29 +0000 | |||
133 | @@ -0,0 +1,171 @@ | |||
134 | 1 | /* | ||
135 | 2 | * Copyright 2015 Canonical Ltd. | ||
136 | 3 | * | ||
137 | 4 | * This file is part of webbrowser-app. | ||
138 | 5 | * | ||
139 | 6 | * webbrowser-app is free software; you can redistribute it and/or modify | ||
140 | 7 | * it under the terms of the GNU General Public License as published by | ||
141 | 8 | * the Free Software Foundation; version 3. | ||
142 | 9 | * | ||
143 | 10 | * webbrowser-app is distributed in the hope that it will be useful, | ||
144 | 11 | * but WITHOUT ANY WARRANTY; without even the implied warranty of | ||
145 | 12 | * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the | ||
146 | 13 | * GNU General Public License for more details. | ||
147 | 14 | * | ||
148 | 15 | * You should have received a copy of the GNU General Public License | ||
149 | 16 | * along with this program. If not, see <http://www.gnu.org/licenses/>. | ||
150 | 17 | */ | ||
151 | 18 | |||
152 | 19 | import QtQuick 2.0 | ||
153 | 20 | import Qt.labs.settings 1.0 | ||
154 | 21 | import Ubuntu.Components 1.3 | ||
155 | 22 | import webbrowserapp.private 0.1 | ||
156 | 23 | import ".." | ||
157 | 24 | |||
158 | 25 | Item { | ||
159 | 26 | id: newTabViewLandscape | ||
160 | 27 | |||
161 | 28 | property QtObject bookmarksModel | ||
162 | 29 | property alias historyModel: historyTimeframeModel.sourceModel | ||
163 | 30 | property Settings settingsObject | ||
164 | 31 | property alias selectedIndex: sections.selectedIndex | ||
165 | 32 | |||
166 | 33 | signal bookmarkClicked(url url) | ||
167 | 34 | signal bookmarkRemoved(url url) | ||
168 | 35 | signal historyEntryClicked(url url) | ||
169 | 36 | |||
170 | 37 | TopSitesModel { | ||
171 | 38 | id: topSitesModel | ||
172 | 39 | sourceModel: HistoryTimeframeModel { | ||
173 | 40 | id: historyTimeframeModel | ||
174 | 41 | } | ||
175 | 42 | } | ||
176 | 43 | |||
177 | 44 | Rectangle { | ||
178 | 45 | anchors.fill: parent | ||
179 | 46 | color: "#f6f6f6" | ||
180 | 47 | } | ||
181 | 48 | |||
182 | 49 | Sections { | ||
183 | 50 | id: sections | ||
184 | 51 | |||
185 | 52 | anchors { | ||
186 | 53 | horizontalCenter: parent.horizontalCenter | ||
187 | 54 | top: parent.top | ||
188 | 55 | } | ||
189 | 56 | |||
190 | 57 | actions: [ | ||
191 | 58 | Action { text: i18n.tr("Top Sites") }, | ||
192 | 59 | Action { text: i18n.tr("Bookmarks") } | ||
193 | 60 | ] | ||
194 | 61 | } | ||
195 | 62 | |||
196 | 63 | Binding { | ||
197 | 64 | target: sections | ||
198 | 65 | property: "selectedIndex" | ||
199 | 66 | value: settingsObject.selectedIndexNewTabViewLandscape | ||
200 | 67 | } | ||
201 | 68 | |||
202 | 69 | Flickable { | ||
203 | 70 | anchors { | ||
204 | 71 | top: sections.bottom | ||
205 | 72 | bottom: parent.bottom | ||
206 | 73 | left: parent.left | ||
207 | 74 | right: parent.right | ||
208 | 75 | } | ||
209 | 76 | contentHeight: contentColumn.height | ||
210 | 77 | |||
211 | 78 | clip: true | ||
212 | 79 | |||
213 | 80 | Column { | ||
214 | 81 | id: contentColumn | ||
215 | 82 | anchors { | ||
216 | 83 | left: parent.left | ||
217 | 84 | right: parent.right | ||
218 | 85 | } | ||
219 | 86 | height: childrenRect.height | ||
220 | 87 | |||
221 | 88 | Column { | ||
222 | 89 | id: bookmarksColumn | ||
223 | 90 | anchors { | ||
224 | 91 | left: parent.left | ||
225 | 92 | right: parent.right | ||
226 | 93 | } | ||
227 | 94 | |||
228 | 95 | visible: newTabViewLandscape.selectedIndex === 1 | ||
229 | 96 | |||
230 | 97 | height: childrenRect.height | ||
231 | 98 | spacing: 0 | ||
232 | 99 | |||
233 | 100 | UrlDelegate { | ||
234 | 101 | objectName: "homepageBookmark" | ||
235 | 102 | anchors { | ||
236 | 103 | left: parent.left | ||
237 | 104 | right: parent.right | ||
238 | 105 | } | ||
239 | 106 | height: units.gu(5) | ||
240 | 107 | |||
241 | 108 | title: i18n.tr('Homepage') | ||
242 | 109 | |||
243 | 110 | leadingActions: null | ||
244 | 111 | |||
245 | 112 | url: newTabViewLandscape.settingsObject.homepage | ||
246 | 113 | onClicked: newTabViewLandscape.bookmarkClicked(url) | ||
247 | 114 | } | ||
248 | 115 | |||
249 | 116 | UrlsList { | ||
250 | 117 | objectName: "bookmarksList" | ||
251 | 118 | anchors { | ||
252 | 119 | left: parent.left | ||
253 | 120 | right: parent.right | ||
254 | 121 | } | ||
255 | 122 | |||
256 | 123 | spacing: 0 | ||
257 | 124 | limit: 10 | ||
258 | 125 | |||
259 | 126 | model: newTabViewLandscape.bookmarksModel | ||
260 | 127 | |||
261 | 128 | onUrlClicked: newTabViewLandscape.bookmarkClicked(url) | ||
262 | 129 | onUrlRemoved: newTabViewLandscape.bookmarkRemoved(url) | ||
263 | 130 | } | ||
264 | 131 | } | ||
265 | 132 | |||
266 | 133 | Label { | ||
267 | 134 | objectName: "notopsites" | ||
268 | 135 | |||
269 | 136 | height: units.gu(11) | ||
270 | 137 | anchors { | ||
271 | 138 | left: parent.left | ||
272 | 139 | right: parent.right | ||
273 | 140 | } | ||
274 | 141 | visible: topSitesModel.count == 0 && newTabViewLandscape.selectedIndex === 0 | ||
275 | 142 | |||
276 | 143 | horizontalAlignment: Text.AlignHCenter | ||
277 | 144 | verticalAlignment: Text.AlignVCenter | ||
278 | 145 | |||
279 | 146 | text: i18n.tr("You haven't visited any site yet") | ||
280 | 147 | color: "#5d5d5d" | ||
281 | 148 | } | ||
282 | 149 | |||
283 | 150 | UrlsList { | ||
284 | 151 | objectName: "topSitesList" | ||
285 | 152 | anchors { | ||
286 | 153 | left: parent.left | ||
287 | 154 | right: parent.right | ||
288 | 155 | } | ||
289 | 156 | |||
290 | 157 | opacity: internal.seeMoreBookmarksView ? 0.0 : 1.0 | ||
291 | 158 | Behavior on opacity { UbuntuNumberAnimation {} } | ||
292 | 159 | visible: newTabViewLandscape.selectedIndex === 0 | ||
293 | 160 | |||
294 | 161 | limit: 10 | ||
295 | 162 | spacing: 0 | ||
296 | 163 | |||
297 | 164 | model: topSitesModel | ||
298 | 165 | |||
299 | 166 | onUrlClicked: newTabViewLandscape.historyEntryClicked(url) | ||
300 | 167 | onUrlRemoved: newTabViewLandscape.historyModel.hide(url) | ||
301 | 168 | } | ||
302 | 169 | } | ||
303 | 170 | } | ||
304 | 171 | } |
FAILED: Continuous integration, rev:1051 jenkins. qa.ubuntu. com/job/ webbrowser- app-ci/ 1857/ jenkins. qa.ubuntu. com/job/ generic- deb-autopilot- vivid-touch/ 3102/console jenkins. qa.ubuntu. com/job/ webbrowser- app-vivid- amd64-ci/ 614/console jenkins. qa.ubuntu. com/job/ webbrowser- app-vivid- armhf-ci/ 614/console jenkins. qa.ubuntu. com/job/ webbrowser- app-vivid- i386-ci/ 614/console jenkins. qa.ubuntu. com/job/ generic- mediumtests- builder- vivid-armhf/ 3100/console
http://
Executed test runs:
FAILURE: http://
FAILURE: http://
FAILURE: http://
FAILURE: http://
FAILURE: http://
Click here to trigger a rebuild: s-jenkins. ubuntu- ci:8080/ job/webbrowser- app-ci/ 1857/rebuild
http://