rdp-proxy: show overlay only after connect, remove waiting phase
This commit is contained in:
+5
-35
@@ -40,7 +40,6 @@ cat > /opt/portal/index.html <<HTML
|
||||
animation:spin .9s linear infinite;
|
||||
}
|
||||
.co-title{color:#dce8f5;font:600 1.1rem/1.4 sans-serif;text-align:center;letter-spacing:.01em}
|
||||
.co-timer{color:#6a8aaa;font:400 .85rem sans-serif;min-height:1.2em}
|
||||
.co-bar-wrap{
|
||||
width:280px;height:4px;background:rgba(220,232,245,.1);
|
||||
border-radius:99px;overflow:hidden;
|
||||
@@ -71,12 +70,11 @@ cat > /opt/portal/index.html <<HTML
|
||||
</head>
|
||||
<body>
|
||||
<div id="screen"></div>
|
||||
<div id="co">
|
||||
<div id="co" style="display:none">
|
||||
<div class="co-inner">
|
||||
<div class="co-ring"></div>
|
||||
<div class="co-title" id="co-title">Подключение к рабочему столу...</div>
|
||||
<div class="co-timer" id="co-timer"></div>
|
||||
<div class="co-bar-wrap" id="co-bar-wrap" style="display:none">
|
||||
<div class="co-title">Устанавливается соединение с рабочим столом...</div>
|
||||
<div class="co-bar-wrap">
|
||||
<div class="co-bar" id="co-bar"></div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -93,9 +91,6 @@ cat > /opt/portal/index.html <<HTML
|
||||
const wsUrl = (location.protocol === 'https:' ? 'wss://' : 'ws://') + location.host + wsBase + '/websockify';
|
||||
const statusEl = document.getElementById('status');
|
||||
const coEl = document.getElementById('co');
|
||||
const coTitleEl = document.getElementById('co-title');
|
||||
const coTimerEl = document.getElementById('co-timer');
|
||||
const coBarWrap = document.getElementById('co-bar-wrap');
|
||||
const coBar = document.getElementById('co-bar');
|
||||
const XK_ALT_L = 0xffe9;
|
||||
const XK_LEFT = 0xff51;
|
||||
@@ -107,37 +102,14 @@ cat > /opt/portal/index.html <<HTML
|
||||
const MAX_RECONNECT = 12;
|
||||
const DELAYS = [1000,2000,3000,5000,8000];
|
||||
let manualDisconnect = false;
|
||||
let timerInterval = null;
|
||||
let timerStart = 0;
|
||||
|
||||
function startTimer() {
|
||||
timerStart = Date.now();
|
||||
clearInterval(timerInterval);
|
||||
timerInterval = setInterval(() => {
|
||||
const s = Math.floor((Date.now() - timerStart) / 1000);
|
||||
coTimerEl.textContent = s + ' сек';
|
||||
}, 500);
|
||||
}
|
||||
|
||||
function showOverlayWaiting() {
|
||||
coTitleEl.textContent = 'Подключение к рабочему столу...';
|
||||
coTimerEl.textContent = '0 сек';
|
||||
coBarWrap.style.display = 'none';
|
||||
function showOverlayConnecting() {
|
||||
coBar.style.transition = 'none';
|
||||
coBar.style.width = '0%';
|
||||
coEl.style.opacity = '1';
|
||||
coEl.style.display = 'flex';
|
||||
coEl.classList.remove('hidden');
|
||||
statusEl.style.display = 'none';
|
||||
startTimer();
|
||||
}
|
||||
|
||||
function showOverlayConnecting() {
|
||||
clearInterval(timerInterval);
|
||||
coTitleEl.textContent = 'Устанавливается соединение с рабочим столом...';
|
||||
coTimerEl.textContent = '';
|
||||
coBarWrap.style.display = 'block';
|
||||
coBar.style.transition = 'none';
|
||||
coBar.style.width = '0%';
|
||||
requestAnimationFrame(() => requestAnimationFrame(() => {
|
||||
coBar.style.transition = 'width 5.8s cubic-bezier(0.25,0.46,0.45,0.94)';
|
||||
coBar.style.width = '100%';
|
||||
@@ -146,7 +118,6 @@ cat > /opt/portal/index.html <<HTML
|
||||
}
|
||||
|
||||
function hideOverlay() {
|
||||
clearInterval(timerInterval);
|
||||
coEl.classList.add('hidden');
|
||||
setTimeout(() => { coEl.style.display = 'none'; }, 520);
|
||||
}
|
||||
@@ -176,7 +147,6 @@ cat > /opt/portal/index.html <<HTML
|
||||
if (manualDisconnect) return;
|
||||
connected = false;
|
||||
hideStatus();
|
||||
showOverlayWaiting();
|
||||
if (rfb) { try { rfb.disconnect(); } catch(e){} }
|
||||
rfb = new RFB(document.getElementById('screen'), wsUrl);
|
||||
rfb.viewOnly = false;
|
||||
|
||||
Reference in New Issue
Block a user