Angular noVNC

Port of Joel Martin's noVNC project for angularjs.

Sample app

Fullscreen mode

Install

$ bower install angular-no-vnc

Overview

• Multiple connections\displays over one page.
• Config over directive attributes.
• Full screen mode support.
• Easily scale, fit to width\height.

Usage

Start vnc & ws proxy (server-side)

This module is a port of noVNC project that means you should use websockify proxy to convert over websockets. For me it is:

$ sudo apt-get install -y x11vnc
$ x11vnc -display :0 -N -forever &

To run the websockify install angular-noVNC globally via npm:

$ npm install -g angular-no-vnc #add websockify command
$ websockify --web=.. 44999 localhost:5900

--web=.. will allow you to use sample app in ../index.html for fast check by http://localhost:44999

Note that websockify listens on /websockify path by default. If you want to use another ws path please run websockify --path your_path 44999 localhost:5900

Additional info of usage websockify is here. Others server-side features you might found here.

Use in your application (client-side)

After running websockify, or other ws:// proxy server:

• Add library to your html file and noVNC to your module dependency. var app = angular.module('myApp', ['noVNC']);

• Add directive <vnc host="localhost" port="44999" is-connected="true"></vnc>

• Reload page =)

Configuration

Attribute	Description	Scope type	Default value
host	IP/name of host to connect.	@	window.location.hostname
port	Port of websockify port.	@	window.location.port or 80\http, 443\https
password	Connection password.	@	''
path	Connection path	@	''
true-color	True color representation.	=	true
view-only	Disable keyboard and mouse events.	=	false
is-connected	Connection switcher.	=	false
style	Style of canvas\display element.	=	{}
states	States of system actions. format: [{status: '', msg: ''},].	=	[]
display.scale	Scale of display from 0.1 to 1.	=	1
display.width	Display width.	=	null
display.height	Display height.	=	null
display.fitTo	Fit display to width/height/scale.	=	null
display.fullScreen	Full screen mode switcher.	=	null

Problems

Yes, they are should be in. This port is goes with code changes of big one (noVNC), that's why you need to use it carefully.

Nearby changes

• Add loadable flash ws:// support.
• Add mobile mode support.
• Add clipboard transfer.
• Write tests.
• Add encription support.
• Refactoring and many code improvements.

All improvements need free time. Your stars and issues increase my interest to work with project =)

Contribution

• Fork $ git clone [email protected]:rootStar-lock/angular-noVNC.git.
• Navigate and install npm and bower dependencies. $ cd angular-noVNC && npm install.
• Project driven by gulp build system. Run gulp --tasks to see whats we have.
• Live sample app in index.html
• Use gulp lint and gulp plato to check code complexity and common mistakes.

Forks and pulls will be accepted with love)