///////////////////////////////
// See Your Folks calculation
///////////////////////////////


function submit(){

    var sel = document.getElementById("Example");
    console.log(sel);

    var country = sel.options[sel.selectedIndex].value;

    var querido = (Number(queridoAge.value));
    console.log("el valor de la variable 'querido' es: " + querido);

    var tu = (Number(tuAge.value));
    console.log("el valor de la variable 'tu' es: " + tu);

    var time = (Number(userTime.value));

    var maxEdad =0;
    if (querido>tu) {
    maxEdad = querido;
    }
    else {
    maxEdad = tu;
    }
    var result = ((country-maxEdad)*time);
    result = Math.round(result * 10) / 10;


    var yearsOver = (maxEdad-country);
    var queridoOver = (querido-country);
    var tuOver = (tu-country);

    var queridoResult = ((country-querido)*time);
    var tuResult = ((country-tu)*time);

    // maxEdad Result
    if (result > 0){
    document.getElementById("demo").innerHTML= "Verás a tu ser querido</br>" + " <span>" + result + "</span></br> " + "veces antes de que muera.";
    }
     else {
    document.getElementById("demo").innerHTML= "Tu ser querido ha vivido</br>" + " <span>" + yearsOver + "</span></br> " + "años más que la media. ¡Aprovecha cada minuto!";
    }


    // Alternative Results
    // if(document.getElementById("tuAge").value == ""){
    //     document.getElementById("demo").innerHTML= "You will see your Mum</br>" + " <span>" + queridoResult + "</span></br> " + "times before she is expected to die.";
    // }
    // if(document.getElementById("tuAge").value == "" & (querido > country)){
    //     document.getElementById("demo").innerHTML= "Your mum is living</br>" + " <span>" + queridoOver + "</span></br> " + "years beyond the age she is expected to die.";
    // }
    // if(document.getElementById("queridoAge").value == ""){
    //     document.getElementById("demo").innerHTML= "You will see your Dad</br>" + " <span>" + tuResult + "</span></br> " + "times before he is expected to die.";
    // }
    //  if(document.getElementById("queridoAge").value == "" & (tu > country)){
    //     document.getElementById("demo").innerHTML= "Your dad is living</br>" + " <span>" + tuOver + "</span></br> " + "years beyond the age he is expected to die.";
    // }


    // Validation
    if(document.getElementById("queridoAge").value == "" & document.getElementById("tuAge").value == ""){
        document.getElementById("demo").innerHTML= "You need to enter at least one of your parent's age.";
    }
    if(document.getElementById("userTime").value == ""){
        document.getElementById("demo").innerHTML= "You need to enter how many times a year you see your parents on average.";
    }
    if(document.getElementById("userTime").value == "0"){
        document.getElementById("demo").innerHTML= "You need to input a number larger than 0.";
    }


    // If Result is 0
    if(document.getElementById("queridoAge").value == country){
        document.getElementById("demo").innerHTML= "En su país tu familiar ha llegado a la esperanza media de vida.";
    }
    if(document.getElementById("tuAge").value == country){
        document.getElementById("demo").innerHTML= "Has llegado a la esperanza media de vida.";
    }
    if(maxEdad == country){
        document.getElementById("demo").innerHTML= "¡Aprovecha cada minuto que os queda poco tiempo!.";
    }

    // If Result returns a NaN
    if (isNaN(queridoResult)) {
        document.getElementById("demo").innerHTML= "Ups...ha habido un error.";
    }
    if (isNaN(tuResult)) {
        document.getElementById("demo").innerHTML= "Ups...ha habido un error.";
    }

  }

///////////////////////////////
// Limits input fields to numbers
///////////////////////////////



///////////////////////////////
// Div fade transitions
///////////////////////////////


$('#btn').click(function(e){
  $('#calculator, .slogan').fadeOut('slow', function(){
    $('#results').fadeIn('slow');
  });
});


$('#btnNext').click(function(e){
  $('#results').fadeOut('slow', function(){
    $('#calculator,.slogan, h1').fadeIn('slow');
  });
});


$('#btnStart').click(function(e){
  $('#worldResults').fadeOut('slow', function(){
    $('#calculator ,.slogan, h1').fadeIn('slow');
  });
});


// fade in #back-top
$(function () {

// scroll body to 0px on click
$('#btn').click(function () {
    $('body,html').animate({
        scrollTop: 0
    }, 800);
    return false;
});

// scroll body to 0px on click
$('#btnNext').click(function () {
    $('body,html').animate({
        scrollTop: 0
    }, 800);
    return false;
    });
});


///////////////////////////////
// Country dropdown styles
///////////////////////////////


$(function(){
    $('select.styled').customSelect();
});


///////////////////////////////
// Share Buttons
///////////////////////////////


$('.popup').click(function(event) {
    var width  = 575,
        height = 400,
        left   = ($(window).width()  - width)  / 2,
        top    = ($(window).height() - height) / 2,
        url    = this.href,
        opts   = 'status=1' +
                 ',width='  + width  +
                 ',height=' + height +
                 ',top='    + top    +
                 ',left='   + left;

    window.open(url, 'twitter', opts);

    return false;
  });


///////////////////////////////
// Stellar Scroll
///////////////////////////////

jQuery(document).ready(function ($) {


    //initialise Stellar.js
    $(window).stellar();

    //Cache some variables
    var links = $('.navigation').find('li');
    slide = $('.slide');
    button = $('.button');
    mywindow = $(window);
    htmlbody = $('html,body');


    //Setup waypoints plugin
    slide.waypoint(function (event, direction) {

        //cache the variable of the data-slide attribute associated with each slide
        dataslide = $(this).attr('data-slide');

        //If the user scrolls up change the navigation link that has the same data-slide attribute as the slide to active and
        //remove the active class from the previous navigation link
        if (direction === 'down') {
            $('.navigation li[data-slide="' + dataslide + '"]').addClass('active').prev().removeClass('active');
        }
        // else If the user scrolls down change the navigation link that has the same data-slide attribute as the slide to active and
        //remove the active class from the next navigation link
        else {
            $('.navigation li[data-slide="' + dataslide + '"]').addClass('active').next().removeClass('active');
        }

    });

    //waypoints doesnt detect the first slide when user scrolls back up to the top so we add this little bit of code, that removes the class
    //from navigation link slide 2 and adds it to navigation link slide 1.
    mywindow.scroll(function () {
        if (mywindow.scrollTop() == 0) {
            $('.navigation li[data-slide="1"]').addClass('active');
            $('.navigation li[data-slide="2"]').removeClass('active');
        }
    });

    //Create a function that will be passed a slide number and then will scroll to that slide using jquerys animate. The Jquery
    //easing plugin is also used, so we passed in the easing method of 'easeInOutQuint' which is available throught the plugin.
    function goToByScroll(dataslide) {
        htmlbody.animate({
            scrollTop: $('.slide[data-slide="' + dataslide + '"]').offset().top
        }, 1400, 'easeInOutQuint');
    }



    //When the user clicks on the navigation links, get the data-slide attribute value of the link and pass that variable to the goToByScroll function
    links.click(function (e) {
        e.preventDefault();
        dataslide = $(this).attr('data-slide');
        goToByScroll(dataslide);
    });

    //When the user clicks on the button, get the get the data-slide attribute value of the button and pass that variable to the goToByScroll function
    button.click(function (e) {
        e.preventDefault();
        dataslide = $(this).attr('data-slide');
        goToByScroll(dataslide);

    });


});