Hiding an object

Hydrian · August 26, 2012

I have a chat room implemented with a login system. The Chat is written in Javascript and the loginsystem is written in PHP. I have echos if a user isnt logged in. I want to know how to make the chat not show if a user isnt logged in.

Here is the code that i want the chat to be hidden if not logged in

<?php
session_start();
include_once"config.php";
if(!isset($_SESSION['username']) || !isset($_SESSION['password'])){
         echo '<h4>You are not logged in. Please do so <a href="http://jays.netne.net/loginsystem/login.php">Login</a></h4>'; }


	else {
		echo "<h4>You are logged in </h4>";
	}
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head>
<meta name="google-site-verification" content="V-MlKGWPoAzJ_-vfEsEZFg92geK_hsIr53hVfcy8ydg" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>TestChat Page</title>
    
    <link rel="stylesheet" href="style.css" type="text/css" />
<link rel="stylesheet" href="ol.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 = <?php echo json_encode((string)$_SESSION['username']); ?>; 
        
        // default name is 'Username'
    	if (!name || name === ' ') {
    	   name = <?php echo json_encode((string)$_SESSION['username']); ?>; 	
    	}
    	
    	// strip tags
    	name = name.replace(/(<([^>]+)>)/ig,"");
    	
    	// display name on page
    	$("#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>

<meta name="Generator" content="Serif WebPlus X6 (14.0.0.020)">
<meta name="vieort" content="width=1000">
<link rel="icon" href="favicon.ico" type="image/x-icon">
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
<style type="text/css">
   body{ color:black; padding:20px; font-size:14px; background-color:#454545; font-family:Arial, Helvetica, sans-serif;}
   h2 {font-weight:bold; color:#000099; margin:10px 0px; }
   h4 {color:white;}
   p span {color:#006600; font-weight:bold; }
   a, a:link, a:visited {color:#white;}
   textarea {width: 100%; padding: 10px; margin: 10px 0 15px 0; font-size: 13px; font-family: Consolas,monospace;}
   textarea.html {height: 300px;}
   p {margin: 0 0 10px 0;}
   code, pre {font-family: Consolas,monospace; color: green;}
   ol li {margin: 0 0 15px 0;}
</style>
</head>
<body onload="setInterval('chat.update()', 500)">

<br><br><br>
<?php if ($userIsLoggedIn){ ?>
    <div id="page-wrap">
           
        <p id="name-area"></p>
        
        <div id="chat-wrap"><h4></h4><div id="chat-area"></div></div>
        
        <form id="send-message-area">
            <p><font size="5">Message: </font></p>
            <textarea id="sendie" maxlength = '225' ></textarea>
        </form>
    
    </div>
<?php } ?>
<br><br>
</body>
</html>

Christian F. · August 26, 2012

Code is always a benefit to post, without us having to ask for it first. Kind of like bringing your car to a shop to have it looked at is a benefit, if you want to have the mechanic figure out what's wrong with it.

Hydrian · August 26, 2012

sorry fixed it for you

Hydrian · August 26, 2012

Got it myself im a genius. Note i suck at php im happy

p3nguattack · August 26, 2012

you could redirect to the login page and set a variable there for www.login?notlogged=true.com in the event of a user not being logged in.

You could also just put that if statement above the content you want to hide and put the content as the else.

If you want I have a few functions made for sending information between pages so you don't have to use the $_GET approach every time you do a redirect. They use a session class and the $_SESSION itself, but it's a lot easier than writing that for everything you want to hide from unregistered users.

Christian F. · August 26, 2012

First of all, put the CSS and JS code in their own files, or at least as much of it as you can. Makes things a lot easier to read, and thus maintain.

So, move the following JS to the "chat.js" file.

// 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));
		}	
	}
});
});

Then this into a CSS file:

body {
color: black;
padding: 20px;
font-size: 14px;
background-color: #454545;
font-family: Arial, Helvetica, sans-serif;
}

h2 {
font-weight: bold;
color: #000099;
margin: 10px 0px;
}

h4 {
color: white;
}

p span {
color: #006600;
font-weight: bold;
}

a,a:link,a:visited {
color: #white;
}

textarea {
width: 100%;
padding: 10px;
margin: 10px 0 15px 0;
font-size: 13px;
font-family: Consolas, monospace;
}

textarea.html {
height: 300px;
}

p {
margin: 0 0 10px 0;
}

code,pre {
font-family: Consolas, monospace;
color: green;
}

ol li {
margin: 0 0 15px 0;
}

Then we have this line, which I seriously doubt is doing what you think it's doing. That is, unless you want the username to only consist of one or more ">".

name = name.replace (/(<([^>]+)>)/ig, "");

Then we have the PHP code, where you're already testing whether or not a user is logged in. However, you are echoing out HTML content above the doctype and way out of place. Save the strings inside a variable instead, and print it out later on where you actually want it.

Not to mention the fact that you shouldn't be storing the password in the session, username and/or user ID should be enough.

Which brings us to the next item on the list:

var name = <?php echo json_encode ((string) $_SESSION['username']); ?>;

Since you know this is a string, there is no point in JSON encoding it. Just escape it for HTML content, and then use quotes around the PHP code to treat it as an actual JS string.

This bit, however, is completely useless:

// default name is 'Username'
if (!name || name === ' ') {
name = <?php echo json_encode ((string) $_SESSION['username']); ?>; 	
}

What you're saying here is that if the code just above failed to give a username, then do exactly the same once more. It won't change anything, you know. The result will be exactly the same: No username.

Not to mention that the check should have been done with PHP instead, and the entire block quoted above be deleted.

Now we're moving onto your actual request, namely the not showing of the chat-area. As you can see from this code, you're clearly added a test for it:

<?php if ($userIsLoggedIn) { ?>

However, you've missed one crucial detail: You didn't give the variable any value. Something you should have done in the test at the top of the code. Set it to true if the user is logged in and false otherwise, and you've got what you wanted.

That said, I really think you should step back a bit and think things through, before you write any more code. It's clear that you don't quite grasp what you're doing, and is writing code more by accident than by intent. This is a sure-fire way to get overly complicated and buggy code, something which will cause you no end of trouble.

On the other hand, by carefully planning and understanding the steps needed beforehand, you'll notice that it will be a lot easier to actually write the code itself. Not only that, but it will also be a lot less bugs and problems with it.

Hydrian · August 26, 2012

I got it fixed.

Christian F. · August 26, 2012

Looking at your other thread: No, you did not. Checking if $_SESSION evaluates to true does not indicate whether or not a user is logged in, only whether or not the array contains any data.

You really need to read my post again, and fix your script. I made all of the comments I made for a reason, not to simply make things more difficult for you.

Sign In

Hiding an object

Recommended Posts

Hydrian

Link to comment

Share on other sites

Christian F.

Link to comment

Share on other sites

Hydrian

Link to comment

Share on other sites

Hydrian

Link to comment

Share on other sites

p3nguattack

Link to comment

Share on other sites

Christian F.

Link to comment

Share on other sites

Hydrian

Link to comment

Share on other sites

Christian F.

Link to comment

Share on other sites

Join the conversation

Browse

Activity

Important Information