<%@ taglib prefix="a" uri="http://jmaki/v1.0/jsp" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<link rel="Shortcut Icon" href="https://ajax.dev.java.net/favicon.ico" type="image/x-icon" />

<link rel="stylesheet" href="jmaki-standard-no-sidebars.css" type="text/css"></link>

<html>
    <head>
        <title>jMaki Grizzly Comet Words Sample</title>
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
      <style type="text/css">
     .logo { background: url(images/jmaki-seal.png) top right;width:100px; height:80px;margin-top:0px;background-repeat: no-repeat }
    </style>
    <!--[if lt IE 7]>
        <style type="text/css">
			.logo { background: none; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=image src=images/jmaki-seal.png);cursor:pointer }
        </style>
    <![endif]-->
     <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />  
    </head>
    <body>
        <div id="outerBorder">
            
            <div id="header">
                <div id="banner"><div class="logo" style="float:left"></div>
                <div style="margin-top:20px; float:left;">jMaki Grizzly Comet Words Sample</div>
                </div>
                
                <div id="subheader">
                    <div>              
                    </div>
                </div> <!-- subheader  -->
            </div> <!-- header -->

            <div id="main" style="clear:both">
            
            <p>To use add a word in the form and drag the word. If other
        users are using this app you will see the words move on their browsers as well with
        no latency. Try using two browsers to check.</p>
            <form onsubmit="jmaki.addWord();return false;">
             Add Word: <input id="myinput" type="text" style="width:200px">
                      <input  type="submit" value="Add">
            </form>    
            <a:widget id="mywords" name="grizzly.words" args="{size : 50, word : 'jmaki'}" />

                </div> <!-- content -->                
            </div> <!-- main -->

        </div> <!-- outerborder -->
        <div style="width:99%;text-align:center;position:absolute;bottom:0;">
The images for this demo are provided by  <a href="http://www.flickr.com" >www.<span style="color: rgb(57, 147, 255);">flick</span><span style="color: rgb(255, 28, 146);">r</span>.com</a>.
The infrastructure is provided by <a href="https://ajax.dev.java.net">jMaki<a/> and <a href="https://grizzly.dev.java.net/">Grizzly</a>.
           </div>
    </body>
</html>