Forum How do I...?

Is it possible to insert an image from a string URL?

David J Prokopetz
If I set an element's content as:

content: url("image.gif");


... then I get the image inserted, as expected. However, if I set the element's content like so:

content: url(string(mystring));


... where mystring = "image.gif", nothing shows up.

Is it possible to do what I'm trying to do here?

(Basically, I'm trying to tag entries in a table with icons based on each entry's value. I'd rather not hardcode the URL of the appropriate icon into the XML for each individual entry, as that would sort of defeat the purpose.)
mikeday
You can't use named strings as URLs like that. However, what you are trying to do sounds more like this:
<item>...</item>
<item>...</item>

item[icon="help"] { content: url("help.gif") }
item[icon="note"] { content: url("note.gif") }

So if you had an icon attribute with values such as help, note, warning etc. then you could map those to particular image URLs in your style sheet.
David J Prokopetz
Hmmm... is there any way to do that with the contents of the tag, rather than an attribute? The table I'm working with has a column for record type, as in:

<recordset>
  <record>
    <data>one bright day</data>
    <type>bob</type>
  </record>
  <record>
    <data>in the middle of the night</data>
    <type>fred</type>
  </record>
  <record>
    <data>two dead boys</data>
    <type>joe</type>
  </record>
  <record>
    <data>got up to fight</data>
    <type>bob</type>
  </record>
</recordset>


Adding an attribute to the "type" column, as you suggest, would work, but it would introduce some redundancy - and I'm not sure I actually have the authority to modify the way the XML is set up.
mikeday
This is not really possible with CSS, which is aimed at styling documents rather than data. In documents, text content is ordered and attributes are metadata applying to the text content. Data-oriented XML is more like a sequence of database records rather than documents. If the structure of your XML data is too far removed from the documents that you wish to print, it may be helpful to include a transformation step of some kind that transforms the XML "data" into an XML "document", with text in the right order and attributes set appropriately. CSS is a document styling language, not a data transformation language.
David J Prokopetz
I was afraid of that. The "type" column is already there - I was just hoping that I could get it to display the appropriate icon rather than the text corresponding to that icon.

Heh... well, now the fun part begins. I have to either talk the client into accepting output with text in the "type" column instead of an icon, or talk the boys over in data processing into changing the format of the data. Big fun either way. ;)
mikeday
Are you able to perform a minor transformation yourself before passing the XML to Prince, keeping it conceptually within the XML -> PDF processing stage?
mikeday
I completely forgot the existence of the :contains() pseudo-class selector, which might be just what you need:
type:contains("help") { content: url("help.gif") }

The one issue is that the way selectors work means that you can only select a type element that contains particular text; you cannot select a record element that contains a type element that contains particular text. (There have been proposals to add such functionality to CSS selectors, but the discussion is still ongoing).
David J Prokopetz
mikeday wrote:
The one issue is that the way selectors work means that you can only select a type element that contains particular text; you cannot select a record element that contains a type element that contains particular text.

Totally not a problem - all I need to do is swap the text in the cell with the corresponding graphical icon. This'll work perfectly for my purposes - thanks a million. :)