]> git.proxmox.com Git - mirror_novnc.git/commitdiff
Modifed UI. Move HTML from ui.js to vnc.html.
authorChris Gordon <snorkeyg@gmail.com>
Sun, 4 Sep 2011 23:46:13 +0000 (09:46 +1000)
committerJoel Martin <github@martintribe.org>
Thu, 8 Sep 2011 13:26:30 +0000 (08:26 -0500)
include/black.css
include/input.js
include/rfb.js
include/ui.js
vnc.html

index 3f95b88d209d6d734dfbec6f5db383e7d4c0407d..201d441ab595f70bc7b75227b4911eb9e173221a 100644 (file)
@@ -1,124 +1,9 @@
-body {
-  margin: 0px;
-  font-size: 13px;
-  color: #111;
-  font-family: "Helvetica";
+.noVNC-control-bar {
+         background-position:50% 100%;
 }
 
-#VNC_controls {
-  background: #111;
-  line-height: 1em;
-  color: #FFF;
-  overflow: hidden;
-  padding: 4px 24px;
-}
-
-#VNC_controls ul {
-  list-style:none;
-  list-style-position: outside;
-  margin: 0px;
-  padding: 0px;
-}
-#VNC_controls li {
-  margin-right: 15px;
-  padding: 2px 0px;
-  float: left;
-}
-#VNC_controls li input[type=text],
-#VNC_controls li input[type=password] {
-  border: 2px solid #333;
-}
-
-#VNC_host {
-    width: 100px;
-}
-#VNC_port {
-    width: 50px;
-}
-#VNC_password {
-    width: 80px;
-}
-#VNC_encrypt {
-}
-#VNC_connect_button {
-    width: 100px;
-}
-
-#VNC_status_bar td {
-    padding: 0px;
-    margin: 0px;
-}
-#VNC_status_bar div {
-    font-size: 12px;
-    font-weight: bold;
-    text-align: center;
-    margin: 0px;
-    padding: 1em;
-}
-.VNC_status_button {
-    font-size: 10px;
-    margin: 0px;
-    padding: 0px;
-}
-#VNC_status {
-    text-align: center;
-}
-#VNC_settings_menu {
-    display: none;
-    position: absolute;
-    width: 13em;
-    border: 1px solid #888;
-    color: #111;
-    font-weight: normal;
-    background-color: #f0f2f6;
-    padding: 5px; margin: 3px;
-    z-index: 100; opacity: 1;
-    text-align: left; white-space: normal;
-}
-#VNC_settings_menu ul {
-    list-style: none;
-    margin: 0px;
-    padding: 0px;
-}
-
-.VNC_buttons_right {
-    text-align: right;
-}
-.VNC_buttons_left {
-    text-align: left;
-}
-.VNC_status_normal {
-  background: #111;
-  color: #fff;
-}
-.VNC_status_error {
-  background: #111;
-  color: #f44;
-}
-.VNC_status_warn {
-  background: #111;
-  color: #ff4;
-}
-
-#VNC_screen {
-  -webkit-border-radius: 10px;
-  -moz-border-radius: 10px;
-  border-radius: 10px;
-  background: #111;
-  padding: 20px;
-  margin: 0 auto;
-  color: #FFF;
-  margin-top: 20px;
-  text-align: center;
-
-  /* This causes the width of the outer div(#screen) honor the size of the inner (#vnc) div */
-  display: table; 
-  table-layout: auto;
-}
-#VNC_canvas {
-  background: #111;
-  margin: 0 auto;
-}
-#VNC_clipboard {
-  display: none;
-}
+.triangle-right {
+               border:2px solid #fff;
+               background:#000;
+               color:#fff;
+}
\ No newline at end of file
index 6c7fecf562b7dd7ee47b182a11696ef81dfc7ec9..3124d0833cf4be5ab1884266c8df264014695772 100644 (file)
@@ -1852,7 +1852,7 @@ unicodeTable = {
     0x28e0 : 0x10028e0,
     0x28e1 : 0x10028e1,
     0x28e2 : 0x10028e2,
-    0x28e3 : 0x10028e3,
+    0x28e3 : 0x10028e3, 
     0x28e4 : 0x10028e4,
     0x28e5 : 0x10028e5,
     0x28e6 : 0x10028e6,
@@ -1881,4 +1881,4 @@ unicodeTable = {
     0x28fd : 0x10028fd,
     0x28fe : 0x10028fe,
     0x28ff : 0x10028ff
-};
+};
\ No newline at end of file
index feccc16012d60fbf7e2ca7b61ac172632c77fe07..b435b8f732263b2b585dfb3c09132cced9f9ed33 100644 (file)
@@ -842,9 +842,9 @@ normal_msg = function() {
             //Util.Debug("red after: " + red);
             green = parseInt(ws.rQshift16() / 256, 10);
             blue = parseInt(ws.rQshift16() / 256, 10);
-            Util.Debug("*** colourMap: " + display.get_colourMap());
             display.set_colourMap([red, green, blue], first_colour + c);
         }
+        Util.Debug("*** colourMap: " + display.get_colourMap());
         Util.Info("Registered " + num_colours + " colourMap entries");
         //Util.Debug("colourMap: " + display.get_colourMap());
         break;
index 7f13b3babc4d43593dbefa68692a24fdf4c2359d..ee630fbd8ded4b0d4e4b202c7cfd7757d794003f 100644 (file)
 var UI = {
 
 settingsOpen : false,
+ConnSettingsOpen : true,
+clipboardOpen: false,
 
 // Render default UI and initialize settings menu
-load: function(target) {
+load: function() {
     var html = '', i, sheet, sheets, llevels;
 
-    /* Populate the 'target' DOM element with default UI */
-    if (!target) {
-        target = $D('vnc');
-    } else if (typeof target === 'string') {
-        target = $D(target);
-    }
-
-    if ((!document.createElement('canvas').getContext) &&
-        window.ActiveXObject) {
-        // Suggest Chrome frame for Internet Explorer users
-        html += '<center><div style="text-align: left; width: 400px">';
-        html += '  You are using a version of Internet Explorer ';
-        html += '  that does not have HTML5 Canvas support. ';
-        html += '  To use noVNC you must use a browser with HTML5 ';
-        html += '  Canvas support or install ';
-        html += '  <a href="http://google.com/chromeframe" target="cframe">';
-        html += '  Google Chrome Frame.</a>';
-        html += '</div></center>';
-        target.innerHTML = html;
-        return;
-    }
-
-    html += '<div id="VNC_controls">';
-    html += '  <ul>';
-    html += '    <li>Host: <input id="VNC_host"></li>';
-    html += '    <li>Port: <input id="VNC_port"></li>';
-    html += '    <li>Password: <input id="VNC_password"';
-    html += '        type="password"></li>';
-    html += '    <li><input id="VNC_connect_button" type="button"';
-    html += '        value="Loading" disabled></li>';
-    html += '  </ul>';
-    html += '</div>';
-    html += '<div id="VNC_screen">';
-    html += '  <div id="VNC_status_bar" class="VNC_status_bar" style="margin-top: 0px;">';
-    html += '    <table border=0 width=100%><tr>';
-    html += '      <td><div id="VNC_status">Loading</div></td>';
-
-    // Mouse button selectors for touch devices
-    html += '      <td width=1%><div class="VNC_buttons_right">';
-    html += '        <nobr><span id="VNC_mouse_buttons" style="display: none;">';
-    html += '          <input type="button" class="VNC_status_button"';
-    html += '            id="VNC_mouse_button1" value="L" onclick="UI.setMouseButton(1);"';
-    html += '            ><input type="button" class="VNC_status_button"';
-    html += '            id="VNC_mouse_button2" value="M" onclick="UI.setMouseButton(2);"';
-    html += '            ><input type="button" class="VNC_status_button"';
-    html += '            id="VNC_mouse_button4" value="R" onclick="UI.setMouseButton(4);">';
-       html += '        <input type="button" id="showKeyboard" onclick="showkeyboard()" value="Keyboard" />';
-    html += '        </span></nobr></div></td>';
-
-    // Settings drop-down menu
-    html += '      <td width=1%><div class="VNC_buttons_right">';
-    html += '        <input type=button class="VNC_status_button" value="Settings"';
-    html += '          id="menuButton"';
-    html += '          onclick="UI.clickSettingsMenu();">';
-    html += '        <span id="VNC_settings_menu"';
-    html += '          onmouseover="UI.displayBlur();"';
-    html += '          onmouseout="UI.displayFocus();">';
-    html += '          <ul>';
-    html += '            <li><input id="VNC_encrypt"';
-    html += '                type="checkbox"> Encrypt</li>';
-    html += '            <li><input id="VNC_true_color"';
-    html += '                type="checkbox" checked> True Color</li>';
-    html += '            <li><input id="VNC_cursor"';
-    html += '                type="checkbox"> Local Cursor</li>';
-    html += '            <li><input id="VNC_shared"';
-    html += '                type="checkbox"> Shared Mode</li>';
-    html += '            <li><input id="VNC_connectTimeout"';
-    html += '                type="input"> Connect Timeout (s)</li>';
-    html += '            <hr>';
-
-    // Stylesheet selection dropdown
-    html += '            <li><select id="VNC_stylesheet" name="vncStyle">';
-    html += '              <option value="default">default</option>';
+    // Stylesheet selection dropdown   
     sheet = WebUtil.selectStylesheet();
     sheets = WebUtil.getStylesheets();
     for (i = 0; i < sheets.length; i += 1) {
-        html += '<option value="' + sheets[i].title + '">' + sheets[i].title + '</option>';
+               addOption($D('noVNC_stylesheet'),sheets[i].title, sheets[i].title);
     }
-    html += '              </select> Style</li>';
 
     // Logging selection dropdown
-    html += '            <li><select id="VNC_logging" name="vncLogging">';
     llevels = ['error', 'warn', 'info', 'debug'];
     for (i = 0; i < llevels.length; i += 1) {
-        html += '<option value="' + llevels[i] + '">' + llevels[i] + '</option>';
+               addOption($D('noVNC_logging'),llevels[i], llevels[i]);
     }
-    html += '              </select> Logging</li>';
-
-    html += '            <hr>';
-    html += '            <li><input type="button" id="VNC_apply" value="Apply"';
-    html += '                onclick="UI.settingsApply()"></li>';
-    html += '          </ul>';
-    html += '        </span></div></td>';
-
-    // CtrlAltDel Button
-    html += '      <td width=1%><div class="VNC_buttons_right">';
-    html += '        <input type=button class="VNC_status_button" value="CtrlAltDel"';
-    html += '          id="sendCtrlAltDelButton"';
-    html += '          onclick="UI.sendCtrlAltDel();"></div></td>';
-
-    html += '    </tr></table>';
-    html += '  </div>';
-    html += '  <canvas id="VNC_canvas" width="640px" height="20px">';
-    html += '      Canvas not supported.';
-    html += '  </canvas>';
-       html += '<input id="keyboardinput" style="border:none;" type="text" onKeyDown="onKeyDown(event);"/>';
-    html += '</div>';
-    html += '<br><br>';
-    html += '<div id="VNC_clipboard">';
-    html += '  VNC Clipboard:';
-    html += '  <input id="VNC_clipboard_clear_button"';
-    html += '      type="button" value="Clear"';
-    html += '      onclick="UI.clipClear();">';
-    html += '  <br>';
-    html += '  <textarea id="VNC_clipboard_text" cols=80 rows=5';
-    html += '    onfocus="UI.displayBlur();"';
-    html += '    onblur="UI.displayFocus();"';
-    html += '    onchange="UI.clipSend();"></textarea>';
-    html += '</div>';
-    target.innerHTML = html;
-
+       
     // Settings with immediate effects
     UI.initSetting('logging', 'warn');
     WebUtil.init_logging(UI.getSetting('logging'));
@@ -148,38 +42,46 @@ load: function(target) {
     WebUtil.selectStylesheet(UI.getSetting('stylesheet'));
 
     /* Populate the controls if defaults are provided in the URL */
-    UI.initSetting('host', '');
+    UI.initSetting('host', ''); 
     UI.initSetting('port', '');
     UI.initSetting('password', '');
     UI.initSetting('encrypt', false);
     UI.initSetting('true_color', true);
     UI.initSetting('cursor', false);
-    UI.initSetting('shared', true);
+    UI.initSetting('shared', true); 
     UI.initSetting('connectTimeout', 2);
 
-    UI.rfb = RFB({'target': $D('VNC_canvas'),
+    UI.rfb = RFB({'target': $D('noVNC_canvas'),
                   'onUpdateState': UI.updateState,
                   'onClipboard': UI.clipReceive});
-
     // Unfocus clipboard when over the VNC area
-    $D('VNC_screen').onmousemove = function () {
-            var keyboard = UI.rfb.get_keyboard();
-            if ((! keyboard) || (! keyboard.get_focused())) {
-                $D('VNC_clipboard_text').blur();
-            }
-        };
-
+    //$D('VNC_screen').onmousemove = function () {
+    //         var keyboard = UI.rfb.get_keyboard();
+    //        if ((! keyboard) || (! keyboard.get_focused())) {
+    //            $D('VNC_clipboard_text').blur();
+    //         }
+    //    };
+               
     // Show mouse selector buttons on touch screen devices
     if ('ontouchstart' in document.documentElement) {
-        $D('VNC_mouse_buttons').style.display = "inline";
+        $D('noVNC_mobile_buttons').style.display = "inline";
         UI.setMouseButton();
+               window.scrollTo(0, 1); 
     }
 
+       //iOS Safari does not support CSS position:fixed. This detects iOS devices and enables javascript workaround.  
+       if((navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i)) || (navigator.userAgent.match(/iPad/i))) {    
+               alert("here");
+       setOnscroll();
+               setResize();
+       }
+
 },
 
 // Read form control compatible setting from cookie
 getSetting: function(name) {
-    var val, ctrl = $D('VNC_' + name);
+    var val, ctrl = $D('noVNC_' + name);
     val = WebUtil.readCookie(name);
     if (ctrl.type === 'checkbox') {
         if (val.toLowerCase() in {'0':1, 'no':1, 'false':1}) {
@@ -194,16 +96,23 @@ getSetting: function(name) {
 // Update cookie and form control setting. If value is not set, then
 // updates from control to current cookie setting.
 updateSetting: function(name, value) {
-    var i, ctrl = $D('VNC_' + name);
+
+    var i, ctrl = $D('noVNC_' + name);
     // Save the cookie for this session
     if (typeof value !== 'undefined') {
         WebUtil.createCookie(name, value);
     }
-
+       if(name === 'host')
+       {
+               
+               
+       }
     // Update the settings control
     value = UI.getSetting(name);
+
     if (ctrl.type === 'checkbox') {
         ctrl.checked = value;
+               
     } else if (typeof ctrl.options !== 'undefined') {
         for (i = 0; i < ctrl.options.length; i += 1) {
             if (ctrl.options[i].value === value) {
@@ -212,13 +121,18 @@ updateSetting: function(name, value) {
             }
         }
     } else {
+               /*Weird IE9 error leads to 'null' appearring in textboxes instead of ''.*/
+               if(value === null)
+               {
+                       value = "";
+               }
         ctrl.value = value;
     }
 },
 
 // Save control setting to cookie
 saveSetting: function(name) {
-    var val, ctrl = $D('VNC_' + name);
+    var val, ctrl = $D('noVNC_' + name);
     if (ctrl.type === 'checkbox') {
         val = ctrl.checked;
     } else if (typeof ctrl.options !== 'undefined') {
@@ -261,7 +175,7 @@ clickSettingsMenu: function() {
             UI.updateSetting('cursor');
         } else {
             UI.updateSetting('cursor', false);
-            $D('VNC_cursor').disabled = true;
+            $D('noVNC_cursor').disabled = true;
         }
         UI.updateSetting('shared');
         UI.updateSetting('connectTimeout');
@@ -274,29 +188,37 @@ clickSettingsMenu: function() {
 
 // Open menu
 openSettingsMenu: function() {
-    $D('VNC_settings_menu').style.display = "block";
+       if(UI.clipboardOpen == true)
+       {       
+               UI.showClipboard(); 
+       } 
+       //Close connection settings if open
+       if(UI.ConnSettingsOpen == true) {
+               connectPanelbutton();
+       }
+       $D('noVNC_Settings').style.display = "block";
     UI.settingsOpen = true;
 },
 
 // Close menu (without applying settings)
 closeSettingsMenu: function() {
-    $D('VNC_settings_menu').style.display = "none";
+    $D('noVNC_Settings').style.display = "none";
     UI.settingsOpen = false;
 },
 
 // Disable/enable controls depending on connection state
 settingsDisabled: function(disabled, rfb) {
     //Util.Debug(">> settingsDisabled");
-    $D('VNC_encrypt').disabled = disabled;
-    $D('VNC_true_color').disabled = disabled;
+    $D('noVNC_encrypt').disabled = disabled;
+    $D('noVNC_true_color').disabled = disabled;
     if (rfb && rfb.get_display() && rfb.get_display().get_cursor_uri()) {
-        $D('VNC_cursor').disabled = disabled;
+        $D('noVNC_cursor').disabled = disabled;
     } else {
         UI.updateSetting('cursor', false);
-        $D('VNC_cursor').disabled = true;
+        $D('noVNC_cursor').disabled = true;
     }
-    $D('VNC_shared').disabled = disabled;
-    $D('VNC_connectTimeout').disabled = disabled;
+    $D('noVNC_shared').disabled = disabled;
+    $D('noVNC_connectTimeout').disabled = disabled;
     //Util.Debug("<< settingsDisabled");
 },
 
@@ -316,14 +238,13 @@ settingsApply: function() {
     // Settings with immediate (non-connected related) effect
     WebUtil.selectStylesheet(UI.getSetting('stylesheet'));
     WebUtil.init_logging(UI.getSetting('logging'));
-
     //Util.Debug("<< settingsApply");
 },
 
 
 
 setPassword: function() {
-    UI.rfb.sendPassword($D('VNC_password').value);
+    UI.rfb.sendPassword($D('noVNC_password').value);
     return false;
 },
 
@@ -348,7 +269,7 @@ setMouseButton: function(num) {
     }
 
     for (b = 0; b < blist.length; b++) {
-        button = $D('VNC_mouse_button' + blist[b]);
+        button = $D('noVNC_mouse_button' + blist[b]);
         if (blist[b] === num) {
             button.style.backgroundColor = "black";
             button.style.color = "lightgray";
@@ -357,14 +278,13 @@ setMouseButton: function(num) {
             button.style.color = "";
         }
     }
-
 },
 
 updateState: function(rfb, state, oldstate, msg) {
     var s, sb, c, cad, klass;
-    s = $D('VNC_status');
-    sb = $D('VNC_status_bar');
-    c = $D('VNC_connect_button');
+    s = $D('noVNC_status');
+    sb = $D('noVNC_status_bar');
+    c = $D('noVNC_connect_button');
     cad = $D('sendCtrlAltDelButton');
     switch (state) {
         case 'failed':
@@ -372,7 +292,7 @@ updateState: function(rfb, state, oldstate, msg) {
             c.disabled = true;
             cad.disabled = true;
             UI.settingsDisabled(true, rfb);
-            klass = "VNC_status_error";
+            klass = "noVNC_status_error";
             break;
         case 'normal':
             c.value = "Disconnect";
@@ -380,9 +300,10 @@ updateState: function(rfb, state, oldstate, msg) {
             c.disabled = false;
             cad.disabled = false;
             UI.settingsDisabled(true, rfb);
-            klass = "VNC_status_normal";
+            klass = "noVNC_status_normal";
             break;
         case 'disconnected':
+                               $D('noVNC_defaultScreen').style.display = "block";
         case 'loaded':
             c.value = "Connect";
             c.onclick = UI.connect;
@@ -390,7 +311,7 @@ updateState: function(rfb, state, oldstate, msg) {
             c.disabled = false;
             cad.disabled = true;
             UI.settingsDisabled(false, rfb);
-            klass = "VNC_status_normal";
+            klass = "noVNC_status_normal";
             break;
         case 'password':
             c.value = "Send Password";
@@ -399,13 +320,13 @@ updateState: function(rfb, state, oldstate, msg) {
             c.disabled = false;
             cad.disabled = true;
             UI.settingsDisabled(true, rfb);
-            klass = "VNC_status_warn";
+            klass = "noVNC_status_warn";
             break;
         default:
             c.disabled = true;
             cad.disabled = true;
             UI.settingsDisabled(true, rfb);
-            klass = "VNC_status_warn";
+            klass = "noVNC_status_warn";
             break;
     }
 
@@ -419,7 +340,7 @@ updateState: function(rfb, state, oldstate, msg) {
 
 clipReceive: function(rfb, text) {
     Util.Debug(">> UI.clipReceive: " + text.substr(0,40) + "...");
-    $D('VNC_clipboard_text').value = text;
+    $D('noVNC_clipboard_text').value = text;
     Util.Debug("<< UI.clipReceive");
 },
 
@@ -428,10 +349,10 @@ connect: function() {
     var host, port, password;
 
     UI.closeSettingsMenu();
-
-    host = $D('VNC_host').value;
-    port = $D('VNC_port').value;
-    password = $D('VNC_password').value;
+       connectPanelbutton();
+    host = $D('noVNC_host').value;
+    port = $D('noVNC_port').value;
+    password = $D('noVNC_password').value;
     if ((!host) || (!port)) {
         throw("Must set host and port");
     }
@@ -443,12 +364,16 @@ connect: function() {
     UI.rfb.set_connectTimeout(UI.getSetting('connectTimeout'));
 
     UI.rfb.connect(host, port, password);
+       //Close dialog.
+       setTimeout("setBarPosition()",100);
+       $D('noVNC_defaultScreen').style.display = "none";
 },
 
 disconnect: function() {
     UI.closeSettingsMenu();
-
     UI.rfb.disconnect();
+       $D('noVNC_defaultScreen').style.display = "block";
+       UI.openSettingsMenu();
 },
 
 displayBlur: function() {
@@ -462,41 +387,70 @@ displayFocus: function() {
 },
 
 clipClear: function() {
-    $D('VNC_clipboard_text').value = "";
+    $D('noVNC_clipboard_text').value = "";
     UI.rfb.clipboardPasteFrom("");
 },
 
 clipSend: function() {
-    var text = $D('VNC_clipboard_text').value;
+    var text = $D('noVNC_clipboard_text').value;
     Util.Debug(">> UI.clipSend: " + text.substr(0,40) + "...");
     UI.rfb.clipboardPasteFrom(text);
     Util.Debug("<< UI.clipSend");
+},
+
+showClipboard: function() {
+       //Close settings if open
+       if(UI.settingsOpen == true) {
+               UI.closeSettingsMenu();
+       }
+       //Close connection settings if open
+       if(UI.ConnSettingsOpen == true) {
+               connectPanelbutton();
+       }
+       //Toggle Connection Panel
+       if(UI.clipboardOpen == true)
+       {       $D('noVNC_clipboard').style.display = "none";
+               UI.clipboardOpen = false;
+       } else {
+               $D('noVNC_clipboard').style.display = "block";
+               UI.clipboardOpen = true;
+       }
 }
 
 };
 
-/*
-  Functions for use of mobile devices native keyboards
-  Added by Chris Gordon
-  http://www.chrisgordon.com.au
-  Date: 23/08/2011
-*/
+function connectPanelbutton() {
+       //Close connection settings if open
+       if(UI.settingsOpen == true) {
+               UI.closeSettingsMenu();
+       }
+       if(UI.clipboardOpen == true)
+       {       
+               UI.showClipboard(); 
+       } 
+       
+       //Toggle Connection Panel
+       if(UI.ConnSettingsOpen == true)
+       {       
+               $D('noVNC_controls').style.display = "none";
+               UI.ConnSettingsOpen = false;
+       } else {
+               $D('noVNC_controls').style.display = "block";
+               UI.ConnSettingsOpen = true;
+       }
+}
 
 function showkeyboard(){
-//Get Current Scroll Position of Browser
+//Get Current Scroll Position
 var scrollx = (document.all)?document.body.scrollLeft:window.pageXOffset;   
 var scrolly = (document.all)?document.body.scrollTop:window.pageYOffset; 
 
-//Stop browser zooming on textbox when focus is set.
-zoomDisable();
-
-//Focus on hidden textbox to bring up native keyboard.
-document.getElementById('keyboardinput').focus();
 
-//Set scroll position of browser to the same position it was prior to focus.
-scroll(scrollx,scrolly);
-
-//Renable user zooming.
+//Stop browser zooming on textbox.
+zoomDisable();
+               $D('keyboardinput').focus();
+               scroll(scrollx,scrolly);
+//Renable user zoom.
 zoomEnable();
 } 
 
@@ -527,3 +481,35 @@ function changeViewportMeta(newattributes) {
               metatags[cnt].setAttribute("content", newattributes);
     }
 }
+
+//iOS < Version 5 does not support position fixed. Javascript workaround:
+function setOnscroll() {
+       window.onscroll = function() {
+               setBarPosition();
+       };
+}
+
+function setResize() {
+       window.onResize = function() {
+               setBarPosition();
+       };
+}
+
+function setBarPosition() {
+  $D('VNC_mobile_bar').style.top = (window.pageYOffset) + 'px';
+  $D('VNC_mobile_buttons').style.left = (window.pageXOffset) + 'px';
+   
+  $D('VNC_mobile_buttons_right').style.right = 0 + 'px'; 
+  
+   var vncwidth = $('#VNC_screen').width();
+   $D('VNC_mobile_bar').style.width = vncwidth + 'px';
+}
+
+//Helper to add options to dropdown.
+function addOption(selectbox,text,value )
+{
+       var optn = document.createElement("OPTION");
+       optn.text = text;
+       optn.value = value;
+       selectbox.options.add(optn);
+}
index 15e78fa8a50f949f8071bc608c48e5c6cbb69e6f..d74f6cf156b36ad8c78e54bcd3599cb36b16fc0d 100644 (file)
--- a/vnc.html
+++ b/vnc.html
-<!DOCTYPE html>
-<html>
-    <!-- 
+<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.1//EN" "http://www.openmobilealliance.org/tech/DTD/xhtml-mobile11.dtd">
+<html>    
+<head>
+
+   <!-- 
     noVNC example: simple example using default UI
     Copyright (C) 2011 Joel Martin
     Licensed under LGPL-3 (see LICENSE.txt)
     -->
-    <head>
-        <title>noVNC</title>
-               <meta name="viewport" content="user-scalable=1" />
-        <meta http-equiv="X-UA-Compatible" content="chrome=1">
-        <link rel="stylesheet" href="include/plain.css">
-        <link rel="alternate stylesheet" href="include/black.css" TITLE="Black">
+       
+       <meta charset="utf-8">
+
+       <!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame
+                  Remove this if you use the .htaccess -->
+       
+       <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
+    
+       <title>noVNC</title>
+       
+       <meta name="viewport" content="user-scalable=1" />
+       <meta http-equiv="X-UA-Compatible" content="chrome=1" />
+    
+       <!-- Stylesheets -->
+       <link rel="stylesheet" href="include/base.css" />
+    <link rel="alternate stylesheet" href="include/black.css" TITLE="Black" />
                
-        <!--
+       <!-- Google web fonts -->
+       <link href='http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz|Nova+Square|Orbitron:400,500,700,900|Nova+Round|Nova+Mono|Nova+Slim|Nova+Oval|Nova+Flat|Nova+Cut' rel='stylesheet' type='text/css'>       
+   
+               <!--
         <script type='text/javascript'  
             src='http://getfirebug.com/releases/lite/1.2/firebug-lite-compressed.js'></script>
         -->
-        <script src="include/vnc.js"></script>
-        <script src="include/ui.js"></script>
-    </head>
+               
+       <script src="include/vnc.js"></script>
+       <script src="include/ui.js"></script>
+                       
+       <meta name="apple-mobile-web-app-capable" content="yes" />
+       <!--
+       <meta name="viewport" content="width=device-width,height=device-height" />
+       -->
+        
+       <!-- App Start Icon  -->
+       <link rel="apple-touch-startup-image" href="images/screen_640x435.png" /> 
 
-    <body onKeyDown="onKeyDown(event);">               
-        <div id='vnc'>Loading</div>
+       <!-- For iOS devices set the icon to use if user bookmarks app on their homescreen -->
+       <link rel="apple-touch-icon" href="images/mobileicon.png">
+       <link rel="apple-touch-icon-precomposed" href="images/mobileicon.png" /> 
+       
+</head> 
 
-        <script>
-        window.onload = function () {
-            UI.load('vnc');
-        };
-        </script>
+<body>
+       <div class="noVNC-control-bar">
+                       <!--noVNC Mobile Device only Buttons-->
+                       <div id="noVNC_mobile_buttons"> 
+                               <nobr>
+                                       <span class="noVNC_mouse_buttons">
+                                               <input type="button" class="noVNC_status_button" id="noVNC_mouse_button1" value="L" onclick="UI.setMouseButton(1);">
+                                               <input type="button" class="noVNC_status_button" id="noVNC_mouse_button2" value="M" onclick="UI.setMouseButton(2);">
+                                               <input type="button" class="noVNC_status_button" id="noVNC_mouse_button4" value="R" onclick="UI.setMouseButton(4);">
+                                               <input type="button" class="noVNC_status_button" value="CtrlAltDel" id="sendCtrlAltDelButton" onclick="UI.sendCtrlAltDel();">
+                                               <input type="button" id="showKeyboard" onclick="showkeyboard()" value="Keyboard" class="noVNC_status_button"/>
+                                       </span>
+                               </nobr>
+                       </div>
+                       
+                       <!--noVNC Buttons-->
+                       <div class="noVNC_mobile_buttons_right">
+                                       <input type="button" id="clipboardbutton" onclick="UI.showClipboard();" value="Clipboard" />
+                                       <input type="button" class="VNC_status_button" value="Settings" id="menuButton" onclick="UI.clickSettingsMenu();">
+                                       <input type="button" id="connectPanelbutton" class="VNC_status_button" onclick="connectPanelbutton()" value="Connection" />
+                       </div>
+                       
+                       <!-- Clipboard Panel -->
+                       <div id="noVNC_clipboard" class="triangle-right top">
+                               <textarea id="noVNC_clipboard_text" cols=88 rows=5 onfocus="UI.displayBlur();" onblur="UI.displayFocus();" onchange="UI.clipSend();">
+                               </textarea>
+                               <br />
+                               <input id="noVNC_clipboard_clear_button" type="button" value="Clear" onclick="UI.clipClear();">
+                       </div>
+               
+                       <!-- Settings Panel -->
+                       <div id="noVNC_Settings" class="triangle-right top">
+                                 <span id="noVNC_settings_menu" onmouseover="UI.displayBlur();" onmouseout="UI.displayFocus();">
+                                               <ul>
+                                                       <li><input id="noVNC_encrypt" type="checkbox"> Encrypt</li>
+                                                       <li><input id="noVNC_true_color" type="checkbox" checked> True Color</li>
+                                                       <li><input id="noVNC_cursor" type="checkbox"> Local Cursor</li>
+                                                       <li><input id="noVNC_shared" type="checkbox"> Shared Mode</li>
+                                                       <li><input id="noVNC_connectTimeout" type="input"> Connect Timeout (s)</li>
+                                                       <hr>
+                                                       <!-- Stylesheet selection dropdown -->
+                                                       <li><label><strong>Style: </strong>
+                                                               <select id="noVNC_stylesheet" name="vncStyle">
+                                                                       <option value="default">default</option>
+                                                               </select></label>
+                                                       </li>
 
-    </body>
+                                                       <!-- Logging selection dropdown -->
+                                                       <li><label><strong>Logging: </strong>
+                                                               <select id="noVNC_logging" name="vncLogging">
+                                                               </select></label>
+                                                       </li>
+                                                       <hr>
+                                                       <li><input type="button" id="noVNC_apply" value="Apply" onclick="UI.settingsApply()"></li>
+                                               </ul>
+                               </span>
+                </div>
+                       
+               <!-- Connection Panel -->
+               <div id="noVNC_controls" class="triangle-right top">
+                         <ul>
+                                       <li><label><strong>Host: </strong><input id="noVNC_host" /></label></li>
+                                       <li><label><strong>Port: </strong><input id="noVNC_port" /></label></li>
+                                       <li><label><strong>Password: </strong><input id="noVNC_password" type="password" /></label></li>
+                                       <li><input id="noVNC_connect_button" type="button" value="Loading" disabled></li>
+                        </ul>
+               </div>
+               
+       </div>
+       
+       <div id="noVNC_screen">
+               <div id="noVNC_status_bar" class="noVNC_status_bar" style="margin-top: 0px;">
+                       <div id="noVNC_status">Loading</div>
+               </div>
+               
+               <!-- HTML5 Canvas -->
+               <h1 id="noVNC_defaultScreen"><span>no</span><br />VNC</h1>
+               <canvas id="noVNC_canvas" width="640px" height="20px">
+                        Canvas not supported.
+               </canvas>
+               
+               <input id="keyboardinput" style="display:none;" type="text" onKeyDown="onKeyDown(event);"/>
+       </div>
+  
+        <script>
+                       window.onload = UI.load;
+        </script>
+ </body>
 </html>