/*global $,BOARD_MEETING_PENDING*/
/*global translate,display_msg,clear_msg,scroll_to_id,shuffle,dompurify_sanitize*/
/*global move_editor*/
/*global g_votes*/


//
// Show / Hide send button
//
function show_send_button()
{
    $('#p-btn-vote').show(); // show-send-button
}

function hide_send_button()
{
    $('#p-btn-vote').hide(); // hide-send-button
}


//    
// Display questions
//    
function display_questions( questions , qns_box_id )
{
    const is_edit = ( qns_box_id == 'poll-questions-for-edit' );
    
    const num_qns = questions.length;
    
    var html = '';
    var class_is_disabled;
    
    //
    // Build the questions
    //
    var question, cnt, qn_title, text, options, s_num_picks, num_picks, num_options, is_exactly, num_picks_prefix, is_single_pick, num_picks_str, fld_type, is_random_order, class_num_picks, random_order_str, is_mandatory, mandatory_str, features_str, qn_options_btns, html_options;
    
    var qn, op, fld_name, op_fld_id;
    
    var btn_edit, btn_del, btn_up, btn_dn;

    for ( qn in questions )
    {
        qn = parseInt( qn , 10 );
        
        //
        // Parse question data.
        //
        question = questions[qn];
        text = question.text;
        options = question.options;
        num_options = options.length;
        s_num_picks = question.num_picks+'';
        is_random_order = ( question.random_order == 1 );
        is_mandatory = ( question.mandatory == 1 );
        
        //
        // Handle number of pics - could be 'exactly' or 'up to'.
        //
        is_exactly = ( s_num_picks.substring(0, 1) == 'e' );
        
        num_picks = is_exactly ?
            parseInt( s_num_picks.substring(1) , 10 ):
            parseInt( s_num_picks , 10 );

        is_single_pick = ( num_picks == 1 && num_options > 1 );
        
        //
        // Reset question votes
        //
        g_votes[qn] = [];
        
        //
        // Set prefix strings, related to number of picks and random order.
        //
        class_num_picks = is_random_order ? '' : 'mb';
        
        qn_options_btns = '';
        num_picks_str = '';

        if ( num_picks == num_options )
        {
            num_picks_prefix = is_exactly ? 'You have to select all options' : 'You may choose all options';

            num_picks_str = "<p class='"+class_num_picks+" mtsmall small'>"+translate(num_picks_prefix)+"</p>";

            if ( num_options > 4 )
            {
                qn_options_btns =  "<p id='box-btn-sel-all-"+qn+"' class='"+class_num_picks+" toggle-cbs btn-sel-all toggle-"+qn+" mt1 small'><button class='btn-cbs-on' data-qn='"+qn+"'><span class='fa fa-check-square space'></span>"+translate('Select all options')+"</button></p><p id='box-btn-desel-all-"+qn+"' class='"+class_num_picks+" toggle-cbs toggle-"+qn+" mt1 small hidden'><button class='btn-cbs-off' data-qn='"+qn+"'><span class='fa fa-times space'></span>"+translate('Deselect all options')+"</button></p>";
            }
        }
        
        else
        {
            num_picks_prefix = is_exactly ? 'Select precisely' : 'Select up to';
            
            num_picks_str = is_single_pick ? '' : "<p class='"+class_num_picks+" mtsmall small'>"+translate(num_picks_prefix)+" <span class='number'>"+num_picks+"</span> "+translate('options')+"</p>";
        }
        
        random_order_str = ( is_random_order ) ? "<p class='mb small'>"+translate('The options are presented in a randomized sequence')+"</p>" : '';
        
        mandatory_str = ( is_mandatory ) ? "<p class='msg-mandatory-"+qn+" small bold'>"+translate('This question is required')+"</p>" : '';
        
        if ( mandatory_str != '' || num_picks_str != '' || random_order_str != '' )
        {
            features_str = "<div class='qfeatures'>"+mandatory_str+num_picks_str+random_order_str+"</div>";
        }
        
        else
        {
            features_str = '';
        }

        //
        // Case edit - set questions edit buttons
        //
        if ( is_edit )
        {
            btn_edit = "<button class='btn-icon btn-show-qn-editor' data-qn='"+qn+"' title='"+translate('Edit')+"'><span class='fa fa-pencil'></span></button>";
            
            btn_del = "<button class='btn-icon btn-del-qn' data-qn='"+qn+"' title='"+translate('Delete')+"'><span class='fa fa-trash-o'></span></button>";
            
            class_is_disabled = ( qn == 0 ) ? 'lightgrey' : '';
            
            btn_up = "<button class='btn-icon btn-move-qn' data-qn='"+qn+"' data-step='-1' title='"+translate('Move up')+"'><span class='fa fa-arrow-up "+class_is_disabled+"'></span></button>";
            
            class_is_disabled = ( qn == num_qns - 1 ) ? 'lightgrey' : '';
            
            btn_dn = "<button class='btn-icon btn-move-qn' data-qn='"+qn+"' data-step='1' title='"+translate('Move down')+"'><span class='fa fa-arrow-down "+class_is_disabled+"'></span></button>";
        }
        
        //
        // Set field name and field type - either radio or checkbox.
        //
        fld_name = "op_"+qn;

        fld_type = is_single_pick ? 'radio' : 'checkbox';
        
        //
        // Display question title
        //
        cnt = qn + 1;
        
        qn_title = ( num_qns > 1 ) ?
            translate('Question') + ' ' + cnt:
            translate('Voting Question');

        if ( is_edit )
        {
            html += "<h2 id='qn-title-"+qn+"' class='h2question line'><span class='floatopp qn-btns'>"+btn_up+btn_dn+btn_del+btn_edit+"</span>"+translate('Question')+" "+cnt+"</h2>";
            
            html += "<div id='qn-editor-"+qn+"'></div>";
            
            html += "<div id='qn-body-"+qn+"' class='qn-body'>";
        }
        
        else
        {
            html += "<h2 class='h2question line'>"+qn_title+"</h2>";
        }
        
        //
        // Question html: title, features, text, options-button, hidden-messages
        //
        html += features_str;
        html += dompurify_sanitize( text );
        html += qn_options_btns;
        html += "<p id='err-vote-"+qn+"' class='err-vote red hidden'></p>";
        html += "<p id='msg-vote-"+qn+"' class='frame bg-grey hidden'></p>";
        
        //
        // Build option array.
        //
        html_options = [];
        
        for ( op in options )
        {
            op_fld_id = "option_" + qn + "_" + op; // display questions
            
            html_options.push( "<p><input type='" + fld_type + "' name='" + fld_name + "' id='" + op_fld_id + "' class='qn-op' data-qn='" + qn + "' data-op='" + op + "'><label for='" + op_fld_id + "'>" + dompurify_sanitize( options[op] ) + "</label></p>");
        }
        
        if ( is_random_order )
        {
            shuffle( html_options );
        }
        
        //
        // Question html: Append options 
        //
        html += "<div id='options-"+qn+"' class='options'>";
        html += html_options.join('');
        html += "</div>";
        
        //
        // Case edit - close question-body DIV
        //
        if ( is_edit )
        {
            html += "</div>"; 
        }
    }       

    if ( is_edit )
    {
        //
        // Append next-question HTML.
        //
        html += "<div id='box-next-qn'>";
        
            html += "<h2 id='new-qn-title' class='h2question line'>" + translate('Question') + " " + ( num_qns + 1 ) + "</h2>";
    
            html += "<p id='box-link-add-question'>";
            html += "<button class='btn-show-qn-editor'>" + translate('Click to add question') + " #" + ( num_qns + 1 ) + "</button>";
            html += "</p>";
            
        html += "</div>";
        
        //
        // Move editor to 'safety', before running over questions.
        //
        move_editor( 'qn-editor-idle-keep' ); // display questions
        
        //
        // Show / Hide bottom back button
        //
        ( num_qns < 2 ) ?
            $('#p-bottom-back-from-qns').hide():
            $('#p-bottom-back-from-qns').show();
        
    }

    //
    // Display questions.
    //
    $('#'+qns_box_id).html('').append( html );


    //
    // Set on-click
    //
    let qn_options;
    
    for ( let button of document.querySelectorAll( 'button.btn-cbs-on' ) ) // button setting all checkboxes on
    {
        button.addEventListener('click', function(event) 
        {
            event.preventDefault();
            
            qn = event.currentTarget.getAttribute('data-qn');
            qn_options = questions[qn].options; 

            set_qn_options( qn , qn_options, true ); // display questions
        });
    }

    for ( let button of document.querySelectorAll( 'button.btn-cbs-off' ) ) // button setting all checkboxes off
    {
        button.addEventListener('click', function(event) 
        {
            event.preventDefault();
            
            qn = event.currentTarget.getAttribute('data-qn');
            qn_options = questions[qn].options;

            set_qn_options( qn , qn_options , false );  // display questions
        });
    }

    $('.qn-op').change( function() 
    {
        let qn = parseInt( $(this).data('qn') , 10 );
        let op = parseInt( $(this).data('op') , 10 );
        
        onchg_option( questions , qn , op ); // display questions
    });
}


//
// Select / Deselect all quetion options.
//
function set_qn_options( qn , qn_options , tf )
{
    g_votes[qn] = [];
    
    if ( tf === true )
    {
        for ( var ind_op in qn_options )
        {
            g_votes[qn].push( parseInt( ind_op , 10 ) );
        }
    }

    mark_qn_chkboxes( qn_options , qn ); // set question options (selects or deselects ALL options)
}


//
// on-change option
//
function onchg_option( questions , qn , op )
{
    //
    // Get data related to input question-number
    //
    var question = questions[qn];
    var options = question.options;
    var s_num_picks = question.num_picks+'';
    var qn_votes = g_votes[qn];
    var op_ind = qn_votes.indexOf(op);

    var num_options = options.length;

    var is_exactly = ( s_num_picks.substring(0, 1) == 'e' );

    var num_picks = is_exactly ?
        parseInt( s_num_picks.substring(1) , 10 ):
        parseInt( s_num_picks , 10 );

    //
    // Update the global g-votes. 
    //
    var err_msg = '';
    
        // 
        // Case only a single pick is allowed - set qn-votes as the option that has just been selected.
        // 
        if ( num_picks == 1 && num_options > 1 )
        {
            qn_votes = [op];
        }
        
        //
        // Case clicked option was included in the question votes - remove it.
        //
        else if ( op_ind != -1 )
        {
            qn_votes.splice(op_ind, 1);
        }
        
        //
        // Case one too many selections - set error message.
        //
        else if ( qn_votes.length >= num_picks )
        {
            err_msg = "You've reached the maximum number of options. To choose another, please deselect a previously selected option by clicking on it";
        }

        //
        // Otherwise - append the selected option.
        //
        else
        {
            qn_votes.push(op);
        }
    
    g_votes[qn] = qn_votes;
    
    //
    // Mark checkboxes; error message; missed questions;
    //
    mark_qn_chkboxes( questions[qn].options , qn );  // on-change option
    
    handle_qn_err( questions[qn] , qn , err_msg );
    
    handle_misssed_questions( questions );  // on-change option

    //
    // Re-display send button
    //
    $('#btn-vote').html( translate ('Submit my vote') );
    
    show_send_button(); // onchg option
}


//
// Mark question checkboxes.
//
function mark_qn_chkboxes( qn_options , qn )
{
    //
    // Deselect all and calc num-options.
    //
    var num_options = 0; // options.legnth yields undefined

    for (var ind_op in qn_options)
    {
        $('#option_'+qn+'_'+ind_op).prop("checked", false); // deselect all question checkboxes
        num_options++;
    }

    //
    // check by g-votes.
    //
    for ( var ind in g_votes[qn] )
    {
        $('#option_'+qn+'_'+g_votes[qn][ind]).prop("checked", true); // select question checkboxes
    }
    
    //
    // Case all-options-can-be-selected - set toggle button.
    //
    if ( g_votes[qn].length == num_options )
    {
        $('.toggle-'+qn).hide();
        $('#box-btn-desel-all-'+qn).show();
    }

    else if ( ( g_votes[qn].length == 0 ) && ( $('#box-btn-sel-all-'+qn).length != 0 ) )
    {
        $('.toggle-'+qn).hide();
        $('#box-btn-sel-all-'+qn).show();
    }
}


//
// Handle question error message
//
function handle_qn_err( question , qn , err_msg )
{    
    //
    // Get data related to input question-number
    //
    var s_num_picks = question.num_picks+'';
    var qn_votes = g_votes[qn];

    var is_mandatory = ( parseInt( question.mandatory , 10 ) == 1 );
    var is_exactly = ( s_num_picks.substring(0, 1) == 'e' );

    var num_picks = is_exactly ?
        parseInt( s_num_picks.substring(1) , 10 ):
        parseInt( s_num_picks , 10 );

    var qn_err_box_id = 'err-vote-'+qn;

    //
    // show/hide error message as main-err-msg.
    //
    if ( err_msg == '' )
    {
        clear_msg(qn_err_box_id);
    }
    
    else
    {
        display_msg( err_msg , qn_err_box_id , 4 );
        scroll_to_id(qn_err_box_id);
    }

    //
    // Handle qn-err-msg.
    //
    if ( err_msg == '' )
    {
        if ( is_exactly && qn_votes.length > 0 && ( num_picks > qn_votes.length ) )
        {
            var exactly_msg = translate('You must select')+' <span class="number">'+( num_picks - qn_votes.length )+'</span> '+translate('more options');
            
            display_msg(exactly_msg, 'msg-vote-'+qn);
            
            $('#msg-vote-'+qn).removeClass('red-border');
        }
        
        else
        {
            clear_msg('msg-vote-'+qn);
        }
    }
    
    //
    // Remove red color from mandatory comment.
    //
    if (is_mandatory )
    {
        $('.msg-mandatory-'+qn).removeClass('red');
    }
    
    //
    // Clear the general vote message (it appears above the Send button)
    //
    clear_msg('vote-msg');
}


//
// Handle missed questions
//
function handle_misssed_questions( questions , do_mark_missed = false )
{
    var qn, question, s_num_picks, num_picks, is_exactly, num_votes, is_mandatory, is_missed, is_bad_exact, msg;
    
    //
    // Build an array of numbers of the missed questions, 
    // while (optionally) marking missed-exact-question border.
    //
    var qn_missed = [];
    var qn_mandatory_missed = [];
    var qn_bad_exacts = [];
    
    for (var qn in g_votes)
    {
        question = questions[qn];

        //
        // Get: num-picks, is-exactly, num-votes.
        //
        s_num_picks = question.num_picks+'';
        
        is_exactly = ( s_num_picks.substring(0, 1) == 'e' );
        
        num_picks = is_exactly ?
            parseInt( s_num_picks.substring(1) , 10 ):
            parseInt( s_num_picks , 10 );
            
        num_votes = g_votes[qn].length;
        
        is_mandatory = ( parseInt( question.mandatory , 10 ) == 1 );
        
        //
        // Descide cases of missed, mandatory-missed and bad-exact.
        //
        is_missed = ( num_votes == 0 ) || ( is_exactly && num_votes < num_picks );
        
        is_bad_exact = ( is_exactly && num_votes > 0 && num_votes < num_picks );
        
        //
        // Handle these cases.
        //
        if (is_missed)
        {
            qn_missed.push( parseInt( qn , 10 ) + 1 );
            
            if (is_mandatory)
            {
                qn_mandatory_missed.push( parseInt( qn , 10 ) + 1 );

                if ( do_mark_missed )
                {
                    $('.msg-mandatory-'+qn).addClass('red');
                }
            }
        }
        
        if (is_bad_exact)
        {
            qn_bad_exacts.push( parseInt( qn , 10 ) + 1 );

            if ( do_mark_missed )
            {
                $('#msg-vote-'+qn).addClass('red-border');
            }
        }
    }
    
    var num_qns_missed = qn_missed.length;
    
    //
    // (Optionally) Display error message for missed / bad-exact situation. In case of
    // just missing questions, also display the complete-anyway button.
    //
    if ( do_mark_missed && num_qns_missed > 0 )
    {
        //    
        // As default - hide all vote buttons.    
        //    
        hide_send_button(); // the user missed questions or filled incorrectly
        
        //
        // Case Error - did not fill in the rquired number of options
        //
        if ( qn_bad_exacts.length > 0 )
        {
            msg = '<p><span class="fa fa-exclamation-triangle red space"></span>';
            
            if ( qn_bad_exacts.length == 1 )
            {
                msg += translate('Question') + ' <span class="number">'+qn_bad_exacts[0]+'</span> ' + translate('lacks the required number of selected options')+'.';
            }

            else            
            {
                msg += translate('The following questions lack the required number of selected options')+': <span class="bold">'+qn_bad_exacts.join(',')+'</span>';
            }
            
            msg += '</p>';
            
            msg += "<p class='mb0'>"+translate('Either complete the options to meet the requirements or deselect all to submit the form')+".</p>";
        }
        
        //
        // Case Error - did not answer any question
        //
        else if ( num_qns_missed == questions.length )
        {
            msg = '<p class="mb0"><span class="fa fa-exclamation-triangle red space"></span>'+translate('Please answer at least one question')+'</p>';
        }
        
        //
        // Case Error - did not answer all mandatory questions
        //
        else if ( qn_mandatory_missed.length > 0 )
        {
            msg = '<p class="mb0"><span class="fa fa-exclamation-triangle red space"></span>'+translate('Kindly answer all mandatory questions')+'</p>';
        }
        
        //
        // Case Alert - did not answer all the questions
        //
        else
        {
            msg = '<p>';
            
            msg += '<span class="fa fa-exclamation-triangle red space"></span>';
            
            msg += ( num_qns_missed == 1 ) ?
                translate('You have not answered question number')+" <span class='number'>"+qn_missed[0]+"</span>":
                translate('The following questions have not been answered')+": <span class='bold'>"+qn_missed.join(',')+"</span>";
                
            msg += '</p>';
            
            msg += "<p>"+translate('You can either provide the missing answers or submit the voting form as-is')+".</p>";
            
            $('.btn-vote').html( translate ('Submit my vote as is') );
            
            show_send_button(); // handle missed questions
        }

        display_msg( msg , 'vote-msg' );
        
        scroll_to_id('vote-msg');
    }
    
    //
    // Return the number of missed questions.
    //
    return num_qns_missed;
}


//
// Clear checkboxes of partially filled exact-questions
//
function clear_sel_options_from_partial_exact_questions( questions )
{
    var s_num_picks, num_picks, is_exactly, num_votes;
    
    for (var qn in g_votes)
    {
        //
        // Get: num-picks, is-exactly, num-votes.
        //
        s_num_picks = questions[qn].num_picks+'';
        
        is_exactly = ( s_num_picks.substring(0, 1) == 'e' );
        
        num_picks = is_exactly ?
            parseInt( s_num_picks.substring(1) , 10 ):
            parseInt( s_num_picks , 10 );
            
        num_votes = g_votes[qn].length;
            
        //
        // Clear checked boxes (and qn-msg) if it is a bad-exact question.
        //
        if ( is_exactly && num_votes < num_picks )
        {
            g_votes[qn] = [];
            
            for (var op in questions[qn].options)
            {
                $('#option_'+qn+'_'+op).prop("checked", false); // clearing all options from an exact question
            }

            clear_msg('msg-vote-'+qn);
        }
    }
}