/* $Id: index.js,v 1.13 2010/03/22 19:25:00 sap Exp $ */

/* 
 * 
 * slideshow docs: http://jquery.malsup.com/cycle/int2.html
 * 
 */

$(document).ready(function () {

    
    // stop slides, show form...
    $('#show_form').click(function () {
        $('div#slideshow').cycle('stop');
        $('div#slideshow').hide();
        $('div#form_links form').show();
        $('a#show_form').hide();
        
        return false;
    });
    
    // hide form, show slides...
    $('div#form_closer a').click(function () {
        // $('div#slideshow').cycle('start'); // there is no start!
        $('div#form_links form').hide();
        $('a#show_form').show();
        $('div#slideshow').show();
        next_b2_cycle();

        return false;
    });
    
    
    // dates
    $('#f-date').datepicker();

    $('#sel_date').click(function () {
        $('#f-date').datepicker('show');
        return false;
    });
    
    // reset error
    $('div#form_links input#f-name').change(function(e){
        clear_error('name', 'input');
    });
        
    $('div#form_links input#f-email').change(function(e){
        clear_error('email', 'input');
    });
        
    $('div#form_links input#f-phone').change(function(e){
        clear_error('phone', 'input');
    });
        
    $('div#form_links input#f-date').change(function(e){
        clear_error('date', 'input');
    });
        
    $('div#form_part2 input#f-venue').change(function(e){
        clear_error2('venue', 'input');
    });
        
    $('div#form_part2 select#f-budget').change(function(e){
        clear_error2('budget', 'select');
    });
        
    $('div#form_part2 input#f-album_yes').change(function(e){
        clear_error3('album', 'input');
    });
        
    $('div#form_part2 input#f-album_no').change(function(e){
        clear_error3('album', 'input');
    });
        
    $('div#form_part2 select#f-hearabout').change(function(e){
        clear_error2('hearabout', 'select');
    });
        
    $('div#form_part2 input#f-referral').change(function(e){
        clear_error2('referral', 'input');
    });
        
    $('div#form_part2 input#f-other').change(function(e){
        clear_error2('other', 'input');
    });
        
    $('div#form_part2 textarea#f-about').change(function(e){
        clear_error2('about', 'textarea');
    });
        
    // check availability form
    $('a#form_submit').click(function(e){
                    
        var isvalid = true;
        var reg_email = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;
        var reg_date = /^\d{2}\/\d{2}\/\d{4}$/;
        clear_errors();
        
            // validate...
            if ($('input#f-name').val() == '')
                isvalid = set_error('input', 'name', 'Name is required');
            
            if (! reg_email.test($('input#f-email').val()) && $('input#f-phone').val() == '')
            {                
                if (! reg_email.test($('input#f-email').val())) 
                    isvalid = set_error('input', 'email', 'invalid Email');
                else if ($('input#f-phone').val() == '')
                    isvalid = set_error('input', 'phone', 'Email or Phone is required');
            }

            if (! reg_date.test($('input#f-date').val()))
                isvalid = set_error('input', 'date', 'Date is required (MM/DD/YYYY)');
        
            if (isvalid) // go to part2 fields...
            {
            $('#connect_confirm_message').hide();
            var height = $('div#pop').height();
            var top_val = e.pageY - (height / 2) + "px";
            $('div#pop_bg').show();
            $('#form_part2').show();

            $('div#pop').removeClass('pop_blue');
            $('div#pop').addClass('pop_lblue');
            $('div#pop').centerInClient();
            $('div#pop').show('slow');
            return false;                
            }

        return false;
    });
    
    // form 2 select menu extras
    $('#f-hearabout').change(function(e){
        
        var selected = $(this).val();
        
            if (selected == 'referral')
            {
            $('#f-referral').show();
            $('#f-other').hide();
            $('#f-other').val('');
            }
            else if (selected == 'other')
            {
            $('#f-other').show();
            $('#f-referral').hide();
            $('#f-referral').val('');
            }
            else
            {
            $('#f-referral').hide();
            $('#f-referral').val('');
            $('#f-other').hide();
            $('#f-other').val('');
            }
        
        return false;
        
    });

    // check availability form part2
    $('a#form_submit_part2').click(function(e){
        
        var isvalid = true;
        clear_errors();
        
            // validate...
            if ($('input#f-venue').val() == '')
                isvalid = set_error('input', 'venue', 'Venue is required');
            
            if ($('select#f-budget').val() == '')
                isvalid = set_error('select', 'budget', 'Budget is required');
                
            if (! $('input[name=f-album]:checked').val()) // only way to test radio btn!!!
            {            
            isvalid = set_error('input', 'album', 'Album yes/no is required');
            isvalid = set_error('input', 'album_no', 'Album yes/no is required');
            isvalid = set_error('input', 'album_yes', 'Album yes/no is required');
            }
            
            if ($('select#f-hearabout').val() == '')
                isvalid = set_error('select', 'hearabout', 'This field is required');
            
            else if ($('select#f-hearabout').val() == 'referral' && 
                $('input#f-referral').val() == '')
                isvalid = set_error('input', 'referral', 'This field is required');
            
            else if ($('select#f-hearabout').val() == 'other' && 
                $('input#f-other').val() == '')
                isvalid = set_error('input', 'other', 'This field is required');
            
            if ($('textarea#f-about').val() == '')
                isvalid = set_error('textarea', 'about', 'About your wedding is required');
            

            if (isvalid)
            {
                $.post(
                    '/cgi-bin/connect.php',
                    {
                        name: $('input#f-name').val(),
                        email: $('input#f-email').val(),
                        phone: $('input#f-phone').val(),
                        date: $('input#f-date').val(),
                        venue: $('input#f-venue').val(),
                        budget: $('select#f-budget').val(),
                        album: $('input[name=f-album]:checked').val(),
                        hearabout: $('select#f-hearabout').val() + ' ' +
                                   $('input#f-referral').val() +
                                   $('input#f-other').val(),
                        about: $('textarea#f-about').val()
                    },
                    function(data)
                    {
                    clear_fields();
                    }
                );
                
            $('div#form_part2').hide();
            var height = $('div#pop').height();
            var top_val = e.pageY - (height / 2) + "px";
            $('div#pop_bg').show();
            $('#connect_confirm_message').show();
            
            $('div#pop').removeClass('pop_lblue');
            $('div#pop').addClass('pop_blue');
            $('div#pop').centerInClient();
            $('div#pop').show('slow');
            return false;
            }

        return false;
    });
    
    // click popup close [x]
    $('div#pop div#close a').click(function(){
        $('div#pop_bg').hide();
        $('div.mm_content').hide();
        $('div#pop').hide();
        return false;
    });

    // click out of popup to close
    $('div#pop_bg').click(function(){
        $('div#pop_bg').hide();
        $('div.mm_content').hide();
        $('div#pop').hide();
        return false;
    });    
    
});

// clear_errors()
function clear_errors () {
    $('div#form_links label').removeClass('error_field');
    $('div#form_links input').removeClass('error_field');
    
    $('div#form_part2 label').removeClass('error_field');
    $('div#form_part2 input').removeClass('error_field');
    $('div#form_part2 select').removeClass('error_field');
    $('div#form_part2 textarea').removeClass('error_field');
}

// clear_error()
function clear_error (id, type) {
    $('div#form_links label#label-' + id).removeClass('error_field');
    $('div#form_links ' + type + '#f-' + id).removeClass('error_field');
}

// clear_error2()
function clear_error2 (id, type) {
    $('div#form_part2 label#label-' + id).removeClass('error_field');
    $('div#form_part2 ' + type + '#f-' + id).removeClass('error_field');
}

// clear_error3()
function clear_error3 (id, type) {
    $('div#form_part2 label#label-' + id).removeClass('error_field');
    $('div#form_part2 ' + type + '[name=f-' + id + ']').removeClass('error_field');
}

// clear_fields()
function clear_fields () {
    $('input#f-name').val('');
    $('input#f-email').val('');
    $('input#f-phone').val('');
    $('input#f-date').val('');
    $('input#f-venue').val('');
    $('select#f-budget').val('');
    $('input#f-album_yes').attr('checked', 1);
    $('input#f-album_no').attr('checked', 0);
    $('select#f-hearabout').val('');
    $('input#f-referral').val('');
    $('input#f-other').val('');
    $('textarea#f-about').html('');
    $('textarea#f-about').val('');
    $('input#f-referral').hide('');
    $('input#f-other').hide('');
}

// set_error()
function set_error (tag, id, message) {
    //alert('set_error() ' + id);
    $(tag + '#f-' + id).attr('title', message);
    $(tag + '#f-' + id).addClass('error_field');
    $('label#label-' + id).addClass('error_field');
    return false;
}

// http://www.west-wind.com/weblog/posts/459873.aspx
$.fn.centerInClient = function(options) {
    /// <summary>Centers the selected items in the browser window. Takes into account scroll position.
    /// Ideally the selected set should only match a single element.
    /// </summary>    
    /// <param name="fn" type="Function">Optional function called when centering is complete. Passed DOM element as parameter</param>    
    /// <param name="forceAbsolute" type="Boolean">if true forces the element to be removed from the document flow 
    ///  and attached to the body element to ensure proper absolute positioning. 
    /// Be aware that this may cause ID hierachy for CSS styles to be affected.
    /// </param>
    /// <returns type="jQuery" />
    var opt = { forceAbsolute: false,
                container: window,    // selector of element to center in
                completeHandler: null
              };
    $.extend(opt, options);
   
    return this.each(function(i) {
        var el = $(this);
        var jWin = $(opt.container);
        var isWin = opt.container == window;

        // force to the top of document to ENSURE that 
        // document absolute positioning is available
        if (opt.forceAbsolute) {
            if (isWin)
                el.remove().appendTo("body");
            else
                el.remove().appendTo(jWin.get(0));
        }

        // have to make absolute
        el.css("position", "absolute");

        // height is off a bit so fudge it
        var heightFudge = isWin ? 2.0 : 1.8;

        var x = (isWin ? jWin.width() : jWin.outerWidth()) / 2 - el.outerWidth() / 2;
        var y = (isWin ? jWin.height() : jWin.outerHeight()) / heightFudge - el.outerHeight() / 2;

        el.css("left", x + jWin.scrollLeft());
        el.css("top", y + jWin.scrollTop());

        // if specified make callback and pass element
        if (opt.completeHandler)
            opt.completeHandler(this);
    });
}

function popup(url){
	var win_w, win_h;
	win_w = screen.availWidth; 
	win_h = screen.availHeight; 
	myWindow = window.open(url, "", "top=1, left=1, width=" + win_w + ", height=" + win_h + ", toolbar=no,location=no,directories=no,status=yes,menubar=no,scrollbars=yes,resizable=yes");
	if (!myWindow.opener) myWindow.opener = self;
	//window.close();
}




/* next_b2: loop images */
function next_b2_cycle() {
    $('div#slideshow').cycle({ 
        fx: 'scrollLeft',
        speed: 800,
        timeout: 5000
    });
}
    
next_b2_cycle();





