[ZPT] playing with stylesheets in ZPT?

[Martijn Pieters]

On Mon, Apr 09, 2001 at 06:21:50PM +1000, richard@bizarsoftware.com.au wrote:
> Let's say that we have an object tree where every page in the tree has the
> following in it:
> 
> <style type="text/css">
> body {
>   background-repeat: no-repeat; background-image: url(images/main_back.gif)
> }
> </style>
> 
> The images dictionary is an acquired attribute. If we're to avoid reloading
> the background image for every page down the acuisition tree, then we need
> to modify that 'images/main_back.gif' url so it is the same on each page.
> We can do it for <img> tags by preprocessing the page and inserting
> tal:attributes attributes to do the job. Not so for the contents of the
> style tag.
> 
> In the Bad Ol Days of DTML, I just had a dtml statement in there, like
>   url(<dtml-var "path_to_images(REQUEST)">/main_back.gif)
> which worked just fine and dandy... ;)
> 
> Now, remembering that this CSS may be entered by any random Web Designer
> and that it may contain any number of other statements, possibly with a
> bunch of other url(images/blah.gif) in them...
> 
> It's currently impossible as far as I can tell, to have ZPT do what I used
> to do in DTML.
> 
> What _would_ make it possible, would be to be able to, say,
> 
> <style type="text/css" tal:process="here/image_path_fix>
> body {
>   background-repeat: no-repeat; background-image: url(images/main_back.gif)
> }
> </style>
> 
> Where image_path_fix is a method that accepts the content of the <style>
> ... </style> tag, and spits out some possibly modified content...
> 
> Thoughts?

Hmm.. I'd make the stylesheet a Python Script or something.. Or you could
go the CMF way and make the CSS Stylesheet external but include it in the
case of Netscape 4 clients. I converted that to ZPT for the Internet World
demo and that worked great.

I used the following code to include the stylesheet (which keeps working
in Dreamweaver and GoLive if you fill in a correct href attribute on the
tag):

  <link rel="stylesheet" href="default_stylesheet" type="text/css"
        tal:replace="structure here/css_inline_or_link" />


'css_inline_or_link' is a Python Script (no parameters, default bindings):

  import string

  if hasattr(context, 'stylesheet_properties'):
      ag = context.REQUEST.get('HTTP_USER_AGENT', '')
      sheet = context.stylesheet_properties.select_stylesheet_id
      
      if sheet:
          if ag[:9] == 'Mozilla/4' and string.find(ag, 'MSIE') < 0:
              # For Navigator 4.x, inline the stylesheet.
              html = '<style type="text/css">\n<!--\n%s\n-->\n</style>\n' % (
                  getattr(context, sheet))
          else:
              html = '<link rel="stylesheet" href="%s/%s" type="text/css" />' % (
                  context.portal_url(), sheet)

          return html

  return ''

The above code is somewhat CMF specific; it assumes that an object
'stylesheet_properties' defines the name of the stylesheet. You can fold the
'if hasattr', and name your stylesheet directly. For example, if your
stylesheet is called 'site_style.css', you could use:


  import string

  ag = context.REQUEST.get('HTTP_USER_AGENT', '')
  sheet = getattr(context, 'site_style.css')
  
  if ag[:9] == 'Mozilla/4' and string.find(ag, 'MSIE') < 0:
      # For Navigator 4.x, inline the stylesheet.
      html = '<style type="text/css">\n<!--\n%s\n-->\n</style>\n' % sheet
  else:
      html = '<link rel="stylesheet" href="%s/%s" type="text/css" />' % (
          sheet.absolute_url())

  return html

The idea is that this code generates the correct tag for stylesheet
inclusion. You can then manipulate your stylesheet as an external sheet
(stored in a DTMLMethod perhaps) with DreamWeaver or GoLive with the usual
tools. You only have to make sure that the ZPT tag above has a href
attribute that points to the correct location (which is what designers
should put in anyway).

You can then use classic DTML on your stylesheet to make sure that images
are referenced using absolute URLs.

-- 
Martijn Pieters
| Software Engineer  mailto:mj@digicool.com
| Digital Creations  http://www.digicool.com/
| Creators of Zope   http://www.zope.org/
---------------------------------------------