coco icon indicating copy to clipboard operation
coco copied to clipboard

Redesign to be more Go-idiomatic

Open mrmiguu opened this issue 6 years ago • 4 comments

This redesign will allow current users of Go to more intuitively engage with Coco for frontend web design.

e.g.

  • Replace js-like callbacks with go channels.
  • Centralize event handling (select {} for click/blur/focus/etc channels).
  • Make overall architecture simpler, less React-like and more Go-like.
  • Add more transparency for event handler bindings to DOM elements.

main.go image App.html image

Please comment, question and criticize!

mrmiguu avatar Mar 21 '19 01:03 mrmiguu

I was able to get embedding channels in DOM elements (like .Click and .Blur above) working. I started working on a variation of triangle numbers to catch the longest combination names first to infer what the user meant to bind. I'm considering switching to a more reliable pattern, like the name should always end or begin with the event binding (like TestHeadingDblClick or DblClickTestHeading).

mrmiguu avatar Mar 21 '19 16:03 mrmiguu

New architectural pipeline:

image

mrmiguu avatar Mar 24 '19 02:03 mrmiguu

Have been working heavily on the pipeline. 99% of all cases for custom (hybrid) templates have been proven (preprocessing vs. executing). Should have a branch and/or commit for this design coming very soon.

mrmiguu avatar Mar 26 '19 06:03 mrmiguu

Wiring up events requires listeners to be set after the template is executed by Go's HTML template engine (and our custom preprocessor stage).

Here is the awesome result: image image

image

A skeleton of the template and binding structure is created, allowing for template.HTMLAttr() to protect preprocessor bindings for events in element attributes, like the pair of:

<div {{.Click}}>

and

Click <-chan bool

mrmiguu avatar Mar 31 '19 15:03 mrmiguu