[Seaside] JavaScript keypress events

Tim Johnson digit at sonic.net
Tue Jan 24 06:28:04 UTC 2023


Hi Joachim,

Thank you for this sage wisdom and practical advice.  I can see how I would get frustrated by the JavaScript-embedded-in-HTML (which I began to notice already) and eventual quoting issues. 

I am (desperately?) trying to avoid coding the backend application logic in a new-to-me framework & language since I already know Seaside... even though the frontend clearly calls for interactivity that can only be done with JavaScript.

For a 'fun' project like my current one, I *may* find a happy compromise in how simple it should (hopefully) be.  But I can already catch myself doing exactly what you cited:  "you try to adapt to 'how it's done' all the time."

Thanks again.

Best,
Tim


> On Jan 23, 2023, at 12:27 AM, Joachim Tuchel <jtuchel at objektfabrik.de> wrote:
> 
> Hi TIm,
> 
> 
> I'd like to support Karsten's advice: don't try to escape JavaScript with Seaside-rendered JS code when your JS code is more than a three-liner (okay, maybe 8 or such).
> 
> We've been using Seaside for our kontolino.de offering since 2013, and I once had the illusion we could get along without diving into the muddy depths of JavaScript by using Seaside. It doesn't work well. Your code will become hard to maintain and read. You will have to answer not only the question how to do something in JS, but also how to formulate the equivalent in Seaside wrappers and such. Even mildly complex things will look like rocket science in your source code.
> 
> One real negative point of Javascript generated by seaside is that the JS code is embedded in the HTML document. When it comes to debugging JS code (and you will have to) you will hit a real hard wall. Your browser will tell you there is an error in line 1, column 38461 of your document. Whereas when you use a file library and ship native JS code from either a file librayr or the file system, you will be able to add a breakpoint to ypur javascript "file" and debug and inspect your stuff. I'D even go so far as to warn you not to use file libraries for developimg your JS code. The duplication of quotes will drive you crazy and the fact that there is no support for syntax highlighting and such for a quoted string with JS code inside will cost you productivity. It't probably far easier to use a good JS IDE like IntelliJ or even VS code and import the code into your file libraries if you really need to.
> 
> Better learn the basics of sending data up and down between server and client and go with JS (or some language compiled to JS) on the client side. It will save your day more than once.
> 
> Side note:
> 
> I really like Seaside for what it does: server side pre-genration of web pages and handling inputs from a web form. You can even do nice things using ajax or web sockets: BUT web technologies have moved on since 2004. These days, the JS client drives a backend which is more or less just a modern version of CICS transactions. You may call that single page applicaztion or web-based fat clients or rich web clients or whatever. Seaside, imo, is not exactly good in supporting this model. Using Seaside, you try to adapt to "how it's done" all the time, but it gets real hard. It's old wine in shiny new bottles, but Seaside doesn't all too well into this model. If you want cool web applications to be as interactive as your competition, you may want to look into other technologies like a Smalltalk that compils to JS and has good tool support. Or native JS and a Smalltalk backend acting as a data curator and transaction manager. REST is your best bet for a start, imp.
> 
> 
> Okay, shoot ;-)
> 
> 
> Joachim
> 
> 
> 
> Am 22.01.23 um 20:29 schrieb Tim Johnson:
>> Hi Seasiders,
>> 
>> I'm beginning to use Seaside's JavaScript integrations a bit. I've avoided JavaScript all these years, but I think it's necessary for my current project.  The project will use the computer/phone keyboard for interaction.
>> 
>> I've had my first success by attaching an event listener to keydown as follows:
>> 
>> renderContentOn: html
>> 
>>     html document addLoadScript: ( (html jQuery this) onKeyDown: ( html javascript logger log: 'keydown' ) ) .
>> 
>> 
>> 
>> I understand this is about as basic as it gets, but I'm still overjoyed at this success.  Interacting with the keyboard in a web app is something I've wanted to do for years.
>> 
>> The next steps for me would be to:
>> 
>> 1) print what the keycode is, in the console log above, instead of just 'keydown'.  How could I get event details in a snippet like the above?  Is this possible without AJAX or writing raw JavaScript?
>> 
>> 2) My app will need to know which element on the page is being 'hovered' over or has focus when the keypress event arrives.  I can imagine a few possible ways of doing this...
>> 
>> 2a) I may need to add <input> tags on my page, so when one gets tapped/activated by someone using the app on a phone, the keyboard will pop up.  The <input> tag/element could then be what is listening for keydown/keyup/keypress events, instead of the base document.  (But I don't want actual text input boxes.)
>> 
>> 2b) using jQuery to search the DOM for the element that current has hover and/or focus
>> 
>> 
>> I'll need to move on to AJAX and passengers next.  Unfortunately the documentation[1] on these subjects seems to remain unwritten. Searching the mailing list might be the best way to learn...?  I also appreciate the "jQuery Functional Test Suite" in the image, but am sometimes wishing for something more... (I am open to the idea of writing down my adventures as potential help to others, as a potential #webruary project...)
>> 
>> [1] older homes of book: https://book.seaside.st/book/web-20/jquery/ajax
>> https://rmod-files.lille.inria.fr/FreeBooks/SeasideBook/2014-07-16-seaside.pdf 
>> 
>> newer home of book:
>> 
>> https://github.com/SquareBracketAssociates/DynamicWebDevelopmentWithSeaside/releases/tag/continuous 
>> 
>> 
>> 
>> Appreciate any help or insight from folks on the list.
>> 
>> Thanks,
>> Tim
>> 
>> _______________________________________________
>> seaside mailing list
>> seaside at lists.squeakfoundation.org
>> http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
> 
> -- 
> 
> -----------------------------------------------------------------------
> Objektfabrik Joachim Tuchel              mailto:jtuchel at objektfabrik.de
> Fliederweg 1                                 http://www.objektfabrik.de
> D-71640 Ludwigsburg                  http://joachimtuchel.wordpress.com
> Telefon: +49 7141 56 10 86 0                    Fax: +49 7141 56 10 86 1
> 
> _______________________________________________
> seaside mailing list
> seaside at lists.squeakfoundation.org
> http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
> 



More information about the seaside mailing list