Disabling clicks on a specific part of the page using a div

I am using the following example as a client in my web browser to access remote desktop using the Guacamole project. But it gives the user full access to the computer.

Although I used some VNC / RDP restrictions to enforce server side restrictions. But still the requirement is that the user cannot interact with some parts of the application on the remote computer from the front (for example, close or collapse a button or part of the upper left or upper right page) so that he can use the application, but may not collapse to a minimum or close it.

So, I thought that maybe I can turn off the click on these parts so that it doesn't get pushed to the remote desktop.

<html>

<head>
    <link rel="stylesheet" type="text/css" href="guacamole.css"/>
    <title>Guacamole</title>
</head>

<body>

    <!-- Display -->
    <div id="display"></div>

    <!-- Guacamole JavaScript API -->
    <script type="text/javascript"
        src="guacamole-common-js/all.min.js"></script>

    <!-- Init -->
    <script type="text/javascript"> /* <![CDATA[ */
        // Get display div from document
        var display = document.getElementById("display");
        // Instantiate client, using an HTTP tunnel for communications.
        var guac = new Guacamole.Client(
            new Guacamole.HTTPTunnel("tunnel")
        );
        // Add client to display div
        display.appendChild(guac.getDisplay().getElement());

        // Error handler
        guac.onerror = function(error) {
            alert(error);
        };
        // Connect
        guac.connect();
        // Disconnect on close
        window.onunload = function() {
            guac.disconnect();
        }
        // Mouse
        var mouse = new Guacamole.Mouse(guac.getDisplay().getElement());
        mouse.onmousedown = 
        mouse.onmouseup   =
        mouse.onmousemove = function(mouseState) {
            guac.sendMouseState(mouseState);
        };
        // Keyboard
        var keyboard = new Guacamole.Keyboard(document);
        keyboard.onkeydown = function (keysym) {
            guac.sendKeyEvent(1, keysym);
        };
        keyboard.onkeyup = function (keysym) {
            guac.sendKeyEvent(0, keysym);
        };
    /* ]]> */ </script>

</body>

      

What I get on the front is a complete picture of my remote computer. Any idea how to limit interaction from the front?

+3


source to share





All Articles