+<html>
+<head>
+ <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+ <title>qooxdoo » Demo</title>
+ <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+ <!--[if IE]>
+ <link
+ type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+ <![endif]-->
+ <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+ <script type="text/javascript" src="../../script/layout.js"></script>
+
+
+ <div id="demoDescription">
+ <p>
+ A simple LDB browser.
+ </div>
+
+<script type="text/javascript">
+
+/*
+Root is as found by:
+ source/bin/ldbsearch -H /usr/local/samba/private/sam.ldb -b '' \
+ -s base defaultNamingContext
+*/
+
+function setAppearances()
+{
+ // Modify the default appearance of a ComboBox for use in Search tab:
+ // use most of the available width.
+ //
+ // If we had multiple uses, we'd create a new appearance. Since we don't,
+ // we can just modify this default appearance.
+ //
+ // See http://qooxdoo.org/documentation/user_manual/appearance for an
+ // explanation of what's going on here. The missing significant point in
+ // the discussion is that in the current qooxdoo appearance
+ // implementation, it's not possible to override a specific widget's
+ // appearance with explicit settings just for that widget (stupid!). I
+ // expect that to change in a future version.
+ var appMgr = qx.manager.object.AppearanceManager.getInstance();
+ var theme = appMgr.getAppearanceTheme();
+ var appearance = theme._appearances["combo-box"];
+ if (! appearance)
+ {
+ return;
+ }
+ var oldInitial = appearance.initial;
+ appearance.initial = function(vTheme)
+ {
+ var res = oldInitial ? oldInitial.apply(this, arguments) : {};
+ res.width = "96%";
+ return res;
+ }
+}
+
+function setupMenu(clientDocument)
+{
+ var c1 = new qx.client.Command();
+ c1.addEventListener("execute", function(e) {
+ this.debug("Execute: " + e.getData().getLabel());
+ });
+
+ // Create the File menu pulldown
+ var fileMenu_ = new qx.ui.menu.Menu();
+
+ // Create items for within File menu
+ var fileMenu_NewTab_ = new qx.ui.menu.Menu();
+ {
+ var fileMenu_NewTab_Search =
+ new qx.ui.menu.MenuButton("Search", null, c1);
+ var fileMenu_NewTab_Browse =
+ new qx.ui.menu.MenuButton("Browse", null, c1);
+ var fileMenu_NewTab_Schema =
+ new qx.ui.menu.MenuButton("Schema", null, c1);
+ fileMenu_NewTab_.add(fileMenu_NewTab_Search,
+ fileMenu_NewTab_Browse,
+ fileMenu_NewTab_Schema);
+ }
+ var fileMenu_NewTab =
+ new qx.ui.menu.MenuButton("New tab", null, null, fileMenu_NewTab_);
+
+ var fileMenu_Preferences =
+ new qx.ui.menu.MenuButton("Preferences", null, c1);
+ var fileMenu_CloseTab =
+ new qx.ui.menu.MenuButton("Close Tab", null, c1);
+ var fileMenu_ShowMessageLog =
+ new qx.ui.menu.MenuButton("Show Message Log", null, c1);
+ var fileMenu_Quit =
+ new qx.ui.menu.MenuButton("Quit", null, c1);
+
+ // Add the menu items to the menu
+ fileMenu_.add(fileMenu_NewTab,
+ fileMenu_Preferences,
+ fileMenu_CloseTab,
+ fileMenu_ShowMessageLog,
+ fileMenu_Quit);
+
+
+ // Create the Filter menu pulldown
+ var filterMenu_ = new qx.ui.menu.Menu();
+
+ // Create items for within Filter menu
+ var filterMenu_NewFilter =
+ new qx.ui.menu.MenuButton("New Filter", null, c1);
+ var filterMenu_EditFilters =
+ new qx.ui.menu.MenuButton("Edit Filters", null, c1);
+ var filterMenu_Separator =
+ new qx.ui.menu.MenuSeparator();
+
+ // Add the menu items to the menu
+ filterMenu_.add(filterMenu_NewFilter,
+ filterMenu_EditFilters,
+ filterMenu_Separator);
+
+
+ // Add the menu items to the document
+ clientDocument.add(fileMenu_,
+ fileMenu_NewTab_,
+ filterMenu_);
+
+
+ // Create and position the toolbar which will act as our menubar
+ var toolBar = new qx.ui.toolbar.ToolBar();
+ toolBar.set(
+ {
+ top: 28,
+ left: 20,
+ right: 300
+ });
+
+ // Create the toolbar menu items and associate them with the pulldowns
+ var fileMenuButton =
+ new qx.ui.toolbar.ToolBarMenuButton("File", fileMenu_);
+ var filterMenuButton =
+ new qx.ui.toolbar.ToolBarMenuButton("Filters", filterMenu_);
+
+ // Add the toolbar items to the toolbar
+ toolBar.add(fileMenuButton,
+ filterMenuButton);
+
+ // Add the toolbar to the document
+ clientDocument.add(toolBar);
+
+ // Give 'em what we built!
+ return toolBar;
+}
+
+function setupTabs(clientDocument)
+{
+ // Create and position the tabview
+ var tabView_ = new qx.ui.pageview.tabview.TabView;
+ tabView_.set(
+ {
+ top: 60,
+ left: 20,
+ right: 300,
+ bottom: 30
+ });
+
+ // Create each of the tabs
+ var tabView_Search =
+ new qx.ui.pageview.tabview.TabViewButton("Search");
+ var tabView_Browse =
+ new qx.ui.pageview.tabview.TabViewButton("Browse");
+ var tabView_Schema =
+ new qx.ui.pageview.tabview.TabViewButton("Schema");
+
+ // Specify the initially-selected tab
+ tabView_Search.setChecked(true);
+
+ // Add each of the tabs to the tabview
+ tabView_.getBar().add(tabView_Search,
+ tabView_Browse,
+ tabView_Schema);
+
+ // Create the pages to display when each tab is selected
+ var tabViewPage_Search =
+ new qx.ui.pageview.tabview.TabViewPage(tabView_Search);
+ var tabViewPage_Browse =
+ new qx.ui.pageview.tabview.TabViewPage(tabView_Browse);
+ var tabViewPage_Schema =
+ new qx.ui.pageview.tabview.TabViewPage(tabView_Schema);
+
+ // Build the search page
+ buildPageSearch(tabViewPage_Search);
+
+ // Build the browse page
+ buildPageBrowse(tabViewPage_Browse);
+
+ // Build the schema page
+ buildPageSchema(tabViewPage_Schema);
+
+ // Add the pages to the tabview
+ tabView_.getPane().add(tabViewPage_Search,
+ tabViewPage_Browse,
+ tabViewPage_Schema);
+
+ // Add the tabview to the document
+ clientDocument.add(tabView_);
+
+ // Give 'em what we built!
+ return tabView_;
+}
+
+function buildPageSearch(page)
+{
+ // Create a combo box for entry of the search expression
+ var search = new qx.ui.form.ComboBox();
+ search.getField().setWidth("100%");
+ search.setEditable(true);
+
+ // Add the combo box to the page
+ page.add(search);
+
+ // Create a simple table model
+ var tableModel = new qx.ui.table.SimpleTableModel();
+ tableModel.setColumns([ "Attribute", "Value" ]);
+
+ // Add some garbage data to it
+ var attributeNames =
+ [
+ [ "Nickname" ],
+ [ "Hostname" ],
+ [ "Port" ],
+ [ "Connection caching" ],
+ [ "TLS" ],
+ [ "Client-side caching" ],
+ [ "Connections so far" ],
+ [ "LDAP protocol version" ],
+ [ "Vendor Name" ],
+ [ "Vendor Version" ],
+ [ "Support LDAP Version" ],
+ [ "Supported SASL Mechanisms" ],
+ [ "Junk 1" ],
+ [ "Junk 2" ],
+ [ "Junk 3" ]
+ ];
+
+
+ var rowData = [];
+ for (var row = 0; row < attributeNames.length; row++)
+ {
+ rowData.push([ attributeNames[row], "" + (Math.random() * 10000) ]);
+ }
+ tableModel.setData(rowData);
+ tableModel.setColumnEditable(0, false);
+ tableModel.setColumnEditable(1, true);
+
+ // Create a table
+ var table = new qx.ui.table.Table(tableModel);
+ with (table) {
+ set({
+ top: 40,
+ left: 0,
+ right: 0,
+ bottom: 10,
+ statusBarVisible: false,
+ columnVisibilityButtonVisible: false
+ });
+ setColumnWidth(0, 200);
+ setColumnWidth(1, 440);
+ setMetaColumnCounts([1, -1]);
+ };
+
+ page.add(table);
+}
+
+function buildPageBrowse(page)
+{
+ // Create a vertical splitpane for tree (top) and table (bottom)
+ var splitpane = new qx.ui.splitpane.VerticalSplitPane("1*", "2*");
+ splitpane.setEdge(0);
+
+ // Create a tree row structure for the tree root
+ var trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Root");
+
+ // Create the tree and set its characteristics
+ var tree = new qx.ui.treefullcontrol.Tree(trs);
+ tree.set(
+ {
+ backgroundColor: 255,
+ border: qx.renderer.border.BorderPresets.getInstance().inset,
+ overflow: "auto",
+ height: null,
+ top: 10,
+ left: 0,
+ right: 0,
+ bottom: 10
+ });
+
+ // Add the tree to the page.
+ splitpane.addTop(tree);
+
+ // Create a simple table model
+ var tableModel = new qx.ui.table.SimpleTableModel();
+ tableModel.setColumns([ "Attribute", "Value" ]);
+
+ // Add some garbage data to it
+ var attributeNames =
+ [
+ [ "Nickname" ],
+ [ "Hostname" ],
+ [ "Port" ],
+ [ "Connection caching" ],
+ [ "TLS" ],
+ [ "Client-side caching" ],
+ [ "Connections so far" ],
+ [ "LDAP protocol version" ],
+ [ "Vendor Name" ],
+ [ "Vendor Version" ],
+ [ "Support LDAP Version" ],
+ [ "Supported SASL Mechanisms" ],
+ [ "Junk 1" ],
+ [ "Junk 2" ],
+ [ "Junk 3" ]
+ ];
+
+
+ var rowData = [];
+ for (var row = 0; row < attributeNames.length; row++)
+ {
+ rowData.push([ attributeNames[row], "" + (Math.random() * 10000) ]);
+ }
+ tableModel.setData(rowData);
+ tableModel.setColumnEditable(0, false);
+ tableModel.setColumnEditable(1, true);
+
+ // Create a table
+ var table = new qx.ui.table.Table(tableModel);
+ with (table) {
+ set({
+ top: 10,
+ left: 0,
+ right: 0,
+ bottom: 10,
+ statusBarVisible: false,
+ columnVisibilityButtonVisible: false
+ });
+ setColumnWidth(0, 200);
+ setColumnWidth(1, 440);
+ setMetaColumnCounts([1, -1]);
+ };
+
+ splitpane.addBottom(table);
+
+ // Add the first splitpane to the page
+ page.add(splitpane);
+}
+
+function buildPageSchema(page)
+{
+ // Create a vertical splitpane for tree (top) and remainder (bottom)
+ var splitpane1 = new qx.ui.splitpane.VerticalSplitPane("1*", "2*");
+ splitpane1.setEdge(0);
+
+ // Create a tree row structure for the tree root
+ var trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Root");
+
+ // Create the tree and set its characteristics
+ var tree = new qx.ui.treefullcontrol.Tree(trs);
+ tree.set(
+ {
+ backgroundColor: 255,
+ border: qx.renderer.border.BorderPresets.getInstance().inset,
+ overflow: "auto",
+ height: null,
+ top: 10,
+ left: 0,
+ right: 0,
+ bottom: 10
+ });
+
+ // Add the tree to the page.
+ splitpane1.addTop(tree);
+
+ // Create another vertical splitpane for table (top) and required/allowed
+ // attributes lists (bottom)
+ var splitpane2 = new qx.ui.splitpane.VerticalSplitPane("1*", "2*");
+ splitpane2.setEdge(0);
+
+ // Create a simple table model
+ var tableModel = new qx.ui.table.SimpleTableModel();
+ tableModel.setColumns([ "Attribute", "Value" ]);
+
+ // Add some garbage data to it
+ var attributeNames =
+ [
+ [ "Nickname" ],
+ [ "Hostname" ],
+ [ "Port" ],
+ [ "Connection caching" ],
+ [ "TLS" ],
+ [ "Client-side caching" ],
+ [ "Connections so far" ],
+ [ "LDAP protocol version" ],
+ [ "Vendor Name" ],
+ [ "Vendor Version" ],
+ [ "Support LDAP Version" ],
+ [ "Supported SASL Mechanisms" ],
+ [ "Junk 1" ],
+ [ "Junk 2" ],
+ [ "Junk 3" ]
+ ];
+
+
+ var rowData = [];
+ for (var row = 0; row < attributeNames.length; row++)
+ {
+ rowData.push([ attributeNames[row], "" + (Math.random() * 10000) ]);
+ }
+ tableModel.setData(rowData);
+ tableModel.setColumnEditable(0, false);
+ tableModel.setColumnEditable(1, true);
+
+ // Create a table
+ var table = new qx.ui.table.Table(tableModel);
+ with (table) {
+ set({
+ top: 10,
+ left: 0,
+ right: 0,
+ bottom: 10,
+ statusBarVisible: false,
+ columnVisibilityButtonVisible: false
+ });
+ setColumnWidth(0, 200);
+ setColumnWidth(1, 440);
+ setMetaColumnCounts([1, -1]);
+ };
+
+ splitpane2.addTop(table);
+
+ // Create a horizontal splitpane for required attributes (left) and
+ // allowed attributes (right)
+ var splitpane3 = new qx.ui.splitpane.HorizontalSplitPane("1*", "1*");
+ splitpane3.setEdge(0);
+
+ // Create a vertical box layout for a label and list
+ var layout = new qx.ui.layout.VerticalBoxLayout();
+ layout.setWidth("100%");
+ layout.setHeight("100%");
+
+ // Create a label for the list of required attributes
+ var label = new qx.ui.basic.Atom("Required Attributes");
+
+ // Add the label to the vertical box layout
+ layout.add(label);
+
+ // Create a list for required attributes
+ var requiredAttributes = new qx.ui.form.List();
+ requiredAttributes.setWidth("100%");
+
+ requiredAttributes.set(
+ {
+ top: 0,
+ left: 0,
+ width: "98%",
+ height: "90%",
+ overflow : "scrollY"
+ });
+
+ var item;
+ for( var i=1; i<=35; i++ )
+ {
+ item = new qx.ui.form.ListItem("Item No " + i);
+ !(i % 9) && (item.setEnabled(false));
+ requiredAttributes.add(item);
+ };
+
+ // Add the required attributes to the layout
+ layout.add(requiredAttributes);
+
+ // Add the vertical box layout to the left of the third splitpane
+ splitpane3.addLeft(layout);
+
+ // Create a vertical box layout for a label and list
+ layout = new qx.ui.layout.VerticalBoxLayout();
+ layout.set(
+ {
+ width: "100%",
+ height: "100%"
+ });
+
+ // Create a label for the list of allowed attributes
+ var label = new qx.ui.basic.Atom("Allowed Attributes");
+ label.setLeft(10);
+
+ // Add the label to the vertical box layout
+ layout.add(label);
+
+ // Create a list for allowed attributes
+ var allowedAttributes = new qx.ui.form.List();
+ allowedAttributes.setWidth("100%");
+
+ allowedAttributes.set(
+ {
+ top: 0,
+ left: 10,
+ width: "98%",
+ height: "90%",
+ overflow : "scrollY"
+ });
+
+ var item;
+ for( var i=1; i<=35; i++ )
+ {
+ item = new qx.ui.form.ListItem("Item No " + i);
+ !(i % 9) && (item.setEnabled(false));
+ allowedAttributes.add(item);
+ };
+
+ // Add the allowed attributes to the layout
+ layout.add(allowedAttributes);
+
+ // Add the vertical box layout to the left of the third splitpane
+ splitpane3.addRight(layout);
+
+ // Add the third splitpane to the bottom of the second splitpane
+ splitpane2.addBottom(splitpane3);
+
+ // Add the second splitpane to the bottom of the first splitpane
+ splitpane1.addBottom(splitpane2);
+
+ // Add the first splitpane to the page
+ page.add(splitpane1);
+}
+
+qx.core.Init.getInstance().defineMain(
+ function()
+ {
+ // Set appearances for this application
+ setAppearances();
+
+ // Get the client document
+ var clientDocument = qx.ui.core.ClientDocument.getInstance();
+
+ // Create the toolbar and attach it to the client document
+ var toolBar = setupMenu(clientDocument);
+
+ // Create the tabs and their windows, and attach to client document
+ var tabView = setupTabs(clientDocument);
+ });
+/*
+ * Local Variables:
+ * mode: c
+ * End:
+ */
+</script>
+
+</body>
+</html>
+
git.samba.org / ira / wip.git / commitdiff