add simple split and merge option
This commit is contained in:
parent
b8a34dd2a7
commit
53c7cb1db3
14
app.py
14
app.py
|
@ -28,12 +28,17 @@ app.config['UPLOAD_FOLDER'] = 'uploads'
|
||||||
|
|
||||||
@app.route('/')
|
@app.route('/')
|
||||||
def index():
|
def index():
|
||||||
|
return redirect("/split", code=302)
|
||||||
|
|
||||||
|
|
||||||
|
@app.route('/project')
|
||||||
|
def project():
|
||||||
return render_template('base.html', page='project', settings='set', error=False)
|
return render_template('base.html', page='project', settings='set', error=False)
|
||||||
|
|
||||||
|
|
||||||
@app.route('/splitt')
|
@app.route('/split')
|
||||||
def splitt():
|
def splitt():
|
||||||
return render_template('base.html', page='splitt', settings='set', error=False)
|
return render_template('base.html', page='split', settings='set', error=False)
|
||||||
|
|
||||||
|
|
||||||
@app.route('/merge')
|
@app.route('/merge')
|
||||||
|
@ -46,11 +51,6 @@ def ocr():
|
||||||
return render_template('base.html', page='ocr', settings='set', error=False)
|
return render_template('base.html', page='ocr', settings='set', error=False)
|
||||||
|
|
||||||
|
|
||||||
@app.route('/app/')
|
|
||||||
def pdf_app():
|
|
||||||
return render_template('app.html')
|
|
||||||
|
|
||||||
|
|
||||||
@app.route('/split/<path:path>')
|
@app.route('/split/<path:path>')
|
||||||
def send_report(path):
|
def send_report(path):
|
||||||
return send_from_directory('split', path)
|
return send_from_directory('split', path)
|
||||||
|
|
|
@ -1,36 +0,0 @@
|
||||||
div {
|
|
||||||
/* border: 2px solid yellowgreen; */
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
.div_float_clear {
|
|
||||||
clear: both;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/* The snackbar - position it at the bottom and in the middle of the screen */
|
|
||||||
#snackbar {
|
|
||||||
visibility: hidden; /* Hidden by default. Visible on click */
|
|
||||||
min-width: 800px; /* Set a default minimum width */
|
|
||||||
margin-left: -400px; /* Divide value of min-width by 2 */
|
|
||||||
background-color: #333; /* Black background color */
|
|
||||||
color: #fff; /* White text color */
|
|
||||||
text-align: center; /* Centered text */
|
|
||||||
border-radius: 2px; /* Rounded borders */
|
|
||||||
padding: 16px; /* Padding */
|
|
||||||
position: fixed; /* Sit on top of the screen */
|
|
||||||
z-index: 1; /* Add a z-index if needed */
|
|
||||||
left: 50%; /* Center the snackbar */
|
|
||||||
bottom: 30px; /* 30px from the bottom */
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Show the snackbar when clicking on a button (class added with JavaScript) */
|
|
||||||
#snackbar.show {
|
|
||||||
visibility: visible; /* Show the snackbar */
|
|
||||||
/* Add animation: Take 0.5 seconds to fade in and out the snackbar.
|
|
||||||
However, delay the fade out process for 2.5 seconds */
|
|
||||||
/*
|
|
||||||
-webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
|
|
||||||
animation: fadein 0.5s, fadeout 0.5s 2.5s;
|
|
||||||
*/
|
|
||||||
}
|
|
|
@ -0,0 +1,36 @@
|
||||||
|
.div_float_clear {
|
||||||
|
clear: both;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* The snackbar - position it at the bottom and in the middle of the screen */
|
||||||
|
#snackbar {
|
||||||
|
visibility: hidden; /* Hidden by default. Visible on click */
|
||||||
|
min-width: 800px; /* Set a default minimum width */
|
||||||
|
margin-left: -400px; /* Divide value of min-width by 2 */
|
||||||
|
background-color: #333; /* Black background color */
|
||||||
|
color: #fff; /* White text color */
|
||||||
|
text-align: center; /* Centered text */
|
||||||
|
border-radius: 2px; /* Rounded borders */
|
||||||
|
padding: 16px; /* Padding */
|
||||||
|
position: fixed; /* Sit on top of the screen */
|
||||||
|
z-index: 1; /* Add a z-index if needed */
|
||||||
|
left: 50%; /* Center the snackbar */
|
||||||
|
bottom: 30px; /* 30px from the bottom */
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Show the snackbar when clicking on a button (class added with JavaScript) */
|
||||||
|
#snackbar.show {
|
||||||
|
visibility: visible; /* Show the snackbar */
|
||||||
|
/* Add animation: Take 0.5 seconds to fade in and out the snackbar.
|
||||||
|
However, delay the fade out process for 2.5 seconds */
|
||||||
|
/*
|
||||||
|
-webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
|
||||||
|
animation: fadein 0.5s, fadeout 0.5s 2.5s;
|
||||||
|
*/
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (min-width: 992px) {
|
||||||
|
.nav-item.active {
|
||||||
|
border-bottom: 1px solid var(--bs-nav-link-color);
|
||||||
|
}
|
||||||
|
}
|
|
@ -0,0 +1,9 @@
|
||||||
|
|
||||||
|
#btn-group-download {
|
||||||
|
width: 100%;
|
||||||
|
margin-top: 1em;
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
#btn_download_complete {
|
||||||
|
width: 100%;
|
||||||
|
}
|
|
@ -17,9 +17,6 @@
|
||||||
width: 500px;
|
width: 500px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
.pdf-interact-buttons {
|
|
||||||
padding-left: 1em;
|
|
||||||
}
|
|
||||||
|
|
||||||
#btn-group-download {
|
#btn-group-download {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|
|
@ -0,0 +1,9 @@
|
||||||
|
|
||||||
|
#btn-group-download {
|
||||||
|
width: 100%;
|
||||||
|
margin-top: 1em;
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
#btn_download_singel_pages {
|
||||||
|
width: 100%;
|
||||||
|
}
|
|
@ -0,0 +1,84 @@
|
||||||
|
/* eslint-disable new-cap */
|
||||||
|
/* eslint-disable camelcase */
|
||||||
|
/* eslint-disable no-console */
|
||||||
|
|
||||||
|
let uuid;
|
||||||
|
let pdf_uploaded = false;
|
||||||
|
import('./pdf_api_wrapper.js');
|
||||||
|
|
||||||
|
// eslint-disable-next-line no-undef, no-unused-vars
|
||||||
|
const vueInstance = new Vue({
|
||||||
|
el: '#app',
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
pdf_file: null,
|
||||||
|
project_uuid: null,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
window.addEventListener('load', () => this.side_loaded());
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
move_page(from_page, to_page) {
|
||||||
|
console.debug('trying to move page: ', from_page, to_page);
|
||||||
|
fetch(`/move_page/${this.project_uuid}/${from_page}/${to_page}`, {
|
||||||
|
method: 'GET',
|
||||||
|
})
|
||||||
|
.then((response) => response.json())
|
||||||
|
.then((data) => {
|
||||||
|
console.debug('data from Backend: ', data);
|
||||||
|
if (data.status === 200) {
|
||||||
|
this.display_pages();
|
||||||
|
console.info('Page was moved');
|
||||||
|
} else {
|
||||||
|
console.error('Page could not be moved');
|
||||||
|
}
|
||||||
|
})
|
||||||
|
.catch((error) => console.error(error));
|
||||||
|
},
|
||||||
|
side_loaded() {
|
||||||
|
document.getElementById('btn_download_complete').addEventListener('click', () => new pdf_api_wrapper(`${uuid}`).download_pdf());
|
||||||
|
|
||||||
|
fetch('/init_project/', {
|
||||||
|
method: 'GET',
|
||||||
|
})
|
||||||
|
.then((response) => response.json())
|
||||||
|
.then((data) => {
|
||||||
|
console.debug('data from Backend: ', data);
|
||||||
|
if (data.status === 200) {
|
||||||
|
this.project_uuid = data.project_uuid;
|
||||||
|
uuid = data.project_uuid;
|
||||||
|
} else {
|
||||||
|
this.project_uuid = null;
|
||||||
|
console.error('Project could not be created');
|
||||||
|
}
|
||||||
|
})
|
||||||
|
.catch((error) => console.error(error));
|
||||||
|
|
||||||
|
// Dropzone has been added as a global variable.
|
||||||
|
// eslint-disable-next-line no-undef
|
||||||
|
const dropzone = new Dropzone('div#pdf-dropzone', {
|
||||||
|
url: '/add_pdf_to_project/',
|
||||||
|
paramName: 'pdf',
|
||||||
|
});
|
||||||
|
|
||||||
|
dropzone.on('addedfile', (file) => {
|
||||||
|
console.log('A file has been added');
|
||||||
|
// eslint-disable-next-line no-param-reassign
|
||||||
|
file.previewElement.innerHTML = '';
|
||||||
|
console.debug('Suppress file.previewElement');
|
||||||
|
console.debug('PDF Project UUID: ', this.project_uuid);
|
||||||
|
});
|
||||||
|
|
||||||
|
dropzone.on('sending', (file, xhr, formData) => {
|
||||||
|
formData.append('uuid', uuid);
|
||||||
|
});
|
||||||
|
|
||||||
|
// eslint-disable-next-line no-unused-vars
|
||||||
|
dropzone.on('complete', (file, xhr, formData) => {
|
||||||
|
pdf_uploaded = true;
|
||||||
|
document.getElementById('btn-group-download').style.display = 'flex';
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
});
|
|
@ -4,7 +4,7 @@
|
||||||
|
|
||||||
let uuid;
|
let uuid;
|
||||||
let pdf_uploaded = false;
|
let pdf_uploaded = false;
|
||||||
import('./pdf_api_wrapper');
|
import('./pdf_api_wrapper.js');
|
||||||
|
|
||||||
// eslint-disable-next-line no-undef, no-unused-vars
|
// eslint-disable-next-line no-undef, no-unused-vars
|
||||||
const vueInstance = new Vue({
|
const vueInstance = new Vue({
|
||||||
|
|
|
@ -0,0 +1,84 @@
|
||||||
|
/* eslint-disable new-cap */
|
||||||
|
/* eslint-disable camelcase */
|
||||||
|
/* eslint-disable no-console */
|
||||||
|
|
||||||
|
let uuid;
|
||||||
|
let pdf_uploaded = false;
|
||||||
|
import('./pdf_api_wrapper.js');
|
||||||
|
|
||||||
|
// eslint-disable-next-line no-undef, no-unused-vars
|
||||||
|
const vueInstance = new Vue({
|
||||||
|
el: '#app',
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
pdf_file: null,
|
||||||
|
project_uuid: null,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
window.addEventListener('load', () => this.side_loaded());
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
move_page(from_page, to_page) {
|
||||||
|
console.debug('trying to move page: ', from_page, to_page);
|
||||||
|
fetch(`/move_page/${this.project_uuid}/${from_page}/${to_page}`, {
|
||||||
|
method: 'GET',
|
||||||
|
})
|
||||||
|
.then((response) => response.json())
|
||||||
|
.then((data) => {
|
||||||
|
console.debug('data from Backend: ', data);
|
||||||
|
if (data.status === 200) {
|
||||||
|
this.display_pages();
|
||||||
|
console.info('Page was moved');
|
||||||
|
} else {
|
||||||
|
console.error('Page could not be moved');
|
||||||
|
}
|
||||||
|
})
|
||||||
|
.catch((error) => console.error(error));
|
||||||
|
},
|
||||||
|
side_loaded() {
|
||||||
|
document.getElementById('btn_download_singel_pages').addEventListener('click', () => new pdf_api_wrapper(`${uuid}`).download_split_pdf());
|
||||||
|
|
||||||
|
fetch('/init_project/', {
|
||||||
|
method: 'GET',
|
||||||
|
})
|
||||||
|
.then((response) => response.json())
|
||||||
|
.then((data) => {
|
||||||
|
console.debug('data from Backend: ', data);
|
||||||
|
if (data.status === 200) {
|
||||||
|
this.project_uuid = data.project_uuid;
|
||||||
|
uuid = data.project_uuid;
|
||||||
|
} else {
|
||||||
|
this.project_uuid = null;
|
||||||
|
console.error('Project could not be created');
|
||||||
|
}
|
||||||
|
})
|
||||||
|
.catch((error) => console.error(error));
|
||||||
|
|
||||||
|
// Dropzone has been added as a global variable.
|
||||||
|
// eslint-disable-next-line no-undef
|
||||||
|
const dropzone = new Dropzone('div#pdf-dropzone', {
|
||||||
|
url: '/add_pdf_to_project/',
|
||||||
|
paramName: 'pdf',
|
||||||
|
});
|
||||||
|
|
||||||
|
dropzone.on('addedfile', (file) => {
|
||||||
|
console.log('A file has been added');
|
||||||
|
// eslint-disable-next-line no-param-reassign
|
||||||
|
file.previewElement.innerHTML = '';
|
||||||
|
console.debug('Suppress file.previewElement');
|
||||||
|
console.debug('PDF Project UUID: ', this.project_uuid);
|
||||||
|
});
|
||||||
|
|
||||||
|
dropzone.on('sending', (file, xhr, formData) => {
|
||||||
|
formData.append('uuid', uuid);
|
||||||
|
});
|
||||||
|
|
||||||
|
// eslint-disable-next-line no-unused-vars
|
||||||
|
dropzone.on('complete', (file, xhr, formData) => {
|
||||||
|
pdf_uploaded = true;
|
||||||
|
document.getElementById('btn-group-download').style.display = 'flex';
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
});
|
|
@ -1,164 +0,0 @@
|
||||||
<!DOCTYPE html>
|
|
||||||
<html lang="en">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
||||||
<link rel="shortcut icon" href="/static/icons/filetype-pdf.svg" type="image/x-icon">
|
|
||||||
<link rel="stylesheet" href="/static/css/styles.css">
|
|
||||||
<link rel="stylesheet" href="/static/css/styles_forms.css">
|
|
||||||
|
|
||||||
<!-- Dropzone -->
|
|
||||||
<script src="https://unpkg.com/dropzone@5/dist/min/dropzone.min.js"></script>
|
|
||||||
<link rel="stylesheet" href="https://unpkg.com/dropzone@5/dist/min/dropzone.min.css" type="text/css" />
|
|
||||||
|
|
||||||
<!-- Bootstrap -->
|
|
||||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css">
|
|
||||||
|
|
||||||
<title>PDF Web Toolkit</title>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
|
|
||||||
<div id="app">
|
|
||||||
<div id="div_content">
|
|
||||||
<div id="div_website_title">
|
|
||||||
<h1>PDF Web Toolkit</h1>
|
|
||||||
</div>
|
|
||||||
<div id="div_project_title">
|
|
||||||
<div class="form__group field">
|
|
||||||
<input id="project_title" class="form__field" type="text" @change="handleProjectTitleChange($event, 'project_title')" placeholder="Project Title" onfocus="document.getElementById('project_title').classList.remove('form__field_bad_input');"><br>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="div_float_clear"></div>
|
|
||||||
<div id="div_dropzone">
|
|
||||||
<div class="my-dropzone" id="pdf-dropzone">Drop pdf here or click to upload...</div>
|
|
||||||
<div class="dz-preview dz-file-preview well" id="preview-template"></div>
|
|
||||||
</div>
|
|
||||||
<div class="div_float_clear"></div>
|
|
||||||
<div id="page_overview">
|
|
||||||
<!-- Filled by dynamically loaded content -->
|
|
||||||
</div>
|
|
||||||
<div id="div_select_buttons">
|
|
||||||
<button class="button_export" id="button_download_complete_pdf" @click="download_pdf()">Download complete PDF</button>
|
|
||||||
<button class="button_export" id="button_download_individual_pages" @click="download_split_pdf()">Split PDF into individual pages</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<script src="https://cdn.jsdelivr.net/npm/vue@2"></script>
|
|
||||||
<script>
|
|
||||||
|
|
||||||
var uuid;
|
|
||||||
|
|
||||||
new Vue({
|
|
||||||
el: '#app',
|
|
||||||
data: {
|
|
||||||
pdf_file: null,
|
|
||||||
project_uuid: null
|
|
||||||
},
|
|
||||||
mounted(){
|
|
||||||
window.addEventListener("load", () => this.side_loaded());
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
downloadURI(uri, name) {
|
|
||||||
const link = document.createElement("a");
|
|
||||||
link.download = name;
|
|
||||||
link.href = uri;
|
|
||||||
document.body.appendChild(link);
|
|
||||||
link.click();
|
|
||||||
document.body.removeChild(link);
|
|
||||||
delete link;
|
|
||||||
},
|
|
||||||
download_pdf() {
|
|
||||||
this.downloadURI("/projects/" + this.project_uuid + "/complete.pdf", "complete_project.pdf");
|
|
||||||
},
|
|
||||||
download_split_pdf() {
|
|
||||||
fetch('/get_single_pages_archive/' + this.project_uuid + '/', {
|
|
||||||
method: 'GET'
|
|
||||||
})
|
|
||||||
.then(response => response.json())
|
|
||||||
.then(data => {
|
|
||||||
console.debug("data from Backend: ", data);
|
|
||||||
if (data["status"] == 200) {
|
|
||||||
this.downloadURI("/projects/" + this.project_uuid + "/pdf_splitted.zip", "splitted_pdfs.zip");
|
|
||||||
console.info("Archive with single Pages-PDFs created");
|
|
||||||
} else {
|
|
||||||
console.error("Project could not be created");
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.catch(error => console.error(error));
|
|
||||||
},
|
|
||||||
side_loaded() {
|
|
||||||
fetch('/init_project/', {
|
|
||||||
method: 'GET'
|
|
||||||
})
|
|
||||||
.then(response => response.json())
|
|
||||||
.then(data => {
|
|
||||||
console.debug("data from Backend: ", data);
|
|
||||||
if (data["status"] == 200) {
|
|
||||||
this.project_uuid = data["project_uuid"];
|
|
||||||
uuid = data["project_uuid"];
|
|
||||||
} else {
|
|
||||||
this.project_uuid = null;
|
|
||||||
console.error("Project could not be created");
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.catch(error => console.error(error));
|
|
||||||
|
|
||||||
// Dropzone has been added as a global variable.
|
|
||||||
const dropzone = new Dropzone("div#pdf-dropzone", {
|
|
||||||
url: "/add_pdf_to_project/",
|
|
||||||
paramName: "pdf"
|
|
||||||
});
|
|
||||||
|
|
||||||
dropzone.on("addedfile", file => {
|
|
||||||
// console.debug("on addedfile this...", this)
|
|
||||||
console.log("A file has been added");
|
|
||||||
file.previewElement.innerHTML = "";
|
|
||||||
console.debug("Suppress file.previewElement");
|
|
||||||
console.debug("PDF Project UUID: ", this.project_uuid);
|
|
||||||
});
|
|
||||||
|
|
||||||
dropzone.on("sending", function(file, xhr, formData) {
|
|
||||||
// console.debug("on sending this...", this)
|
|
||||||
// formData.append("uuid", this.project_uuid);
|
|
||||||
formData.append("uuid", uuid);
|
|
||||||
});
|
|
||||||
|
|
||||||
dropzone.on("complete", function(file, xhr, formData) {
|
|
||||||
div_overview = document.getElementById("page_overview");
|
|
||||||
div_overview.innerHTML = ""
|
|
||||||
console.debug("div_overview", div_overview);
|
|
||||||
|
|
||||||
fetch('/get_single_pages_info/' + uuid + '/', {
|
|
||||||
method: 'GET'
|
|
||||||
})
|
|
||||||
.then(response => response.json())
|
|
||||||
.then(data => {
|
|
||||||
console.debug("data from Backend: ", data);
|
|
||||||
if (data["status"] == 200) {
|
|
||||||
for (page in data["pages"]) {
|
|
||||||
console.debug(page);
|
|
||||||
// <embed src="" width="500" height="375" type="application/pdf">
|
|
||||||
node = document.createElement("embed");
|
|
||||||
node.width = "300";
|
|
||||||
node.height = "300";
|
|
||||||
node.type = "application/pdf";
|
|
||||||
node.src = data["pages"][page]
|
|
||||||
div_overview.appendChild(node)
|
|
||||||
}
|
|
||||||
console.debug(data["status"]);
|
|
||||||
} else {
|
|
||||||
console.debug(data["status"]);
|
|
||||||
console.error("Project could not be created");
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.catch(error => console.error(error));
|
|
||||||
console.debug("div_overview", div_overview);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
|
|
||||||
</body>
|
|
||||||
</html>
|
|
|
@ -8,18 +8,15 @@
|
||||||
<link rel="shortcut icon" href="{{ url_for('static', filename='img/filetype-pdf.svg') }}" type="image/x-icon">
|
<link rel="shortcut icon" href="{{ url_for('static', filename='img/filetype-pdf.svg') }}" type="image/x-icon">
|
||||||
<link href="{{ url_for('static', filename='css/bootstrap.min.css') }}" rel="stylesheet">
|
<link href="{{ url_for('static', filename='css/bootstrap.min.css') }}" rel="stylesheet">
|
||||||
<link href="{{ url_for('static', filename='css/main.css') }}" rel="stylesheet">
|
<link href="{{ url_for('static', filename='css/main.css') }}" rel="stylesheet">
|
||||||
<link href="{{ url_for('static', filename='css/base_styles.css') }}" rel="stylesheet">
|
<title>PDF-Web-Toolkit{% if page == 'project' %} | Project{% endif %}{% if page == 'split' %} | Split{% endif %}{% if page == 'merge' %} | Merge{% endif %}{% if page == 'ocr' %} | OCR{% endif %}</title>
|
||||||
<title>PDF-Web-Toolkit{% if page == 'project' %} | Project{% endif %}{% if page == 'splitt' %} | Splitt{% endif %}{% if page == 'merge' %} | Merge{% endif %}{% if page == 'ocr' %} | OCR{% endif %}</title>
|
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
|
|
||||||
<!--<body class="d-flex flex-column h-80">-->
|
|
||||||
<div class="col-lg-8 mx-auto py-md-5">
|
<div class="col-lg-8 mx-auto py-md-5">
|
||||||
|
|
||||||
<header class="">
|
<header class="">
|
||||||
<nav class="navbar navbar-expand-lg border-bottom">
|
<nav class="navbar navbar-expand-lg border-bottom">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<a class="navbar-brand" href="/" hidden>
|
<a class="navbar-brand" href="/">
|
||||||
<picture>
|
<picture>
|
||||||
<source srcset="{{ url_for('static', filename='img/filetype-pdf.svg') }}" media="(prefers-color-scheme: dark)">
|
<source srcset="{{ url_for('static', filename='img/filetype-pdf.svg') }}" media="(prefers-color-scheme: dark)">
|
||||||
<img src="{{ url_for('static', filename='img/filetype-pdf.svg') }}" alt="PDF-Web-Toolkit" height="40">
|
<img src="{{ url_for('static', filename='img/filetype-pdf.svg') }}" alt="PDF-Web-Toolkit" height="40">
|
||||||
|
@ -32,10 +29,10 @@
|
||||||
|
|
||||||
<div class="collapse navbar-collapse" id="navbarContent">
|
<div class="collapse navbar-collapse" id="navbarContent">
|
||||||
<ul class="navbar-nav mr-auto flex-fill">
|
<ul class="navbar-nav mr-auto flex-fill">
|
||||||
<li class="nav-item {%if page == 'project'%}active{%endif%}"><a class="nav-link" href="/">Project</a></li>
|
<li class="nav-item {%if page == 'split'%}active{%endif%}"><a class="nav-link" href="/split">Simple Split</a></li>
|
||||||
<li class="nav-item {%if page == 'splitt'%}active{%endif%}" hidden><a class="nav-link" href="/splitt">Simple Splitt</a></li>
|
<li class="nav-item {%if page == 'merge'%}active{%endif%}"><a class="nav-link" href="/merge">Simple Merge</a></li>
|
||||||
<li class="nav-item {%if page == 'merge'%}active{%endif%}" hidden><a class="nav-link" href="/merge">Simple Merge</a></li>
|
|
||||||
<li class="nav-item {%if page == 'ocr'%}active{%endif%}" hidden><a class="nav-link" href="/ocr">Simple OCR</a></li>
|
<li class="nav-item {%if page == 'ocr'%}active{%endif%}" hidden><a class="nav-link" href="/ocr">Simple OCR</a></li>
|
||||||
|
<li class="nav-item {%if page == 'project'%}active{%endif%}"><a class="nav-link" href="/project">Project</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -48,8 +45,8 @@
|
||||||
{% include 'partials/project.html' %}
|
{% include 'partials/project.html' %}
|
||||||
{% endif %}
|
{% endif %}
|
||||||
|
|
||||||
{% if page == 'splitt' %}
|
{% if page == 'split' %}
|
||||||
{% include 'partials/splitt.html' %}
|
{% include 'partials/split.html' %}
|
||||||
{% endif %}
|
{% endif %}
|
||||||
|
|
||||||
{% if page == 'merge' %}
|
{% if page == 'merge' %}
|
||||||
|
@ -70,7 +67,5 @@
|
||||||
</footer>
|
</footer>
|
||||||
|
|
||||||
<script src="{{ url_for('static', filename='js/bootstrap.bundle.min.js') }}"></script>
|
<script src="{{ url_for('static', filename='js/bootstrap.bundle.min.js') }}"></script>
|
||||||
<!-- <script src="{{ url_for('static', filename='js/main.js') }}"></script> -->
|
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
|
|
|
@ -1,7 +1,16 @@
|
||||||
<div class="page_description_div" id="merge_description_div">
|
<div class="page_description_div" id="merge_description_div">
|
||||||
<p class="page_description_p" id="merge_description_p">Upload your PDF-Files that you want to be merged.</p>
|
<p class="page_description_p" id="merge_description_p">
|
||||||
|
Upload PDFs that you want to merge.
|
||||||
|
</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{% include 'partials/dropzone.html' %}
|
{% include 'partials/dropzone.html' %}
|
||||||
|
|
||||||
From merge.html
|
<script src="https://cdn.jsdelivr.net/npm/vue@2"></script>
|
||||||
|
<script src="{{ url_for('static', filename='js/pdf_api_wrapper.js') }}"></script>
|
||||||
|
<script src="{{ url_for('static', filename='js/merge.js') }}"></script>
|
||||||
|
<link href="{{ url_for('static', filename='css/merge.css') }}" rel="stylesheet">
|
||||||
|
|
||||||
|
<div id="btn-group-download" class="btn-group" role="group" aria-label="Download outlined buttons">
|
||||||
|
<button type="button" class="btn btn-outline-dark" id="btn_download_complete">Download merged PDFs</button>
|
||||||
|
</div>
|
|
@ -0,0 +1,16 @@
|
||||||
|
<div class="page_description_div" id="splitt_description_div">
|
||||||
|
<p class="page_description_p" id="splitt_description_p">
|
||||||
|
Upload a PDF that you want to be splitt into seperate pages.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{% include 'partials/dropzone.html' %}
|
||||||
|
|
||||||
|
<script src="https://cdn.jsdelivr.net/npm/vue@2"></script>
|
||||||
|
<script src="{{ url_for('static', filename='js/pdf_api_wrapper.js') }}"></script>
|
||||||
|
<script src="{{ url_for('static', filename='js/split.js') }}"></script>
|
||||||
|
<link href="{{ url_for('static', filename='css/split.css') }}" rel="stylesheet">
|
||||||
|
|
||||||
|
<div id="btn-group-download" class="btn-group" role="group" aria-label="Download outlined buttons">
|
||||||
|
<button type="button" class="btn btn-outline-dark" id="btn_download_singel_pages">Download Project as single Pages</button>
|
||||||
|
</div>
|
|
@ -1,7 +0,0 @@
|
||||||
<div class="page_description_div" id="splitt_description_div">
|
|
||||||
<p class="page_description_p" id="splitt_description_p">Upload a PDF that you want to be splitt into seperate pages.</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{% include 'partials/dropzone.html' %}
|
|
||||||
|
|
||||||
From splitt.html
|
|
Loading…
Reference in New Issue