Customizing a new DDS conversion theme : external css

[Bruno97]

Hi again,

I have created a new theme (new_theme.js) for DDS conversion.
I would like to valorise the Screen properties "external css" for each record format.

How do I do that ? I have tried this, in vain :

Code: Select all

  "screen": {
    "properties": {
  	  "external css": "/profoundui/userdata/custom/themes/new.css"
	  },
	},

[Scott Klement]

Instead of setting the "external css" of every single screen to point to this file, I would suggest simply loading this CSS so that it's always loaded. In fact, if you are using PUI sessions, it should already be loaded (since it's in userdata/custom area of the IFS). If you are using Genie sessions, you could link this CSS file into your start.html so that it's always loaded.

By setting it globally in this manner, if you ever want to change it, you'll only have one place to change it.

If you use a conversion theme to insert it into each and every screen you convert, then when you want to change it, you'll have to change it individually in each display file, which seems like a lot of work to me.

[Bruno97]

Thank you Scott,

The custom theme, if used when a rich display file is called, does not seem to be used on new conversions in the visual designer.
So I have decided to customize one of the existing themes and the profoundui.css file. Though I know I would probably have to re-do the customization in case of an PUI version update.

Bruno

[Scott Klement]

The custom theme, if used when a rich display file is called, does not seem to be used on new conversions in the visual designer.

I'm not sure that I understand this part... a custom theme (I assume you mean a custom 'conversion theme', here) is run when you do use the 'Convert' button in the visual designer. It's never run when the rich display is called... only when converting. Are you, perhaps, referring to a Genie skin rather than a theme? Or maybe you're referring to the CSS file? Can you clarify?

So I have decided to customize one of the existing themes and the profoundui.css file. Though I know I would probably have to re-do the customization in case of an PUI version update.

I would strongly discourage you from changing profoundui.css or an existing theme. Instead, make a copy of the theme, and customize the copy. Also, do not modify profoundui.css, as it will be replaced with each update. There is no reason to modify profoundui.css -- the nature of CSS is such that you can override any settings in profoundui.css by having your own CSS file that implements the same classes. (This is why they are called "cascading" style sheets... you can override settings in one stylessheet by declaring the class in another one.)

Can you explain how you are running your Profound UI applications? Are you running them from Genie? or using the "Launch" tool in the designer? Or from Atrium? (If from Atrium, which option are you using? Web application, Rich Display or Genie Macro?)

[Bruno97]

Ok Scott,

I figured it out... my browser cache drove me crazy yesterday, that's the reason why I got lost.
Thanks for the advice by the way, it's common sense.

Bruno

[Scott Klement]

Here's a tip... when I'm working on something that involves many changes to CSS and/or JavaScript, I'll place a button on the screen I'm testing with. in the 'onclick' event of the button, I'll call pui.refresh()

the pui.refresh() API basically clears all of the Profound files out of the browser's cache, and then re-loads everything from the server. It should re-display the page that you're on with all of the CSS/JS/HTML files refreshed when you click the button.

It's very handy for making changes, then testing them, then making more changes, etc.