autoWidthForMenus.html

<HTML>

<HEAD>

<script>var dFrameFilePath = '../../../../../dFrame/'</script>

<script language="Javascript" src="../../../../../dFrame/dFrame/lib/DFrameAPI.js"></script>

<script language="Javascript">

//Style

DFrameAPI.include('dFrame/styles/blue/styleBlue.js')

DFrameAPI.onLoad = function(){

var dFrame = new DFrame([10, 10, 90, 90], 'baseMenu.html', dFrameStyle)

var sM = new Array()

sM[0] = ['Button', 'sub1-item1', '']

sM[1] = ['Button', 'sub1-item2', '']

var M = new Array()

M[0] = ['Button', 'item1', sM]

M[1] = ['Button', 'item2', '']

menuStyle.setBordersWidth(1)

menuStyle.setBackgroundColor('#3965A5')

menuStyle.getItemsStyle().setLabelHAlign('LEFT')

//-- Menu 1

var bar = dFrame.addBar('', 'LEFT')

menuStyle.getItemsStyle().setAutoWidth('LABEL')

menuStyle.setWidth(50)

menuStyle.setAutoWidth('')

bar.addMenu(M, menuStyle)

bar.addText('This Menu has autoWidth<br>set to empty string')

//-- Menu 2

var bar = dFrame.addBar('', 'LEFT')

menuStyle.getItemsStyle().setAutoWidth('LABEL')

menuStyle.setWidth(50)

menuStyle.setAutoWidth('CONTENT')

bar.addMenu(M, menuStyle)

bar.addText('This Menu has autoWidth<br>set to \'CONTENT\'.<br>OK for the first level<br>but not for the sub level.')

//-- Menu 3

var bar = dFrame.addBar('', 'LEFT')

menuStyle.getItemsStyle().setAutoWidth('LABEL')

menuStyle.setWidth(150)

bar.addMenu(M, menuStyle)

bar.addText('This Menu has a width set to<br>150:<br>Enough for items of main<br>and sub level.')

//-- Menu 4

var bar = dFrame.addBar('', 'LEFT')

menuStyle.setBordersWidth(1)

menuStyle.getItemsStyle().setAutoWidth('MENU')

menuStyle.setWidth(150)

var menu = bar.addMenu(M, menuStyle)

bar.addText('This Menu is the same as<br>the previous one but items<br>of the Menu have setAutoWidth<br>set to \'MENU\'')

dFrame.show()

}

</script>

</HEAD>

</HTML>