[Zope-dev] DocumentTemplate with a (bigger) brain

Rik Hoekstra rik.hoekstra@inghist.nl
Thu, 16 Mar 2000 11:28:14 +0100


Hello all, I'm an old bobo fan who hasn't done much with the full zope.
For the record I'd like to encourage y'all to keep things modular -
everyone of us can benefit from parts of zope even if we can't - or
aren't allowed - to use the whole thing.

Anyway, I've got a horrendously complicated site I'm working on with
loads of really, really ugly javascript for things like fancy buttons,
menus, &c.  The typical widget has an external javascript file, plus css
on each individual page, and then a bunch of divs and images that are
document.written on the client side when the page is loaded.  (Please
don't flame if this is flawed, I'm not a Real Programmer [yet])

Thus you have three places where the page is affected by a widget:


<head>
     [script: external javascript file]
     [css definitions]
</head>
<body>
     [html defining widget]
</body>


I would like to define a widget object that can display itself through
dtml, but I wonder if dtml is capable of such a thing.  When parsing a
template, it would need to backtrack and insert additional css and/or a
new external script tag at the top of the page.

Here's what I want as input:


<head>
     <title>check the fancy butts d00d!</title>
</head>
<body>
     <dtml-var super-cool-button>
</body>


And output:


<head>
     <title>check the fancy butts d00d!</title>
     <script src="fancybutt.js"></script>
     <style>
          #butt1 { position: etc }
     </style>
</head>
<body>
     <div id="butt1">
     etc
     </div>
</body>


Of course if there are two buttons on the page, this gets more
complicated as each one will need to have unique names, and they will
probably also have to be initializes onload.  Thus the tag needs to have
1) some sort of memory, and 2) needs to be able to affect parts of the
page outside the scope of the tag itself.

So - can this be implemented with DocumentTemplate, perhaps with a custom
dtml tag?  Will it have to be done in two passes, or is there an idea for
a better way?


<RH>
It is not too difficult but complicated. You can't have dtml backtracking I
believe.

if you have several buttons you may do it like this (perhaps that's what you
meant with two passes) In pseudocode - with lack of Zope support I'm afraid
you will have to sort out the organization of things for yourself :-(:

[dtml header]
[dtml-var <buttonmethod(buttons=[button1, button2, etc])>]
[dtml-footer]

then

buttonmethod has a

[dtml-var <buttonjavascript(buttons=buttons)>]
[dtml-var <buttonstyle(buttons=buttons)>]
</head>
[dtml-var <buttonimages(buttons=buttons)>]
</body>

each of the dtml-var has a method calling button specific methods. It would
be a good idea to put each of the different items associated with a button
in a different directory (for example: javascript, style and and images),
and give in the directories them the name of the button (so in total for
button1 you have three dtml files called (for example) 'button1.dtml' in
three directories.

for example <buttonjavascript>

buttonjavascript
[dtml-in buttons]
   [dtml-var button1] (however that may work)
[/dtml-in]

same for <buttonstyle> and <buttonimage>

This is complicated, but it will get you what you want.
</RH>


Or even better, has anyone else come up with a nice widget implementation?

<RH> There is a ZClass for rotating  images with javascript, but I'm afraid
it's rather Zope specific.</RH>

HTH

Rik