swat.obsolete/apps/qooxdoo-examples/test/ColorTheme_1.html

   1 <html>
   2 <head>
   3   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
   4   <title>qooxdoo &raquo; Demo</title>
   5   <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
   6   <!--[if IE]>
   7   <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
   8   <![endif]-->
   9   <script type="text/javascript" src="../../script/qx.js"></script>
  10 </head>
  11 <body>
  12   <script type="text/javascript" src="../../script/layout.js"></script>
  13
  14   <div id="demoDescription">
  15     <p>Color Theme Test</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     var w1 = new qx.ui.basic.Terminator;
  24
  25     w1.setWidth(100);
  26     w1.setHeight(100);
  27     w1.setBackgroundColor(new qx.renderer.color.Color("yellow"));
  28     w1.setTop(48);
  29     w1.setLeft(20);
  30
  31     d.add(w1);
  32
  33
  34
  35     var w2 = new qx.ui.basic.Terminator;
  36
  37     w2.setWidth(100);
  38     w2.setHeight(100);
  39     w2.setBackgroundColor(new qx.renderer.color.ColorObject("activecaption"));
  40     w2.setTop(48);
  41     w2.setLeft(150);
  42
  43     d.add(w2);
  44
  45
  46
  47
  48     var w3 = new qx.ui.basic.Terminator;
  49
  50     w3.setWidth(100);
  51     w3.setHeight(100);
  52     w3.setBackgroundColor("red");
  53     w3.setTop(200);
  54     w3.setLeft(20);
  55
  56     d.add(w3);
  57
  58
  59
  60     var w4 = new qx.ui.basic.Terminator;
  61
  62     w4.setWidth(100);
  63     w4.setHeight(100);
  64     w4.setBackgroundColor("red");
  65     w4.setTop(200);
  66     w4.setLeft(150);
  67
  68     d.add(w4);
  69
  70
  71
  72
  73     var w5 = new qx.ui.basic.Label("Hello World");
  74
  75     w5.setTop(320);
  76     w5.setLeft(20);
  77     w5.setColor("red");
  78
  79     d.add(w5);
  80
  81
  82
  83
  84
  85     var w6 = new qx.ui.basic.Terminator;
  86
  87     w6.setWidth(100);
  88     w6.setHeight(100);
  89     w6.setBackgroundColor("activecaption");
  90     w6.setTop(400);
  91     w6.setLeft(20);
  92
  93     d.add(w6);
  94
  95
  96
  97     var w7 = new qx.ui.basic.Terminator;
  98
  99     w7.setWidth(100);
 100     w7.setHeight(100);
 101     w7.setBackgroundColor("activeCaption");
 102     w7.setTop(400);
 103     w7.setLeft(150);
 104
 105     d.add(w7);
 106
 107
 108
 109
 110     var w8 = new qx.ui.basic.Label("Hello World");
 111
 112     w8.setTop(520);
 113     w8.setLeft(20);
 114     w8.setColor("ActiveCaption");
 115
 116     d.add(w8);
 117
 118
 119
 120
 121
 122
 123
 124     var w9 = new qx.ui.basic.Atom("Super qooxdoo", "icon/48/bell.png");
 125
 126     w9.setTop(520);
 127     w9.setLeft(200);
 128     w9.setBorder(new qx.renderer.border.BorderObject(2, "solid", "activeCaption"));
 129     w9.setBackgroundColor("threedlightshadow");
 130
 131     d.add(w9);
 132
 133
 134
 135
 136
 137     var w10 = new qx.ui.basic.Atom("Super qooxdoo", "icon/48/bell.png");
 138
 139     w10.setTop(520);
 140     w10.setLeft(400);
 141     w10.setBorder(new qx.renderer.border.BorderObject(2, "solid", new qx.renderer.color.ColorObject("activeCaption")));
 142     w10.setBackgroundColor("threedlightshadow");
 143
 144     d.add(w10);
 145
 146
 147
 148
 149
 150
 151     var w11 = new qx.ui.basic.Label("Hello World");
 152
 153     w11.setTop(600);
 154     w11.setLeft(20);
 155     w11.setBackgroundColor([232,102,255]);
 156     w11.setColor(20,30,60);
 157     w11.setBorder(1, "solid", "red");
 158
 159     d.add(w11);
 160
 161
 162
 163     var w12 = new qx.ui.basic.Label("Hello World");
 164
 165     w12.setTop(600);
 166     w12.setLeft(120);
 167     w12.setBackgroundColor([232,102,255]);
 168     w12.setColor(20,30,60);
 169     w12.setBorder([1, "solid", "red"]);
 170
 171     d.add(w12);
 172
 173
 174
 175     var w13 = new qx.ui.basic.Label("Hello World");
 176
 177     w13.setLocation(220, 600);
 178     w13.setBackgroundColor([232,102,255]);
 179     w13.setColor(20,30,60);
 180     w13.setBorder([1, "solid", "activeCaption"]);
 181
 182     d.add(w13);
 183
 184
 185
 186
 187     var myBoundedBorder1 = new qx.renderer.border.Border(1, "solid", [200,10,20]);
 188
 189
 190     var w14 = new qx.ui.basic.Terminator;
 191
 192     w14.setWidth(100);
 193     w14.setHeight(100);
 194     w14.setLeft(600);
 195     w14.setTop(100);
 196     w14.setBorder(myBoundedBorder1);
 197
 198     d.add(w14);
 199
 200     // should not work with qx.renderer.border.Border - use qx.renderer.border.BorderObject instead
 201     w14.addEventListener("click", function(e) {
 202       myBoundedBorder1.setTopColor([100,200,200]);
 203       myBoundedBorder1.setTopWidth(10);
 204     });
 205
 206
 207
 208     var myBoundedBorder2 = new qx.renderer.border.BorderObject(1, "solid", [200,10,20]);
 209
 210
 211     var w15 = new qx.ui.basic.Terminator;
 212
 213     w15.setWidth(100);
 214     w15.setHeight(100);
 215     w15.setLeft(600);
 216     w15.setTop(210);
 217     w15.setBorder(myBoundedBorder2);
 218
 219     d.add(w15);
 220
 221     w15.addEventListener("click", function(e) {
 222       myBoundedBorder2.setTopColor([100,200,200]);
 223       myBoundedBorder2.setTopWidth(10);
 224     });
 225
 226
 227
 228
 229     // Color Themes
 230     qx.manager.object.ColorManager.getInstance().createThemeList(d, 350, 128);
 231
 232   });
 233   </script>
 234 </body>
 235 </html>