Thursday, 22 October 2020
  5 Replies
  1K Visits
  Subscribe
Hi,

I have a WebSockets Professional.
Based on the Snapshots demo.
I trying to create a stable transfer of the image from the desktop and text messages.
Everything works fine at startup, but the lag is increasing with each second.


Some of my code:
In html:


img.onload = function() {
ws.send('c=i;');
canvas.setAttribute("width", img.width);
canvas.setAttribute("height", img.height);
context.clearRect(0, 0, canvas.width, canvas.height);
context.drawImage(this, 0, 0);
};

canvas.addEventListener('click', function(event) {
var x = event.x - elemLeft,
y = event.y - elemTop;
if (ws.state() === "open") {
ws.send('c=c;x='+event.offsetX+ ';y=' + event.offsetY + ';w=' + canvas.getBoundingClientRect().width + ';h=' + canvas.getBoundingClientRect().height);
};
}, false);


ws.on('stream', function(evt)
{
a = URL.createObjectURL(evt.stream);
var canvas = document.getElementById("canvas");
img.src = a;
}


In pas:

procedure TfrmServerSnapshots.WSServerMessage(Connection: TsgcWSConnection; const
Text: string);
begin

...

if p.Values['c'] = 'c' then
begin
x := SInt(p.Values['x']);
y := SInt(p.Values['y']);
w := SInt(p.Values['w']);
h := SInt(p.Values['h']);
rw := SS.Bitmap.Width;
rh := SS.Bitmap.Height;
rx := Trunc(rw / w * x);
ry := Trunc(rh / h * y);
SetCursorPos(rx, ry);
Mouse_Event(MOUSEEVENTF_ABSOLUTE or MOUSEEVENTF_LEFTDOWN, rx, ry , 0, 0);
Mouse_Event(MOUSEEVENTF_ABSOLUTE or MOUSEEVENTF_LEFTUP, rx, ry, 0, 0);

end else
if p.Values['c'] = 'i' then
begin
DoBroadcastStream;
Label4.Caption := IntToStr(MilliSecondsBetween(now, tm)) + ' ms';
tm := now;
end;
end;


It is worse if I use original Snapshots demo a timer with 50ms to send image.
I tried different settings with WSServer component.

How to do it. Maybe I missed something?


Best Regards
Piotr