wikitree / wikitree-dynamic-tree

Dynamically generated and browsed graphical family tree
MIT License
26 stars 20 forks source link

Write more complete documentation on how to create a new view. #5

Closed jmegenealogy closed 2 years ago

jmegenealogy commented 2 years ago

This should probably be in a separate file from the README.

MichalVasut commented 2 years ago

Hello I've started refactoring to make it easier to register new views. Basically what will be needed is to

  1. inherit from from View class
  2. override methods
    • meta - basic metadata for view
    • render - basic template for the view and event bindings (maybe in different method, I'm not that far)
  3. register view in ViewsRegistry

Very basic draft is here: https://github.com/wikitree/wikitree-dynamic-tree/pull/11/files?diff=unified&w=0

I've just added basic mechanism of loading the views and placed it above the existing code, needs some work to adapt existing views, some touches in CSS to makeit pretty, clean up the code and remove unused functionality, etc.

The question is: Is it worth to continue?

PS - if you'll check the code, as I wrote, its very at the beginning, and don't look at the code (in diff) after views registration in $(document).ready, it's only som formatting.

bcaseyrls commented 2 years ago

Thanks, Michal! As we move forward with (hopefully) lots of new views, I think trying to normalize how they appear and are added to the overal project will be helpful. The current setup keeps everything pretty separate -- each view is just its own JS file with a function that gets called by launchTree(). There's a simplicity in that, I think, that makes it easy to add new things. But providing a scaffolding through a View class has definite advantages too. I think it's an effort worth pursuing.

On Sep 30, 2022, at 10:36 AM, Michal Vašut @.***> wrote:

Hello I've started refactoring to make it easier to register new views. Basically what will be needed is to

• inherit from from View class • override methods • meta - basic metadata for view • render - basic template for the view and event bindings (maybe in different method, I'm not that far) • register view in ViewsRegistry Very basic draft is here: https://github.com/wikitree/wikitree-dynamic-tree/pull/11/files?diff=unified&w=0

I've just added basic mechanism of loading the views and placed it above the existing code, needs some work to adapt existing views, some touches in CSS to makeit pretty, etc.

The question is: Is it worth to continue?

MichalVasut commented 2 years ago

Thanks for answer, yes, definitely, the views will be in separate files and folders as they are know. That little demo is in one file only for faster work and it needs some work.

Clarke-11007 commented 2 years ago

Can we see this in action ?

As I begin to move my Fan Chart app to this framework, I'm wondering if I could also make use of the views? For that to work, I'd have to be able to rotate each person's info at a different angle - either parallel or perpendicular to the "spokes" of the fan chart extruding from the centre. Is that possible with your work Michal - or - would it be after a potential future update?

I can see the value in a common "view" module / class - whatever we call it

On Fri, Sep 30, 2022 at 12:53 PM Michal Vašut @.***> wrote:

Thanks for answer, yes, definitely, the views will be in separate files and folders as they are know. That little demo is in one file only for faster work and it needs some work.

— Reply to this email directly, view it on GitHub https://github.com/wikitree/wikitree-dynamic-tree/issues/5#issuecomment-1263802219, or unsubscribe https://github.com/notifications/unsubscribe-auth/A3JDGBRDA43PEJW66A5TC3LWA4LIDANCNFSM6AAAAAAQWALYHU . You are receiving this because you are subscribed to this thread.Message ID: @.***>

MichalVasut commented 2 years ago

Please don't move it yet (or move to the old framework), it's still only first draft, just for preview and approval for future work.

Currently it only loads some testing views and I'm trying to convert Dynamic Tree view to this framework, so no working example yet, you can pull the branch and test it, but it doesn't even look good 🙃 .

Clarke-11007 commented 2 years ago

OK - thanks for the warning ... when I start my work on the Fan Chart (it's going to look real ugly for a while I can assure you!) - I'll use a simplistic view to start with, hoping that eventually I'll be able to swap in something that will work later on.

Thanks for doing this Michal!

-Greg :-)

On Fri, Sep 30, 2022 at 1:39 PM Michal Vašut @.***> wrote:

Please don't move it yet (or move to the old framework), it's still only first draft, just for preview and approval for future work.

Currently it only loads some testing views and I'm trying to convert Dynamic Tree view to this framework, so no working example yet, you can pull the branch and test it, but it doesn't even look good 🙃 .

— Reply to this email directly, view it on GitHub https://github.com/wikitree/wikitree-dynamic-tree/issues/5#issuecomment-1263843112, or unsubscribe https://github.com/notifications/unsubscribe-auth/A3JDGBRXNV3SQZDZYKL64ZDWA4QWFANCNFSM6AAAAAAQWALYHU . You are receiving this because you commented.Message ID: @.***>

MichalVasut commented 2 years ago

I've just extracted login functionality in my branch into separate class that could imho be used anywhere.

Features

MichalVasut commented 2 years ago

New registration of views is complete and working - well, at least from technical point of view - still needs some love to make it prettier and usable from visual point of view, therefore I'll leave it in draft, till it's improved.

Here is come manual how to create & register new view (it'll be maybe better to move it into some .md file )

Here is the "beast" (aka ViewRegistry)

PS: I've also added some formatting config (.prettierrc), to keep the file in some form - the config can be used in more ways

MichalVasut commented 2 years ago

It seems to be ready, live preview is here (@Clarke-11007 you can test it)

https://apps.wikitree.com/apps/vasut2/views-registry/

Some docs rewrite is needed, but it works

Clarke-11007 commented 2 years ago

Thanks Michal, will do!

Greg

On Tue, Oct 4, 2022 at 7:04 PM Michal Vašut @.***> wrote:

It seems to be ready, live preview is here @.*** https://github.com/Clarke-11007 you can test it)

https://apps.wikitree.com/apps/vasut2/views-registry/

Some docs rewrite is needed, but it works

— Reply to this email directly, view it on GitHub https://github.com/wikitree/wikitree-dynamic-tree/issues/5#issuecomment-1267698899, or unsubscribe https://github.com/notifications/unsubscribe-auth/A3JDGBSN66TNMIPHFOBAUJLWBSZZNANCNFSM6AAAAAAQWALYHU . You are receiving this because you were mentioned.Message ID: @.***>

MichalVasut commented 2 years ago

I hope I haven't messed something up. Please report bugs and other issues. I've already found some usage issues (not really bugs)

MichalVasut commented 2 years ago

btw, here is another (more compact design), that shows more of the view - it's just quick play with the propertis in browser (not saved)

image

vs current design in my branch

image

MichalVasut commented 2 years ago

@bcaseyrls isn't this solved with my last pull request and also your previous work?

https://github.com/wikitree/wikitree-dynamic-tree/blob/main/contributing.md

bcaseyrls commented 2 years ago

Yes, I think so (though I should go back over the contributing docs again with a fresh eye).