Skip to content

Commit f6b377e

Browse files
Added code formatting
Signed-off-by: Natalia Luzuriaga <[email protected]>
1 parent bbf9e68 commit f6b377e

File tree

5 files changed

+169
-163
lines changed

5 files changed

+169
-163
lines changed

form.html

Lines changed: 55 additions & 49 deletions
Original file line numberDiff line numberDiff line change
@@ -1,52 +1,58 @@
11
<html>
2-
<head>
3-
<!-- USWDS not working -->
4-
<!-- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"> -->
5-
<!-- <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"> -->
6-
<!-- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/uswds/2.11.2/css/uswds.min.css"> -->
7-
<!-- <link rel="stylesheet" href="https://cdn.form.io/formiojs/formio.form.min.css"> -->
8-
<!-- <link rel="stylesheet" href="https://cdn.form.io/uswds/uswds.min.css"> -->
9-
<!-- <link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/formio.full.min.css"> -->
10-
<!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/uswds/2.11.2/js/uswds.min.js"></script> -->
11-
<!-- <script src="https://cdn.form.io/formiojs/formio.form.min.js"></script> -->
12-
<!-- <script src="https://cdn.form.io/uswds/uswds.min.js"></script> -->
13-
<!-- <script src="https://cdn.form.io/formiojs/formio.full.js"></script> -->
14-
<!-- <script src="https://cdn.form.io/js/formio.embed.js"></script> -->
2+
<head>
3+
<!-- USWDS not working -->
4+
<!-- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"> -->
5+
<!-- <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"> -->
6+
<!-- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/uswds/2.11.2/css/uswds.min.css"> -->
7+
<!-- <link rel="stylesheet" href="https://cdn.form.io/formiojs/formio.form.min.css"> -->
8+
<!-- <link rel="stylesheet" href="https://cdn.form.io/uswds/uswds.min.css"> -->
9+
<!-- <link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/formio.full.min.css"> -->
10+
<!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/uswds/2.11.2/js/uswds.min.js"></script> -->
11+
<!-- <script src="https://cdn.form.io/formiojs/formio.form.min.js"></script> -->
12+
<!-- <script src="https://cdn.form.io/uswds/uswds.min.js"></script> -->
13+
<!-- <script src="https://cdn.form.io/formiojs/formio.full.js"></script> -->
14+
<!-- <script src="https://cdn.form.io/js/formio.embed.js"></script> -->
1515

16-
<!-- Uses bootstrap for now -->
17-
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons/font/bootstrap-icons.css">
18-
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap/dist/css/bootstrap.min.css">
16+
<!-- Uses bootstrap for now -->
17+
<link
18+
rel="stylesheet"
19+
href="https://cdn.jsdelivr.net/npm/bootstrap-icons/font/bootstrap-icons.css"
20+
/>
21+
<link
22+
rel="stylesheet"
23+
href="https://cdn.jsdelivr.net/npm/bootstrap/dist/css/bootstrap.min.css"
24+
/>
1925

20-
<!-- Working Form.io CDN -->
21-
<script src="https://unpkg.com/[email protected]/dist/formio.full.min.js"></script>
22-
</head>
23-
<body>
24-
<div id="formio"></div>
25-
<script src="js/generateFormComponents.js"></script>
26-
<script src="js/formDataToJson.js"></script>
27-
<script type="text/javascript">
28-
createFormComponents().then(components => {
29-
Formio.createForm(document.getElementById('formio'), {
30-
"display": "form",
31-
"theme": "primary",
32-
"settings": {
33-
"pdf": {
34-
"id": "1ec0f8ee-6685-5d98-a847-26f67b67d6f0",
35-
"src": "https://files.form.io/pdf/5692b91fd1028f01000407e3/file/1ec0f8ee-6685-5d98-a847-26f67b67d6f0"
36-
}
37-
},
38-
"components": components
39-
})
40-
.then(function(form) {
41-
form.on('submit', function(submission) {
42-
console.log("form submission here:", submission);
43-
downloadFile(submission.data);
44-
});
45-
})
46-
})
47-
.catch(error => {
48-
console.error("Error creating components:", error);
49-
});
50-
</script>
51-
</body>
52-
</html>
26+
<!-- Working Form.io CDN -->
27+
<script src="https://unpkg.com/[email protected]/dist/formio.full.min.js"></script>
28+
</head>
29+
<body>
30+
<div id="formio"></div>
31+
<script src="js/generateFormComponents.js"></script>
32+
<script src="js/formDataToJson.js"></script>
33+
<script type="text/javascript">
34+
createFormComponents()
35+
.then((components) => {
36+
Formio.createForm(document.getElementById("formio"), {
37+
display: "form",
38+
theme: "primary",
39+
settings: {
40+
pdf: {
41+
id: "1ec0f8ee-6685-5d98-a847-26f67b67d6f0",
42+
src: "https://files.form.io/pdf/5692b91fd1028f01000407e3/file/1ec0f8ee-6685-5d98-a847-26f67b67d6f0",
43+
},
44+
},
45+
components: components,
46+
}).then(function (form) {
47+
form.on("submit", function (submission) {
48+
console.log("form submission here:", submission);
49+
downloadFile(submission.data);
50+
});
51+
});
52+
})
53+
.catch((error) => {
54+
console.error("Error creating components:", error);
55+
});
56+
</script>
57+
</body>
58+
</html>

js/formDataToJson.js

Lines changed: 47 additions & 47 deletions
Original file line numberDiff line numberDiff line change
@@ -1,68 +1,68 @@
11
// Retrieves file and returns as json object
22
async function retrieveFile(filePath) {
3-
try {
4-
const response = await fetch(filePath);
3+
try {
4+
const response = await fetch(filePath);
55

6-
if (!response.ok) {
7-
throw new Error('Network response was not ok');
8-
}
9-
// Returns file contents in a json format
10-
return await response.json();
11-
} catch (error) {
12-
console.error('There was a problem with the fetch operation:', error);
13-
return null;
14-
}
6+
if (!response.ok) {
7+
throw new Error("Network response was not ok");
8+
}
9+
// Returns file contents in a json format
10+
return await response.json();
11+
} catch (error) {
12+
console.error("There was a problem with the fetch operation:", error);
13+
return null;
14+
}
1515
}
1616

1717
// Populates blank code.json object with values from form
1818
function populateObject(data, blankObject) {
19-
for (let key in data) {
20-
console.log("current key", key)
21-
console.log("check if value exists", data.hasOwnProperty(key))
22-
if (blankObject.hasOwnProperty(key)) {
23-
if (typeof data[key] === 'object' && data[key] !== null) {
24-
// If object, recursively populate
25-
// TODO: test out for permissions and description objects
26-
populateObject(data[key], blankObject[key]);
27-
} else {
28-
// Add value
29-
blankObject[key] = data[key];
30-
}
31-
}
32-
}
19+
for (let key in data) {
20+
console.log("current key", key);
21+
console.log("check if value exists", data.hasOwnProperty(key));
22+
if (blankObject.hasOwnProperty(key)) {
23+
if (typeof data[key] === "object" && data[key] !== null) {
24+
// If object, recursively populate
25+
// TODO: test out for permissions and description objects
26+
populateObject(data[key], blankObject[key]);
27+
} else {
28+
// Add value
29+
blankObject[key] = data[key];
30+
}
31+
}
32+
}
3333
}
3434

3535
async function populateCodeJson(data) {
36-
// Path to the blank json file
37-
const filePath = 'schemas/template-code.json';
36+
// Path to the blank json file
37+
const filePath = "schemas/template-code.json";
3838

39-
var codeJson = await retrieveFile(filePath);
39+
var codeJson = await retrieveFile(filePath);
4040

41-
if (codeJson) {
42-
populateObject(data, codeJson);
43-
} else {
44-
console.error("Failed to retrieve JSON data.");
45-
}
41+
if (codeJson) {
42+
populateObject(data, codeJson);
43+
} else {
44+
console.error("Failed to retrieve JSON data.");
45+
}
4646

47-
console.log("FINAL CODE JSON HERE", codeJson);
48-
return codeJson;
47+
console.log("FINAL CODE JSON HERE", codeJson);
48+
return codeJson;
4949
}
5050

5151
// Creates code.json and triggers file download
52-
async function downloadFile(data){
53-
delete data.submit;
54-
const codeJson = await populateCodeJson(data);
52+
async function downloadFile(data) {
53+
delete data.submit;
54+
const codeJson = await populateCodeJson(data);
5555

56-
const jsonString = JSON.stringify(codeJson, null, 2);
57-
const blob = new Blob([jsonString], { type: 'application/json' });
56+
const jsonString = JSON.stringify(codeJson, null, 2);
57+
const blob = new Blob([jsonString], { type: "application/json" });
5858

59-
// Create anchor element and create download link
60-
const link = document.createElement('a');
61-
link.href = URL.createObjectURL(blob);
62-
link.download = "code.json";
59+
// Create anchor element and create download link
60+
const link = document.createElement("a");
61+
link.href = URL.createObjectURL(blob);
62+
link.download = "code.json";
6363

64-
// Trigger the download
65-
link.click();
64+
// Trigger the download
65+
link.click();
6666
}
6767

68-
window.downloadFile = downloadFile;
68+
window.downloadFile = downloadFile;

js/generateFormComponents.js

Lines changed: 49 additions & 49 deletions
Original file line numberDiff line numberDiff line change
@@ -1,70 +1,70 @@
11
// Retrieves file and returns as json object
22
async function retrieveFile(filePath) {
3-
try {
4-
const response = await fetch(filePath);
3+
try {
4+
const response = await fetch(filePath);
55

6-
// Check if the response is OK (status code 200)
7-
if (!response.ok) {
8-
throw new Error('Network response was not ok');
9-
}
10-
// Return the parsed JSON content
11-
return await response.json();
12-
} catch (error) {
13-
console.error('There was a problem with the fetch operation:', error);
14-
return null;
15-
}
6+
// Check if the response is OK (status code 200)
7+
if (!response.ok) {
8+
throw new Error("Network response was not ok");
9+
}
10+
// Return the parsed JSON content
11+
return await response.json();
12+
} catch (error) {
13+
console.error("There was a problem with the fetch operation:", error);
14+
return null;
15+
}
1616
}
1717

1818
// Creates Form.io component based on json fields
1919
// Supports text field for now
2020
// TODO: Create components for number, select, and multi-select
2121
function createComponent(fieldName, fieldObject) {
22-
switch (fieldObject["type"]) {
23-
case "string":
24-
return {
25-
type: "textfield",
26-
key: fieldName,
27-
label: fieldName,
28-
input: true,
29-
tooltip: fieldObject["description"],
30-
description: fieldObject["description"]
31-
};
32-
default:
33-
break;
34-
}
22+
switch (fieldObject["type"]) {
23+
case "string":
24+
return {
25+
type: "textfield",
26+
key: fieldName,
27+
label: fieldName,
28+
input: true,
29+
tooltip: fieldObject["description"],
30+
description: fieldObject["description"],
31+
};
32+
default:
33+
break;
34+
}
3535
}
3636

3737
// Iterates through each json field and creates component array for Form.io
3838
async function createFormComponents() {
39-
var components = [];
40-
var formFields = {};
39+
var components = [];
40+
var formFields = {};
4141

42-
var filePath = "schemas/schema.json"
43-
var jsonData = await retrieveFile(filePath)
44-
console.log('JSON Data:', jsonData);
42+
var filePath = "schemas/schema.json";
43+
var jsonData = await retrieveFile(filePath);
44+
console.log("JSON Data:", jsonData);
4545

46-
formFields = jsonData["properties"];
47-
console.log('form Fields:', formFields);
46+
formFields = jsonData["properties"];
47+
console.log("form Fields:", formFields);
4848

49-
for (const key in formFields) {
50-
console.log(`${key}:`, formFields[key]);
51-
var fieldComponent = createComponent(key, formFields[key])
52-
components.push(fieldComponent)
53-
}
49+
for (const key in formFields) {
50+
console.log(`${key}:`, formFields[key]);
51+
var fieldComponent = createComponent(key, formFields[key]);
52+
components.push(fieldComponent);
53+
}
5454

55-
// Add submit button to form
56-
components.push({
57-
"type": "button",
58-
"label": "Submit",
59-
"key": "submit",
60-
"disableOnInvalid": true,
61-
"input": true,
62-
"tableView": false
63-
})
55+
// Add submit button to form
56+
components.push({
57+
type: "button",
58+
label: "Submit",
59+
key: "submit",
60+
disableOnInvalid: true,
61+
input: true,
62+
tableView: false,
63+
});
6464

65-
console.log(components)
65+
console.log(components);
6666

67-
return components;
67+
return components;
6868
}
6969

70-
window.createFormComponents = createFormComponents;
70+
window.createFormComponents = createFormComponents;

schemas/schema.json

Lines changed: 15 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,16 @@
11
{
2-
"$schema": "http://json-schema.org/draft-04/schema#",
3-
"title": "CMS Code.json Metadata",
4-
"description": "A metadata standard for software repositories of CMS",
5-
"type": "object",
6-
"properties": {
7-
"name": {
8-
"type": "string",
9-
"description": "Name of the project or software"
10-
},
11-
"softwareDescription": {
12-
"type": "string",
13-
"description": "project description here"
14-
}
15-
}
16-
}
2+
"$schema": "http://json-schema.org/draft-04/schema#",
3+
"title": "CMS Code.json Metadata",
4+
"description": "A metadata standard for software repositories of CMS",
5+
"type": "object",
6+
"properties": {
7+
"name": {
8+
"type": "string",
9+
"description": "Name of the project or software"
10+
},
11+
"softwareDescription": {
12+
"type": "string",
13+
"description": "project description here"
14+
}
15+
}
16+
}

schemas/template-code.json

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
11
{
2-
"name": "",
3-
"softwareDescription": ""
4-
}
2+
"name": "",
3+
"softwareDescription": ""
4+
}

0 commit comments

Comments
 (0)