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)