[Seaside] JavaScript keypress events

[Joachim Tuchel]

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