Add initial VNC UI.

res/app/control-panes/advanced/advanced.jade

@@ -5,5 +5,9 @@
     div(ng-include='"control-panes/advanced/input/input.jade"')
   .col-md-6
     div(ng-include='"control-panes/advanced/port-forwarding/port-forwarding.jade"')
+.row
+  .col-md-6
+    div(ng-include='"control-panes/advanced/vnc/vnc.jade"')
+
   .col-md-6
     div(ng-include='"control-panes/advanced/maintenance/maintenance.jade"')

res/app/control-panes/advanced/index.js

@@ -4,6 +4,7 @@ module.exports = angular.module('stf.advanced', [
   require('./input').name,
 //  require('./run-js').name,
 //  require('./usb').name,
+  require('./vnc').name,
   require('./port-forwarding').name,
   require('./maintenance').name
 ])

res/app/control-panes/advanced/port-forwarding/port-forwarding.jade

@@ -1,7 +1,7 @@
 .widget-container.fluid-height.stf-port-forwarding(ng-controller='PortForwardingCtrl')
   .heading
     span
-      stacked-icon(icon='fa-random', color='color-darkgreen')
+      stacked-icon(icon='fa-random', color='color-orange')
       span(translate, ng-click='isCollapsed = !isCollapsed').pointer Port Forwarding
 
       button.btn.pull-right.btn-sm.btn-primary-outline(

res/app/control-panes/advanced/vnc/index.js

@@ -0,0 +1,12 @@
+require('./vnc.css')
+
+module.exports = angular.module('stf.vnc', [
+  require('gettext').name
+])
+  .run(["$templateCache", function ($templateCache) {
+    $templateCache.put(
+      'control-panes/advanced/vnc/vnc.jade',
+      require('./vnc.jade')
+    )
+  }])
+  .controller('VNCCtrl', require('./vnc-controller'))

res/app/control-panes/advanced/vnc/vnc-controller.js

@@ -0,0 +1,10 @@
+module.exports = function RemoteDebugCtrl($scope) {
+  $scope.vnc = {}
+
+  $scope.generateVNCLogin = function () {
+    $scope.vnc = {
+      serverHost: 'localhost:7042'
+    , serverPassword: '12345678'
+    }
+  }
+}

res/app/control-panes/advanced/vnc/vnc-spec.js

@@ -0,0 +1,17 @@
+describe('VNCCtrl', function () {
+
+  beforeEach(angular.mock.module(require('./').name));
+
+  var scope, ctrl;
+
+  beforeEach(inject(function ($rootScope, $controller) {
+    scope = $rootScope.$new();
+    ctrl = $controller('VNCCtrl', {$scope: scope});
+  }));
+
+  it('should ...', inject(function () {
+    expect(1).toEqual(1);
+
+  }));
+
+});

res/app/control-panes/advanced/vnc/vnc.css

@@ -0,0 +1,11 @@
+.stf-vnc {
+
+}
+
+.stf-vnc .vnc-server-host,
+.stv-vnc .vnc-server-password {
+  font-family: Monaco, Menlo, Consolas, "Courier New", monospace;
+  font-size: 12px;
+}
+
+

res/app/control-panes/advanced/vnc/vnc.jade

@@ -0,0 +1,24 @@
+.widget-container.fluid-height.stf-vnc(ng-controller='VNCCtrl')
+  .heading
+    stacked-icon(icon='fa-eye', color='color-darkgreen')
+    span(translate) VNC
+
+    button.btn.pull-right.btn-sm.btn-primary-outline(
+    ng-click='generateVNCLogin()', tooltip='{{"Generate Login for VNC"|translate}}')
+      i.fa.fa-plus.fa-fw
+
+  .widget-content.padded
+    form(name='vncloginform', ng-show='vnc.serverHost')
+      table.table.table-condensed
+        thead
+          tr
+            th(colspan='1')
+              span(translate) Server
+            th(colspan='1')
+              span(translate) Password
+        tbody
+          tr
+            td(width='70%')
+              input.form-control.input-sm(type='text', ng-model='vnc.serverHost', readonly, text-focus-select).vnc-server-host
+            td(width='30%')
+              input.form-control.input-sm(type='text', ng-model='vnc.serverPassword', readonly, text-focus-select).vnc-server-password