update: copy button on codeblock (#15)

main.ts

@@ -1,5 +1,6 @@
 import { App, Editor, MarkdownView, Modal, Plugin, PluginSettingTab, Setting, Notice } from 'obsidian';
 import { readFrontmatter, parseFrontmatter } from './frontmatterUtils';
+import './styles.css'
 
 export function checkFrontmatter(req_prop: string){
 	const regex = /{{this\.([^{}]*)}}/g;
@@ -24,7 +25,6 @@ export function checkFrontmatter(req_prop: string){
 }
 
 export function replaceOrder(stri, val) {
-		console.log(val)
     let index = 0;
     let replaced = stri.replace(/{}/g, function(match) {
         return val[index++];
@@ -174,10 +174,9 @@ export default class MainAPIR extends Plugin {
 		            const formatSplit = format.split("{}");
 		            const responseData = await requestUrl({ url: URL, method, headers, body });
 								if (!show) {
-		                el.innerHTML = formatSplit[0] + JSON.stringify(responseData.json, null) + formatSplit[1];
+		                el.innerHTML += formatSplit[0] + JSON.stringify(responseData.json, null) + formatSplit[1];
 		            } else {
 
-
 										if (show.includes("{..}")) {
 												if (show.includes(",")) { 
 							            el.innerHTML = "Error: can't use {..} and , in the same req";
@@ -195,8 +194,24 @@ export default class MainAPIR extends Plugin {
 		                    if (key.includes("->")) value = nestedValue(responseData, key);
 		                    return value;
 		                }) : [show.trim().includes("->") ? nestedValue(responseData, show.trim()) : JSON.stringify(responseData.json[show.trim()])];
-		                el.innerHTML = replaceOrder(format, values);
+		                el.innerHTML += replaceOrder(format, values);
 		            }
+		            // https://github.com/jdbrice/obsidian-code-block-copy/
+		            const btnCopy = el.createEl("button", {cls: "copy-req", text: "copy"});
+				        btnCopy.addEventListener('click', function () {
+				        		const copyThis = el.innerText;
+				            navigator.clipboard.writeText(copyThis.slice(0,-4)).then(function () {
+				                btnCopy.blur();
+				  
+				                btnCopy.innerText = 'copied!';
+				  
+				                setTimeout(function () {
+				                    btnCopy.innerText = 'copy';
+				                }, 2000);
+				            }, function (error) {
+				                btnCopy.innerText = 'Error';
+				            });
+				        });
 		        } catch (error) {
 		            console.error(error);
 		            el.innerHTML = "Error: " + error.message;

manifest.json

@@ -1,7 +1,7 @@
 {
 	"id": "api-request",
 	"name": "APIRequest",
-	"version": "1.1.7",
+	"version": "1.1.8",
 	"minAppVersion": "0.15.0",
 	"description": "Request and retrieve data from APIs. The responses are delivered in a JSON format for easy integration with your notes.",
 	"author": "rooyca",

package.json

@@ -1,6 +1,6 @@
 {
 	"name": "api-request",
-	"version": "1.1.7",
+	"version": "1.1.8",
 	"description": "Request and retrieve data from APIs. The responses are delivered in a JSON format for easy integration with your notes.",
 	"main": "main.js",
 	"scripts": {

styles.css

@@ -0,0 +1,9 @@
+.copy-req {
+    padding: var(--size-2-2) var(--size-2-3);
+    position: absolute;
+    top: 0;
+    right: 30px;
+    display: flex;
+    border-radius: var(--radius-s);
+    cursor: var(--cursor);
+}