...
This commit is contained in:
parent
1e19aa9818
commit
21f1da3898
17
herowebserver/heroweb/email.html
Normal file
17
herowebserver/heroweb/email.html
Normal file
@ -0,0 +1,17 @@
|
|||||||
|
Dear OurWorld Guest,
|
||||||
|
|
||||||
|
Welcome to the OurWorld Verification System,
|
||||||
|
|
||||||
|
Please open below lnk to verify your email address.
|
||||||
|
|
||||||
|
<!doctype html>
|
||||||
|
<html>
|
||||||
|
<body>
|
||||||
|
<p>Click the link below to login:</p>
|
||||||
|
<a href="{{ email_link }}">Login</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
||||||
|
regards
|
||||||
|
|
||||||
|
OurWorld Team
|
||||||
@ -6,21 +6,25 @@
|
|||||||
<title>Image Slideshow with Thumbnails</title>
|
<title>Image Slideshow with Thumbnails</title>
|
||||||
<link
|
<link
|
||||||
rel="stylesheet"
|
rel="stylesheet"
|
||||||
href="https://unpkg.com/swiper/swiper-bundle.min.css"
|
href="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.css"
|
||||||
/>
|
/>
|
||||||
<style>
|
<style>
|
||||||
body {
|
body,
|
||||||
font-family: Arial, sans-serif;
|
html {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
|
height: 100%;
|
||||||
|
font-family: Arial, sans-serif;
|
||||||
|
}
|
||||||
|
body {
|
||||||
display: flex;
|
display: flex;
|
||||||
height: 100vh;
|
|
||||||
}
|
}
|
||||||
#thumbnails {
|
#thumbnails {
|
||||||
width: 200px;
|
width: 200px;
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
background: #f0f0f0;
|
background: #f0f0f0;
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
|
flex-shrink: 0;
|
||||||
}
|
}
|
||||||
.thumbnail {
|
.thumbnail {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
@ -33,10 +37,13 @@
|
|||||||
flex-grow: 1;
|
flex-grow: 1;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
overflow: hidden;
|
||||||
|
position: relative;
|
||||||
}
|
}
|
||||||
.swiper-container {
|
.swiper {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
flex-grow: 1;
|
||||||
}
|
}
|
||||||
.swiper-slide {
|
.swiper-slide {
|
||||||
display: flex;
|
display: flex;
|
||||||
@ -46,38 +53,49 @@
|
|||||||
.swiper-slide img {
|
.swiper-slide img {
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
max-height: 100%;
|
max-height: 100%;
|
||||||
|
width: auto;
|
||||||
|
height: auto;
|
||||||
object-fit: contain;
|
object-fit: contain;
|
||||||
}
|
}
|
||||||
#toolbar {
|
.swiper-button-prev,
|
||||||
background: #333;
|
.swiper-button-next {
|
||||||
color: white;
|
color: white;
|
||||||
padding: 10px;
|
}
|
||||||
display: flex;
|
#page-info {
|
||||||
justify-content: space-between;
|
position: absolute;
|
||||||
|
bottom: 10px;
|
||||||
|
left: 50%;
|
||||||
|
transform: translateX(-50%);
|
||||||
|
background-color: rgba(255, 255, 255, 0.7);
|
||||||
|
padding: 5px 10px;
|
||||||
|
border-radius: 15px;
|
||||||
|
color: black;
|
||||||
|
z-index: 10;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id="thumbnails"></div>
|
<div id="thumbnails"></div>
|
||||||
<div id="main-view">
|
<div id="main-view">
|
||||||
<div id="toolbar">
|
<div class="swiper">
|
||||||
<button id="prev">Previous</button>
|
<div class="swiper-wrapper">
|
||||||
<span id="page-info"></span>
|
<!-- Slides will be added here dynamically -->
|
||||||
<button id="next">Next</button>
|
</div>
|
||||||
</div>
|
<div class="swiper-pagination"></div>
|
||||||
<div class="swiper-container">
|
<div class="swiper-button-prev"></div>
|
||||||
<div class="swiper-wrapper"></div>
|
<div class="swiper-button-next"></div>
|
||||||
</div>
|
</div>
|
||||||
|
<div id="page-info"></div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<script src="https://unpkg.com/swiper/swiper-bundle.min.js"></script>
|
<script src="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.js"></script>
|
||||||
<script>
|
<script>
|
||||||
const images = [
|
const images = [
|
||||||
"https://picsum.photos/800/600?random=1",
|
"https://picsum.photos/2400/1500?random=1",
|
||||||
"https://picsum.photos/800/600?random=2",
|
"https://picsum.photos/2400/1500?random=2",
|
||||||
"https://picsum.photos/800/600?random=3",
|
"https://picsum.photos/2400/1500?random=3",
|
||||||
"https://picsum.photos/800/600?random=4",
|
"https://picsum.photos/2400/1500?random=4",
|
||||||
"https://picsum.photos/800/600?random=5",
|
"https://picsum.photos/2400/1500?random=5",
|
||||||
];
|
];
|
||||||
|
|
||||||
const thumbnailsContainer = document.getElementById("thumbnails");
|
const thumbnailsContainer = document.getElementById("thumbnails");
|
||||||
@ -99,18 +117,23 @@
|
|||||||
swiperWrapper.appendChild(slide);
|
swiperWrapper.appendChild(slide);
|
||||||
});
|
});
|
||||||
|
|
||||||
const swiper = new Swiper(".swiper-container", {
|
const swiper = new Swiper(".swiper", {
|
||||||
direction: "vertical",
|
direction: "horizontal",
|
||||||
|
loop: true,
|
||||||
|
pagination: {
|
||||||
|
el: ".swiper-pagination",
|
||||||
|
},
|
||||||
|
navigation: {
|
||||||
|
nextEl: ".swiper-button-next",
|
||||||
|
prevEl: ".swiper-button-prev",
|
||||||
|
},
|
||||||
on: {
|
on: {
|
||||||
slideChange: () => {
|
slideChange: function () {
|
||||||
pageInfo.textContent = `Page ${swiper.activeIndex + 1} of ${images.length}`;
|
pageInfo.textContent = `Page ${this.realIndex + 1} of ${images.length}`;
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
document.getElementById("prev").onclick = () => swiper.slidePrev();
|
|
||||||
document.getElementById("next").onclick = () => swiper.slideNext();
|
|
||||||
|
|
||||||
pageInfo.textContent = `Page 1 of ${images.length}`;
|
pageInfo.textContent = `Page 1 of ${images.length}`;
|
||||||
</script>
|
</script>
|
||||||
</body>
|
</body>
|
||||||
161
herowebserver/heroweb/swiper.html
Normal file
161
herowebserver/heroweb/swiper.html
Normal file
@ -0,0 +1,161 @@
|
|||||||
|
<!doctype html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
|
<title>Image Slideshow with Thumbnails</title>
|
||||||
|
<link
|
||||||
|
rel="stylesheet"
|
||||||
|
href="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.css"
|
||||||
|
/>
|
||||||
|
<style>
|
||||||
|
body,
|
||||||
|
html {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
height: 100%;
|
||||||
|
font-family: Arial, sans-serif;
|
||||||
|
}
|
||||||
|
body {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
#thumbnails {
|
||||||
|
width: 200px;
|
||||||
|
overflow-y: auto;
|
||||||
|
background: #f0f0f0;
|
||||||
|
padding: 10px;
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
.thumbnail {
|
||||||
|
width: 100%;
|
||||||
|
height: 100px;
|
||||||
|
object-fit: cover;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
#main-view {
|
||||||
|
flex-grow: 1;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
overflow: hidden;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.swiper {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
flex-grow: 1;
|
||||||
|
}
|
||||||
|
.swiper-slide {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: flex-start;
|
||||||
|
}
|
||||||
|
.swiper-slide img {
|
||||||
|
max-width: 100%;
|
||||||
|
max-height: 100%;
|
||||||
|
width: auto;
|
||||||
|
height: auto;
|
||||||
|
object-fit: contain;
|
||||||
|
}
|
||||||
|
.swiper-button-prev,
|
||||||
|
.swiper-button-next {
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
#page-info {
|
||||||
|
position: absolute;
|
||||||
|
bottom: 10px;
|
||||||
|
left: 50%;
|
||||||
|
transform: translateX(-50%);
|
||||||
|
background-color: rgba(255, 255, 255, 0.7);
|
||||||
|
padding: 5px 10px;
|
||||||
|
border-radius: 15px;
|
||||||
|
color: black;
|
||||||
|
z-index: 10;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id="thumbnails">
|
||||||
|
{% for index in range(files|length) %}
|
||||||
|
<img
|
||||||
|
src="{{ files[index] }}"
|
||||||
|
class="thumbnail"
|
||||||
|
data-index="{{ index }}"
|
||||||
|
/>
|
||||||
|
{% endfor %}
|
||||||
|
</div>
|
||||||
|
<div id="main-view">
|
||||||
|
<div class="swiper">
|
||||||
|
<div class="swiper-wrapper">
|
||||||
|
{% for file in files %}
|
||||||
|
<div class="swiper-slide">
|
||||||
|
<img src="{{ file }}" data-filename="{{ file }}" />
|
||||||
|
</div>
|
||||||
|
{% endfor %}
|
||||||
|
</div>
|
||||||
|
<div class="swiper-pagination"></div>
|
||||||
|
<div class="swiper-button-prev"></div>
|
||||||
|
<div class="swiper-button-next"></div>
|
||||||
|
</div>
|
||||||
|
<div id="page-info"></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script src="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.js"></script>
|
||||||
|
<script>
|
||||||
|
const thumbnails = document.querySelectorAll(".thumbnail");
|
||||||
|
const pageInfo = document.getElementById("page-info");
|
||||||
|
|
||||||
|
const swiper = new Swiper(".swiper", {
|
||||||
|
direction: "horizontal",
|
||||||
|
loop: true,
|
||||||
|
pagination: {
|
||||||
|
el: ".swiper-pagination",
|
||||||
|
},
|
||||||
|
navigation: {
|
||||||
|
nextEl: ".swiper-button-next",
|
||||||
|
prevEl: ".swiper-button-prev",
|
||||||
|
},
|
||||||
|
on: {
|
||||||
|
slideChange: function () {
|
||||||
|
updatePageInfo(this.realIndex);
|
||||||
|
reportViewedFile(this.slides[this.activeIndex]);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
function updatePageInfo(index) {
|
||||||
|
pageInfo.textContent = `Page ${index + 1} of ${thumbnails.length}`;
|
||||||
|
}
|
||||||
|
|
||||||
|
function reportViewedFile(slide) {
|
||||||
|
const filename = slide
|
||||||
|
.querySelector("img")
|
||||||
|
.getAttribute("data-filename");
|
||||||
|
fetch("/report-viewed-file", {
|
||||||
|
method: "POST",
|
||||||
|
headers: {
|
||||||
|
"Content-Type": "application/json",
|
||||||
|
},
|
||||||
|
body: JSON.stringify({ filename: filename }),
|
||||||
|
})
|
||||||
|
.then((response) => response.json())
|
||||||
|
.then((data) => console.log("File view reported:", data))
|
||||||
|
.catch((error) =>
|
||||||
|
console.error("Error reporting file view:", error),
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
thumbnails.forEach((thumbnail) => {
|
||||||
|
thumbnail.addEventListener("click", () => {
|
||||||
|
const index = parseInt(
|
||||||
|
thumbnail.getAttribute("data-index"),
|
||||||
|
);
|
||||||
|
swiper.slideTo(index);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
updatePageInfo(0);
|
||||||
|
reportViewedFile(swiper.slides[swiper.activeIndex]);
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
@ -1,10 +0,0 @@
|
|||||||
<!DOCTYPE html>
|
|
||||||
<html>
|
|
||||||
<head>
|
|
||||||
<title>Login Email</title>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<p>Click the link below to login:</p>
|
|
||||||
<a href="{{ email_link }}">Login</a>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
@ -1,38 +0,0 @@
|
|||||||
<!doctype html>
|
|
||||||
<html>
|
|
||||||
<head>
|
|
||||||
<title>PDF Viewer</title>
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://mozilla.github.io/pdf.js/web/viewer.css"
|
|
||||||
/>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<div id="viewerContainer" class="pdfViewer singlePageView">
|
|
||||||
<div id="viewer" class="pdfViewer"></div>
|
|
||||||
</div>
|
|
||||||
<script src="https://mozilla.github.io/pdf.js/build/pdf.js"></script>
|
|
||||||
<script src="https://mozilla.github.io/pdf.js/web/viewer.js"></script>
|
|
||||||
<script>
|
|
||||||
const url = "{{ pdf_url }}";
|
|
||||||
const loadingTask = pdfjsLib.getDocument(url);
|
|
||||||
loadingTask.promise.then(function (pdf) {
|
|
||||||
const viewer = document.getElementById("viewer");
|
|
||||||
for (let pageNum = 1; pageNum <= pdf.numPages; pageNum++) {
|
|
||||||
pdf.getPage(pageNum).then(function (page) {
|
|
||||||
const viewport = page.getViewport({ scale: 1.5 });
|
|
||||||
const canvas = document.createElement("canvas");
|
|
||||||
const context = canvas.getContext("2d");
|
|
||||||
canvas.height = viewport.height;
|
|
||||||
canvas.width = viewport.width;
|
|
||||||
viewer.appendChild(canvas);
|
|
||||||
page.render({
|
|
||||||
canvasContext: context,
|
|
||||||
viewport: viewport,
|
|
||||||
});
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
1
poc/out/heroweb
Symbolic link
1
poc/out/heroweb
Symbolic link
@ -0,0 +1 @@
|
|||||||
|
../../herowebserver/heroweb
|
||||||
@ -1,10 +0,0 @@
|
|||||||
<!DOCTYPE html>
|
|
||||||
<html>
|
|
||||||
<head>
|
|
||||||
<title>Login Email</title>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<p>Click the link below to login:</p>
|
|
||||||
<a href="{{ email_link }}">Login</a>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
@ -1,10 +0,0 @@
|
|||||||
<!DOCTYPE html>
|
|
||||||
<html>
|
|
||||||
<head>
|
|
||||||
<title>User Info</title>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<h2>Welcome!</h2>
|
|
||||||
<p>Your email is: {{ email }}</p>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
@ -1,15 +0,0 @@
|
|||||||
<!DOCTYPE html>
|
|
||||||
<html>
|
|
||||||
<head>
|
|
||||||
<title>Login</title>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<h2>Login with Email</h2>
|
|
||||||
<form method="post" action="/loginsubmit">
|
|
||||||
<label for="email">Email:</label>
|
|
||||||
<input type="email" name="email" required>
|
|
||||||
<button type="submit">Login</button>
|
|
||||||
</form>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
|
|
||||||
@ -1,261 +0,0 @@
|
|||||||
<!doctype html>
|
|
||||||
<html>
|
|
||||||
<head>
|
|
||||||
<title>PDF Presentation Viewer with Thumbnails</title>
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/3.11.174/pdf_viewer.min.css"
|
|
||||||
/>
|
|
||||||
<style>
|
|
||||||
body,
|
|
||||||
html {
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
height: 100%;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
font-family: Arial, sans-serif;
|
|
||||||
}
|
|
||||||
#mainContainer {
|
|
||||||
display: flex;
|
|
||||||
flex: 1;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
#thumbnailContainer {
|
|
||||||
width: 200px;
|
|
||||||
overflow-y: auto;
|
|
||||||
background-color: #f0f0f0;
|
|
||||||
padding: 10px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
}
|
|
||||||
.thumbnail {
|
|
||||||
width: 100%;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
cursor: pointer;
|
|
||||||
border: 2px solid transparent;
|
|
||||||
}
|
|
||||||
.thumbnail.active {
|
|
||||||
border-color: #4caf50;
|
|
||||||
}
|
|
||||||
#viewerContainer {
|
|
||||||
flex: 1;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
background-color: #e0e0e0;
|
|
||||||
}
|
|
||||||
#viewer {
|
|
||||||
max-width: 100%;
|
|
||||||
max-height: 100%;
|
|
||||||
}
|
|
||||||
#viewer canvas {
|
|
||||||
max-width: 100%;
|
|
||||||
max-height: 100%;
|
|
||||||
object-fit: contain;
|
|
||||||
}
|
|
||||||
#navigationControls {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
padding: 10px;
|
|
||||||
background-color: #333;
|
|
||||||
}
|
|
||||||
.navButton {
|
|
||||||
background-color: #4caf50;
|
|
||||||
border: none;
|
|
||||||
color: white;
|
|
||||||
padding: 10px 20px;
|
|
||||||
text-align: center;
|
|
||||||
text-decoration: none;
|
|
||||||
display: inline-block;
|
|
||||||
font-size: 16px;
|
|
||||||
margin: 0 10px;
|
|
||||||
cursor: pointer;
|
|
||||||
border-radius: 5px;
|
|
||||||
}
|
|
||||||
#pageInfo {
|
|
||||||
color: white;
|
|
||||||
font-size: 16px;
|
|
||||||
margin: 0 20px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<div id="mainContainer">
|
|
||||||
<div id="thumbnailContainer"></div>
|
|
||||||
<div id="viewerContainer">
|
|
||||||
<div id="viewer" class="pdfViewer"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div id="navigationControls">
|
|
||||||
<button id="prevBtn" class="navButton">Previous</button>
|
|
||||||
<span id="pageInfo"></span>
|
|
||||||
<button id="nextBtn" class="navButton">Next</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/3.11.174/pdf.min.js"></script>
|
|
||||||
<script>
|
|
||||||
pdfjsLib.GlobalWorkerOptions.workerSrc =
|
|
||||||
"https://cdnjs.cloudflare.com/ajax/libs/pdf.js/3.11.174/pdf.worker.min.js";
|
|
||||||
|
|
||||||
document.addEventListener("DOMContentLoaded", function () {
|
|
||||||
const url = "{{ pdf_url }}";
|
|
||||||
const viewer = document.getElementById("viewer");
|
|
||||||
const thumbnailContainer =
|
|
||||||
document.getElementById("thumbnailContainer");
|
|
||||||
const prevBtn = document.getElementById("prevBtn");
|
|
||||||
const nextBtn = document.getElementById("nextBtn");
|
|
||||||
const pageInfo = document.getElementById("pageInfo");
|
|
||||||
|
|
||||||
let pdf;
|
|
||||||
let currentPage = 1;
|
|
||||||
let totalPages;
|
|
||||||
|
|
||||||
function sendInteraction(action, data) {
|
|
||||||
fetch("/pdf-interaction", {
|
|
||||||
method: "POST",
|
|
||||||
headers: {
|
|
||||||
"Content-Type": "application/json",
|
|
||||||
},
|
|
||||||
body: JSON.stringify({
|
|
||||||
action: action,
|
|
||||||
data: data,
|
|
||||||
timestamp: new Date().toISOString(),
|
|
||||||
pdfUrl: url,
|
|
||||||
}),
|
|
||||||
})
|
|
||||||
.then((response) => response.json())
|
|
||||||
// .then((data) =>
|
|
||||||
// console.log("Interaction logged:", data),
|
|
||||||
// )
|
|
||||||
.catch((error) =>
|
|
||||||
console.error("Error logging interaction:", error),
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
function renderPage(pageNumber) {
|
|
||||||
pdf.getPage(pageNumber).then(function (page) {
|
|
||||||
const scale = 1.5;
|
|
||||||
const viewport = page.getViewport({ scale: scale });
|
|
||||||
|
|
||||||
const canvas = document.createElement("canvas");
|
|
||||||
const context = canvas.getContext("2d");
|
|
||||||
canvas.height = viewport.height;
|
|
||||||
canvas.width = viewport.width;
|
|
||||||
|
|
||||||
const renderContext = {
|
|
||||||
canvasContext: context,
|
|
||||||
viewport: viewport,
|
|
||||||
};
|
|
||||||
|
|
||||||
viewer.innerHTML = "";
|
|
||||||
viewer.appendChild(canvas);
|
|
||||||
|
|
||||||
page.render(renderContext);
|
|
||||||
updatePageInfo();
|
|
||||||
updateActiveThumbnail();
|
|
||||||
sendInteraction("pageView", { page: pageNumber });
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function createThumbnails() {
|
|
||||||
thumbnailContainer.innerHTML = "";
|
|
||||||
for (let i = 1; i <= totalPages; i++) {
|
|
||||||
pdf.getPage(i).then(function (page) {
|
|
||||||
const scale = 0.2;
|
|
||||||
const viewport = page.getViewport({ scale: scale });
|
|
||||||
|
|
||||||
const canvas = document.createElement("canvas");
|
|
||||||
const context = canvas.getContext("2d");
|
|
||||||
canvas.height = viewport.height;
|
|
||||||
canvas.width = viewport.width;
|
|
||||||
|
|
||||||
const renderContext = {
|
|
||||||
canvasContext: context,
|
|
||||||
viewport: viewport,
|
|
||||||
};
|
|
||||||
|
|
||||||
page.render(renderContext);
|
|
||||||
|
|
||||||
canvas.className = "thumbnail";
|
|
||||||
canvas.setAttribute("data-page-number", i);
|
|
||||||
canvas.onclick = function () {
|
|
||||||
currentPage = i;
|
|
||||||
renderPage(currentPage);
|
|
||||||
};
|
|
||||||
|
|
||||||
thumbnailContainer.appendChild(canvas);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function updatePageInfo() {
|
|
||||||
pageInfo.textContent = `Page ${currentPage} of ${totalPages}`;
|
|
||||||
}
|
|
||||||
|
|
||||||
function updateActiveThumbnail() {
|
|
||||||
const thumbnails = document.querySelectorAll(".thumbnail");
|
|
||||||
thumbnails.forEach((thumbnail) => {
|
|
||||||
thumbnail.classList.remove("active");
|
|
||||||
if (
|
|
||||||
parseInt(
|
|
||||||
thumbnail.getAttribute("data-page-number"),
|
|
||||||
) === currentPage
|
|
||||||
) {
|
|
||||||
thumbnail.classList.add("active");
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function loadPDF() {
|
|
||||||
pdfjsLib
|
|
||||||
.getDocument(url)
|
|
||||||
.promise.then(function (pdfDoc) {
|
|
||||||
pdf = pdfDoc;
|
|
||||||
totalPages = pdf.numPages;
|
|
||||||
renderPage(currentPage);
|
|
||||||
createThumbnails();
|
|
||||||
sendInteraction("pdfLoaded", {
|
|
||||||
totalPages: totalPages,
|
|
||||||
});
|
|
||||||
})
|
|
||||||
.catch(function (error) {
|
|
||||||
console.error("Error loading PDF:", error);
|
|
||||||
sendInteraction("error", {
|
|
||||||
message: error.message,
|
|
||||||
});
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
prevBtn.addEventListener("click", function () {
|
|
||||||
if (currentPage > 1) {
|
|
||||||
currentPage--;
|
|
||||||
renderPage(currentPage);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
nextBtn.addEventListener("click", function () {
|
|
||||||
if (currentPage < totalPages) {
|
|
||||||
currentPage++;
|
|
||||||
renderPage(currentPage);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
document.addEventListener("keydown", function (e) {
|
|
||||||
if (e.key === "ArrowLeft" && currentPage > 1) {
|
|
||||||
currentPage--;
|
|
||||||
renderPage(currentPage);
|
|
||||||
} else if (
|
|
||||||
e.key === "ArrowRight" &&
|
|
||||||
currentPage < totalPages
|
|
||||||
) {
|
|
||||||
currentPage++;
|
|
||||||
renderPage(currentPage);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
loadPDF();
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
@ -1,304 +0,0 @@
|
|||||||
<!doctype html>
|
|
||||||
<html>
|
|
||||||
<head>
|
|
||||||
<title>
|
|
||||||
PDF Presentation Viewer with Thumbnails and WebSocket Control
|
|
||||||
</title>
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/3.11.174/pdf_viewer.min.css"
|
|
||||||
/>
|
|
||||||
<style>
|
|
||||||
body,
|
|
||||||
html {
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
height: 100%;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
font-family: Arial, sans-serif;
|
|
||||||
}
|
|
||||||
#mainContainer {
|
|
||||||
display: flex;
|
|
||||||
flex: 1;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
#thumbnailContainer {
|
|
||||||
width: 200px;
|
|
||||||
overflow-y: auto;
|
|
||||||
background-color: #f0f0f0;
|
|
||||||
padding: 10px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
}
|
|
||||||
.thumbnail {
|
|
||||||
width: 100%;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
cursor: pointer;
|
|
||||||
border: 2px solid transparent;
|
|
||||||
}
|
|
||||||
.thumbnail.active {
|
|
||||||
border-color: #4caf50;
|
|
||||||
}
|
|
||||||
#viewerContainer {
|
|
||||||
flex: 1;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
background-color: #e0e0e0;
|
|
||||||
overflow: auto;
|
|
||||||
}
|
|
||||||
#viewer {
|
|
||||||
max-width: 100%;
|
|
||||||
max-height: 100%;
|
|
||||||
}
|
|
||||||
#viewer canvas {
|
|
||||||
max-width: 100%;
|
|
||||||
max-height: 100%;
|
|
||||||
object-fit: contain;
|
|
||||||
}
|
|
||||||
#navigationControls {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
padding: 10px;
|
|
||||||
background-color: #333;
|
|
||||||
}
|
|
||||||
.navButton {
|
|
||||||
background-color: #4caf50;
|
|
||||||
border: none;
|
|
||||||
color: white;
|
|
||||||
padding: 10px 20px;
|
|
||||||
text-align: center;
|
|
||||||
text-decoration: none;
|
|
||||||
display: inline-block;
|
|
||||||
font-size: 16px;
|
|
||||||
margin: 0 10px;
|
|
||||||
cursor: pointer;
|
|
||||||
border-radius: 5px;
|
|
||||||
}
|
|
||||||
#pageInfo {
|
|
||||||
color: white;
|
|
||||||
font-size: 16px;
|
|
||||||
margin: 0 20px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<div id="mainContainer">
|
|
||||||
<div id="thumbnailContainer"></div>
|
|
||||||
<div id="viewerContainer">
|
|
||||||
<div id="viewer" class="pdfViewer"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div id="navigationControls">
|
|
||||||
<button id="prevBtn" class="navButton">Previous</button>
|
|
||||||
<span id="pageInfo"></span>
|
|
||||||
<button id="nextBtn" class="navButton">Next</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/3.11.174/pdf.min.js"></script>
|
|
||||||
<script>
|
|
||||||
pdfjsLib.GlobalWorkerOptions.workerSrc =
|
|
||||||
"https://cdnjs.cloudflare.com/ajax/libs/pdf.js/3.11.174/pdf.worker.min.js";
|
|
||||||
|
|
||||||
document.addEventListener("DOMContentLoaded", function () {
|
|
||||||
const url = "{{ pdf_url }}";
|
|
||||||
const viewer = document.getElementById("viewer");
|
|
||||||
const thumbnailContainer =
|
|
||||||
document.getElementById("thumbnailContainer");
|
|
||||||
const prevBtn = document.getElementById("prevBtn");
|
|
||||||
const nextBtn = document.getElementById("nextBtn");
|
|
||||||
const pageInfo = document.getElementById("pageInfo");
|
|
||||||
|
|
||||||
let pdf;
|
|
||||||
let currentPage = 1;
|
|
||||||
let totalPages;
|
|
||||||
let socket;
|
|
||||||
|
|
||||||
// WebSocket setup with reconnection logic
|
|
||||||
function setupWebSocket() {
|
|
||||||
socket = new WebSocket("ws://localhost:8000/ws");
|
|
||||||
|
|
||||||
socket.onopen = function (event) {
|
|
||||||
console.log("WebSocket connection established");
|
|
||||||
};
|
|
||||||
|
|
||||||
socket.onmessage = function (event) {
|
|
||||||
const data = JSON.parse(event.data);
|
|
||||||
if (data.action === "changePage") {
|
|
||||||
currentPage = data.page;
|
|
||||||
renderPage(currentPage);
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
socket.onerror = function (error) {
|
|
||||||
console.error("WebSocket error:", error);
|
|
||||||
};
|
|
||||||
|
|
||||||
socket.onclose = function (event) {
|
|
||||||
console.log(
|
|
||||||
"WebSocket connection closed. Attempting to reconnect...",
|
|
||||||
);
|
|
||||||
setTimeout(setupWebSocket, 5000); // Try to reconnect after 5 seconds
|
|
||||||
};
|
|
||||||
}
|
|
||||||
setupWebSocket();
|
|
||||||
|
|
||||||
function sendInteraction(action, data) {
|
|
||||||
fetch("/pdf-interaction", {
|
|
||||||
method: "POST",
|
|
||||||
headers: {
|
|
||||||
"Content-Type": "application/json",
|
|
||||||
},
|
|
||||||
body: JSON.stringify({
|
|
||||||
action: action,
|
|
||||||
data: data,
|
|
||||||
timestamp: new Date().toISOString(),
|
|
||||||
pdfUrl: url,
|
|
||||||
}),
|
|
||||||
})
|
|
||||||
.then((response) => response.json())
|
|
||||||
.then((data) =>
|
|
||||||
console.log("Interaction logged:", data),
|
|
||||||
)
|
|
||||||
.catch((error) =>
|
|
||||||
console.error("Error logging interaction:", error),
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
function renderPage(pageNumber) {
|
|
||||||
pdf.getPage(pageNumber).then(function (page) {
|
|
||||||
const scale = 1.5;
|
|
||||||
const viewport = page.getViewport({ scale: scale });
|
|
||||||
|
|
||||||
const canvas = document.createElement("canvas");
|
|
||||||
const context = canvas.getContext("2d");
|
|
||||||
canvas.height = viewport.height;
|
|
||||||
canvas.width = viewport.width;
|
|
||||||
|
|
||||||
const renderContext = {
|
|
||||||
canvasContext: context,
|
|
||||||
viewport: viewport,
|
|
||||||
};
|
|
||||||
|
|
||||||
viewer.innerHTML = "";
|
|
||||||
viewer.appendChild(canvas);
|
|
||||||
|
|
||||||
page.render(renderContext);
|
|
||||||
updatePageInfo();
|
|
||||||
updateActiveThumbnail();
|
|
||||||
sendInteraction("pageView", { page: pageNumber });
|
|
||||||
|
|
||||||
// Send page change to WebSocket server
|
|
||||||
if (socket && socket.readyState === WebSocket.OPEN) {
|
|
||||||
socket.send(
|
|
||||||
JSON.stringify({
|
|
||||||
action: "pageChanged",
|
|
||||||
page: pageNumber,
|
|
||||||
}),
|
|
||||||
);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function createThumbnails() {
|
|
||||||
thumbnailContainer.innerHTML = "";
|
|
||||||
for (let i = 1; i <= totalPages; i++) {
|
|
||||||
pdf.getPage(i).then(function (page) {
|
|
||||||
const scale = 0.2;
|
|
||||||
const viewport = page.getViewport({ scale: scale });
|
|
||||||
|
|
||||||
const canvas = document.createElement("canvas");
|
|
||||||
const context = canvas.getContext("2d");
|
|
||||||
canvas.height = viewport.height;
|
|
||||||
canvas.width = viewport.width;
|
|
||||||
|
|
||||||
const renderContext = {
|
|
||||||
canvasContext: context,
|
|
||||||
viewport: viewport,
|
|
||||||
};
|
|
||||||
|
|
||||||
page.render(renderContext);
|
|
||||||
|
|
||||||
canvas.className = "thumbnail";
|
|
||||||
canvas.setAttribute("data-page-number", i);
|
|
||||||
canvas.onclick = function () {
|
|
||||||
currentPage = i;
|
|
||||||
renderPage(currentPage);
|
|
||||||
};
|
|
||||||
|
|
||||||
thumbnailContainer.appendChild(canvas);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function updatePageInfo() {
|
|
||||||
pageInfo.textContent = `Page ${currentPage} of ${totalPages}`;
|
|
||||||
}
|
|
||||||
|
|
||||||
function updateActiveThumbnail() {
|
|
||||||
const thumbnails = document.querySelectorAll(".thumbnail");
|
|
||||||
thumbnails.forEach((thumbnail) => {
|
|
||||||
thumbnail.classList.remove("active");
|
|
||||||
if (
|
|
||||||
parseInt(
|
|
||||||
thumbnail.getAttribute("data-page-number"),
|
|
||||||
) === currentPage
|
|
||||||
) {
|
|
||||||
thumbnail.classList.add("active");
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function loadPDF() {
|
|
||||||
pdfjsLib
|
|
||||||
.getDocument(url)
|
|
||||||
.promise.then(function (pdfDoc) {
|
|
||||||
pdf = pdfDoc;
|
|
||||||
totalPages = pdf.numPages;
|
|
||||||
renderPage(currentPage);
|
|
||||||
createThumbnails();
|
|
||||||
sendInteraction("pdfLoaded", {
|
|
||||||
totalPages: totalPages,
|
|
||||||
});
|
|
||||||
})
|
|
||||||
.catch(function (error) {
|
|
||||||
console.error("Error loading PDF:", error);
|
|
||||||
sendInteraction("error", {
|
|
||||||
message: error.message,
|
|
||||||
});
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
prevBtn.addEventListener("click", function () {
|
|
||||||
if (currentPage > 1) {
|
|
||||||
currentPage--;
|
|
||||||
renderPage(currentPage);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
nextBtn.addEventListener("click", function () {
|
|
||||||
if (currentPage < totalPages) {
|
|
||||||
currentPage++;
|
|
||||||
renderPage(currentPage);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
document.addEventListener("keydown", function (e) {
|
|
||||||
if (e.key === "ArrowLeft" && currentPage > 1) {
|
|
||||||
currentPage--;
|
|
||||||
renderPage(currentPage);
|
|
||||||
} else if (
|
|
||||||
e.key === "ArrowRight" &&
|
|
||||||
currentPage < totalPages
|
|
||||||
) {
|
|
||||||
currentPage++;
|
|
||||||
renderPage(currentPage);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
loadPDF();
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
@ -1,196 +0,0 @@
|
|||||||
<!doctype html>
|
|
||||||
<html>
|
|
||||||
<head>
|
|
||||||
<title>PDF Presentation Viewer</title>
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/3.11.174/pdf_viewer.min.css"
|
|
||||||
/>
|
|
||||||
<style>
|
|
||||||
body,
|
|
||||||
html {
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
height: 100%;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
background-color: #f0f0f0;
|
|
||||||
}
|
|
||||||
#viewerContainer {
|
|
||||||
width: 100%;
|
|
||||||
height: calc(100% - 60px);
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
#viewer {
|
|
||||||
max-width: 100%;
|
|
||||||
max-height: 100%;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
#viewer canvas {
|
|
||||||
max-width: 100%;
|
|
||||||
max-height: 100%;
|
|
||||||
object-fit: contain;
|
|
||||||
}
|
|
||||||
#navigationControls {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
padding: 10px;
|
|
||||||
background-color: #333;
|
|
||||||
width: 100%;
|
|
||||||
height: 60px;
|
|
||||||
}
|
|
||||||
.navButton {
|
|
||||||
background-color: #4caf50;
|
|
||||||
border: none;
|
|
||||||
color: white;
|
|
||||||
padding: 10px 20px;
|
|
||||||
text-align: center;
|
|
||||||
text-decoration: none;
|
|
||||||
display: inline-block;
|
|
||||||
font-size: 16px;
|
|
||||||
margin: 0 10px;
|
|
||||||
cursor: pointer;
|
|
||||||
border-radius: 5px;
|
|
||||||
}
|
|
||||||
#pageInfo {
|
|
||||||
color: white;
|
|
||||||
font-size: 16px;
|
|
||||||
margin: 0 20px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<div id="viewerContainer">
|
|
||||||
<div id="viewer" class="pdfViewer"></div>
|
|
||||||
</div>
|
|
||||||
<div id="navigationControls">
|
|
||||||
<button id="prevBtn" class="navButton">Previous</button>
|
|
||||||
<span id="pageInfo"></span>
|
|
||||||
<button id="nextBtn" class="navButton">Next</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/3.11.174/pdf.min.js"></script>
|
|
||||||
<script>
|
|
||||||
pdfjsLib.GlobalWorkerOptions.workerSrc =
|
|
||||||
"https://cdnjs.cloudflare.com/ajax/libs/pdf.js/3.11.174/pdf.worker.min.js";
|
|
||||||
|
|
||||||
document.addEventListener("DOMContentLoaded", function () {
|
|
||||||
const url = "{{ pdf_url }}";
|
|
||||||
const viewer = document.getElementById("viewer");
|
|
||||||
const prevBtn = document.getElementById("prevBtn");
|
|
||||||
const nextBtn = document.getElementById("nextBtn");
|
|
||||||
const pageInfo = document.getElementById("pageInfo");
|
|
||||||
|
|
||||||
let pdf;
|
|
||||||
let currentPage = 1;
|
|
||||||
let totalPages;
|
|
||||||
|
|
||||||
function sendInteraction(action, data) {
|
|
||||||
fetch("/pdf-interaction", {
|
|
||||||
method: "POST",
|
|
||||||
headers: {
|
|
||||||
"Content-Type": "application/json",
|
|
||||||
},
|
|
||||||
body: JSON.stringify({
|
|
||||||
action: action,
|
|
||||||
data: data,
|
|
||||||
timestamp: new Date().toISOString(),
|
|
||||||
pdfUrl: url,
|
|
||||||
}),
|
|
||||||
})
|
|
||||||
.then((response) => response.json())
|
|
||||||
.then((data) =>
|
|
||||||
console.log("Interaction logged:", data),
|
|
||||||
)
|
|
||||||
.catch((error) =>
|
|
||||||
console.error("Error logging interaction:", error),
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
function renderPage(pageNumber) {
|
|
||||||
pdf.getPage(pageNumber).then(function (page) {
|
|
||||||
const scale = 1.5;
|
|
||||||
const viewport = page.getViewport({ scale: scale });
|
|
||||||
|
|
||||||
const canvas = document.createElement("canvas");
|
|
||||||
const context = canvas.getContext("2d");
|
|
||||||
canvas.height = viewport.height;
|
|
||||||
canvas.width = viewport.width;
|
|
||||||
|
|
||||||
const renderContext = {
|
|
||||||
canvasContext: context,
|
|
||||||
viewport: viewport,
|
|
||||||
};
|
|
||||||
|
|
||||||
viewer.innerHTML = "";
|
|
||||||
viewer.appendChild(canvas);
|
|
||||||
|
|
||||||
page.render(renderContext);
|
|
||||||
updatePageInfo();
|
|
||||||
sendInteraction("pageView", { page: pageNumber });
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function updatePageInfo() {
|
|
||||||
pageInfo.textContent = `Page ${currentPage} of ${totalPages}`;
|
|
||||||
}
|
|
||||||
|
|
||||||
function loadPDF() {
|
|
||||||
pdfjsLib
|
|
||||||
.getDocument(url)
|
|
||||||
.promise.then(function (pdfDoc) {
|
|
||||||
pdf = pdfDoc;
|
|
||||||
totalPages = pdf.numPages;
|
|
||||||
renderPage(currentPage);
|
|
||||||
sendInteraction("pdfLoaded", {
|
|
||||||
totalPages: totalPages,
|
|
||||||
});
|
|
||||||
})
|
|
||||||
.catch(function (error) {
|
|
||||||
console.error("Error loading PDF:", error);
|
|
||||||
sendInteraction("error", {
|
|
||||||
message: error.message,
|
|
||||||
});
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
prevBtn.addEventListener("click", function () {
|
|
||||||
if (currentPage > 1) {
|
|
||||||
currentPage--;
|
|
||||||
renderPage(currentPage);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
nextBtn.addEventListener("click", function () {
|
|
||||||
if (currentPage < totalPages) {
|
|
||||||
currentPage++;
|
|
||||||
renderPage(currentPage);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
document.addEventListener("keydown", function (e) {
|
|
||||||
if (e.key === "ArrowLeft" && currentPage > 1) {
|
|
||||||
currentPage--;
|
|
||||||
renderPage(currentPage);
|
|
||||||
} else if (
|
|
||||||
e.key === "ArrowRight" &&
|
|
||||||
currentPage < totalPages
|
|
||||||
) {
|
|
||||||
currentPage++;
|
|
||||||
renderPage(currentPage);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
loadPDF();
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
@ -7,8 +7,9 @@ from fastapi.responses import (
|
|||||||
)
|
)
|
||||||
from infoserver.dependencies import Dependencies
|
from infoserver.dependencies import Dependencies
|
||||||
from infoserver.router_login import router_login
|
from infoserver.router_login import router_login
|
||||||
from infoserver.router_pdf import router_pdf
|
from infoserver.router_pdf_preso import router_pdf
|
||||||
from infoserver.router_static import router_static
|
from infoserver.router_static import router_static
|
||||||
|
from infoserver.router_template import router_template
|
||||||
from jwt.exceptions import PyJWTError
|
from jwt.exceptions import PyJWTError
|
||||||
from starlette.middleware.sessions import SessionMiddleware
|
from starlette.middleware.sessions import SessionMiddleware
|
||||||
|
|
||||||
@ -16,10 +17,16 @@ from starlette.middleware.sessions import SessionMiddleware
|
|||||||
DB_PATH = '~/code/git.ourworld.tf/freeflowuniverse/heroweb/authdb_example'
|
DB_PATH = '~/code/git.ourworld.tf/freeflowuniverse/heroweb/authdb_example'
|
||||||
TEMPLATES_DIR = '~/code/git.ourworld.tf/freeflowuniverse/heroweb/poc/out'
|
TEMPLATES_DIR = '~/code/git.ourworld.tf/freeflowuniverse/heroweb/poc/out'
|
||||||
STATIC_DIR = '~/code/git.ourworld.tf/freeflowuniverse/heroweb/poc/static'
|
STATIC_DIR = '~/code/git.ourworld.tf/freeflowuniverse/heroweb/poc/static'
|
||||||
|
HEROWEB_DIR = '~/code/git.ourworld.tf/tfgrid/info_tfgrid/heroweb'
|
||||||
|
COLLECTIONS_DIR = '~/hero/var/collections'
|
||||||
|
|
||||||
DB_PATH = os.path.abspath(os.path.expanduser(DB_PATH))
|
DB_PATH = os.path.abspath(os.path.expanduser(DB_PATH))
|
||||||
TEMPLATES_DIR = os.path.abspath(os.path.expanduser(TEMPLATES_DIR))
|
TEMPLATES_DIR = os.path.abspath(os.path.expanduser(TEMPLATES_DIR))
|
||||||
STATIC_DIR = os.path.abspath(os.path.expanduser(STATIC_DIR))
|
STATIC_DIR = os.path.abspath(os.path.expanduser(STATIC_DIR))
|
||||||
|
HEROWEB_DIR = os.path.abspath(os.path.expanduser(HEROWEB_DIR))
|
||||||
|
COLLECTIONS_DIR = os.path.abspath(os.path.expanduser(COLLECTIONS_DIR))
|
||||||
|
|
||||||
|
SERVERHOST = 'http://localhost:8000'
|
||||||
|
|
||||||
if not os.path.exists(DB_PATH):
|
if not os.path.exists(DB_PATH):
|
||||||
raise FileNotFoundError(f'Database path does not exist: {DB_PATH}')
|
raise FileNotFoundError(f'Database path does not exist: {DB_PATH}')
|
||||||
@ -41,10 +48,12 @@ app.add_middleware(SessionMiddleware, secret_key=jwt_secret_key)
|
|||||||
# Include your routers here
|
# Include your routers here
|
||||||
app.include_router(router_login)
|
app.include_router(router_login)
|
||||||
app.include_router(router_pdf)
|
app.include_router(router_pdf)
|
||||||
# app.include_router(router_template)
|
|
||||||
app.include_router(router_static)
|
app.include_router(router_static)
|
||||||
|
app.include_router(router_template)
|
||||||
|
|
||||||
deps = Dependencies(DB_PATH, TEMPLATES_DIR, STATIC_DIR)
|
deps = Dependencies(
|
||||||
|
DB_PATH, TEMPLATES_DIR, STATIC_DIR, HEROWEB_DIR, COLLECTIONS_DIR, SERVERHOST
|
||||||
|
)
|
||||||
app.deps = deps
|
app.deps = deps
|
||||||
|
|
||||||
|
|
||||||
@ -72,7 +81,8 @@ async def check_authentication(
|
|||||||
jwt_handler = request.app.deps.jwt_handler
|
jwt_handler = request.app.deps.jwt_handler
|
||||||
try:
|
try:
|
||||||
email = jwt_handler.verify_access_token(token)
|
email = jwt_handler.verify_access_token(token)
|
||||||
except PyJWTError:
|
except PyJWTError as e:
|
||||||
|
print(e)
|
||||||
return RedirectResponse(url='/signup')
|
return RedirectResponse(url='/signup')
|
||||||
|
|
||||||
request.state.email = email
|
request.state.email = email
|
||||||
|
|||||||
0
poc/static/slides/test/slide_001.txt
Normal file
0
poc/static/slides/test/slide_001.txt
Normal file
0
poc/static/slides/test/slide_002.txt
Normal file
0
poc/static/slides/test/slide_002.txt
Normal file
0
poc/static/slides/test/slide_003.txt
Normal file
0
poc/static/slides/test/slide_003.txt
Normal file
22
poc/static/slides/test/slide_004.txt
Normal file
22
poc/static/slides/test/slide_004.txt
Normal file
@ -0,0 +1,22 @@
|
|||||||
|
The world forgot how to effective use hardware capabilities
|
||||||
|
Why
|
||||||
|
|
||||||
|
Education:
|
||||||
|
- Too influenced by large SW IT vendors
|
||||||
|
- Focus on slow high level languages
|
||||||
|
- Lots of development paradigms which don’t help (OO, …)
|
||||||
|
- Basically we created our own layered complex ecosystem of software tools
|
||||||
|
|
||||||
|
High Tech Startup Companies:
|
||||||
|
- Rewarded to execute on a painkiller approach (easier to improve a single pain point area, in stead of going to the root cause & reinvent all)
|
||||||
|
- Market does not like radical changes, as startup it could be too risky.
|
||||||
|
|
||||||
|
Large IT Companies (IBM, Dell, …)
|
||||||
|
- They get their technology mainly through acquisitions.
|
||||||
|
- These acquisitions are expensive,
|
||||||
|
- they need to be integrated & return their investment cost.
|
||||||
|
- This results in hundreds of layers on top of each other.
|
||||||
|
- Politics: easier to build layer on top of other layer in stead of rewriting the stack.
|
||||||
|
|
||||||
|
|
||||||
|
‹#›
|
||||||
0
poc/static/slides/test/slide_005.txt
Normal file
0
poc/static/slides/test/slide_005.txt
Normal file
0
poc/static/slides/test/slide_006.txt
Normal file
0
poc/static/slides/test/slide_006.txt
Normal file
0
poc/static/slides/test/slide_007.txt
Normal file
0
poc/static/slides/test/slide_007.txt
Normal file
0
poc/static/slides/test/slide_008.txt
Normal file
0
poc/static/slides/test/slide_008.txt
Normal file
0
poc/static/slides/test/slide_009.txt
Normal file
0
poc/static/slides/test/slide_009.txt
Normal file
22
poc/static/slides/test/slide_010.txt
Normal file
22
poc/static/slides/test/slide_010.txt
Normal file
@ -0,0 +1,22 @@
|
|||||||
|
The world forgot how to effective use hardware capabilities
|
||||||
|
Why
|
||||||
|
|
||||||
|
Education:
|
||||||
|
- Too influenced by large SW IT vendors
|
||||||
|
- Focus on slow high level languages
|
||||||
|
- Lots of development paradigms which don’t help (OO, …)
|
||||||
|
- Basically we created our own layered complex ecosystem of software tools
|
||||||
|
|
||||||
|
High Tech Startup Companies:
|
||||||
|
- Rewarded to execute on a painkiller approach (easier to improve a single pain point area, in stead of going to the root cause & reinvent all)
|
||||||
|
- Market does not like radical changes, as startup it could be too risky.
|
||||||
|
|
||||||
|
Large IT Companies (IBM, Dell, …)
|
||||||
|
- They get their technology mainly through acquisitions.
|
||||||
|
- These acquisitions are expensive,
|
||||||
|
- they need to be integrated & return their investment cost.
|
||||||
|
- This results in hundreds of layers on top of each other.
|
||||||
|
- Politics: easier to build layer on top of other layer in stead of rewriting the stack.
|
||||||
|
|
||||||
|
|
||||||
|
‹#›
|
||||||
0
poc/static/slides/test/slide_011.txt
Normal file
0
poc/static/slides/test/slide_011.txt
Normal file
0
poc/static/slides/test/slide_012.txt
Normal file
0
poc/static/slides/test/slide_012.txt
Normal file
0
poc/static/slides/test/slide_013.txt
Normal file
0
poc/static/slides/test/slide_013.txt
Normal file
0
poc/static/slides/test/slide_014.txt
Normal file
0
poc/static/slides/test/slide_014.txt
Normal file
0
poc/static/slides/test/slide_015.txt
Normal file
0
poc/static/slides/test/slide_015.txt
Normal file
0
poc/static/slides/test/slide_016.txt
Normal file
0
poc/static/slides/test/slide_016.txt
Normal file
0
poc/static/slides/test/slide_017.txt
Normal file
0
poc/static/slides/test/slide_017.txt
Normal file
0
poc/static/slides/test/slide_018.txt
Normal file
0
poc/static/slides/test/slide_018.txt
Normal file
22
poc/static/slides/test/slide_019.txt
Normal file
22
poc/static/slides/test/slide_019.txt
Normal file
@ -0,0 +1,22 @@
|
|||||||
|
The world forgot how to effective use hardware capabilities
|
||||||
|
Why
|
||||||
|
|
||||||
|
Education:
|
||||||
|
- Too influenced by large SW IT vendors
|
||||||
|
- Focus on slow high level languages
|
||||||
|
- Lots of development paradigms which don’t help (OO, …)
|
||||||
|
- Basically we created our own layered complex ecosystem of software tools
|
||||||
|
|
||||||
|
High Tech Startup Companies:
|
||||||
|
- Rewarded to execute on a painkiller approach (easier to improve a single pain point area, in stead of going to the root cause & reinvent all)
|
||||||
|
- Market does not like radical changes, as startup it could be too risky.
|
||||||
|
|
||||||
|
Large IT Companies (IBM, Dell, …)
|
||||||
|
- They get their technology mainly through acquisitions.
|
||||||
|
- These acquisitions are expensive,
|
||||||
|
- they need to be integrated & return their investment cost.
|
||||||
|
- This results in hundreds of layers on top of each other.
|
||||||
|
- Politics: easier to build layer on top of other layer in stead of rewriting the stack.
|
||||||
|
|
||||||
|
|
||||||
|
‹#›
|
||||||
0
poc/static/slides/test/slide_020.txt
Normal file
0
poc/static/slides/test/slide_020.txt
Normal file
0
poc/static/slides/test/slide_021.txt
Normal file
0
poc/static/slides/test/slide_021.txt
Normal file
0
poc/static/slides/test/slide_022.txt
Normal file
0
poc/static/slides/test/slide_022.txt
Normal file
0
poc/static/slides/test/slide_023.txt
Normal file
0
poc/static/slides/test/slide_023.txt
Normal file
0
poc/static/slides/test/slide_024.txt
Normal file
0
poc/static/slides/test/slide_024.txt
Normal file
0
poc/static/slides/test/slide_025.txt
Normal file
0
poc/static/slides/test/slide_025.txt
Normal file
0
poc/static/slides/test/slide_026.txt
Normal file
0
poc/static/slides/test/slide_026.txt
Normal file
22
poc/static/slides/test/slide_027.txt
Normal file
22
poc/static/slides/test/slide_027.txt
Normal file
@ -0,0 +1,22 @@
|
|||||||
|
The world forgot how to effective use hardware capabilities
|
||||||
|
Why
|
||||||
|
|
||||||
|
Education:
|
||||||
|
- Too influenced by large SW IT vendors
|
||||||
|
- Focus on slow high level languages
|
||||||
|
- Lots of development paradigms which don’t help (OO, …)
|
||||||
|
- Basically we created our own layered complex ecosystem of software tools
|
||||||
|
|
||||||
|
High Tech Startup Companies:
|
||||||
|
- Rewarded to execute on a painkiller approach (easier to improve a single pain point area, in stead of going to the root cause & reinvent all)
|
||||||
|
- Market does not like radical changes, as startup it could be too risky.
|
||||||
|
|
||||||
|
Large IT Companies (IBM, Dell, …)
|
||||||
|
- They get their technology mainly through acquisitions.
|
||||||
|
- These acquisitions are expensive,
|
||||||
|
- they need to be integrated & return their investment cost.
|
||||||
|
- This results in hundreds of layers on top of each other.
|
||||||
|
- Politics: easier to build layer on top of other layer in stead of rewriting the stack.
|
||||||
|
|
||||||
|
|
||||||
|
‹#›
|
||||||
0
poc/static/slides/test/slide_028.txt
Normal file
0
poc/static/slides/test/slide_028.txt
Normal file
0
poc/static/slides/test/slide_029.txt
Normal file
0
poc/static/slides/test/slide_029.txt
Normal file
0
poc/static/slides/test/slide_030.txt
Normal file
0
poc/static/slides/test/slide_030.txt
Normal file
0
poc/static/slides/test/slide_031.txt
Normal file
0
poc/static/slides/test/slide_031.txt
Normal file
0
poc/static/slides/test/slide_032.txt
Normal file
0
poc/static/slides/test/slide_032.txt
Normal file
1
poc/static/slides/test/slide_033.txt
Normal file
1
poc/static/slides/test/slide_033.txt
Normal file
@ -0,0 +1 @@
|
|||||||
|
depin1
|
||||||
Loading…
Reference in New Issue
Block a user