sauravtom/url.html

## url.html
<html>
<head>
  <title>Firebase Chat Example</title>
  <script type="text/javascript" src="https://cdn.firebase.com/v0/firebase.js"></script>
  <script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js'></script>

</head>
<body>

<input type='text' id='nameInput' placeholder="Your Url">
<input type='text' id='messageInput' placeholder='Description...'>

<div id='messagesDiv'></div>

<style type="text/css">

html { height: 100% }
body{
    	font:12px/18px 'HelveticaNeue', Helvetica, Arial, sans-serif;
			}
#messagesDiv {
  		overflow: auto;
  		margin-bottom: 5px;
  		text-align: left;
}

#nameInput {width: 18%;
}

#messageInput {width: 80%;
}

#messagesDiv > div {
	background:#3aaae8;
	border: 1px solid black;
	box-shadow:0 4px 9px rgba(0,0,0,.67);
	border-radius: 10px;
	padding:10px;
	margin-bottom: 10px;
}

#messagesDiv > div:hover{
				opacity: 0.8;
				box-shadow:0 0px 0px;
			}

</style>

<script type='text/javascript'>

  // Get a reference to the root of the chat data.
  var messagesRef = new Firebase('https://stom.firebaseio.com/urls');

  // When the user presses enter on the message input, write the message to firebase.
  $('#messageInput').keypress(function (e) {
    if (e.keyCode == 13) {
      var name = $('#nameInput').val();
      var text = $('#messageInput').val();
      messagesRef.push({name:name, text:text});
      $('#messageInput').val('');
		$('#nameInput').val('');
    }
  });

  // Add a callback that is triggered for each chat message.
  messagesRef.on('child_added', function (snapshot) {
    var message = snapshot.val();
    $('<div/>')
		.text(message.text)
			.prepend(
					$('<em/>').text(message.name+': '))
			.appendTo($('#messagesDiv'));

    //$('#messagesDiv')[0].scrollTop = $('#messagesDiv')[0].scrollHeight;


	console.log(message.text);


  });
</script>
</body>
</html>
	<html>
	<head>
	<title>Firebase Chat Example</title>
	<script type="text/javascript" src="https://cdn.firebase.com/v0/firebase.js"></script>
	<script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js'></script>

	</head>
	<body>

	<input type='text' id='nameInput' placeholder="Your Url">
	<input type='text' id='messageInput' placeholder='Description...'>

	<div id='messagesDiv'></div>

	<style type="text/css">

	html { height: 100% }
	body{
	font:12px/18px 'HelveticaNeue', Helvetica, Arial, sans-serif;
	}
	#messagesDiv {
	overflow: auto;
	margin-bottom: 5px;
	text-align: left;
	}

	#nameInput {width: 18%;
	}

	#messageInput {width: 80%;
	}

	#messagesDiv > div {
	background:#3aaae8;
	border: 1px solid black;
	box-shadow:0 4px 9px rgba(0,0,0,.67);
	border-radius: 10px;
	padding:10px;
	margin-bottom: 10px;
	}

	#messagesDiv > div:hover{
	opacity: 0.8;
	box-shadow:0 0px 0px;
	}

	</style>

	<script type='text/javascript'>

	// Get a reference to the root of the chat data.
	var messagesRef = new Firebase('https://stom.firebaseio.com/urls');

	// When the user presses enter on the message input, write the message to firebase.
	$('#messageInput').keypress(function (e) {
	if (e.keyCode == 13) {
	var name = $('#nameInput').val();
	var text = $('#messageInput').val();
	messagesRef.push({name:name, text:text});
	$('#messageInput').val('');
	$('#nameInput').val('');
	}
	});

	// Add a callback that is triggered for each chat message.
	messagesRef.on('child_added', function (snapshot) {
	var message = snapshot.val();
	$('<div/>')
	.text(message.text)
	.prepend(
	$('<em/>').text(message.name+': '))
	.appendTo($('#messagesDiv'));

	//$('#messagesDiv')[0].scrollTop = $('#messagesDiv')[0].scrollHeight;


	console.log(message.text);


	});
	</script>
	</body>
	</html>