New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

5.0.0 (WIP) #145

Merged
merged 49 commits into from Feb 25, 2018

Conversation

Projects
None yet
3 participants
@dylanvorster
Copy link
Contributor

dylanvorster commented Jan 20, 2018

Checklist

  • The code has been run through pretty yarn run pretty
  • The tests pass on CircleCI
  • You have referenced the issue(s) or other PR(s) this fixes/relates-to
  • The PR Template has been filled out (see below)

Beers had:

  • 1
  • 2
  • 3
  • 4

TODO

  • Cant create point on simple demo
  • Cant link two nodes together
  • Labels are not done yet

What?

  • Spliced up the DefaultLinkWidget so that the concept of the 'default link' can be extended with custom link segments.
  • Provided more helper methods to the default pack to make it easier to construct diagrams without always having to instantiate many models.
  • Flow Support
  • Smart Routing
  • API improvements
  • Bootstrap improvements
  • Labels are now first class citizens and have their own models

Why?

While you have always been able to provide your own link entirely, there are a number of cases where we want to have a visually completely different link to the DefaultLink, but one that performs in the same way without having to re-engineer it completely. It makes more sense to make the DefaultWidget more dynamic and pluggable which should cater for 90% of extensible use cases. For the other 10%, you can just provide a new link like you normally would have before this PR.

Labels are also really cool, but I think we should treat labels like other widgets since they are visual, and this we need supporting models and factories to really get more power out of them, so it made sense to refactor them out.

Flow support makes it easier to create diagrams that act as system designers in that you don't need to worry about no-ops such as dangling links and tricky link ux that just slows down graph creation

To further aid flow support, smart routing automatically handles path generation and routing so that the links avoid all other entities on the graph.

How?

  • Make better use of the DefaultLinkFactory to return the link segments as well
  • Provide helper methods in the node, link and port models
  • Move some common logic to the toolkits
  • Introduce a "DefaultLinkModel"
  • Rewrite almost all of the demos to use the new simplified syntax x_x
  • Merged in PR 147 (really cool flow support)
  • Labels are now first class citizens (models, factories etc..) (WIP)
  • Merged in PR 161 (really cool smart routing support)
  • Improve custom link demo
  • Create a testing framework onto of jest + puppeteer to easily do end to end testing
  • automatically load the all the demos for jest snapshot testing
  • Introduce a BEM widget
  • Refactor all styles to use BEM
  • In a smart manner, allow all widgets to pass extra props to the component itself

Shoutouts to:

@klauspaiva (smart routing)
@yngndrw (flow support)

^ These are some of the coolest PR's I've seen yet

Feel-Good "programming lol" image:

LOL

dylanvorster and others added some commits Jan 20, 2018

Added a new demo showing off flow diagram usage:
- PortModel can now decide whether or not a link should be allowed (E.g. only allowing outputs to connect to inputs)
- PortModel now has an optional maximum number of links - When set to 1 an existing link is returned by createLinkModel and when set to another finite number null will be returned when the maximum is reached
- LinkModel has been updated to support the resetting of existing links (I.e. removing ports and removing mid-points)
- DiagramWidget has been updated to handle null being returned by createLinkModel as well as an existing link (this also supports an existing link where the link's target port should now be the source port)
- DiagramWidget has been updated to respect the PortModel's new canLinkToPort method
- DiagramWidget has been updated to disallow duplicate links

@dylanvorster dylanvorster changed the title started splitting out the links and further improve developer experience (WIP) 5.0.0 (WIP) Feb 11, 2018

@dylanvorster

This comment has been minimized.

Copy link
Contributor Author

dylanvorster commented Feb 11, 2018

@klauspaiva You might find this PR relevant to the changes you are busy with (which I really hope you decide to put into a PR :P)

@klauspaiva

This comment has been minimized.

Copy link
Contributor

klauspaiva commented Feb 11, 2018

Nice, that's a great re-factoring effort, dude!

Yeah, I can see a couple, maybe 10, maybe 100 merge conflicts haha, but don't worry, I still need to handle multiple points and then simplify the code before it becomes PR ready, so I'll tackle them later on.

Thanks for the heads up!

@dylanvorster

This comment has been minimized.

Copy link
Contributor Author

dylanvorster commented Feb 18, 2018

@klauspaiva cool, your branch has been merged in, I'm still going to refactor a few things but its all working :)

dylanvorster added some commits Feb 23, 2018

@dylanvorster

This comment has been minimized.

Copy link
Contributor Author

dylanvorster commented Feb 23, 2018

labels are go!

@dylanvorster

This comment has been minimized.

Copy link
Contributor Author

dylanvorster commented Feb 23, 2018

Custom link demos are back and they animate :D
animate

dylanvorster added some commits Feb 24, 2018

@dylanvorster

This comment has been minimized.

Copy link
Contributor Author

dylanvorster commented Feb 24, 2018

Tests are now end to end and test actual functionality by clicking on ports and dragging nodes etc..

dylanvorster added some commits Feb 24, 2018

@dylanvorster

This comment has been minimized.

Copy link
Contributor Author

dylanvorster commented Feb 24, 2018

TESTS PASS! YASSSS!!!!

@dylanvorster

This comment has been minimized.

Copy link
Contributor Author

dylanvorster commented Feb 25, 2018

BEM all the things

@dylanvorster

This comment has been minimized.

Copy link
Contributor Author

dylanvorster commented Feb 25, 2018

screen shot 2018-02-25 at 11 26 35

@dylanvorster dylanvorster merged commit 446cc8c into master Feb 25, 2018

1 check passed

ci/circleci Your tests passed on CircleCI!
Details

@dylanvorster dylanvorster deleted the links_refactor branch Feb 25, 2018

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment