No internet connection
  1. Home
  2. Technical Support

remote-screen-img size

By @phatlewt2021-08-30 06:01:30.783Z

I've managed to increase the ustreamer capture resolution to 4096x2160 using another usb capture card and editing ustreamer.service, but the image size on the webpage is still displaying at 1920x1080. Is it possible to increase the image size on the webpage so that it matches the capture resolution? I'm not sure where the width/height for the image id remote-screen-img is set in the html.

  • 5 replies
  1. Michael Lynch @michael2021-08-30 18:36:12.030Z

    Oh, neat! What capture device are you using?

    The CSS rule you probably want to delete is this line:

    https://github.com/tiny-pilot/tinypilot/blob/c5f6db0cfc17c4c8dfd467519d2f8cb47bba754d/app/templates/custom-elements/remote-screen.html#L7

    After you change it, you'll need to run sudo service tinypilot restart to pick up the changes.

    1. P
      In reply tophatlewt:
      @phatlewt2021-09-02 01:40:19.546Z

      I'm using this capture card device:

      I bought it on AliExpress but I haven't been receiving orders from them as of late, so be warned.

      Before I bought that I thought I had to configure it on the rpi, but it's literally plug and play. It's advertised as 4k, and I can capture in 4k in OBS, but sadly it was still 1920x1080 after editing the css. I'm guessing it's because uStreamer is outputting the image at 1920x1080, maybe because v4l2ctl is only reporting up to 1920x1080 resolution on the rpi, which is a shame coz I've got a big screen.

      In the end I wrote a standalone client application in .Net that has the added benefit of sending keys which are normally part of the browser shortcuts (I've lost count of the number of times I've accidentally closed the TinyPilot webpage by accident when pressing Ctrl+W and wanting to close a browser tab on the target system), and other keys, such as Print Screen, browser back and forward navigation commands that are mapped to my mouse side buttons, and media control buttons on the keyboard. I also wrote another small application that runs on the target system that provides bi-directional clipboard sharing capability through Socket.IO, but only for text at the moment.

      This is a really nice project- I think for my next purchase I'll get the Pro version, just to show my support. Cheers!

      1. Michael Lynch @michael2021-09-02 19:59:56.288Z

        In the end I wrote a standalone client application in .Net that has the added benefit of sending keys which are normally part of the browser shortcuts (I've lost count of the number of times I've accidentally closed the TinyPilot webpage by accident when pressing Ctrl+W and wanting to close a browser tab on the target system), and other keys, such as Print Screen, browser back and forward navigation commands that are mapped to my mouse side buttons, and media control buttons on the keyboard.

        If you use Chrome, you can actually get around this by running Chrome in application mode:

        chrome.exe --app=http://tinypilot.local
        

        That runs Chrome in a dedicated window, and it doesn't try to capture normal browser shortcuts like Ctrl+W or Ctrl+T, so they work normally within TinyPilot.

        I also wrote another small application that runs on the target system that provides bi-directional clipboard sharing capability through Socket.IO, but only for text at the moment.

        Oh, that sounds interesting. How are you grabbing clipboard data from the target system?

        1. P@phatlewt2021-09-07 04:11:26.725Z

          Oh wow, I didn't know I could run Chrome in application mode! Nice!

          The C# application has a Socket.IO server, and another small C# program runs on the target PC polling for clipboard changes every 2 seconds. If there's a change, it will send the new text back to the server and the application will display it in a side window, so there's a list of clipboard contents I can navigate between.

          Something like this (C#):

          public void run()
          {
               bool isRunning = true;
               string clipboardTxt = Clipboard.getText();
               Thread t = new Thread(new ThreadStart(()=>
               {
                    while(isRunning)
                    {
                          if(!clipboardTxt.Equals(Clipboard.getText())
                          {
                               clipboardTxt = Clipboard.getText();
                               var obj = new 
                               {
                                     txt = clipboardTxt
                               };
                               webSocket.Send("42[\"clipboard\", " + JsonConvert.SerializeObject(obj) + "]");
                          }
                          Thread.Sleep(2000);
                    }
               }));
               t.Start();
          }
          

          I guess a similar solution can also implemented in Python that runs on the target system polling for clipboard changes, and sending those changes back to the TinyPilot server, which can then be displayed somewhere on the webpage or be synchronized with the user's clipboard through the HTML5 Clipboard API. I suppose this can be improved upon by using event hooks to detect clipboard changes but this simple polling method is sufficient for my purposes for the time being. I think Socket.IO is also able to send binary data (i.e. images) but haven't played around with that yet.

          1. Michael Lynch @michael2021-09-07 18:55:38.339Z

            Oh, gotcha. That makes sense. I thought maybe you were doing it without an agent on the target computer, which would be a neat trick.

            That's an interesting strategy, though. Maybe we'll eventually release something similar to VirtualBox Guest Tools, where you can install a package on the target machine and get some extra functionality that isn't possible exclusively through the HID interface.