5 ms·

This kind of came up for me in a recent discussion, as my team is converting a trusty desktop application to a web-based system. The existing app is fairly comp

This kind of came up for me in a recent discussion, as my team is converting a trusty desktop application to a web-based system. The existing app is fairly complex, and is aimed at expert users who spend a significant amount of time in this app as their primary workplace. They enjoy the kind of flexibility that resizing, rearranging panels can bring. Additionally, they love the current ability to grab a panel, tear it loose from the app window into a new window, which they can move to their 2nd monitor. So basically, think of how an IDE tends to allow you to customise its UI to suit whatever task you're thinking of. Clearly, we can and will ensure that the main use cases have a compelling equivalent in the web version, but it's fairly intimidating to think that there's no easy way to offer these kind of expected features on the web.

rzzzt 5y ago
Try searching for "docking layout" with a dash of "Visual Studio" (the drop target hints presented by the original, non-Code version are quite good at letting the user figure out exactly where the dragged window will attach). One example is https://github.com/node-projects/dock-spawn-ts https://github.com/node-projects/dock-spawn-ts , but there are many more. Maybe you can also tease out the layout logic from VS Code or Theia (or even better, someone else might have done the work).
- danielbarla 5y ago
  Cool, thanks! It makes sense that VS Code would have this down already.
chestervonwinch 5y ago
Have you considered the WASM build of Qt? https://www.qt.io/qt-examples-for-webassembly https://www.qt.io/qt-examples-for-webassembly
- danielbarla 5y ago
  That's an interesting direction, and I'll keep an eye on it. Unfortunately in this case though, it's probably too far off the company's beaten track to use, as we have to integrate with plenty of other teams' work, which would be vanilla web+js stuff. While I'm sure it's surmountable, I'm not sure a hybrid is worth it.
jcuenod 5y ago
I'm on the hunt for a good package like this for react. I have been experimenting with https://github.com/ticlo/rc-dock/ https://github.com/ticlo/rc-dock/ and it's pretty awesome. I think the vanilla js version is probably nicer to use, though.

rzzzt 5y ago

Try searching for "docking layout" with a dash of "Visual Studio" (the drop target hints presented by the original, non-Code version are quite good at letting the user figure out exactly where the dragged window will attach). One example is https://github.com/node-projects/dock-spawn-ts https://github.com/node-projects/dock-spawn-ts , but there are many more. Maybe you can also tease out the layout logic from VS Code or Theia (or even better, someone else might have done the work).

danielbarla 5y ago
Cool, thanks! It makes sense that VS Code would have this down already.

chestervonwinch 5y ago

Have you considered the WASM build of Qt? https://www.qt.io/qt-examples-for-webassembly https://www.qt.io/qt-examples-for-webassembly

danielbarla 5y ago
That's an interesting direction, and I'll keep an eye on it. Unfortunately in this case though, it's probably too far off the company's beaten track to use, as we have to integrate with plenty of other teams' work, which would be vanilla web+js stuff. While I'm sure it's surmountable, I'm not sure a hybrid is worth it.

jcuenod 5y ago

I'm on the hunt for a good package like this for react. I have been experimenting with https://github.com/ticlo/rc-dock/ https://github.com/ticlo/rc-dock/ and it's pretty awesome. I think the vanilla js version is probably nicer to use, though.