webapps/qooxdoo-0.6.5-sdk/frontend/application/sample/source/html/test/TreeVirtual_3.html

   1 <html>
   2 <head>
   3   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
   4   <title>qooxdoo &raquo; Demo &raquo; Sample</title>
   5   <link type="text/css" rel="stylesheet" href="../../css/layout.css"/>
   6   <!--[if IE]>
   7   <link type="text/css" rel="stylesheet" href="../../css/layout_ie.css"/>
   8   <![endif]-->
   9   <script type="text/javascript" src="../../script/sample.js"></script>
  10 </head>
  11 <body>
  12   <script type="text/javascript" src="../../script/layout.js"></script>
  13
  14   <div id="demoDescription">
  15     <p>Test large trees.  This one adds a Spam branch with 3000 leaf nodes.</p>
  16   </div>
  17
  18   <script type="text/javascript">
  19   qx.core.Init.getInstance().defineMain(function()
  20   {
  21     var d = qx.ui.core.ClientDocument.getInstance();
  22
  23     // tree
  24     var tree = new qx.ui.treevirtual.TreeVirtual("Tree");
  25     with (tree)
  26     {
  27       set({
  28             left   : 10,
  29             top    : 30,
  30             width  : 400,
  31             bottom : 30,
  32             border : qx.renderer.border.BorderPresets.getInstance().thinInset
  33           });
  34       setColumnWidth(0, 400);
  35       setAlwaysShowOpenCloseSymbol(true);
  36     };
  37
  38     d.add(tree);
  39
  40     // tree data model
  41     var dataModel = tree.getDataModel();
  42
  43     var te1 = dataModel.addBranch(null, "Desktop", true);
  44     dataModel.setState(te1,
  45                        {
  46                          labelStyle : "background-color: red; color: white;"
  47                        });
  48
  49     var te;
  50
  51     dataModel.addBranch(te1, "Files", true);
  52
  53     te = dataModel.addBranch(te1, "Workspace", true);
  54     dataModel.addLeaf(te, "Windows (C:)");
  55     dataModel.addLeaf(te, "Documents (D:)");
  56
  57     dataModel.addBranch(te1, "Network", true);
  58
  59     te = dataModel.addBranch(te1, "Trash", true);
  60     dataModel.setState(te,
  61                        {
  62                          cellStyle : "background-color: cyan;"
  63                        });
  64
  65
  66     var te2 = dataModel.addBranch(null, "Inbox", true);
  67
  68     te = dataModel.addBranch(te2, "Spam", false);
  69
  70     for (var i = 1; i < 3000; i++)
  71     {
  72       dataModel.addLeaf(te, "Spam Message #" + i);
  73     }
  74
  75     dataModel.addBranch(te2, "Sent", true);
  76     dataModel.addBranch(te2, "Trash", true);
  77     dataModel.addBranch(te2, "Data", true);
  78     dataModel.addBranch(te2, "Edit", true);
  79
  80     dataModel.setData();
  81   });
  82   </script>
  83 </body>
  84 </html>