/********************************************************************
    File:   
        common.js
    Brief:  
        -
    Author:
        DigitalCavalry
    Author URI:
        http://themeforest.net/user/DigitalCavalry
*********************************************************************/
                                                           
/**************************************
   SMART IMAGE PEVIEW FOR TEXT LABELS
***************************************/

var popupimg = new Object();
// other then false then mini loader is displayed
popupimg.show_loader = false;
// handle to displayed image - variable help prevent hover overlap on real web serwer
// then user move cursor on other thumb, function compare new thumb handle 
// with one saved in this variable, then there is difference this is signal for
// old hovered action that new action is actualy start in work
popupimg.handle = null;
// width of displayed image  
popupimg.width = 0;
 // height of displayed image 
popupimg.height = 0;
// cursor X and Y postion in text label hover moment
popupimg.txtHoverX = 0;
popupimg.txtHoverY = 0;
popupimg.topChanged = false;

// function display image preview, the path to iamge is saved in attribute "rel"
popupimg.setup = function()
{
    // for every object with popup class
    $('.popup-img-left, .popup-img-right, .popup-img-center').hover(function(e)
    {
        // save handle in global variable
        popupimg.handle = this;
        // image preview container x,y offset form the cursor position
        var offsetX = 0;       
        var offsetY = -15;
        // keep hovered object handle in local variable
        var hoveredObject = this;        
        // get path to image file
        var imagePath = $(this).attr('rel');
  
        // adding to page image preview container
        $('body').append(
            "<div id='popup-img'><div id='popup-img-image'></div></div>");
            
        $('body').append("<div id='popup-img-loader'></div>");
        $('#popup-img-loader')
                    .stop()
                    .css('opacity', 0.0)
                    .css('left', (e.pageX + 8) + 'px')
                    .css('top', (e.pageY - 24) + 'px')
                    .animate({opacity: 1.0}, 400);        
        popupimg.show_loader = true;
            
        // hide image preview container, this is necessary to correctly call show function
        $('#popup-img').hide();
          
            // create new image object
            var img = new Image();
            // bind function to object which gona be called when new image loading is finished
            $(img).load(function() 
            {
                // check image preview overlap
                if(popupimg.handle != hoveredObject)
                {
                    // in new image preview is in progress function return control
                    return;
                }
                // save image width and height in global variables
                popupimg.width = img.width;
                popupimg.height = img.height;
                
                if($(hoveredObject).hasClass('popup-img-left'))
                {
                    offsetX = -20 -popupimg.width;
                } else
                if($(hoveredObject).hasClass('popup-img-right'))
                {
                    offsetX = 20;
                } else
                if($(hoveredObject).hasClass('popup-img-center'))
                {
                    offsetX = -(popupimg.width / 2);
                }
                               

                // check space available space in browser window
                popupimg.txtHoverX = e.pageX;
                popupimg.txtHoverY = e.pageY;
                var browserWidth = $(window).width();
                var browserHeight = $(window).height();
                var preLeft = e.pageX + offsetX;
                var preTop = e.pageY + offsetY - popupimg.height;
                
                if(popupimg.height > e.clientY)
                {
                   preTop +=  popupimg.height - (offsetY*2);
                   popupimg.topChanged = true;
                }
                if(preLeft < 0)
                {
                    preLeft = 30 + (e.pageX - popupimg.txtHoverX);
                }
                // check space on right
                if(preLeft + popupimg.width > browserWidth)
                {
                    preLeft = browserWidth - popupimg.width - 30 + (e.pageX - popupimg.txtHoverX) + (e.pageX - e.clientX);
                }
               
                // add image to preview container
                $('#popup-img-image').html(this);
                $('#popup-img-image').css('height', popupimg.height);        

                // set image preview container style,
                // we must set width of container, the height is calculated automaticly based on image height
                // we must set also image container position, make it visible and set opacity to max
                $('#popup-img').hide()
                    .css("height", "auto")
                    .css("width", (popupimg.width)+"px")
                    .css("left", preLeft + "px")
                    .css("top", preTop + "px")
                    .css("visibility", "visible")
                    .css("opacity", "1.0")
                    .show("fast");
                popupimg.show_loader = false;
                $("#popup-img-loader").stop().animate({opacity: 0.0}, 400, function(){$(this).remove()});
                   
                // image opacity we animate separately
                $(this).css("margin", "0px").css("padding", "0px").css("opacity", "0.0").animate({opacity: 1.0}, 800);
                 
            // set new value for "src" attribute, this me     
            }).attr('src', imagePath);

    },
    // when hover is out, we need to remove #imagePreview container from page
    function()
    {
        // remove image preview container from page
        $("#popup-img-image").find("img").stop().remove();
        $("#popup-img-image").remove();
        $("#popup-img").stop().remove(); 
        popupimg.handle = null;
        popupimg.show_loader = false;
        popupimg.topChanged = false;
        $("#popup-img-loader").stop().remove()
         
        
    });    
    
    // for every image preview thumb we bind function to mouse move event, 
    // this allow user to move the tooltip with mouse cursor in are of the thumb
    $('.popup-img-left, .popup-img-right, .popup-img-center').mousemove(
        function(e)
        {
            // image preview container x,y offset form the cursor position
            var offsetX = 0;
            if($(this).hasClass('popup-img-left'))
            {
              offsetX = -20 - popupimg.width;
            } else
            if($(this).hasClass('popup-img-right'))
            {
              offsetX = 20;
            } else
            if($(this).hasClass('popup-img-center'))
            {
              offsetX = -popupimg.width / 2;
            }
            
            var offsetY = -15; 
            
            // check space available space in browser window 
            var preLeft = e.pageX + offsetX;
            var preTop = e.pageY + offsetY - popupimg.height;
            // check space on top
            
            if(popupimg.height > e.clientY || popupimg.topChanged == true)
            {
                if(popupimg.topChanged == true)
                {
                   preTop += popupimg.height - (offsetY*2);
                }
            }
            // check space on left
            if(preLeft < 0)
            {
              preLeft = 30 + (e.pageX - popupimg.txtHoverX);
            }
            // check space on right
            var browserWidth = $(window).width(); 
            if(preLeft + popupimg.width > browserWidth)
            {
              preLeft = browserWidth - popupimg.width - 30 + (e.pageX - popupimg.txtHoverX) + (e.pageX - e.clientX);
            }            
                   
            // change image preview container position
            $("#popup-img")
                .css("top", preTop + "px")
                .css("left", preLeft + "px");
                
            if(popupimg.show_loader)
            {
                $("#popup-img-loader")
                    .css("left", (e.pageX + 8) + "px")
                    .css("top", (e.pageY - 24) + "px");            
            }
        });       
};

/**********************************************
    CONTACT PAGE
***********************************************/

function setupContactForm()
{
    $('#contact-form #contact-send').focus(function(){$(this).blur();})  
    
    $('#contact-form #contact-send').click(
        function() 
        {
            // get all data
            var name = $('#contact-form #contact-name').val(); 
            var mail = $('#contact-form #contact-mail').val();
            var subject = $('#contact-form #contact-subject').val();
            var message = $('#contact-form #contact-message').val(); 
            var maildest = $('#contact-form #contact-mail-dest').val();
            var okay = $('#contact-form #contact-okay').val(); 
            var error = $('#contact-form #contact-error').val();
            var themeurl = $('#contact-form #contact-theme-url').val();            
            
            // check user name
            var allok = true;
            if(name == '')
            {
                $('#contact-form #contact-name').css('border', '1px solid #BB0000');
                allok = false;
            } else
            {
                $('#contact-form #contact-name').css('border', '1px solid #DEDEDE');
                $('#contact-form #contact-name').css('border-top', '1px solid #CCCCCC');
                $('#contact-form #contact-name').css('border-left', '1px solid #CCCCCC');             
            }

            // check email
            var regExp = new RegExp(/^[-a-z0-9~!$%^&*_=+}{\'?]+(\.[-a-z0-9~!$%^&*_=+}{\'?]+)*@([a-z0-9]([-a-z0-9_]?[a-z0-9])*(\.[-a-z0-9_]+)*\.(aero|arpa|biz|com|coop|edu|gov|info|int|mil|museum|name|net|org|pro|travel|mobi|[a-z]{2})|([1]?\d{1,2}|2[0-4]{1}\d{1}|25[0-5]{1})(\.([1]?\d{1,2}|2[0-4]{1}\d{1}|25[0-5]{1})){3})(:[0-9]{1,5})?$/i);
            // check email address, if result is null the email string dont match to pattern
            var resultExp = regExp.exec(mail);            
            if(mail == '' || resultExp == null)
            {
                $('#contact-form #contact-mail').css('border', '1px solid #BB0000');
                allok = false;
            } else
            {
                $('#contact-form #contact-mail').css('border', '1px solid #DEDEDE');
                $('#contact-form #contact-mail').css('border-top', '1px solid #CCCCCC');
                $('#contact-form #contact-mail').css('border-left', '1px solid #CCCCCC');             
            }
            
            // check subject
            if(subject == '')
            {
                $('#contact-form #contact-subject').css('border', '1px solid #BB0000');
                allok = false;
            } else
            {
                $('#contact-form #contact-subject').css('border', '1px solid #DEDEDE');
                $('#contact-form #contact-subject').css('border-top', '1px solid #CCCCCC');
                $('#contact-form #contact-subject').css('border-left', '1px solid #CCCCCC');             
            } 
            
            // check message
            if(message == '')
            {
                $('#contact-form #contact-message').css('border', '1px solid #BB0000');
                allok = false;
            } else
            {
                $('#contact-form #contact-message').css('border', '1px solid #DEDEDE');
                $('#contact-form #contact-message').css('border-top', '1px solid #CCCCCC');
                $('#contact-form #contact-message').css('border-left', '1px solid #CCCCCC');             
            }                          
            $('#contact-form .result').slideUp(150);
            
            
            function callback(data)
            {   
                // if success        
                if(data == "okay")
                {   
                    $('#contact-form .result').css('color', '#000000');
                    $('#contact-form .result').text(okay);
                    $('#contact-form .result').slideDown(300);
                    
                    $('#contact-form #contact-name').val('');
                    $('#contact-form #contact-mail').val(''); 
                    $('#contact-form #contact-subject').val('');
                    $('#contact-form #contact-message').val('');                                      
                } else // if error/problem during email sending in php script
                {
                    $('#contact-form .result').css('color', '#000000');
                    $('#contact-form .result').text(error);
                    $('#contact-form .result').slideDown(300);             
                }
            }             
            
            if(allok)
            {       
                // build data string for post call
                var data = "name="+name;
                data += "&"+"mail="+mail;
                data += "&"+"subject="+subject;
                data += "&"+"message="+message;
                data += "&"+"maildest="+maildest; 
                
                // try to send email via php script executed on server
                $.post(themeurl+'/php/sendmessage.php', data, callback, "text");
            } 
        });  
}

/**********************************************
    SUMBIT POST COMMENT FORM
***********************************************/

function setupRespondForm()
{
   $('#respond #respond-send').focus(function(){$(this).blur();})   
}


/**********************************************
    MAIN CODE - CALLED THEN PAGE SI LOADED
***********************************************/

$(document).ready(
    function()
    {
         
       $('a').focus(function(){$(this).blur();})
       popupimg.setup();
       setupContactForm();
       setupRespondForm();
       slider_a.setup('#slider-a-container'); 
       slider_a_f.setup('#slider-af-container');
       
       
       
    }         
);