Browser Sourcs vs. Window Capture

[Ponjimon]

Are there any benefits as to why in version 10 the option to have the overlay via browser source has been removed in favor of capturing it via Window capture?

I see little value in this, in fact, it makes it unnecessarily complicated to use becuse you have to adjust the crop of the capture according to your overlay and you have to use a Chroma Key which reduces the overlay's quality drastically and needs tedious fine tuning to look right. Compared to browser source where you just need to add a URL and it displays perfectly fine.

[Rexios80]

The value is that users that don't know CSS or want to deal with config files can now do all of that without needing to know how to do it. All the customization options are right there. You can keep using the old version if you like, but I can't guarantee features will keep working with the watch app. Heart rate ranges for example are handled by the new overlay so they are removed from an upcoming watch version. Yes it's more annoying to set up the capture in OBS, but configuration is way better and there are way more customization options and data types to show since it's easier for me to add features. I'm not a web developer. The web app was only created because I didn't have a better solution at the time. It was never meant to be the final version. Also the chroma key quality seems good enough for me. Yeah it's not perfect, but other overlays do the same thing. With some tinkering with the background colors in the app and chroma key settings in OBS I'm sure you could get it even better.

[Rexios80]

Exactly. I didn't plan on implementing it for a bit but it shouldn't be hard and it doesn't even need UI. If a socket client identifies itself as an external app then all the Flutter app has to do is route the watch messages to them.

[Ponjimon]

Nice! Looking forward to try it out, if it's already possible.

[Rexios80]

Actually I just realized I can have clients identify themselves with a name and then add a widget option for the name the data should come from. It would take some refactoring to get it working but it might not be as bad as I first thought.

[Rexios80]

But that doesn't affect what you're doing

[Rexios80]

By the way here's a link to the Trello card for this if you want to keep track of my progress: https://trello.com/c/cPmc9b2i

[Rexios80]

  void _handleMessage(WebSocket client, dynamic message) {
    final parts = message.split(':');

    if (parts[0] == 'clientName') {
      clients[client] = parts[1];
      return;
    }

    final source = DataSource(clients[client] ?? 'unknown');

    final dataType =
        EnumToString.fromString(DataType.values, parts[0]) ?? DataType.unknown;
    if (dataType != DataType.unknown) {
      _messageStreamController.add(DataMessage(source, dataType, parts[1]));
    } else {
      _messageStreamController
          .add(UnknownDataMessage(source, parts[0], parts[1]));
    }

    // Broadcast to all clients that aren't the watch
    final externalClients =
        clients.entries.toList().where((e) => e.value != DataSource.watch.name);
    externalClients.forEach((e) => e.key.add(message));
  }

[Rexios80]

Committed to rewrite/flutter

[Rexios80]

Let me know if it works I didn't test it

[Rexios80]

Hey uhhh so it turns out I can just add a web target to my Flutter project and it mostly just works. I'm going to have to fix some things since you can't run a socket server on web but it's actually very very possible

[Rexios80]

But it still needs the desktop app running so it's going to be kind of weird

[Rexios80]

[Rexios80]

Flutter really is something isn't it

[Rexios80]

https://hds.dev