Avoid a lot of JavaScript code that can easily be handed using
style sheets instead, specifically items that should only be shown
when on a touch device, or items that depend on the connected state.
The user might be queried for the password during the connect stage
if no password was previously provided. Add a separate dialog for
this rather than abusing the connect dialog.
This commit restructures noVNC, splitting it into the core directory
and the app directory, with the former containing core noVNC parts,
and the latter containing parts specific to the application.
* Element names we use "_" as word-delimiter, not "-"
* Element names use less camel-case
* Element names end with the type
* Element names always start with noVNC_
This change was made in order to make it easier to distinguish
settings-elements from other elements. One example of the problem
that was solved is the two elements "noVNC_clip" and
"noVNC_clipboard" where the first is the setting for clipping mode.
That element was now renamed to "noVNC_setting_clip".
If a token is already present in the path, the new variable
is ignored. In order to properly manipulate the path,
a new method, `WebUtil.injectParamIfMissing` was introduced.
Fixes#536
[@directxman12: fix up path manipulation logic]
Any config variable like host, port, password, token may be
specified either in the query string (like now), or in the URL hash
fragment. In case a given variable is present in both, the value in the
fragment takes precedence. Supplying variables in the fragment avoids
leaking them to the web server hosting the noVNC viewer HTML.
In e543525faa, we switched to creating
a new RFB object on disconnect. This caused issues, however, since
any errors were only displayed briefly before the new "loaded" text
was displayed instead.
Now, we create the RFB object on connect. This essentially removes
the usefulness of the "loaded" state, but prevents the aforementioned
problem.
To facilitate this, the code which does detection of cursor URI support
was moved from this Display constructor (which now calls the new
function) into its own function, `Util.browserSupportsCursorURIs()`.
Fixes#467
* Renamed and reworked fbuClip to clippingDisplay
* Added tests for clippingDisplay
* Use the a noVNC_container which covers the entire page to get the full size
(Fixes#463)
* Added maxWidth and maxHeight to the canvas which can limit the viewport size
* Only show either the canvas or the logo, hide one when the other is shown
* Always center the canvas (previously it was only centered when not clipping)
* Removed iOS specific "position-fixed" fixes and start calling setBarPosition
on every resize
* Removed the noVNC_screen_pad
This commit adds two new addition scaling options. Both options do
local scaling. The first "Local Scaling", does both upscaling and
downscaling. The second option, "Local Downscaling", only downscales.
This is based on work by @mightypenguin (with an additional bug
reported by @glazik12).
This commit updates the UI to allow for different
scaling modes. The "resize" option was changed to
be a dropdown with the following options: "None" (nothing),
"Remote Resizing" (SetDesktopSize).
* Added a resize request (setDesktopSize) triggered when connecting and by
changes to the browser window's size.
* Hid the view-drag-hand when the display area is the same or smaller than the
remote session size.
* Added a setting for the automatic resize feature.
* Updated vnc.html and vnc_auto.html to reflect the changes to the UI.
* This code works in Firefox on Android and on Chrome and Safari on iOS.
* It does not work in Chrome on Android, the enter key is labled "Go" and closes the on screen keyboard when pressed.
* changed the type of the input field (which is used for bringing up the
on-screen keyboards on touch devices) from email to text
* when typing in an input field of type email the user is not allowed to
write parentheses on iOS devices, the keys are disabled.
* tested on iOS 6, iOS 7 and Android 4.3.
button group instead of centered.
* On low resolution devices the padding towards the edges of the screen of
the left and right button groups are now removed.
* Since the status_bar was merged into the control-bar the actual status_bar
element became redundant and was therefor removed.
* Improved the style of the control-bar when there is an error or a warning.
* Implemented a fix so that vnc_auto.html works as intended with the improved
screen real estate patch.
The mobile doctype doesn't not seem to make any difference on iOS so
I'm dropping it and just going with the standard HTML5 version since
the wapforum mobile version may cause issues with IE 10.
Related to issue/pulls:
https://github.com/kanaka/noVNC/issues/194https://github.com/kanaka/noVNC/pull/201https://github.com/kanaka/noVNC/pull/202
In IE9, the window.onload event can fire before dynamically loaded
scripts have finished loading. This can result in either WebSocket (in
the case of vnc_auto.html) or RFB (in the case of vnc.html) not being
defined at the point when window.onload is called.
- Move the load_scripts routine from vnc.js to util.js (so that
websockify can use it too). Also, refactor to work when load_scripts
is called by a script that itself uses load_scripts. When the whole
chain of dynamically loaded scripts is finished then call
window.onscriptsload. Use this mechanism in all the places that
depend on dynamic loading of scripts: vnc.html, vnc_auto.html,
websock.js, tests/vnc_playback.html, and tests/vnc_perf.html.
- Use the new window.onscriptsload handler instead of window.onload.
- Remove include/start.js and do the script loading and startup event
handling in include/ui.js instead.
The MPL 2.0 license is a "file-level" copyleft license vs the
"project-level" nature of the L/GPL. The intention of noVNC has
always been that it should be easy to incorporate into existing
projects and sites whether free/open or proprietary/commercial. The MPL
2.0 is designed for this sort of combination project but still
requires that any distributed modifications to noVNC source files must
also be published under the same license.
In addition, the MPL 2.0 allows the code to be used in L/GPL projects
(the secondary license clause). This means that any projects that are
already incorporating noVNC should not be impacted by this change and
in fact it should clarify the licensing situation (the exact
application of the L/GPL to web applications and interpreted code is
somewhat ambiguous).
The HTML, CSS, image and font files continue to be under more
permissive licenses (see LICENSE.txt). The included websockify python
code remains under a LGPLv3 license although the include/websock.js
file from the websockify component is now under MPL 2.0 as well.
Permission was received from other noVNC authors to make this change to their
code license on the following dates:
- Chris Gordon (UI): Jun 24, 2012
- Antoine Mercadal (DOM,*util.js): Oct 10, 2012
- William Lightning (UltraVNC repeater): Oct 10, 2012
- Mike Tinglof (tight encoding): Oct 15, 2012
Move all the inline Javascript event handlers from vnc.html to
include/ui.js except the load handler which is moved to
include/start.js). This is on the path towards a Chrome
extension/packaged app since inline Javascript is prohibited in that
situation.
Clarify in LICENSE.txt that the noVNC core library is the part that is
LGPLv3 licensed. The HTML, CSS, images and fonts are separate from the
core library and can be modified and distributed with the noVNC core
but under their own license conditions.
HTML and CSS: 2-Clause BSD
Fonts: SIL OFL 1.1
Images: CC BY SA 3.0
In other words, you can modify the layout and appearance of of noVNC
to integrate with an existing or new web site or application without
having to publish the source for those modifications under the LGPLv3.
However, use of and modification of the noVNC core library (i.e. the
core Javascript that makes up noVNC) must still be according to the
LGPLv3.
Chris Gordon was the other contributor to the HTML, CSS, and images
included with noVNC and gave permission for this license clarification
on June 23, 2012.
The Jetty WebSocket server code used by the Clojure version of
websockify doesn't support WebSocket and Web at the same path so pass
in a default value for the path so that we can support the Clojure
version websockify.
Resolve issue: https://github.com/kanaka/noVNC/pull/101
Based on proposal from @mightpenguin:
Matthew Balman <emperor@mightypenguin.org>
If view_only option is set then do not send mouse and keyboard events.
This is not a secure/enforced way to make a client view only. To
enforce view only at the server, most VNC servers support setting
a view only password.
- Remove the images using the old font.
- Simplify the naming of the new control bar icon images.
- Change keyboard input type to 'email'. 'url' type doesn't have
a space bar.
- Some clarifications to main LICENSE.txt file.
- CSS highlighting of buttons when selected.
- Keyboard button tweaked to allow show/hide toggle of keyboard.
Signed-off-by: Chris Gordon <snorkeyg@gmail.com>
Instead of using Google Font API, use local copy of Orbitron for speed
and also in case Internet connection is flaky or unavailable.
More info about Orbitron font here:
http://www.google.com/webfonts/specimen/Orbitron
Orbitron font is:
Copyright (c) 2009, Matt McInerney <matt@pixelspread.com>
Licensed under SIL Open Font License 1.1
see docs/LICENSE.OFL-1.1 or http://scripts.sil.org/OFL
- Make sure that on iOS the clipping setting is always forced to be
enabled.
- Hide the showKeyboard button unless connected.
- Use the URL text entry method and disable autocorrect and
autocapitalize in the show keyboard input box.
Cleanup:
- remove unused changeViewportMeta function from include/ui.js
- remove some debug output and debug CSS.
- rename panel toggle functions and put them in same location in the
code.
- refactor some code from updateState to updateVisualState routine
(renamed from updateSettingsState).
API changes (forward compatible):
- Display: add 'viewport' conf option to turn on and off viewport
mode.
- RFB: add 'viewportDrag' option to enable/disable viewport dragging
mode.
Other:
- Add clip mode setting to default UI. For touch devices, clipping is
forced on.
- Use CSS media queries to adjust visual elements based on screen
size. Especially disconnected logo size/position and button text size.
- Catch page unload while connected and give a confirm dialog.
- Change mouse button selector to a single button that changes between
' ', 'L', 'M', 'R' when clicked (empty means mouse is just being
moved and doesn't send clicks).
- include/ui.js:setViewClip() routine sets the clipping of the
viewport to the current size of the viewport area (if clipping is
enabled).
- include/ui.js:setViewDrag() toggles/enables/disables viewport
dragging mode.
- Add several images for the UI and for Apple devices:
- images/clipboard.png: clipboard menu icon
- images/connect.png: connect menu icon
- images/disconnect.png: disconnect button icon
- images/keyboard.png: show keyboard button
- images/move.png: viewport drag/move toggle button
- images/settings.png: settings menu icon
- images/screen_320x460.png: iOS app/desktop link start image
- images/screen_57x57.png: iOS app icon
- images/screen_700x700.png: full size noVNC image
Another firefox issue is that height: 100% is calculated as 100% of
the containing element even when the containing element is the window.
This means that the size of any sibling element shifts the window size
down by that much and causes the vertical scroll bars to appear. This
doesn't happen in Chrome.
- So instead, put a pad element inside the noVNC_screen element that
is the size of the control bar. This is hidden by the control bar,
however, it causes things to be sized correctly.
- Also, rename noVNC_defaultScreen to noVNC_logo.
- Clean some style specification out of the HTML.
- Add meta tag to vnc.html and vnc_auto.html so that if Chrome Frame
is installed, it is used.
- Add detection to default_controls.js that shows a message with
a Chrome Frame install link if the user is using a version of IE
without Canvas support.
- Fix web.py so that requests have their connection closed after they
are completed. This has been a bug for a while but it prevents
Chrome Frame from working because Chrome Frame doesn't activate
until the initial request connection closes.
New API:
To use the RFB object, you now must instantiate it (this allows more
than one instance of it on the same page).
rfb = new RFB(settings);
The 'settings' variable is a namespace that contains initial default
settings. These can also be set and read using 'rfb.set_FOO()' and
'rfb.get_FOO()' where FOO is the setting name. The current settings
are (and defaults) are:
- target: the DOM Canvas element to use ('VNC_canvas').
- encrypt: whether to encrypt the connection (false)
- true_color: true_color or palette (true)
- b64encode: base64 encode the WebSockets data (true)
- local_cursor: use local cursor rendering (true if supported)
- connectTimeout: milliseconds to wait for connect (2000)
- updateState: callback when RFB state changes (none)
- clipboardReceive: callback when clipboard data received (none)
The parameters to the updateState callback have also changed. The
function spec is now updateState(rfb, state, oldstate, msg):
- rfb: the RFB object that this state change is for.
- state: the new state
- oldstate: the previous state
- msg: a message associate with the state (not always set).
The clipboardReceive spec is clipboardReceive(rfb, text):
- rfb: the RFB object that this text is from.
- text: the clipboard text received.
Changes:
- The RFB and Canvas namespaces are now more proper objects. Private
implementation is no longer exposed and the public API has been made
explicit. Also, instantiation allows more than one VNC connection
on the same page (to complete this, DefaultControls will also need
this same refactoring).
- Added 'none' logging level.
- Removed automatic stylesheet selection workaround in util.js and
move it to defaultcontrols so that it doesn't interfere with
intergration.
- Also, some major JSLinting.
- Fix input, canvas, and cursor tests to work with new model.
The following API changes may affect integrators:
- Settings have been moved out of the RFB.connect() call. Each
setting now has it's own setter function: setEncrypt, setBase64,
setTrueColor, setCursor.
- Encrypt and cursor settings now default to on.
- CSS changes:
- VNC_status_bar for input buttons switched to a element class.
- VNC_buttons split into VNC_buttons_right and
VNC_buttons_left
- New id styles for VNC_settings_menu and VNC_setting
Note: the encrypt, true_color and cursor, logging setting can all be
set on load using query string variables (in addition to host, port
and password).
Client cursor (cursor pseudo-encoding) support has been polished and
activated.
The RFB settings are now presented as radio button list items in
a drop-down "Settings" menu when using the default controls.
Also, in the settings menu is the ability to select between alternate
style-sheets.
Cookie and stylesheet selection support added to util.js.
Instead of relying on FABridge AS -> JS event delivery, we just use
the events to notify JS of pending data. The message handler then
calls the AS readSocketData routine which sends back an array of
the pending WebSocket frames.
There is still a minor bug somewhere that happens after the first
connect where the web-socket-js throws an "INVALID_STATE_ERR: Web
Socket connection has not been established". But, Opera is now usable
and we should be able to drop the packet sequence numbering and
re-ordering code.
Another minor issue to better support Opera is to move JS script
includes to the <head> of the page instead of after the body.
Move DOM manipulation into include/default_controls.js and update
vnc.html to use it.
Add an example vnc_auto.html which automatically connects using
parameters from the query string and doesn't use default_controls.js.
Reorder functions in vnc.js to put external interface functions at the
top of the RFB namespace.
- Instead of onload override, move to RFB.load function that takes
a parameter for the target DOM ID. This allows the user to have
their own onload function.
- Add "VNC_" prefix to all element ID names. Only create DOM elements
if they don't already exist on the page, otherwise use the existing
elements.
- Move all styling to separate stylesheet.
- Use list model for control styling.
On the client side, this adds the as3crypto library to web-socket-js
so that the WebSocket 'wss://' scheme is supported which is WebSocket
over SSL/TLS.
Couple of downsides to the fall-back method:
- This balloons the size of the web-socket-js object from about 12K to 172K.
- Getting it working required disabling RFC2718 web proxy support
in web-socket-js.
- It makes the web-socket-js fallback even slower with the
encryption overhead.
The server side (wsproxy.py) uses python SSL support. The proxy
automatically detects the type of incoming connection whether flash
policy request, SSL/TLS handshake ('wss://') or plain socket
('ws://').
Also added a check-box to the web page to enable/disabled 'wss://'
encryption.
Query string variable 'b64encode' determine if wsproxy b64 encodes the
results. Variable 'seq_num' determines if sequence numbers are
prepended. This way, sequence numbers are only used with the flash
WebSocket proxy.
- All state/status updates go through updateState routine which
updates the status line also.
- Old firefox (and opera) don't support canvas createImageData, so use
getImageData as replacement.
- Add console.warn and console.error stubs so that firefox without
firebug doesn't crap out.
- If no WebSockets then error if no flash or if URL is location (flash
will refuse to load the object for security reasons).
- web-socket-js is from http://github.com/gimite/web-socket-js. It is
a flash object that emultates WebSockets.
Unfortunately, events (or packets) from the web-socket-js object can
get re-ordered so we need to know the packet order.
- So wsproxy.py prepends the sequence number of the packet when
sending.
- If the client receives packets out of order it queues them up and
scans the queue for the sequence number it's looking for until
things are back on track. Gross, but hey: It works!
- Also, add packet sequence checking to wstest.*
- A textarea below the VNC area represents the state of the current
VNC clipboard. If there is a server cut event, the textarea will be
updated. If the user updates the contents of the textarea, the new
data will be sent as a client paste (cut) event.
- One important change was to detect if the clipboard is focused and
allow the user to type in the clipboard instead of in the VNC area.
- host, port and password input boxes (populated by URL values).
- clear canvas on disconnect.
- Dotted border around VNC area.
- mirror bits for VNC password.
- DES encryption for VNC bit mirrors every bytes of the password. This
commit has a hard-coded mirrored password. Need to ask user and bit
mirror it.
- With image data across the wire it's Blue,Green,Red, so twiddle
things around a bit.
Pierre Ossman
Samuel Mannehed
Solly Ross
Miguel Xavier Penha Neto
Ganesh Varadarajan
Fabian Zaremba
Malcolm Scott
Samuel Mannehed
Peter Åstrand (astrand)
Joel Martin
William Lightning
Chris Gordon