jack
/
cocorobolx


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250
							<!DOCTYPE html>
<html>
<!--
Copyright 2007 The Closure Library Authors. All Rights Reserved.

Use of this source code is governed by the Apache License, Version 2.0.
See the COPYING file for details.
-->
<!--

  File for testing bubble control.
-->
<head>
  <title>goog.ui.Bubble</title>
  <script src="../base.js"></script>
  <script>
    if (typeof goog == 'undefined') {
      alert('Closure failed to load');
    } else {
      goog.require('goog.ui.Bubble');
    }
  </script>
  <link rel="stylesheet" href="css/demo.css">
  <link rel="stylesheet" href="../css/bubble.css">
</head>
<body bgcolor="green">
  <h1>goog.ui.Bubble</h1>
  <table width="100%" align="center">
    <tbody>
      <tr>
          <td>
            <div align="left">
            <form>
              <input type="text" id="textField1"/>
              <input type="button" id="button1" value="Click for a bubble!!!"
                  onclick="clickButton(button1, textField1);"/>
            </form>
            </div>
          </td>
          <td>
            <div align="center">
            <form>
              <input type="text" id="textField2"/>
              <input type="button" id="button2" value="Click for a bubble!!!"
                  onclick="clickButton(button2, textField2);"/>
            </form>
            </div>
          </td>
          <td>
            <div align="right">
            <form>
              <input type="text" id="textField3"/>
              <input type="button" id="button3" value="Click for a bubble!!!"
                  onclick="clickButton(button3, textField3);"/>
            </form>
            </div>
          </td>
      </tr>
      <tr height>
          <td>
            <div align="left">
            <form>
              <input type="text" id="textField4"/>
              <input type="button" id="button4" value="Click for a bubble!!!"
                  onclick="clickButton(button4, textField4);"/>
            </form>
            </div>
          </td>
          <td>
            <br>
            <div align="left">
            <form>
              <table>
              <tbody>
              <tr><td>X:</td>
                  <td><input type="text" id="xcoord" value="100"/></td>
              </tr>
              <tr><td>Y:</td>
                  <td><input type="text" id="ycoord" value="100"/></td>
              </tr>
              <tr><td>Corner orientation(0-3):</td>
                  <td><input type="text" id="corner" value="1"/></td>
              </tr>
              <tr><td>Auto-hide (true or false):</td>
                  <td><input type="text" id="autoHide" value="false"/></td>
              </tr>
              <tr><td>Timeout (ms):</td>
                  <td><input type="text" id="timeout" value="0"/></td>
              <tr><td>Decorated</td>
                  <td><input type="checkbox" id="decorated"/></td>
              <tr><td><input type="button" id="button5.0.0"
                  value="Click for a custom bubble!!!"
                  onclick=
                    "doCustom(xcoord, ycoord, corner, autoHide, timeout, decorated);"/>
              </td><td><input type="button" id="button5.0.1"
                  value="Toggle custom button!"
                  onclick="toggleVisibility();"/>
              </td>
              </tr>
              <tr><td><input type="button" id="button5.1"
                  value="Click for a random bubble!!!"
                  onclick="doRandom();"/>
              </td></tr>
              </tbody>
              </table>
            </form>
            </div>
            <br>
          </td>
          <td>
            <div align="right">
            <form>
              <input type="text" id="textField6"/>
              <input type="button" id="button6" value="Click for a bubble!!!"
                  onclick="clickButton(button6, textField6);"/>
            </form>
            </div>
          </td>
      </tr>
      <tr>
          <td height="30%">
            <div align="left">
            <form>
              <input type="text" id="textField7"/>
              <input type="button" id="button7" value="Click for a bubble!!!"
                  onclick="clickButton(button7, textField7);"/>
            </form>
            </div>
          </td>
          <td>
            <div align="center">
            <form>
              <input type="text" id="textField8"/>
              <input type="button" id="button8" value="Click for a bubble!!!"
                  onclick="clickButton(button8, textField8);"/>
            </form>
            </div>
          </td>
          <td>
            <div align="right">
            <form>
              <input type="text" id="textField9"/>
              <input type="button" id="button9" value="Click for a bubble!!!"
                  onclick="clickButton(button9, textField9);"/>
            </form>
            </div>
          </td>
      </tr>
    </tbody>
  </table>


  <script>

    var defaultTimeout = 10000;
    var bubble = null;
    function clickButton(anchor, textField) {
      if (bubble) {
        bubble.dispose();
        bubble = null;
      }
      var textString = textField.value;
      if (!textString) {
        textString = 'Input here!';
        anchor = textField;
      }

      bubble = new goog.ui.Bubble(textString);
      bubble.setAutoHide(false);
      bubble.setPosition(new goog.positioning.AnchoredPosition(anchor, null));
      bubble.setTimeout(defaultTimeout);
      bubble.render();
      bubble.attach(anchor);
      bubble.setVisible(true);
    }

    var decorated = false;
    var bubbleC = null;
    function doCustom(xcoord, ycoord, corner, autoHide, timeout, decorated) {
      if (bubbleC) {
        bubbleC.dispose();
        bubbleC = null;
      }
      if (parseInt(xcoord.value) == NaN ||
          parseInt(ycoord.value) == NaN ||
          parseInt(corner.value) == NaN ||
          parseInt(timeout.value) == NaN ||
          (autoHide.value != "true" && autoHide.value != "false") ||
          (corner.value < 0 || corner.value > 3)) {
        alert('Incorrect input!');
        return;
      }
      var internalElement = null;
      if (decorated.checked) {
        internalElement = goog.dom.createElement('div');
        internalElement.innerHTML = '<table><tbody>' +
            '<tr><td>One!</td><td>Two!</td></tr>' +
            '<tr><td>Three!</td><td>Four!</td></tr>' +
            '</tbody></table>';
      } else {
        internalElement = 'Random Bubble. La-la-la-la! La-la-la-la-la!!!';
      }
      bubbleC = new goog.ui.Bubble(internalElement);
      bubbleC.setAutoHide(autoHide.value == "false" ? false : true);
      bubbleC.setPinnedCorner(parseInt(corner.value));
      bubbleC.setPosition(new goog.positioning.AbsolutePosition(
          parseInt(xcoord.value), parseInt(ycoord.value)));
      bubbleC.setTimeout(parseInt(timeout.value));

      bubbleC.render();
      bubbleC.setVisible(true);
    }

    function toggleVisibility () {
      if (bubbleC) {
        bubbleC.setVisible(!bubbleC.isVisible());
      }
    }

    var timer = null;
    function doRandom() {
      if (timer) {
        window.clearInterval(timer);
        timer = null;
        return;
      }
      doRandomClick();
      timer = window.setInterval(doRandomClick, 2000);
    }

    function doRandomClick() {
      for ( ; ; ) {
        var number=Math.floor(Math.random()*9) + 1;
        if (number != 5) {
          break;
        }
      }

      var button = document.getElementById("button" + number);
      if (button) {
        var defaultTimeoutSav = defaultTimeout;
        defaultTimeout = 2000;
        button.click ();
        defaultTimeout = defaultTimeoutSav;
      }
    }
  </script>

</body>
</html>