Very simple question. Hopefully ha:P

butsags · October 21, 2009

Hey guys so i have a top menu in js and a calendar in js and for some reason they wont both work at the same time. if i have the calendar and top menu, only the calendar loads but when i take the calendar out, the top menu will work.

prob because they both use the same calling functions somewhere?

so i was thinking maybe since the javascript for the top menu comes before the calendar, maybe we could divide them in some way?

ive already separated it so that the calendar script refs and etc come after the top menu ends and the js references for the top menu are in the header.

heres my script :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta name="keywords" content="" />
<meta name="description" content="" />
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>p2 - PI Squared</title>
<link href="style.css" rel="stylesheet" type="text/css" media="screen" />
<script type="text/javascript" src="js/jquery-1.1.3.1.min.js"></script>
<script type="text/javascript" src="js/jquery.easing.min.js"></script>
<script type="text/javascript" src="js/jquery.lavalamp.min.js"></script>
<script type="text/javascript">
        $(function() {
            $("#1, #2, #3").lavaLamp({
                fx: "backout", 
                speed: 700,
                click: function(event, menuItem) {
                    return true;
                }
            });
        });
</script>

</head>
<body>
<div id="wrapper">
<div id="header">
	<div id="logo" width="100%">
		<h1><a href="index.php"><img src="images/logo.png" border="0" style="position:relative; bottom:20px;" /></a></h1>
		<img src="images/squarelogo.png" align="right" style="position:relative; bottom:0px; left:50px;" />
	</div>
</div>
<!-- end #header -->
<div>
      <ul class="topmenu" id="1">
        <li><a href="index.php">Home</a></li>
        <li><a href="links.php">Links</a></li>
        <li class="current"><a href="contact.php"><font color="#3399FF">Contact</font></a></li>
      </ul>
</div>
<!-- end #menu -->
<div id="page">
<div id="page-bgtop">
<div id="page-bgbtm">
	<div id="content">
		<div class="post">
			<h2 class="title"><a>Calendar</a></h2>
			<div style="clear: both;"> </div>
			<div class="entry">
<script src="js/lib/prototype.js" type="text/javascript"></script>
<script src="js/src/scriptaculous.js" type="text/javascript"></script>
<script type="text/javascript">
function highlightCalendarCell(element) {
	$(element).style.border = '1px solid #999999';
}

function resetCalendarCell(element) {
	$(element).style.border = '1px solid #000000';
}

function startCalendar(month, year) {
	new Ajax.Updater('calendarInternal', 'rpc.php', {method: 'post', postBody: 'action=startCalendar&month='+month+'&year='+year+''});
}

function showEventForm(day) {
	$('evtDay').value = day;
	$('evtMonth').value = $F('ccMonth');
	$('evtYear').value = $F('ccYear');

	displayEvents(day, $F('ccMonth'), $F('ccYear'));

	if(Element.visible('addEventForm')) {
		// do nothing.
	} else {
		Element.show('addEventForm');
	}
}

function displayEvents(day, month, year) {
	new Ajax.Updater('eventList', 'rpc.php', {method: 'post', postBody: 'action=listEvents&&d='+day+'&m='+month+'&y='+year+''});
	if(Element.visible('eventList')) {
		// do nothing, its already visble.
	} else {
		setTimeout("Element.show('eventList')", 300);
	}
}

function addEvent(day, month, year, body) {
	if(day && month && year && body) {
		// alert('Add Event\nDay: '+day+'\nMonth: '+month+'\nYear: '+year+'\nBody: '+body);
		new Ajax.Request('rpc.php', {method: 'post', postBody: 'action=addEvent&d='+day+'&m='+month+'&y='+year+'&body='+body+'', onSuccess: highlightEvent(day)});
		$('evtBody').value = '';
	} else {
		alert('There was an unexpected script error.\nPlease ensure that you have not altered parts of it.');
	}

	// highlightEvent(day);
} // addEvent.

function highlightEvent(day) {
	Element.hide('addEventForm');
	$('calendarDay_'+day+'').style.background = '#<?= $eventColor ?>';
}

function showLoginBox() {
	Element.show('loginBox');
}

function showCP() {
	Element.show('cpBox');
}

function deleteEvent(eid) {
	confirmation = confirm('Are you sure you wish to delete this event?\n\nOnce the event is deleted, it is gone forever!');
	if(confirmation == true) {
		new Ajax.Request('rpc.php', {method: 'post', postBody: 'action=deleteEvent&eid='+eid+'', onSuccess: Element.hide('event_'+eid+'')});
	} else {
		// Do not delete it!.
	}
}
</script>
			<div id="calendar" class="calendarBox">
	<div id="calendarInternal">
		 
	</div>
	<br style="clear: both;">
	<span id="LoginMessageBox" style="color: red; margin-top: 10px;"><?= $loginMsg; ?></span>
	<div id="eventList" style="display: none;"></div>
	<div style="display: none; margin-top: 10px;" id="addEventForm">
		<b>Add Event</b>
		<br>
		Date: <input type="text" size="2" id="evtDay" disabled> <input type="text" size="2" id="evtMonth" disabled> <input type="text" size="4" id="evtYear" disabled>
		<br>
		<textarea id="evtBody" cols="32" rows="5"></textarea>
		<br>
		<input type="button" value="Add Event" onClick="addEvent($F('evtDay'), $F('evtMonth'), $F('evtYear'), $F('evtBody'));">
		<a href="#" onClick="Element.hide('addEventForm');">Close</a>
	</div>

	<div style="display: none; margin-top: 10px;" id="loginBox">
		<b>Login</b>
		<br>
		<form action="calendar.php" method="post">
			Username: <input type="text" name="username" size="20">
			<br>
			Password: <input type="password" name="password" size="20">
			<br>
			<input type="hidden" name="action" value="login">
			<input type="submit" value="Login">
			<a href="#" onClick="Element.hide('loginBox');">Close</a>
		</form>
	</div>

	<div style="display: none; margin-top: 10px;" id="cpBox">
		<b>Control Panel</b> <a href="#" onClick="Element.hide('cpBox');">Close</a>
		<br><br>
		<b>Change the colours</b>
		<br>
		<form action="calendar.php" method="post">
			Day Colour: <input type="text" name="dayColor" size="6" maxlength="6" value="<?= $dayColor; ?>">
			<br>
			Weekend Colour: <input type="text" name="weekendColor" size="6" maxlength="6" value="<?= $weekendColor; ?>">
			<br>
			Today Colour: <input type="text" name="todayColor" size="6" maxlength="6" value="<?= $todayColor; ?>">
			<br>
			Event Colour: <input type="text" name="eventColor" size="6" maxlength="6" value="<?= $eventColor; ?>">
			<br>
			Iterator 1 Colour: <input type="text" name="iteratorColor1" size="6" maxlength="6" value="<?= $iteratorColor2; ?>">
			<br>
			Iterator 2 Colour: <input type="text" name="iteratorColor2" size="6" maxlength="6" value="<?= $iteratorColor1; ?>">
			<br>
			<input type="hidden" name="action" value="updateColours">
			<input type="submit" value="Update Colours">
		</form>

		<br>
		<form action="calendar.php" method="post">
			<input type="hidden" name="action" value="updatePassword">
			<b>Change your password</b>
			<br>
			New Password: <input type="password" name="password1" size="20">
			<br>
			Confirm it: <input type="password" name="password2" size="20">
			<br>
			<input type="submit" value="Update Password">
		</form>

		<br><br>
		<b>Logout</b>
		<form action="calendar.php" method="post">
			<input type="hidden" name="action" value="logout">
			<input type="submit" value="logout">
		</form>
	</div>

</div> <!-- FINAL DIV DO NOT REMOVE -->

<script type="text/javascript">
	startCalendar(0,0);
</script>

			</div>
		</div>
	<div style="clear: both;"> </div>
	</div>
	<!-- end #content -->

	<!-- end #sidebar -->
	<div style="clear: both;"> </div>
</div>
</div>
</div>
<!-- end #page -->
</div>
<div id="footer">
	<p>Paul Ingis
        <br>201-664-1105
        <br><a href="mailto:squaredancing@ingis.com">squaredancing@ingis.com</a>
	<br>Copyright © 2009 <a href="http://ingis.com/squaredancing">Paul Ingis<a/>. All rights reserved. Design by <a href="http://ingis.com/squeaky-squash/info.php">Chris Ingis</a>.</p>
</div>
<!-- end #footer -->
</body>
</html>

thanks guys

Sign In

Very simple question. Hopefully ha:P

Recommended Posts

butsags

Link to comment

Share on other sites

Join the conversation

Browse

Activity

Important Information