Enable qmlvideofx window to be resized, when large screen layout used

Change-Id: I3010b9fd5f68e922ff94edd4d08d8114c689c037
Reviewed-by: Jonas Rabbe <jonas.rabbe@nokia.com>

examples/video/qmlvideofx/main.cpp

@@ -129,6 +129,11 @@ int main(int argc, char *argv[])
         videoPath = moviesLocation.first();
     viewer.rootContext()->setContextProperty("videoPath", videoPath);
 
+    viewer.setWindowTitle("qmlvideofx");
+    viewer.setWindowFlags(Qt::Window | Qt::WindowSystemMenuHint | Qt::WindowTitleHint |
+                          Qt::WindowMinMaxButtonsHint | Qt::WindowCloseButtonHint);
+    viewer.setMinimumSize(QSize(600, 400));
+
 #ifdef SMALL_SCREEN_PHYSICAL
     viewer.showFullScreen();
 #else

examples/video/qmlvideofx/qml/qmlvideofx/Content.qml

@@ -82,6 +82,16 @@ Rectangle {
         ignoreUnknownSignals: true
     }
 
+    onWidthChanged: {
+        if (effectLoader.item)
+            effectLoader.item.targetWidth = root.width
+    }
+
+    onHeightChanged: {
+        if (effectLoader.item)
+            effectLoader.item.targetHeight = root.height
+    }
+
     onEffectSourceChanged: {
         console.log("[qmlvideofx] Content.onEffectSourceChanged " + effectSource)
         effectLoader.source = effectSource

examples/video/qmlvideofx/qml/qmlvideofx/ContentImage.qml

@@ -42,5 +42,6 @@
 import QtQuick 2.0
 
 Image {
+    fillMode: Image.PreserveAspectFit
     smooth: true
 }

examples/video/qmlvideofx/qml/qmlvideofx/EffectMagnify.qml

@@ -58,12 +58,31 @@ Effect {
     property real posX: -1
     property real posY: -1
 
+    QtObject {
+        id: d
+        property real oldTargetWidth: root.targetWidth
+        property real oldTargetHeight: root.targetHeight
+    }
+
     // Transform slider values, and bind result to shader uniforms
     property real radius: parameters.get(0).value * 100
     property real diffractionIndex: parameters.get(1).value
 
-    onTargetWidthChanged: if (posX == -1) posX = targetWidth / 2
-    onTargetHeightChanged: if (posY == -1) posY = targetHeight / 2
+    onTargetWidthChanged: {
+        if (posX == -1)
+            posX = targetWidth / 2
+        else if (d.oldTargetWidth != 0)
+            posX *= (targetWidth / d.oldTargetWidth)
+        d.oldTargetWidth = targetWidth
+    }
+
+    onTargetHeightChanged: {
+        if (posY == -1)
+            posY = targetHeight / 2
+        else if (d.oldTargetHeight != 0)
+            posY *= (targetHeight / d.oldTargetHeight)
+        d.oldTargetHeight = targetHeight
+    }
 
     fragmentShaderFilename: "shaders/magnify.fsh"
 

examples/video/qmlvideofx/qml/qmlvideofx/main-largescreen.qml

@@ -60,7 +60,9 @@ Rectangle {
             id: content
             anchors {
                 top: parent.top
+                bottom: parent.bottom
                 left: parent.left
+                right: effectSelectionPanel.left
                 margins: 5
             }
             width: 600
@@ -99,11 +101,11 @@ Rectangle {
             id: effectSelectionPanel
             anchors {
                 top: parent.top
-                left: content.right
+                bottom: fileOpen.top
                 right: parent.right
                 margins: 5
             }
-            height: 420
+            width: 300
             itemHeight: 40
              onEffectSourceChanged: {
                 content.effectSource = effectSource
@@ -114,12 +116,12 @@ Rectangle {
         FileOpen {
             id: fileOpen
             anchors {
-                top: effectSelectionPanel.bottom
-                left: content.right
                 right: parent.right
                 bottom: parent.bottom
                 margins: 5
             }
+            width: effectSelectionPanel.width
+            height: 165
             buttonHeight: 32
             topMargin: 10
         }