From 355a7acbf2e392786f7d0fb054ff12b0c6a3dea2 Mon Sep 17 00:00:00 2001
From: Phillip Phan <php46@drexel.edu>
Date: Thu, 4 May 2023 14:00:30 -0400
Subject: [PATCH] Copy to Clipboard QOL complete
---
CI-ColorWebs/Pages/Index.cshtml | 30 ++++++++++++++++++++++--------
1 file changed, 22 insertions(+), 8 deletions(-)
diff --git a/CI-ColorWebs/Pages/Index.cshtml b/CI-ColorWebs/Pages/Index.cshtml
index 9176e80..8a4e906 100644
--- a/CI-ColorWebs/Pages/Index.cshtml
+++ b/CI-ColorWebs/Pages/Index.cshtml
@@ -15,7 +15,21 @@
}
</style>
-<script>src = 'site.js'</script>
+<script>
+src = 'site.js'
+function copyHex(celement) {
+ let hexCopy = celement.innerText;
+ let input = document.createElement('input');
+ input.setAttribute('value', hexCopy);
+ document.body.appendChild(input);
+ input.select();
+
+ document.execCommand('copy');
+ document.body.removeChild(input);
+ alert('Copied: ' + celement.innerText);
+}
+</script>
+
<div class="text-center">
<div class = gifDiv>
<h1 class="introHeader">Welcome to Color Palette Generator!</h1>
@@ -29,13 +43,13 @@
<span id="palName" class = "paletteName"></span>
<br>
<br>
- <button id="color"></button>
- <button id="color2"></button>
- <button id="color3"></button>
- <button id="color4"></button>
- <button id="color5"></button>
- <button id="color6"></button>
- <canvas width="700"></canvas>
+ <button id="color" onclick="copyHex(color)"></button>
+ <button id="color2" onclick="copyHex(color2)"></button>
+ <button id="color3" onclick="copyHex(color3)"></button>
+ <button id="color4" onclick="copyHex(color4)"></button>
+ <button id="color5" onclick="copyHex(color5)"></button>
+ <button id="color6" onclick="copyHex(color6)"></button>
+ <canvas width="700" ></canvas>
</h2>
<h3>
<p>View your pallete visualized through AI art:</p>
--
GitLab