/tags/1.1/src/main/webapp/echo.html
HTML | 48 lines | 47 code | 1 blank | 0 comment | 0 complexity | 3f022404ec8ecca8c71dfd9595cebdcc MD5 | raw file
1<!DOCTYPE html> 2<html> 3 <head> 4 <title>Echo</title> 5 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 6 <script type="text/javascript" src="./js/jquery-1.4.1.js"></script> 7 <script type="text/javascript" src="./js/jquery.stream.js"></script> 8 <script type="text/javascript"> 9 $(function() { 10 $.stream("./echo", { 11 open: function() { 12 $("#textfield").removeAttr("disabled").focus(); 13 }, 14 message: function(event) { 15 $("<p />").text(event.data).prependTo("#content"); 16 }, 17 error: function() { 18 $("#textfield").attr("disabled", "disabled"); 19 }, 20 close: function() { 21 $("#textfield").attr("disabled", "disabled"); 22 } 23 }); 24 25 $("#textfield").keyup(function(event) { 26 if (event.which === 13 && $.trim(this.value)) { 27 $.stream().send({message: this.value}); 28 this.value = ""; 29 } 30 }); 31 }); 32 </script> 33 <style> 34 body {padding: 0; margin: 0; font-family: 'Trebuchet MS','Malgun Gothic'; font-size: 62.5%; color: #333333} 35 #editor {margin: 15px 25px;} 36 #textfield {width: 100%; height: 28px; line-height: 28px; font-family: 'Trebuchet MS','Malgun Gothic'; 37 border: medium none; border-color: #E5E5E5 #DBDBDB #D2D2D2; border-style: solid; border-width: 1px;} 38 #content {height: 100%; overflow-y: auto; padding: 0 25px;} 39 #content p {margin: 0; padding: 0; font-size: 1.3em; color: #444444; line-height: 1.7em; word-wrap: break-word;} 40 </style> 41 </head> 42 <body> 43 <div id="editor"> 44 <input id="textfield" type="text" disabled="disabled" /> 45 </div> 46 <div id="content"></div> 47 </body> 48</html>