/*
 * Some simple form validation and input modification functions for displaying form help info
*/

// ready to go only when page has completed loading
$(document).ready(function(){

    // reveal title info div using animate
    $('#titleHelp').click(function() {

        $('#titleHelpInfo').animate({
        opacity: 'show',
        height: 'show'
        }, 'slow');
      
    });// end $('#titleHelp')

    // conceal info div using animate
    $('#closeTitleHelpInfo').click(function() {

        $('#titleHelpInfo').animate({
        opacity: 'hide',
        height: 'hide'
        }, 'slow');

    });// end $('#closeTitleHelpInfo')

    // reveal url path info div using animate
    $('#urlPathHelp').click(function() {

        // use .length property to check if the element already exists ( stops the p element being repeatedly added if user keeps clicking the trigger element )
        // if it doesn't, then prepend to the target element
        if(!($('#urlPathHelpInfo p').length))
        {
            $('<p>The url is the location of the content that the browser will go to, eg "latest-promo" will go to:<br/> "http://wwww.exampleWebsite.com/info/latest-promo".<br/> When you click on the URL* field, a url will be created automatically from the title.</p>').prependTo('#urlPathHelpInfo')
        }
        // display info
        $('#urlPathHelpInfo').animate({
        opacity: 'show',
        height: 'show'
        }, 'slow');

    });// end $('#urlPathHelp')

    // conceal info div using animate
    $('#closeUrlPathHelpInfo').click(function() {

        // hide info
        $('#urlPathHelpInfo').animate({
        opacity: 'hide',
        height: 'hide'
        }, 'slow');
        // remove the target element otherwise it remains and will still be there if holding div is shown again (along with any other added message) from another function
        $('#urlPathHelpInfo p').remove();

    });// end $('#closeUrlPathHelpInfo')

    // when URL input is clicked, get the title value, clean and convert to url path
    $('#urlPath').click(function() {

       // if there is a title value
       if(!($('#titleInput').val() === ''))
       {
            // get input value for title
            var titleInput = $('#titleInput').val();

            // remove special characters
            titleInput =  titleInput.replace(/[^a-zA-Z 0-9]+/g,'');
            // replace spaces with hyphens
            var urlPath = titleInput.replace(/ /g,'-');
            
            // put title value in URL
            $('#urlPath').val(urlPath);

       }
       else
       {
           // use length property to check if targeted element already exists ( stops the p element being repeatedly added if user keeps clicking the trigger element )
           // if it doesn't then add the p and message to the target element
           if(!($('#urlPathHelpInfo p').length))
           {
                $('<p>Please enter a title first.</p>').prependTo('#urlPathHelpInfo')
           }
           // display target element
           $('#urlPathHelpInfo').animate({
                opacity: 'show',
                height: 'show'
                }, 'slow');
       }
        
     });// end $('#urlPath').click


     if($('select[name="extranet"]').val() == 'no'){
         $('.submenuOptions').show();
     }
     else if($('select[name="extranet"]').val() == 'yes'){
         $('.subcategoryOptions').show();
     }
     $('select[name="extranet"]').change(function(){
         if($(this).val() == 'no'){
             $('.submenuOptions').show();
             $('.subcategoryOptions').hide();
         }
         else if($(this).val() == 'yes'){
             $('.submenuOptions').hide();
             $('.subcategoryOptions').show();
         }
     });



    /*********************** extranet login *************************/

    // set up triggers for the popup extra
    $(".modalInput").overlay({

    // some mask tweaks suitable for modal dialogs
    mask: {
		color: '#ebecff',
		loadSpeed: 200,
		opacity: 0.9
          },

          closeOnClick: false
    });

   /*$("#extranetForm").submit(function(event)
   {
       event.preventDefault();
        //remove all the class add the messagebox classes and start fading
        $("#status").removeClass().addClass('messagebox').text('Checking...').fadeIn(1000);
        //check the username exists or not from ajax
        $.post("/userlogin", {email:$('#email').val(),password:$('#password').val()}, function(data)
        {
            // use the submitted form value for current url to get the path of the page user is logging in from
            var current_path = $('#url_path').val();
         
            //if correct login details
            if(data=='yes')
            { 
                $("#status").fadeTo(200,0.1,function()  //start fading the messagebox
                {
                    //add message and change the class of the box and start fading
                    $(this).html('Logging in...').addClass('messageboxok').fadeTo(900,1,
                    function()
                    {
                        //redirect to the page user is logging in from
                        document.location= current_path;
                    });
                }); // end $("#status").fadeTo(200,0
            }// end if(data=='yes')
            
            // if login fails
            if(data=='no')
            {
                $("#status").fadeTo(200,0.1,function() //start fading the messagebox
                {
                    //add message and change the class of the box and start fading
                    $(this).html('Sorry, failed to log in.').addClass('messageboxerror').fadeTo(900,1);
                }); // end $("#status").fadeTo(200,0
            } // end if(data=='no')

       }); // end $.post("userlogin",{ email:$('#email'

       return false; // not to post the form physically

   });// end $("#extranetForm").submit(function()
    */
   // remove any messages if the login box is closed
   $('.close').click (function() {

         $("#status").removeClass();
         $("#status").text('');
   });

});// end $(document).ready(function()