From 22717edc5aab34e0f7c0c322a3fd81af04704ecd Mon Sep 17 00:00:00 2001 From: Aryan Gupta Date: Mon, 26 Jun 2023 15:57:10 +0530 Subject: [PATCH 01/26] Some changes for the new wget code panel --- functions/colab.js | 5 +- index.html | 1 + src/components/NavColab.vue | 25 ++-- src/components/PaneLeft.vue | 6 +- src/components/css/NavCode.vue | 239 +++++++++++++++++++++++++++++++++ src/store.js | 7 +- 6 files changed, 267 insertions(+), 16 deletions(-) create mode 100644 src/components/css/NavCode.vue diff --git a/functions/colab.js b/functions/colab.js index 5be2046e..51bdbd5a 100644 --- a/functions/colab.js +++ b/functions/colab.js @@ -105,6 +105,9 @@ exports.handler = async function (event, _) { const colabLink = `https://colab.research.google.com/github/${repoOwner}/${repo}/blob/main/nbs/${nbUid}/${nbName}` return { statusCode: 200, - body: colabLink + body: { + colabLink : colabLink, + url: zipRes + } } } diff --git a/index.html b/index.html index 670d23e4..6e041290 100644 --- a/index.html +++ b/index.html @@ -54,6 +54,7 @@ href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&display=swap" rel="stylesheet" /> + Code Generator diff --git a/src/components/NavColab.vue b/src/components/NavColab.vue index 050a2f9b..11fc7a6e 100644 --- a/src/components/NavColab.vue +++ b/src/components/NavColab.vue @@ -85,18 +85,21 @@ export default { // We make a POST request to the function with // the content of store.code in JSON as request body colabText.value = 'Opening in Colab' - const res = await fetch('/.netlify/functions/colab', { - method: 'POST', - headers: { - 'Content-Type': 'application/json' - }, - body: JSON.stringify({ - code: store.code, - template: store.config.template + if (store.url == ""){ + const res = await fetch('/.netlify/functions/colab', { + method: 'POST', + headers: { + 'Content-Type': 'application/json' + }, + body: JSON.stringify({ + code: store.code, + template: store.config.template + }) }) - }) - // response body is plain text - const colabLink = await res.text() + // response body is plain text + const colabLink = await res.json().colabLink + store.codeUrl = await res.json().url + } // create a hyperlink element const el = document.createElement('a') el.setAttribute('href', colabLink) diff --git a/src/components/PaneLeft.vue b/src/components/PaneLeft.vue index 7a15b89b..fafaa8a0 100644 --- a/src/components/PaneLeft.vue +++ b/src/components/PaneLeft.vue @@ -12,7 +12,7 @@
- +
@@ -30,6 +30,7 @@ import TabLoggers from './TabLoggers.vue' import Message from './Message.vue' import NavDownload from './NavDownload.vue' import NavColab from './NavColab.vue' +import NavCode from './css/NavCode.vue' import { computed, ref } from 'vue' import { msg, store } from '../store.js' @@ -41,7 +42,8 @@ export default { TabHandlers, Message, NavDownload, - NavColab + NavColab, + NavCode }, setup() { const currentTab = ref('Templates') diff --git a/src/components/css/NavCode.vue b/src/components/css/NavCode.vue new file mode 100644 index 00000000..ac6cba7c --- /dev/null +++ b/src/components/css/NavCode.vue @@ -0,0 +1,239 @@ + + + + + + \ No newline at end of file diff --git a/src/store.js b/src/store.js index b8197a35..0ba6a8ab 100644 --- a/src/store.js +++ b/src/store.js @@ -37,14 +37,16 @@ export const msg = reactive({ // main reactive object // store.code - the final rendered code to be included in archive // store.config - the internal config to track user input +// codeUrl - the wget url for integration and local development export const store = reactive({ code: {}, config: { template: '', include_test: false, output_dir: './logs', - log_every_iters: 2 - } + log_every_iters: 2. + }, + codeUrl: "" }) /** @@ -84,6 +86,7 @@ export function genCode() { '# THIS FILE APPEARS ONLY IN DEV MODE\n' + JSON.stringify(store.config, null, 2) } + store.codeUrl = ""; } } From e6ed93a005b349dcc028711b680fd32beeea3c31 Mon Sep 17 00:00:00 2001 From: Aryan Gupta Date: Mon, 26 Jun 2023 16:48:06 +0530 Subject: [PATCH 02/26] Made some more changes and refactoring --- src/components/{css => }/NavCode.vue | 32 +++++++++++++++++++++++++--- src/components/NavDownload.vue | 21 +----------------- 2 files changed, 30 insertions(+), 23 deletions(-) rename src/components/{css => }/NavCode.vue (85%) diff --git a/src/components/css/NavCode.vue b/src/components/NavCode.vue similarity index 85% rename from src/components/css/NavCode.vue rename to src/components/NavCode.vue index ac6cba7c..722ee149 100644 --- a/src/components/css/NavCode.vue +++ b/src/components/NavCode.vue @@ -16,9 +16,30 @@ content_copy
- + +
+
+
+

🎉 Your Training Script Has Been Generated! 🎉

+

+ Thanks for using Code-Generator! Feel free to reach out to us on + GitHub + with any feedback, bug report, and feature request. +

+
+
@@ -33,6 +54,8 @@ export default { setup(){ const linkGenerated = ref(false); const codeUrl = ref(null); + const showDownloadMsg = ref(false); + const generateLink = async () => { if (store.code && Object.keys(store.code).length) { msg.color = 'red' @@ -47,7 +70,7 @@ export default { // base netlify url + .netlify/functions/function-name // We make a POST request to the function with // the content of store.code in JSON as request body - if (store.url == "") { + if (store.codeUrl == "") { console.log("test") const res = await fetch('/.netlify/functions/colab', { method: 'POST', @@ -73,8 +96,11 @@ export default { msg.content = 'Choose a template to Open.' } } + const DownloadMsg = () => { + showDownloadMsg.value = True; + } - return {linkGenerated, generateLink, codeUrl } + return {linkGenerated, generateLink, codeUrl, showDownloadMsg, DownloadMsg } } } diff --git a/src/components/NavDownload.vue b/src/components/NavDownload.vue index ebdcb385..71148b36 100644 --- a/src/components/NavDownload.vue +++ b/src/components/NavDownload.vue @@ -73,6 +73,7 @@ export default { saveAs(content, `ignite-${store.config.template}.zip`) }) showDownloadMsg.value = true + $emit('showDownloadMsg'); } } else { msg.showMsg = true @@ -110,24 +111,4 @@ export default { width: 100vw; height: 100vh; } -.msg-wrapper { - position: fixed; - max-width: 38rem; - padding: 0 1rem; - text-align: center; - margin: 20vh auto 100%; - inset: 0; - z-index: 12; -} -.msg { - padding: 2rem 1rem; - background-color: var(--c-white-light); - color: var(--c-text); - border-radius: 8px; - box-shadow: 0 0 5px 5px rgba(0, 0, 0, 0.33); -} -.msg-gh { - margin: 0; - color: var(--c-brand-red); -} From 671cc09bc05061c43317af19e6339c964976c49a Mon Sep 17 00:00:00 2001 From: Aryan Gupta Date: Mon, 26 Jun 2023 17:12:28 +0530 Subject: [PATCH 03/26] Added text copy button --- src/components/NavCode.vue | 18 ++++++++++++++---- src/components/NavColab.vue | 2 +- src/components/NavDownload.vue | 21 --------------------- src/store.js | 1 + 4 files changed, 16 insertions(+), 26 deletions(-) diff --git a/src/components/NavCode.vue b/src/components/NavCode.vue index 722ee149..6c452203 100644 --- a/src/components/NavCode.vue +++ b/src/components/NavCode.vue @@ -11,8 +11,8 @@
- -
@@ -45,7 +45,7 @@ diff --git a/src/components/NavColab.vue b/src/components/NavColab.vue index 11fc7a6e..769bf767 100644 --- a/src/components/NavColab.vue +++ b/src/components/NavColab.vue @@ -85,7 +85,7 @@ export default { // We make a POST request to the function with // the content of store.code in JSON as request body colabText.value = 'Opening in Colab' - if (store.url == ""){ + if (store.codeUrl == ""){ const res = await fetch('/.netlify/functions/colab', { method: 'POST', headers: { diff --git a/src/components/NavDownload.vue b/src/components/NavDownload.vue index 71148b36..8ae59a3d 100644 --- a/src/components/NavDownload.vue +++ b/src/components/NavDownload.vue @@ -22,27 +22,6 @@ Download -
-
-
-

🎉 Your Training Script Has Been Generated! 🎉

-

- Thanks for using Code-Generator! Feel free to reach out to us on - GitHub - with any feedback, bug report, and feature request. -

-
-
\ No newline at end of file + diff --git a/src/components/NavColab.vue b/src/components/NavColab.vue index 93104941..de80dcf7 100644 --- a/src/components/NavColab.vue +++ b/src/components/NavColab.vue @@ -85,19 +85,22 @@ export default { // We make a POST request to the function with // the content of store.code in JSON as request body colabText.value = 'Opening in Colab' - const res = await fetch('/.netlify/functions/colab', { - method: 'POST', - headers: { - 'Content-Type': 'application/json' - }, - body: JSON.stringify({ - code: store.code, - template: store.config.template - }) - }) + const res = await fetch( + '/.netlify/functions/colab', + { + method: 'POST', + headers: { + 'Content-Type': 'application/json' + }, + body: JSON.stringify({ + code: store.code, + template: store.config.template + }) + } + ) // response body is plain text const colabLink = await res.text() - + // create a hyperlink element const el = document.createElement('a') el.setAttribute('href', colabLink) diff --git a/src/components/NavDownload.vue b/src/components/NavDownload.vue index c7effd57..5d8d78bd 100644 --- a/src/components/NavDownload.vue +++ b/src/components/NavDownload.vue @@ -1,16 +1,27 @@