/*
Code from the article "Use Ajax and PHP to Build Your Mailing List"
by Aarron Walter (aarron@aarronwalter.com)
http://www.sitepoint.com/article/use-ajax-php-build-mailing-list

Adapted by Jen Borkowski
*/


// Attach handler to window load event
Event.observe(window, 'load', init, false);

function init() {
  // Attach handler to form's submit event
  Event.observe('newsletter-form', 'submit', storeAddress);
}

function storeAddress(e) {

  //Validating user data
  $('newsletter-form-response').innerHTML = 'Checking form data...';

  // Update user interface
  $('newsletter-form-response').innerHTML = 'Adding email address...';

  // Prepare query string and send AJAX request
  var myAjax = new Ajax.Updater('', '/mailchimp/ajaxServer.aspx?url=http://api.mailchimp.com/1.1/', {
    method: 'get', 
    parameters: Form.serialize(this),
    onSuccess: function(resp){
      if(resp.responseText=="true"){
        $('newsletter-form-response').innerHTML = 'Thank you, please check your inbox for a confirmation email and follow the link to complete your subscription.';
        Form.reset("newsletter-form");
      } else {
		var jsonObj = eval('(' + resp.responseText + ')'); 
        if(jsonObj.code=="214"){
          $('newsletter-form-response').innerHTML = '<span style="color:#990000;">This email address is already subscribed to Opportunity Finance Network&#39;s e-Newsletter.</span>';
        } else if(jsonObj.code=="502"){
          $('newsletter-form-response').innerHTML = '<span style="color:#990000;">You must enter a valid email address.</span>';
        } else {
		  alert(jsonObj.code);
          $('newsletter-form-response').innerHTML = '<span style="color:#990000;">We are not able to complete your subscription to the e-Newsletter at this time. Please email Jeffrey Gelt (<a href="mailto:jgelt@opportunityfinance.net">jgelt@opportunityfinance.net</a>) for assistance.</span>';
        }
      }
    }
  });

  // Stop form from submitting when JavaScript is enabled
  Event.stop(e);

}


function toggle_visibility(id) {

  var form = document.getElementById(id);

  // This handles the darkening of the background
  // First we see if the dark layer exists
  //var dark=document.getElementById('darkenScreenObject');
  //if (!dark) {
    // The dark layer doesn't exist, it's never been created.  So we'll
    // create it here and apply some basic styles.
    //var tbody = document.getElementsByTagName("body")[0];
    //var tnode = document.createElement('div');          // Create the layer.
        //tnode.style.backgroundColor='rgb(0, 0, 0)';     // Make it black.
        //tnode.style.opacity='0.7';                      // Set the opacity (firefox/Opera)
        //tnode.style.MozOpacity='0.70';                  // Firefox 1.5
        //tnode.style.filter='alpha(opacity=70)';         // IE.
        //tnode.style.zIndex='1';                         // Zindex of 50 so it "floats"
        //tnode.style.position='absolute';                // Position absolutely
        //tnode.style.top='0px';                          // In the top
        //tnode.style.left='0px';                         // Left corner of the page
        //tnode.style.overflow='hidden';                  // Try to avoid making scroll bars            
        //tnode.style.display='none';                     // Start out Hidden
        //tnode.id='darkenScreenObject';                  // Name it so we can find it later
    //tbody.appendChild(tnode);                           // Add it to the web page
    //dark=document.getElementById('darkenScreenObject'); // Get the object.
  //}
  //dark.style.display='none';

  //open or close the darkening object as appropriate
  if(form.style.display == "block") {
    form.style.display = "none";
  } else {

    // Calculate the page width and height 
    if( window.innerHeight && window.scrollMaxY )  { 
      //FF on PC 
      var pageWidth = window.innerWidth + window.scrollMaxX;
      var pageHeight = window.innerHeight + window.scrollMaxY;
    } else if( document.body.scrollHeight > document.body.offsetHeight ) {
      //Safari
      var pageWidth = document.body.scrollWidth;
      var pageHeight = document.body.scrollHeight;
    } else { 
      //FF on Mac, IE7, IE6
      var pageWidth = document.body.offsetWidth + document.body.offsetLeft; 
      var pageHeight = document.body.offsetHeight + document.body.offsetTop; 
    }

    //set the shader to cover the entire page and make it visible. 
    //dark.style.width= pageWidth+'px';
    //dark.style.height= pageHeight+'px';
    //dark.style.display='block';                                

    //Used to calculate top and left absolute positions
    var scrollTop = 0;
    if (document.documentElement && document.documentElement.scrollTop) {
      //IE6, PC FF 1.5
      scrollTop = document.documentElement.scrollTop;
    } else if (document.body) {
      //IE7, PC FF 2.x, Mac FF 2.x, Safari
      scrollTop = document.body.scrollTop;
    }

    // Make the form visible and set the zindex so its on top of everything else
    form.style.zIndex='100';    
    form.style.display='block';

    //Set the position and dimensions of the shader and make it visible
    //dark.style.top = (scrollTop+Math.floor((document.documentElement.clientHeight/2)-(form.offsetHeight/2))-20)+'px';
    //dark.style.left = (Math.floor((document.documentElement.clientWidth/2)-(form.offsetWidth/2))-20)+'px';
    //dark.style.height = '540px';
    //dark.style.width = '500px';
    //dark.style.display = 'block';

    // set the starting x and y position of the form
    form.style.top=scrollTop+Math.floor((document.documentElement.clientHeight/2)-(form.offsetHeight/2))+'px';
    form.style.left=Math.floor((document.documentElement.clientWidth/2)-(form.offsetWidth/2))+'px';

  }
}