Dynamic Workflows in Frontend

This commit is contained in:
Felix Kaspar 2023-11-07 02:20:44 +01:00
parent 608b1cbe4d
commit 48f0c24886
2 changed files with 35 additions and 13 deletions

View File

@ -17,19 +17,17 @@
</head> </head>
<body> <body>
<input type="file" id="pdfFile" accept=".pdf" multiple> <input type="file" id="pdfFile" accept=".pdf" multiple>
<br>
<ul id="operations">
<br>
</ul> <textarea name="workflow" id="workflow" cols="30" rows="10"></textarea>
<br>
<select id="pdfOptions"> <select id="pdfOptions">
<option value="scaleContent">Scale Content</option>
<option value="changePageSize">Change Page Size</option>
<option value="mergePDFs">Merge PDFs</option>
<option value="splitPDFs">Split PDFs</option>
</select> </select>
<button id="addButton">Add</button> <button id="loadButton">Load</button>
<br>
<br>
<button id="doneButton">Done</button> <button id="doneButton">Done</button>
</body> </body>
</html> </html>

View File

@ -4,7 +4,28 @@ import * as exampleWorkflows from "./exampleWorkflows.js";
import { traverseOperations } from "./traverseOperations.js"; import { traverseOperations } from "./traverseOperations.js";
import * as Functions from "./functions.js"; import * as Functions from "./functions.js";
(async (workflow) => { (async () => {
const workflowField = document.getElementById("workflow");
const dropdown = document.getElementById("pdfOptions");
// Clear existing options (if any)
dropdown.innerHTML = '';
console.log(exampleWorkflows);
// Iterate over the keys of the object and create an option for each key
for (const key in exampleWorkflows) {
const option = document.createElement('option');
option.value = key;
option.text = key;
dropdown.appendChild(option);
}
const loadButton = document.getElementById("loadButton");
loadButton.addEventListener("click", (e) => {
workflowField.value = JSON.stringify(exampleWorkflows[dropdown.value], null, 2);
});
loadButton.click();
const pdfFileInput = document.getElementById('pdfFile'); const pdfFileInput = document.getElementById('pdfFile');
const doneButton = document.getElementById("doneButton"); const doneButton = document.getElementById("doneButton");
@ -21,6 +42,8 @@ import * as Functions from "./functions.js";
})); }));
console.log(inputs); console.log(inputs);
const workflow = JSON.parse(workflowField.value);
console.log(workflow);
const traverse = traverseOperations(workflow.operations, inputs, Functions); const traverse = traverseOperations(workflow.operations, inputs, Functions);
let pdfResults; let pdfResults;
@ -35,8 +58,9 @@ import * as Functions from "./functions.js";
console.log(`data: ${iteration.value}\n\n`); console.log(`data: ${iteration.value}\n\n`);
} }
// TODO: Zip if wanted
pdfResults.forEach(result => { pdfResults.forEach(result => {
download(result.buffer, result.fileName, "application/pdf"); download(result.buffer, result.fileName, "application/pdf");
}); });
}); });
})(exampleWorkflows.splitOnQR); })();