vnc_auto.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4
   5     <!--
   6     noVNC example: simple example using default UI
   7     Copyright (C) 2012 Joel Martin
   8     Copyright (C) 2013 Samuel Mannehed for Cendio AB
   9     noVNC is licensed under the MPL 2.0 (see LICENSE.txt)
  10     This file is licensed under the 2-Clause BSD license (see LICENSE.txt).
  11
  12     Connect parameters are provided in query string:
  13         http://example.com/?host=HOST&port=PORT&encrypt=1&true_color=1
  14     or the fragment:
  15         http://example.com/#host=HOST&port=PORT&encrypt=1&true_color=1
  16     -->
  17     <title>noVNC</title>
  18
  19     <meta charset="utf-8">
  20
  21     <!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame
  22                 Remove this if you use the .htaccess -->
  23     <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  24
  25     <!-- Apple iOS Safari settings -->
  26     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
  27     <meta name="apple-mobile-web-app-capable" content="yes" />
  28     <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
  29     <!-- App Start Icon  -->
  30     <link rel="apple-touch-startup-image" href="app/images/screen_320x460.png" />
  31     <!-- For iOS devices set the icon to use if user bookmarks app on their homescreen -->
  32     <link rel="apple-touch-icon" href="app/images/screen_57x57.png">
  33     <!--
  34     <link rel="apple-touch-icon-precomposed" href="app/images/screen_57x57.png" />
  35     -->
  36
  37
  38     <!-- Stylesheets -->
  39     <link rel="stylesheet" href="app/styles/auto.css">
  40
  41      <!--
  42     <script type='text/javascript'
  43         src='http://getfirebug.com/releases/lite/1.2/firebug-lite-compressed.js'></script>
  44     -->
  45         <script src="core/util.js"></script>
  46         <script src="app/webutil.js"></script>
  47 </head>
  48
  49 <body style="margin: 0px;">
  50     <div id="noVNC_container">
  51             <div id="noVNC_status_bar" class="noVNC_status_bar" style="margin-top: 0px;">
  52                 <table border=0 width="100%"><tr>
  53                     <td><div id="noVNC_status" style="position: relative; height: auto;">
  54                         Loading
  55                     </div></td>
  56                     <td width="1%"><div id="noVNC_buttons">
  57                         <input type=button value="Send CtrlAltDel"
  58                             id="sendCtrlAltDelButton">
  59                         <span id="noVNC_xvp_buttons">
  60                         <input type=button value="Shutdown"
  61                             id="xvpShutdownButton">
  62                         <input type=button value="Reboot"
  63                             id="xvpRebootButton">
  64                         <input type=button value="Reset"
  65                             id="xvpResetButton">
  66                         </span>
  67                             </div></td>
  68                 </tr></table>
  69             </div>
  70             <canvas id="noVNC_canvas" width="640px" height="20px">
  71                 Canvas not supported.
  72             </canvas>
  73         </div>
  74
  75         <script>
  76         /*jslint white: false */
  77         /*global window, $, Util, RFB, */
  78         "use strict";
  79
  80         // Load supporting scripts
  81         WebUtil.load_scripts({
  82             'core': ["base64.js", "websock.js", "des.js", "input/keysymdef.js",
  83                      "input/xtscancodes.js", "input/util.js", "input/devices.js",
  84                      "display.js", "inflator.js", "rfb.js", "input/keysym.js"]});
  85
  86         var rfb;
  87         var resizeTimeout;
  88         var desktopName;
  89
  90
  91         function UIresize() {
  92             if (WebUtil.getConfigVar('resize', false)) {
  93                 var innerW = window.innerWidth;
  94                 var innerH = window.innerHeight;
  95                 var controlbarH = document.getElementById('noVNC_status_bar').offsetHeight;
  96                 if (innerW !== undefined && innerH !== undefined)
  97                     rfb.requestDesktopSize(innerW, innerH - controlbarH);
  98             }
  99         }
 100         function FBUComplete(rfb, fbu) {
 101             UIresize();
 102             rfb.set_onFBUComplete(function() { });
 103         }
 104         function updateDesktopName(rfb, name) {
 105             desktopName = name;
 106         }
 107         function passwordRequired(rfb, msg) {
 108             if (typeof msg === 'undefined') {
 109                 msg = 'Password Required: ';
 110             }
 111             var html;
 112             html = '<form onsubmit="return setPassword();"';
 113             html += '  style="margin-bottom: 0px">';
 114             html += '<label></label>'
 115             html += '<input type=password size=10 id="password_input" class="noVNC_status">';
 116             html += '<\/form>';
 117
 118             // bypass status() because it sets text content
 119             document.getElementById('noVNC_status_bar').setAttribute("class", "noVNC_status_warn");
 120             document.getElementById('noVNC_status').innerHTML = html;
 121             document.getElementById('noVNC_status').querySelector('label').textContent = msg;
 122         }
 123         function setPassword() {
 124             rfb.sendPassword(document.getElementById('password_input').value);
 125             return false;
 126         }
 127         function sendCtrlAltDel() {
 128             rfb.sendCtrlAltDel();
 129             return false;
 130         }
 131         function xvpShutdown() {
 132             rfb.xvpShutdown();
 133             return false;
 134         }
 135         function xvpReboot() {
 136             rfb.xvpReboot();
 137             return false;
 138         }
 139         function xvpReset() {
 140             rfb.xvpReset();
 141             return false;
 142         }
 143         function status(text, level) {
 144             switch (level) {
 145                 case 'normal':
 146                 case 'warn':
 147                 case 'error':
 148                     break;
 149                 default:
 150                     level = "warn";
 151             }
 152             document.getElementById('noVNC_status_bar').setAttribute("class", "noVNC_status_" + level);
 153             document.getElementById('noVNC_status').textContent = text;
 154         }
 155         function updateState(rfb, state, oldstate) {
 156             var cad = document.getElementById('sendCtrlAltDelButton');
 157             switch (state) {
 158                 case 'connecting':
 159                     status("Connecting", "normal");
 160                     break;
 161                 case 'connected':
 162                     if (rfb && rfb.get_encrypt()) {
 163                         status("Connected (encrypted) to " +
 164                                desktopName, "normal");
 165                     } else {
 166                         status("Connected (unencrypted) to " +
 167                                desktopName, "normal");
 168                     }
 169                     break;
 170                 case 'disconnecting':
 171                     status("Disconnecting", "normal");
 172                     break;
 173                 case 'disconnected':
 174                     status("Disconnected", "normal");
 175                     break;
 176                 default:
 177                     status(state, "warn");
 178                     break;
 179             }
 180
 181             if (state === 'connected') {
 182                 cad.disabled = false;
 183             } else {
 184                 cad.disabled = true;
 185                 xvpInit(0);
 186             }
 187
 188         }
 189         function disconnected(rfb, reason) {
 190             if (typeof(reason) !== 'undefined') {
 191                 status(reason, "error");
 192             }
 193         }
 194         function notification(rfb, msg, level, options) {
 195             status(msg, level);
 196         }
 197
 198         window.onresize = function () {
 199             // When the window has been resized, wait until the size remains
 200             // the same for 0.5 seconds before sending the request for changing
 201             // the resolution of the session
 202             clearTimeout(resizeTimeout);
 203             resizeTimeout = setTimeout(function(){
 204                 UIresize();
 205             }, 500);
 206         };
 207
 208         function xvpInit(ver) {
 209             var xvpbuttons;
 210             xvpbuttons = document.getElementById('noVNC_xvp_buttons');
 211             if (ver >= 1) {
 212                 xvpbuttons.style.display = 'inline';
 213             } else {
 214                 xvpbuttons.style.display = 'none';
 215             }
 216         }
 217
 218         window.onscriptsload = function () {
 219             var host, port, password, path, token;
 220
 221             document.getElementById('sendCtrlAltDelButton').style.display = "inline";
 222             document.getElementById('sendCtrlAltDelButton').onclick = sendCtrlAltDel;
 223             document.getElementById('xvpShutdownButton').onclick = xvpShutdown;
 224             document.getElementById('xvpRebootButton').onclick = xvpReboot;
 225             document.getElementById('xvpResetButton').onclick = xvpReset;
 226
 227             WebUtil.init_logging(WebUtil.getConfigVar('logging', 'warn'));
 228             document.title = unescape(WebUtil.getConfigVar('title', 'noVNC'));
 229             // By default, use the host and port of server that served this file
 230             host = WebUtil.getConfigVar('host', window.location.hostname);
 231             port = WebUtil.getConfigVar('port', window.location.port);
 232
 233             // if port == 80 (or 443) then it won't be present and should be
 234             // set manually
 235             if (!port) {
 236                 if (window.location.protocol.substring(0,5) == 'https') {
 237                     port = 443;
 238                 }
 239                 else if (window.location.protocol.substring(0,4) == 'http') {
 240                     port = 80;
 241                 }
 242             }
 243
 244             password = WebUtil.getConfigVar('password', '');
 245             path = WebUtil.getConfigVar('path', 'websockify');
 246
 247             // If a token variable is passed in, set the parameter in a cookie.
 248             // This is used by nova-novncproxy.
 249             token = WebUtil.getConfigVar('token', null);
 250             if (token) {
 251
 252                 // if token is already present in the path we should use it
 253                 path = WebUtil.injectParamIfMissing(path, "token", token);
 254
 255                 WebUtil.createCookie('token', token, 1)
 256             }
 257
 258             if ((!host) || (!port)) {
 259                 status('Must specify host and port in URL', 'error');
 260                 return;
 261             }
 262
 263             try {
 264                 rfb = new RFB({'target':       document.getElementById('noVNC_canvas'),
 265                                'encrypt':      WebUtil.getConfigVar('encrypt',
 266                                         (window.location.protocol === "https:")),
 267                                'repeaterID':   WebUtil.getConfigVar('repeaterID', ''),
 268                                'true_color':   WebUtil.getConfigVar('true_color', true),
 269                                'local_cursor': WebUtil.getConfigVar('cursor', true),
 270                                'shared':       WebUtil.getConfigVar('shared', true),
 271                                'view_only':    WebUtil.getConfigVar('view_only', false),
 272                                'onNotification':  notification,
 273                                'onUpdateState':  updateState,
 274                                'onDisconnected': disconnected,
 275                                'onXvpInit':    xvpInit,
 276                                'onPasswordRequired':  passwordRequired,
 277                                'onFBUComplete': FBUComplete,
 278                                'onDesktopName': updateDesktopName});
 279             } catch (exc) {
 280                 status('Unable to create RFB client -- ' + exc, 'error');
 281                 return; // don't continue trying to connect
 282             }
 283
 284             rfb.connect(host, port, password, path);
 285         };
 286         </script>
 287
 288     </body>
 289 </html>