sacko87/aria.2.html

## aria.2.html
<!doctype html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>WAI-ARIA Test</title>
  </head>
  <body>
    <div role="application" aria-controls="p1" class="ctrl" tabindex="0" aria-describedby="i1">
      <p id="p1" role="alert" aria-live="assertive">i am text.</p>
      <div id="i1">
        <p>Press up to do something.</p>
        <p>Press down to do something else.</p>
      </div>
    </div>
    <script type="text/javascript" src="../closure-library/closure/goog/base.js"></script>
    <script type="text/javascript">
      <!--
        goog.require('goog.dom');
        goog.require('goog.events');
        goog.require('goog.events.KeyCodes');
      -->
    </script>
    <script type="text/javascript">
      <!--
        // get all molecule controllers
        var divs = goog.dom.getElementsByTagNameAndClass("div", "ctrl");
        for(i = 0; i < divs.length; i++) { // loop through ...
          div = divs[i]; // local var
          // add a keydown event to them (to accept commands)
          goog.events.listen(div, goog.events.EventType.KEYDOWN, function(e) {
            // only allow ...
            switch(e.keyCode) {
              // ... these keys to progress
              case goog.events.KeyCodes.ENTER:
              case goog.events.KeyCodes.UP:
              case goog.events.KeyCodes.SPACE:
                // get the target element <p>
                target = goog.dom.getElement(div.getAttribute("aria-controls"), div);

                // for it's new stuffs!
                text = goog.dom.getTextContent(target);
                text = text + ' i am text.';

                // remove its contents
                goog.dom.removeChildren(target);
                // add the new text (this will be the new description
                // it will also be within a new function (when i get to it)
                goog.dom.appendChild(target, goog.dom.createTextNode(text));
              default:
                break;
            }
          });
        }
      -->
    </script>
  </body>
</html>
	<!doctype html>
	<html>
	<head>
	<meta charset="utf-8" />
	<title>WAI-ARIA Test</title>
	</head>
	<body>
	<div role="application" aria-controls="p1" class="ctrl" tabindex="0" aria-describedby="i1">
	<p id="p1" role="alert" aria-live="assertive">i am text.</p>
	<div id="i1">
	<p>Press up to do something.</p>
	<p>Press down to do something else.</p>
	</div>
	</div>
	<script type="text/javascript" src="../closure-library/closure/goog/base.js"></script>
	<script type="text/javascript">
	<!--
	goog.require('goog.dom');
	goog.require('goog.events');
	goog.require('goog.events.KeyCodes');
	-->
	</script>
	<script type="text/javascript">
	<!--
	// get all molecule controllers
	var divs = goog.dom.getElementsByTagNameAndClass("div", "ctrl");
	for(i = 0; i < divs.length; i++) { // loop through ...
	div = divs[i]; // local var
	// add a keydown event to them (to accept commands)
	goog.events.listen(div, goog.events.EventType.KEYDOWN, function(e) {
	// only allow ...
	switch(e.keyCode) {
	// ... these keys to progress
	case goog.events.KeyCodes.ENTER:
	case goog.events.KeyCodes.UP:
	case goog.events.KeyCodes.SPACE:
	// get the target element <p>
	target = goog.dom.getElement(div.getAttribute("aria-controls"), div);

	// for it's new stuffs!
	text = goog.dom.getTextContent(target);
	text = text + ' i am text.';

	// remove its contents
	goog.dom.removeChildren(target);
	// add the new text (this will be the new description
	// it will also be within a new function (when i get to it)
	goog.dom.appendChild(target, goog.dom.createTextNode(text));
	default:
	break;
	}
	});
	}
	-->
	</script>
	</body>
	</html>