post mo snippet ng code mo pre
eto po sir
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Socket io Chat</title>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script src="/socket.io/socket.io.js"></script>
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="/styles.css">
</head>
<body>
<br />
<!--Username Panel-->
<div id="nickWrap" class="container">
<h1>Enter Username</h1>
<p id="nickError"></p>
<form id="setNick" class="well form-horizontal">
<div class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
<input class="form-control" size="40" id="nickname" placeholder="Section - NickName"></input>
</div>
<br>
<button class="btn btn-success" type="submit">Log in <span class="glyphicon glyphicon-send"></span></button>
</form>
</div>
<!--Chat Panel -->
<div class="container">
<div id="contentWrap">
<div id="chatWrap">
<p class="well" id="chat"></p> <!--chat box-->
<form id="send-message">
<input size="35" id="message"></input>
<input class="btn btn-success" type="submit"></input>
</form>
</div>
<!-- online Users -->
<ul class="well" id="users"></ul>
</div>
</div>
<script>
jQuery(function($) {
var socket = io.connect();
var $nickForm = $('#setNick');
var $nickError = $('#nickError');
var $nickBox = $('#nickname');
var $users = $('#users');
var $messageForm = $('#send-message');
var $messageBox = $('#message');
var $chat = $('#chat');
// User Log-in Panel
$nickForm.submit(function(e){
e.preventDefault();
socket.emit('new user', $nickBox.val(), function(data){
if (data) {
$('#nickWrap').hide();
$('#contentWrap').show();
} else {
$nickError.html('That Username is already take! Try Again...');
}
});
$nickBox.val('');
});
//usernames
socket.on('usernames', function(data){
var html = '';
for(i= 0; i < data.length; i++){
html += data
+ '<br />'
}
$users.html(html);
});
//chat box behavior
$messageForm.submit(function(e) {
e.preventDefault();
socket.emit('send message', $messageBox.val());
$messageBox.val('');
});
//msg
socket.on('new message', function(data){
$chat.append('<b>' + data.nick + ': </b>' + data.msg + "<br/>");
;
});
});
</script>
</body>
</html>
- - - Updated - - -
up up up up up for help
- - - Updated - - -
up up up up up
. Sana may makatulong Salamat
