Get mini scales working and center the webview.

Related to #10

src/main.cpp

@@ -239,16 +239,14 @@ int main(int argc, char *argv[])
     // This controls how big the web view will zoom using semantic zoom
     // over a specific number of pixels and we run out of space for on screen
     // tiles in chromium. This only happens on OSX since on other platforms
-    // we can use the GPU to transfer tiles directly.
+    // we can use the GPU to transfer tiles directly but we set the limit on all platforms
+    // to keep it consistent.
+    //
     // See more discussion in: https://github.com/plexinc/plex-media-player/issues/10
     // The number of pixels here are REAL pixels, the code in webview.qml will compensate
     // for a higher DevicePixelRatio
     //
-#ifdef Q_OS_MAC
     engine->rootContext()->setContextProperty("webMaxHeight", 1440);
-#else
-    engine->rootContext()->setContextProperty("webMaxHeight", 0.0);
-#endif
 
     // the only way to detect if QML parsing fails is to hook to this signal and then see
     // if we get a valid object passed to it. Any error messages will be reported on stderr

src/ui/webview.qml

@@ -36,25 +36,30 @@ KonvergoWindow
   {
     id: web
     objectName: "web"
-    anchors.fill: parent
-    anchors.horizontalCenter: parent.horizontalCenter
+    anchors.centerIn: parent
     settings.errorPageEnabled: false
     settings.localContentCanAccessRemoteUrls: true
     profile.httpUserAgent: components.system.getUserAgent()
     url: components.settings.value("path", "startupurl") + getMaxHeightArg()
     transformOrigin: Item.TopLeft
-    scale:
+
+    width: Math.min((parent.height * 16) / 9, parent.width)
+    height: Math.min((parent.width * 9) / 16, parent.height)
+
+    function getDesiredScale()
     {
       var verticalScale = height / 720;
       var horizontalScale = width / 1280;
 
-      var desiredScale = Math.min(verticalScale, horizontalScale);
+      return Math.min(verticalScale, horizontalScale);
+    }
+
+    scale:
+    {
+      var desiredScale = getDesiredScale();
       var maximumScale = webMaxHeight ? ((webMaxHeight / Screen.devicePixelRatio) / 720) : 10;
 
-      if (desiredScale < 1) {
-        // Web renders at 1:1, so scale down
-        return desiredScale;
-      } else if (desiredScale < maximumScale) {
+      if (desiredScale < maximumScale) {
         // Web renders at windows scale, no scaling
         return 1;
       } else {
@@ -63,6 +68,16 @@ KonvergoWindow
       }
     }
 
+    zoomFactor:
+    {
+      var desiredScale = getDesiredScale();
+
+      if (desiredScale < 1)
+        return desiredScale;
+      else
+       return 1;
+    }
+
     Component.onCompleted:
     {
       // set the transparency
@@ -162,7 +177,9 @@ KonvergoWindow
         dbg += "  Window size: " + parent.width + "x" + parent.height + "\n";
         dbg += "  DevicePixel ratio: " + Screen.devicePixelRatio + "\n";
         dbg += "  Web Max Height: " + (webMaxHeight / Screen.devicePixelRatio) + "\n";
-        dbg += "  Web scale: " + Math.round(web.scale * 100) / 100;
+        dbg += "  Web scale: " + Math.round(web.scale * 100) / 100 + "\n";
+        dbg += "  Desired Scale: " + Math.round(web.getDesiredScale() * 100) / 100 + "\n";
+        dbg += "  Zoom Factor: " + Math.round(web.zoomFactor * 100) / 100 + "\n";
 
         return dbg;
       }