:gem: [Feature] Enable copy button for messages
Browse files- components/messager.js +24 -10
- index.html +1 -0
components/messager.js
CHANGED
|
@@ -34,7 +34,7 @@ class MessagerViewer {
|
|
| 34 |
.addClass("content-displayer")
|
| 35 |
.addClass(`chat-${this.message.role}`)
|
| 36 |
.append(this.message.content);
|
| 37 |
-
this.content_displayer.data("raw_content",
|
| 38 |
}
|
| 39 |
create_button_group() {
|
| 40 |
this.button_group = $("<div>")
|
|
@@ -43,6 +43,16 @@ class MessagerViewer {
|
|
| 43 |
.css("z-index", "1")
|
| 44 |
.css("padding", "auto");
|
| 45 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 46 |
this.edit_button = $("<button>")
|
| 47 |
.addClass("btn pt-0 px-2")
|
| 48 |
.addClass("edit-button")
|
|
@@ -57,15 +67,19 @@ class MessagerViewer {
|
|
| 57 |
.append($("<span>").addClass("fa fa-small fa-copy"));
|
| 58 |
this.button_group.append(this.copy_button);
|
| 59 |
|
| 60 |
-
|
| 61 |
-
|
| 62 |
-
.
|
| 63 |
-
.
|
| 64 |
-
.
|
| 65 |
-
|
| 66 |
-
|
| 67 |
-
|
| 68 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
| 69 |
}
|
| 70 |
}
|
| 71 |
|
|
|
|
| 34 |
.addClass("content-displayer")
|
| 35 |
.addClass(`chat-${this.message.role}`)
|
| 36 |
.append(this.message.content);
|
| 37 |
+
this.content_displayer.data("raw_content", this.message.content);
|
| 38 |
}
|
| 39 |
create_button_group() {
|
| 40 |
this.button_group = $("<div>")
|
|
|
|
| 43 |
.css("z-index", "1")
|
| 44 |
.css("padding", "auto");
|
| 45 |
|
| 46 |
+
if (this.message.role === "assistant") {
|
| 47 |
+
this.regenerate_button = $("<button>")
|
| 48 |
+
.addClass("btn pt-0 px-2")
|
| 49 |
+
.addClass("regenerate-button")
|
| 50 |
+
.attr("title", "Regenerate")
|
| 51 |
+
.append($("<span>").addClass("fa fa-small fa-rotate"));
|
| 52 |
+
this.button_group.append(this.regenerate_button);
|
| 53 |
+
} else {
|
| 54 |
+
}
|
| 55 |
+
|
| 56 |
this.edit_button = $("<button>")
|
| 57 |
.addClass("btn pt-0 px-2")
|
| 58 |
.addClass("edit-button")
|
|
|
|
| 67 |
.append($("<span>").addClass("fa fa-small fa-copy"));
|
| 68 |
this.button_group.append(this.copy_button);
|
| 69 |
|
| 70 |
+
this.copy_button.click(function () {
|
| 71 |
+
let content = $(this)
|
| 72 |
+
.closest(".message-viewer")
|
| 73 |
+
.find(".content-displayer")
|
| 74 |
+
.data("raw_content");
|
| 75 |
+
console.log("Copy");
|
| 76 |
+
console.log(content);
|
| 77 |
+
let clipboard = new ClipboardJS(this, {
|
| 78 |
+
text: function () {
|
| 79 |
+
return content;
|
| 80 |
+
},
|
| 81 |
+
});
|
| 82 |
+
});
|
| 83 |
}
|
| 84 |
}
|
| 85 |
|
index.html
CHANGED
|
@@ -23,6 +23,7 @@
|
|
| 23 |
<script src="https://cdn.jsdelivr.net/npm/js-cookie@3.0.5/dist/js.cookie.min.js"></script>
|
| 24 |
<script src="https://cdnjs.cloudflare.com/ajax/libs/showdown/2.1.0/showdown.min.js"></script>
|
| 25 |
<script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js"></script>
|
|
|
|
| 26 |
<link rel="stylesheet" href="./css/default.css" />
|
| 27 |
</head>
|
| 28 |
<body>
|
|
|
|
| 23 |
<script src="https://cdn.jsdelivr.net/npm/js-cookie@3.0.5/dist/js.cookie.min.js"></script>
|
| 24 |
<script src="https://cdnjs.cloudflare.com/ajax/libs/showdown/2.1.0/showdown.min.js"></script>
|
| 25 |
<script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js"></script>
|
| 26 |
+
<script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.11/clipboard.min.js"></script>
|
| 27 |
<link rel="stylesheet" href="./css/default.css" />
|
| 28 |
</head>
|
| 29 |
<body>
|