Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4

Thread: Chat Project

  1. #1
    New to the CF scene
    Join Date
    Feb 2011
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Chat Project

    i know im new but i have the basic chat room layout but i was wodnering if i could get some help in implementing showing online users and possibly a private message system. any help is appreciated! can provide code on request

  • #2
    New to the CF scene
    Join Date
    Feb 2011
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts
    sorry forgot to post its ajax and php and jscript

  • #3
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,871
    Thanks
    6
    Thanked 1,029 Times in 1,002 Posts
    Why do we have to request your code at first? Showing your code is inevitable if you want to get help so contribute to easing the process by providing as much info as possible.

  • #4
    New to the CF scene
    Join Date
    Feb 2011
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts
    This is the chat script, iscratched together this so far
    Code:
    var instanse = false;
    var state;
    var mes;
    var file;
    
    function Chat () {
        this.update = updateChat;
        this.send = sendChat;
    	this.getState = getStateOfChat;
    }
    
    //gets the state of the chat
    function getStateOfChat(){
    	if(!instanse){
    		 instanse = true;
    		 $.ajax({
    			   type: "POST",
    			   url: "process.php",
    			   data: {  
    			   			'function': 'getState',
    						'file': file
    						},
    			   dataType: "json",
    			
    			   success: function(data){
    				   state = data.state;
    				   instanse = false;
    			   },
    			});
    	}	 
    }
    
    //Updates the chat
    function updateChat(){
    	 if(!instanse){
    		 instanse = true;
    	     $.ajax({
    			   type: "POST",
    			   url: "process.php",
    			   data: {  
    			   			'function': 'update',
    						'state': state,
    						'file': file
    						},
    			   dataType: "json",
    			   success: function(data){
    				   if(data.text){
    						for (var i = 0; i < data.text.length; i++) {
                                $('#chat-area').append($("<p>"+ data.text[i] +"</p>"));
                            }								  
    				   }
    				   document.getElementById('chat-area').scrollTop = document.getElementById('chat-area').scrollHeight;
    				   instanse = false;
    				   state = data.state;
    			   },
    			});
    	 }
    	 else {
    		 setTimeout(updateChat, 1500);
    	 }
    }
    
    //send the message
    function sendChat(message, nickname)
    {       
        updateChat();
         $.ajax({
    		   type: "POST",
    		   url: "process.php",
    		   data: {  
    		   			'function': 'send',
    					'message': message,
    					'nickname': nickname,
    					'file': file
    				 },
    		   dataType: "json",
    		   success: function(data){
    			   updateChat();
    		   },
    		});
    }
    this is the actual webpage
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    
    <head>
    
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        
    
        
        <link rel="stylesheet" href="style.css" type="text/css" />
        
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
        <script type="text/javascript" src="chat.js"></script>
     <script type="text/javascript">
        
            // ask user for name with popup prompt    
            var name = prompt("Enter your chat name:", "Guest");
            
            // default name is 'Guest'
        	if (!name || name === ' ') {
        	   name = "Guest";	
        	}
        	
        	// strip tags
        	name = name.replace(/(<([^>]+)>)/ig,"");
        	
        	// display name on page need help here
        	$("#name-area").html("You are: <span>" + name + "</span>");
        	
        	// kick off chat
            var chat =  new Chat();
        	$(function() {
        	
        		 chat.getState(); 
        		 
        		 // watch textarea for key presses
                 $("#sendie").keydown(function(event) {  
                 
                     var key = event.which;  
               
                     //all keys including return.  
                     if (key >= 33) {
                       
                         var maxLength = $(this).attr("maxlength");  
                         var length = this.value.length;  
                         
                         // don't allow new content if length is maxed out
                         if (length >= maxLength) {  
                             event.preventDefault();  
                         }  
                      }  
        		 																																																});
        		 // watch textarea for release of key press
        		 $('#sendie').keyup(function(e) {	
        		 					 
        			  if (e.keyCode == 13) { 
        			  
                        var text = $(this).val();
        				var maxLength = $(this).attr("maxlength");  
                        var length = text.length; 
                         
                        // send 
                        if (length <= maxLength + 1) { 
                         
        			        chat.send(text, name);	
        			        $(this).val("");
        			        
                        } else {
                        
        					$(this).val(text.substring(0, maxLength));
        					
        				}	
        				
        				
        			  }
                 });
                
        	});
        </script>
    
    </head>
    
    <body onload="setInterval('chat.update()', 1000)">
    
        <div id="page-wrap">
        
        
            
          <p id="name-area"></p>
            
            <div id="chat-wrap"><div id="chat-area"></div></div>
            
            <form id="send-message-area">
                <p>Your message: </p>
                <textarea id="sendie" maxlength = '100' ></textarea>
            </form><br /><br /><br />
        	
    		
    	<br />	<input type=button value="Back" onClick="history.go(-1)">
    
        </div>
    
    </body>


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •