Go Back   CodingForums.com > :: Client side development > JavaScript programming > JavaScript frameworks

Before you post, read our: Rules & Posting Guidelines

Reply
 
Thread Tools Rate Thread
Enjoy an ad free experience by logging in. Not a member yet? Register.
Old 04-05-2011, 04:22 PM   PM User | #1
Jenny Dithe
Regular Coder

 
Join Date: Sep 2010
Posts: 457
Thanks: 212
Thanked 1 Time in 1 Post
Jenny Dithe is on a distinguished road
JQuery and Javascript will only open one window at a time, require simultaneously

Hi,

I am trying to do an IM where there can be a maximum of 5 windows open simultaneously. However for some reason the script will only allow me to open one at a time. (If I then refresh the page I can open the next one, but it doesn't work without refreshing).

If you want to seethe problem, you can go to my site:
Website: eighty-sixdegrees.com
Then Sign in;
Username: guest@eighty-sixdegrees.com
Password: abcdefgh123456

Click on chat in the header menu then wait five seconds for the boxes to load. Ideally you should be able to click on one box and have IM window 1 open up and then click on another box and have IM window 2 open up. Currently IM window 2 stalls unless you refresh the page in which case you lose IM window one.

My codes are:
Mainpage:
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd"> 
<html>
<title>Chat</title>
<head>
<link rel="stylesheet" type="text/css" href="eightysixdegreesstyle.css" />

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function (){
	$('#submitchat1, #submitchat2, #submitchat3, #submitchat4, #submitchat5').live('click',function(){


				var btn = $(this).attr('id');
				var Frm;
				if(btn == 'submitchat1'){
				Frm = '#chatmessage1';
				} else if(btn == 'submitchat2'){
				Frm = '#chatmessage2';
				} else if(btn == 'submitchat3'){
				Frm = '#chatmessage3';
				} else if(btn == 'submitchat4'){
				Frm = '#chatmessage4';
				} else if(btn == 'submitchat5'){
				Frm = '#chatmessage5';
				} 

	var data = $(Frm).serialize();
	$.post ('insertChat.php',data, function(){
			$(Frm).each (function(){
				this.reset();
			});	
				return false;
		});
	});



	$('#maximizeChat1, #maximizeChat2, #maximizeChat3, #maximizeChat4, #maximizeChat5').live('click',function(){
				var btn = $(this).attr('id');
				var Display;
				if(btn == 'maximizeChat1'){
				Display = '#ChatDisplayOne';
				} else if(btn == 'maximizeChat2'){
				Display = '#ChatDisplayTwo';
				} else if(btn == 'maximizeChat3'){
				Display = '#ChatDisplayThree';
				} else if(btn == 'maximizeChat4'){
				Display = '#ChatDisplayFour';
				} else if(btn == 'maximizeChat5'){
				Display = '#ChatDisplayFive';
				} 
		$(Display).slideToggle("slow");
	});
});
</script>


<style type="text/css"> 
/*<![CDATA[*/
#chat1
	{
	display:none;
	}
 
#chat2
	{
	display:none;
	}
 
#chat3
	{
	display:none;
	}
 
#chat4
	{
	display:none;
	}
 
#chat5
	{
	display:none;
	}
/*]]>*/
</style>

<script type="text/javascript">
function loadChat(File,ID,Msg,TID,Cile){
loadChatComplex(File,ID,Msg);
delay = setTimeout(function(){loadChatRefresh(Cile,TID,Msg)},5000);
}
</script>

<script type="text/javascript">
function OpenChat(File,LID,Msg,Dsg,Sile,SID,Wile,WID,Wsg){
document.getElementById(LID).style.display="block";
loadChatComplex('getUpdateNew.php','txtHingNoNew',Dsg);
breath = setTimeout(function(){loadChatComplex(File,LID,Msg)},1000);
	lalker = setTimeout(function(){loadChatComplex(Sile,SID,Wsg)},2000)
	talker = setTimeout(function(){loadChatRefresh(Wile,WID,Wsg)},3000);

}
</script>


<script type="text/javascript">
function loadChatCheck(File,ID,Tile,TID){
loadQuickCheck(File,ID);
	 dodo = setTimeout(function(){loadQuickMessageCheck(Tile,TID)},3000);
}
</script>
<script type="text/javascript"> 
function closeChat(ID,File,LID,Msg){
loadChatComplex(File,LID,Msg);
document.getElementById(ID).style.display="none";
}
</script>



<script type="text/javascript">
function loadChatComplex(File,ID,Msg){
if (window.XMLHttpRequest)  {
  xmlhttp=new XMLHttpRequest();
  }
else {
	try{
  xmlhttp=new ActiveXObject("Msxml2.XMLHTTP");
  } catch (e) {
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }	
}

xmlhttp.onreadystatechange=function(){
  if (xmlhttp.readyState==4 && xmlhttp.status==200){
    document.getElementById(ID).innerHTML=xmlhttp.responseText;
    }
  }

var params=Msg;
xmlhttp.open("POST",File,true);

xmlhttp.setRequestHeader("Pragma", "Cache-Control:no-cache");
xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xmlhttp.setRequestHeader("Content-length", params.length);
xmlhttp.setRequestHeader("Connection", "close");
xmlhttp.send(params);
}
</script>


<script type="text/javascript">
function loadChatRefresh(File,ID,Msg){
if (window.XMLHttpRequest)  {
  xmlhttp=new XMLHttpRequest();
  }
else {
	try{
  xmlhttp=new ActiveXObject("Msxml2.XMLHTTP");
  } catch (e) {
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }	
}

xmlhttp.onreadystatechange=function(){
  if (xmlhttp.readyState==4 && xmlhttp.status==200){
    document.getElementById(ID).innerHTML=xmlhttp.responseText;
	 ticker = setInterval(function(){loadChatRefresh(File,ID,Msg)},3000);
    }
  }

var params=Msg;
xmlhttp.open("POST",File,true);

xmlhttp.setRequestHeader("Pragma", "Cache-Control:no-cache");
xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xmlhttp.setRequestHeader("Content-length", params.length);
xmlhttp.setRequestHeader("Connection", "close");
xmlhttp.send(params);
}
</script>

<script type="text/javascript">
function loadChatBasic(File,ID){
if (window.XMLHttpRequest)  {
  xmlhttp=new XMLHttpRequest();
  }
else {
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }

xmlhttp.onreadystatechange=function(){
  if (xmlhttp.readyState==4 && xmlhttp.status==200){
    document.getElementById(ID).innerHTML=xmlhttp.responseText;
    }
  }

xmlhttp.open("POST",File,true);
xmlhttp.send();
}
</script>


<script type="text/javascript">
function loadQuickCheck(File,ID){
if (window.XMLHttpRequest)  {
  xmlhttp=new XMLHttpRequest();
  }
else {
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }

xmlhttp.onreadystatechange=function(){
  if (xmlhttp.readyState==4 && xmlhttp.status==200){
    document.getElementById(ID).innerHTML=xmlhttp.responseText;
	 malaky = setInterval(function(){loadQuickCheck(File,ID)},5000);
    }
  }

xmlhttp.open("POST",File,true);
xmlhttp.send();
}
</script>

<script type="text/javascript">
function loadQuickMessageCheck(File,ID){
if (window.XMLHttpRequest)  {
  xmlhttp=new XMLHttpRequest();
  }
else {
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }

xmlhttp.onreadystatechange=function(){
  if (xmlhttp.readyState==4 && xmlhttp.status==200){
    document.getElementById(ID).innerHTML=xmlhttp.responseText;
	 whistle = setInterval(function(){loadQuickCheck(File,ID)},5000);
    }
  }

xmlhttp.open("POST",File,true);
xmlhttp.send();
}
</script>
</head>

<body onload="loadChatCheck('getCheckNewMessages.php','txtHintCheckNewMessage','getFriendsOnline.php','txtHintShowFriends')">
<div class="mainpage">


	<table border="0" width="100%">
	<tr>
	<td>
		<h1>Thanks</h1>
		<?php echo "Hi " . $Sfname;?>
	<br />
	</td>
	<td>
		<div class="right">
			<input type="text" name="search" class="input"
			value="search" size="40" onclick="clearMe(this)" onkeyup="ShowHint(this)">
	<br />
			<div id="txtMainSearchHint"></div>
		</div>
	</td>
	</tr>
	</table> 
	<hr />
	<br />
	<br />
<div>
<div class="pageleft">
	
<p>Friends Online:</p>
<br /></br />
	<div id="txtHintShowFriends"></div>
	<div id="txtHintEndChat"></div>
	<div id="txtHintCheckNewMessage"></div>
	<div id="txtHingNoNew"></div>

<br /><br />

<div class="chat1" id="chat1"></div>
<div class="chat2" id="chat2"></div>
<div class="chat3" id="chat3"></div>
<div class="chat4" id="chat4"></div>
<div class="chat5" id="chat5"></div>
<br />
<br />
</div>
<div class="pageright">
<?php include("SideBar.php"); ?>
</div>
</div>
<div class="clear"></div>
<br />
<br />
<?php include("footer.php"); ?>

</div>
For the boxes:
PHP Code:
<?php
session_start
();

    if (!(isset(
$_SESSION['login']) && $_SESSION['login'] !='')){
        
header ("Location: Welcome.php");
        }
$SMyPId=$_SESSION['MyPId'];

include(
"dbconnect.php");
            
$result mysql_query("SELECT *, signedin.PId as SIPId FROM signedin INNER JOIN friends
            ON signedin.PId=friends.invited OR signedin.PId=friends.invitee
            WHERE ((friends.invitee={$SMyPId} AND friends.statae='accepted') OR (friends.invited={$SMyPId} AND friends.statae='accepted')) 
            AND signedin.LogOff IS NULL AND signedin.PId !={$SMyPId}"
);

            while(
$row mysql_fetch_array($result)){
                
$mugwort$mugwort ';' $row['SIPId'];
                }

$motherwort=explode(';',$mugwort);
foreach (
$motherwort as $mulberry){

            
$result mysql_query("SELECT COUNT(*) as divonecount FROM chat 
            WHERE chatter='{$SMyPId}' AND chatterspace='chat1' AND EndDate IS NULL"
);
            
            
$row mysql_fetch_assoc($result);    
                
$divonecount=$row['divonecount'];

            
$result mysql_query("SELECT COUNT(*) AS divtwocount FROM chat 
            WHERE chatter='{$SMyPId}' AND chatterspace='chat2' AND EndDate IS NULL"
);
            
            
$row mysql_fetch_assoc($result);    
                
$divtwocount=$row['divtwocount'];


            
$result mysql_query("SELECT COUNT(*) AS divthreecount FROM chat 
            WHERE chatter='{$SMyPId}' AND chatterspace='chat3' AND EndDate IS NULL"
);
            
            
$row mysql_fetch_assoc($result);    
                
$divthreecount=$row['divthreecount'];

            
$result mysql_query("SELECT COUNT(*) AS divfourcount FROM chat 
            WHERE chatter='{$SMyPId}' AND chatterspace='chat4' AND EndDate IS NULL"
);
            
            
$row mysql_fetch_assoc($result);    
                
$divfourcount=$row['divfourcount'];


            
$result mysql_query("SELECT COUNT(*) AS divfivecount FROM chat 
            WHERE chatter='{$SMyPId}' AND chatterspace='chat5' AND EndDate IS NULL"
);
            
            
$row mysql_fetch_assoc($result);    
                
$divfivecount=$row['divfivecount'];


                    if(
$divonecount=='0'){
                        
$showchat='chat1';
                    } elseif (
$divtwocount=='0'){
                        
$showchat='chat2';
                    } elseif (
$divthreecount=='0'){
                        
$showchat='chat3';
                    } elseif (
$divfourcount=='0'){
                        
$showchat='chat4';
                    } elseif (
$divfivecount=='0'){
                        
$showchat='chat5';
                    } 

            if(
$showchat=='chat1'){
                
$result mysql_query("SELECT * FROM allusers
                WHERE PId='{$mulberry}'"
);

                while(
$row mysql_fetch_array($result)){
                
$nosegay=rand(). rand(). rand(). rand(). rand();
                
$nightshade="{$SMyPId};{$mulberry};{$row['fullname']};{$nosegay}";
                echo 
'<div class="img"><img src="thumbs/' $row['pphoto'] . '" width="20%" onclick="OpenChat(\'chatheader1.php\',\'chat1\',\'chat=' $nightshade '\',\'ChatID=0\',\'getDisplayChat.php\',\'ChatDisplayOne\',\'getThisChat1.php\',\'displaytalk\',\'artemis=' $nightshade '\')" >
                <div class="desc">' 
$row['fullname'] . '</div></div>';
                }
            }elseif(
$showchat=='chat2'){
                
$result mysql_query("SELECT * FROM allusers
                WHERE PId='{$mulberry}'"
);

                while(
$row mysql_fetch_array($result)){
                
$nosegay=rand(). rand(). rand(). rand(). rand();
                
$nightshade="{$SMyPId};{$mulberry};{$row['fullname']};{$nosegay}";
                echo 
'<div class="img"><img src="thumbs/' $row['pphoto'] . '" width="20%" onclick="OpenChat(\'chatheader2.php\',\'chat2\',\'chat=' $nightshade '\',\'ChatID=0\',\'getDisplayChat2.php\',\'ChatDisplayTwo\',\'getThisChat2.php\',\'displaytalkTwo\',\'artemis=' $nightshade '\')" ;>
                <div class="desc">' 
$row['fullname'] . '</div></div>';
                }
            }elseif(
$showchat=='chat3'){
                
$result mysql_query("SELECT * FROM allusers
                WHERE PId='{$mulberry}'"
);

                while(
$row mysql_fetch_array($result)){
                
$nosegay=rand(). rand(). rand(). rand(). rand();
                
$nightshade="{$SMyPId};{$mulberry};{$row['fullname']};{$nosegay}";
                echo 
'<div class="img"><img src="thumbs/' $row['pphoto'] . '" width="20%" onclick="OpenChat(\'chatheader3.php\',\'chat3\',\'chat=' $nightshade '\',\'ChatID=0\',\'getDisplayChat3.php\',\'ChatDisplayThree\',\'getThisChat3.php\',\'displaytalkThree\',\'artemis=' $nightshade '\')" ;>
                <div class="desc">' 
$row['fullname'] . '</div></div>';
                }
            }elseif(
$showchat=='chat4'){
                
$result mysql_query("SELECT * FROM allusers
                WHERE PId='{$mulberry}'"
);

                while(
$row mysql_fetch_array($result)){
                
$nosegay=rand(). rand(). rand(). rand(). rand();
                
$nightshade="{$SMyPId};{$mulberry};{$row['fullname']};{$nosegay}";
                echo 
'<div class="img"><img src="thumbs/' $row['pphoto'] . '" width="20%" onclick="OpenChat(\'chatheader4.php\',\'chat4\',\'chat=' $nightshade '\',\'ChatID=0\',\'getDisplayChat4.php\',\'ChatDisplayFour\',\'getThisChat4.php\',\'displaytalkFour\',\'artemis=' $nightshade '\')" ;>
                <div class="desc">' 
$row['fullname'] . '</div></div>';
                }
            }elseif(
$showchat=='chat5'){
                
$result mysql_query("SELECT * FROM allusers
                WHERE PId='{$mulberry}'"
);

                while(
$row mysql_fetch_array($result)){
                
$nosegay=rand(). rand(). rand(). rand(). rand();
                
$nightshade="{$SMyPId};{$mulberry};{$row['fullname']};{$nosegay}";
                echo 
'<div class="img"><img src="thumbs/' $row['pphoto'] . '" width="20%" onclick="OpenChat(\'chatheader5.php\',\'chat5\',\'chat=' $nightshade '\',\'ChatID=0\',\'getDisplayChat5.php\',\'ChatDisplayFive\',\'getThisChat5.php\',\'displaytalkFive\',\'artemis=' $nightshade '\')" ;>
                <div class="desc">' 
$row['fullname'] . '</div></div>';
                }
            }else{
                
$result mysql_query("SELECT * FROM allusers
                WHERE PId='{$mulberry}'"
);

                while(
$row mysql_fetch_array($result)){
                
$nosegay=rand(). rand(). rand(). rand(). rand();
                
$nightshade="{$SMyPId};{$mulberry};{$row['fullname']};{$nosegay}";
                echo 
'<div class="img"><img src="thumbs/' $row['pphoto'] . '" width="20%" onclick="alert(\'You have reached your IM capacity, please close a chat box\')" ;>
                <div class="desc">' 
$row['fullname'] . '</div></div>';
                }
            }


}


            echo 
'<br /><div class="clear"></div><br /><br />';

    
mysql_close($con);
?>
I'm just trying to get it running on this page. Once it is running I will incorporate it into all my pages.
Jenny Dithe is offline   Reply With Quote
Old 04-06-2011, 02:46 PM   PM User | #2
Jenny Dithe
Regular Coder

 
Join Date: Sep 2010
Posts: 457
Thanks: 212
Thanked 1 Time in 1 Post
Jenny Dithe is on a distinguished road
A little more info sometimes I get the error message:
Quote:
Webpage error details

User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1; Win64; x64; Trident/4.0; .NET CLR 2.0.50727; SLCC2; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; .NET4.0C; InfoPath.3)
Timestamp: Wed, 6 Apr 2011 13:43:13 UTC


Message: 'document.getElementById(...)' is null or not an object
Line: 137
Char: 5
Code: 0
URI: http://www.eighty-sixdegrees.com/testchat.php
This is for box two, if box one is in use. If box one is not in use box two shows fine.

But as I said I only get this error message sometimes and box two never shows. If I don't get the error message then the function OpenChat proceeds to this stage

Code:
<script type="text/javascript">
function OpenChat(File,LID,Msg,Dsg,Sile,SID,Wile,WID,Wsg){
document.getElementById(LID).style.display="block";
loadChatComplex('getUpdateNew.php','txtHingNoNew',Dsg);
breath = setTimeout(function(){loadChatComplex(File,LID,Msg)},1000);
but doesn't complete the below
Code:
	lalker = setTimeout(function(){loadChatComplex(Sile,SID,Wsg)},2000)
	talker = setTimeout(function(){loadChatRefresh(Wile,WID,Wsg)},3000);

}
</script>
For the second chat box only if the first chat box is in use.

Edit: Ok I worked out why it was jarring in one place I missed out a semi colon here:
Code:
breath = setTimeout(function(){loadChatComplex(File,LID,Msg)},1000);
	lalker = setTimeout(function(){loadChatComplex(Sile,SID,Wsg)},2000)//here
	talker = setTimeout(function(){loadChatRefresh(Wile,WID,Wsg)},3000);
So I am now getting the error that Element is not an object - for the second box however it still loads the
Code:
breath = setTimeout(function(){loadChatComplex(File,LID,Msg)},1000);
???

The ID called exists and as the page loads before the onclick event the ID should already be loaded. I think.

Last edited by Jenny Dithe; 04-07-2011 at 04:06 PM..
Jenny Dithe is offline   Reply With Quote
Old 04-07-2011, 08:35 PM   PM User | #3
Jenny Dithe
Regular Coder

 
Join Date: Sep 2010
Posts: 457
Thanks: 212
Thanked 1 Time in 1 Post
Jenny Dithe is on a distinguished road
OK I've moved along with identifying the issue and have started a new thread pin pointing the exact issue.

If there is a mod reading this then this thread can now be closed/deleted.
Jenny Dithe is offline   Reply With Quote
Reply

Bookmarks

Jump To Top of Thread


Thread Tools
Rate This Thread
Rate This Thread:

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT +1. The time now is 06:20 AM.


Advertisement
Log in to turn off these ads.