<!DOCTYPE html>
<html lang="id">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<title>ADL Hitung Workspace</title>
<style>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
html, body {
width: 100%;
height: 100%;
overflow: hidden;
background-color: #0d1117;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}
/* Loading overlay halus saat pertama kali memuat dari Apps Script */
#loadingOverlay {
position: fixed;
inset: 0;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background-color: #0d1117;
color: #f0f6fc;
z-index: 99;
transition: opacity 0.35s ease, visibility 0.35s ease;
}
.spinner {
width: 38px;
height: 38px;
border: 3px solid rgba(59, 130, 246, 0.2);
border-top-color: #3b82f6;
border-radius: 50%;
animation: spin 0.8s linear infinite;
margin-bottom: 14px;
}
.loading-text {
font-size: 0.88rem;
font-weight: 500;
color: #8b949e;
letter-spacing: 0.02em;
}
@keyframes spin {
to { transform: rotate(360deg); }
}
/* Frame Web App Apps Script Full-Viewport */
#appFrame {
width: 100%;
height: 100%;
border: none;
display: block;
background-color: transparent;
}
</style>
</head>
<body>
<!-- Loading State -->
<div id="loadingOverlay">
<div class="spinner"></div>
<div class="loading-text">Memuat ADL Hitung...</div>
</div>
<!-- Realtime Dynamic Apps Script Loader -->
<iframe
id="appFrame"
src=""
allow="clipboard-read; clipboard-write"
sandbox="allow-scripts allow-same-origin allow-forms allow-popups allow-modals">
</iframe>
<script>
/**
* MASUKKAN URL WEB APP APPS SCRIPT ANDA DI SINI:
* Contoh: https://script.google.com/macros/s/AKfycbxXXXXXXXXXXXXX/exec
*/
const APPS_SCRIPT_URL = "https://script.google.com/macros/s/AKfycbyPdz-80IrcQf5C1FicIXM44yDYmwe6RyDZDpQJbEE84gsBYoD2lwJ28a0dEb2e9ke-/exec";
const frame = document.getElementById('appFrame');
const loading = document.getElementById('loadingOverlay');
// Menghubungkan langsung ke Apps Script dengan cache-busting agar selalu mendapatkan revisi terbaru
frame.src = APPS_SCRIPT_URL + (APPS_SCRIPT_URL.includes('?') ? '&' : '?') + 't=' + new Date().getTime();
// Sembunyikan loading spinner begitu halaman dari Apps Script selesai dimuat
frame.onload = function() {
loading.style.opacity = '0';
loading.style.visibility = 'hidden';
};
</script>
</body>
</html>