BBjWindow::getComputedPanelStyle

Description

In BBj 21.00 and higher, this method returns the resolved value of a CSS property currently in effect on the content panel of a BBjWindow.

Syntax

Return Value	Method
string	getComputedPanelStyle(string `cssPropertyName`)

Parameters

Parameter	Description
cssPropertyName	Specifies the CSS property to be queried on the BBjWindow content panel.

Return Value

Returns the resolved value of the specified CSS property name that is currently in effect on the content panel of a BBjWindow. To return the value that is explicitly set on the content panel, use BBjWindow::getPanelStyle.

Remarks

For more details, see the CSS API Window.getComputedStyle, and the CSS Reference.

Examples

rem ' CSS sampler
sysgui = unt
open (sysgui)"X0"
sysgui! = bbjapi().getSysGui()
window! = sysgui!.addWindow(25,25,400,650,"CSS Sampler",$00090083$)
window!.setName("mywindow")
window!.setCallback(window!.ON_CLOSE,"eoj")
window!.setCallback(window!.ON_RESIZE,"resize")
text$ = "The quick brown fox jumps over the lazy dog."
edit! = window!.addEditBox(100,25,25,360,50,text$,$$)
border! = window!.addCheckBox(101,25,100,350,25,"borderStyle",$$)
border!.setCallback(border!.ON_CHECK_ON,"addStyle")
border!.setCallback(border!.ON_CHECK_OFF,"removeStyle")
shadow! = window!.addCheckBox(102,25,125,350,25,"shadowStyle",$$)
shadow!.setCallback(shadow!.ON_CHECK_ON,"addStyle")
shadow!.setCallback(shadow!.ON_CHECK_OFF,"removeStyle")
background! = window!.addCheckBox(103,25,150,350,25,"backgroundStyle",$$)
background!.setCallback(background!.ON_CHECK_ON,"addStyle")
background!.setCallback(background!.ON_CHECK_OFF,"removeStyle")
another! = window!.addCheckBox(104,25,175,350,25,"anotherStyle",$$)
another!.setCallback(another!.ON_CHECK_ON,"addStyle")
another!.setCallback(another!.ON_CHECK_OFF,"removeStyle")
important! = window!.addCheckBox(105,25,200,350,25,"importantStyle",$$)
important!.setCallback(important!.ON_CHECK_ON,"addStyle")
important!.setCallback(important!.ON_CHECK_OFF,"removeStyle")
windowStyle! = window!.addCheckBox(106,25,225,350,25,"windowStyle",$$)
windowStyle!.setCallback(windowStyle!.ON_CHECK_ON,"addWindowStyle")
windowStyle!.setCallback(windowStyle!.ON_CHECK_OFF,"removeWindowStyle")
titlebarStyle! = window!.addCheckBox(107,25,250,350,25,"titleStyle",$$)
titlebarStyle!.setCallback(titlebarStyle!.ON_CHECK_ON,"addTitleBarStyle")
titlebarStyle!.setCallback(titlebarStyle!.ON_CHECK_OFF,"removeTitleBarStyle")
outerStyle! = window!.addCheckBox(108,25,275,350,25,"outerStyle",$$)
outerStyle!.setCallback(outerStyle!.ON_CHECK_ON,"addOuterStyle")
outerStyle!.setCallback(outerStyle!.ON_CHECK_OFF,"removeOuterStyle")
getStyles! = window!.addButton(1,25,300,150,25,"getStyles",$$)
getStyles!.setCallback(getStyles!.ON_BUTTON_PUSH,"getStyles")
clearStyles! = window!.addButton(2,200,300,150,25,"clearStyles",$$)
clearStyles!.setCallback(clearStyles!.ON_BUTTON_PUSH,"clearStyles")
window!.addStaticText(109,5,355,50,25,"Style:",$8000$)
style! = window!.addEditBox(110,60,350,320,25,"",$$)
window!.addStaticText(111,5,405,50,25,"Value:",$8000$)
value! = window!.addEditBox(112,60,400,320,25,"",$$)
browser = info(3,6)="5" or info(3,6)="6"
font! = sysgui!.makeFont("SansSerif",10,BBjFont.PLAIN)
getStyle! = window!.addButton(3,5,450,105,25,"Get Edit Style",$$)
getStyle!.setCallback(getStyle!.ON_BUTTON_PUSH,"getStyle")
if browser then getStyle!.setFont(font!)
getComputedStyle! = window!.addButton(4,115,450,170,25,"Get Computed Edit Style",$$)
getComputedStyle!.setCallback(getComputedStyle!.ON_BUTTON_PUSH,"getComputedStyle")
if browser then getComputedStyle!.setFont(font!)
setStyle! = window!.addButton(5,290,450,105,25,"Set Edit Style",$$)
setStyle!.setCallback(setStyle!.ON_BUTTON_PUSH,"setStyle")
if browser then setStyle!.setFont(font!)
getWindowStyle! = window!.addButton(6,5,475,105,50,"Get Window Style",$$)
getWindowStyle!.setCallback(getWindowStyle!.ON_BUTTON_PUSH,"getWindowStyle")
if browser then getWindowStyle!.setFont(font!)
getComputedWindowStyle! = window!.addButton(7,115,475,170,50,"Get Computed Window Style",$$)
getComputedWindowStyle!.setCallback(getComputedWindowStyle!.ON_BUTTON_PUSH,"getComputedWindowStyle")
if browser then getComputedWindowStyle!.setFont(font!)
setWindowStyle! = window!.addButton(8,290,475,105,50,"Set Window Style",$$)
setWindowStyle!.setCallback(setWindowStyle!.ON_BUTTON_PUSH,"setWindowStyle")
if browser then setWindowStyle!.setFont(font!)
getPanelStyle! = window!.addButton(9,5,525,105,50,"Get Panel Style",$$)
getPanelStyle!.setCallback(getPanelStyle!.ON_BUTTON_PUSH,"getPanelStyle")
if browser then getPanelStyle!.setFont(font!)
getComputedPanelStyle! = window!.addButton(10,115,525,170,50,"Get Computed Panel Style",$$)
getComputedPanelStyle!.setCallback(getComputedPanelStyle!.ON_BUTTON_PUSH,"getComputedPanelStyle")
if browser then getComputedPanelStyle!.setFont(font!)
setPanelStyle! = window!.addButton(11,290,525,105,50,"Set Panel Style",$$)
setPanelStyle!.setCallback(setPanelStyle!.ON_BUTTON_PUSH,"setPanelStyle")
if browser then setPanelStyle!.setFont(font!)
getDockStyle! = window!.addButton(12,5,575,105,50,"Get Dock Style",$$)
getDockStyle!.setCallback(getDockStyle!.ON_BUTTON_PUSH,"getDockStyle")
if browser then getDockStyle!.setFont(font!)
getComputedDockStyle! = window!.addButton(13,115,575,170,50,"Get Computed Dock Style",$$)
getComputedDockStyle!.setCallback(getComputedDockStyle!.ON_BUTTON_PUSH,"getComputedDockStyle")
if browser then getComputedDockStyle!.setFont(font!)
setDockStyle! = window!.addButton(14,290,575,105,50,"Set Dock Style",$$)
setDockStyle!.setCallback(setDockStyle!.ON_BUTTON_PUSH,"setDockStyle")
if browser then setDockStyle!.setFont(font!)
process_events
eoj:
  release
resize:
  event! = sysgui!.getLastEvent()
  width = event!.getWidth()
  edit!.setSize(width-40,edit!.getHeight())
  style!.setSize(width-80,style!.getHeight())
  value!.setSize(width-80,value!.getHeight())
return
getStyles:
  i = msgbox(edit!.getStyles().toString(),0,"getStyles")
return
clearStyles:
  border!.setSelected(0)
  shadow!.setSelected(0)
  background!.setSelected(0)
  another!.setSelected(0)
  important!.setSelected(0)
  windowStyle!.setSelected(0)
  titlebarStyle!.setSelected(0)
  edit!.clearStyles()
  window!.clearStyles()
  window!.clearTitleBarStyles()
return
addStyle:
  event! = sysgui!.getLastEvent()
  control! = event!.getControl()
  style$ = control!.getText()
  edit!.addStyle(style$)
  print edit!.getStyles()
return
removeStyle:
  event! = sysgui!.getLastEvent()
  control! = event!.getControl()
  style$ = control!.getText()
  edit!.removeStyle(style$)
  print edit!.getStyles()
return
addWindowStyle:
  event! = sysgui!.getLastEvent()
  control! = event!.getControl()
  style$ = control!.getText()
  window!.addPanelStyle(style$)
  print window!.getStyles()
return
removeWindowStyle:
  event! = sysgui!.getLastEvent()
  control! = event!.getControl()
  style$ = control!.getText()
  window!.removePanelStyle(style$)
  print window!.getStyles()
return
addTitleBarStyle:
  event! = sysgui!.getLastEvent()
  control! = event!.getControl()
  style$ = control!.getText()
  window!.addTitleBarStyle(style$)
  print window!.getTitleBarStyles()
return
removeTitleBarStyle:
  event! = sysgui!.getLastEvent()
  control! = event!.getControl()
  style$ = control!.getText()
  window!.removeTitleBarStyle(style$)
  print window!.getTitleBarStyles()
return
addOuterStyle:
  event! = sysgui!.getLastEvent()
  control! = event!.getControl()
  style$ = control!.getText()
  window!.addOuterStyle(style$)
  print window!.getOuterStyles()
return
removeOuterStyle:
  event! = sysgui!.getLastEvent()
  control! = event!.getControl()
  style$ = control!.getText()
  window!.removeOuterStyle(style$)
  print window!.getOuterStyles()
return
getStyle:
  value!.setText(edit!.getStyle(style!.getText()))
return
getComputedStyle:
  value!.setText(edit!.getComputedStyle(style!.getText()))
return
setStyle:
  edit!.setStyle(style!.getText(),value!.getText())
return
getWindowStyle:
  value!.setText(window!.getPanelStyle(style!.getText()))
return
getComputedWindowStyle:
  value!.setText(window!.getComputedPanelStyle(style!.getText()))
return
setWindowStyle:
  window!.setPanelStyle(style!.getText(),value!.getText())
return
getPanelStyle:
  value!.setText(window!.getPanelStyle(style!.getText()))
return
getComputedPanelStyle:
  value!.setText(window!.getComputedPanelStyle(style!.getText()))
return
setPanelStyle:
  window!.setPanelStyle(style!.getText(),value!.getText())
return
getDockStyle:
  value!.setText(window!.getDockStyle(style!.getText()))
return
getComputedDockStyle:
  value!.setText(window!.getComputedDockStyle(style!.getText()))
return
setDockStyle:
  window!.setDockStyle(style!.getText(),value!.getText())
return

.BBjTopLevelWindow
{
  border: 1px solid LightGray;
}

.backgroundStyle,.windowStyle
{
  background: rgb(242,245,246);
  background: -moz-linear-gradient(top,  rgba(242,245,246,1) 0%, rgba(227,234,237,1) 37%, rgba(200,215,220,1) 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(242,245,246,1)), color-stop(37%,rgba(227,234,237,1)), color-stop(100%,rgba(200,215,220,1)));
  background: -webkit-linear-gradient(top,  rgba(242,245,246,1) 0%,rgba(227,234,237,1) 37%,rgba(200,215,220,1) 100%);
  background: -o-linear-gradient(top,  rgba(242,245,246,1) 0%,rgba(227,234,237,1) 37%,rgba(200,215,220,1) 100%);
  background: -ms-linear-gradient(top,  rgba(242,245,246,1) 0%,rgba(227,234,237,1) 37%,rgba(200,215,220,1) 100%);
  background: linear-gradient(to bottom,  rgba(242,245,246,1) 0%,rgba(227,234,237,1) 37%,rgba(200,215,220,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f5f6', endColorstr='#c8d7dc',GradientType=0 );
}
.borderStyle
{
  border-radius: 15px;
  border-width: 4px;
  border-color: blue;
  border-style: dashed;
}
.shadowStyle
{
  box-shadow: 7px 7px 5px rgba(50, 50, 50, 0.5);
}
.anotherStyle 
{
    font-size:25px;
    color: green;
    background: yellow;
    text-align:center;
    opacity:0.8;
}
.importantStyle 
{
    font-size:25px !important;
    color: blue;
    background: yellow;
    text-align:center;
    opacity:0.6;
}
.BBjTopLevelWindow-titleBar.titleStyle,
.Caption.BBjTopLevelWindow-titleBar.titleStyle
{
    background: #8195a9;
    background: -moz-linear-gradient(top, #889db3, #8195a9 49%, #7a8da0 50%, #738596 98%, #8195a9 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #889db3), color-stop(49%, #8195a9), color-stop(50%, #7a8da0), color-stop(98%, #738596), color-stop(100%, #8195a9));
    background: -webkit-linear-gradient(top, #889db3 0%, #8195a9 49%, #7a8da0 50%, #738596 98%, #8195a9 100%);
    background: -o-linear-gradient(top, #889db3 0%, #8195a9 49%, #7a8da0 50%, #738596 98%, #8195a9 100%);
    background: -ms-linear-gradient(top, #889db3 0%, #8195a9 49%, #7a8da0 50%, #738596 98%, #8195a9 100%);
    background: linear-gradient(to bottom, #889db3 0%, #8195a9 49%, #7a8da0 50%, #738596 98%, #8195a9 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='@colorNew1', endColorstr='@colorNew5', GradientType=0);
    color: #f8fafc;
    text-shadow: 0 1px 4px #404040;
    font-style: italic;
}
.BBjButton.bbj-cancel
{
    background: pink;
}
.BBjButton.bbj-default
{
    background: green;
}
.BBjTopLevelWindow.outerStyle
{
  border-radius: 15px;
  border-width: 4px;
  border-color: red;
  border-style: dotted;
}