PageRenderTime 35ms CodeModel.GetById 13ms app.highlight 17ms RepoModel.GetById 2ms app.codeStats 0ms

/tags/1.2/src/main/webapp/example/echo.html

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