<?php

/* This web page displays probability of snow or freezing rain accumulating above various 
   thresholds for 24- or 48-hour forecast periods. 
*/

// Properly set the argument separator for the & sign
ini_set('arg_separator.output','&amp;');

// Set default timezone to UTC
date_default_timezone_set('UTC');

// Get the forecast period (24- or 48-hour) and make sure to sanitize the input.
if (isset($_GET["fpd"])) {
    if (preg_match("/^24$|^48$/D", $_GET["fpd"])) {
        $fpd = $_GET["fpd"];
    } else {
        $_GET["fpd"] = "undefine";
        $fpd=24;
    }
} else {
    $fpd=24;
}

// Get the precipitation type (snow or icez) (default to snow) and make sure to sanitize the input.
if (isset($_GET["ptype"])) {
    if (preg_match("/^snow$|^icez$/D", $_GET["ptype"])) {
        $ptype = $_GET["ptype"];
    } else {
        $_GET["ptype"] = "undefine";
        $ptype="snow";
    }
} else {
    $ptype="snow";
}

/* Look for the date/time and latest cycle in the directory.
   Will only search on single file as they are all created/sent to the rzdm at the same time (or within a couple minutes)
   File naming conventions for 24 hours:
     Snow - prb_24hsnow_ge[01,02,04,06,08,12,18]_yyyymmddccf[024,048,072].gif
     Ice - prb_24hicez_ge.[01,10,25,50]_yyyymmddccf[024,048,072].gif

   File naming conventions for 48 hours:
     Snow - prb_48hsnow_ge[02,04,08,12,18,24,30]_yyyymmddccf[048,072].gif
     Ice - prb_48hicez_ge[.10,.25,.50,1.0]_yyyymmddccf[048,072].gif

*/

// Change to the directory containing the gif images (either /pwpf_24hr or /pwpf_48hr)
$changedir = chdir("../pwpf_${fpd}hr");
$filedir = getcwd();

// Set string to match to get the proper file for the ptype and forecast period.
if ($ptype == "snow") {
    $datestart = 17;
    if ($fpd == 24) {
        $strtomatch="prb_24hsnow_ge01_[0-9]{10}f024";
    } else {
        $strtomatch="prb_48hsnow_ge02_[0-9]{10}f048";
    }
} else {
    $datestart = 18;
    if ($fpd == 24) {
        $strtomatch="prb_24hicez_ge.01_[0-9]{10}f024";
    } else {
        $strtomatch="prb_48hicez_ge.10_[0-9]{10}f048";
    }
}

// Find the most recent issuance time and create forecast time arrays based on
// the issuance time.
$inittime = 0;
$dc = opendir($filedir);
while ($file = readdir($dc)) {
    if (preg_match("/$strtomatch/",$file) && !preg_match("/sm/",$file)) {
        $finit = substr($file,$datestart,10);
        if ( $finit > $inittime ) {
            $inittime = $finit;
        }
    }
}
closedir($dc);

// Based on the latest file available, get year/month/day/cycle and set a GMT time
$yr = substr($inittime,0,4);
$mn = substr($inittime,4,2);
$dy = substr($inittime,6,2);
$z = substr($inittime,8,2);
$gmt = gmmktime($z,0,0,$mn,$dy,$yr);

// Initialize arrays...there are 2 or 3 forecast times, (24,48,72).
if ($fpd == 24) {
    $fhrarray = array ('024','048','072');
} else {
    $fhrarray = array ('048','072');
}
$init_vtimes = array ();
$end_vtimes = array ();
$init_vtimes_full = array ();
$end_vtimes_full = array ();
$file_fullddates = array ();
$init_vtimes_short = array ();
$end_vtimes_short = array ();
$end_vtimes_line1 = array ();
$end_vtimes_line2 = array ();


/* Based on initialization time and cycle, set the valid periods of the forecasts, and write them 
   out in various formatted forms for the web page
*/  

foreach ( $fhrarray as $fhr ) {
    $init_addhr = $fhr - $fpd;
    $init_vtime = strtotime("+$init_addhr hours", $gmt);
    $end_vtime = strtotime("+$fhr hours", $gmt);

    $init_vtimes[] = date("H\Z D m/d/Y", $init_vtime);
    $init_vtimes_short[] = date("H\Z m/d/Y", $init_vtime);
    $init_vtimes_full[] = date("H\Z F j, Y", $init_vtime);

    $end_vtimes_line1[] = date("H\Z l", $end_vtime);
    $end_vtimes_line2[] = date("F d, Y", $end_vtime);
    
    $end_vtimes[] = date("H\Z l F d, Y", $end_vtime);
    $end_vtimes_short[] = date("H\Z m/d/Y", $end_vtime);    
    $end_vtimes_full[] = date("H\Z F j, Y", $end_vtime);    

    $file_fullddates[] = "${inittime}";
}


// Set additional arrays to contain the thresholds and some formats for output.
if ($ptype == "snow") {
    $titletext = "Snowfall";
    $tabletitle = "Snow";
    $looptext = $ptype;
    if ($fpd == 24) {
        $tholdarray = array ('ge01','ge02','ge04','ge06','ge08','ge12','ge18');
        $selarray = array ('01', '02','04','06','08','12','18');
        $txtamtarray= array ('1', '2','4','6','8','12','18');
        $txtamtarray_long = array ('1 inch', '2 inches', '4 inches', '6 inches', '8 inches', '12 inches', '18 inches');
    } else {
        $tholdarray = array ('ge02','ge04','ge08','ge12','ge18','ge24','ge30');
        $selarray = array ('02','04','08','12','18','24','30');
        $txtamtarray= array ('2','4','8','12','18','24','30');
        $txtamtarray_long = array ('2 inches', '4 inches', '8 inches', '12 inches', '18 inches', '24 inches', '30 inches');
    }
} else {
    $titletext = "Freezing Rain";
    $tabletitle = "Freezing Rain";
    $looptext = "freezing rain";
    if ($fpd == 24) {
        $tholdarray = array ('ge01','ge10','ge25','ge50');
        $selarray = array ('01','10','25','50');
        $txtamtarray= array ('.01', '.10','.25','.50');
        $txtamtarray_long = array ('.01 inch', '.10 inch', '.25 inch', '.50 inch');
    } else {
        $tholdarray = array ('ge10','ge25','ge50','ge100');
        $selarray = array ('10','25','50','100');
        $txtamtarray= array ('.10','.25','.50','1.00');
        $txtamtarray_long = array ('.10 inch', '.25 inch', '.50 inch', '1.00 inch');
    }
}
?>


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
 "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <title>HPC <?php print $fpd;?>-Hour Probabilistic <?php print $titletext;?> Guidance for Days 1-3</TITLE>
  <meta name="DC.title" content="HPC <?php print $fpd;?>-Hour Probabilistic <?php print $titletext;?> Guidance for Days 1-3">
  <meta name="DC.description" content="HPC <?php print $fpd;?>-Hour Probabilistic <?php print $titletext;?> Guidance for Days 1-3">
  <meta name="DC.creator" content="NOAA's National Weather Service">
  <meta name="DC.date.created" scheme="ISO8601" content="2011-10-06">
  <meta name="DC.date.reviewed" scheme="ISO8601" content="2012-10-02">
  <meta name="DC.language" scheme="DCTERMS.RFC1766" content="EN-US">
  <meta http-equiv=Content-Type content="text/html; charset=windows-1252">
  <meta content="NCEP Web Team" name="GENERATOR">
  <link href="/nwscwi/main.css" type="text/css" rel="STYLESHEET">

  <style type="text/css">
  body {
      margin: 0px;
      padding: 0px;
  }
  td.titles {
      background-color:#0A2390;
      font-size:12pt;
      color:yellow;
      text-align:center;
      padding-top:3px;
      padding-bottom:3px;
      padding-left:50px;
  }
  td.titles_fhr {
      background-color:#0A2390;
      font-size:12pt;
      color:yellow;
      text-align:center;
      padding-top:8px;
      padding-bottom:12px;
      padding-left:50px;
  }
  td.charts {
      background-color:#C0E0EE;
      padding:4px;
  }
  td.days {
      background-color:#C0E0EE;
      font-size:.9em;
      padding-top:10px;
      font-weight: bold;
      text-align:center;
  }
  td.tabon {
      font-size:8pt;
      color : black;
      font-weight : bold;
      padding : 1px;
  }
  td.taboff {
      font-size:9pt;
      color : white;
      font-weight : bold;
      padding : 1px;
      border-left: 2px solid #19E70E;
  }
  td.taboff2 {
      font-size:8pt;
      color : white;
      font-weight : bold;
      padding : 1px;
      border-right:2px solid #19E70E;
  }
  td.taboff_first {
      font-size:9pt;
      color : white;
      font-weight : bold;
      padding : 2px; 
      border-left: 2px solid #19E70E;
  }
  td.taboff_first_fhr {
      font-size:9pt;
      color : white;
      font-weight : bold;
      padding-left : 2px;
      padding-right: 2px;
      padding-top: 5px;
      padding-bottom: 5px;
      border-left: 2px solid #19E70E;
      border-top: 2px solid #19E70E;
  }
  td.taboff_fhr {
      font-size:9pt;
      color : white;
      font-weight : bold;
      padding : 1px;
      border-top: 2px solid #19E70E;
  }

  </style>
</head>

<?php
print <<<EOF
<BODY onload="select_parameter('parm_thold','initload');">
EOF;
?>

<!-- INFORMATION ABOUT THE SCRIPT BELOW..........
  THIS SCRIPT IS CALLED WHEN A USER CLICKS ONE OF THE RADIO BUTTON OPTIONS ON THE PAGE UNDER VIEWING OPTIONS.
  IT DETERMINES WHICH DIV TO DISPLAY. ALL OF THE DIVS ARE WRITTEN WHEN THE PAGE LOADS (ONLY ONE IS VISIBLE AT A TIME), THEN THIS CODE WILL SELECT WHAT
  IS DESIRED.  

  BY DEFAULT, WHEN THE PAGE LOADS, IT SHOWS Probability of Snow >= 1 INCH.

  AFTER SETTING THE PARAMETERS BASED ON THE RADIO BUTTON VALUES, IT CALLS show_tab TO ACTUALLY DO THE DISPLAYING.

-->


<script language="javascript" type="text/javascript">
<!--
    function showval(obj) {
    alert(obj.value);
}

    //  This function is called at body onload and whenever a user changes the radio button selection
    function select_parameter(parm,whichload) {

    <?php
      if ($ptype == "snow") {
          if ($fpd == 24) {
              print <<<EOF
              var pd_divs = new Array("01","02","04","06","08","12","18");
              var thold_divs = new Array("t01","t02","t04","t06","t08","t12","t18");
              var fhr_divs = new Array("fpd024","fpd048","fpd072");
EOF;
          } else {
              print <<<EOF
              var pd_divs = new Array("02","04","08","12","18", "24","30");
              var thold_divs = new Array("t02","t04","t08","t12","t18", "t24","t30");
              var fhr_divs = new Array("fpd048","fpd072");
EOF;
          }
      } else {
          if ($fpd == 24) {
              print <<<EOF
              var pd_divs = new Array("01","10","25","50");
              var thold_divs = new Array("t01","t10","t25","t50");
              var fhr_divs = new Array("fpd024","fpd048","fpd072");
EOF;
          } else {
              print <<<EOF
              var pd_divs = new Array("10","25","50","100");
              var thold_divs = new Array("t10","t25","t50","t100");
              var fhr_divs = new Array("fpd048","fpd072");
EOF;
          }
      }
    ?>

    //----------------------------------------------------------------------------------------
    // On body onload...call function to show prob snow >= 1 inch by default
    if (whichload == "initload") {
        <?php
          if ($fpd == 24) {
              print "show_tab('period1_01', 'td1_01', 'link1_01','yes','t01');";
          } else {
              if ($ptype == "snow") {
                  print "show_tab('period1_02', 'td1_02', 'link1_02','yes','t02');";
          } else {
                  print "show_tab('period1_10', 'td1_10', 'link1_10','yes','t10');";
              }
          }
        ?>

    //-------------------------------------------------------------------------------------------------------------------
    /* If NOT the initial load of the page, the following will run if the user picks a THRESHOLD under
       "Viewing Options" 
    */
    } else if (parm == "parm_thold") {
        for (var i=0; i < document.threshold_select.threshold_choice.length; i++) {
            if (document.threshold_select.threshold_choice[i].checked) {
                var selindex = document.threshold_select.threshold_choice[i].value;
            }
        } 
        if (! selindex) {
            var selindex = "01";
        }

        // Initialize the active div to N/A
        pd_active = -1;

        /* WHEN THE USER SELECTS A THRESHOLD (4, 6, 8"), NEED TO FIND THE DAY THAT'S CURRENTLY DISPLAYING.  
           LOOP THROUGH EACH DAY AND THRESHOLD TO FIND THE ONE THAT'S DISPLAY IS "BLOCK"

           THIS WILL "NOT" WORK IF THE USER IS CURRENTLY VIEWING ALL THRESHOLDS FOR A GIVEN DAY (I.E. CHOOSING
           A DAY FROM THE VIEWING OPTIONS MENU.  SEE CASE #2 BELOW.
        */

        <?php
          if ($fpd == 24) {
              print "for (i=1; i<= 3; i++) {";
          } else {
              print "for (i=1; i<= 2; i++) {";
          }
        ?>

            for (cnt=0; cnt<thold_divs.length; cnt++) {
                var pd_div = "period" + i + "_" + pd_divs[cnt];
                displayval = document.getElementById(pd_div).style.display;
                if (displayval == "block" ) {
                    pd_active = i;
                    break;
                }
            }
        }
        
        /* CASE #2 - User is initially on one of the "day" viewing options, but now selects a threshold.  In this 
           case, all "periodx_xx" divs are set to NONE (i.e. pd_active is still -1)

           Need to loop through again and find which viewing option day is chosen.
           The format of these divs is "periodx_fpdhhh" where x is from 1 to the number of thresholds and 
           hhh is 024, 048, 072
         */     
         if (pd_active == -1) {
             <?php
              if ($fpd == 24) {
                  print "for (i=0; i< 3; i++) {";
              } else {
                  print "for (i=0; i< 2; i++) {";
              }
            ?>
            
                for (cnt=1; cnt<=thold_divs.length; cnt++) {
                    var fhrdiv = "period" + cnt + "_" + fhr_divs[i];
                    displayval = document.getElementById(fhrdiv).style.display;
                    if (displayval == "block" ) {
                        pd_active = i;
                        break;
                    }
                 }
             }
             pd_active = pd_active + 1;
         }

        // Set variables to display the correct div section...then call a function to display the div.
        chosenid = "t" + selindex;
        pdtype = "period" + pd_active + "_" + selindex;
        tdtype = "td" + pd_active + "_" + selindex;
        lnktype = "link" + pd_active + "_" + selindex;
        show_tab(pdtype, tdtype, lnktype,'no',chosenid)

    //-------------------------------------------------------------------------------------------------------------------
    /* If NOT the initial load of the page, the following will run if the user picks a SPECIFIC TIME PERIOD under
       "Viewing Options" 
    */
    } else if (parm == "parm_fhr") {
        for (var i=0; i < document.hour_select.hour_choice.length; i++) {
            if (document.hour_select.hour_choice[i].checked) {
                var selindex = document.hour_select.hour_choice[i].value;
                sellength = selindex.length;
                var fhrpd = selindex.substr(0,6);
            }
        }
        if (! selindex) {
            var fhrpd = "fpd0<?php print $fpd;?>";
        }

        // Initialize the active div to N/A
        pd_active = -1;

        /* CASE #1:
             WHEN THE USER SELECTS A FORECAST DAY (1,2,3), NEED TO FIND THE THRESHOLD THAT IS CURRENTLY DISPLAYING.  
             LOOP THROUGH EACH DAY AND THRESHOLD TO FIND THE ONE THAT'S DISPLAY IS "BLOCK".
             THIS WILL AVOID RE-SETTING THE THRESHOLD TO THE FIRST VALUE WHEN A DAY IS CHOSEN.

             The divs for threshold viewing options are set up as:  period[1,2,3]_[01,02,04,06,08,12...],
                -- so period2_06 is the 6" threshold for Day 2.
             The divs for day viewing options are set up as: period[1,2,3,4,5,...]_fpd[024,048,072],
                -- so period5_fpd072 is the 8" threshold for Day 3 (the 8" is the 5th threshold in the array).


           THIS WILL "NOT" WORK IF THE USER CHANGES FROM ONE DAY TO ANOTHER (I.E. CHOOSING
           DIFFERENT DAY FROM TEH VIEWING OPTIONS TABLE).  SEE CASE #2 BELOW. 
        */

        <?php
          if ($fpd == 24) {
              print "for (i=1; i<= 3; i++) {";
          } else {
              print "for (i=1; i<= 2; i++) {";
          }
        ?>

            for (cnt=0; cnt<thold_divs.length; cnt++) {
                var pd_div = "period" + i + "_" + pd_divs[cnt];
                displayval = document.getElementById(pd_div).style.display;
                if (displayval == "block" ) {
                    pd_active = cnt+1;
                    break;
                }
            }
        }

        /* CASE #2:
             IF A USER HAS CHOSEN A DAY UNDER THE "VIEWING OPTIONS" AND CHOOSES ANOTHER DAY
             NEED TO FIND THE NEW CHOSEN DIV OF THE FORM period[1,2,3,4,5,...]_fpd[024,048,072].
               -- So loop through the forecast periods 
                 -- Loop through the thresholds
                   -- Find the active div.  
        */

        if (pd_active == -1) {
            <?php
              if ($fpd == 24) {
                  print "for (i=0; i< 3; i++) {";
              } else {
                  print "for (i=0; i< 2; i++) {";
              }
            ?>
 
                 for (cnt=1; cnt<=thold_divs.length; cnt++) {
                    var fhrdiv = "period" + cnt + "_" + fhr_divs[i];
                    displayval = document.getElementById(fhrdiv).style.display;
                    if (displayval == "block" ) {
                        pd_active = cnt;
                        break;
                    }
                 }
             }
        }
 
        // Set variables to display the correct div section...then call a function to display the div.
        chosenid = fhrpd;
        pdtype = "period" + pd_active + "_" + fhrpd;
        tdtype = "td" + pd_active + "_" + fhrpd;
        lnktype = "link" + pd_active + "_" + fhrpd;
        show_tab(pdtype, tdtype, lnktype,'no',chosenid)
    }
} //End of function bracket

//-->
</script>


<?php include("../cwiheader2.html") ?>


<TABLE cellSpacing="0" cellPadding="2" width="970" border="0">
  <TBODY>
  <TR vAlign="top">
    <TD width="130" background="/nwscwi/background.gif">
     <?php include("../cwimenu2.html") ?>
    </TD>

    <TD vAlign="top" align="left" width="10">&nbsp;</td>

    <TD vAlign="top" align="left" width="860"><A name="contents"></A><BR>

<!-- INFORMATION ABOUT THE show_tab SCRIPT
  THIS IS CALLED FROM select_parameter, WHICH PASSES THE VALUES FROM THE RADIO BUTTON SELECT.  FROM THERE, IT SETS THE 
  APPROPRIATE DIV TO DISPLAY:BLOCK AND THE OTHERS TO NONE.  THEN IT SETS SOME DISPLAY OPTIONS (COLOR, BACKGROUNDS, ETC...)
  FOR THE DISPLAYED DIV.
-->


<script language="Javascript" type="text/javascript">
function show_tab(nam,col,linkhighlighted,isinit,parm)
    {

    parmtype = parm.substring(0,1);
    <?php
      if ($ptype == "snow") {
          print "selindex = parm.substring(1,3);";
      } else {
          print "selindex = parm.substring(1,4);";
      }

      if ($ptype == "snow") {
          if ($fpd == 24) {
              print <<<EOF
              var pd_divs = new Array("01","02","04","06","08","12","18");
              var thold_divs = new Array("t01","t02","t04","t06","t08","t12","t18");
              var fhr_divs = new Array("fpd024","fpd048","fpd072");
EOF;
          } else {
              print <<<EOF
              var pd_divs = new Array("02","04","08","12","18", "24","30");
              var thold_divs = new Array("t02","t04","t08","t12","t18", "t24","t30");
              var fhr_divs = new Array("fpd048","fpd072");
EOF;
          }
      } else {
          if ($fpd == 24) {
              print <<<EOF
              var pd_divs = new Array("01","10","25","50");
              var thold_divs = new Array("t01","t10","t25","t50");
              var fhr_divs = new Array("fpd024","fpd048","fpd072");
EOF;
          } else {
              print <<<EOF
              var pd_divs = new Array("10","25","50","100");
              var thold_divs = new Array("t10","t25","t50","t100");
              var fhr_divs = new Array("fpd048","fpd072");
EOF;
          }
      }

      // The following initializes the display parameters for each div to default of "none".

      if ($fpd == 24) {
          print "for (i=1; i<= 3; i++) {";
      } else {
          print "for (i=1; i<= 2; i++) {";
      }

      ?>

          for (cnt=0; cnt<thold_divs.length; cnt++) {
               document.getElementById(thold_divs[cnt]).style.display = "none";

               var pd_div = "period" + i + "_" + pd_divs[cnt];
               document.getElementById(pd_div).style.display = "none";      

               var thold_loopdiv = "loop_" + thold_divs[cnt];
               document.getElementById(thold_loopdiv).style.display = "none";
           }

           for (cnt=0; cnt<fhr_divs.length; cnt++) {
               document.getElementById(fhr_divs[cnt]).style.display = "none";

               var fhr_loopdiv = "loop_" + fhr_divs[cnt];
               document.getElementById(fhr_loopdiv).style.display = "none";
           }
       }

       // Need to initialize the divs for the various thresholds for each day
       // The thresholds go from 1 to the number of thresholds.  The divs for these are
       // period[1,2,3,4,5,...]_fpd[024,048,072]
 
       <?php
         if ($fpd == 24) {
              print "for (i=0; i< 3; i++) {";
          } else {
              print "for (i=0; i< 2; i++) {";
          }
       ?>
              for (cnt=1; cnt<=thold_divs.length; cnt++) {
                  var pd_div = "period" + cnt + "_" + fhr_divs[i];
                  document.getElementById(pd_div).style.display = "none";
              }
          }


    //----------------------------------------------------------------------------------------------
    // USE CODE BELOW IF PARAMETER CHOSEN IS A "THRESHOLD"
    // It sets display characteristics of the chosen valid period label for a given threshold
    // For 24-hour PWPF, there'll be 3 periods, for the 48-hour, only 2
   
    if (parmtype == "t") {

           <?php
             if ($fpd == 24) {
                 print "for (i=1; i<= 3; i++) {";
             } else {
                 print "for (i=1; i<= 2; i++) {";
             }
             ?>

                tdtype = "td" + i + "_" + selindex;
                pdtype = "period" + i + "_" + selindex;
                lnktype = "link" + i + "_" + selindex;
                document.getElementById(tdtype).style.backgroundColor="#0A2390";
                document.getElementById(tdtype).style.color="white";
                document.getElementById(tdtype).style.cursor="default";
                document.getElementById(pdtype).style.display = "none";
                document.getElementById(lnktype).style.color="white";
                document.getElementById(lnktype).style.textDecoration="none";
            }
  

            // This determines what loop text div should be displayed, based on the selected threshold.
            // These are loops of all days for the given threshold
            looptype = "loop_t" + selindex;
            document.getElementById(looptype).style.display = "block";
            document.getElementById(nam).style.display = "block";
            document.getElementById(parm).style.display = "block";
            document.getElementById(col).style.backgroundColor="#C0E0EE";  
            document.getElementById(linkhighlighted).style.color="blue";
            document.getElementById(linkhighlighted).style.textDecoration="underline";
            colstart = col.substring(0,3);

            document.hour_select.reset();

    }

    //----------------------------------------------------------------------------------------------------------
    // Code below initializes display characteristics for each threshold for a given valid forecast day
    if ( parmtype == "f") {
        selindex = parm.substring(1,6);
        for (i=1; i<= thold_divs.length; i++) {
            tdtype = "td" + i + "_f" + selindex;
            pdtype = "period" + i + "_f" + selindex;
            lnktype = "link" + i + "_f" + selindex;
            document.getElementById(tdtype).style.backgroundColor="#0A2390";
            document.getElementById(tdtype).style.color="white";
            document.getElementById(tdtype).style.cursor="default";
            document.getElementById(pdtype).style.display = "none";
            document.getElementById(lnktype).style.color="white";
            document.getElementById(lnktype).style.textDecoration="none";
        }
    
        // Below sets the display characteristics for the chosen threshold on the selected forecast day.
        looptype = "loop_f" + selindex;
        document.getElementById(looptype).style.display = "block";
        document.getElementById(nam).style.display = "block";
        document.getElementById(parm).style.display = "block";
        document.getElementById(col).style.backgroundColor="#C0E0EE";  
        document.getElementById(linkhighlighted).style.color="blue";
        document.getElementById(linkhighlighted).style.textDecoration="underline";
        
        document.threshold_select.reset();
	document.threshold_select.threshold_choice[0].checked = false;
    }

    // On initial load of page, reset to the defaults
    if (isinit=="yes") {
        document.threshold_select.reset();
        document.hour_select.reset();
    }
    return;
}
</script>

<center>
<div style="font-size:175%">
  <font face="Arial,Helvetica" color="green">HPC Probabilistic Winter Precipitation Guidance</font>
</div>
<hr>

<div style="line-height:75%">&nbsp;</div>
<div style="font-size:125%">
    <a href="/pwpf/about_pwpf_products.shtml"><b><u>Information about these products</u></b></a>
    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
    <a href="/pwpf/wwd_percentiles.php?fpd=<?php print $fpd; ?>&amp;ptype=<?php print $ptype; ?>"><b><u>View HPC's Percentile Accumulation Guidance</u></b></a>
</div>

<div style="line-height:75%">&nbsp;</div>
<div style="font-size:100%;">
  For additional details, please read the official <a href="/pwpf/HPC_PWPF_PDD.pdf"><b><u>Product Description Document (PDD)</u></b></a> for this guidance
</div>
<div style="font-size:.9em;">
  (Note: The PDD is a pdf file and requires <a href="/html/hpcexit.php?reason=acrobat"><u>Adobe Acrobat Reader</u></a> to view)
</div>

<div style="line-height:200%">&nbsp;</div>
</center>

<!--  CODE FOR THE TABS AT THE TOP  -->

<table cellspacing="0" cellpadding="0"  width="99%" border="0">
 <tr>
   <td>
     <table cellspacing="0" cellpadding="0"  width="100%" border="0">
       <tr>
         <td align="center" colspan="6">
           <span style="font-size:1.5em;font-decoration:bold;">24-Hour Forecasts</span>
         </td>
         <td>&nbsp;</td>
         <td align="center" colspan="6" style="padding-bottom:5px; padding-top:5px;">
           <span style="font-size:1.5em;font-decoration:bold;">48-Hour Forecasts</span>
         </td>
       </tr>

       <tr>
<!-- LEFT-MOST TAB, FOR 24 HOUR SNOWFALL FORECASTS -->
<?php
  
  if ($fpd == 24 && $ptype == "snow") {
      print <<<EOF
         <td align="right"><img src="/images/tab_left.on.jpg" alt="" width="3" height="34"></td>
         <td style="background-image: url('/images/tab_middle.on.jpg');text-align:center;" align="left" height="34">
           <b><span style="line-height:110%; ">&nbsp;24-Hour Snowfall&nbsp;<br>Probability Forecasts
              </span></b></td>
         <td align="left"><img src="/images/tab_right.on.jpg" alt="" width="3" height="34"></td>
EOF;
  } else {
      print <<<EOF
         <td align="right"><img src="/images/tab_left.off.jpg" alt="" width="3" height="34"></td>
         <td style="background-image: url('/images/tab_middle.off.jpg');text-align:center;" height="34">
           <a href="/pwpf/wwd_accum_probs.php?fpd=24&ptype=snow">
           <b><span style="line-height:110%; font-size:9pt;">&nbsp;24-Hour Snowfall&nbsp;<br>Probability Forecasts
              </span></b></a>
         </td>
         <td align="left"><img src="/images/tab_right.off.jpg" alt="" width="3" height="34"></td>
EOF;
  }
?>

<!-- TAB FOR 24-HOUR FREEZING RAIN FORECASTS -->
<?php
  if ($fpd == 24 && $ptype == "icez") {
      print <<<EOF
         <td align="right"><img src="/images/tab_left.on.jpg" alt="" width="3" height="34"></td>
         <td style="background-image: url('/images/tab_middle.on.jpg');text-align:center;font-size:8pt;" height="34">
           <b><span style="line-height:110%; font-size:9pt;">&nbsp;24-Hour Freezing Rain&nbsp;<br>Probability Forecasts
              </span></b>
         </td>
         <td align="left"><img src="/images/tab_right.on.jpg" alt="" width="3" height="34"></td>
EOF;
  } else {
      print <<<EOF
         <td align="right"><img src="/images/tab_left.off.jpg" alt="" width="3" height="34"></td>
         <td style="background-image: url('/images/tab_middle.off.jpg');text-align:center;" align="left" height="34">
           <a href="/pwpf/wwd_accum_probs.php?fpd=24&ptype=icez">
           <b><span style="line-height:110%; font-size:9pt;">&nbsp;24-Hour Freezing Rain&nbsp;<br>Probability Forecasts
           </span></b></a>
         </td>
         <td align="left"><img src="/images/tab_right.off.jpg" alt="" width="3" height="34"></td>
EOF;
  }
?>

<!-- ADD SPACE BETWEEN 24 AND 48 HOUR TABS -->
         <td><img src="/images/whitespace.gif" height=34 width=120 alt=""></td>

<!-- TAB FOR 48 HOUR SNOWFALL FORECASTS -->
<?php
  if ($fpd == 48 && $ptype == "snow") {
      print <<<EOF
         <td align="right"><img src="/images/tab_left.on.jpg" alt="" width="3" height="34"></td>
         <td style="background-image: url('/images/tab_middle.on.jpg');text-align:center;" height="34">
         <b><span style="line-height:110%;">&nbsp;48-Hour Snowfall&nbsp;<br>Probability Forecasts
            </span></b></td>
         <td align="left"><img src="/images/tab_right.on.jpg" alt="" width="3" height="34"></td>
EOF;
  } else {
      print <<<EOF
         <td align="right"><img src="/images/tab_left.off.jpg" alt="" width="3" height="34"></td>
         <td style="background-image: url('/images/tab_middle.off.jpg');text-align:center;" height="34">
           <a href="/pwpf/wwd_accum_probs.php?fpd=48&ptype=snow">
           <b><span style="line-height:110%; font-size:9pt;">&nbsp;48-Hour Snowfall&nbsp;<br>Probability Forecasts
              </span></b></a>
         </td>
         <td align="left"><img src="/images/tab_right.off.jpg" alt="" width="3" height="34"></td>
EOF;
  }
?>

<!-- TAB FOR 48-HOUR FREEZING RAIN FORECASTS -->
<?php
  if ($fpd == 48 && $ptype == "icez") {
      print <<<EOF
         <td align="right"><img src="/images/tab_left.on.jpg" alt="" width="3" height="34"></td>
         <td style="background-image: url('/images/tab_middle.on.jpg');text-align:center;font-size:8pt;" height="34">
           <b><span style="line-height:110%; font-size:9pt;">&nbsp;48-Hour Freezing Rain&nbsp;<br>Probability Forecasts
              </span></b>
         </td>
         <td align="left"><img src="/images/tab_right.on.jpg" alt="" width="3" height="34"></td>
EOF;
  } else {
      print <<<EOF
         <td align="right"><img src="/images/tab_left.off.jpg" alt="" width="3" height="34"></td>
         <td style="background-image: url('/images/tab_middle.off.jpg');text-align:center;" align="left" height="34">
           <a href="/pwpf/wwd_accum_probs.php?fpd=48&ptype=icez">
           <b><span style="line-height:110%; font-size:9pt;">&nbsp;48-Hour Freezing Rain&nbsp;<br>Probability Forecasts
           </span></b></a>
         </td>
         <td align="left"><img src="/images/tab_right.off.jpg" alt="" width="3" height="34"></td>
EOF;
  }
?>

       </tr>
     </table>  <!-- End of table showing the tabs at the top -->
   </td>

 </tr>

 <tr><td>


<?php 

/* THE SECTION BELOW ARE THE DIVS FOR THE CYCLING THROUGH THE FORECAST HOURS FOR A GIVEN THRESHOLD */
/* ----------------------------------------------------------------------------------------------- */

/* Below is just for the formatting of the page, which will change depending on how many 
   forecasts there are to display 
*/

$tot_colspan = count($fhrarray) + 1;
$safari_valid_width = "100px";

$thold_counter = 0;

/* Here begins a large loop of print statements.  We are looping through the 6 thresholds here (1 - 18") and 
   writing a table.  The first column contains the forecast and timeline, the second contains the viewing options section
*/

$thold_counter = 0;
while ($thold_counter < count($tholdarray)) {
    $pwpf_thold = $selarray[$thold_counter];

    if ($ptype == "snow") {
        $tholdfile_fmt = "ge${pwpf_thold}";
    } else {
        $tholdfile_fmt = "ge.${pwpf_thold}";
        if ( $pwpf_thold > 99 ) {
            $fmt_pwpfthold = $pwpf_thold/100;
            $leftovr = $pwpf_thold % 100;
            if ( $leftovr != 0 ) {
                $tholdfile_fmt = "ge${fmt_pwpfthold}";
            } else {
                $tholdfile_fmt = "ge${fmt_pwpfthold}.0";
            }
       }
    }

    print <<<EOF

   <div id="t$pwpf_thold">
     <table cellspacing="0" cellpadding="0"  width="100%" border="0"><tr>

       <td width="80%">
         <table cellspacing="0" cellpadding="0" width="660px" border=0 style="border:2px solid #0A2390;">

           <tr bgcolor="#0A2390">
             <td class="titles" align="center" colspan="$tot_colspan">
               <b>$fpd-Hour Probability of $tabletitle Accumulating &ge; $txtamtarray[$thold_counter]"</b> 
             </td>
           </tr>

           <tr bgcolor="#0A2390">
EOF;

/* PRINT Day 1, Day 2, Day 3 ACROSS THE TOP, ABOVE THE VALID DATES */

    if ($fpd == 24) {
        print <<<EOF
             <td>&nbsp;</td>
             <td align="center" style="color:#A5A54C; padding-top: 4px; border-bottom: 2px solid #19E70E;">
               <b>Day 1</b>
             </td>
             <td align="center" style="color:#A5A54C; padding-top: 4px; border-bottom: 2px solid #19E70E;">
               <b>Day 2</b>
             </td>
             <td align="center" style="color:#A5A54C; padding-top: 4px; border-bottom: 2px solid #19E70E;">
               <b>Day 3</b> 
             </td>
EOF;
    } else {
        print <<<EOF
             <td>&nbsp;</td>
             <td align="center" style="color:#A5A54C; padding-top: 4px; border-bottom: 2px solid #19E70E;">
               <b>Day 1-2</b>
             </td>
             <td align="center" style="color:#A5A54C; padding-top: 4px; border-bottom: 2px solid #19E70E;">
               <b>Day 2-3</b>
             </td>
EOF;
    }
    print <<<EOF
           </tr>
           <tr>
             <td style="color:yellow; background-color:#0A2390; ;text-align:center;font-weight:bold;width:90px;padding-bottom:5px;">
               Valid for the $fpd-hour<br>period ending:
             </td>

EOF;

  /* Inside of each threshold, we loop through and write the forecast valid periods. 
     The print statements below will show the forecast valid periods in each column.
  */
  $i = 1;
  while ( $i <= count($fhrarray)) {
      $ptr = $i-1;
      if ($i == 1 || $i == 2) {
          $tdclass = "taboff_first";
      } else {
          $tdclass = "taboff";
      }

      print <<<EOF
             <td class="$tdclass" id="td${i}_$pwpf_thold" align="center" width="$safari_valid_width">
               <a id="link${i}_$pwpf_thold" href="/pwpf_${fpd}hr/prb_${fpd}h${ptype}_${tholdfile_fmt}_$file_fullddates[$ptr]f$fhrarray[$ptr].gif"
                OnMouseOver="show_tab('period${i}_$pwpf_thold','td${i}_$pwpf_thold','link${i}_$pwpf_thold','no','t$pwpf_thold')">
                $end_vtimes_line1[$ptr]<br>$end_vtimes_line2[$ptr]
               </a> 
             </td>
EOF;

      $i ++;
  }

  print <<<EOF
           </tr>
           <tr>
             <td width="82%" bgcolor="#C0E0EE" valign="top" colspan="$tot_colspan">
EOF;

  /* Below is the print statements for the showing of the main image on the page */

  $i = 1; 
  while ($i <= count($fhrarray)) {
      if ($i == 1 && $thold_counter == 0) {
          $display = "block";
      } else {
          $display = "none";        
      }
      $ptr = $i-1;

      print <<<EOF
               <div id="period${i}_$pwpf_thold" style="display:$display;">
                 <table cellspacing="0" cellpadding="0" width="100%" align="center" border="0">
                   <tr>
                     <td bgcolor="#C0E0EE" style="padding-left:13px; padding-top:9px;padding-bottom:3px;">
                       <b>$fpd-hour forecast valid $init_vtimes_full[$ptr] through $end_vtimes_full[$ptr]</b>
                     </td>
                   </tr>
                   <tr><td align="center" style="padding-bottom:20px;">
                     <a href="/pwpf_${fpd}hr/prb_${fpd}h${ptype}_${tholdfile_fmt}_$file_fullddates[$ptr]f$fhrarray[$ptr].gif">
                        <img src="/pwpf_${fpd}hr/prb_${fpd}h${ptype}_${tholdfile_fmt}_$file_fullddates[$ptr]f$fhrarray[$ptr]_sm.gif" 
                        alt='${fpd}-Hour Probability of $tabletitle valid $end_vtimes_full[$ptr]'
                        title='${fpd}-Hour Probability of $tabletitle valid $end_vtimes_full[$ptr]' border="0"></a>
                   </td></tr>
                 </table>
               </div>

EOF;
      $i ++;
  }
 

  print <<<EOF
             </td>
             <!-- End table column containing products (preview, day1, etc...) -->

           </tr>
         </table>
         <!-- End of table to the left of "Viewing options" -->
       </td>
     </tr></table>
   </div>
EOF;

  $thold_counter ++;
}


/* THE SECTION BELOW ARE THE DIVS FOR THE CYCLING THROUGH THE THRESHOLDS FOR A GIVEN FORECAST HOUR */
/* ----------------------------------------------------------------------------------------------- */

  /* Here begins a large loop of print statements.  We are looping through the forecast days here and 
     writing a table.  The first column contains the valid period and set of thresholds , the second contains the viewing options section
  */

  $fhr_counter = 0;
  while ($fhr_counter < count($fhrarray)) {
      $id = ($fhr_counter*24) + $fpd;
      if ($id < 100) {
          $id = "0$id";
      }
      $divid = "fpd$id";

      print <<<EOF
  <div id="$divid" style="display:none;">
  <table cellspacing="0" cellpadding="0"  width="100%" border="0">
    <tr>
      <td width="80%">
        <table cellspacing="0" cellpadding="0" width="660px" border=0 style="border:2px solid #0A2390;">
          <tr bgcolor="#0A2390">
            <td class="titles_fhr" align="center" colspan="8">
              <b>$fpd-Hour $tabletitle Accumulation Probability Forecasts<br>
              <span style="font-size:9pt;">
              Valid $init_vtimes_full[$fhr_counter] - $end_vtimes_full[$fhr_counter]</b>
              </span>
            </td>
          </tr>
          <tr>
            <td style="color:yellow; background-color:#0A2390; text-align:center;font-weight:bold;width:45px;">Threshold:</td>
EOF;

      /* Inside of each forecast hour, we loop through and write the thresholds.  Code below deals with formatting 
         The print statements below will show the thresholds in each column.
      */
      $i = 0;
      while ( $i < count($tholdarray) ) {
          $cnt = $i + 1; 
          $thold = $selarray[$i];
          if ($i == 0) {
              $tdclass = "taboff_first_fhr";
          } else {
              $tdclass = "taboff_fhr";
          }

          if ($ptype == "snow") {
              $tholdfile_fmt = "ge${thold}";
          } else {
              $tholdfile_fmt = "ge.${thold}";
              if ( $thold > 99 ) {
                  $fmt_pwpfthold = $thold/100;
                  $leftovr = $thold % 100;
                  if ( $leftovr != 0 ) {
                      $tholdfile_fmt = "ge${fmt_pwpfthold}";
                  } else {
                      $tholdfile_fmt = "ge${fmt_pwpfthold}.0";
                  }
              }
          }

          print <<<EOF
            \n
            <td class="$tdclass" id="td${cnt}_$divid" align="center" width="52px">
              <a id="link${cnt}_$divid" href="/pwpf_${fpd}hr/prb_${fpd}h${ptype}_${tholdfile_fmt}_$file_fullddates[$fhr_counter]f$fhrarray[$fhr_counter].gif"
                OnMouseOver="show_tab('period${cnt}_$divid','td${cnt}_$divid','link${cnt}_$divid','no','$divid')">
                &ge; $txtamtarray_long[$i]
              </a>
            </td>
EOF;
          $i ++;
      }

      $thold_colspan = count($tholdarray) + 1;
      print <<<EOF
          </tr>
          <tr>
            <td width="82%" bgcolor="#C0E0EE" valign="top" colspan="$thold_colspan">
EOF;

      /* Below is the print statements for the showing of the main image on the page */

      $i = 1;
      while ( $i <= count($tholdarray) ) {
          if ($i == 1 && $fhr_counter == 0) {
              $display = "block";
          } else {
              $display = "none";
          }
          $cnt = $i;
          $ptr = $i-1;
          $thold = $selarray[$ptr];

          if ($ptype == "snow") {
              $tholdfile_fmt = "ge${thold}";
          } else {
              $tholdfile_fmt = "ge.${thold}";
              if ( $thold > 99 ) {
                  $fmt_pwpfthold = $thold/100;
                  $leftovr = $thold % 100;
                  if ( $leftovr != 0 ) {
                      $tholdfile_fmt = "ge${fmt_pwpfthold}";
                  } else {
                      $tholdfile_fmt = "ge${fmt_pwpfthold}.0";
                  }
              }
          }


          print <<<EOF
              <div id="period${cnt}_$divid" style="display:$display;">
                <table cellspacing="0" cellpadding="0" width="100%" align="center" border="0">
                  <tr>
                    <td bgcolor="#C0E0EE" style="padding-left:13px; padding-top:9px;padding-bottom:3px;">
                      <b> Probability of $tabletitle Accumulating &ge; $txtamtarray[$ptr]" for the period $init_vtimes_full[$fhr_counter] - $end_vtimes_full[$fhr_counter]</b> 
                    </td>
                  </tr>
                  <tr>
                    <td align="center" style="padding-bottom:20px;">
                      <a href="/pwpf_${fpd}hr/prb_${fpd}h${ptype}_${tholdfile_fmt}_$file_fullddates[$fhr_counter]f$fhrarray[$fhr_counter].gif">
                        <img src="/pwpf_${fpd}hr/prb_${fpd}h${ptype}_${tholdfile_fmt}_$file_fullddates[$fhr_counter]f$fhrarray[$fhr_counter]_sm.gif" 
                          alt='${fpd}-Hour Probability of $tabletitle &ge; $txtamtarray[$ptr]" 
                          valid $init_vtimes_full[$fhr_counter] - $end_vtimes_full[$fhr_counter]'
                          title='${fpd}-Hour Probability of $tabletitle &ge; $txtamtarray[$ptr]" valid $init_vtimes_full[$fhr_counter] - $end_vtimes_full[$fhr_counter]' border="0"></a>
                    </td></tr>
                </table>
              </div>
EOF;
          $i ++;
      }
      
      print <<<EOF
            </td>

            <!-- End table column containing products (preview, day1, etc...) -->
          </tr>

        </table>
      </td>
    </tr>
  </table>
  </div>
EOF;

      $fhr_counter ++;
  }


?>

<!-- NOW SHOW THE COLUMN WITH THE VIEWING OPTIONS (EITHER DIFFERENT THRESHOLDS OR FORECAST DAYS)  -->


   <td valign="top" width="20%" bgcolor="#E4E4E4" style="border-top:2px solid #0A2390; border-right:2px solid #0A2390; border-bottom:2px solid #0A2390; display:table-cell;">
     <table cellspacing="0" cellpadding="0"  width="100%" border="0">
       <tr>
         <td align="center" style="padding-top:10px;">
           <div style="display:inline; font-size:10pt; font-weight:bold; text-decoration:underline;">
             Viewing Options
           </div>
         </td>
       </tr>
       <tr>
         <td style="padding-left:7px;padding-top:12px;padding-right:5px;">
           <span style="display:inline;">Choose an accumulation for the specified time:</span>
         </td>
       </tr>

       <!-- SHOW THRESHOLDS -->

       <tr id="tholds" style="display:block;">
         <td>
             <form name="threshold_select" style="display:inline;" onclick="select_parameter('parm_thold','inpage');" action="">
               
               <div style="margin-left:25px;margin-top:7px;">
<?php
           if ($ptype == "snow") {
               if ($fpd == 24) {
                   print <<<EOF
                   <input type="radio" name="threshold_choice" value="01" id="1inch" checked><label for="1inch">&ge; 1"</label><br>
                   <input type="radio" name="threshold_choice" value="02" id="2inch"><label for="2inch">&ge; 2"</label><br>
                   <input type="radio" name="threshold_choice" value="04" id="4inch"><label for="4inch">&ge; 4"</label><br>
                   <input type="radio" name="threshold_choice" value="06" id="6inch"><label for="6inch">&ge; 6"</label><br>
                   <input type="radio" name="threshold_choice" value="08" id="8inch"><label for="8inch">&ge; 8"</label><br>
                   <input type="radio" name="threshold_choice" value="12" id="12inch"><label for="12inch">&ge; 12"</label><br>
                   <input type="radio" name="threshold_choice" value="18" id="18inch"><label for="18inch">&ge; 18"</label><br>
EOF;
               } else {
                   print <<<EOF
                   <input type="radio" name="threshold_choice" value="02" id="2inch" checked><label for="2inch">&ge; 2"</label><br>
                   <input type="radio" name="threshold_choice" value="04" id="4inch"><label for="4inch">&ge; 4"</label><br>
                   <input type="radio" name="threshold_choice" value="08" id="8inch"><label for="8inch">&ge; 8"</label><br>
                   <input type="radio" name="threshold_choice" value="12" id="12inch"><label for="12inch">&ge; 12"</label><br>
                   <input type="radio" name="threshold_choice" value="18" id="18inch"><label for="18inch">&ge; 18"</label><br>
                   <input type="radio" name="threshold_choice" value="24" id="24inch"><label for="24inch">&ge; 24"</label><br>
                   <input type="radio" name="threshold_choice" value="30" id="30inch"><label for="30inch">&ge; 30"</label><br>
EOF;
               }
           } else {
               if ($fpd == 24) {
                   print <<<EOF
                   <input type="radio" name="threshold_choice" value="01" id="1_100inch" checked><label for="1_100inch">&ge; 0.01"</label><br>
                   <input type="radio" name="threshold_choice" value="10" id="1_10inch"><label for="1_10inch">&ge; 0.10"</label><br>
                   <input type="radio" name="threshold_choice" value="25" id="1_4inch"><label for="1_4inch">&ge; 0.25"</label><br>
                   <input type="radio" name="threshold_choice" value="50" id="1_2inch"><label for="1_2inch">&ge; 0.50"</label><br>
EOF;
               } else {
                   print <<<EOF
                   <input type="radio" name="threshold_choice" value="10" id="1_10inch" checked><label for="1_10inch">&ge; 0.10"</label><br>
                   <input type="radio" name="threshold_choice" value="25" id="1_4inch"><label for="1_4inch">&ge; 0.25"</label><br>
                   <input type="radio" name="threshold_choice" value="50" id="1_2inch"><label for="1_2inch">&ge; 0.50"</label><br>
                   <input type="radio" name="threshold_choice" value="100" id="1_inch"><label for="1_inch">&ge; 1.00"</label><br>
EOF;
               }
           }
?>
               </div>
             </form>
         </td>
       </tr>

       <tr>
         <td align="center" style="padding-top:15px;">
           <b>OR</b>
         </td>
       </tr>


       <!-- SHOW FORECAST VALID PERIODS...THESE WILL VARY -->

       <tr>
         <td style="padding-left:10px; padding-right:10px;padding-top:10px;">
           <span style="display:inline;">Choose a period for the specified amount:</span>
         </td>
       </tr>
       <tr id="fhrs" style="display:block;">
         <td>
           <form name="hour_select" style="display:inline;" onclick="select_parameter('parm_fhr','inpage');" action="">
             <div style="margin-left:10px;margin-top:7px;">
               <?php
                 $fhr_counter = 0;
                 while ($fhr_counter < count($fhrarray)) {
                     $id = ($fhr_counter*24) + $fpd;
                     if ($id < 100) {
                         $id = "0$id";
                     }
                     $divid = "fpd$id";
                     if ($fpd == 24) {
                         $daynum = $fhr_counter + 1;
                     } else {
                         $fstday = $fhr_counter + 1;
                         $sndday = $fhr_counter + 2;
                         $daynum = "$fstday-$sndday";
                     }

                     print <<<EOF
                       <input type="radio"  name="hour_choice" value="$divid $file_fullddates[$fhr_counter]" id="Day $daynum">
                       <label for="Day $daynum"><b>Day $daynum</b></label><br>
                         <span style="font-size:8pt; margin-left:35px;">
                           $init_vtimes_short[$fhr_counter] -<br> 
                         </span>
                         <span style="font-size:8pt; margin-left:35px;"> 
                           $end_vtimes_short[$fhr_counter]</span>
                         </span>
                         <br>
EOF;
                     $fhr_counter ++;
                 }
               ?>
             </div>
           </form>
         </td>

       </tr>
     </table>
   </td>

  </tr>
</table>

<!-- BELOW ARE LINKS TO LOOPS OF THE VARIOUS ELEMENTS.  THE DISPLAY OPTIONS FOR THEM ARE INITIALIZED IN THE JS CODE NEAR THE TOP.  -->

<div style="line-height:200%">&nbsp;</div>
<center>

<!--
THE LOOPS ARE SOMEWHAT COMPLICATED.  FOR LOOPING OVER A SINGLE THRESHOLD FOR ALL OF THE FORECAST DAYS, CALL:
(NOTE: ONLY FOR 24-HOUR AMOUNTS)

  "conus_pwpf_thold_loop_framework.php" and send:
     - the selected threshold
     - precipitation type
     This file creates the framework for the Flash Anis loop.  To make the configuration file, it calls:

     Within the "conus_pwpf_thold_loop_framework.php" file, the Flash loop needs to load a configuration file.
     This configuration file will also be a php script, named "conus_pwpfloop_thold.php" and it is called 
     from the framework file.

     Within the configuration file, there is a reference to another php script to create the list of files for the loop.
     This is the file "conus_tholdloop_files.php"

  ALL OF THIS HANDLES BOTH SNOW AND FREEZING RAIN CASES.
 
-->

  <div id="loop_tholds" style="font-size:1.2em;">
    <?php
      $thold_counter = 0;
      while ($thold_counter < count($tholdarray)) {
          $pwpf_thold = $selarray[$thold_counter];
   
          print <<<EOF
            <div id="loop_t$pwpf_thold" style="display:none;">
EOF;
          if ($fpd == 24) {
              print <<<EOF
              <a href="/pwpf/conus_pwpf_loop_framework.php?parmtype=thold&amp;value=$pwpf_thold&amp;ptype=$ptype"><b><u>
            Day 1-3 loop displaying the ${fpd}-hour probabilities of $looptext accumulating &ge; $txtamtarray[$thold_counter]"</u></b></a>
EOF;
          }
          print "</div>";

          $thold_counter ++;
      }
    ?>
  </div>

<!-- 
FOR LOOPING THROUGH ALL THRESHOLDS FOR A GIVEN FORECAST PERIOD (24 OR 48 HOURS), CALL:


div below handles situation of looping through thresholds for a given forecast day 
       For loops that display all thresholds for the 1 forecast day, we link to the file:
         - "conus_pwpf_fhr_loop.php" sending the forecast day, forecast hour and the ptype (snow or ice)
           This file creates the framework for the Flash Anis loop.
 
         - Within the "conus_pwpf_fhr_loop.php" file, the Flash loop needs to load a configuration file.  This will be in 
           the directory 'flash_config' and there is a separate file for each forecast day for snow and ice.
           Ex. conus_pwpf_ice_fhr_024.cfg

         - The flash config file then references a php page (in this directory) to create the list of files for the loop.
           This file is "conus_fhrloop_files.php"
  -->

  <div id="loop_fhrs" style="font-size:1.2em;">

    <?php
      $fhr_counter = 0;
      while ($fhr_counter < count($fhrarray)) {
          $id = ($fhr_counter*24) + $fpd;
          if ($id < 100) {
              $id = "0$id";
          }
          $divid = "fpd$id";

          print <<<EOF
            <div id="loop_$divid" style="display:none;">
              <a href="/pwpf/conus_pwpf_fhr_loop_framework_new.php?parmtype=thold&amp;fdate=$file_fullddates[$fhr_counter]&amp;fhr=$id&amp;fpd=$fpd&amp;ptype=$ptype"><b><u>
              Loop of all ${fpd}-hour $looptext probability thresholds valid $init_vtimes_full[$fhr_counter] - $end_vtimes_full[$fhr_counter]</u></b></a>
            </div>
EOF;
          $fhr_counter ++;
      }
    ?>
  </div> 
 
<div style="line-height:100%">&nbsp;</div>
</center>

<center>
<hr width="96%">
</center>

<!-- ADD LINKS FOR THE MAIN WINTER WEATHER PAGE AND GRIB 2 DOWNLOAD OPTIONS. -->
<center>

<div style="line-height:100%">&nbsp;</div>
<div style="font-size:1.4em;"><a href="/wwd/winter_wx.shtml">
  <b><u>HPC Winter Weather Products Home Page</u></b></a>
</div>

<div style="line-height:200%">&nbsp;</div>

<div style="font-size:1.2em;">
<a href="ftp://ftp.hpc.ncep.noaa.gov/pwpf/conus/pwpf_<?php print $fpd;?>hr"><b><u>Download GRIB 2 Probabilistic Winter Weather Guidance</u></b></a>
</div>


</center>

<div style="line-height:100%">&nbsp;</div>

     <!-- Add code for the footer -->
     <table cellSpacing="0" cellPadding="0" width="96%" border="0" align="center">
       <tbody>
       <?php include("../cwifooter2.html") ?>
       <tr vAlign="top">
         <td class="gray" colSpan="3">
         <?php
           echo "Page last modified: " . date("l, d-M-Y H:i:s", getlastmod() ) . " GMT";
         ?>
         </td>
       </tr>
       </tbody>
     </table>
    </td>

  </tr>
  </tbody>
</table>

</body>
</html>