Compare commits
2 Commits
4b188f6079
...
b725b71c67
| Author | SHA1 | Date | |
|---|---|---|---|
| b725b71c67 | |||
| 2d120a9d72 |
@ -192,6 +192,45 @@ h2 {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
}
|
||||
|
||||
.modal-fullscreen {
|
||||
position: absolute;
|
||||
top: -1.5rem;
|
||||
right: 2.1rem;
|
||||
background: transparent;
|
||||
color: #fff;
|
||||
font-size: 1.35rem;
|
||||
line-height: 1;
|
||||
padding: 0 0.4rem;
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
border: none;
|
||||
font-family: inherit;
|
||||
}
|
||||
|
||||
.modal-fullscreen:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
}
|
||||
|
||||
/* Reposition controls inside the box when in fullscreen */
|
||||
.modal-box:fullscreen,
|
||||
.modal-box:-webkit-full-screen {
|
||||
border-radius: 0;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
}
|
||||
|
||||
.modal-box:fullscreen .modal-close,
|
||||
.modal-box:-webkit-full-screen .modal-close {
|
||||
top: 0.5rem;
|
||||
right: 0.5rem;
|
||||
}
|
||||
|
||||
.modal-box:fullscreen .modal-fullscreen,
|
||||
.modal-box:-webkit-full-screen .modal-fullscreen {
|
||||
top: 0.5rem;
|
||||
right: 3rem;
|
||||
}
|
||||
|
||||
#modal-video {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
@ -52,7 +52,7 @@
|
||||
<h3 class="card-title">{{ t.card3_title }}</h3>
|
||||
<p class="card-text">{{ t.card3_text }}</p>
|
||||
</div>
|
||||
<div class="action-card" data-action="pdf" data-src="/resources/AI_Agro_Support.pdf">
|
||||
<div class="action-card" data-action="iframe" data-src="https://docs.google.com/presentation/d/1YEIr3WEGZccl-NXYo-V3IWj8-fsljsBsEeBOBx_yESM/embed?start=false&loop=false">
|
||||
<div class="card-icon">
|
||||
<img src="/resources/assistente-virtuale.png" alt="Assistente Virtuale Icon" width="100%" height="100%"/>
|
||||
</div>
|
||||
@ -64,6 +64,7 @@
|
||||
<!-- Shared modal overlay -->
|
||||
<div id="modal" class="modal hidden" role="dialog" aria-modal="true">
|
||||
<div class="modal-box">
|
||||
<button class="modal-fullscreen" id="modal-fullscreen" aria-label="Toggle fullscreen">⛶</button>
|
||||
<button class="modal-close" id="modal-close" aria-label="{{ t.close_label }}">×</button>
|
||||
<video id="modal-video" controls></video>
|
||||
<iframe id="modal-iframe" src="" allowfullscreen></iframe>
|
||||
@ -77,6 +78,8 @@
|
||||
const modalIframe = document.getElementById('modal-iframe');
|
||||
const modalPdf = document.getElementById('modal-pdf');
|
||||
const closeBtn = document.getElementById('modal-close');
|
||||
const fullscreenBtn = document.getElementById('modal-fullscreen');
|
||||
const modalBox = document.querySelector('.modal-box');
|
||||
|
||||
function openModal(action, src) {
|
||||
if (action === 'video') {
|
||||
@ -99,6 +102,7 @@
|
||||
}
|
||||
|
||||
function closeModal() {
|
||||
if (document.fullscreenElement) document.exitFullscreen();
|
||||
modal.classList.add('hidden');
|
||||
modalVideo.pause();
|
||||
modalVideo.src = '';
|
||||
@ -106,6 +110,18 @@
|
||||
modalPdf.src = '';
|
||||
}
|
||||
|
||||
fullscreenBtn.addEventListener('click', () => {
|
||||
if (!document.fullscreenElement) {
|
||||
modalBox.requestFullscreen();
|
||||
} else {
|
||||
document.exitFullscreen();
|
||||
}
|
||||
});
|
||||
|
||||
document.addEventListener('fullscreenchange', () => {
|
||||
fullscreenBtn.textContent = document.fullscreenElement ? '⊡' : '⛶';
|
||||
});
|
||||
|
||||
document.querySelectorAll('[data-action]').forEach(btn => {
|
||||
btn.addEventListener('click', () => openModal(btn.dataset.action, btn.dataset.src));
|
||||
});
|
||||
|
||||
@ -3,7 +3,7 @@ strings = {
|
||||
"subtitle": "Digital innovation for agriculture",
|
||||
"card1_title": "Phenological recognition",
|
||||
"card1_text": "Using the camera from the sentinel station, and AI models, we can recognize the phenological stage of the plant.",
|
||||
"card1_src": "http://localhost/viewer?userId=1398&lang=en-US",
|
||||
"card1_src": "http://192.168.220.90:8081/wapp_test/camera/viewer?token=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyX2lkIjoxMzk4fQ.55_rm-9B5TTUrrEJlKqQU0wlV4BDFf-musapqYKH42A&lang=en-US",
|
||||
"card2_title": "Digital field notebook - operations",
|
||||
"card2_text": "Forget about writing down the operations carried out in the field by hand. Using AI and voice recognition, you can simply speak to the virtual assistant and it will transcribe everything for you.",
|
||||
"card3_title": "Digital field notebook - warehouse",
|
||||
|
||||
@ -3,7 +3,7 @@ strings = {
|
||||
"subtitle": "Innovazione digitale per l'agricoltura",
|
||||
"card1_title": "Riconoscimento fenologico",
|
||||
"card1_text": "Grazie alla telecamera della stazione di monitoraggio e ai modelli di intelligenza artificiale, siamo in grado di riconoscere lo stadio fenologico della pianta.",
|
||||
"card1_src": "http://localhost/viewer?userId=1398&lang=it-IT",
|
||||
"card1_src": "http://192.168.220.90:8081/wapp_test/camera/viewer?token=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyX2lkIjoxMzk4fQ.55_rm-9B5TTUrrEJlKqQU0wlV4BDFf-musapqYKH42A&lang=it-IT",
|
||||
"card2_title": "Quaderno di campagna digitale - operazioni",
|
||||
"card2_text": "Non dovrai più annotare a mano le operazioni eseguite in campo. Grazie all'intelligenza artificiale e al riconoscimento vocale, ti basterà dettare le operazioni all'assistente virtuale.",
|
||||
"card3_title": "Quaderno di campagna digitale - magazzino",
|
||||
|
||||
Loading…
Reference in New Issue
Block a user