dany/antd-web-apps
1
0
Fork 0
mirror of https://github.com/lxsang/antd-web-apps synced 2024-11-20 02:18:20 +01:00
Code Issues Projects Releases Wiki Activity

first working version

Browse Source
This commit is contained in:
Xuan Sang LE 2018-09-18 19:53:00 +02:00
parent 1b09ab53fc
commit c9ea224f22
7 changed files with 235 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
apps/Makefile
View File

@ -14,7 +14,7 @@ main: js
- cd $(BUILDDIR) && ln -s ../grs ./rst
js:
- rm assets/scripts/main.js
- rm assets/scripts/main.*
for f in $(coffees); do (cat "$${f}"; echo) >> assets/scripts/main.coffee; done
coffee --compile assets/scripts/main.coffee
-rm assets/scripts/main.coffee

114
apps/assets/coffee/WVNC.coffee
View File

@ -4,18 +4,95 @@ class WVNC extends window.classes.BaseObject
@socket = undefined
@uri = undefined
@uri = @args[0] if @args and @args.length > 0
@canvas = undefined
@canvas = ($ @args[1])[0] if @args and @args.length > 1
@buffer = $("<canvas>")[0]
@counter = 0
init: () ->
me = @
@ready()
.then () ->
me.openSession()
$("#stop").click (e) -> me.socket.close() if me.socket
$("#connect").click (e) ->
me.counter = 0
me.openSession()
.catch (m, s) ->
console.error(m, s)
initCanvas: (w, h , d) ->
me = @
@depth = d
@buffer.width = w
@buffer.height = h
ctx = @buffer.getContext('2d')
data = ctx.createImageData w, h
ctx.putImageData data, 0, 0
@callback = () ->
me.draw()
@draw()
updateCanvas: (x, y, w, h, pixels) ->
ctx = @buffer.getContext('2d')
ctx.globalAlpha = 1.0
imgData = ctx.createImageData w, h
imgData.data.set @getCanvasImageData(pixels, w, h)
ctx.putImageData imgData, x, y
@counter = @counter + 1
#@draw()
if @counter > 50
@draw()
@couter = 0
getCanvasImageData: (pixels, w, h) ->
return pixels if @depth is 32
step = @depth / 8
npixels = pixels.length / step
data = new Uint8ClampedArray w * h * 4
for i in [0..npixels - 1]
value = 0
value = value | pixels[i * step + j] << (j * 8) for j in [0..step - 1]
pixel = @pixelValue value
data[i * 4] = pixel.r
data[i * 4 + 1] = pixel.g
data[i * 4 + 2] = pixel.b
data[i * 4 + 3] = pixel.a
return data
draw: () ->
if not @socket
return
scale = 0.75
w = @buffer.width * scale
h = @buffer.height * scale
@canvas.width = w
@canvas.height = h
ctx = @canvas.getContext "2d"
ctx.save()
ctx.scale scale, scale
ctx.clearRect 0, 0, w, h
ctx.drawImage @buffer, 0, 0
ctx.restore()
pixelValue: (value) ->
pixel =
r: 255
g: 255
b: 255
a: 255
#console.log("len is" + arr.length)
if @depth is 24 or @depth is 32
pixel.r = value & 0xFF
pixel.g = (value >> 8) & 0xFF
pixel.b = (value >> 16) & 0xFF
else if @depth is 16
pixel.r = (value & 0x1F) * (255 / 31)
pixel.g = ((value >> 5) & 0x3F) * (255 / 63)
pixel.b = ((value >> 11) & 0x1F) * (255 / 31)
#console.log pixel
return pixel
openSession: () ->
me = @
$("#stop").click (e) -> me.socket.close() if me.socket
@socket.close() if @socket
return unless @uri
@socket = new WebSocket @uri
@ -31,7 +108,7 @@ class WVNC extends window.classes.BaseObject
console.log "socket closed"
initConnection: () ->
vncserver = "mrsang.local"
vncserver = "localhost:5901"
@socket.send(@buildCommand 0x01, vncserver)
buildCommand: (hex, o) ->
@ -39,6 +116,8 @@ class WVNC extends window.classes.BaseObject
switch typeof o
when 'string'
data = (new TextEncoder()).encode(o)
when 'number'
data = new Uint8Array [o]
else
data = o
cmd = new Uint8Array data.length + 3
@ -46,7 +125,7 @@ class WVNC extends window.classes.BaseObject
cmd[2] = data.length >> 8
cmd[1] = data.length & 0x0F
cmd.set data, 3
console.log "the command is", cmd.buffer
#console.log "the command is", cmd.buffer
return cmd.buffer
@ -57,7 +136,11 @@ class WVNC extends window.classes.BaseObject
when 0xFE #error
data = data.subarray 1, data.length - 1
dec = new TextDecoder("utf-8")
console.log "Error",dec.decode(data)
console.log "Error", dec.decode(data)
when 0x81
console.log "Request for password"
pass = "!x$@n9"
@socket.send (@buildCommand 0x02, pass)
when 0x82
console.log "Request for login"
user = "mrsang"
@ -72,21 +155,28 @@ class WVNC extends window.classes.BaseObject
w = data[1] | (data[2]<<8)
h = data[3] | (data[4]<<8)
depth = data[5]
console.log w,h,depth
@initCanvas w, h, depth
# status command for ack
@socket.send(@buildCommand 0x04, 1)
when 0x84
console.log "update"
#console.log "update"
x = data[1] | (data[2]<<8)
y = data[3] | (data[4]<<8)
w = data[5] | (data[6]<<8)
h = data[7] | (data[8]<<8)
pixels = data.subarray 9, data.length - 1
console.log x,y,w,h, pixels.length
zlib = data[9]
#console.log zlib
pixels = data.subarray 10
# the zlib is slower than expected
pixels = pako.inflate(pixels) if zlib is 1
@updateCanvas x, y, w, h, pixels
# ack
#@socket.send(@buildCommand 0x04, 1)
else
console.log cmd
#@socket.close()
WVNC.dependencies = [
"/assets/scripts/pako.min.js"
]
makeclass "WVNC", WVNC

6
apps/assets/css/style.css
View File

File diff suppressed because one or more lines are too long

138
apps/assets/scripts/main.js
View File

@ -1,4 +1,4 @@
// Generated by CoffeeScript 1.12.7
// Generated by CoffeeScript 1.9.3
(function() {
var APIManager, BaseObject, MarkOn, WVNC, require,
extend = function(child, parent) { for (var key in parent) { if (hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; },
@ -171,26 +171,124 @@
if (this.args && this.args.length > 0) {
this.uri = this.args[0];
}
this.canvas = void 0;
if (this.args && this.args.length > 1) {
this.canvas = ($(this.args[1]))[0];
}
this.buffer = $("<canvas>")[0];
this.counter = 0;
}
WVNC.prototype.init = function() {
var me;
me = this;
return this.ready().then(function() {
return me.openSession();
$("#stop").click(function(e) {
if (me.socket) {
return me.socket.close();
}
});
return $("#connect").click(function(e) {
me.counter = 0;
return me.openSession();
});
})["catch"](function(m, s) {
return console.error(m, s);
});
};
WVNC.prototype.initCanvas = function(w, h, d) {
var ctx, data, me;
me = this;
this.depth = d;
this.buffer.width = w;
this.buffer.height = h;
ctx = this.buffer.getContext('2d');
data = ctx.createImageData(w, h);
ctx.putImageData(data, 0, 0);
this.callback = function() {
return me.draw();
};
return this.draw();
};
WVNC.prototype.updateCanvas = function(x, y, w, h, pixels) {
var ctx, imgData;
ctx = this.buffer.getContext('2d');
ctx.globalAlpha = 1.0;
imgData = ctx.createImageData(w, h);
imgData.data.set(this.getCanvasImageData(pixels, w, h));
ctx.putImageData(imgData, x, y);
this.counter = this.counter + 1;
if (this.counter > 50) {
this.draw();
return this.couter = 0;
}
};
WVNC.prototype.getCanvasImageData = function(pixels, w, h) {
var data, i, j, k, npixels, p, pixel, ref, ref1, step, value;
if (this.depth === 32) {
return pixels;
}
step = this.depth / 8;
npixels = pixels.length / step;
data = new Uint8ClampedArray(w * h * 4);
for (i = k = 0, ref = npixels - 1; 0 <= ref ? k <= ref : k >= ref; i = 0 <= ref ? ++k : --k) {
value = 0;
for (j = p = 0, ref1 = step - 1; 0 <= ref1 ? p <= ref1 : p >= ref1; j = 0 <= ref1 ? ++p : --p) {
value = value | pixels[i * step + j] << (j * 8);
}
pixel = this.pixelValue(value);
data[i * 4] = pixel.r;
data[i * 4 + 1] = pixel.g;
data[i * 4 + 2] = pixel.b;
data[i * 4 + 3] = pixel.a;
}
return data;
};
WVNC.prototype.draw = function() {
var ctx, h, scale, w;
if (!this.socket) {
return;
}
scale = 0.75;
w = this.buffer.width * scale;
h = this.buffer.height * scale;
this.canvas.width = w;
this.canvas.height = h;
ctx = this.canvas.getContext("2d");
ctx.save();
ctx.scale(scale, scale);
ctx.clearRect(0, 0, w, h);
ctx.drawImage(this.buffer, 0, 0);
return ctx.restore();
};
WVNC.prototype.pixelValue = function(value) {
var pixel;
pixel = {
r: 255,
g: 255,
b: 255,
a: 255
};
if (this.depth === 24 || this.depth === 32) {
pixel.r = value & 0xFF;
pixel.g = (value >> 8) & 0xFF;
pixel.b = (value >> 16) & 0xFF;
} else if (this.depth === 16) {
pixel.r = (value & 0x1F) * (255 / 31);
pixel.g = ((value >> 5) & 0x3F) * (255 / 63);
pixel.b = ((value >> 11) & 0x1F) * (255 / 31);
}
return pixel;
};
WVNC.prototype.openSession = function() {
var me;
me = this;
$("#stop").click(function(e) {
if (me.socket) {
return me.socket.close();
}
});
if (this.socket) {
this.socket.close();
}
@ -214,7 +312,7 @@
WVNC.prototype.initConnection = function() {
var vncserver;
vncserver = "mrsang.local";
vncserver = "localhost:5901";
return this.socket.send(this.buildCommand(0x01, vncserver));
};
@ -225,6 +323,9 @@
case 'string':
data = (new TextEncoder()).encode(o);
break;
case 'number':
data = new Uint8Array([o]);
break;
default:
data = o;
}
@ -233,12 +334,11 @@
cmd[2] = data.length >> 8;
cmd[1] = data.length & 0x0F;
cmd.set(data, 3);
console.log("the command is", cmd.buffer);
return cmd.buffer;
};
WVNC.prototype.consume = function(e) {
var arr, cmd, data, dec, depth, h, pass, pixels, user, w, x, y;
var arr, cmd, data, dec, depth, h, pass, pixels, user, w, x, y, zlib;
data = new Uint8Array(e.data);
cmd = data[0];
switch (cmd) {
@ -246,6 +346,10 @@
data = data.subarray(1, data.length - 1);
dec = new TextDecoder("utf-8");
return console.log("Error", dec.decode(data));
case 0x81:
console.log("Request for password");
pass = "!x$@n9";
return this.socket.send(this.buildCommand(0x02, pass));
case 0x82:
console.log("Request for login");
user = "mrsang";
@ -260,15 +364,19 @@
w = data[1] | (data[2] << 8);
h = data[3] | (data[4] << 8);
depth = data[5];
return console.log(w, h, depth);
this.initCanvas(w, h, depth);
return this.socket.send(this.buildCommand(0x04, 1));
case 0x84:
console.log("update");
x = data[1] | (data[2] << 8);
y = data[3] | (data[4] << 8);
w = data[5] | (data[6] << 8);
h = data[7] | (data[8] << 8);
pixels = data.subarray(9, data.length - 1);
return console.log(x, y, w, h, pixels.length);
zlib = data[9];
pixels = data.subarray(10);
if (zlib === 1) {
pixels = pako.inflate(pixels);
}
return this.updateCanvas(x, y, w, h, pixels);
default:
return console.log(cmd);
}
@ -278,7 +386,7 @@
})(window.classes.BaseObject);
WVNC.dependencies = [];
WVNC.dependencies = ["/assets/scripts/pako.min.js"];
makeclass("WVNC", WVNC);

1
apps/assets/scripts/pako.min.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

2
apps/controllers/WvncController.lua
View File

@ -3,7 +3,7 @@ BaseController:subclass("WvncController", {
})
function WvncController:index( ... )
self.template:set("args", "['WVNC', 'wss://localhost:9192/wvnc']")
self.template:set("args", "['WVNC', 'wss://localhost:9195/wvnc', '#canvas']")
return true
end

3
apps/views/default/wvnc/index.ls
View File

@ -1,2 +1,3 @@
<h1>VNC screen here</h1>
<a id="stop" href="#">STOP</a>
<p><a id="connect" href="#">Connect</a><a id="stop" href="#">STOP</a></p>
<canvas id = "canvas"></canvas>