Change background color of a specific screen

[Wayne C.]

Is it possible to change the background color of the body of a specific or selected screen? We're still on version 5.0.8.

My ultimate aim is trying to clean up the background when pop up windows are displayed. (The background screen goes back to the unmodified rendering of that screen.) In many of our instances, that screen is kind of jumbled. In some cases, I've been abled to assign an identifier to that screen and clean things up a bit and make the background look more presentable.

I also had the thought of darkening the background (perhaps white to a gray) so that the pop up window stands out more from the background while kind of hiding the background screen. Is this possible?

I entered the following in the "onpageload" and "pageload" events of a particular screen:

script: document.bgColor = "gray";

There wasn't any change. Am I on the right track? I looked at the CSS, but didn't see anything that referred to specific screen names. I'm currently trying to create a function in custom.js. Thanks for any help or suggestions.

[Wayne C.]

Also tried bastardizing some code from custom.js.

if (detectScreen('D_19_69','A%W200AW1')) {
document.bgColor = "grey";
}

This didn't work either.

[Scott Klement]

As far as I know, there's no such thing as "document.bgColor"? did you mean document.body.style.backgroundColor?

If you use that, you'll need a way to set it back to it's default value when you leave the screen (maybe do this in the onsubmit event?)

[Wayne C.]

I got that from my javascript textbook;) I used the document.style.body... and got the color change but it was permanent. I'll try the onsubmit event when I get the chance.

[Scott Klement]

Genie is what they call a "Single Page Application". Its only one web page, and it's not re-loaded during your session. It merely redraws a postion of that page as the 5250 screens change. So, if you change the background color, it will remain changed until you either change it back (possibly in the onsubmit event) or until you reload the page (i.e. end your Genie session, close the window and open a new one.)

That's why I said you'll need a way of changing it back...

For example, you could create a new JavaScript file in the IFS, maybe put it in your Genie Skin directory, and add it to the start.html (using a script tag, just like the one that's there for custom.js, but point it to a different script name...)

In that JavaScript file you could put routines like this:

Code: Select all

if (tantara==null) window.tantara={};
tantara.savedBackground="initial";

tantara.setBackground = function(color) {
   tantara.savedBackground = document.body.style.backgroundColor;
   document.body.style.backgroundColor = color;
}
   
tantara.restoreBackground = function() {
  document.body.style.backgroundColor = tantara.savedBackground;
  return true;
}

NOTE: I did not test the above code, it is just off the top of my head.

Then in a display where you want the background to change, put this in the onload event:

Code: Select all

tantara.setBackground("#808080"); // or whatever color you wish.

And put this in the onsubmit event:

Code: Select all

tantara.restoreBackground

Again, I didn't test this... but when the screen loads it should save the current background color before setting the new one. When the screen submits it should restore the saved color, putting things back to normal.