Open darkf opened 6 years ago
Allsimon
commented
6 years ago I started rewriting the UI in Angular (just to see if I could), and it's going much better/faster than expected: I got a fully functioning bottom bar in just 2-3 hours.
About the canvas and webGL renderer: is there a point in maintaining both ? What are their pro/cons ?
darkf
commented
6 years ago Cool, but I fear Angular in particular is way too heavy a burden to maintain/drag in as a dependency. I try to keep it as min dep as possible to avoid having to deal with upstream bugs/upgrades (already nuked jQuery and lodash :D) Even something like Preact is way overkill, no need for VDOM stuff in a simple game.
The canvas renderer is the reference implementation, it has the best compatibility but it's also really slow (at least with lighting turned on.)
The WebGL renderer is a lot faster, but some stuff is not implemented.
It's good to have two competing implementations to influence design anyway.
Allsimon
commented
6 years ago Angular is getting leaner and leaner with every release, a "hello world" is now even smaller than preact (~2.7kb).
Your UI lib seems small enough to be maintainable.
Do you mind if I split the huge ui.ts in several smaller independent module ? For exemple:
├── ...
├── skillDependencies.ts
├── ui
│ ├── pipboy.ts
│ ├── skilldex.ts
│ └── widget
│ ├── button.ts
│ ├── label.ts
│ └── list.ts
├── util.ts
├── ...I think that:
ui/widget.ts would be great (containing those widgets -- Button, Label, List, WindowFrame, etc.)ui/dialogue.ts for the dialogue+bartering, since it's so largeI'd have to see the result of that to see if it needs to be split more, but in general I'm averse to lots of tiny files with a small LOC, but those are a good change for sure.
Allsimon
commented
6 years ago I'm getting stuck on this, I have no idea how to properly import Button from 'widget' without going the webpack/parcelJS/whateverBundlerIsPopularToday way...
And I'm not really sure that making tons of global singleton is really the way to go :/
darkf
commented
6 years ago You don't need to import it, just make the Widget stuff part of the Ui module. You should be able to do module Ui { ... } in button.ts.
(
uirefactorbranch)I aim to move off from separate HTML, CSS and JS to use the new widget-based UI library I wrote, which is far more declarative and cleaner than duplicating a bunch of HTML/CSS/code.
Checklist of components done:
[1] - Unsure, could certainly be done but it would still require a couple of unique elements (e.g., the start/end combat buttons should stay in CSS because they use CSS animations.)
[2] - The worldmap is also complex, but it needs to be rewritten as well -- if not in canvas, then probably in this. (It would benefit that we could make the list of cities scrollable and dynamic. We would, however, need special code for the scrollable worldmap itself.)
[3] - Requires replacing
$.animatesince we're dropping jQuery, either we can do this animation with JS (requestAnimationFrame) or use CSS animations.