mirror of
https://github.com/Stirling-Tools/Stirling-PDF.git
synced 2024-09-28 15:50:08 +02:00
WIP: Adds Drap and drop
This commit is contained in:
Dimitrios Kaitantzidis
parent
89345c8d60
commit
99b0150e7a
8
.idea/.gitignore
vendored
8
.idea/.gitignore
vendored
@ -1,8 +0,0 @@
|
||||
# Default ignored files
|
||||
/shelf/
|
||||
/workspace.xml
|
||||
# Editor-based HTTP Client requests
|
||||
/httpRequests/
|
||||
# Datasource local storage ignored files
|
||||
/dataSources/
|
||||
/dataSources.local.xml
|
||||
@ -1,18 +1,9 @@
|
||||
package stirling.software.SPDF.controller.web;
|
||||
import java.io.IOException;
|
||||
import java.nio.charset.StandardCharsets;
|
||||
import java.nio.file.Files;
|
||||
import java.nio.file.Path;
|
||||
import java.nio.file.Paths;
|
||||
import java.util.ArrayList;
|
||||
import java.util.Arrays;
|
||||
import java.util.HashMap;
|
||||
import java.util.List;
|
||||
import java.util.Map;
|
||||
import java.util.Objects;
|
||||
import java.util.stream.Collectors;
|
||||
import java.util.stream.Stream;
|
||||
|
||||
import com.fasterxml.jackson.core.type.TypeReference;
|
||||
import com.fasterxml.jackson.databind.ObjectMapper;
|
||||
import io.swagger.v3.oas.annotations.Hidden;
|
||||
import io.swagger.v3.oas.annotations.tags.Tag;
|
||||
import org.springframework.beans.factory.annotation.Autowired;
|
||||
import org.springframework.core.io.Resource;
|
||||
import org.springframework.core.io.ResourceLoader;
|
||||
@ -21,11 +12,14 @@ import org.springframework.stereotype.Controller;
|
||||
import org.springframework.ui.Model;
|
||||
import org.springframework.web.bind.annotation.GetMapping;
|
||||
|
||||
import com.fasterxml.jackson.core.type.TypeReference;
|
||||
import com.fasterxml.jackson.databind.ObjectMapper;
|
||||
|
||||
import io.swagger.v3.oas.annotations.Hidden;
|
||||
import io.swagger.v3.oas.annotations.tags.Tag;
|
||||
import java.io.IOException;
|
||||
import java.nio.charset.StandardCharsets;
|
||||
import java.nio.file.Files;
|
||||
import java.nio.file.Path;
|
||||
import java.nio.file.Paths;
|
||||
import java.util.*;
|
||||
import java.util.stream.Collectors;
|
||||
import java.util.stream.Stream;
|
||||
|
||||
@Controller
|
||||
@Tag(name = "General", description = "General APIs")
|
||||
@ -80,7 +74,13 @@ public class GeneralWebController {
|
||||
model.addAttribute("currentPage", "merge-pdfs");
|
||||
return "merge-pdfs";
|
||||
}
|
||||
|
||||
|
||||
@GetMapping("/view-pdf")
|
||||
@Hidden
|
||||
public String ViewPdfForm(Model model) {
|
||||
model.addAttribute("currentPage", "view-pdf");
|
||||
return "view-pdf";
|
||||
}
|
||||
|
||||
@GetMapping("/multi-tool")
|
||||
@Hidden
|
||||
|
||||
@ -126,6 +126,9 @@ adminUserSettings.submit=Save User
|
||||
# HOME-PAGE #
|
||||
#############
|
||||
home.desc=Your locally hosted one-stop-shop for all your PDF needs.
|
||||
home.viewPdf.title=View PDF
|
||||
home.viewPdf.desc=View, annotate, add text or images
|
||||
viewPdf.tags=view,read,annotate,text,image
|
||||
|
||||
|
||||
home.multiTool.title=PDF Multi Tool
|
||||
|
||||
18
src/main/resources/static/images/book-opened.svg
Normal file
18
src/main/resources/static/images/book-opened.svg
Normal file
@ -0,0 +1,18 @@
|
||||
<svg fill="#000000" version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg"
|
||||
width="800px" height="800px" viewBox="0 0 318.336 318.336"
|
||||
xml:space="preserve">
|
||||
<g>
|
||||
<g>
|
||||
<path d="M302.137,74.432h-21.031c-30.496-13.614-56.389-20.611-77.028-20.611c-26.731,0-39.245,11.649-44.906,20.535
|
||||
c-5.658-8.886-18.17-20.535-44.906-20.535c-20.638,0-46.533,7.003-77.037,20.611H16.2c-8.946,0-16.2,7.253-16.2,16.2v157.684
|
||||
c0,8.949,7.254,16.2,16.2,16.2h285.937c8.948,0,16.199-7.251,16.199-16.2V90.632C318.336,81.686,311.085,74.432,302.137,74.432z
|
||||
M154.786,84.265c-0.048,0.25-0.069,0.503-0.069,0.757V233.74c-7.084-8.18-18.95-14.438-38.804-14.438
|
||||
c-35.44,0-79.927,19.432-95.813,26.947V91.528c13.608-6.927,26.31-12.587,38.156-17.096c21.745-8.271,40.526-12.511,56.004-12.511
|
||||
c18.992,0,29.37,6.354,34.986,12.511c3.241,3.554,4.91,7.038,5.698,9.192C154.852,83.985,154.791,84.243,154.786,84.265z
|
||||
M298.234,246.249c-15.884-7.516-60.371-26.947-95.809-26.947c-19.859,0-31.72,6.254-38.805,14.438
|
||||
c-0.261,0.3-0.562,0.58-0.804,0.886V85.48c0.084-0.351,0.269-0.981,0.583-1.825c0.799-2.149,2.499-5.647,5.776-9.218
|
||||
c5.648-6.157,16.026-12.512,34.9-12.512c15.478,0,34.251,4.24,56.004,12.512c11.854,4.509,24.548,10.17,38.153,17.097V246.249
|
||||
L298.234,246.249z"/>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.2 KiB |
@ -29,7 +29,8 @@
|
||||
|
||||
|
||||
<!-- <div th:replace="~{fragments/card :: card(id='pipeline', cardTitle=#{home.pipeline.title}, cardText=#{home.pipeline.desc}, cardLink='pipeline', svgPath='images/pipeline.svg')}"></div> -->
|
||||
|
||||
|
||||
<div th:replace="~{fragments/card :: card(id='view-pdf', cardTitle=#{home.viewPdf.title}, cardText=#{home.viewPdf.desc}, cardLink='view-pdf', svgPath='images/book-opened.svg')}"></div>
|
||||
<div th:replace="~{fragments/card :: card(id='multi-tool', cardTitle=#{home.multiTool.title}, cardText=#{home.multiTool.desc}, cardLink='multi-tool', svgPath='images/tools.svg')}"></div>
|
||||
<div th:replace="~{fragments/card :: card(id='merge-pdfs', cardTitle=#{home.merge.title}, cardText=#{home.merge.desc}, cardLink='merge-pdfs', svgPath='images/union.svg')}"></div>
|
||||
<div th:replace="~{fragments/card :: card(id='split-pdfs', cardTitle=#{home.split.title}, cardText=#{home.split.desc}, cardLink='split-pdfs', svgPath='images/layout-split.svg')}"></div>
|
||||
|
||||
104
src/main/resources/templates/view-pdf.html
Normal file
104
src/main/resources/templates/view-pdf.html
Normal file
@ -0,0 +1,104 @@
|
||||
<!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=#{multiTool.title})}"></th:block>
|
||||
|
||||
<body>
|
||||
<div id="image-highlighter"></div>
|
||||
<div id="page-container">
|
||||
<div id="content-wrap">
|
||||
<div th:insert="~{fragments/navbar.html :: navbar}"></div>
|
||||
<br> <br>
|
||||
<div class="container">
|
||||
<fieldset class="upload_dropZone text-center mb-3 p-4">
|
||||
|
||||
<legend class="visually-hidden">Image uploader</legend>
|
||||
|
||||
<svg class="upload_svg" width="60" height="60" aria-hidden="true">
|
||||
<use href="#icon-imageUpload"></use>
|
||||
</svg>
|
||||
|
||||
<p class="small my-2">Drag & Drop PDF(s) inside dashed region<br><i>or</i></p>
|
||||
|
||||
<input id="upload_image_background" data-post-name="image_background"
|
||||
data-post-url="https://someplace.com/image/uploads/backgrounds/"
|
||||
class="position-absolute invisible" type="file" multiple
|
||||
accept="image/jpeg, image/png, image/svg+xml"/>
|
||||
|
||||
<label class="btn btn-upload mb-3" for="upload_image_background">Choose file(s)</label>
|
||||
|
||||
<div class="upload_gallery d-flex flex-wrap justify-content-center gap-3 mb-0"></div>
|
||||
|
||||
</fieldset>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div th:insert="~{fragments/footer.html :: footer}"></div>
|
||||
</div>
|
||||
<div id="drag-container"></div>
|
||||
|
||||
<script type="module">
|
||||
|
||||
</script>
|
||||
|
||||
<style>
|
||||
fieldset {
|
||||
--colorPrimaryNormal: #00b3bb;
|
||||
--colorPrimaryDark: #00979f;
|
||||
--colorPrimaryGlare: #00cdd7;
|
||||
--colorPrimaryHalf: #80d9dd;
|
||||
--colorPrimaryQuarter: #bfecee;
|
||||
--colorPrimaryEighth: #dff5f7;
|
||||
--colorPrimaryPale: #f3f5f7;
|
||||
--colorPrimarySeparator: #f3f5f7;
|
||||
--colorPrimaryOutline: #dff5f7;
|
||||
--colorButtonNormal: #00b3bb;
|
||||
--colorButtonHover: #00cdd7;
|
||||
--colorLinkNormal: #00979f;
|
||||
--colorLinkHover: #00cdd7;
|
||||
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 24px;
|
||||
}
|
||||
|
||||
.upload_dropZone {
|
||||
color: var(--base-font-color);
|
||||
background-color: var(--background-color);
|
||||
outline: 2px dashed var(--scroll-bar-color, #c1ddef);
|
||||
outline-offset: -12px;
|
||||
transition: outline-offset 0.2s ease-out,
|
||||
outline-color 0.3s ease-in-out,
|
||||
background-color 0.2s ease-out;
|
||||
}
|
||||
|
||||
.upload_dropZone.highlight {
|
||||
outline-offset: -4px;
|
||||
outline-color: var(--bs-blue, #0576bd);
|
||||
background-color: var(--colorPrimaryEighth, #c8dadf);
|
||||
}
|
||||
|
||||
.upload_svg {
|
||||
fill: var(--bs-blue, #0576bd);
|
||||
}
|
||||
|
||||
.btn-upload {
|
||||
color: #fff;
|
||||
background-color: var(--bs-blue);
|
||||
}
|
||||
|
||||
.btn-upload:hover,
|
||||
.btn-upload:focus {
|
||||
color: #fff;
|
||||
background-color: var(--bs-blue);
|
||||
}
|
||||
|
||||
.upload_img {
|
||||
width: calc(33.333% - (2rem / 3));
|
||||
object-fit: contain;
|
||||
}
|
||||
</style>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Loading…
Reference in New Issue
Block a user