<?php

/**
 * Default home page view
 *  
 * @author Adam Surplice
 * @version 1.0
 */

global $GoogleAPIKey;

$this->headscript()->appendFile("scripts/common.js"); // Common JS functions
$this->headscript()->appendFile("http://www.google.com/jsapi?key=$GoogleAPIKey"); // Google API javascript
$this->headscript()->appendFile("scripts/postcodemap.js"); // Javascript functions for this page


$this->headTitle ( 'In Your Area' );
$this->placeholder ('title' )->set ( 'In Your Area' );
$this->placeholder('backgroundimage')->set("bg_plain.jpg");

?>
<script>
  google.load("earth", "1");
  google.setOnLoadCallback(init);

  var ge = null;

  function init() {
    // Google earth plugin:
    google.earth.createInstance("googlemap", initCallback, failureCallback);
  }
  
  function initCallback(object) {
    
    ge = object;
    ge.getWindow().setVisibility(true);
    ge.getLayerRoot().enableLayerById(ge.LAYER_ROADS, true); 
    ge.getLayerRoot().enableLayerById(ge.LAYER_BORDERS, true);
    ge.getOptions().setAtmosphereVisibility(true);
    ge.getOptions().setMouseNavigationEnabled(true);
//    ge.getNavigationControl().setVisibility(ge.VISIBILITY_SHOW);
    
    la = ge.createLookAt('');
    la.set(-27.0,150.0,0,ge.ALTITUDE_RELATIVE_TO_GROUND,0,0,7000000);
    ge.getView().setAbstractView(la);
    
  }

  function failureCallback(object) {
  
  }
</script>

<div id="left_panel">
    <fieldset class="postcodemap" style="height:100px;">
      <legend>Show on the Globe</legend> 
      <label for="eNightlyCost">Postcode:</label>
      <input class="textinput" type="text" name="ePostcode" id="ePostcode"/><br/>
      
      <label for="cbCountryID">Country:</label>
      <select class="textinput" name="cbCountryID" id="cbCountryID"/>
        <option value="AUS">Australia</option>
        <option value="NZL">New Zealand</option>
      </select>
      <br/>

      <a class="submitbutton" style="margin-right: 40px;" href="#" onClick="LocatePostcode();"  
         onMouseOver="javascript:document.bn_calculate.src='images/bh_locate.jpg';" 
         onMouseOut="javascript:document.bn_calculate.src='images/bn_locate.jpg';" >
      <img name="bn_calculate" border=0 src="images/bn_locate.jpg"></a>

    </fieldset>
    
    <br/><br/><br/>
    
    <fieldset class="postcodemap" style="height:100px;">
      <legend>Result</legend> 
      <div id="results"></div>
    </fieldset>
    
</div>


<div id="right_panel">
  <div id="googlemap" class="ChartContainer"></div>
</div>

