Improve rendering of large values in ValueEditor (#3675)

Fix issues: #3641, #3625
Partially fix: #3599

src/main.cpp

@@ -28,7 +28,7 @@ int main(int argc, char *argv[])
     QApplication::setOrganizationDomain("redisdesktop.com");
     QApplication::setOrganizationName("redisdesktop");
 
-    QFontDatabase::addApplicationFont("://fonts/OpenSans-Regular.ttf");
+    QFontDatabase::addApplicationFont("://fonts/OpenSans.ttc");
     QFont defaultFont("OpenSans", 10);
     QApplication::setFont(defaultFont);
 

src/rdm.pro

@@ -60,6 +60,10 @@ win32 {
     CONFIG += c++11
     RC_FILE += $$PWD/resources/rdm.rc
 
+    win32-msvc* {
+        QMAKE_LFLAGS += /LARGEADDRESSAWARE
+    }
+
     release: DESTDIR = ./../bin/windows/release
     debug:   DESTDIR = ./../bin/windows/debug
 }

src/resources/fonts.qrc

@@ -1,5 +1,6 @@
 <RCC>
     <qresource prefix="/">
-        <file>fonts/OpenSans-Regular.ttf</file>
+        <file>fonts/OpenSans.ttc</file>
+        <file>fonts/Inconsolata-Regular.ttf</file>        
     </qresource>
 </RCC>

src/resources/qml/editors/MultilineEditor.qml

@@ -1,5 +1,6 @@
 import QtQuick 2.0
 import QtQuick.Controls 1.2
+import QtQuick.Controls.Styles 1.2
 import QtQuick.Layouts 1.1
 
 import "./formatters/formatters.js" as Formatters
@@ -83,25 +84,26 @@ ColumnLayout
             console.log("Text editor was disabled")
         }
 
-        text: {
-            if (!formatter) return ''
-            var val
-            if (formatter.binary === true)
-                val = formatter.getFormatted(binaryUtils.valueToBinary(value))
-            else
-                val = formatter.getFormatted(binaryUtils.toUtf(value))
-
-            if (val === undefined) {
-                formatterSelector.currentIndex = 0
-                binaryFlag.visible = false
-            }
+        text: {            
+            if (!formatter || !value)
+                return ''
 
-            return (val === undefined) ? '' : val
+            if (formatter.binary === true) {
+                return formatter.getFormatted(binaryUtils.valueToBinary(value)) || ''
+            } else {
+                return formatter.getFormatted(binaryUtils.toUtf(value)) || ''
+            }
         }
 
         property var formatter: {
             var index = formatterSelector.currentIndex ? formatterSelector.currentIndex : Formatters.defaultFormatterIndex
             return Formatters.enabledFormatters[index]
         }
+
+        style: TextAreaStyle {
+            renderType: Text.QtRendering
+        }
+        font { family: monospacedFont.name }
+        wrapMode: TextEdit.WrapAnywhere
     }
 }

src/resources/qml/editors/formatters/formatters.js

@@ -1,6 +1,7 @@
 .import "./msgpack.js" as MsgPack
 .import "./hexy.js" as Hexy
 .import "./php-unserialize.js" as PHPUnserialize
+.import "./json-tools.js" as JSONFormatter
 
 /**
   Plain formatter
@@ -74,11 +75,8 @@ var json = {
     htmlOutput: false,
 
     getFormatted: function (raw) {
-
-        try {
-            var parsed = JSON.parse(raw)
-            return JSON.stringify(parsed, undefined, 4)
-
+        try {            
+            return JSONFormatter.prettyPrint(raw)
         } catch (e) {
             return "Error: Invalid JSON"
         }
@@ -95,9 +93,7 @@ var json = {
 
     getRaw: function (formatted) {        
         try {
-            var parsed = JSON.parse(formatted)
-            return JSON.stringify(parsed)
-
+            return JSONFormatter.minify(formatted)
         } catch (e) {
             return formatted
         }
@@ -180,6 +176,11 @@ var enabledFormatters = [plain, json, msgpack, hex, hexTable, phpserialized]
 
 function guessFormatter(isBinary, value)
 {
+    // NOTE(u_glide): Use hex or plain formatter if value is large
+    if (binaryUtils.binaryStringLength(value) > 100000) {
+        return isBinary? 3 : 0
+    }
+
     var tryFormatters = isBinary? [2, 5, 3, 4] : [1, 5, 2]
 
     for (var index in tryFormatters) {

src/resources/qml/editors/formatters/json-tools.js

@@ -0,0 +1,88 @@
+/*
+    Based on:
+    json-format v.1.1
+    http://github.com/phoboslab/json-format
+    Released under MIT license:
+    http://www.opensource.org/licenses/mit-license.php
+*/
+
+var prettyPrint = function( json ) {
+    var p = []
+    var out = ""
+    var indent = 0;
+
+    var push = function( m ) { return '\\' + p.push( m ) + '\\'; }
+    var pop = function( m, i ) { return p[i-1] }
+    var tabs = function( count ) { return new Array( count + 1 ).join( '  ' ); }
+
+    // Extract backslashes and strings
+    json = json
+        .replace( /\\./g, push )
+        .replace( /(".*?"|'.*?')/g, push )
+        .replace( /\s+/, '' );
+
+    // Indent and insert newlines
+    for( var i = 0; i < json.length; i++ ) {
+        var c = json.charAt(i);
+
+        switch(c) {
+            case '{':
+            case '[':
+                out += c + "\n" + tabs(++indent);
+                break;
+            case '}':
+            case ']':
+                out += "\n" + tabs(--indent) + c;
+                break;
+            case ',':
+                out += ",\n" + tabs(indent);
+                break;
+            case ':':
+                out += ": ";
+                break;
+            default:
+                out += c;
+                break;
+        }
+    }
+
+    // Strip whitespace from numeric arrays and put backslashes
+    // and strings back in
+    out = out
+        .replace( /\[[\d,\s]+?\]/g, function(m){ return m.replace(/\s/g,''); } )
+        .replace( /\\(\d+)\\/g, pop ) // strings
+        .replace( /\\(\d+)\\/g, pop ); // backslashes in strings
+
+    return out;
+};
+
+
+/*!
+    Based on:
+
+    * pretty-data - nodejs plugin to pretty-print or minify data in XML, JSON and CSS formats.
+    *
+    * Version - 0.40.0
+    * Copyright (c) 2012 Vadim Kiryukhin
+    * vkiryukhin @ gmail.com
+    * http://www.eslinstructor.net/pretty-data/
+    * Dual licensed under the MIT and GPL licenses
+*/
+var minify =  function(json) {
+
+    return  json.replace(/\s{0,}\{\s{0,}/g,"{")
+                .replace(/\s{0,}\[$/g,"[")
+                .replace(/\[\s{0,}/g,"[")
+                .replace(/:\s{0,}\[/g,':[')
+                .replace(/\s{0,}\}\s{0,}/g,"}")
+                .replace(/\s{0,}\]\s{0,}/g,"]")
+                .replace(/\"\s{0,}\,/g,'",')
+                .replace(/\,\s{0,}\"/g,',"')
+                .replace(/\"\s{0,}:/g,'":')
+                .replace(/:\s{0,}\"/g,':"')
+                .replace(/:\s{0,}\[/g,':[')
+                .replace(/\,\s{0,}\[/g,',[')
+                .replace(/\,\s{2,}/g,', ')
+                .replace(/\]\s{0,},\s{0,}\[/g,'],[');
+};
+

src/resources/qml/value-editor.qml

@@ -13,6 +13,14 @@ Rectangle {
     color: "transparent"
     property var currentValueFormatter
 
+    FontLoader {
+        id: monospacedFont
+        Component.onCompleted: {
+            source = "qrc:/fonts/Inconsolata-Regular.ttf"
+        }
+     }
+
+
     TabView {
         id: tabs
         objectName: "rdm_qml_tabs" 

src/resources/rdm.qrc

@@ -49,5 +49,6 @@
         <file>qml/parts/RichTextWithLinks.qml</file>
         <file>qml/3rdparty/php-unserialize-js/phpUnserialize.js</file>
         <file>qml/bulk-operations/BulkOperationsDialog.qml</file>
+        <file>qml/editors/formatters/json-tools.js</file>
     </qresource>
 </RCC>