swat/apps/qooxdoo-examples/example/Atom_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>qx.ui.basic.Atom is the parent class for buttons, menu entries, icons, checkboxes. While you can do,
  16     you usually don't have to instantiate qx.ui.basic.Atom directly.</p>
  17   </div>
  18
  19   <script type="text/javascript">
  20   qx.core.Init.getInstance().defineMain(function()
  21   {
  22     var d = qx.ui.core.ClientDocument.getInstance();
  23
  24     // test no1
  25     var nl1 = new qx.ui.basic.Atom("Test #1", "icon/16/reload.png", 16, 16);
  26     nl1.setTop(48);
  27     nl1.setLeft(20);
  28     nl1.setBorder(qx.renderer.border.BorderPresets.getInstance().black);
  29     nl1.setBackgroundColor(new qx.renderer.color.Color("white"));
  30     nl1.setPadding(4);
  31     d.add(nl1);
  32
  33     // test no2
  34     var nl2 = new qx.ui.basic.Atom("Test #2");
  35     nl2.setTop(48);
  36     nl2.setLeft(120);
  37     nl2.setBorder(qx.renderer.border.BorderPresets.getInstance().black);
  38     nl2.setBackgroundColor(new qx.renderer.color.Color("white"));
  39     nl2.setPadding(4);
  40     d.add(nl2);
  41
  42     // test no3
  43     var nl3 = new qx.ui.basic.Atom(null, "icon/16/reload.png");
  44     nl3.setTop(48);
  45     nl3.setLeft(200);
  46     nl3.setBorder(qx.renderer.border.BorderPresets.getInstance().black);
  47     nl3.setBackgroundColor(new qx.renderer.color.Color("white"));
  48     nl3.setPadding(4);
  49     d.add(nl3);
  50
  51     // test no4
  52     var nl4 = new qx.ui.basic.Atom("<span style='font-size:14px'>Some great HTML</span><br/>for <b>you</b>", "icon/32/reload.png");
  53     nl4.setTop(48);
  54     nl4.setLeft(250);
  55     nl4.setBorder(qx.renderer.border.BorderPresets.getInstance().black);
  56     nl4.setBackgroundColor(new qx.renderer.color.Color("white"));
  57     nl4.setPadding(4);
  58     d.add(nl4);
  59
  60     // test no5
  61     var nl5 = new qx.ui.basic.Atom(qx.util.Textile.textilize("*File Information*:\nJPEG-Photo\nCreated: 01/03/05"), "icon/48/icons.png");
  62     with(nl5)
  63     {
  64       setTop(200);
  65       setLeft(20);
  66       setBorder(qx.renderer.border.BorderPresets.getInstance().outset);
  67       setPadding(3, 6);
  68     };
  69     d.add(nl5);
  70   });
  71   </script>
  72 </body>
  73 </html>