5250 Terminal Branding

Changing Color and/or Background Defaults

The end user is able to change the colors of the Terminal Emulator using the Change Colors option, but in order to modify the defaults, changes should be made to the CSS file Framework.css.

The following styles in Framework.css set the default colors:

    .AsnaTermDEF_GREEN      { color: #00FF00; }
    .AsnaTermDEF_BKGD       { color: #000000; }
    .AsnaTermDEF_BLUE       { color: #0099FF; }
    .AsnaTermDEF_RED        { color: #FF0000; }
    .AsnaTermDEF_WHITE      { color: #FFFFFF; }
    .AsnaTermDEF_TURQUOISE  { color: #AFEEEE; }
    .AsnaTermDEF_YELLOW     { color: #FFFF00; }
    .AsnaTermDEF_PINK       { color: #FF1493; }
    .AsnaTermDEF_CURSOR     { color: #FFFFFF; }
    .AsnaTermDEF_SEL        { color: #FFFFFF; }

Modifying the colors in the .css will alter the defaults, but end users can still modify the colors locally using the options on the "color picker" panel. End users can also reset to the defaults by clicking the "Restore Defaults" button on the color picker.

In the event of a conflict or one of the colors being absent in Framework.css, the terminal emulator will fall back on the colors defined the client's local storage, as outlined in the following table:

Item Key	Default Value (Some values shown with black background for easier viewing.)
ASNA.5250Terminal.greenColor	'#00FF00'
ASNA.5250Terminal.blackColor	'#000000'
ASNA.5250Terminal.blueColor	'#0099FF'
ASNA.5250Terminal.redColor	'#FF0000'
ASNA.5250Terminal.whiteColor	'#FFFFFF'
ASNA.5250Terminal.turquoiseColor	'#AFEEEE'
ASNA.5250Terminal.yellowColor	'#FFFF00'
ASNA.5250Terminal.pinkColor	'#FF1493'
ASNA.5250Terminal.backgroundColor	'#000000'
ASNA.5250Terminal.cursorColor	'#FFFFFF'
ASNA.5250Terminal.selectColor	'#FFFFFF'
ASNA.5250Terminal.menubarTextColor	'#000000'
ASNA.5250Terminal.menubarColor	'#FFFFFF'
ASNA.5250Terminal.menubarBackgroundImage	'url(Images/menubar_terminal_default.jpg)'
ASNA.5250Terminal.menubarBackgroundRepeat	'repeat-y'
ASNA.5250Terminal.statusbarTextColor	'#000000'
ASNA.5250Terminal.statusbarColor	'#FFFFFF'
ASNA.5250Terminal.statusbarBackgroundImage	'url(Images/statusbar_terminal_default.jpg)'
ASNA.5250Terminal.statusbarBackgroundRepeat	'repeat-y'
ASNA.5250Terminal.backgroundRepeat	'no-repeat'
ASNA.5250Terminal.menuColorsRedirectLocation	'5250ColorSchemas'

It's also possible (but not reccommended) to change the default colors and /or background images by changing the entries in the client local storage with JavaScript, before calling the renderDisplayInit function by following the steps below.

1. Edit the Asna5250Terminal.aspx markup.
2. Identify the JavaScript code at the bottom of the page in the ContentPlaceHolderID = PageScriptPH.

   <asp:Content ID="Content1" runat="server" ContentPlaceHolderID="PageScriptPH">
     <script type="text/javascript">
        . . .
        . . .
        WingsTerminal.renderDisplay_init("85%","100%");
     </script>
   </asp:Content>

3. Add entries with your new defaults, before the call to the function renderDisplay_init(). The following example demonstrates the entries you could add.

   <asp:Content ID="Content1" runat="server" ContentPlaceHolderID="PageScriptPH">
      <Script type="text/javascript">
         . . .
         . . .
         var keyNamespace = 'ASNA.5250Terminal.';
   
         localStorage.setItem(keyNamespace + 'greenColor', newGreenDefault );
         localStorage.setItem(keyNamespace + 'blackColor', newBlackDefault );
         localStorage.setItem(keyNamespace + 'blueColor', newBlueDefault );
         localStorage.setItem(keyNamespace + 'redColor', newRedDefault );
         localStorage.setItem(keyNamespace + 'whiteColor', newWhiteDefault );
         localStorage.setItem(keyNamespace + 'turquoiseColor', newTurquioseDefault );
         localStorage.setItem(keyNamespace + 'yellowColor', newYellowDefault );
         localStorage.setItem(keyNamespace + 'pinkColor', newPinkDefault );
         localStorage.setItem(keyNamespace + 'backgroundColor', newBackgroundColorDefault );
         localStorage.setItem(keyNamespace + 'cursorColor', newCursorColorDefault );
         localStorage.setItem(keyNamespace + 'selectColor', newSelectColorDefault );
         localStorage.setItem(keyNamespace + 'menubarTextColor', newMenubarTextColorDefault );
         localStorage.setItem(keyNamespace + 'menubarColor', newMenubarColorDefault );
         localStorage.setItem(keyNamespace + 'menubarBackgroundImage', newUrl );
         localStorage.setItem(keyNamespace + 'menubarBackgroundRepeat', newCSSRepeat );
         localStorage.setItem(keyNamespace + 'statusbarTextColor', newStatusTextColorDefault );
         localStorage.setItem(keyNamespace + 'statusbarColor', newStatusbarColorDefault  );
         localStorage.setItem(keyNamespace + 'statusbarBackgroundImage', newUrl );
         localStorage.setItem(keyNamespace + 'statusbarBackgroundRepeat', newCSSRepeat );
         localStorage.setItem(keyNamespace + 'backgroundImage', newImage );
         localStorage.setItem(keyNamespace + 'backgroundRepeat', newCSSRepeat );
   
      WingsTerminal.renderDisplay_init();
   </Script>

See Also

Keyboard Mapping

Keyboard Macros

5250 Terminal Emulator Menus

5250 Terminal Emulator Resizing