]> git.proxmox.com Git - mirror_novnc.git/blame - vnc_lite.html
Change some attributes to arguments
[mirror_novnc.git] / vnc_lite.html
CommitLineData
40f281eb 1<!DOCTYPE html>
91308399 2<html>
e84101b3
3<head>
4
82744aa8 5 <!--
83391ffc 6 noVNC example: lightweight example using minimal UI and features
d58f8b51 7 Copyright (C) 2012 Joel Martin
0019d3b0 8 Copyright (C) 2013 Samuel Mannehed for Cendio AB
1d728ace 9 noVNC is licensed under the MPL 2.0 (see LICENSE.txt)
d58f8b51 10 This file is licensed under the 2-Clause BSD license (see LICENSE.txt).
d595e656
JM
11
12 Connect parameters are provided in query string:
26586b9d 13 http://example.com/?host=HOST&port=PORT&encrypt=1
494b407a 14 or the fragment:
26586b9d 15 http://example.com/#host=HOST&port=PORT&encrypt=1
d595e656 16 -->
e84101b3
17 <title>noVNC</title>
18
33f5d3bd
19 <meta charset="utf-8">
20
e84101b3
21 <!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame
22 Remove this if you use the .htaccess -->
33f5d3bd
23 <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
24
7569cdc2
SR
25 <!-- Icons (see Makefile for what the sizes are for) -->
26 <link rel="icon" sizes="16x16" type="image/png" href="app/images/icons/novnc-16x16.png">
27 <link rel="icon" sizes="24x24" type="image/png" href="app/images/icons/novnc-24x24.png">
28 <link rel="icon" sizes="32x32" type="image/png" href="app/images/icons/novnc-32x32.png">
29 <link rel="icon" sizes="48x48" type="image/png" href="app/images/icons/novnc-48x48.png">
30 <link rel="icon" sizes="60x60" type="image/png" href="app/images/icons/novnc-60x60.png">
31 <link rel="icon" sizes="64x64" type="image/png" href="app/images/icons/novnc-64x64.png">
32 <link rel="icon" sizes="72x72" type="image/png" href="app/images/icons/novnc-72x72.png">
33 <link rel="icon" sizes="76x76" type="image/png" href="app/images/icons/novnc-76x76.png">
34 <link rel="icon" sizes="96x96" type="image/png" href="app/images/icons/novnc-96x96.png">
35 <link rel="icon" sizes="120x120" type="image/png" href="app/images/icons/novnc-120x120.png">
36 <link rel="icon" sizes="144x144" type="image/png" href="app/images/icons/novnc-144x144.png">
37 <link rel="icon" sizes="152x152" type="image/png" href="app/images/icons/novnc-152x152.png">
38 <link rel="icon" sizes="192x192" type="image/png" href="app/images/icons/novnc-192x192.png">
39 <link rel="icon" sizes="any" type="image/svg+xml" href="app/images/icons/novnc-icon.svg">
40 <!-- Repeated last so that legacy handling will pick this -->
41 <link rel="icon" sizes="16x16" type="image/png" href="app/images/icons/novnc-16x16.png">
42
33f5d3bd
43 <!-- Apple iOS Safari settings -->
44 <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
45 <meta name="apple-mobile-web-app-capable" content="yes" />
46 <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
7569cdc2
SR
47 <!-- Home Screen Icons (favourites and bookmarks use the normal icons) -->
48 <link rel="apple-touch-icon" sizes="60x60" type="image/png" href="app/images/icons/novnc-60x60.png">
49 <link rel="apple-touch-icon" sizes="76x76" type="image/png" href="app/images/icons/novnc-76x76.png">
50 <link rel="apple-touch-icon" sizes="120x120" type="image/png" href="app/images/icons/novnc-120x120.png">
51 <link rel="apple-touch-icon" sizes="152x152" type="image/png" href="app/images/icons/novnc-152x152.png">
e84101b3
52
53 <!-- Stylesheets -->
83391ffc 54 <link rel="stylesheet" href="app/styles/lite.css">
e84101b3
55
56 <!--
57 <script type='text/javascript'
58 src='http://getfirebug.com/releases/lite/1.2/firebug-lite-compressed.js'></script>
59 -->
8db09746 60
7569cdc2
SR
61 <!-- promise polyfills promises for IE11 -->
62 <script src="vendor/promise.js"></script>
14ecdc62
FC
63 <!-- ES2015/ES6 modules polyfill -->
64 <script type="module">
65 window._noVNC_has_module_support = true;
66 </script>
67 <script>
68 window.addEventListener("load", function() {
69 if (window._noVNC_has_module_support) return;
70 var loader = document.createElement("script");
71 loader.src = "vendor/browser-es-module-loader/dist/browser-es-module-loader.js";
72 document.head.appendChild(loader);
73 });
74 </script>
75
76 <!-- actual script modules -->
bf826444 77 <script type="module" crossorigin="anonymous">
6f4b1e40 78 // Load supporting scripts
7569cdc2
SR
79 import * as WebUtil from './app/webutil.js';
80 import RFB from './core/rfb.js';
6f4b1e40 81
8db09746 82 var rfb;
832be262 83 var doneInitialResize;
f8b399d7 84 var resizeTimeout;
3bb12056 85 var desktopName;
8db09746 86
f8b399d7 87 function UIresize() {
494b407a 88 if (WebUtil.getConfigVar('resize', false)) {
f8b399d7 89 var innerW = window.innerWidth;
90 var innerH = window.innerHeight;
ae510306 91 var controlbarH = document.getElementById('noVNC_status_bar').offsetHeight;
f8b399d7 92 if (innerW !== undefined && innerH !== undefined)
67453ade 93 rfb.requestDesktopSize(innerW, innerH - controlbarH);
f8b399d7 94 }
95 }
832be262
PO
96 function initialResize() {
97 if (doneInitialResize) return;
f8b399d7 98 UIresize();
832be262 99 doneInitialResize = true;
f8b399d7 100 }
3bb12056
SM
101 function updateDesktopName(rfb, name) {
102 desktopName = name;
103 }
430f00d6 104 function credentials(rfb, types) {
7d714b15 105 var html;
c464f47e 106
7569cdc2
SR
107 var form = document.createElement('form');
108 form.style = 'margin-bottom: 0px';
109 form.innerHTML = '<label></label>'
110 form.innerHTML += '<input type=password size=10 id="password_input" class="noVNC_status">';
111 form.onsubmit = setPassword;
6048299a
SR
112
113 // bypass status() because it sets text content
114 document.getElementById('noVNC_status_bar').setAttribute("class", "noVNC_status_warn");
7569cdc2
SR
115 document.getElementById('noVNC_status').innerHTML = '';
116 document.getElementById('noVNC_status').appendChild(form);
430f00d6 117 document.getElementById('noVNC_status').querySelector('label').textContent = 'Password Required: ';
d890e864 118 }
91308399 119 function setPassword() {
430f00d6 120 rfb.sendCredentials({ password: document.getElementById('password_input').value });
91308399
JM
121 return false;
122 }
63708ff5 123 function sendCtrlAltDel() {
8db09746 124 rfb.sendCtrlAltDel();
a8edf9d8 125 return false;
63708ff5 126 }
cd523e8f
PO
127 function machineShutdown() {
128 rfb.machineShutdown();
fb35d50f
MS
129 return false;
130 }
cd523e8f
PO
131 function machineReboot() {
132 rfb.machineReboot();
fb35d50f
MS
133 return false;
134 }
cd523e8f
PO
135 function machineReset() {
136 rfb.machineReset();
fb35d50f
MS
137 return false;
138 }
3bb12056
SM
139 function status(text, level) {
140 switch (level) {
141 case 'normal':
142 case 'warn':
143 case 'error':
144 break;
145 default:
146 level = "warn";
147 }
148 document.getElementById('noVNC_status_bar').setAttribute("class", "noVNC_status_" + level);
6048299a 149 document.getElementById('noVNC_status').textContent = text;
3bb12056
SM
150 }
151 function updateState(rfb, state, oldstate) {
152 var cad = document.getElementById('sendCtrlAltDelButton');
91308399 153 switch (state) {
3bb12056 154 case 'connecting':
3cdc603a 155 status("Connecting", "normal");
3bb12056
SM
156 break;
157 case 'connected':
832be262 158 doneInitialResize = false;
5b4e5d01
PO
159 if (WebUtil.getConfigVar('encrypt',
160 (window.location.protocol === "https:"))) {
3cdc603a 161 status("Connected (encrypted) to " +
733d5009
SM
162 desktopName, "normal");
163 } else {
3cdc603a 164 status("Connected (unencrypted) to " +
733d5009
SM
165 desktopName, "normal");
166 }
3bb12056
SM
167 break;
168 case 'disconnecting':
3cdc603a 169 status("Disconnecting", "normal");
3bb12056
SM
170 break;
171 case 'disconnected':
3cdc603a 172 status("Disconnected", "normal");
3bb12056
SM
173 break;
174 default:
175 status(state, "warn");
176 break;
91308399
JM
177 }
178
c2a4d3ef 179 if (state === 'connected') {
fb35d50f
MS
180 cad.disabled = false;
181 } else {
182 cad.disabled = true;
cd523e8f 183 updatePowerButtons();
fb35d50f 184 }
160fabf6 185
3bb12056
SM
186 }
187 function disconnected(rfb, reason) {
188 if (typeof(reason) !== 'undefined') {
189 status(reason, "error");
91308399 190 }
91308399 191 }
a7127fee 192 function notification(rfb, msg, level, options) {
3bb12056 193 status(msg, level);
a7127fee 194 }
91308399 195
f8b399d7 196 window.onresize = function () {
197 // When the window has been resized, wait until the size remains
198 // the same for 0.5 seconds before sending the request for changing
199 // the resolution of the session
200 clearTimeout(resizeTimeout);
201 resizeTimeout = setTimeout(function(){
202 UIresize();
203 }, 500);
204 };
205
cd523e8f
PO
206 function updatePowerButtons() {
207 var powerbuttons;
208 powerbuttons = document.getElementById('noVNC_power_buttons');
209 if (rfb.get_capabilities().power) {
210 powerbuttons.style.display = 'inline';
fb35d50f 211 } else {
cd523e8f 212 powerbuttons.style.display = 'none';
fb35d50f
MS
213 }
214 }
215
7569cdc2
SR
216 document.getElementById('sendCtrlAltDelButton').style.display = "inline";
217 document.getElementById('sendCtrlAltDelButton').onclick = sendCtrlAltDel;
cd523e8f
PO
218 document.getElementById('machineShutdownButton').onclick = machineShutdown;
219 document.getElementById('machineRebootButton').onclick = machineReboot;
220 document.getElementById('machineResetButton').onclick = machineReset;
91308399 221
7569cdc2 222 WebUtil.init_logging(WebUtil.getConfigVar('logging', 'warn'));
08cd672e 223 document.title = WebUtil.getConfigVar('title', 'noVNC');
7569cdc2
SR
224 // By default, use the host and port of server that served this file
225 var host = WebUtil.getConfigVar('host', window.location.hostname);
226 var port = WebUtil.getConfigVar('port', window.location.port);
8db09746 227
7569cdc2
SR
228 // if port == 80 (or 443) then it won't be present and should be
229 // set manually
230 if (!port) {
231 if (window.location.protocol.substring(0,5) == 'https') {
232 port = 443;
233 }
234 else if (window.location.protocol.substring(0,4) == 'http') {
235 port = 80;
e83b9e03 236 }
7569cdc2 237 }
e83b9e03 238
7569cdc2
SR
239 var password = WebUtil.getConfigVar('password', '');
240 var path = WebUtil.getConfigVar('path', 'websockify');
c55f05f6 241
7569cdc2
SR
242 // If a token variable is passed in, set the parameter in a cookie.
243 // This is used by nova-novncproxy.
244 var token = WebUtil.getConfigVar('token', null);
245 if (token) {
246 // if token is already present in the path we should use it
247 path = WebUtil.injectParamIfMissing(path, "token", token);
c55f05f6 248
7569cdc2
SR
249 WebUtil.createCookie('token', token, 1)
250 }
c55f05f6 251
7569cdc2 252 (function() {
0139b256 253
91308399 254 if ((!host) || (!port)) {
3bb12056 255 status('Must specify host and port in URL', 'error');
91308399
JM
256 }
257
d9fc1c7b 258 try {
3d7bb020
PO
259 rfb = new RFB(document.getElementById('noVNC_canvas'),
260 {'local_cursor': WebUtil.getConfigVar('cursor', true),
494b407a 261 'view_only': WebUtil.getConfigVar('view_only', false),
3bb12056 262 'onNotification': notification,
d9fc1c7b 263 'onUpdateState': updateState,
3bb12056 264 'onDisconnected': disconnected,
832be262 265 'onCapabilities': function () { updatePowerButtons(); initialResize(); },
430f00d6 266 'onCredentialsRequired': credentials,
3bb12056 267 'onDesktopName': updateDesktopName});
d9fc1c7b 268 } catch (exc) {
3bb12056 269 status('Unable to create RFB client -- ' + exc, 'error');
d9fc1c7b
SR
270 return; // don't continue trying to connect
271 }
272
5b4e5d01
PO
273 var url;
274
275 if (WebUtil.getConfigVar('encrypt',
276 (window.location.protocol === "https:"))) {
277 url = 'wss';
278 } else {
279 url = 'ws';
280 }
281
282 url += '://' + host;
283 if(port) {
284 url += ':' + port;
285 }
286 url += '/' + path;
287
3d7bb020
PO
288 rfb.connect(url, { repeaterID: WebUtil.getConfigVar('repeaterID', ''),
289 shared: WebUtil.getConfigVar('shared', true),
290 credentials: { password: password } });
7569cdc2
SR
291 })();
292 </script>
293</head>
294
295<body style="margin: 0px;">
296 <div id="noVNC_container">
297 <div id="noVNC_status_bar" class="noVNC_status_bar" style="margin-top: 0px;">
298 <table border=0 width="100%"><tr>
299 <td><div id="noVNC_status" style="position: relative; height: auto;">
300 Loading
301 </div></td>
302 <td width="1%"><div id="noVNC_buttons">
303 <input type=button value="Send CtrlAltDel"
304 id="sendCtrlAltDelButton">
cd523e8f 305 <span id="noVNC_power_buttons">
7569cdc2 306 <input type=button value="Shutdown"
cd523e8f 307 id="machineShutdownButton">
7569cdc2 308 <input type=button value="Reboot"
cd523e8f 309 id="machineRebootButton">
7569cdc2 310 <input type=button value="Reset"
cd523e8f 311 id="machineResetButton">
7569cdc2
SR
312 </span>
313 </div></td>
314 </tr></table>
315 </div>
316 <canvas id="noVNC_canvas" width="640px" height="20px">
317 Canvas not supported.
318 </canvas>
319 </div>
da6dd893 320
8db09746 321 </body>
91308399 322</html>