2

I'm using javascript Apache Guacamole Client on my website for RDP control. I've faced a problem - on window resize display wasn't resized. I've tried to use "scale" method of Guacamole Display: 

guac = new Guacamole.Client(tunnel);
...
guac.getDisplay().scale(myScale);

This method changes display size. However when the resize is performed, mouse coordinates are kept as they were on client. So mouse pointer on client and on web screen are not matched.

enter image description here

kban
  • 150
  • 1
  • 9

2 Answers2

1

The Fix is to apply scaling to mouse coordinates too:

    let scale = 1;
    $(document).ready(function ($) {

        $(window).resize(function () {
           nsZoomZoom();
        });

        //Get screen resolution.
        origHeigth = window.screen.height * window.devicePixelRatio;
        origWidth = window.screen.width * window.devicePixelRatio;

        nsZoomZoom();

        function nsZoomZoom() {
            //Calculating scalse
            let htmlWidth = $(window).innerWidth();
            var htmlHeigth = $(window).height();
            var xscale = htmlWidth / origWidth;
            var yscale = htmlHeigth / origHeigth;
            //This is done to handle both X and Y axis slacing
            scale = Math.min(xscale, yscale);
            //Add 10% to scale because window always less than screen resolution
            scale += scale / 10;
            //Change Cuacamole Display scale
            guac.getDisplay().scale(scale);  
        }
    });

        ...   
        guac = new Guacamole.Client(tunnel);

        const guacEl = guac.getDisplay().getElement();
        rootEl.appendChild(guacEl);

        mouse = new Guacamole.Mouse(guacEl);
        mouse.onmousedown = mouse.onmouseup = (state) => guac.sendMouseState(state); 
        //The fix is here
        mouse.onmousemove = (state) => {
            updateMouseState(state);
        }; 

   //Handle mouse coordinates scaling         
    let updateMouseState = (mouseState) => {
        mouseState.y =  mouseState.y / scale;
        mouseState.x =  mouseState.x / scale;
        guac.sendMouseState(mouseState);
    }

I hope it'll help someone.

kban
  • 150
  • 1
  • 9
0

kban,When drag and drop browser’s right-down corner,gua display zone will left a blank(down or right direction),this seems only executing browser’s guacamole js's scale function,how to solute this problem ?enter image description here

user2764293
  • 1