amware_custom_modal_confirmation

amware_custom_modal_confirmation

$(document).ready(function(){

 $(".commit").click( function(e){


    // To make this work we need to add the the following html to the page. 
        //<div id="dialog" title="Verify Form jQuery UI Style">
        //<p><span class="ui-icon ui-icon-alert" style="float:left; margin:0 7px 0 0;"></span> You entered your e-mail address as:</p>
        //<p id="dialog-email"></p>
        //<p>If this is correct, click Submit Form.</p>
        //<p>To edit, click Cancel.<p>
        //</div>
    // Add the ui.js and the css
    $('#dialog').dialog({
        autoOpen: false,
        width: 400,
        modal: true,
        resizable: false,
        buttons: {
            "Submit Form": function() {
                // put in the name of the form here
                document.testconfirmJQ.submit();
            },
            "Cancel": function() {
                $(this).dialog("close");
            }
        }
    });





    var warning = 'Warning, this is blank';
    var warning_html = '<p class="inline-errors">' + warning + '</p>';
    var all_selections  = [];
    var not_filled_out  = [];

    // Loop through each element with the specified class and 1) put 
    // the parent <id> in an array; 2) Put the the parent <id> in an array if
    // the datetime selection doesn't have a value and the parent <id> isn't 
    // already in the array; 3) Remove any previous warning ONLY if they match
    // the warning for this check (i.e. var warning)
    $( '.check_value' ).children().each( function(){

        var li = $(this);
        var li_value = li.val();
        var li_div_id = li.parent().parent().parent().parent().attr('id');

        all_selections.push( li_div_id );

        if ( _.include( not_filled_out, li_div_id ) == false & li_value == '' )
          {
            not_filled_out.push( li_div_id );
          }

          // Remove warning only if it exactly matches the warning in our variable.
          // In-case we happend to add some other validation down the road, we want
          // to make sure we only remove the one associated with this validation.
          $( '#' + li_div_id ).children("p").each( function(){
            if( $(this).text() == warning )
              {
                $( '#' + li_div_id ).children("p").remove();
              };
            });
     });

   
    all_selections              = _.uniq(all_selections);
    var filled_out              = _.difference( all_selections, not_filled_out );
    var max_index_filled_out    = _(filled_out).chain().map( function(filled) { return _.indexOf( all_selections, filled) }).max().value();
    var not_filled_out_indexes  = _.map( not_filled_out, function(not_filled) { return _.indexOf( all_selections, not_filled) });
    var zipped_not_filled_out   = _.zip( not_filled_out, not_filled_out_indexes);
    var invoke_confirm_box      = [];

    // Loop through the zipped not filled out index and their ids.  If their index
    // is less than the maximum index that was filled out, then append a warning message to it
    // and push the id to the invovke_confirm_box array
    _.each( zipped_not_filled_out, function( zipped ){ 
        if (zipped[1] < max_index_filled_out) 
            {  
                invoke_confirm_box.push( zipped[0] )
                $('#' + zipped[0] ).append( warning_html );
            };
    }); 

    // If there were any selections that need to be filled out, the stop
    // the form submission and display the confirm box
    if ( invoke_confirm_box.length > 0 )
     {
       // Use this if we are going to make a custom pop up box and buttons
       var continue_popup = $('#dialog').dialog('open');
       //var continue_popup = confirm("Some date fields are not filled out. 'OK' to submit anyway and 'Cancel' to enter more information.");
       if ( continue_popup != true )
         {
           e.preventDefault();
         }
     };
  });



  // Puts a blank value in all the associated datetime selections if the 'clear' button is clicked.
  $('.clear').live('click', function() {
    $(this).closest('ol').find('select').val("");
  });


    
  // When the now button is clicked, fill out all the datetime selections and round the 
  // minute to the nearest five minutes
  $('.now').live('click', function() {

        var round_to_nearest = 5;
        // Get all the elements with a <select> tag
        var all_selects     = $('select');
        // Get only the selects in the <ol> of which we are interested
        var selects_per_li  = $( this ).closest('ol').find( all_selects );
        // Get the current date and times ( for the user's computer)
        var now             = new Date();
        var year            = now.getFullYear();
        var month           = now.getMonth() + 1;
        var day             = now.getDate();
        var hour            = now.getHours();
        var minutes         = now.getMinutes();

        // Round to the nearest 5 minutes. if minute less than 10 then prepend a '0' to it
        if ( minutes < 10 )
            {
                minutes = '0' + Math.round( minutes / round_to_nearest )* round_to_nearest;
            }
        else
            {
                minutes = Math.round( minutes / round_to_nearest )*round_to_nearest;
            }
        

        var all_possible_date_times     = [ year, month, day, hour, minutes ];
        var selects_per_li_length       = selects_per_li.length;

        // Fill out the date time selections
        _( all_possible_date_times ).chain()
            .select( function( item ){ return _.indexOf( all_possible_date_times, item ) < selects_per_li_length })
            .zip( selects_per_li )
            .value()
            .map( function(zipped){ $(zipped[1]).val( zipped[0] ) } );

    });


});