PageRenderTime 34ms CodeModel.GetById 12ms app.highlight 16ms RepoModel.GetById 2ms app.codeStats 0ms

/tags/1.1/src/main/webapp/echo.html

http://jquery-stream.googlecode.com/
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>