Start Building Professional
Web Apps Today


 
Categories Question details Back To List
Question  posted by josh on Jun 01, 2009 20:35
open dhtmlx forum
menu/toolbar and layout question

hello,

quick questions:

1) for dhtmlx toolbar/menu integrated in dhtmlx layout
we have several toolbars/menus created with attachMenu/Toolbar. is it possible to have different styles for each of them? for example, we use a toolbar at the top of the layout as navigation bar and as such we wish to have its height increaded by at least twice and also the icons/images sizes' double too?

how can we do that?

2) for dhtmlxlayout
a) how can we still show the header text even if the header has been collapsed?
b) is it possible to put complex div inside header/status of layout cell? (for example right align text box in header or some sort of paging bar in status bar ? )

3) this is mostly a next update question:
our infrastructure has started to move towards json feeds. are you planning to fully support json? currently json is quite limited compared to what we can do with xml feeds (especially the dataprocessor) in your components...please advise of an estimated time schedule if possible.


thanks,

j
Answer posted by Support on Jun 08, 2009 00:32
Hello,

1) Toolbar size

You should edit dhtmlxtoolbar_dhx_blue.css file
For example you'd like to increase image height to 32 px, last image height was 16px, for this you should overwrite height for the following rules:
.dhtmlxToolbar_dhx_blue {
   height: 41px;
table.dhtmlxToolbarTable_dhx_blue td.dhtmlxToolbarIMG {
   width: 32px;
   height: 32px;
table.dhtmlxToolbarTable_dhx_blue td.dhtmlxToolbarIMG img {
   width: 32px;
   height: 32px;
table.dhtmlxToolbarTable_dhx_blue table.itemDefault {
   height: 38px;
table.dhtmlxToolbarTable_dhx_blue table.itemDisabled {
   height: 38px;
table.dhtmlxToolbarTable_dhx_blue table.itemOver {
   height: 38px;
table.dhtmlxToolbarTable_dhx_blue table.itemPressed {
   height: 38px;
table.dhtmlxToolbarTable_dhx_blue td.dhtmlxToolbarItem div.dhtmlxToolbarSep {
   height: 35px;

Change dhtmlxwindows.js file
win.attachToolbar = function(h) {
   return that._attachWebToolbar(this, h);

Change dhtmlxlayout.js file
td.attachToolbar = function(h) {
   this._toolbar = this.window.attachToolbar(h);

Change ext/dhtmlxwindows_wtb.js file
this._attachWebToolbar = function(win, h) {
   ...
   win._toolbarH = (h?h:(_isIE?24:24));
   win._toolbarT = (h?(_isIE?h-1:h):(_isIE?23:24));

Now you can do the following:
   var toolbar = dhxLayout.cells("a").attachToolbar(41); <-- 41 is a .dhtmlxToolbar_dhx_blue { height: 41px; } value

2.a) Header text

It is possible to do such thing only for the horisontal header in the current version, probably will added for both in future release.
We can send you a demo if you need.

2.b) Custom text

It is possible, dhxLayout.cells("a").setText() and statusBar.setText() inserting text via innerHTML, so you can insert any kind of object

3) JSON

For the moment JSON layout's integration is not planned. Please contact us via support@dhtmlx.com on this subj.