I.e. if the page is https:// then the WebSocket encrypt setting will
default to wss:// (TLS encryption).
Note that since noVNC settings are saved in cookies, this will only
affect first load. If you have already loaded the page, then the
encrypt setting will be whatever you last set it to.
Conflicts:
include/display.js
include/rfb.js
This merges in the fix for https://github.com/kanaka/noVNC/issues/70
This changes noVNC to use the preferred color ordering that most VNC
server prefer and that VMWare VNC requires. It's possible this may
break some VNC servers out there in which case we might have to do
something a bit more subtle such as having alternate render functions
for little and big endian color ordering.
Issue: https://github.com/kanaka/noVNC/issues/118
Reporter @maxnet also found and suggested the fix.
Probably could be more intelligent/generic by keying off the depth
sent by the server, but this will do for now.
Pull from websockify: 008a5118e728.
Should address issue https://github.com/kanaka/noVNC/issues/107
- Also add ability to force use of web-socket-js using
window.WEB_SOCKET_FORCE_FLASH
- in websock.js, for rQshift*, assume length is the full length if not
specified.
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
Display API change:
- getTile -> startTile (no longer returns a tile)
- setSubTile -> subTile (drop img/tile first parameter)
- putTile -> finishTile (no longer takes img/tile paramter)
The Display tile logic uses canvas image data directly and
caches/reuses a 16x16 imageData tile (for other sizes, the tile is
create for each call). This gives a 30% speedup on Chrome
13 (and no significant change for Firefox 3.6/4.0).
Other:
- Remove rgbxImageFill and cmapImageFill routines.
- Simplify constructor tests and just error if createImageData is not
supported by canvas instead of .
- Remove webkit canvas bug workaround that effects Chrome 7. Chrome
7 usage share is now less than 0.5 percent and the workaround is
ugly. Drop the function wrapping in the constructor and the canvas
flush() routine.
- Remove support for getImageData (Opera 11+ now required)
Update browser support list:
- Chrome 8+ (really any except 7)
- Firefox 3.6+
- Safari 4+
- Opera 11+
- IE9+
- iOS 4.2+
- 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
New routine fbUpdateRequests that builds the update request messages
based on the result of display.getCleanDirtyReset().
- Also, fix fbUpdateRequest to properly accept x,y,xw,yw parameters.
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.
For some reason, the position calculation is broken in firefox when
a DOM object in the ancestry change uses padding. So use margin to
shift the view area down.
Part of mobile device support:
https://github.com/kanaka/noVNC/issues/48
The Display object is redefined as a larger display region with
an equal or smaller visible viewport. The size of the full display
region is set/changed using resize(). The viewport is set/changed
using viewportChange().
All exposed routines that draw on the display now take coordinates
that are absolute (relative to the full display region). For example,
the result of fillRect(100, 100, 10, 10, [255,0,0]) will appear in the
canvas at (0,0) if the viewport is set to (100,100).
Details:
- Move the generic part of the viewport code from tests/viewport.html
into include/display.
- Add two new routines to the Display interface:
- viewportChange(deltaX, deltaY, width, height)
- This adjusts the position of the visible viewport and/or the
size of the viewport.
- deltaX and deltaY specify how the position of the viewport
should be shifted. The position of the viewport is clamped
to the full region size (i.e. cannot outside the display
region).
- The clean and dirty regions of the display are updated based
on calls to this routine. For example, if the viewport width
is increased, then there is now a dirty box on the right
side of the viewport. Another example, if the viewport is
shifted down and to the left over the display region, there
are now two dirty boxes: one on the left side and one
on the bottom of the viewport.
- getCleanDirtyReset()
- This returns an object with the clean box and a list of
dirty boxes (that need to be redrawn).
{'cleanBox':
{'x': x, 'y': y, 'w': w, 'h': h},
'dirtyBoxes':
[{'x': x, 'y': y, 'w': w, 'h': h}, ...]
}
- The coordinates in the clean and dirty boxes are absolute
coordinates (relative to the full display region) but they
are clipped to the visible viewport.
- Calling this function also resets the clean rectangle to be
the whole viewport (i.e. nothing visible needs to be redrawn
dirty) so the caller of this routine is responsible for
redrawing any
Tested on iOS (iPhone and iPad).
The viewport is correctly clipped to the screen/browser size and
resizing works correctly.
This uses the CSS3 Flexible Box Layout model.
First crack at supporting touch screen for devices like Android and
iOS tablets. Part of https://github.com/kanaka/noVNC/issues/48.
This change detects touch screen support and uses the touchstart,
touchmove, touchend events in place of the normal mouse events.
In order to support middle and right mouse clicks, if the device is
a touch device, then three toggle buttons are added to the UI
representing the left, middle and right mouse buttons. These select
which mouse button will be sent when the screen is touched. All the
buttons can be toggled off, in which case then the touch events only
move the mouse cursor rather than sending a mouse down and mouse up
for touchstart and touchend events respectively. This allows fairly
full control with the mouse on touch screens.
Instead of R,G,B (red-shift of 0, green-shift of 8, and blue-shift
of 16), use the default ordering of B,G,R (red-shift of 16, green-shift of 8, and blue-shift
of 0) that tightvncserver uses (and that VMWare's VNC server seems to
require). Also, warn in the console if the server does not default to
the new format.
Fix the tests/canvas.html test. This is a general fix with regards to
the rename/refactor of canvas.js into display.js and not specific to
the color re-ordering.
noVNC version 0.1
Add debian packaging directory loosely based on
http://trac.zentyal.org/browser/trunk/extra/novnc/debian
Show web root directory on startup (pulled from websockify f1c8223).
Lintian fixups:
- Some license text clarifications.
- remove executable permission on utils/launch.sh and
include/web-socket-js/web_socket.js
- Add executable permission to utils/launch.sh
This addresses issue #65:
https://github.com/kanaka/noVNC/issues/65
When tightPNG encoded rects were received, any fill types were
immediately drawn to the canvas while images (PNG, JPEGs) were queued
for loading. This can cause screen corruption when things are changing
rapidly due to the misordering of fills vs images.
Also, remove the onload setting in each image on the queue and instead
decrease the tight image queue scanning interval (to 40ms or 25
scans per second).
- Add conf_defaults which accepts an array of configuration
attributes.
- Split out user configuration defaults from the actual configuration
object.
- Add mode field and enforce read-only, write-once, read-write modes.
API changes:
- include/canvas.js renamed to include/display.js
- Display.rescale() method removed from API. Use Display.set_scale() instead.
- Make logo configuration attribute of Display and display it when
clear() is called if it is set.
API deprecations:
- use RFB onUpdateState instead of updateState.
- use RFB onClipboard instead of clipboardReceive.
See https://github.com/kanaka/noVNC/wiki/ModuleAPI for detailed noVNC
modules and API description.
Expand and normalize the event/callback interfaces. Standize on
"onEventName" form for callbacks.
Callback Renames:
- RFB updateState -> onUpdateState
- RFB clipboardReceive -> onClipboard
- Keyboard keyPress -> onKeyPress
- Mouse mouseButton -> onMouseButton
- Mouse mouseMove -> onMouseMove
Callback Additions:
- RFB onPasswordRequired
- RFB onBell
- RFB onFBUReceive
- RFB onFBUComplete
Other:
- Add array type support to Util.conf_default()
- Removed a bunch of routines from the Display API that were just used
internally and not actually by noVNC: flush, setFillColor,
imageDataGet, imageDataCreate, rgbxImageData, rgbxImageFill,
cmapImageData, cmapImageFill.
- More keyboard/mouse logging when debug turned on.
- Some JSLinting
Issue #21 - non-US keyboard layouts.
The code section for tab, backspace and enter was commented out for
testing but got checked in that way. Fix that.
Issue #21 - non-US keyboard layouts.
Only identify some keys as special during the keyDown event so that
when using non-US keyboards the values don't overlap with the values
for normal keys.
Some keys have to still be identified in both keyDown and keyPress
since they generate both: backspace and enter for Firefox and Opera,
tab for Opera.
This is part of addressing issue #21 - non-US keyboard layouts.
There are several challenges when dealing with keyboard events:
- The meaning and use of keyCode, charCode and which depends on
both the browser and the event type (keyDown/Up vs keyPress).
- We cannot automatically determine the keyboard layout
- The keyDown and keyUp events have a keyCode value that has not
been translated by modifier keys.
- The keyPress event has a translated (for layout and modifiers)
character code but the attribute containing it differs. keyCode
contains the translated value in WebKit (Chrome/Safari), Opera
11 and IE9. charCode contains the value in WebKit and Firefox.
The which attribute contains the value on WebKit, Firefox and
Opera 11.
- The keyDown/Up keyCode value indicates (sort of) the physical
key was pressed but only for standard US layout. On a US
keyboard, the '-' and '_' characters are on the same key and
generate a keyCode value of 189. But on an AZERTY keyboard even
though they are different physical keys they both still
generate a keyCode of 189!
- To prevent a key event from propagating to the browser and
causing unwanted default actions (such as closing a tab,
opening a menu, shifting focus, etc) we must suppress this
event in both keyDown and keyPress because not all key strokes
generate on a keyPress event. Also, in WebKit and IE9
suppressing the keyDown prevents a keyPress but other browsers
still generated a keyPress even if keyDown is suppressed.
For safe key events, we wait until the keyPress event before
reporting a key down event. For unsafe key events, we report a key
down event when the keyDown event fires and we suppress any further
actions (including keyPress).
In order to report a key up event that matches what we reported
for the key down event, we keep a list of keys that are currently
down. When the keyDown event happens, we add the key event to the
list. If it is a safe key event, then we update the which attribute
in the most recent item on the list when we received a keyPress
event (keyPress should immediately follow keyDown). When we
received a keyUp event we search for the event on the list with
a matching keyCode and we report the character code using the value
in the 'which' attribute that was stored with that key.
For character codes above 255 we use a character code to keysym lookup
table. This is generated using the util/u2x11 script contributed by
Colin Dean (xvpsource.org).
API change: for intergrators that explicitly include the Javascript
files (that do not use include/vnc.js)js, include/input.js is a new
file that must also be included.
The mouse and keyboard handling could be useful on its own so split it
out into a Keyboard and Mouse class in include/input.js.
This refactoring is preparation to deal with issue #21 - non-US
keyboard layouts.
Fix mouse button mapping in IE9. All browsers have converged on
a standard left=0, middle=1, right=2 ... all except IE that is.
Add html5 doctype to tests.
In vnc_perf test, use do_test instead of start for function name since
start is a keyword in IE.
In error about Flash give a link to Adobe's download page.
Current timeout is 2 seconds for connect timeout. Use 5 seconds if
web-socket-js (Flash WebSockets emulator) is being used. On Windows XP
with Flash 10.2.152.26, connecting seems to take quite a bit longer
than it probably should. This should make it work more consistently.
Syncs with same change to websockify (7534574a2f).
Primary change is removal of FABridge interface.
Seems to improve overall latency by perhaps 10%. Also, the slowdown
over time in Opera is about half as bad (but still there).
Thanks to Michael Sersen for creating images/Logo.svg.
- Add images directory with original SVG logo, favicon, and some
derivative PNGs of the logo for different purpose.
- Note that license on images/* is CC BY-SA.
- Add utils/img2js.py to take an image and generate a base64 encoded
data URI string.
- Add base64 encoded data URI screen logo to display in canvas when
disconnected.
API change: changed include path variable from VNC_uri_prefix to
URI_INCLUDE since websock.js uses the variable and websock.js is no
longer just for noVNC (i.e. websockify is really the canonical
location for websock.js).
Changes to get web-socket-js to work. Right now it's a hack to get
around: https://github.com/gimite/web-socket-js/issues#issue/41. The
hack is to disable caching of the flash objects by appending
"?" + Math.random() to the end of the flash object path (but only when
using IE).
Opera 11 native WebSockets (if enabled) seems to have bad behavior for
the bufferedAmount so add change from websockify project to allow max
bufferedAmount (before send queue is delay) to be configured.
Also, Opera 11 and 10.60 behave like Mozilla regarding the '-' key so
translate it correctly.
If all send data was flushed from the send queue then return true,
otherwise false. This doesn't mean the data won't be sent, just that
it wasn't sent this time and is queued.
Only delay sending data if bufferedAmount is greater than 1000.
This seems to match the intention of the spec better. bufferedAmount
does not mean that we can't send, it's just an indication that the
network is becoming saturated. But Opera 11 native WebSockets seems to
have a bug that bufferedAmount isn't set back to zero correctly so
we'll be a bit more tolerant.
Related to this issue:
https://github.com/gimite/web-socket-js/issues/#issue/50
This prevents the "Uncaught exception: TypeError:
'this.__handleEvents' is not a function" everytime the timer fires.
Yay, one of Javascript's worst behaviors; the way it sets "this".
Issues #27 (safari cursor rendering messed up) and #29 (firefox 3.6.10
segault).
Finally found some better reference on the icon/cursor format which is
added to the docs/links file.
It seems like I was missing the XOR section. So setting the cursor
would cause corruptin in Safari rendering or the segfault for firefox.
Update to a build based on 20f837425d4 from gimite/web-socket-js.
This changes the event handling code and fixes the frequent recursive
call into Flash errors.
wswrapper:
Getting the wswrapper.c LD_PRELOAD model working has turned out to
involve too many dark corners of the glibc/POSIX file descriptor
space. I realized that 95% of what I want can be accomplished by
adding a "wrap command" mode to wsproxy.
The code is still there for now, but consider it experimental at
best. Minor fix to dup2 and add dup and dup3 logging.
wsproxy Wrap Command:
In wsproxy wrap command mode, a command line is specified instead
of a target address and port. wsproxy then uses a much simpler
LD_PRELOAD library, rebind.so, to move intercept any bind() system
calls made by the program. If the bind() call is for the wsproxy
listen port number then the real bind() system call is issued for
an alternate (free high) port on loopback/localhost. wsproxy then
forwards from the listen address/port to the moved port.
The --wrap-mode argument takes three options that determine the
behavior of wsproxy when the wrapped command returns an exit code
(exit or daemonizing): ignore, exit, respawn.
For example, this runs vncserver on turns port 5901 into
a WebSockets port (rebind.so must be built first):
./utils/wsproxy.py --wrap-mode=ignore 5901 -- vncserver :1
The vncserver command backgrounds itself so the wrap mode is set
to "ignore" so that wsproxy keeps running even after it receives
an exit code from vncserver.
wstelnet:
To demonstrate the wrap command mode, I added WebSockets telnet
client.
For example, this runs telnetd (krb5-telnetd) on turns port 2023
into a WebSockets port (using "respawn" mode since telnetd exits
after each connection closes):
sudo ./utils/wsproxy.py --wrap-mode=respawn 2023 -- telnetd -debug 2023
Then the utils/wstelnet.html page can be used to connect to the
telnetd server on port 2023. The telnet client includes VT100.js
(from http://code.google.com/p/sshconsole) which handles the
terminal emulation and rendering.
rebind:
The rebind LD_PRELOAD library is used by wsproxy in wrap command
mode to intercept bind() system calls and move the port to
a different port on loopback/localhost. The rebind.so library can
be built by running make in the utils directory.
The rebind library can be used separately from wsproxy by setting
the REBIND_OLD_PORT and REBIND_NEW_PORT environment variables
prior to executing a command. For example:
export export REBIND_PORT_OLD="23"
export export REBIND_PORT_NEW="65023"
LD_PRELOAD=./rebind.so telnetd -debug 23
Alternately, the rebind script does the same thing:
rebind 23 65023 telnetd -debug 23
Other changes/notes:
- wsproxy no longer daemonizes by default. Remove -f/--foreground
option and add -D/--deamon option.
- When wsproxy is used to wrap a command in "respawn" mode, the
command will not be respawn more often than 3 times within 10
seconds.
- Move getKeysym routine out of Canvas object so that it can be called
directly.
Rename the $() selector to $D() so that it doesn't collide with
the jQuery name.
The API change is that the 'target' option for Canvas and RFB objects
must now be a DOM Canvas element. A string is no longer accepted
because this requires that a DOM lookup is done and the Canvas and RFB
should have no UI code in them. Modularity.
Only call encode_message when the WebSockets object is actually
ready to send. Otherwise multiple base64 encode sequences can be
encoded into the same WebSockets frame. This causes the C version of
wsproxy to crash and the python version to ignore the subsequent
base64 sequence(s).
Thanks to Colin Dean (xvpsource.org) for finding this and helping
track it down.
- 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.
This is WebKit bug https://bugs.webkit.org/show_bug.cgi?id=46319
The workaround is to wrap Canvas render functions with a function that
sets a flush timer. The flush function sets the right margin and then
1ms later sets it back. This triggers the canvas to redraw with the
correct contents.
Two downsides:
- rendering is slower, but only on the busted versions of webkit.
Correct and useful is better than fast and useless.
- There is a barely perceptible jitter of the control buttons because
the canvas size is changing by one pixel.
To support this functionality, we also have to read out the exact
webkit version from the user agent in the render engine detection code
in include/util.js.
- Make sure that canvas exists (i.e. didn't throw an error) before
trying to call canvas method get_canvas_uri.
- Typos in HTML render engine debug output.
- Split out ClientInitialisation state.
- In version 3.3 and 3.7, when the server has no auth (scheme
1), then we should skip from Authentication to ClientInitialisation.
- rQwait checks the receive queue to see if there is enough data to
satisfy the following request. If not it returns true (which is
almost always translated into an immediate return false by the
caller).
- rQwait is called quite a bit and this generally allows 4 lines to
become 1 line where it is called.
- rQwait allows simplification of cuttext processing. No global
tracking needed anymore.
Overall, about 60 lines less code.
DES is just used once during authentication and is not performance
sensitive so we save some space by generating and/or removing some
lookup tables. Also, shorten some very frequently used variables.
Shaves off about 100 lines.
- util.js that contains essential functions
- webutils.js that contains the GUI utility function.js
this helps to include noVNC in other project, especially Cappuccino Application
i
The decrypt functionality is never used so remove it. Also, we can
assume that we are always DES encrypting 16 characters which allows
several things to be simplified in DES.
Overall this removes about 80 lines of code.
- include/rfb.js: Keep track of the number of rects of each encoding
type and print them out when we close a connection (if 'info'
logging level).
- tests/vnc_perf.html: first pass at a noVNC based performance
benchmark.
- utils/wsproxy.py: Fix the output of the record filename.
- include/util.js: Add type and desc field to conf_default routine.
Make comment descriptions of settings into desc parameters that can
be queried. Also, use set_FOO in conf_default to set or coerce the
current setting so that we always have the right type for the value.
- include/rfb.js, include/default_config.js: add connectTimeout
setting to address situations with slow connections that may need
more than 2 seconds.
Yet another weird VNC server behavior: sending a failure and length
before the reason message. To calculated the length, the reason string
is already available, why not just send everything as one packet. Oh
well.
- include/canvas.js: When 'debug' logging, show browser detection
values.
- test/canvas.html: Only restore the canvas to it's starting state if
the logging level is not 'debug'.
- wsproxy.py: Append the session number to the record filename so that
multiple sessions don't stomp on each other.
In Safari, local cursor rendering is corrupt. In firefox 3.6.10, local
cursor rendering causes a segfault. Probable that the .cur format is
not 100% compliant (even though it works in Chrome and firefox 3.5 and
firefox 4.0). So just disable it by default until I can figure out how
to address the problems.
Add a new state 'disconnect' to reflect that we are not truly
'disconnected' until we get an onclose event. Add a disconnect timer
to match.
Handle disconnected cleanup better in updateState(). Anytime we enter
in a disconnect/disconnected state, make sure all running state is
cleaned up (WebSocket, timers, canvas).
Filed this issue for this bug:
http://github.com/gimite/web-socket-js/issues/issue/37
Right now the close() call only calls __flash.close() if readyState is OPEN.
But it should really call close any time that readyState is not CLOSED or
CLOSING.
The case I ran into is when I want to do the following:
1. make a test connection
2. tell the server to setup for a connection
3. connect again
I call close on the test connection, but since it is ignored when CONNECTING,
it eventually times out with a error. But by that time I have already issued a
new connection, it causes the new connection to fail. close() should cancel
CONNECTING state too.
Filed this bug about this issue:
http://github.com/gimite/web-socket-js/issues#issue/35
To work around the flash "recursive call" problem, WebSocket.as has
the onclose event disabled in the close() call and the javascript half
of the close() call does the onclose() call instead. This is fine, but
it needs to be asynchronous to act more like what happens with
a normal WebSockets object. The current behavior is that the onclose()
method is called inline (synchronously) when the close() is called and
this inconsistency make state handling more difficult.
web-socket-js now has all the functionality and fixes needed for noVNC
so remove the include/as3crypto_patched directory and the
include/web-socket-js/flash-src directory (i.e. the sources for
web-socket-js). This cleans up almost 3K from the include/ directory.
Update to web-socket-js build based on upstream (gimite/web-socket-js)
9e766377188.
The rfb variable wasn't available at the point settingsDisabled() was
being called since it was called inline with RFB() initialization. To
solve this we pass the updateState rfb variable so that the canvas can
be queried for setting the cursor_uri value.
When the documement/window is scrolled, the onMouseDisable routine was
not properly calculating the position to test whether to ignore the
event or not.
Generally, most servers send hextile updates as single updates
containing many rects. Some servers send hextile updates as many small
framebuffer updates with a few rects each (such as QEMU). This latter
cases revealed that shifting off the beginning of the receive queue
(which happens after each hextile FBU) performs poorly.
This change switches to using an indexed receive queue (instead of
actually shifting off the array). When the receive queue has grown to
a certain size, then it is compacted all at once.
The code is not as clean, but this change results in more than 2X
speedup under Chrome for the pessimal case and 10-20% in firefox.
Apparently there are versions of UltraVNC that report version 3.6.
This is not a legal version according to the spec, but we'll just
force version 3.3 if we receive it. Thanks to Larry Rowe for the info.
Turns out when Windows is running in QEMU and a window scroll happens,
there are lots of little hextile rects sent. This is slow in noVNC.
- Some recording/playback improvement.
- Add test harness to drive playback of recordings.
- By pulling off the rect header in one chunk we get a 3X speedup in
Chrome and a 20% speedup in firefox (specifically for the scroll
test).
- Also, get rid of some noise from creating timers for handle_message.
Check to make sure there isn't already a pending timer first.
This is very usefull when you need to open a new window (with a new document) from javascript,
without having to reload the script.js.
(cherry picked from commit 8ded53c1de06d01e50d58543c19e73926f0fbbd4)
Signed-off-by: Joel Martin <github@martintribe.org>
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.
If cursor Data URI scheme detection threw an exception, it would cause
canvas initialization to fail. cursor detection exceptions should just
disable local cursor change support, not cause canvas init to fail.
Uses the CSS "scale()" operation. The main problem is that the DOM
container is not rescaled, only the size of the displayed content
within it so there will need to be some sort of mechanism to handle
this better so other elements reflow to the new size. Or it might just
not work and be removed later. The zoom property seems to do the right
behavior, but it's not widely supported. Worth exploring though.
After each complete framebufferUpdate, set a short timer to continue
processing the receive queue. This gives other events a chance to
fire. Especially important when noVNC is integrated into another
website.
noVNC was never processing more than one framebufferUpdate message per
onmessage event. If noVNC receives an incomplete framebufferUpdate and
then receives the rest of the framebufferUpdate plus another complete
framebufferUpdate, then it will fall permanently behind.
If there is more to process after a completed framebufferUpdate, then
execute normal_msg again.
All the render routines must return false if there is not enough data
in the receive queue to process their current update, and true
otherwise.
Move the whole RFB object to rfb.js. vnc.js is now just the loader
file. This allows an integrating project to easily replace vnc.js with
an alternate loader mechanism (or just do it directly in the html
file). Thanks for the idea primalmotion (http://github.com/primalmotion).
Also, JSLint the various files.
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.
To change the appearance of the cursor, we use the CSS cursor style
and set the url to a data URI scheme. The image data sent via the
cursor pseudo-encoding has to be encoded to a CUR format file before
being used in the data URI.
During Canvas initialization we try and set a simple cursor to see if
the browser has support. Opera is missing support for data URI scheme
in cursor URLs.
Disabled for now until we have a better way of specifying settings
overall (too many settings for control bar now).
Add new states 'loaded', 'connect' and 'fatal':
- Loaded state is first page state. Pass WebSockets mode message using
this state.
- Connect indicates that the user has issued a "connect" but we
haven't gotten an WebSockets onopen yet.
- Fatal is a condition that indicates inability to continue on: right
now, lack of WebSockets/Flash or non-working canvas.
Move much of the actual state transition code into updateState.
Handle 'password' state better in default_controls.js; instead of
disconnecting, prompt for password to send.
Add comments to updateState indicating possible states.
Util.Debug, Util.Info, Util.Warn, Util.Error routines instead of
direct calls to console.*. Add "logging=XXX" query variable that sets
the logging level (default is "warn").
Logging values:
debug: code debug logging (many calls in performance path are also
commented for performance reasons).
info: informative messages including timing information.
warn: significant events
error: something has gone wrong
The problem is, you can't set WebSocket.__swfLocation before you load
web_socket.js (because it creates the WebSocket global), but you also
can't reliably set WebSocket.__swfLocation after because if you are
doing dynamic script file includes then the onload (i.e.
WebSocket.__initialize) may fire before you have a chance to set
Websocket.__swfLocation.
Add message/state pollling in web-socket-js. Since Opera tends to drop
message events, we can dramatically increase performance by polling
every now for message event data.
Also, add more direct calls to update readyState so that it's not
missed when Opera drops events.
When using web-socket-js, the onopen event may happen inline so the
caller may not have time to set onopen before the event fires. In this
case set a short timeout and try again. In particular this affects
Opera most of the time.
Also, to get around Opera event droppings, always read the readyState
directly instead of relying on the local readyState variable to be
correct (which it isn't if stateChange event were dropped).
All browsers with Canvas imageData are faster with JS ops instead of
canvas ops. This gives significant performance improvement in Opera.
Except for missing web-socet-js message notifications, Opera 10.60 is
now faster than firefox 3.5.
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.
Interesting. Enough has changed in the Canvas tile operations, that
Canvas.prefer_js=true is better for firefox/gecko too. Approximately
2X improvement in firefox for large hextile renders.
Looks like disabling web-socket-js debug messages by default that we
get a minor speedup.
Python proxy should support both 75 and 76 (00) modes. Also, update ws
test to more reliably hit the WebSockets ordering/drop issue.
Some default_controls.js jslinting.
Needs to be some modularity between controls you probably always want
(like sending CtrlAltDel) and how the interface is presented and
controlled.
Some basic functions from mootools implemented in util.js.
Also, some more DOM separation. Move clipboard focus logic into
default_controls and canvas and out of vnc.js.
JSLint cleanup.
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.
In colourMap mode there are 256 colours in a colour palette sent from
the server via the SetColourMapEntries message. This reduces the
bandwidth by about 1/4. However, appearance can be somewhat less than
ideal (pinks instead of gray, etc).
It also increases client side rendering performance especially on
firefox. Rendering a full 800x600 update takes about 950ms in
firefox on my system compared to about 1400ms. Round-trip time for
a full frame buffer update is even better on firefox (due to
performance of the flash WebSocket emulator). Reduced from about
1800ms to 1100ms on firefox (for 800x600 full update).
Also add a wsencoding test client/server program to test send a set of
values between client and server and vice-versa to test encodings.
Not turned on by default.
Add support for encode/decode of UTF-8 in the proxy. This leverages
the browser for decoding the WebSocket stream directly instead of
doing base64 decode in the browser itself.
Unfortunately, in Chrome this has negligible impact (round-trip time
is increased slightly likely due to extra python processing).
In firefox, due to the use of the flash WebSocket emulator the
performance is even worse. This is because it's really annoying to get
the flash WebSocket emulator to properly decode a UTF-8 bytestream.
The problem is that the readUTFBytes and readMultiByte methods of an
ActionScript ByteArray don't treat 0x00 correctly. They return
a string that ends at the first 0x00, but the index into the ByteArray
has been advanced by however much you requested.
This is very silly for two reasons: ActionScript (and Javascript)
strings can contain 0x00 (they are not null terminated) and second,
UTF-8 can legitimately contain 0x00 values. Since UTF-8 is not
constant width there isn't a great way to determine if those methods
in fact did encounter a 0x00 or they just read the number of bytes
requested.
Doing manual decoding using readUTFByte one character at a time slows
things down quite a bit. And to top it all off, those methods don't
support the alternate UTF-8 encoding for 0x00 ("\xc0\x80"). They also
just treat that encoding as the end of string too.
So to get around this, for now I'm encoding zero as 256 ("\xc4\x80")
and then doing mod 256 in Javascript. Still doesn't result in much
benefit in firefox.
But, it's an interesting approach that could use some more exploration
so I'm leaving in the code in both places.
The purpose of the code is to be incorporated into other web projects
(whether those are free or not). AGPL prevents combination with other
HTML and javascript that is under a weaker (or proprietary) license.
Better would be a lesser AGPL, but there is not GNU standard for that.
So LGPL-3 meets most of my requirements. If somebody modifies the
actual client code and conveys it, then they must release the changes
under LGPL-3 also.
Add some implementation notes in docs/notes.
- By dereferencing the 'data' field of the imageData object before the
loop, the hextile performance on Chrome is down to 140ms or so for
a full 800x600 update. Still have to fall back to Canvas operations
for firefox.
- Fix RQ empty after reorder bug.
- 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.
- 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.*
- 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.
Joel Martin
Mike Tinglof
Mike
Chris Gordon
Ed Schouten
Joel Martin
Antoine Mercadal