minor UI improvements for report page

CHANGELOG.md

@@ -12,6 +12,7 @@
 * more detailed messages for some tests on the checkup page
 * log messages which fail signature validation
 * make drive-redirect configurable via the settings page (disabled by default)
+* minor UI improvements for report page
 
 ## Bug fixes
 

customize.dist/src/less2/pages/page-report.less

@@ -12,6 +12,18 @@ html, body {
     background-color: @cp_static-bg !important;
     color: @cryptpad_text_col;
     font-family: "IBM Plex Mono";
+
+    #cp-report, #cp-report-ui {
+        max-width: 900px;
+        margin: auto;
+        padding: 15px;
+    }
+    #cp-report {
+        border: 1px solid @cryptpad_text_col;
+    }
+    #cp-report-ui {
+        text-align: right;
+    }
 }
 
 

www/common/clipboard.js

@@ -1,13 +1,15 @@
 define(['jquery'], function ($) {
     var Clipboard = {};
 
-    // copy arbitrary text to the clipboard
+    var copy = function (text, multiline) {
-    // return boolean indicating success
-    Clipboard.copy = function (text) {
         var $ta = $('<input>', {
             type: 'text',
         }).val(text);
 
+        if (multiline) {
+            $ta = $('<textarea>').val(text);
+        }
+
         $('body').append($ta);
 
         if (!($ta.length && $ta[0].select)) {
@@ -29,5 +31,15 @@ define(['jquery'], function ($) {
         return success;
     };
 
+    // copy arbitrary text to the clipboard
+    // return boolean indicating success
+    Clipboard.copy = function (text) {
+        return copy(text);
+    };
+
+    Clipboard.copy.multiline = function (text) {
+        return copy(text, true);
+    };
+
     return Clipboard;
 });

www/report/main.js

@@ -13,6 +13,7 @@ define([
     '/bower_components/chainpad-netflux/chainpad-netflux.js',
     '/bower_components/chainpad-crypto/crypto.js',
     '/common/userObject.js',
+    '/common/clipboard.js',
 
 
     '/bower_components/tweetnacl/nacl-fast.min.js',
@@ -20,16 +21,40 @@ define([
     'less!/customize/src/less2/pages/page-report.less',
 ], function ($, ApiConfig, h, Messages,
             nThen, Hash, Util, Crypt, Cryptpad, Cache, UI, CPNetflux,
-            Crypto, UserObject) {
+            Crypto, UserObject, Clipboard) {
     var $report = $('#cp-report');
     var hash = localStorage.User_hash;
     if (!hash) {
-        return void UI.errorLoadingScreen(Messages.mustLogin);
+        return void UI.alert(Messages.mustLogin, function () {
+            var href = Hash.hashToHref('', 'login');
+            var url = Hash.getNewPadURL(href, {
+                href: '/report/',
+            });
+            console.log(url);
+            window.location.href = url;
+        });
     }
 
     var addReport = function (str) {
         $report.append(h('div', str));
     };
+
+    var getReportContent = window.getReportContent = function () {
+        try {
+            return $report[0].innerText;
+        } catch (err) {
+            return '';
+        }
+    };
+
+    var copyToClipboard = function () {
+        if (Clipboard.copy.multiline(getReportContent())) {
+            UI.log(Messages.genericCopySuccess);
+        } else {
+            UI.warn(Messages.error);
+        }
+    };
+
     var checkCache = function (chan, cb) {
         Cache.getChannelCache(chan, function (err, val) {
             if (err) {
@@ -261,6 +286,15 @@ define([
         n(function () {
             addReport('===================');
             addReport('DONE');
+
+            Messages.copyToClipboard = 'Copy report to clipboard'; // XXX
+            var copyButton = h('button.btn.btn-primary', Messages.copyToClipboard);
+            copyButton.onclick = copyToClipboard;
+            var buttonContainer = h('div#cp-report-ui', [
+                copyButton,
+            ]);
+
+            document.body.appendChild(buttonContainer);
         });
     });