refactor: normalize files
This commit is contained in:
@@ -1,254 +1,254 @@
|
||||
<!DOCTYPE html>
|
||||
<html th:lang="${#locale.toString()}"
|
||||
th:lang-direction="#{language.direction}"
|
||||
xmlns:th="http://www.thymeleaf.org">
|
||||
|
||||
<th:block
|
||||
th:insert="~{fragments/common :: head(title=#{pipeline.title}, header=#{pipeline.header})}"></th:block>
|
||||
|
||||
<style>
|
||||
.btn-margin {
|
||||
margin-right: 2px;
|
||||
}
|
||||
|
||||
.bordered-box {
|
||||
border: 1px solid #ddd;
|
||||
padding: 20px;
|
||||
margin: 20px;
|
||||
width: 70%;
|
||||
}
|
||||
|
||||
.center-element {
|
||||
width: 80%;
|
||||
text-align: center;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.element-margin {
|
||||
margin: 10px 0;
|
||||
/* Adjust this value to increase/decrease the margin as needed */
|
||||
}
|
||||
</style>
|
||||
|
||||
<script th:inline="javascript">
|
||||
const saveSettings = /*[[#{pipelineOptions.saveSettings}]]*/ '';
|
||||
</script>
|
||||
|
||||
<body>
|
||||
<div id="page-container">
|
||||
<div id="content-wrap">
|
||||
<div th:insert="~{fragments/navbar.html :: navbar}"></div>
|
||||
|
||||
<br> <br>
|
||||
<div class="container">
|
||||
<div class="row justify-content-center">
|
||||
|
||||
<h1 th:text="#{pipeline.header}"></h1>
|
||||
<h2 th:text="#{WorkInProgess}"> </h2>
|
||||
<div class="bordered-box">
|
||||
<div class="text-end text-top">
|
||||
<button id="uploadPipelineBtn" class="btn btn-primary"
|
||||
th:text="#{pipeline.uploadButton}"></button>
|
||||
<button type="button" class="btn btn-primary"
|
||||
data-bs-toggle="modal" data-bs-target="#pipelineSettingsModal"
|
||||
th:text="#{pipeline.configureButton}"></button>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="center-element">
|
||||
<div class="element-margin">
|
||||
<select id="pipelineSelect" class="custom-select">
|
||||
<option
|
||||
value="{"name":"Custom","pipeline":[],"_examples":{"outputDir":"{outputFolder}/{folderName}","outputFileName":"{filename}-{pipelineName}-{date}-{time}"},"outputDir":"{outputFolder}","outputFileName":"{filename}"}"
|
||||
th:text="#{pipeline.defaultOption}"></option>
|
||||
|
||||
|
||||
<th:block th:each="config : ${pipelineConfigsWithNames}">
|
||||
<option th:value="${config.json}" th:text="${config.name}"></option>
|
||||
</th:block>
|
||||
</select>
|
||||
</div>
|
||||
<div class="element-margin">
|
||||
<div
|
||||
th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=true)}"></div>
|
||||
</div>
|
||||
<div class="element-margin">
|
||||
<button class="btn btn-primary" id="submitConfigBtn"
|
||||
th:text="#{pipeline.submitButton}"></button>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<p>Below info is Alpha only, will be removed and hence not translated</p>
|
||||
<h3>Current Limitations</h3>
|
||||
<ul>
|
||||
<li>Cannot have more than one of the same operation</li>
|
||||
<li>Cannot input additional files via UI</li>
|
||||
<li>All files and operations run in serial mode</li>
|
||||
</ul>
|
||||
|
||||
<h3>How it Works Notes</h3>
|
||||
<ul>
|
||||
<li>Configure the pipeline config file and input files to run
|
||||
files against it</li>
|
||||
<li>For reuse, download the config file and re-upload it when
|
||||
needed, or place it in /pipeline/defaultWebUIConfigs/ to
|
||||
auto-load in the web UI for all users</li>
|
||||
</ul>
|
||||
|
||||
<h3>How to use pre-load configs in web UI</h3>
|
||||
<ul>
|
||||
<li>Download config files</li>
|
||||
<li>For reuse, download the config file and re-upload it when
|
||||
needed, or place it in /pipeline/defaultWebUIConfigs/ to
|
||||
auto-load in the web UI for all users</li>
|
||||
</ul>
|
||||
|
||||
<h3>Todo</h3>
|
||||
<ul>
|
||||
<li>Save to browser/Account</li>
|
||||
<li>offline folder scan mode checks and testing for unique usecases</li>
|
||||
<li>Improve operation config settings UI</li>
|
||||
</ul>
|
||||
|
||||
|
||||
<h2>User Guide for Local Directory Scanning and File
|
||||
Processing</h2>
|
||||
|
||||
<h3>Setting Up Watched Folders:</h3>
|
||||
<p>Create a folder where you want your files to be monitored.
|
||||
This is your 'watched folder'.</p>
|
||||
<p>
|
||||
The default directory for this is
|
||||
<code>./pipeline/watchedFolders/</code>
|
||||
</p>
|
||||
<p>Place any directories you want to be scanned into this
|
||||
folder, this folder should contain multiple folders each for their
|
||||
own tasks and pipelines.</p>
|
||||
|
||||
<h3>Configuring Processing with JSON Files:</h3>
|
||||
<p>
|
||||
In each directory you want processed (e.g
|
||||
<code>./pipeline/watchedFolders/officePrinter</code>
|
||||
), include a JSON configuration file.
|
||||
</p>
|
||||
<p>This JSON file should specify how you want the files in the
|
||||
directory to be handled (e.g., what operations to perform on them)
|
||||
which can be made, configured and downloaded from Stirling-PDF
|
||||
Pipeline interface.</p>
|
||||
|
||||
<h3>Automatic Scanning and Processing:</h3>
|
||||
<p>The system automatically checks the watched folder every
|
||||
minute for new directories and files to process.</p>
|
||||
<p>When a directory with a valid JSON configuration file is
|
||||
found, it begins processing the files inside as per the
|
||||
configuration.</p>
|
||||
|
||||
<h3>Processing Steps:</h3>
|
||||
<p>Files in each directory are processed according to the
|
||||
instructions in the JSON file.</p>
|
||||
<p>This might involve file conversions, data filtering,
|
||||
renaming files, etc. If the output of a step is a zip, this zip
|
||||
will be automatically unzipped as it passes to next process.</p>
|
||||
|
||||
<h3>Results and Output:</h3>
|
||||
<p>
|
||||
After processing, the results are saved in a specified output
|
||||
location. This could be a different folder or location as defined
|
||||
in the JSON file or the default location
|
||||
<code>./pipeline/finishedFolders/</code>
|
||||
.
|
||||
</p>
|
||||
<p>Each processed file is named and organized according to the
|
||||
rules set in the JSON configuration.</p>
|
||||
|
||||
<h3>Completion and Cleanup:</h3>
|
||||
<p>Once processing is complete, the original files in the
|
||||
watched folder's directory are removed.</p>
|
||||
<p>You can find the processed files in the designated output
|
||||
location.</p>
|
||||
|
||||
<h3>Error Handling:</h3>
|
||||
<p>If there's an error during processing, the system will not
|
||||
delete the original files, allowing you to check and retry if
|
||||
necessary.</p>
|
||||
|
||||
<h3>User Interaction:</h3>
|
||||
<p>As a user, your main tasks are to set up the watched
|
||||
folders, place directories with files for processing, and create
|
||||
the corresponding JSON configuration files.</p>
|
||||
<p>The system handles the rest, including scanning, processing,
|
||||
and outputting results.</p>
|
||||
|
||||
|
||||
<!-- The Modal -->
|
||||
<div class="modal" id="pipelineSettingsModal">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content dark-card">
|
||||
|
||||
<!-- Modal Header -->
|
||||
<div class="modal-header">
|
||||
<h2 class="modal-title" th:text="#{pipelineOptions.header}"></h2>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal"
|
||||
aria-label="Close"></button>
|
||||
</div>
|
||||
|
||||
<!-- Modal body -->
|
||||
<div class="modal-body">
|
||||
<div class="mb-3">
|
||||
<label for="pipelineName" class="form-label"
|
||||
th:text="#{pipelineOptions.pipelineNameLabel}"></label> <input
|
||||
type="text" id="pipelineName" class="form-control"
|
||||
th:placeholder="#{pipelineOptions.pipelineNamePrompt}">
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="operationsDropdown" th:text="#{pipelineOptions.selectOperation}"></label>
|
||||
<select id="operationsDropdown" class="form-select">
|
||||
<!-- Options will be dynamically populated here -->
|
||||
</select>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<button id="addOperationBtn" class="btn btn-primary"
|
||||
th:text="#{pipelineOptions.addOperationButton}"></button>
|
||||
|
||||
</div>
|
||||
<h3 id="pipelineHeader" style="display: none;"
|
||||
th:text="#{pipelineOptions.pipelineHeader}"></h3>
|
||||
|
||||
<ol id="pipelineList" class="list-group">
|
||||
<!-- Pipeline operations will be dynamically populated here -->
|
||||
</ol>
|
||||
<div id="pipelineSettingsContent">
|
||||
<!-- pipelineSettings will be dynamically populated here -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Modal footer -->
|
||||
<div class="modal-footer">
|
||||
<button id="savePipelineBtn" class="btn btn-success"
|
||||
th:text="#{pipelineOptions.saveButton}"></button>
|
||||
<button id="validateButton" class="btn btn-success"
|
||||
th:text="#{pipelineOptions.validateButton}"></button>
|
||||
|
||||
<div class="btn-group">
|
||||
<input type="file" id="uploadPipelineInput" accept=".json"
|
||||
style="display: none;">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="js/pipeline.js"></script>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div th:insert="~{fragments/footer.html :: footer}"></div>
|
||||
</div>
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html th:lang="${#locale.toString()}"
|
||||
th:lang-direction="#{language.direction}"
|
||||
xmlns:th="http://www.thymeleaf.org">
|
||||
|
||||
<th:block
|
||||
th:insert="~{fragments/common :: head(title=#{pipeline.title}, header=#{pipeline.header})}"></th:block>
|
||||
<style>
|
||||
.btn-margin {
|
||||
margin-right: 2px;
|
||||
}
|
||||
|
||||
.bordered-box {
|
||||
border: 1px solid #ddd;
|
||||
padding: 20px;
|
||||
margin: 20px;
|
||||
width: 70%;
|
||||
}
|
||||
|
||||
.center-element {
|
||||
width: 80%;
|
||||
text-align: center;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.element-margin {
|
||||
margin: 10px 0;
|
||||
/* Adjust this value to increase/decrease the margin as needed */
|
||||
}
|
||||
</style>
|
||||
|
||||
<script th:inline="javascript">
|
||||
const saveSettings = /*[[#{pipelineOptions.saveSettings}]]*/ '';
|
||||
</script>
|
||||
|
||||
<body>
|
||||
<div id="page-container">
|
||||
<div id="content-wrap">
|
||||
<div th:insert="~{fragments/navbar.html :: navbar}"></div>
|
||||
|
||||
<br> <br>
|
||||
<div class="container">
|
||||
<div class="row justify-content-center">
|
||||
|
||||
<h1 th:text="#{pipeline.header}"></h1>
|
||||
<h2 th:text="#{WorkInProgess}"> </h2>
|
||||
<div class="bordered-box">
|
||||
<div class="text-end text-top">
|
||||
<button id="uploadPipelineBtn" class="btn btn-primary"
|
||||
th:text="#{pipeline.uploadButton}"></button>
|
||||
<button type="button" class="btn btn-primary"
|
||||
data-bs-toggle="modal" data-bs-target="#pipelineSettingsModal"
|
||||
th:text="#{pipeline.configureButton}"></button>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="center-element">
|
||||
<div class="element-margin">
|
||||
<select id="pipelineSelect" class="custom-select">
|
||||
<option
|
||||
value="{"name":"Custom","pipeline":[],"_examples":{"outputDir":"{outputFolder}/{folderName}","outputFileName":"{filename}-{pipelineName}-{date}-{time}"},"outputDir":"{outputFolder}","outputFileName":"{filename}"}"
|
||||
th:text="#{pipeline.defaultOption}"></option>
|
||||
|
||||
|
||||
<th:block th:each="config : ${pipelineConfigsWithNames}">
|
||||
<option th:value="${config.json}" th:text="${config.name}"></option>
|
||||
</th:block>
|
||||
</select>
|
||||
</div>
|
||||
<div class="element-margin">
|
||||
<div
|
||||
th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=true)}"></div>
|
||||
</div>
|
||||
<div class="element-margin">
|
||||
<button class="btn btn-primary" id="submitConfigBtn"
|
||||
th:text="#{pipeline.submitButton}"></button>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<p>Below info is Alpha only, will be removed and hence not translated</p>
|
||||
<h3>Current Limitations</h3>
|
||||
<ul>
|
||||
<li>Cannot have more than one of the same operation</li>
|
||||
<li>Cannot input additional files via UI</li>
|
||||
<li>All files and operations run in serial mode</li>
|
||||
</ul>
|
||||
|
||||
<h3>How it Works Notes</h3>
|
||||
<ul>
|
||||
<li>Configure the pipeline config file and input files to run
|
||||
files against it</li>
|
||||
<li>For reuse, download the config file and re-upload it when
|
||||
needed, or place it in /pipeline/defaultWebUIConfigs/ to
|
||||
auto-load in the web UI for all users</li>
|
||||
</ul>
|
||||
|
||||
<h3>How to use pre-load configs in web UI</h3>
|
||||
<ul>
|
||||
<li>Download config files</li>
|
||||
<li>For reuse, download the config file and re-upload it when
|
||||
needed, or place it in /pipeline/defaultWebUIConfigs/ to
|
||||
auto-load in the web UI for all users</li>
|
||||
</ul>
|
||||
|
||||
<h3>Todo</h3>
|
||||
<ul>
|
||||
<li>Save to browser/Account</li>
|
||||
<li>offline folder scan mode checks and testing for unique usecases</li>
|
||||
<li>Improve operation config settings UI</li>
|
||||
</ul>
|
||||
|
||||
|
||||
<h2>User Guide for Local Directory Scanning and File
|
||||
Processing</h2>
|
||||
|
||||
<h3>Setting Up Watched Folders:</h3>
|
||||
<p>Create a folder where you want your files to be monitored.
|
||||
This is your 'watched folder'.</p>
|
||||
<p>
|
||||
The default directory for this is
|
||||
<code>./pipeline/watchedFolders/</code>
|
||||
</p>
|
||||
<p>Place any directories you want to be scanned into this
|
||||
folder, this folder should contain multiple folders each for their
|
||||
own tasks and pipelines.</p>
|
||||
|
||||
<h3>Configuring Processing with JSON Files:</h3>
|
||||
<p>
|
||||
In each directory you want processed (e.g
|
||||
<code>./pipeline/watchedFolders/officePrinter</code>
|
||||
), include a JSON configuration file.
|
||||
</p>
|
||||
<p>This JSON file should specify how you want the files in the
|
||||
directory to be handled (e.g., what operations to perform on them)
|
||||
which can be made, configured and downloaded from Stirling-PDF
|
||||
Pipeline interface.</p>
|
||||
|
||||
<h3>Automatic Scanning and Processing:</h3>
|
||||
<p>The system automatically checks the watched folder every
|
||||
minute for new directories and files to process.</p>
|
||||
<p>When a directory with a valid JSON configuration file is
|
||||
found, it begins processing the files inside as per the
|
||||
configuration.</p>
|
||||
|
||||
<h3>Processing Steps:</h3>
|
||||
<p>Files in each directory are processed according to the
|
||||
instructions in the JSON file.</p>
|
||||
<p>This might involve file conversions, data filtering,
|
||||
renaming files, etc. If the output of a step is a zip, this zip
|
||||
will be automatically unzipped as it passes to next process.</p>
|
||||
|
||||
<h3>Results and Output:</h3>
|
||||
<p>
|
||||
After processing, the results are saved in a specified output
|
||||
location. This could be a different folder or location as defined
|
||||
in the JSON file or the default location
|
||||
<code>./pipeline/finishedFolders/</code>
|
||||
.
|
||||
</p>
|
||||
<p>Each processed file is named and organized according to the
|
||||
rules set in the JSON configuration.</p>
|
||||
|
||||
<h3>Completion and Cleanup:</h3>
|
||||
<p>Once processing is complete, the original files in the
|
||||
watched folder's directory are removed.</p>
|
||||
<p>You can find the processed files in the designated output
|
||||
location.</p>
|
||||
|
||||
<h3>Error Handling:</h3>
|
||||
<p>If there's an error during processing, the system will not
|
||||
delete the original files, allowing you to check and retry if
|
||||
necessary.</p>
|
||||
|
||||
<h3>User Interaction:</h3>
|
||||
<p>As a user, your main tasks are to set up the watched
|
||||
folders, place directories with files for processing, and create
|
||||
the corresponding JSON configuration files.</p>
|
||||
<p>The system handles the rest, including scanning, processing,
|
||||
and outputting results.</p>
|
||||
|
||||
|
||||
<!-- The Modal -->
|
||||
<div class="modal" id="pipelineSettingsModal">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content dark-card">
|
||||
|
||||
<!-- Modal Header -->
|
||||
<div class="modal-header">
|
||||
<h2 class="modal-title" th:text="#{pipelineOptions.header}"></h2>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal"
|
||||
aria-label="Close"></button>
|
||||
</div>
|
||||
|
||||
<!-- Modal body -->
|
||||
<div class="modal-body">
|
||||
<div class="mb-3">
|
||||
<label for="pipelineName" class="form-label"
|
||||
th:text="#{pipelineOptions.pipelineNameLabel}"></label> <input
|
||||
type="text" id="pipelineName" class="form-control"
|
||||
th:placeholder="#{pipelineOptions.pipelineNamePrompt}">
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="operationsDropdown" th:text="#{pipelineOptions.selectOperation}"></label>
|
||||
<select id="operationsDropdown" class="form-select">
|
||||
<!-- Options will be dynamically populated here -->
|
||||
</select>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<button id="addOperationBtn" class="btn btn-primary"
|
||||
th:text="#{pipelineOptions.addOperationButton}"></button>
|
||||
|
||||
</div>
|
||||
<h3 id="pipelineHeader" style="display: none;"
|
||||
th:text="#{pipelineOptions.pipelineHeader}"></h3>
|
||||
|
||||
<ol id="pipelineList" class="list-group">
|
||||
<!-- Pipeline operations will be dynamically populated here -->
|
||||
</ol>
|
||||
<div id="pipelineSettingsContent">
|
||||
<!-- pipelineSettings will be dynamically populated here -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Modal footer -->
|
||||
<div class="modal-footer">
|
||||
<button id="savePipelineBtn" class="btn btn-success"
|
||||
th:text="#{pipelineOptions.saveButton}"></button>
|
||||
<button id="validateButton" class="btn btn-success"
|
||||
th:text="#{pipelineOptions.validateButton}"></button>
|
||||
|
||||
<div class="btn-group">
|
||||
<input type="file" id="uploadPipelineInput" accept=".json"
|
||||
style="display: none;">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="js/pipeline.js"></script>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div th:insert="~{fragments/footer.html :: footer}"></div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user