Merge pull request #1464 from thelounge/xpaw/clipboard

Format messages on copy

client/css/style.css

@@ -174,6 +174,7 @@ kbd {
 	color: rgba(0, 0, 0, 0.35) !important;
 }
 
+#js-copy-hack,
 #help,
 #windows .header .title,
 #windows .header .topic,
@@ -185,6 +186,16 @@ kbd {
 	cursor: text;
 }
 
+#js-copy-hack {
+	position: absolute;
+	left: -999999px;
+}
+
+#chat #js-copy-hack .condensed:not(.closed) .msg,
+#chat #js-copy-hack > .msg {
+	display: block;
+}
+
 /* Icons */
 
 #viewport .lt::before,
@@ -1001,7 +1012,6 @@ kbd {
 #chat .time,
 #chat .from,
 #chat .content {
-	display: block;
 	padding: 2px 0;
 	flex: 0 0 auto;
 }

client/js/clipboard.js

@@ -0,0 +1,38 @@
+"use strict";
+
+const $ = require("jquery");
+const chat = document.getElementById("chat");
+
+function copyMessages() {
+	const selection = window.getSelection();
+
+	// If selection does not span multiple elements, do nothing
+	if (selection.anchorNode === selection.focusNode) {
+		return;
+	}
+
+	const range = selection.getRangeAt(0);
+	const documentFragment = range.cloneContents();
+	const div = document.createElement("div");
+
+	$(documentFragment)
+		.find(".from .user")
+		.each((_, el) => {
+			el = $(el);
+			el.text(`<${el.text()}>`);
+		});
+
+	div.id = "js-copy-hack";
+	div.appendChild(documentFragment);
+	chat.appendChild(div);
+
+	selection.selectAllChildren(div);
+
+	window.setTimeout(() => {
+		chat.removeChild(div);
+		selection.removeAllRanges();
+		selection.addRange(range);
+	}, 0);
+}
+
+$(chat).on("copy", ".messages", copyMessages);

client/js/lounge.js

@@ -21,6 +21,7 @@ const options = require("./options");
 const utils = require("./utils");
 require("./autocompletion");
 require("./webpush");
+require("./clipboard");
 
 $(function() {
 	var sidebar = $("#sidebar, #footer");