add remote desktop

This commit is contained in:
lxsang 2020-07-10 16:09:23 +02:00
parent 7f773c4600
commit 4b9645edb1
12 changed files with 165 additions and 396 deletions

View File

@ -8,3 +8,8 @@ Further information on **wvnc**: [https://blog.lxsang.me/post/id/23](https://blo
**Credit** **Credit**
* antd-wvnc-plugin: [https://github.com/lxsang/antd-wvnc-plugin](https://github.com/lxsang/antd-wvnc-plugin) * antd-wvnc-plugin: [https://github.com/lxsang/antd-wvnc-plugin](https://github.com/lxsang/antd-wvnc-plugin)
* wvnc.js: [https://github.com/lxsang/wvnc.js](https://github.com/lxsang/wvnc.js) * wvnc.js: [https://github.com/lxsang/wvnc.js](https://github.com/lxsang/wvnc.js)
*
## Change logs
* v0.1.0 - adapt to the new AntOS API

View File

@ -5,5 +5,6 @@ afx-app-window[data-id="RemoteDesktop"] div[data-id="container"]
afx-app-window[data-id="RemoteDesktop"] canvas[data-id="screen"] afx-app-window[data-id="RemoteDesktop"] canvas[data-id="screen"]
{ {
border:0; border:0;
margin:0 auto; margin: auto;
display: block;
} }

View File

@ -8,3 +8,8 @@ Further information on **wvnc**: [https://blog.lxsang.me/post/id/23](https://blo
**Credit** **Credit**
* antd-wvnc-plugin: [https://github.com/lxsang/antd-wvnc-plugin](https://github.com/lxsang/antd-wvnc-plugin) * antd-wvnc-plugin: [https://github.com/lxsang/antd-wvnc-plugin](https://github.com/lxsang/antd-wvnc-plugin)
* wvnc.js: [https://github.com/lxsang/wvnc.js](https://github.com/lxsang/wvnc.js) * wvnc.js: [https://github.com/lxsang/wvnc.js](https://github.com/lxsang/wvnc.js)
*
## Change logs
* v0.1.0 - adapt to the new AntOS API

View File

@ -6,5 +6,6 @@ afx-app-window[data-id="RemoteDesktop"] div[data-id="container"]
afx-app-window[data-id="RemoteDesktop"] canvas[data-id="screen"] afx-app-window[data-id="RemoteDesktop"] canvas[data-id="screen"]
{ {
border:0; border:0;
margin:0 auto; margin: auto;
display: block;
} }

File diff suppressed because one or more lines are too long

View File

@ -6,7 +6,7 @@
"author": "", "author": "",
"email": "" "email": ""
}, },
"version":"0.0.1-a", "version":"0.1.0-a",
"category":"Other", "category":"Other",
"icon": "icon.png", "icon": "icon.png",
"mimes":["none"] "mimes":["none"]

Binary file not shown.

View File

@ -1,113 +1,138 @@
class ConnectionDialog extends this.OS.GUI.BasicDialog class ConnectionDialog extends this.OS.GUI.BasicDialog
constructor: () -> constructor: () ->
super "ConnectionDialog", { super "ConnectionDialog", ConnectionDialog.scheme
tags: [
{ tag: "afx-label", att: 'text="__(VNC server)" data-height="23" class="header"' },
{ tag: "input", att: 'data-height="30"' }, main: () ->
{ tag: "afx-label", att: 'text="__(Bits per pixel)" data-height="23" class="header"' }, super.main()
{ tag: "afx-list-view", att: 'dropdown="true" data-height="30"' }, @find("bbp").data = [
{ tag: "afx-label", att: 'text="__(Compression)" data-height="23" class="header"' }, { text: "16 bits", value: 16, selected: true },
{ tag: "afx-list-view", att: 'dropdown="true" data-height="30"' }, { text: "32 bits", value: 32 }
{ tag: "afx-label", att: 'text="__(JPEG quality)" data-height="23" class="header"' }, ]
{ tag: "afx-slider", att: 'max="100" data-height="30"' }, @find("compression").data = [
{ tag: "div", att: ' data-height="5"' }
],
width: 350,
height: 280,
resizable: false,
buttons: [
{
label: "__(Connect)",
onclick: (d) ->
return unless d.handler
data =
server: (d.find "content1").value
bbp: ((d.find "content3").get "selected").value,
flag: ((d.find "content5").get "selected").value,
quality:((d.find "content7").get "value")
d.handler data
d.quit()
},
{ label: "__(Cancel)", onclick: (d) -> d.quit() }
],
filldata: (d) ->
(d.find "content1").value = "/opt/www/vnc.conf"
(d.find "content3").set "items", [
{ text: "16 bits", value: 16 },
{ text: "32 bits", value: 32, selected:true}]
(d.find "content5").set "items", [
{text: "No compression", value:0}, {text: "No compression", value:0},
{text: "JPEG", value:1}, {text: "JPEG", value:1},
{text: "zLib", value:2}, {text: "zLib", value:2},
{text: "JPEG & zLib", value:3, selected:true} {text: "JPEG & zLib", value:3, selected:true}
] ]
(d.find "content7").set "value", 40 @find("jq").value = 40
} @find("bt-ok").onbtclick = (e) =>
return unless @handle
data =
wvnc: (@find "txtWVNC").value
server: (@find "txtServer").value
bbp: (@find "bbp").selectedItem.data.value,
flag: (@find "compression").selectedItem.data.value,
quality:(@find "jq").value
@handle data
@quit()
@find("bt-cancel").onbtclick = (e) =>
@quit()
ConnectionDialog.scheme = """
<afx-app-window width='350' height='270'>
<afx-hbox>
<div data-width="5"></div>
<afx-vbox>
<afx-label text="__(WVNC Websocket)" data-height="25" class="header" ></afx-label>
<input data-height="25" data-id="txtWVNC" value="wss://localhost/wvnc"></input>
<afx-label text="__(VNC Server)" data-height="25" class="header" ></afx-label>
<input data-height="25" data-id="txtServer" value="192.168.1.10:5900"></input>
<div data-height="5"></div>
<afx-label text="__(Bits per pixel)" data-height="25" class="header" ></afx-label>
<afx-list-view dropdown = "true" data-id ="bbp" data-height="25" ></afx-list-view>
<div data-height="5"></div>
<afx-label text="__(Compression)" data-height="25" class="header" ></afx-label>
<afx-list-view dropdown = "true" data-id ="compression" data-height="25" ></afx-list-view>
<div data-height="5"></div>
<afx-label text="__(JPEG quality)" data-height="25" class="header" ></afx-label>
<afx-slider data-id ="jq" data-height="25" ></afx-slider>
<afx-hbox data-height = '30'>
<div style=' text-align:right;'>
<afx-button data-id = "bt-ok" text = "__(Connect)"></afx-button>
<afx-button data-id = "bt-cancel" text = "__(Cancel)"></afx-button>
</div>
<div data-width="5"></div>
</afx-hbox>
</afx-vbox>
<div data-width="5"></div>
</afx-hbox>
</afx-app-window>
"""
class CredentialDialog extends this.OS.GUI.BasicDialog class CredentialDialog extends this.OS.GUI.BasicDialog
constructor: () -> constructor: () ->
super "ConnectionDialog", { super "CredentialDialog", CredentialDialog.scheme
tags: [
{ tag: "afx-label", att: 'text="__(User name)" data-height="23" class="header"' },
{ tag: "input", att: 'data-height="30"' },
{ tag: "afx-label", att: 'text="__(Password)" data-height="23" class="header"' },
{ tag: "input", att: 'data-height="30" type="password"' },
{ tag: "div", att: ' data-height="5"' }
],
width: 350,
height: 150,
resizable: false,
buttons: [
{
label: "__(Ok)",
onclick: (d) ->
return d.quit() unless d.handler
data =
username: (d.find "content1").value
password: (d.find "content3").value
d.handler data
d.quit()
},
{ label: "__(Cancel)", onclick: (d) -> d.quit() }
],
filldata: (d) ->
(d.find "content1").value = "demo"
(d.find "content3").value = "demo"
}
class RemoteDesktop extends this.OS.GUI.BaseApplication main: () ->
@find("bt-ok").onbtclick = () =>
return @quit() unless @handle
data =
username: (@find "txtUser").value
password: (@find "txtPass").value
@handle data
@quit()
@find("bt-cancel").onbtclick = () =>
@quit()
CredentialDialog.scheme = """
<afx-app-window width='350' height='150'>
<afx-vbox>
<afx-label text="__(Username)" data-height="25" class="header" ></afx-label>
<input data-height="30" data-id="txtUser"></input>
<afx-label text="__(Password)" data-height="25" class="header" ></afx-label>
<input type="password" data-height="30" data-id="txtPass"></input>
<afx-hbox data-height = '30'>
<div style=' text-align:right;'>
<afx-button data-id = "bt-ok" text = "__(Ok)"></afx-button>
<afx-button data-id = "bt-cancel" text = "__(Cancel)"></afx-button>
</div>
<div data-width="5"></div>
</afx-hbox>
</afx-vbox>
</afx-app-window>
"""
class RemoteDesktop extends this.OS.application.BaseApplication
constructor: ( args ) -> constructor: ( args ) ->
super "RemoteDesktop", args super "RemoteDesktop", args
main: () -> main: () ->
me = @
@canvas = @find "screen" @canvas = @find "screen"
@container = @find "container" @container = @find "container"
@client = new WVNC { @client = new WVNC {
element: me.canvas, element: @canvas,
ws: 'wss://localhost:9192/wvnc', worker: "#{@_api.handle.get}/#{@meta().path}/decoder.js"
worker: "#{me._api.handler.get}/#{me.meta().path}/decoder.js"
} }
@client.onerror = (m) -> @client.onerror = (m) =>
me.error m @error m
me.showConnectionDialog() @showConnectionDialog()
@client.onresize = ()-> @client.onresize = ()=>
me.setScale() @setScale()
@client.onpassword = ()-> @client.onpassword = ()=>
return new Promise (r,e)-> return new Promise (r,e)=>
me.openDialog "PromptDialog", (d) -> @openDialog "PromptDialog", {
title: __("VNC password"),
label: __("VNC password"),
value: "!x$@n9ph",
type: "password"
}
.then (d) ->
r(d) r(d)
, __("VNC password"), { label: __("VNC password"), value: "demopass", type: "password" }
@client.oncredential = () -> @client.oncredential = () =>
return new Promise (r,e) -> return new Promise (r,e) =>
me.openDialog new CredentialDialog, (d) -> @openDialog new CredentialDialog, { title: __("User credential") }
.then (d) ->
r(d.username, d.password) r(d.username, d.password)
, __("User credential") @on "resize", (e)=> @setScale()
@on "resize", (e)-> me.setScale() @on "focus", (e) => $(@canvas).focus()
@on "focus", (e) -> $(me.canvas).focus() @client.init().then () =>
@client.init().then () -> @showConnectionDialog()
me.showConnectionDialog()
setScale: () -> setScale: () ->
return unless @client and @client.resolution return unless @client and @client.resolution
@ -118,15 +143,15 @@ class RemoteDesktop extends this.OS.GUI.BaseApplication
if sx > sy then @client.setScale sy else @client.setScale sx if sx > sy then @client.setScale sy else @client.setScale sx
menu: () -> menu: () ->
me = @
[ [
{ {
text: "__(Connection)", text: "__(Connection)",
child: [ nodes: [
{ text: "__(New Connection)", dataid: "#{@name}-new", }, { text: "__(New Connection)", dataid: "#{@name}-new", },
{ text: "__(Disconnect)", dataid: "#{@name}-close" } { text: "__(Disconnect)", dataid: "#{@name}-close" }
], ],
onmenuselect: (e) -> me.actionConnection() onchildselect: (e) => @actionConnection()
} }
] ]
@ -135,11 +160,15 @@ class RemoteDesktop extends this.OS.GUI.BaseApplication
@showConnectionDialog() @showConnectionDialog()
showConnectionDialog: () -> showConnectionDialog: () ->
me = @
@openDialog new ConnectionDialog, (d) -> @openDialog new ConnectionDialog, { title: __("Connection")}
me.client.connect d.server, d .then (d) =>
, __("Connection") @client.ws = d.wvnc
console.log d
@client.connect d.server, d
cleanup: () -> cleanup: () ->
@client.disconnect() if @client @client.disconnect() if @client
this.OS.register "RemoteDesktop", RemoteDesktop this.OS.register "RemoteDesktop", RemoteDesktop

View File

@ -6,7 +6,7 @@
"author": "", "author": "",
"email": "" "email": ""
}, },
"version":"0.0.1-a", "version":"0.1.0-a",
"category":"Other", "category":"Other",
"icon": "icon.png", "icon": "icon.png",
"mimes":["none"] "mimes":["none"]

View File

@ -1 +0,0 @@
{"name":"RemoteDesktop","root":"home://workspace/RemoteDesktop","css":["assets/main.css"],"javascripts":["javascripts/wvnc.js"],"coffees":["coffees/main.coffee"],"copies":["assets/scheme.html","package.json","README.md","javascripts/decoder.js","javascripts/wvnc_asm.js","javascripts/wvnc_asm.wasm","assets/icon.png"]}

View File

@ -0,0 +1,8 @@
{
"name": "RemoteDesktop",
"root": "home://workspace/antosdk-apps/RemoteDesktop",
"css": ["assets/main.css"],
"javascripts": ["javascripts/wvnc.js"],
"coffees": ["coffees/main.coffee"],
"copies": ["assets/scheme.html", "package.json", "README.md", "javascripts/decoder.js", "javascripts/wvnc_asm.js", "javascripts/wvnc_asm.wasm", "assets/icon.png"]
}

View File

@ -98,6 +98,15 @@
"version": "0.0.7-a", "version": "0.0.7-a",
"download": "https://raw.githubusercontent.com/lxsang/antosdk-apps/master/Preview/build/release/Preview.zip" "download": "https://raw.githubusercontent.com/lxsang/antosdk-apps/master/Preview/build/release/Preview.zip"
}, },
{
"pkgname": "RemoteDesktop",
"name": "WVNC remote desktop",
"description": "https://raw.githubusercontent.com/lxsang/antosdk-apps/master/RemoteDesktop/README.md",
"category": "Other",
"author": "",
"version": "0.1.0-a",
"download": "https://raw.githubusercontent.com/lxsang/antosdk-apps/master/RemoteDesktop/build/release/RemoteDesktop.zip"
},
{ {
"pkgname": "ShowCase", "pkgname": "ShowCase",
"name": "ShowCase", "name": "ShowCase",