Jim Hunter wrote:
> Are there other qooxdoo controls on the page? Is this just part of a
> larger application?
>
> Jim
yes
It works if I run it from source, but when I do a build it doesn't show the
horizontal lines and instead of saying help at the right of the tool bar it
says '5'
it is part of a prototype demo thing...
but there is a tool bar that I pretty much cut and paste from the
demobrowser code and when you press the 'new' button
it creates and adds a browser (also from the demo code)
here is the code in all.
=-------
/* ************************************************************************
Copyright:
License:
Authors:
************************************************************************ */
/* ************************************************************************
#asset(tool_bar_demo/*)
************************************************************************ */
/**
* This is the main application class of your custom application
"tool_bar_demo"
*/
qx.Class.define("tool_bar_demo.Application",
{
extend : qx.application.Standalone,
members :
{
main: function()
{
// Enable logging in debug variant
if (qx.core.Variant.isSet("qx.debug", "on"))
{
// support native logging capabilities, e.g. Firebug for Firefox
qx.log.appender.Native;
// support additional cross-browser console. Press F7 to toggle
visibility
qx.log.appender.Console;
}
this.base(arguments);
var horiz =960
var vert = 1080;
var col = 4;
var row = 4;
// create a container for the main layout and set the main layout
var mainContainer = new qx.ui.container.Composite(new
qx.ui.layout.Basic());
mainContainer.setWidth(horiz);
mainContainer.setHeight(vert);
var foz=this.getRoot();
var html1="";
for (i=0;i<horiz;i+=horiz/col)
{
html1 +='<div style="position:absolute; top: 0; left: '+i+'px; width:
2px; height: '
+vert+'px; color: black; background: black;" ></div>\n';
}
html1 +='<div style="position:absolute; top: 0; left: '+horiz+'px; width:
2px; height: '
+vert+'px; color: black; background: black;" ></div>\n';
for (i=0;i<vert;i+=vert/row)
{
html1+='<div style=" position:absolute; top: '+i+'px; left: 0;
width: '
+horiz+'px; height: 2px; color: black; background: black;"
>\n</div>';
}
for (v=1, cam=1;v<=col;v++)
{
for (h=1;h<=row;h++, cam++)
{
html1 +='<div style="position:absolute; top:
'+(v*(vert/row)-((vert/row)*.10))+'px; left: '
+(h*(horiz/col)-((horiz/col)*.60))+'px;color: black; " >camera
'+cam+'</div>\n';
this.debug("html1:"+html1);
}
}
//this.debug("html1:"+html1);
var embed1 = new qx.ui.embed.Html(html1);
embed1.setWidth(horiz);
embed1.setHeight(vert);
embed1.setDecorator("main");
mainContainer.add(embed1);
// add the main container to the root
this.getRoot().add(mainContainer, {left:20, top:20, right:20});
this.getRoot().setBackgroundColor(null);
///////////////////////////////////////////////////////////////
// Toolbar stuff
///////////////////////////////////////////////////////////////
// create the toolbar
toolbar = new qx.ui.toolbar.ToolBar();
toolbar.setWidth(horiz);
mainContainer.add(toolbar);
// create and add Part 1 to the toolbar
var part1 = new qx.ui.toolbar.Part();
var newButton = new qx.ui.toolbar.Button("New",
"icon/22/actions/document-new.png");
var copyButton = new qx.ui.toolbar.Button("Copy",
"icon/22/actions/edit-copy.png");
var cutButton = new qx.ui.toolbar.Button("Cut",
"icon/22/actions/edit-cut.png");
var pasteButton = new qx.ui.toolbar.Button("Paste",
"icon/22/actions/edit-paste.png");
part1.add(newButton);
part1.add(new qx.ui.toolbar.Separator());
part1.add(copyButton);
part1.add(cutButton);
part1.add(pasteButton);
toolbar.add(part1);
// create and add Part 2 to the toolbar
var part2 = new qx.ui.toolbar.Part();
var checkBtn = new qx.ui.toolbar.CheckBox("Toggle",
"icon/22/actions/format-text-underline.png");
part2.add(checkBtn);
toolbar.add(part2);
// create and add Part 3 to the toolbar
var part3 = new qx.ui.toolbar.Part();
var radioButton1 = new qx.ui.toolbar.RadioButton("Left",
"icon/22/actions/format-justify-left.png");
var radioButton2 = new qx.ui.toolbar.RadioButton("Center",
"icon/22/actions/format-justify-center.png");
var radioButton3 = new qx.ui.toolbar.RadioButton("Right",
"icon/22/actions/format-justify-right.png");
part3.add(radioButton1);
part3.add(radioButton2);
part3.add(radioButton3);
toolbar.add(part3);
// Manager for part 3 (Radio example)
var manager = new qx.ui.form.RadioGroup(radioButton1, radioButton2,
radioButton3);
// create Help Button and add it to the toolbar
var spacer = toolbar.addSpacer();
// spacer.setMaxWidth(100);
var helpButton = new qx.ui.toolbar.Button("Help",
"icon/22/actions/help-contents.png");
toolbar.add(helpButton);
var buttons = [ newButton, copyButton, cutButton, pasteButton,
checkBtn, radioButton1, radioButton2, radioButton3, helpButton ];
var gbfunc = this.createBrowser;
var surffunc = this.surfto;
newButton.addListener("execute", function(e)
{
foz.add(gbfunc(),{left: 40, top: 30});
this.debug("pressed");
});
///////////////////////////////////////////////////////////////
// Control stuff
///////////////////////////////////////////////////////////////
// Create and add the grid
var controlGrid = new qx.ui.layout.Grid();
controlGrid.setSpacing(10);
var controlContainer = new qx.ui.container.Composite(controlGrid);
mainContainer.add(controlContainer);
// register the handler
},
createBrowser : function()
{
var win = new qx.ui.window.Window(
"Web Browser",
"icon/16/categories/internet.png"
);
var layout = new qx.ui.layout.VBox();
layout.setSeparator("separator-vertical");
win.setLayout(layout);
win.setAllowClose(false);
win.setContentPadding(0);
win.open();
var toolbar = new qx.ui.toolbar.ToolBar();
win.add(toolbar);
var btnBack = new qx.ui.toolbar.Button(null,
"icon/16/actions/go-previous.png");
btnBack.addListener("execute", function(e) {
this.iframe.getWindow().history.back();
}, this);
toolbar.add(btnBack);
var btnForward = new qx.ui.toolbar.Button(null,
"icon/16/actions/go-next.png");
btnForward.addListener("execute", function(e) {
this.iframe.getWindow().history.forward();
}, this);
toolbar.add(btnForward);
this.txtUrl = new qx.ui.form.TextField().set({
marginLeft: 1,
value: "http://google.com";,
padding: 2,
alignY: "middle"
});
this.txtUrl.addListener("keypress", function(e) {
if (e.getKeyIdentifier() == "Enter") {
this.surfTo(this.txtUrl.getValue());
}
}, this);
toolbar.add(this.txtUrl, {flex: 1});
btnGo = new qx.ui.toolbar.Button(null,
"icon/16/actions/media-playback-start.png");
btnGo.addListener("execute", function(e) {
this.surfTo(this.txtUrl.getValue());
}, this);
toolbar.add(btnGo);
this.iframe = new qx.ui.embed.Iframe().set({
width: 400,
height: 300,
minWidth: 500,
minHeight: 150,
source: this.txtUrl.getValue(),
decorator : null
});
win.add(this.iframe, {flex: 1});
return win;
},
surfTo : function(url)
{
if (url.indexOf("http://";) !== 0) {
url = "http://"; + url;
this.txtUrl.setValue(url);
}
this.iframe.setSource(url);
}
}
});
--
View this message in context:
http://www.nabble.com/need-to-draw-grid-tp19403321p19417972.html
Sent from the qooxdoo-devel mailing list archive at Nabble.com.
-------------------------------------------------------------------------
This SF.Net email is sponsored by the Moblin Your Move Developer's challenge
Build the coolest Linux based applications with Moblin SDK & win great prizes
Grand prize is a trip for two to an Open Source event anywhere in the world
http://moblin-contest.org/redirect.php?banner_id=100&url=/
_______________________________________________
qooxdoo-devel mailing list
[email protected]
https://lists.sourceforge.net/lists/listinfo/qooxdoo-devel
