Merge lp:~artmello/camera-app/camera-app-gridlines into lp:camera-app

[Arthur Mello]

Add gridlines to the viewfinder controlled by a new settings option

Add gridlines to the viewfinder controlled by a new settings option

[Florian Boucault (fboucault)]

- making the grid of options 4 columns does not really solve the problem of too many options long term (especially with your other MR coming in); thankfully this was solved already in another branch's commit. I think we should merge the specific commit that fixes it: commit 428 from lp:~fboucault/camera-app/jpeg_quality
Merge command: bzr merge -c428 lp:~fboucault/camera-app/jpeg_quality
- icon "view-grid-symbolic" is not good enough. I asked Matthieu (tiheum) from design to provide a better one.
- visually the grid should not have lines around the picture, only the 4 lines inside it; these lines outside are not useful and they create a boxing feel to the UI
- no need to use a Binding object (I understand the consistency reason, but it won't work out for other settings)
- better to not instantiate the Rectangles at all when the grid is disabled; "Repeater.model: settings.gridEnabled ? gridlines.columns * gridlines.rows : 0" will do the trick
- using Rectangle.border to draw is slightly more expensive than using Rectangle.color

review: Needs Fixing

[PS Jenkins bot (ps-jenkins)]

FAILED: Continuous integration, rev:427
http://jenkins.qa.ubuntu.com/job/camera-app-ci/321/
Executed test runs:
    SUCCESS: http://jenkins.qa.ubuntu.com/job/camera-app-vivid-amd64-ci/17
    SUCCESS: http://jenkins.qa.ubuntu.com/job/camera-app-vivid-armhf-ci/17
        deb: http://jenkins.qa.ubuntu.com/job/camera-app-vivid-armhf-ci/17/artifact/work/output/*zip*/output.zip
    SUCCESS: http://jenkins.qa.ubuntu.com/job/camera-app-vivid-i386-ci/17
    ABORTED: http://jenkins.qa.ubuntu.com/job/generic-click-autopilot-vivid-touch/30/console
    UNSTABLE: http://jenkins.qa.ubuntu.com/job/generic-mediumtests-vivid/245
    SUCCESS: http://jenkins.qa.ubuntu.com/job/generic-click-builder-vivid-armhf/50
    UNSTABLE: http://jenkins.qa.ubuntu.com/job/autopilot-testrunner-otto-vivid/217
    SUCCESS: http://jenkins.qa.ubuntu.com/job/generic-mediumtests-builder-vivid-amd64/250
        deb: http://jenkins.qa.ubuntu.com/job/generic-mediumtests-builder-vivid-amd64/250/artifact/work/output/*zip*/output.zip

Click here to trigger a rebuild:
http://s-jenkins.ubuntu-ci:8080/job/camera-app-ci/321/rebuild

review: Needs Fixing (continuous-integration)

[lp:~artmello/camera-app/camera-app-gridlines]

428. By Arthur Mello on 2014-11-28

Merged bottom edge UI fixes from lp:~fboucault/camera-app/sdcard

[PS Jenkins bot (ps-jenkins)]

FAILED: Continuous integration, rev:428
http://jenkins.qa.ubuntu.com/job/camera-app-ci/325/
Executed test runs:
    SUCCESS: http://jenkins.qa.ubuntu.com/job/camera-app-vivid-amd64-ci/21
    SUCCESS: http://jenkins.qa.ubuntu.com/job/camera-app-vivid-armhf-ci/21
        deb: http://jenkins.qa.ubuntu.com/job/camera-app-vivid-armhf-ci/21/artifact/work/output/*zip*/output.zip
    SUCCESS: http://jenkins.qa.ubuntu.com/job/camera-app-vivid-i386-ci/21
    UNSTABLE: http://jenkins.qa.ubuntu.com/job/generic-click-autopilot-vivid-touch/36
    SUCCESS: http://jenkins.qa.ubuntu.com/job/generic-mediumtests-vivid/254
    UNSTABLE: http://jenkins.qa.ubuntu.com/job/generic-click-autopilot-runner-mako/679
    SUCCESS: http://jenkins.qa.ubuntu.com/job/generic-click-builder-vivid-armhf/56
    SUCCESS: http://s-jenkins.ubuntu-ci:8080/job/touch-flash-device/16329
    SUCCESS: http://jenkins.qa.ubuntu.com/job/autopilot-testrunner-otto-vivid/223
    SUCCESS: http://jenkins.qa.ubuntu.com/job/generic-mediumtests-builder-vivid-amd64/259
        deb: http://jenkins.qa.ubuntu.com/job/generic-mediumtests-builder-vivid-amd64/259/artifact/work/output/*zip*/output.zip

Click here to trigger a rebuild:
http://s-jenkins.ubuntu-ci:8080/job/camera-app-ci/325/rebuild

review: Needs Fixing (continuous-integration)

Unmerged revisions

=== modified file 'OptionValueButton.qml'
--- OptionValueButton.qml	2014-07-09 21:57:43 +0000
+++ OptionValueButton.qml	2014-12-01 01:56:45 +0000
@@ -47,14 +47,15 @@
         id: label
         anchors {
             left: icon.name != "" ? icon.right : parent.left
-            leftMargin: units.gu(2)
+            leftMargin: icon.name != "" ? units.gu(2) : icon.anchors.leftMargin
             right: parent.right
-            rightMargin: units.gu(2)
+            rightMargin: icon.anchors.leftMargin
             verticalCenter: parent.verticalCenter
         }
 
         color: "white"
         opacity: optionValueButton.selected ? 1.0 : 0.5
+        elide: Text.ElideRight
     }
 
     Rectangle {

=== modified file 'OptionsOverlay.qml'
--- OptionsOverlay.qml	2014-09-05 12:04:54 +0000
+++ OptionsOverlay.qml	2014-12-01 01:56:45 +0000
@@ -21,12 +21,13 @@
     id: optionsOverlay
 
     property list<ListModel> options
+    property bool valueSelectorOpened: optionValueSelector.caller != null
 
     function closeValueSelector() {
         optionValueSelector.hide();
     }
 
-    height: optionsGrid.height
+    height: optionsGrid.height + optionsGrid.rowSpacing
 
     Grid {
         id: optionsGrid
@@ -34,9 +35,7 @@
             horizontalCenter: parent.horizontalCenter
         }
 
-        columns: 3
-        columnSpacing: units.gu(9.5)
-        rowSpacing: units.gu(9.5)
+        rowSpacing: units.gu(4)
 
         Repeater {
             model: optionsOverlay.options
@@ -44,6 +43,9 @@
                 id: optionButton
                 model: modelData
                 onClicked: optionValueSelector.toggle(model, optionButton)
+                enabled: model.available && (!optionValueSelector.caller || optionValueSelector.caller == optionButton)
+                opacity: enabled ? 1.0 : 0.05
+                Behavior on opacity {UbuntuNumberAnimation {duration: UbuntuAnimation.FastDuration}}
             }
         }
     }
@@ -51,11 +53,9 @@
     Column {
         id: optionValueSelector
         objectName: "optionValueSelector"
-        anchors {
-            bottom: optionsGrid.top
-            bottomMargin: units.gu(2)
-        }
-        width: units.gu(12)
+        width: units.gu(16)
+
+        property OptionButton caller
 
         function toggle(model, callerButton) {
             if (optionValueSelectorVisible && optionsRepeater.model === model) {
@@ -66,13 +66,15 @@
         }
 
         function show(model, callerButton) {
+            optionValueSelector.caller = callerButton;
+            optionsRepeater.model = model;
             alignWith(callerButton);
-            optionsRepeater.model = model;
             optionValueSelectorVisible = true;
         }
 
         function hide() {
             optionValueSelectorVisible = false;
+            optionValueSelector.caller = null;
         }
 
         function alignWith(item) {
@@ -90,6 +92,9 @@
             } else {
                 x = centeredX;
             }
+
+            // vertically position the options above the caller button
+            y = Qt.binding(function() { return optionsGrid.y + item.y - height - units.gu(2) });
         }
 
         visible: opacity !== 0.0

=== modified file 'ViewFinderOverlay.qml'
--- ViewFinderOverlay.qml	2014-09-05 12:04:54 +0000
+++ ViewFinderOverlay.qml	2014-12-01 01:56:45 +0000
@@ -20,6 +20,7 @@
 import QtMultimedia 5.0
 import QtPositioning 5.2
 import CameraApp 0.1
+import Qt.labs.settings 1.0
 
 Item {
     id: viewFinderOverlay
@@ -34,15 +35,15 @@
         focusRing.show();
     }
 
-    QtObject {
+    Settings {
         id: settings
 
         property int flashMode: Camera.FlashAuto
         property bool gpsEnabled: false
         property bool hdrEnabled: false
         property int videoFlashMode: Camera.FlashOff
-
-        StateSaver.properties: "flashMode, gpsEnabled, hdrEnabled, videoFlashMode"
+        property bool gridEnabled: false
+        property int encodingQuality: 2 // QMultimedia.NormalQuality
     }
 
     Binding {
@@ -65,6 +66,12 @@
         value: settings.hdrEnabled
     }
 
+    Binding {
+        target: gridlines
+        property: "visible"
+        value: settings.gridEnabled
+    }
+
     Connections {
         target: camera.imageCapture
         onReadyChanged: {
@@ -77,10 +84,19 @@
         }
     }
 
+    function optionsOverlayClose() {
+        print("optionsOverlayClose")
+        if (optionsOverlayLoader.item.valueSelectorOpened) {
+            optionsOverlayLoader.item.closeValueSelector();
+        } else {
+            bottomEdge.close();
+        }
+    }
+
     MouseArea {
         id: bottomEdgeClose
         anchors.fill: parent
-        onClicked: bottomEdge.close()
+        onClicked: optionsOverlayClose()
     }
 
     Panel {
@@ -90,9 +106,19 @@
             left: parent.left
             bottom: parent.bottom
         }
-        height: units.gu(9)
+        height: optionsOverlayLoader.height
         onOpenedChanged: optionsOverlayLoader.item.closeValueSelector()
 
+        Item {
+            /* Use the 'trigger' feature of Panel so that tapping on the Panel
+               has the same effect as tapping outside of it (bottomEdgeClose) */
+            id: clickReceiver
+            anchors.fill: parent
+            function trigger() {
+                optionsOverlayClose();
+            }
+        }
+
         property real progress: (bottomEdge.height - bottomEdge.position) / bottomEdge.height
         property list<ListModel> options: [
             ListModel {
@@ -187,6 +213,28 @@
                     label: QT_TR_NOOP("Off")
                     value: false
                 }
+            },
+            ListModel {
+                id: gridOptionsModel
+
+                property string settingsProperty: "gridEnabled"
+                property string icon: "view-grid-symbolic"
+                property string label: ""
+                property bool isToggle: true
+                property int selectedIndex: bottomEdge.indexForValue(gridOptionsModel, settings.gridEnabled)
+                property bool available: true
+                property bool visible: true
+
+                ListElement {
+                    icon: ""
+                    label: QT_TR_NOOP("On")
+                    value: true
+                }
+                ListElement {
+                    icon: ""
+                    label: QT_TR_NOOP("Off")
+                    value: false
+                }
             }
         ]
 

=== modified file 'ViewFinderView.qml'
--- ViewFinderView.qml	2014-10-09 19:14:01 +0000
+++ ViewFinderView.qml	2014-12-01 01:56:45 +0000
@@ -132,7 +132,8 @@
     Item {
         id: viewFinderSwitcher
         anchors.fill: parent
-        
+        visible: !viewFinderSwitcherBlurred.visible
+
         ShaderEffectSource {
             id: viewFinderGrab
             live: false
@@ -247,6 +248,26 @@
                 viewFinderWidth: viewFinder.width
                 viewFinderOrientation: viewFinder.orientation
             }
+
+            Grid {
+                id: gridlines
+                anchors.fill: parent
+                visible: false
+                columns: 3
+                property int rows: 3
+
+                Repeater {
+                    model: gridlines.columns * gridlines.rows
+
+                    Rectangle {
+                        width: parent.width / gridlines.columns
+                        height: parent.height / gridlines.rows
+                        border.width: 1
+                        border.color: "gray"
+                        color: "transparent"
+                    }
+                }
+            }
         }
 
         Rectangle {
@@ -274,8 +295,12 @@
     }
 
     FastBlur {
+        id: viewFinderSwitcherBlurred
         anchors.fill: viewFinderSwitcher
-        radius: photoRollHint.visible ? 64 : viewFinderOverlay.revealProgress * 64
+        property real finalRadius: 64
+        property real finalOpacity: 0.7
+        radius: photoRollHint.visible ? finalRadius : viewFinderOverlay.revealProgress * finalRadius
+        opacity: photoRollHint.visible ? finalOpacity : (1.0 - viewFinderOverlay.revealProgress) * finalOpacity + finalOpacity
         source: radius !== 0 ? viewFinderSwitcher : null
         visible: radius !== 0
     }