listening for mouse clicks versus listening to keypresses

[Mark W. Andrews]

Hi,
(I am new to pyjamas, and this group. Many thanks to all those who developed pyjamas, it seems perfect for what I need!)

In one of the applications I am working on, I would like to listen for keypress events. As a trivial example, a html panel might display a word and then if a key is pressed, it would display another word, and so on. I have found this a bit more difficult than I initially envisaged as doing the same thing with mouse clicks is easy. I presume the reason for the difference is something to do with keyboard focus, but I am not sure I fully get the big picture.

As part of my learning, I have written two pieces of code to display words one after the other like in my trivial example just mentioned. One works with clicks, the other with key presses. The clicky one was simple, but the pressy one, although it works, strikes me as unnecessarily convoluted. It uses a "root panel listener" object that I ripped off from the ClickableRootPanel.py example. I have included the code below.

In general, is it possible to get an e,g. HTML panel to listen to and act on a key press? If so, how is this done? My attempts at adding a key listener, in analogy with adding a click listener in the first piece below, did not work at all?
I am sure my root panel listener approach is unnecessary, but I am stumped as to what to try next.

Any insights or advice would be most appreciated.
-Mark

# this displays words from a sentence,
# one word at a time, moving with each click.
# tested in FF and Chrome
from pyjamas.ui.ClickListener import ClickHandler
from pyjamas.ui.HTMLPanel import HTMLPanel
from pyjamas.ui.RootPanel import RootPanel

class SentenceBox(HTMLPanel,ClickHandler):
    def __init__(self,text='a b c'):

        HTMLPanel.__init__(self,"")
        ClickHandler.__init__(self)

        self.addClickListener(self)

        self.sentence = text.split()

        self.n = len(self.sentence)
        self.i = 0

        self.setHTML(self.sentence[self.i])


    def onClick(self, sender):
        self.i += 1
        word = self.sentence[self.i % self.n]
        self.setHTML(word)


if __name__ == "__main__":

    sentence = 'In the bed of the river there were pebbles and boulders.'

    RootPanel().add(SentenceBox(text=sentence))
####### END SCRIPT #######


# To do the same thing as above, but moving on with
# key press event led to this. It seems rube goldberg to me.
 
from pyjamas.ui.FocusPanel import FocusPanel
from pyjamas.ui.HTMLPanel import HTMLPanel
from pyjamas.ui.RootPanel import RootPanelCls, RootPanel, manageRootPanel
from pyjamas.ui.Button import Button
from pyjamas.ui.KeyboardListener import KeyboardHandler
from pyjamas.ui.ClickListener import ClickHandler
from pyjamas.ui.HTML import HTML
from pyjamas import Window
from pyjamas import DOM

class RootPanelListener(RootPanelCls, KeyboardHandler, ClickHandler):
    def __init__(self, Parent, sentencebox, *args, **kwargs):

        self.Parent = Parent
        self.focussed = True

        RootPanelCls.__init__(self, *args, **kwargs)
        ClickHandler.__init__(self)
        KeyboardHandler.__init__(self)

        self.addClickListener(self)
        self.addKeyboardListener(self)

        self.sentencebox = sentencebox

    def onClick(self, Sender):
        self.focussed = not self.focussed
        self.Parent.setFocus(self.focussed)

    def onKeyDown(self, sender, keyCode, modifiers = None):
        self.sentencebox.nextword()

class SentenceBox(HTMLPanel):
    def __init__(self,text='a b c'):

        HTMLPanel.__init__(self,"")

        self.sentence = text.split()

        self.n = len(self.sentence)
        self.i = 0

        self.setHTML(self.sentence[self.i])

    def nextword(self):
        self.i += 1
        word =  self.sentence[self.i % self.n]
        self.setHTML(word)
   

if __name__ == '__main__':

    sentence = 'In the bed of the river there were pebbles and boulders.'

    mybox = SentenceBox(text=sentence)
    panel = FocusPanel()
    panel.add(mybox)
    rootpanel = RootPanelListener(Parent = panel,sentencebox=mybox)
    manageRootPanel(rootpanel)
    RootPanel().add(panel)
 

[Rich Newpol]

Root panel listener is the way to do it.

--
 
 
 

[Mark W. Andrews]

Sorry for my slow response and thank you for the advice.
-m