[OGUI-424] Allow copying selected row (#403)

* [OGUI-419] Change debug background in inspector mode

* [OGUI-419] Disable debug messages by default

* [OGUI-419] Display facility column by default

* [OGUI-419] Staging

* [OGUI-419] Rever unwanted changes

* [OGUI-419] Revert

* [OGUI-424] Add copy row option

* [OGUI-424] Remove unwanted changes

* [OGUI-424] Bump version patch

* [OGUI-424] Add ctrl key as well

* [OGUI-424] Add notification that message was copied

InfoLogger/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aliceo2/infologger",
-  "version": "1.1.7",
+  "version": "1.1.8",
   "description": "Infologger GUI to query and stream log events",
   "homepage": "https://alice-o2.web.cern.ch",
   "main": "index.js",

InfoLogger/public/Model.js

@@ -1,6 +1,8 @@
 // Import frontend framework
-import {Observable, WebSocketClient, QueryRouter,
-  Loader, RemoteData, sessionService, Notification} from '/js/src/index.js';
+import {
+  Observable, WebSocketClient, QueryRouter,
+  Loader, RemoteData, sessionService, Notification
+} from '/js/src/index.js';
 import Log from './log/Log.js';
 import Timezone from './common/Timezone.js';
 import {callRateLimiter} from './common/utils.js';
@@ -105,7 +107,7 @@ export default class Model extends Observable {
    * @param {Event} e
    */
   handleKeyboardDown(e) {
-    // console.log(`e.keyCode=${e.keyCode}, e.metaKey=${e.metaKey}, e.ctrlKey=${e.ctrlKey}, e.altKey=${e.altKey}`);
+    // console.log(`e.code=${e.code}, e.key=${e.key},e.keyCode=${e.keyCode}, e.metaKey=${e.metaKey}, e.ctrlKey=${e.ctrlKey}, e.altKey=${e.altKey}`);
     const code = e.keyCode;
 
     // Enter
@@ -148,6 +150,12 @@ export default class Model extends Observable {
         }
         e.preventDefault(); // avoid scroll
         break;
+      case 67:
+        if ((e.metaKey || e.ctrlKey) && window.getSelection().toString() === '') {
+          navigator.clipboard.writeText(this.log.displayedItemFieldsToString());
+          this.notification.show('Message has been successfully copied to clipboard', 'success', 1500);
+        }
+        break;
     }
   }
 

InfoLogger/public/log/Log.js

@@ -498,4 +498,30 @@ export default class Log extends Observable {
         this.query();
     }
   }
+
+  /**
+   * Method which will create a table alike string with the elements displayed in the table of the current item
+   * @return {string}
+   */
+  displayedItemFieldsToString() {
+    let message = '| ' + this.item['severity'];
+    Object.keys(this.columns)
+      .filter((key) => this.columns[key])
+      .forEach((key) => {
+        const item = this.item[key];
+        if (key === 'time') {
+          const timestamp = this.item['timestamp'];
+          message += ' | ' + this.model.timezone.format(timestamp, this.timeFormat);
+        } else if (key === 'date') {
+          const timestamp = this.item['timestamp'];
+          message += ' | ' + this.model.timezone.format(timestamp, 'date');
+        } else if (item) {
+          message += ' | ' + item;
+        } else {
+          message += ' | ';
+        }
+      });
+    message += ' |';
+    return message;
+  }
 }