Log in

View Full Version : Page keeps on crashing the browser


tech_support
10-19-2006, 07:30 AM
Hi,

I have this page that constantly crashes IE, FF and the computer.



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>

<head>
<link rel="stylesheet" type="text/css" href="tabcontent.css" />

<script type="text/javascript" src="tabcontent.js">

/***********************************************
* Tab Content script- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/

</script>
<link rel="stylesheet" href="dhtmlgoodies_calendar.css" media="screen" /><link /><link></link>
<script language="JavaScript" src="dhtmlgoodies_calendar.js"></script>

<meta http-equiv="Content-Language" content="en-au" />

<meta http-equiv="Content-Type" content="text/html; charset=windows-1252" />
<title>Calendar</title>
<style>
body {

font-family:Verdana;
font-size:10pt;

}
p {

font-family:Verdana;
font-size:10pt;
}

.butt {

font-family:Verdana;
font-size:8pt;
}

td {

font-family:Verdana;
font-size:10pt;
}
</style>
<script>
function changeDate() {

var selectedDate = document.forms['booking'].elements['date'].value
if (selectedDate == "") {

alert("Please select a date before continuing.");
return false;
}
else {
window.location = "calendar.php?date="+selectedDate;
}
}

function toggle(element,mode) {

el = document.getElementById(element)
el.style.display = mode
}

setTimeout("toggle('main','block');toggle('load','none')",3000);
</script>

</head>

<body onload="">
<div id="load" style="font-family:Verdana, Arial, Helvetica, sans-serif;">
<p>Loading...</p>
<p>(This may take a while because of the server load and simultanious proccesses at once) </p>
</div>
<div id="main" style="display:none">
<div align="left"><form action="calendar.php" name="booking" method="GET">

<p>Date: <input type="text" name="date" size="20" class="butt" readonly="" />
<input type="button" value="Select Date" name="sDate" class="butt" onclick="displayCalendar(document.forms[0].elements['date'],'dd.mm.yyyy',this)" /><font></font>
<input type="button" value="Change" name="change" class="butt" onclick="changeDate();" /></p></form><p></p>
</div>
<?php

$msgFree = "Free."; //Message when 'free'
$thisDate = $_GET['date']; //date stamp
$date = $_POST['date'];

echo "<p align='center'><font size='5'>Bookings for ".$thisDate.'</font></p>';
?>
<br />
<p><br />

</p>
<script>
function writeData(data) {

var savedData = data;
return savedData;

}
</script>
<SCRIPT LANGUAGE="JavaScript">
function replaceChars(entry) {
out = "'"; // replace this
add = ""; // with this
temp = "" + entry; // temporary holder

while (temp.indexOf(out)>-1) {
pos= temp.indexOf(out);
temp = "" + (temp.substring(0, pos) + add +
temp.substring((pos + out.length), temp.length));
}
return temp;
}
</script>
<script language="javascript" type="text/javascript">
<!--
function ajaxFunction(period,room,spanId) {

setInterval("getBookingData('"+period+"','"+room+"','"+spanId+"')",100)

}//Browser Support Code
function getBookingData(period,room,spanId){
var ajaxRequest; // The variable that makes Ajax possible!

try{
// Opera 8.0+, Firefox, Safari
ajaxRequest = new XMLHttpRequest();
} catch (e){
// Internet Explorer Browsers
try{
ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try{
ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e){
// Something went wrong
alert("Error calling Ajax Function. Please make sure you are using a XML complaint browser.")
return false;
}
}
}
// Create a function that will receive data sent from the server
ajaxRequest.onreadystatechange = function(){
if(ajaxRequest.readyState == 4){
var divSend = document.getElementById(spanId)
divSend.innerHTML = ajaxRequest.responseText;
}
}
var getDate = "<?php echo $_GET['date']; ?>"

var sendData = "?date="+getDate+"&period="+period+"&room="+room
// alert(sendData);
ajaxRequest.open("GET", "calendarProcess.php" + sendData, true);
ajaxRequest.send(null);
}
//-->
</script>
<ul id="maintab" class="shadetabs">
<li class="selected"><a href="#" rel="tcontent1">Period 1</a></li>
<li><a href="#" rel="tcontent2">Period 2</a></li>
<li><a href="#" rel="tcontent3">Period 3</a></li>
<li><a href="#" rel="tcontent4">Period 4</a></li>
<li><a href="#" rel="tcontent5">Period 5</a></li>
<li><a href="#" rel="tcontent6">Period 6</a></li>
</ul>

<div class="tabcontentstyle">

<div id="tcontent1" class="tabcontent">
<span id="pd1_C1"></span><br />
<span id="pd1_C2"></span><br />
<span id="pd1_C3"></span><br />
<span id="pd1_C4"></span><br />
<span id="pd1_Lv1"></span><br />
<span id="pd1_Lv3"></span><br />
<span id="pd1_LibPC"></span><br />
<span id="pd1_SeniorStudy"></span><br />

<script>
ajaxFunction('1','C1','pd1_C1')
ajaxFunction('1','C2','pd1_C2')
ajaxFunction('1','C3','pd1_C3')
ajaxFunction('1','C4','pd1_C4')
ajaxFunction('1','Lv1','pd1_Lv1')
ajaxFunction('1','Lv3','pd1_Lv3')
ajaxFunction('1','LibPC','pd1_LibPC')
ajaxFunction('1','SeniorStudy','pd1_SeniorStudy')
</script>
</div>

<div id="tcontent2" class="tabcontent">
<span id="pd2_C1"></span><br />
<span id="pd2_C2"></span><br />
<span id="pd2_C3"></span><br />
<span id="pd2_C4"></span><br />
<span id="pd2_Lv1"></span><br />
<span id="pd2_Lv3"></span><br />
<span id="pd2_LibPC"></span><br />
<span id="pd2_SeniorStudy"></span><br />

<script>
ajaxFunction('2','C1','pd2_C1')
ajaxFunction('2','C2','pd2_C2')
ajaxFunction('2','C3','pd2_C3')
ajaxFunction('2','C4','pd2_C4')
ajaxFunction('2','Lv1','pd2_Lv1')
ajaxFunction('2','Lv3','pd2_Lv3')
ajaxFunction('2','LibPC','pd2_LibPC')
ajaxFunction('2','SeniorStudy','pd2_SeniorStudy')
</script>
</div>

<div id="tcontent3" class="tabcontent">
<span id="pd3_C1"></span><br />
<span id="pd3_C2"></span><br />
<span id="pd3_C3"></span><br />
<span id="pd3_C4"></span><br />
<span id="pd3_Lv1"></span><br />
<span id="pd3_Lv3"></span><br />
<span id="pd3_LibPC"></span><br />
<span id="pd3_SeniorStudy"></span><br />

<script>
ajaxFunction('3','C1','pd3_C1')
ajaxFunction('3','C2','pd3_C2')
ajaxFunction('3','C3','pd3_C3')
ajaxFunction('3','C4','pd3_C4')
ajaxFunction('3','Lv1','pd3_Lv1')
ajaxFunction('3','Lv3','pd3_Lv3')
ajaxFunction('3','LibPC','pd3_LibPC')
ajaxFunction('3','SeniorStudy','pd3_SeniorStudy')
</script>
</div>

<div id="tcontent4" class="tabcontent">
<span id="pd4_C1"></span><br />
<span id="pd4_C2"></span><br />
<span id="pd4_C3"></span><br />
<span id="pd4_C4"></span><br />
<span id="pd4_Lv1"></span><br />
<span id="pd4_Lv3"></span><br />
<span id="pd4_LibPC"></span><br />
<span id="pd4_SeniorStudy"></span><br />

<script>
ajaxFunction('4','C1','pd4_C1')
ajaxFunction('4','C2','pd4_C2')
ajaxFunction('4','C3','pd4_C3')
ajaxFunction('4','C4','pd4_C4')
ajaxFunction('4','Lv1','pd4_Lv1')
ajaxFunction('4','Lv3','pd4_Lv3')
ajaxFunction('4','LibPC','pd4_LibPC')
ajaxFunction('4','SeniorStudy','pd4_SeniorStudy')
</script>
<form></form>
</div>
<div id="tcontent5" class="tabcontent">
<span id="pd5_C1"></span><br />
<span id="pd5_C2"></span><br />
<span id="pd5_C3"></span><br />
<span id="pd5_C4"></span><br />
<span id="pd5_Lv1"></span><br />
<span id="pd5_Lv3"></span><br />
<span id="pd5_LibPC"></span><br />
<span id="pd5_SeniorStudy"></span><br />

<script>
ajaxFunction('5','C1','pd5_C1')
ajaxFunction('5','C2','pd5_C2')
ajaxFunction('5','C3','pd5_C3')
ajaxFunction('5','C4','pd5_C4')
ajaxFunction('5','Lv1','pd5_Lv1')
ajaxFunction('5','Lv3','pd5_Lv3')
ajaxFunction('5','LibPC','pd5_LibPC')
ajaxFunction('5','SeniorStudy','pd5_SeniorStudy')
</script>
</div>
<div id="tcontent6" class="tabcontent">
<span id="pd6_C1"></span><br />
<span id="pd6_C2"></span><br />
<span id="pd6_C3"></span><br />
<span id="pd6_C4"></span><br />
<span id="pd6_Lv1"></span><br />
<span id="pd6_Lv3"></span><br />
<span id="pd6_LibPC"></span><br />
<span id="pd6_SeniorStudy"></span><br />

<script>
ajaxFunction('6','C1','pd6_C1')
ajaxFunction('6','C2','pd6_C2')
ajaxFunction('6','C3','pd6_C3')
ajaxFunction('6','C4','pd6_C4')
ajaxFunction('6','Lv1','pd6_Lv1')
ajaxFunction('6','Lv3','pd6_Lv3')
ajaxFunction('6','LibPC','pd6_LibPC')
ajaxFunction('6','SeniorStudy','pd6_SeniorStudy')
</script>
</div>
</div>

<script type="text/javascript">
//Start Tab Content script for UL with id="maintab" Separate multiple ids each with a comma.
initializetabcontent("maintab")
</script>

C1 : Computer Room <br />
C2 : Conference/Video Room <br />
C3 : Small Groups Room <br />
C4 : Audio/Visual Room <br />
Lv1: Level 1 - Library <br />
LibPC : Library PC's <br />
Lv3 : Level 3 - Library <br />
SeniorStudy : Senior Study Area <br />
</div>
</body>

</html>


Don't know why. Maybe you guys can help me out. I think it's because of the ajax...

Thanks,

Peter
tech_support
10-19-2006, 07:32 AM
I noticed that FireFox was running on 300MB memory usage as well when the page was running.
djr33
10-19-2006, 07:37 AM
The 300MB is a pretty clear indication that that is a memory overload.
Not sure why, though.
Twey
10-19-2006, 07:24 PM
Take bits off until it no longer crashes. When you get to that point, the bit you just removed was the culprit :)
tech_support
10-20-2006, 06:45 AM
Can anyone guess what it is? I really don't have the time.
blm126
10-20-2006, 08:11 PM
Well, lets see it polls a server every 1/10 of a second. What do you expect to happen?
tech_support
10-20-2006, 11:21 PM
So do I need to have a dedicated server running?
tech_support
10-20-2006, 11:51 PM
Here's my PHP page:



<?php

$thisDate = $_GET['date']; //date stamp
$period = $_GET['period']; //period
$room = $_GET['room']; //room
$folderloc = "data//"; //data folder
$msgFree = $room." is free.";

$editLink = "editBooking.php?session=1&date=".$dateChosen."&period=".$periodChosen."&comment=".$comments."room=".$room;
$bookLink = "express.php?session=1&date=".$thisDate."&period=".$period."&room=".$room;

$optionsEdit = " <font face='Verdana' size='1'>"."Options: "."<a href='".$editLink."'>Edit</a>";
$optionsBook = " <font face='Verdana' size='1'>"."Options: "."<a href='".$bookLink."'>Book</a>";

$bookingData = "data//booking_".$thisDate."_".$period."_".$room.".txt"; //file name


if (@$fh = fopen($bookingData, 'r')) {

$fh = fopen($bookingData, 'r');
$theData = fread($fh, filesize($bookingData));
echo $theData;
echo $optionsEdit;
fclose($fh);
return false;
}

else {

echo $msgFree;
echo $optionsBook;
return false;

}
?>
the-disturbed
10-21-2006, 12:17 AM
Well, lets see it polls a server every 1/10 of a second. What do you expect to happen?

LMAO that'll do it
blm126
10-21-2006, 02:30 AM
This script is harmful to the server(if too many people connect at once), and to the user. As such, I wouldn't recommend using it.
tech_support
10-21-2006, 02:45 AM
Ah ok. Then I might as well just re-design the whole page. Should I use Ajax?
boxxertrumps
10-22-2006, 03:09 PM
you shouldnt need to redisign the whole page, just reduce the time from 10/second to about 5 seconds between each poll. that should solve your problem.
tech_support
10-23-2006, 07:08 AM
Lowering?
Twey
10-23-2006, 11:32 AM
Yes, you need to increase it. Considerably. Ideally, no two requests should be sent within ten seconds of each other.
tech_support
10-24-2006, 05:23 AM
O Well, I just ended up redesigning the whole page. Took of the ajax.