[HN Gopher] Show HN: I saw this mind-blowing experiment, so I ma...
___________________________________________________________________
Show HN: I saw this mind-blowing experiment, so I made a simple
version of it
Two browser windows (acting as socket clients) communicate their:
- Screen dimensions - (screen.width, screen.height) - Window
dimensions - (window.innerWidth, window.innerHeight) - Window X/Y
position - (window.screenX, window.screenY) ...or whichever
calculation works best for you. The original work by Bjorn Staal
https://twitter.com/_nonfigurativ_/status/172732259457002734 used
localStorage, but I found sockets more fun, because if tweaked a
bit, this can be shared with friends. Here's a demo of how it
works and the codebase: https://github.com/Momciloo/fun-with-
sockets/
Author : momciloo
Score : 164 points
Date : 2023-11-25 14:16 UTC (8 hours ago)
(HTM) web link (github.com)
(TXT) w3m dump (github.com)
| 38 wrote:
| correct URLs:
|
| https://twitter.com/_nonfigurativ_/status/172732259457002734...
|
| http://farside.link/twitter.com/_nonfigurativ_/status/172732...
| doctorhandshake wrote:
| Cool! Feels like whichever window has focus, that window's
| rectangle should draw on top.
| benj111 wrote:
| Isn't that just to illustrate that it isn't just transparency?
| mholt wrote:
| More like this:
|
| - https://twitter.com/steveruizok/status/1727625036159234555
|
| - https://twitter.com/_nonfigurativ_/status/172732259457002734...
|
| - https://twitter.com/wesbos/status/1727755227766350031
|
| - https://twitter.com/wesbos/status/1727722358465523721
| Kiro wrote:
| Video of last one: https://youtube.com/watch?v=3Hye_47c0Pc
| burcs wrote:
| I had some fun doing some SQL joins with this:
|
| https://twitter.com/burcs/status/1728081692273823863
| bionhoward wrote:
| Wow this seems profound, I didn't even know you could do that,
| that could be the future of augmented reality if you think about
| it, layers! Great job!
| simbolit wrote:
| Could you please expand on your "if you think about it"?
| Takennickname wrote:
| Spoiler: he didn't.
| jonhohle wrote:
| Is it really different from any multiplayer game? Two view
| ports, shared coordinates, independent renderers. The "trick"
| is that the view ports are overlapping, but I would imagine
| sendMessage might be faster and not require any server round
| trip.
| aantix wrote:
| Or a postMessage could be used if one tab is opened from the
| other.
| rtcode_io wrote:
| Use BroadcastChannel; you don't need no sockets
|
| https://developer.mozilla.org/en-US/docs/Web/API/Broadcast_C...
| bigyikes wrote:
| Nice, my first thought was to use LocalStorage. Didn't know
| about BroadcastChannel.
|
| Sounds like OP wanted to use sockets for fun though.
|
| >The original work by Bjorn Staal used localStorage, but I
| found sockets more fun, because if tweaked a bit, this can be
| shared with friends.
|
| Who among us hasn't overcomplicated things for fun? :)
| kaycebasques wrote:
| Very cool. What's the working title for this interface /
| experience?
| placebo wrote:
| made something similar 14 years ago...
|
| https://youtu.be/bEwsuWNxdno
|
| domain isn't mine anymore...
| HatchedLake721 wrote:
| Oh wow, from December 2008.
|
| Here's to no one trying to patent it now!
| whenlambo wrote:
| What API allowed that back then?
| placebo wrote:
| It was an API I developed using ActiveX on Microsoft's
| Internet explorer and NPAPI on other browsers
| munch117 wrote:
| Am I the only one that's horrified that window.screenX and
| window.screenY exist? This is not information that I want to
| provide.
| progbits wrote:
| Using the demo in https://developer.mozilla.org/en-
| US/docs/Web/API/MouseEvent/... it seems Firefox pretends the
| window is always at (0,0). So that's nice.
| Cyphase wrote:
| You likely have `privacy.resistFingerprinting` set to true.
| xeckr wrote:
| I just checked, it is possible to override them, which causes
| them to stop updating when you change the your window's
| location on the screen.
| Andrews54757 wrote:
| Yep. There are some ridiculous web APIs out there that expose
| all sorts of things you'd think should remain private. Take the
| Battery Status API for example [1].
|
| [1] https://developer.mozilla.org/en-
| US/docs/Web/API/Battery_Sta...
| david_allison wrote:
| This would be useful in WebXR (given opt-in)
| geoelectric wrote:
| IIRC, that one and a number of other lower-level "WTF" APIs
| were introduced for Firefox OS. They made a little more sense
| in the context of providing an interface for mobile phones
| using the browser stack.
| zer0kool wrote:
| Sorry, i'm a little lost. I tried thinking about it, but I
| can't think of any nefarious attacks someone could do with
| screenX/Y. Why is that such a risk? What could they possibly
| learn from that other than screen size?
| jackewiehose wrote:
| Because fingerprinting. Shit like this is the reason you are
| supposed to use the Tor browser only with a tiny window.
| spiderice wrote:
| > you are supposed to use the Tor browser only with a tiny
| window
|
| I hadn't ever heard of this. Here is a statement from the
| Tor project for anyone else wondering what this is about:
|
| > We automatically resize new browser windows to a 200x100
| pixel multiple based on desktop resolution which is
| provided by a Firefox patch. To minimize the effect of the
| long tail of large monitor sizes, we also cap the window
| size at 1000 pixels in each direction. In addition to that
| we set privacy.resistFingerprinting to true to use the
| client content window size for window.screen, and to report
| a window.devicePixelRatio of 1.0. Similarly, we use that
| preference to return content window relative points for DOM
| events. We also force popups to open in new tabs to avoid
| full-screen popups inferring information about the browser
| resolution. In addition, we prevent auto-maximizing on
| browser start, and inform users that maximized windows are
| detrimental to privacy in this mode
| munch117 wrote:
| The fingerprinting potential may well be limited, but it's
| the principle of the thing: The browser should not provide
| unnecessary information about its surroundings.
|
| It would be another matter if this was a very useful feature,
| but I don't think that it is.
|
| Here's one use for it: Ads could sense that they are off-
| screen and withhold content until the ad is moved back in
| view. I could easily see screenX/Y being used for that. I
| mean, I hope not, but how am I going to stop it?
| adroitboss wrote:
| Two more examples of multiple windows as a single unit. This time
| on the video game side.
|
| (Ludum Dare 35 Overall Winner) WindowFrame:
| https://youtu.be/CY7NUHn6GQg?t=273
|
| Window Kill: https://youtu.be/7iP68FZWVxM?t=160
| no_time wrote:
| W-why is window LOCATION exposed to websites? Apparently even in
| FF private browsing...
|
| At first I thought this is an electron only thing. I get it that
| we gave up on fingerprinting resistance but this is like pissing
| on it's grave.
|
| EDIT: privacy.resistFingerprinting set to true fixes the coords
| to 0
| a_wild_dandan wrote:
| I thought you meant literal `window.location` and was confused,
| but yeah `window.screenX/Y` is a pretty suspect feature, now
| that you mention it.
| crazygringo wrote:
| I'm as surprised as well.
|
| I'm trying to guess why, and can only imagine that at some
| point the idea was to support multi-window webapps, like maybe
| you'd have separate windows for documents and different tool
| palettes, and they'd want to know each other's locations to try
| to prevent overlaps? I mean, back in the day, framesets were
| another idea that experienced some popularity before being
| totally eclipsed by <iframes> -- all of this back in the era
| when everything was based on the multiple-windows paradigm
| rather than the multiple-tabs paradigm. Window.screenLeft
| apparently originated in IE [1].
|
| Just a guess though. Very curious if there's any legitimate
| reason for it to continue to exist, or whether W3 ought to
| deprecate it.
|
| [1] https://developer.mozilla.org/en-
| US/docs/Web/API/Window/scre...
| andybak wrote:
| The original seems to be on LinkedIn. Does anyone else find it
| weird when geek content is posted to LinkedIn? It's the last
| place I'd think to look. Am I missing out or is this an outlier?
| cpach wrote:
| For sure. It's approximately the first time I've seen something
| like that on LinkedIn.
| zerojames wrote:
| I work in computer vision and like hearing about the latest
| thing. I have been finding LinkedIn increasingly useful as a
| way to learn about machine learning.
|
| There are _a lot_ of posts that I have to scroll through of
| little to no value, but every so often I see a post by Yann
| LeCun or the lead developer advocate at TensorFlow or a paper
| someone has liked that catches my eye or a new model release.
|
| "Machine learning LinkedIn", as it were, is a real thing; not
| sure whether this applies to other disciplines.
| jocaal wrote:
| The available API's on the web are very questionable. Feross has
| a web security lecture series on youtube where he showed off the
| following abomination. Enter at own risk.
|
| https://theannoyingsite.com/
| lgats wrote:
| warning, this is really annoying. imagine you're infected with
| a ton of adware in the early 2000s you will be logged out of
| many accounts
|
| here's someone testing it out on Windows a few years ago, but I
| assure you even in the latest chrome on mac, it's at least as
| bad https://youtu.be/estvbRSj4LU?si=gq6-l4pWLC9yXqap&t=109
| dylan604 wrote:
| Why would you keep minimizing things instead of closing them?
| The video just looks like one of those meant to frustrate the
| viewer into wanting to do it themselves. I blame the creator
| of that video as much as the site itself. The site itself
| served a purpose. The person running that video has a much
| less clear motive
| bbarnett wrote:
| I think if you close a window, another pops up. Or two.
|
| You should go to this site and test this.
| PakG1 wrote:
| I tried it on Safari private window. It was absolutely
| horrible. I hesitate to guess what would have happened if I
| didn't keep clicking cancel whenever it asked if I wanted to
| allow downloads, etc.
| gmueckl wrote:
| Does this work on Wayland?
| itronitron wrote:
| This, or something similar, would be nice for managing layers in
| a paint program such as Krita, Inkscape, or Gimp. Could be
| implemented simply as tabbed panes within the encompassing
| application window, and whatever tab is selected is the layer
| that is active for the editing actions.
| hot_gril wrote:
| This reminds me of a project I did in school, a multi-user web
| browser. You could both control the same window's size, scroll
| position, and other state on each other's screens. The intended
| usage was having 2+ windows side by side.
| butz wrote:
| I'm wondering about practical application of this demo...
| ww520 wrote:
| That's a fun use of LocalStorage.
|
| I used the same LocalStorage sharing technique to update the
| target window when the setting had been changed on a separate
| browser window. Just listen for the storage.onChanged event for
| the update.
| sprobertson wrote:
| Might as well link to the original / "stolen from" author's
| equivalent demo with Three.js (open this in multiple overlapping
| windows) - https://bgstaal.github.io/multipleWindow3dScene/ - and
| repo - https://github.com/bgstaal/multipleWindow3dScene/
| sshh12 wrote:
| Reminds me of a cool demo of this for playing pong with browser
| windows http://stewd.io/pong/
| vunderba wrote:
| That's a great demo! I'd be curious to see how this would work
| with multiple monitors.
|
| Also, thank you for voluntarily acknowledging that you were
| directly inspired by somebody else and giving them credit - the
| software industry could use more people like you.
| p-nerd wrote:
| Really great. The web is really going forward
| Agingcoder wrote:
| Could someone explain what this means ? ( I'm not even sure I
| understand the gif on the GitHub page ) I just see windows
| seemingly sharing data.
| Filligree wrote:
| But... why does it lag? Shouldn't this be trivial enough to be
| instant?
___________________________________________________________________
(page generated 2023-11-25 23:00 UTC)