I'm working a little bit on the pygit front-end and I was wondering
how to separate the HTML stuff in a clean way from the python-style
program code. I want to separate semantics (python code) from
presentation (css, line breaks, etc) as strictly as possible. When
having to write HTML tags I feel like not being able to do the
separation cleanly; the use of tags is often something inbetween
semantics/structure and presentation.
Example: I want to add a clickable image (with an id that I can
reference from an external style sheet for reasons of fine-grained
positioning, padding and stuff), and a top-level header. There are
some attributes I'd like to use, such as the title attribute in the
anchor tag.
info = '''<a href="../" title="Home"><img
src="../img/pyjamas.64x64.png" id="logo"></a>
<h1>Git Repository Viewer</h1>'''
panel = VerticalPanel()
panel.add(HTML(info))
RootPanel().add(panel)
Is it possible to make the above using Pyjamas classes or so? I've
tried adding an image using ui.Image(), that works, and using the
Image's onBrowserEvent() an anchor tag wouldn't even be necessary. But
it looks like I can't add an id neither to Anchor nor to Image, can I?
logo = Image('../img/pyjamas.64x64.png')
# logo.setAttribute('id', 'logo')
link_logo = Anchor(Widget=logo, Title='Home')
link_logo.href.set('../')
title = HTML('<h1>Git Repository Viewer</h1>')
panel = VerticalPanel()
panel.add(link_logo)
panel.add(title)
RootPanel().add(panel)
There are no setId() methods, and the setAttribute() method is also
missing in both Image and Anchor. So, how can I add an id to the image
(or the anchor at least)?
The '<h1>...</h1>' must probably stay like this, right? We don't have
classes for each and every HTML tag, do we? I'd have to write my own
PageHeader (or so) class to capsulate the semantics...
Peter
