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 --> 15 <title>noVNC</title> 16 17 <meta charset="utf-8"> 18 19 <!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame 20 Remove this if you use the .htaccess --> 21 <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 22 23 <!-- Apple iOS Safari settings --> 24 <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"> 25 <meta name="apple-mobile-web-app-capable" content="yes" /> 26 <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" /> 27 <!-- App Start Icon --> 28 <link rel="apple-touch-startup-image" href="images/screen_320x460.png" /> 29 <!-- For iOS devices set the icon to use if user bookmarks app on their homescreen --> 30 <link rel="apple-touch-icon" href="images/screen_57x57.png"> 31 <!-- 32 <link rel="apple-touch-icon-precomposed" href="images/screen_57x57.png" /> 33 --> 34 35 36 <!-- Stylesheets --> 37 <link rel="stylesheet" href="include/base.css" /> 38 <link rel="alternate stylesheet" href="include/black.css" TITLE="Black" /> 39 <link rel="alternate stylesheet" href="include/blue.css" TITLE="Blue" /> 40 41 <!-- 42 <script type='text/javascript' 43 src='http://getfirebug.com/releases/lite/1.2/firebug-lite-compressed.js'></script> 44 --> 45 46 </head> 47 48 <body> 49 <div id="noVNC-control-bar"> 50 <!--noVNC Mobile Device only Buttons--> 51 <div class="noVNC-buttons-left"> 52 <input type="image" alt="viewport drag" src="images/drag.png" 53 id="noVNC_view_drag_button" class="noVNC_status_button" 54 title="Move/Drag Viewport"> 55 <div id="noVNC_mobile_buttons"> 56 <input type="image" alt="No mousebutton" src="images/mouse_none.png" 57 id="noVNC_mouse_button0" class="noVNC_status_button"> 58 <input type="image" alt="Left mousebutton" src="images/mouse_left.png" 59 id="noVNC_mouse_button1" class="noVNC_status_button"> 60 <input type="image" alt="Middle mousebutton" src="images/mouse_middle.png" 61 id="noVNC_mouse_button2" class="noVNC_status_button"> 62 <input type="image" alt="Right mousebutton" src="images/mouse_right.png" 63 id="noVNC_mouse_button4" class="noVNC_status_button"> 64 <input type="image" alt="Keyboard" src="images/keyboard.png" 65 id="showKeyboard" class="noVNC_status_button" 66 value="Keyboard" title="Show Keyboard"/> 67 <!-- Note that Google Chrome on Android doesn't respect any of these, 68 html attributes which attempt to disable text suggestions on the 69 on-screen keyboard. Let's hope Chrome implements the ime-mode 70 style for example --> 71 <textarea id="keyboardinput" autocapitalize="off" 72 autocorrect="off" autocomplete="off" spellcheck="false" 73 mozactionhint="Enter" onsubmit="return false;" 74 style="ime-mode: disabled;"></textarea> 75 <div id="noVNC_extra_keys"> 76 <input type="image" alt="Extra keys" src="images/showextrakeys.png" 77 id="showExtraKeysButton" class="noVNC_status_button"> 78 <input type="image" alt="Ctrl" src="images/ctrl.png" 79 id="toggleCtrlButton" class="noVNC_status_button"> 80 <input type="image" alt="Alt" src="images/alt.png" 81 id="toggleAltButton" class="noVNC_status_button"> 82 <input type="image" alt="Tab" src="images/tab.png" 83 id="sendTabButton" class="noVNC_status_button"> 84 <input type="image" alt="Esc" src="images/esc.png" 85 id="sendEscButton" class="noVNC_status_button"> 86 </div> 87 </div> 88 </div> 89 90 <div id="noVNC_status">Loading</div> 91 92 <!--noVNC Buttons--> 93 <div class="noVNC-buttons-right"> 94 <input type="image" alt="Ctrl+Alt+Del" src="images/ctrlaltdel.png" 95 id="sendCtrlAltDelButton" class="noVNC_status_button" 96 title="Send Ctrl-Alt-Del" /> 97 <input type="image" alt="Shutdown/Reboot" src="images/power.png" 98 id="xvpButton" class="noVNC_status_button" 99 title="Shutdown/Reboot..." /> 100 <input type="image" alt="Clipboard" src="images/clipboard.png" 101 id="clipboardButton" class="noVNC_status_button" 102 title="Clipboard" /> 103 <input type="image" alt="Settings" src="images/settings.png" 104 id="settingsButton" class="noVNC_status_button" 105 title="Settings" /> 106 <input type="image" alt="Connect" src="images/connect.png" 107 id="connectButton" class="noVNC_status_button" 108 title="Connect" /> 109 <input type="image" alt="Disconnect" src="images/disconnect.png" 110 id="disconnectButton" class="noVNC_status_button" 111 title="Disconnect" /> 112 </div> 113 114 <!-- Description Panel --> 115 <!-- Shown by default when hosted at for kanaka.github.com --> 116 <div id="noVNC_description" class=""> 117 noVNC is a browser based VNC client implemented using HTML5 Canvas 118 and WebSockets. You will either need a VNC server with WebSockets 119 support (such as <a href="http://libvncserver.sourceforge.net/">libvncserver</a>) 120 or you will need to use 121 <a href="https://github.com/kanaka/websockify">websockify</a> 122 to bridge between your browser and VNC server. See the noVNC 123 <a href="https://github.com/kanaka/noVNC">README</a> 124 and <a href="http://kanaka.github.com/noVNC">website</a> 125 for more information. 126 <br /> 127 <input id="descriptionButton" type="button" value="Close"> 128 </div> 129 130 <!-- Popup Status Panel --> 131 <div id="noVNC_popup_status_panel" class=""> 132 </div> 133 134 <!-- Clipboard Panel --> 135 <div id="noVNC_clipboard" class="triangle-right top"> 136 <textarea id="noVNC_clipboard_text" rows=5> 137 </textarea> 138 <br /> 139 <input id="noVNC_clipboard_clear_button" type="button" 140 value="Clear"> 141 </div> 142 143 <!-- XVP Shutdown/Reboot Panel --> 144 <div id="noVNC_xvp" class="triangle-right top"> 145 <span id="noVNC_xvp_menu"> 146 <input type="button" id="xvpShutdownButton" value="Shutdown" /> 147 <input type="button" id="xvpRebootButton" value="Reboot" /> 148 <input type="button" id="xvpResetButton" value="Reset" /> 149 </span> 150 </div> 151 152 <!-- Settings Panel --> 153 <div id="noVNC_settings" class="triangle-right top"> 154 <span id="noVNC_settings_menu"> 155 <ul> 156 <li><input id="noVNC_encrypt" type="checkbox"> Encrypt</li> 157 <li><input id="noVNC_true_color" type="checkbox" checked> True Color</li> 158 <li><input id="noVNC_cursor" type="checkbox"> Local Cursor</li> 159 <li><input id="noVNC_clip" type="checkbox"> Clip to Window</li> 160 <li><input id="noVNC_shared" type="checkbox"> Shared Mode</li> 161 <li><input id="noVNC_view_only" type="checkbox"> View Only</li> 162 <li><input id="noVNC_path" type="input" value="websockify"> Path</li> 163 <li><input id="noVNC_repeaterID" type="input" value=""> Repeater ID</li> 164 <hr> 165 <!-- Stylesheet selection dropdown --> 166 <li><label><strong>Style: </strong> 167 <select id="noVNC_stylesheet" name="vncStyle"> 168 <option value="default">default</option> 169 </select></label> 170 </li> 171 172 <!-- Logging selection dropdown --> 173 <li><label><strong>Logging: </strong> 174 <select id="noVNC_logging" name="vncLogging"> 175 </select></label> 176 </li> 177 <hr> 178 <li><input type="button" id="noVNC_apply" value="Apply"></li> 179 </ul> 180 </span> 181 </div> 182 183 <!-- Connection Panel --> 184 <div id="noVNC_controls" class="triangle-right top"> 185 <ul> 186 <li><label><strong>Host: </strong><input id="noVNC_host" /></label></li> 187 <li><label><strong>Port: </strong><input id="noVNC_port" /></label></li> 188 <li><label><strong>Password: </strong><input id="noVNC_password" type="password" /></label></li> 189 <li><input id="noVNC_connect_button" type="button" value="Connect"></li> 190 </ul> 191 </div> 192 193 </div> <!-- End of noVNC-control-bar --> 194 195 196 <div id="noVNC_screen"> 197 <div id="noVNC_screen_pad"></div> 198 199 <h1 id="noVNC_logo"><span>no</span><br />VNC</h1> 200 201 <!-- HTML5 Canvas --> 202 <div id="noVNC_container"> 203 <canvas id="noVNC_canvas" width="640px" height="20px"> 204 Canvas not supported. 205 </canvas> 206 </div> 207 208 </div> 209 <script src="include/util.js"></script> 210 <script src="include/ui.js"></script> 211 212 </body> 213 </html> 214