
<?php 

// nav.php by John Phillips on 5/19/2002 last revised 6/6/2002

// The purpose of this program is to provide a flexible, menu-driven web site for
// delivery of college-level notes and practice quizzes. Each note page is stored
// in its own HTML web page and is pulled in by this program and displayed when 
// the appropriate menu selection is made. Each set of quiz questions is stored in
// its own XML file and pulled in when selected by the user. The quiz questions are
// given in a random fashion on the selected topic.
 
// Much of the look and feel of the top navigation portion of the web site are from
// "Creating a web site - a step by step guide" located at www.jessett.com. The actual
// PHP implementation of this look is my own original work.

// Part of the reason for using PHP in this project was flexibility. I want to be able
// to change menus easily and set the same design up for other courses easily. I do this
// by storing the information that controls the menu structure in a separate file named
// menuItems.php. This file contains all of the menu headings and is very easy to change.

require("menuItems.php");

// This section finds out how many menu headings and menu items were set.
// Note the use of $$. This useful PHP feature lets you treat a string as a variable name.

$numberOfMenuHeadings = count($contents) - 1;
$menu0Items = 0;
for( $i=1; $i<=$numberOfMenuHeadings; $i++ ) {
  $m = 'menu' . $i;            // sets $m to menu1 .. menu7
  $mi = 'menu' . $i . 'Items'; // sets $mi to menu1Items .. menu7Items
  $$mi = count($$m) - 1;       // sets $menu1Items = count($menu1) - 1 and so on
}

// If the variable $type is empty, then this is the first time this page has been loaded.
// We therefore need to set some default values. m0 and i0 represent the home page.

if(empty($type)) { $type="notes"; $menu="m0"; $item="i0"; }

// Strip off the m and the i so we just have numbers. This will be useful in some of the
// loops below. Note that all note and quiz pages are saved in directories labled m0 
// through m7 and that each HTML note page is saved with a number of i0 through i??.

$menuNum = substr($menu, 1);
$itemNum = substr($item, 1);

// Note that PHP is mixed with HTML and JavaScript. We now start the main HTML page that
// will be sent back to the client's browser. Our site's breadcrumbs are placed
// in both the <title> section and in the browser's status bar.

?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"
"http://www.w3.org/TR/REC-html40/loose.dtd">
<html>
<head>
<title>
  cis330.com > <?php echo "$menuHeadingsArray[$menuNum] > {$contents[$menuNum][$itemNum]} > $type"; ?>
</title>

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

<?php 
// The following nav.js code is from the "create a dhtml menu navigation system"
// web site at www.jessett.com 
?>

<script language="JavaScript" type="text/javascript" src="nav.js"></script>

<script language="JavaScript">
<!--

<?php
// The following 4 image functions were automatically generated by Macromedia Dreamweaver 4.0.
// They are used to create the rollover buttons found on the left side of the screen.
?>

function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.0
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && document.getElementById) x=document.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}

<?php
// The following 3 cookie functions are from "Designing with JavaScript, 2nd ed.", 
// by Nick Heinle and Bill Pena, O'Reilly Press, 2002.
?>

function setCookie(name, value, expires) {
  document.cookie = escape(name) + "=" + escape(value) + "; path=/" + ((expires == null) ? "" : "; expires=" + expires.toGMTString());
}

function getCookie(name) {
  var cookiename = name + "=";
  var dc = document.cookie;
  var begin, end;

  if( dc.length > 0 ) {
    begin = dc.indexOf(cookiename);
    if( begin != -1 ) {
      begin += cookiename.length;
      end = dc.indexOf(";", begin);
      if( end == -1 ) {
        end = dc.length;
      }
      return unescape(dc.substring(begin, end));
    }
  }
  return null;
}

function deleteCookie(name) {
  document.cookie = name + "=; expires=Thu, 01-Jan-70 00:00:01 GMT" + "; path=/";
}

<?php
// If the score changes then store the new score in cookies and update the scoreboard
// textboxes. Note: this does not yet work on Netscape 6.
?>

function setScore(w, l) {
  won = w; lost = l;

  setCookie("Won", won, null);
  setCookie("Lost", lost, null);

  document.sbWonForm.sbWonBox.value = won;
  document.sbLostForm.sbLostBox.value = lost;
}

<?php
// Declare a couple of global JavaScript variables for keeping track of the quiz score.
?>

var won=0; lost=0;

<?php
// When this page is first loaded, we need to check and see if a cookie is already set.
// If not, then we need to start out with scores of 0,0.
?>

function initScore() {
  if( (getCookie("Won") == null) || (getCookie("Lost") == null) ) {
    ;
  }
  else {
    won = getCookie("Won"); 
    lost = getCookie("Lost");
  }
  setScore(won, lost);
}

<?php
// This JavaScript code is activated when the user takes a quiz and clicks the 'Grade Me'
// button. PHP will make availabe a variable called correct that can be compared to
// the user's answer. Note that both values are forced to lowercase. Alert boxes are used
// to tell the user the outcome.
?>

function grade() {
  var answer=document.test.ibox.value;
  if( correct.toLowerCase() == answer.toLowerCase() ) { 
    setScore(++won, lost);
    alert("GOOD JOB! "+answer+" was the correct answer.\nPress Quiz Me to try another.");
   } 
  else { 
    setScore(won, ++lost);
    var s ="Your answer was not correct.\nThe correct answer is " + correct + ".\n"
    s+="Click Notes to review the material.\n"
        s+="Click Quiz Me to try another practice question."
    alert(s); 
  }
}

<?php 
// Code related to taking a quiz is only included if that is what the user is now doing.
// I should have included some of the above JavaScript as well in this include file.
// The advantage of using includes is that the code is only included if needed.

if( $type == 'quiz' ) { include('quiz.php'); } 

?>

<?php
// Set the status bar breadcrumb and then end the JavaScript/Heading section.
?>

window.status='cis330.com > <?php echo "$menuHeadingsArray[$menuNum] > {$contents[$menuNum][$itemNum]} > $type"; ?>'; 

//-->
</script>
</head>

<body onLoad="init();initScore();MM_preloadImages('graphics/btnnoteson.gif','graphics/btnquizon.gif','graphics/btngradeon.gif','graphics/btnscoreon.gif','graphics/btnprintnoteson')" leftmargin="0" topmargin="0">

<!-- Display the top navigation links located at the top of the screen -->

<table class="topnavtable" cellpadding="0" cellspacing="0">
  <tr>
    <td>
      <table class="topnavtable2" cellspacing="0" cellpadding="0">
        <tr>
          <td class="topnav">
            <a href="http://www.coursenotebook.com" title="visit the class discussion board">
            DISCUSSION BOARD </a>&nbsp;&nbsp;&nbsp;
          </td>
          <td class="topnav">
            <a href="extra/downloads.html" title="download the course software">
            DOWNLOADS</a>&nbsp;&nbsp;&nbsp;
          </td>
          <td class="topnav"> 
            <a href="extra/bookstore.html" title="buy the text and related books"> 
            BOOKSTORE</a>&nbsp;&nbsp;&nbsp;
          </td>          
          <td class="topnav"> 
            <a href="extra/sites.html" title="check out some related sites"> 
            RELATED SITES </a>&nbsp;&nbsp;&nbsp;
          </td>
          <td class="topnav">
            <a href="extra/syllabus.html" title="view the online syllabus">
            SYLLABUS</a>&nbsp;&nbsp;&nbsp;
          </td>
          <td class="topnav">
            <a href="extra/sitemap.html" title="site map">
            SITE MAP</a>&nbsp;&nbsp;&nbsp;
          </td>
        </tr>
      </table>
    </td>
  </tr>
</table>

<!-- Display the site logo and atomz.com search box/button -->

<table class="logotable" cellpadding="0" cellspacing="0" bgcolor="#666FBE">
  <tr>
    <td>
      <a href="/">
        <img src="graphics/logo.jpg" width="379" height="80" border="0" 
        alt="CIS330.com | Computer Organization  - class notes and practice quizzes"></a></td>
    <td>
      <form method="get" action="http://search.atomz.com/search/">
        <table cellspacing="0" cellpadding="10" border="0" align="right">
          <tr valign="bottom"> 
            <td>
              <!-- Atomz Search HTML for cis330 -->
              <input size=15 name="sp-q"><br>
              <input type=hidden name="sp-a" value="sp10020c9c">
              <input type=hidden name="sp-f" value="iso-8859-1">
            </td>        
            <td>
              <input type="submit" name="Submit" value="Search">
            </td>
          </tr>
        </table>
      </form>
    </td>
  </tr>
</table>

<!-- Display the main navigation menu headings. Note that these trigger the drop down menus. -->

<table class="navtable" cellspacing="0">
  <tr> 
    <?php for( $i=1; $i<=$numberOfMenuHeadings; $i++ ) { ?>
      <td class="nav" width="14%">
        <a href="?type=notes&menu=m<?php echo $i; ?>&item=i0" 
        onMouseOver="hideAll(); showLayer('layer<?php echo $i; ?>'); stopTime()" 
        onMouseOut="startTime();"><?php echo $menuHeadingsArray[$i]; ?></a>
      </td>
    <?php } ?>  
  </tr>
</table>

<!-- Create each of the drop down menus as a separate hidden layer. -->

<?php for( $i=1; $i<=$numberOfMenuHeadings; $i++ ) { ?>
  <div id="layer<?php echo $i; ?>"> 
    <p class="dropdownnav">
      <?php $pn= "menu{$i}Items"; 
      for( $j=1; $j<=$$pn; $j++ ) { ?>
        <a href="?type=notes&menu=m<?php echo "$i&item=i{$j}"; ?>"
        onMouseOver="stopTime()" 
        onMouseOut="startTime()"> 
        &nbsp;<img src="graphics/nav_arrow.gif" width="6" height="9" border="0" alt="">
        &nbsp;<?php echo $contents[$i][$j]; ?>&nbsp;</a><br>
      <?php } ?>  
    </p>
  </div>
<?php } ?>

<!-- Display a table with the scoreboard and buttons on left and the main screen content on the right -->

<table class="contenttable" cellspacing="0" cellpadding="0">
  <tr class="contenttable"> 
    <td class="contentnav">

        <!-- First display the scoreboard table. I used textboxes to hold the scores.
             They are kind of ugly. I need to research a bit and see if there is another
             way that will allow JavaScript to update the values without reloading the page. 
             Also, how can I get it to work with Netscape 6? -->

        <table style="border: 1px solid #FF0000;" cellspacing="1" cellpadding="1" bgcolor="#4050A0" align="center">
          <tr> 
            <td colspan="2" align="center">
              <font size="1" color="yellow">
                <b>&nbsp;&nbsp;SCOREBOARD&nbsp;&nbsp;</b>
              </font>
            </td>
          </tr>
          <tr> 
            <td valign="middle" align="center">
              <font size="2" color="#00FF33"><b>Won</b></font>
            </td>
            <td align=center>
               <form style="display: inline;" name="sbWonForm">
                 <input size="1" name="sbWonBox" value="0">
               </form>
            </td>
          </tr>
          <tr> 
            <td valign="middle" align="center">
              <font size="2" color="#FF0000"><b>Lost</b></font>
            </td>
            <td align=center>
               <form style="display: inline;" name="sbLostForm">
                 <input size="1" name="sbLostBox" value="0">
               </form>
            </td>
          </tr>
        </table>

      <!-- The buttons are implemented as JavaScript rollover images -->

      <p align="center">
        <a href="?type=quiz&menu=<?php echo $menu; ?>&item=<?php echo $item; ?>"  
        title="take a practice quiz"
        onMouseOut="MM_swapImgRestore()"
        onMouseOver="MM_swapImage('btnquiz','','graphics/btnquizon.gif',1)">
        <img name="btnquiz" border="0" src="graphics/btnquizoff.gif" width="100" height="22"></a>
      </p>
      <p align="center">
        <a href="?type=resetscore&menu=<?php echo $menu; ?>&item=<?php echo $item; ?>" 
        title="reset your scoreboard to zeros"
        onMouseOut="MM_swapImgRestore()"
        onMouseOver="MM_swapImage('btnscore','','graphics/btnscoreon.gif',1)"
        onClick="setScore(0,0); return(false);">
        <img name="btnscore" border="0" src="graphics/btnscoreoff.gif" width="100" height="22"></a>
      </p>
      <p align="center">
        <a href="?type=notes&menu=<?php echo $menu; ?>&item=<?php echo $item; ?>" 
        title="show the course notes"
        onMouseOut="MM_swapImgRestore()"
        onMouseOver="MM_swapImage('btnnotes','','graphics/btnnoteson.gif',1)">
        <img name="btnnotes" border="0" src="graphics/btnnotesoff.gif" width="100" height="22"></a>
      </p>
      <p align="center">
        <a href="content/<?php echo "$menu/{$item}.html"; ?>" title="open new window with notes for printing" target="_blank" 
        onMouseOut="MM_swapImgRestore()"
        onMouseOver="MM_swapImage('btnprintnotes','','graphics/btnprintnoteson.gif',1)">
        <img name="btnprintnotes" border="0" src="graphics/btnprintnotesoff.gif" width="100" height="22"></a>
      </p>
      <p align="center">&nbsp;</p>
    </td>

    <!-- Now display the right side of the table by reading in either a notes or a quiz file -->

    <td class="contentnotes">
      <?php
      switch( $type ) {
        case "notes": include("getnotes.php"); break;
        case "quiz" : echo "<p>$question</p>";
          ?>
          <p align="left">
            <form name="test">
              <br>Answer: <input size="15" name="ibox">
              <a href="?type=grade&menu=<?php echo $menu; ?>&item=<?php echo $item; ?>"  
                onMouseOut="MM_swapImgRestore()" 
                onMouseOver="MM_swapImage('btngrade','','graphics/btngradeon.gif',1)" 
                onMouseDown="grade()">
                <img name="btngrade" border="0" src="graphics/btngradeoff.gif" width="100" height="22">
              </a>
            </form>
          </p>
          <script language="JavaScript">
            document.test.ibox.focus();
          </script>
          <? break;
      }
      ?>
    </td>
  </tr>
</table>

<!-- Display a copyright message at the bottom of the screen -->

<table class="copyrighttable" cellspacing=0 cellpadding=0>
  <tr>
    <td class="copyright">
      Copyright&copy; 2002 John Phillips
    </td>
  </tr>
</table>

<!-- Add a couple of blank lines at the bottom to space things out a bit -->

<p>&nbsp;</p>
<p>&nbsp;</p>

<!-- End the HTML page -->

</body>
</html>