]> git.proxmox.com Git - mirror_novnc.git/blob - vnc.html
Place related elements together
[mirror_novnc.git] / vnc.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) 2016 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/base.css" />
40 <link rel="alternate stylesheet" href="app/styles/black.css" TITLE="Black" />
41 <link rel="alternate stylesheet" href="app/styles/blue.css" TITLE="Blue" />
42
43 <!--
44 <script type='text/javascript'
45 src='http://getfirebug.com/releases/lite/1.2/firebug-lite-compressed.js'></script>
46 -->
47
48 </head>
49
50 <body>
51 <!-- noVNC Control Bar -->
52 <div id="noVNC_control_bar" class="noVNC_status_normal">
53
54 <div class="noVNC_buttons_left">
55
56 <!-- Drag/Pan the viewport -->
57 <input type="image" alt="viewport drag" src="app/images/drag.png"
58 id="noVNC_view_drag_button" class="noVNC_status_button"
59 title="Move/Drag Viewport" />
60
61 <!--noVNC Touch Device only buttons-->
62 <div id="noVNC_mobile_buttons">
63 <input type="image" alt="No mousebutton" src="app/images/mouse_none.png"
64 id="noVNC_mouse_button0" class="noVNC_status_button" />
65 <input type="image" alt="Left mousebutton" src="app/images/mouse_left.png"
66 id="noVNC_mouse_button1" class="noVNC_status_button" />
67 <input type="image" alt="Middle mousebutton" src="app/images/mouse_middle.png"
68 id="noVNC_mouse_button2" class="noVNC_status_button" />
69 <input type="image" alt="Right mousebutton" src="app/images/mouse_right.png"
70 id="noVNC_mouse_button4" class="noVNC_status_button" />
71 <input type="image" alt="Keyboard" src="app/images/keyboard.png"
72 id="noVNC_keyboard_button" class="noVNC_status_button"
73 value="Keyboard" title="Show Keyboard" />
74 <!-- Note that Google Chrome on Android doesn't respect any of these,
75 html attributes which attempt to disable text suggestions on the
76 on-screen keyboard. Let's hope Chrome implements the ime-mode
77 style for example -->
78 <textarea id="noVNC_keyboardinput" autocapitalize="off"
79 autocorrect="off" autocomplete="off" spellcheck="false"
80 mozactionhint="Enter"></textarea>
81 <div id="noVNC_extra_keys">
82 <input type="image" alt="Extra keys" src="app/images/toggleextrakeys.png"
83 id="noVNC_toggleExtraKeys_button" class="noVNC_status_button" />
84 <input type="image" alt="Ctrl" src="app/images/ctrl.png"
85 id="noVNC_toggleCtrl_button" class="noVNC_status_button" />
86 <input type="image" alt="Alt" src="app/images/alt.png"
87 id="noVNC_toggleAlt_button" class="noVNC_status_button" />
88 <input type="image" alt="Tab" src="app/images/tab.png"
89 id="noVNC_sendTab_button" class="noVNC_status_button" />
90 <input type="image" alt="Esc" src="app/images/esc.png"
91 id="noVNC_sendEsc_button" class="noVNC_status_button" />
92 </div>
93 </div>
94 </div>
95
96 <div id="noVNC_status"></div>
97
98 <div class="noVNC_buttons_right">
99 <!-- Send Ctrl+Alt+Delete -->
100 <input type="image" alt="Ctrl+Alt+Del" src="app/images/ctrlaltdel.png"
101 id="noVNC_sendCtrlAltDel_button" class="noVNC_status_button"
102 title="Send Ctrl-Alt-Del" />
103
104 <!-- XVP Shutdown/Reboot -->
105 <input type="image" alt="Shutdown/Reboot" src="app/images/power.png"
106 id="noVNC_toggleXvp_button" class="noVNC_status_button"
107 title="Shutdown/Reboot..." />
108 <div id="noVNC_xvp" class="triangle-right top">
109 <span id="noVNC_xvp_menu">
110 <input type="button" id="noVNC_xvpShutdown_button" value="Shutdown" />
111 <input type="button" id="noVNC_xvpReboot_button" value="Reboot" />
112 <input type="button" id="noVNC_xvpReset_button" value="Reset" />
113 </span>
114 </div>
115
116 <!-- Clipboard -->
117 <input type="image" alt="Clipboard" src="app/images/clipboard.png"
118 id="noVNC_clipboard_button" class="noVNC_status_button"
119 title="Clipboard" />
120 <div id="noVNC_clipboard" class="triangle-right top">
121 <textarea id="noVNC_clipboard_text" rows=5>
122 </textarea>
123 <br />
124 <input id="noVNC_clipboard_clear_button" type="button"
125 value="Clear" />
126 </div>
127
128 <!-- Toggle fullscreen -->
129 <input type="image" alt="Fullscreen" src="app/images/fullscreen.png"
130 id="noVNC_fullscreen_button" class="noVNC_status_button"
131 title="Fullscreen" />
132
133 <!-- Settings -->
134 <input type="image" alt="Settings" src="app/images/settings.png"
135 id="noVNC_settings_button" class="noVNC_status_button"
136 title="Settings" />
137 <div id="noVNC_settings" class="triangle-right top">
138 <span id="noVNC_settings_menu">
139 <ul>
140 <li><input id="noVNC_setting_encrypt" type="checkbox" /> Encrypt</li>
141 <li><input id="noVNC_setting_true_color" type="checkbox" checked /> True Color</li>
142 <li><input id="noVNC_setting_cursor" type="checkbox" /> Local Cursor</li>
143 <li><input id="noVNC_setting_clip" type="checkbox" /> Clip to Window</li>
144 <li><input id="noVNC_setting_shared" type="checkbox" /> Shared Mode</li>
145 <li><input id="noVNC_setting_view_only" type="checkbox" /> View Only</li>
146 <hr>
147 <li><input id="noVNC_setting_path" type="input" value="websockify" /> Path</li>
148 <li><label>
149 <select id="noVNC_setting_resize" name="vncResize">
150 <option value="off">None</option>
151 <option value="scale">Local Scaling</option>
152 <option value="downscale">Local Downscaling</option>
153 <option value="remote">Remote Resizing</option>
154 </select> Scaling Mode</label>
155 </li>
156 <li><input id="noVNC_setting_repeaterID" type="input" value="" /> Repeater ID</li>
157 <hr>
158 <!-- Stylesheet selection dropdown -->
159 <li><label><strong>Style: </strong>
160 <select id="noVNC_setting_stylesheet" name="vncStyle">
161 <option value="default">default</option>
162 </select></label>
163 </li>
164 <!-- Logging selection dropdown -->
165 <li><label><strong>Logging: </strong>
166 <select id="noVNC_setting_logging" name="vncLogging">
167 </select></label>
168 </li>
169 <hr>
170 <li><input type="button" id="noVNC_settings_apply" value="Apply" /></li>
171 </ul>
172 </span>
173 </div>
174
175 <!-- Connection Controls -->
176 <input type="image" alt="Connect" src="app/images/connect.png"
177 id="noVNC_connectPanel_button" class="noVNC_status_button"
178 title="Connect" />
179 <input type="image" alt="Disconnect" src="app/images/disconnect.png"
180 id="noVNC_disconnect_button" class="noVNC_status_button"
181 title="Disconnect" />
182 <div id="noVNC_controls" class="triangle-right top">
183 <ul>
184 <li><label><strong>Host: </strong><input id="noVNC_setting_host" /></label></li>
185 <li><label><strong>Port: </strong><input id="noVNC_setting_port" /></label></li>
186 <li><label><strong>Password: </strong><input id="noVNC_setting_password" type="password" /></label></li>
187 <li><label><strong>Token: </strong><input id="noVNC_setting_token" /></label></li>
188 <li><input id="noVNC_connect_button" type="button" value="Connect" /></li>
189 </ul>
190 </div>
191 </div>
192
193 <!-- Description Panel -->
194 <!-- Shown by default when hosted at for kanaka.github.com -->
195 <div id="noVNC_description" class="">
196 noVNC is a browser based VNC client implemented using HTML5 Canvas
197 and WebSockets. You will either need a VNC server with WebSockets
198 support (such as <a href="http://libvncserver.sourceforge.net/">libvncserver</a>)
199 or you will need to use
200 <a href="https://github.com/kanaka/websockify">websockify</a>
201 to bridge between your browser and VNC server. See the noVNC
202 <a href="https://github.com/kanaka/noVNC">README</a>
203 and <a href="http://kanaka.github.com/noVNC">website</a>
204 for more information.
205 <br />
206 <input id="noVNC_description_button" type="button" value="Close" />
207 </div>
208
209 <!-- Popup Status -->
210 <div id="noVNC_popup_status" class="">
211 </div>
212
213 </div> <!-- End of noVNC_control_bar -->
214
215 <div id="noVNC_container">
216 <h1 id="noVNC_logo"><span>no</span><br />VNC</h1>
217
218 <!-- HTML5 Canvas -->
219 <div id="noVNC_screen">
220 <canvas id="noVNC_canvas" width="0" height="0">
221 Canvas not supported.
222 </canvas>
223 </div>
224
225 </div>
226 <!-- begin scripts -->
227 <script src="core/util.js"></script>
228 <script src="app/webutil.js"></script>
229 <script src="app/ui.js"></script>
230 <!-- end scripts -->
231
232 </body>
233 </html>