javier/Stirling-PDF
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fixed bugs

Browse Source
This commit is contained in:
Saud Fatayerji
2023-02-05 18:08:43 +03:00
parent 58423bfc21
commit f093d65729
2 changed files with 31 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
src/main/resources/templates/rotate-pdf.html
View File

@@ -24,9 +24,19 @@
</div>
<div class="buttonContainer">
<button type="button" class="btn btn-secondary" onclick="rotate(-90)">L</button>
<button type="button" class="btn btn-secondary" onclick="rotate(-90)">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-arrow-counterclockwise" viewBox="0 0 16 16">
<path fill-rule="evenodd" d="M8 3a5 5 0 1 1-4.546 2.914.5.5 0 0 0-.908-.417A6 6 0 1 0 8 2v1z"/>
<path d="M8 4.466V.534a.25.25 0 0 0-.41-.192L5.23 2.308a.25.25 0 0 0 0 .384l2.36 1.966A.25.25 0 0 0 8 4.466z"/>
</svg>
</button>
<button type="submit" class="btn btn-primary">Complete</button>
<button type="button" class="btn btn-secondary" onclick="rotate(90)">R</button>
<button type="button" class="btn btn-secondary" onclick="rotate(90)">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-arrow-clockwise" viewBox="0 0 16 16">
<path fill-rule="evenodd" d="M8 3a5 5 0 1 0 4.546 2.914.5.5 0 0 1 .908-.417A6 6 0 1 1 8 2v1z"/>
<path d="M8 4.466V.534a.25.25 0 0 1 .41-.192l2.36 1.966c.12.1.12.284 0 .384L8.41 4.658A.25.25 0 0 1 8 4.466z"/>
</svg>
</button>
</div>
</form>
@@ -57,8 +67,13 @@
const canvas = document.createElement("canvas");
// set the canvas size to the size of the page
canvas.width = page.view[2];
canvas.height = page.view[3];
if (page.rotate == 90 || page.rotate == 270) {
canvas.width = page.view[3];
canvas.height = page.view[2];
} else {
canvas.width = page.view[2];
canvas.height = page.view[3];
}
// render the page onto the canvas
var renderContext = {
@@ -71,14 +86,14 @@
});
function rotate(deg) {
var lastTransform = preview.style.transform;
var lastTransform = preview.style.rotate;
if (!lastTransform) {
lastTransform = "0";
}
const lastAngle = parseInt(lastTransform.replace(/[^\d-]/g, ''));
const newAngle = lastAngle + deg;
preview.style.transform = "rotate(" + newAngle + "deg)";
preview.style.rotate = newAngle + "deg";
angleInput.value = newAngle;
}
</script>
@@ -86,10 +101,14 @@
#pdf-preview {
margin: 0 auto;
display: block;
max-width: 100%;
max-height: 100%;
max-width: calc(100% - 30px);
max-height: calc(100% - 30px);
box-shadow: 0 0 4px rgba(100,100,100,.25);
transition: transform .3s;
transition: rotate .3s;
position: absolute;
top: 50%;
left: 50%;
translate: -50% -50%;
}
.previewContainer {
aspect-ratio: 1;
@@ -100,6 +119,7 @@
padding: 15px;
display: none;
overflow: hidden;
position: relative;
}
.buttonContainer {