Hi Tomas, Comments inline. On Sun, Jan 19, 2020 at 2:59 PM Tomaž Turk <tomaz.turk@ef.uni-lj.si> wrote:
Dear all,
I'm trying out Willow which looks very interesting, however I'm struggling with simple examples ...
I basically follow the blogs (here <https://medium.com/mercap-tech-blog/willow-introduction-d498e198dd4a>). I loaded Willow with Bootstrap and prepared the To-Do app as described in blog series. This works OK, however when I try to do something more, like
button := AsynchronicButtonWebView labeled: 'Now it''s time to click'. button onTrigger executeOnClient: [ :canvas | canvas javascript alert: 'You just clicked a button' ]
the browser's javascript gives no response, and its console reports some errors:
I will check because this looks like a problem in the online version of the jquery library. You've got this error following just the tutorial steps?
It looks like problems with libraries. I checked the examples in WillowPlayground (which works OK, BTW), and found out that some basic things are way richer than described in the blogs. For instance, component supplier is not just
componentSupplierForApplication ^ Bootstrap4ComponentSupplier online
as in the blog, but:
componentSupplierForApplication ^ BootstrapComponentSupplier withBootstrapLibrary: (self deploymentMode libraryFor: Bootstrap3MetadataLibrary) withoutOptionalTheme selectLibrary: ((self deploymentMode libraryFor: BootstrapSelectLibrary) using: self language) datepickerLibrary: ((self deploymentMode libraryFor: BootstrapDatepickerLibrary) using: self language) typeaheadLibrary: (self deploymentMode libraryFor: BootstrapTypeaheadLibrary) new
There are two operations modes for the component supplier. 1. If your application will be online on the open internet you can use Bootstrap4ComponentSupplier online, and this will get the required JS libraries from the official CDNs. 2. The second option is to self-serve the libraries (this case is more common for applications that will run in a closed environment like a company intranet, or a heavy regulated environment where the access to open resources on the internet are probably forbidden or require a lot of bureaucracy and approvals).
My question is - is there a better documentation available for Willow? It's quite hard to study all bits and pieces from scratch.
The doc available is the one in the repo under /docs, the blog posts and the sample applications in Willow-Playground. If you have some ideas on missing docs or parts of the documentation that can be improved please fill an issue in https://github.com/ba-st/Willow/issues
The second question is about the suggested "architecture" or design pattern that should be followed when using Willow. The blog mixes Seaside components (e.g. #PendingTask as a subclass of WAPainter) that engages Seaside rendering elements (e.g. html paragraph:) on one hand, with the components supplier's components (e.g. singleLineTextField ...) implemented directly in the Willow Application on the other hand. This probably isn't the way things should be done :-)
Mixing standard Seaside rendering with Willow components it's Ok. The rule to follow here is: - if the component will need some kind of interaction from the user, a Willow component will suit your needs better. Usually this gets initialized once in the component containing it and then it's rendered many times. In this way you can access the component state easily. - for elements that are more like presentation parts and will not have any state nor interactions associated it's perfectly Ok to use standard Seaside rendering. The exception here is in the case of containers (divs, spans, etc) that you want to get replaced dynamically, for that cases it's better to use GenericContainerWebView or PhrasingContainerWebView. Since some versions Willow extended standard Seaside facilities so you can use the command-like interface with standard Seaside brushes. Take a look at WATagBrush Willow extensions. So you can do something like: html div with: [ html text: 'Hi!'] applying: [:container | container addClass bootstrap backgroundInfo] Where the block in applying: allows the same command-like interface available for components.
Best wishes, Tomaz
Regards, Gabriel
