From befab6bdbde22f5b238860ef335e65f73d5d7a45 Mon Sep 17 00:00:00 2001 From: Natalia Luzuriaga Date: Tue, 3 Dec 2024 08:29:22 -0800 Subject: [PATCH 1/7] Created blank form using Form.io Signed-off-by: Natalia Luzuriaga --- form.html | 39 +++++++++++++++++++++++++++++++++++++++ 1 file changed, 39 insertions(+) create mode 100644 form.html diff --git a/form.html b/form.html new file mode 100644 index 0000000..f3ae625 --- /dev/null +++ b/form.html @@ -0,0 +1,39 @@ + + + + + + + + + + + + + + + + + + + + + + + +
+ + + \ No newline at end of file From 161f700f5a10d30b7a500c5cdba266c534255e66 Mon Sep 17 00:00:00 2001 From: Natalia Luzuriaga Date: Tue, 3 Dec 2024 08:30:23 -0800 Subject: [PATCH 2/7] Created input schema file Signed-off-by: Natalia Luzuriaga --- schemas/schema.json | 16 ++++++++++++++++ 1 file changed, 16 insertions(+) create mode 100644 schemas/schema.json diff --git a/schemas/schema.json b/schemas/schema.json new file mode 100644 index 0000000..9c3ab64 --- /dev/null +++ b/schemas/schema.json @@ -0,0 +1,16 @@ +{ + "$schema": "http://json-schema.org/draft-04/schema#", + "title": "CMS Code.json Metadata", + "description": "A metadata standard for software repositories of CMS", + "type": "object", + "properties": { + "name": { + "type": "string", + "description": "Name of the project or software" + }, + "softwareDescription": { + "type": "string", + "description": "project description here" + } + } +} \ No newline at end of file From 329c0220e4ffe0430d3ff950e143f067c5070892 Mon Sep 17 00:00:00 2001 From: Natalia Luzuriaga Date: Tue, 3 Dec 2024 08:38:36 -0800 Subject: [PATCH 3/7] Added functionality to retrieve input json and generate form components Signed-off-by: Natalia Luzuriaga --- form.html | 10 ++++-- js/generateFormComponents.js | 70 ++++++++++++++++++++++++++++++++++++ 2 files changed, 78 insertions(+), 2 deletions(-) create mode 100644 js/generateFormComponents.js diff --git a/form.html b/form.html index f3ae625..d9a88e2 100644 --- a/form.html +++ b/form.html @@ -22,8 +22,10 @@
+ \ No newline at end of file diff --git a/js/generateFormComponents.js b/js/generateFormComponents.js new file mode 100644 index 0000000..41f394a --- /dev/null +++ b/js/generateFormComponents.js @@ -0,0 +1,70 @@ +// Retrieves file and returns as json object +async function retrieveFile(filePath) { + try { + const response = await fetch(filePath); + + // Check if the response is OK (status code 200) + if (!response.ok) { + throw new Error('Network response was not ok'); + } + // Return the parsed JSON content + return await response.json(); + } catch (error) { + console.error('There was a problem with the fetch operation:', error); + return null; + } +} + +// Creates Form.io component based on json fields +// Supports text field for now +// TODO: Create components for number, select, and multi-select +function createComponent(fieldName, fieldObject) { + switch (fieldObject["type"]) { + case "string": + return { + type: "textfield", + key: fieldName, + label: fieldName, + input: true, + tooltip: fieldObject["description"], + description: fieldObject["description"] + }; + default: + break; + } +} + +// Iterates through each json field and creates component array for Form.io +async function createFormComponents() { + var components = []; + var formFields = {}; + + var filePath = "schemas/schema.json" + var jsonData = await retrieveFile(filePath) + console.log('JSON Data:', jsonData); + + formFields = jsonData["properties"]; + console.log('form Fields:', formFields); + + for (const key in formFields) { + console.log(`${key}:`, formFields[key]); + var fieldComponent = createComponent(key, formFields[key]) + components.push(fieldComponent) + } + + // Add submit button to form + components.push({ + "type": "button", + "label": "Submit", + "key": "submit", + "disableOnInvalid": true, + "input": true, + "tableView": false + }) + + console.log(components) + + return components; +} + +window.createFormComponents = createFormComponents; \ No newline at end of file From f00a7e94aadb04130fd2d32252df3d9fbdea9195 Mon Sep 17 00:00:00 2001 From: Natalia Luzuriaga Date: Tue, 3 Dec 2024 08:40:16 -0800 Subject: [PATCH 4/7] Created blank code.json to populate with form data Signed-off-by: Natalia Luzuriaga --- schemas/template-code.json | 4 ++++ 1 file changed, 4 insertions(+) create mode 100644 schemas/template-code.json diff --git a/schemas/template-code.json b/schemas/template-code.json new file mode 100644 index 0000000..f22a64b --- /dev/null +++ b/schemas/template-code.json @@ -0,0 +1,4 @@ +{ + "name": "", + "softwareDescription": "" +} \ No newline at end of file From bbf9e68e5bf461efbee75459eb60cfe9408e7d55 Mon Sep 17 00:00:00 2001 From: Natalia Luzuriaga Date: Tue, 3 Dec 2024 08:48:58 -0800 Subject: [PATCH 5/7] Added functionality to create and download code.json using form data Signed-off-by: Natalia Luzuriaga --- form.html | 7 +++++ js/formDataToJson.js | 68 ++++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 75 insertions(+) create mode 100644 js/formDataToJson.js diff --git a/form.html b/form.html index d9a88e2..3d8a177 100644 --- a/form.html +++ b/form.html @@ -23,6 +23,7 @@
+ - - -
- - - - - \ No newline at end of file + + + + +
+ + + + + diff --git a/js/formDataToJson.js b/js/formDataToJson.js index 3532dc7..1615095 100644 --- a/js/formDataToJson.js +++ b/js/formDataToJson.js @@ -1,68 +1,68 @@ // Retrieves file and returns as json object async function retrieveFile(filePath) { - try { - const response = await fetch(filePath); + try { + const response = await fetch(filePath); - if (!response.ok) { - throw new Error('Network response was not ok'); - } - // Returns file contents in a json format - return await response.json(); - } catch (error) { - console.error('There was a problem with the fetch operation:', error); - return null; - } + if (!response.ok) { + throw new Error("Network response was not ok"); + } + // Returns file contents in a json format + return await response.json(); + } catch (error) { + console.error("There was a problem with the fetch operation:", error); + return null; + } } // Populates blank code.json object with values from form function populateObject(data, blankObject) { - for (let key in data) { - console.log("current key", key) - console.log("check if value exists", data.hasOwnProperty(key)) - if (blankObject.hasOwnProperty(key)) { - if (typeof data[key] === 'object' && data[key] !== null) { - // If object, recursively populate - // TODO: test out for permissions and description objects - populateObject(data[key], blankObject[key]); - } else { - // Add value - blankObject[key] = data[key]; - } - } - } + for (let key in data) { + console.log("current key", key); + console.log("check if value exists", data.hasOwnProperty(key)); + if (blankObject.hasOwnProperty(key)) { + if (typeof data[key] === "object" && data[key] !== null) { + // If object, recursively populate + // TODO: test out for permissions and description objects + populateObject(data[key], blankObject[key]); + } else { + // Add value + blankObject[key] = data[key]; + } + } + } } async function populateCodeJson(data) { - // Path to the blank json file - const filePath = 'schemas/template-code.json'; + // Path to the blank json file + const filePath = "schemas/template-code.json"; - var codeJson = await retrieveFile(filePath); + var codeJson = await retrieveFile(filePath); - if (codeJson) { - populateObject(data, codeJson); - } else { - console.error("Failed to retrieve JSON data."); - } + if (codeJson) { + populateObject(data, codeJson); + } else { + console.error("Failed to retrieve JSON data."); + } - console.log("FINAL CODE JSON HERE", codeJson); - return codeJson; + console.log("FINAL CODE JSON HERE", codeJson); + return codeJson; } // Creates code.json and triggers file download -async function downloadFile(data){ - delete data.submit; - const codeJson = await populateCodeJson(data); +async function downloadFile(data) { + delete data.submit; + const codeJson = await populateCodeJson(data); - const jsonString = JSON.stringify(codeJson, null, 2); - const blob = new Blob([jsonString], { type: 'application/json' }); + const jsonString = JSON.stringify(codeJson, null, 2); + const blob = new Blob([jsonString], { type: "application/json" }); - // Create anchor element and create download link - const link = document.createElement('a'); - link.href = URL.createObjectURL(blob); - link.download = "code.json"; + // Create anchor element and create download link + const link = document.createElement("a"); + link.href = URL.createObjectURL(blob); + link.download = "code.json"; - // Trigger the download - link.click(); + // Trigger the download + link.click(); } -window.downloadFile = downloadFile; \ No newline at end of file +window.downloadFile = downloadFile; diff --git a/js/generateFormComponents.js b/js/generateFormComponents.js index 41f394a..87bf090 100644 --- a/js/generateFormComponents.js +++ b/js/generateFormComponents.js @@ -1,70 +1,70 @@ // Retrieves file and returns as json object async function retrieveFile(filePath) { - try { - const response = await fetch(filePath); + try { + const response = await fetch(filePath); - // Check if the response is OK (status code 200) - if (!response.ok) { - throw new Error('Network response was not ok'); - } - // Return the parsed JSON content - return await response.json(); - } catch (error) { - console.error('There was a problem with the fetch operation:', error); - return null; - } + // Check if the response is OK (status code 200) + if (!response.ok) { + throw new Error("Network response was not ok"); + } + // Return the parsed JSON content + return await response.json(); + } catch (error) { + console.error("There was a problem with the fetch operation:", error); + return null; + } } // Creates Form.io component based on json fields // Supports text field for now // TODO: Create components for number, select, and multi-select function createComponent(fieldName, fieldObject) { - switch (fieldObject["type"]) { - case "string": - return { - type: "textfield", - key: fieldName, - label: fieldName, - input: true, - tooltip: fieldObject["description"], - description: fieldObject["description"] - }; - default: - break; - } + switch (fieldObject["type"]) { + case "string": + return { + type: "textfield", + key: fieldName, + label: fieldName, + input: true, + tooltip: fieldObject["description"], + description: fieldObject["description"], + }; + default: + break; + } } // Iterates through each json field and creates component array for Form.io async function createFormComponents() { - var components = []; - var formFields = {}; + var components = []; + var formFields = {}; - var filePath = "schemas/schema.json" - var jsonData = await retrieveFile(filePath) - console.log('JSON Data:', jsonData); + var filePath = "schemas/schema.json"; + var jsonData = await retrieveFile(filePath); + console.log("JSON Data:", jsonData); - formFields = jsonData["properties"]; - console.log('form Fields:', formFields); + formFields = jsonData["properties"]; + console.log("form Fields:", formFields); - for (const key in formFields) { - console.log(`${key}:`, formFields[key]); - var fieldComponent = createComponent(key, formFields[key]) - components.push(fieldComponent) - } + for (const key in formFields) { + console.log(`${key}:`, formFields[key]); + var fieldComponent = createComponent(key, formFields[key]); + components.push(fieldComponent); + } - // Add submit button to form - components.push({ - "type": "button", - "label": "Submit", - "key": "submit", - "disableOnInvalid": true, - "input": true, - "tableView": false - }) + // Add submit button to form + components.push({ + type: "button", + label: "Submit", + key: "submit", + disableOnInvalid: true, + input: true, + tableView: false, + }); - console.log(components) + console.log(components); - return components; + return components; } -window.createFormComponents = createFormComponents; \ No newline at end of file +window.createFormComponents = createFormComponents; diff --git a/schemas/schema.json b/schemas/schema.json index 9c3ab64..7d4e96d 100644 --- a/schemas/schema.json +++ b/schemas/schema.json @@ -1,16 +1,16 @@ { - "$schema": "http://json-schema.org/draft-04/schema#", - "title": "CMS Code.json Metadata", - "description": "A metadata standard for software repositories of CMS", - "type": "object", - "properties": { - "name": { - "type": "string", - "description": "Name of the project or software" - }, - "softwareDescription": { - "type": "string", - "description": "project description here" - } - } -} \ No newline at end of file + "$schema": "http://json-schema.org/draft-04/schema#", + "title": "CMS Code.json Metadata", + "description": "A metadata standard for software repositories of CMS", + "type": "object", + "properties": { + "name": { + "type": "string", + "description": "Name of the project or software" + }, + "softwareDescription": { + "type": "string", + "description": "project description here" + } + } +} diff --git a/schemas/template-code.json b/schemas/template-code.json index f22a64b..5148921 100644 --- a/schemas/template-code.json +++ b/schemas/template-code.json @@ -1,4 +1,4 @@ { - "name": "", - "softwareDescription": "" -} \ No newline at end of file + "name": "", + "softwareDescription": "" +} From db918f040457603f35994b7b282f596faae770c5 Mon Sep 17 00:00:00 2001 From: Natalia Luzuriaga Date: Tue, 3 Dec 2024 14:21:06 -0800 Subject: [PATCH 7/7] Updated variables Signed-off-by: Natalia Luzuriaga --- js/formDataToJson.js | 2 +- js/generateFormComponents.js | 8 ++++---- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/js/formDataToJson.js b/js/formDataToJson.js index 1615095..bb2ed4b 100644 --- a/js/formDataToJson.js +++ b/js/formDataToJson.js @@ -36,7 +36,7 @@ async function populateCodeJson(data) { // Path to the blank json file const filePath = "schemas/template-code.json"; - var codeJson = await retrieveFile(filePath); + let codeJson = await retrieveFile(filePath); if (codeJson) { populateObject(data, codeJson); diff --git a/js/generateFormComponents.js b/js/generateFormComponents.js index 87bf090..d6e91e6 100644 --- a/js/generateFormComponents.js +++ b/js/generateFormComponents.js @@ -36,11 +36,11 @@ function createComponent(fieldName, fieldObject) { // Iterates through each json field and creates component array for Form.io async function createFormComponents() { - var components = []; - var formFields = {}; + let components = []; + let formFields = {}; - var filePath = "schemas/schema.json"; - var jsonData = await retrieveFile(filePath); + const filePath = "schemas/schema.json"; + let jsonData = await retrieveFile(filePath); console.log("JSON Data:", jsonData); formFields = jsonData["properties"];