<div id="change">
    <?php
    $quiz_status = $this->session->userdata('quiz_status');
    ?>
    <div class="col-sm-10 col-sm-offset-3 main col-md-10 col-md-offset-2 main">
        <div class="col-sm-4 col-md-7">
            <a href="<?php echo base_url(); ?>super_admin_quiz/add_question" class="btn btn-sm btn-success">Add Question</a>
        </div>


        <!-- Select User By Role and Status -->

        <div class="col-sm-3 col-md-5 main">
            <form name="control_form">
                <select for="question_status" name="question_status" id="quiz_status" 
                        onchange="selectList(this.value, 'change');">
                    <option value=''> Select Status</option>
                    <option value='5'> All</option>
                    <option value='1'> Active</option>
                    <option value='0'> Inactive</option>
                    <option value='2'> Archive</option>
                </select>
            </form>
            <?php echo $quiz_status; ?>
        </div>

        <script>

            document.forms['control_form'].elements['question_status'].value = '<?php echo $question_status; ?>';

            function selectList(status, objID) {
                if (status === '5') {
                    serverPage = '<?php echo base_url(); ?>super_admin_quiz/manage_question/' + <?php echo $start; ?> + '/';
                }
                serverPage = '<?php echo base_url(); ?>super_admin_quiz/manage_question/' + <?php echo $start; ?> + '/' + status;
                xmlhttp.open("GET", serverPage);
                xmlhttp.onreadystatechange = function ()
                {
                    if (xmlhttp.readyState === 4 && xmlhttp.status === 200)
                    {
                        document.getElementById(objID).innerHTML = xmlhttp.responseText
                    }
                };
                xmlhttp.send(null);
            }

        </script>

        <div class="container col-sm-8 col-sm-offset-2 col-md-offset-0 col-md-12" id="res">
            <div class="row">

            </div>

            <hr>
            <div class="">
                <a href="<?php echo base_url(); ?>super_admin">Dashboard</a>->>
                <span>Question List</span>
            </div>
            <hr>
            <div class="span11 right">
                <div class="col-lg-6 col-md-4" >
                    <h4>All Question Information</h4> 
                </div>
                <div class="col-lg-2 col-md-2">
                </div>
                <div class="col-lg-4 col-md-4">
                    <a class="btn btn-sm btn-primary" href="<?php echo base_url(); ?>super_admin/export_user_list_csv">Export</a> 
                    <a class="btn btn-sm btn-primary" href="#" data-toggle="modal" data-target="#importFile">Import</a> 
                    <!--<button onclick="printDiv('user_list');">print</button> ||-->
                    <input type="submit" value="Print" id="change_role_button" class="btn btn-sm btn-primary  "  data-toggle="modal" data-target="#print" onclick="printPreview('user_list');">
                    <a class="btn btn-sm btn-primary" href="#" onclick="sendMailToUser();">Email</a>
                    <a class="btn btn-sm btn-primary" href="#" onclick="sendMailToUser();">SMS</a>
                </div>
            </div>

            <!--User LIST-->

            <div class="table-responsive col-lg-11 col-md-8 col-sm-7" id="user_list">
                <form name="myform" action=""  method="post">
                    <table class="table table-striped">
                        <thead>
                            <tr>
                                <th><input type="checkbox" name="all_user" id="all_user" onchange="toggleAllUserSelection(document.myform.user_id)"/></th>
                                <!--<th>ID</th>-->
                                <th>Quiz Name</th>
                                <th>Course</th>
                                <th>Quiz Topics</th>
                                <th>Number of Question</th>
                                <th>Time Limit</th>
                                <th>Status</th>
                                <th>Created Date</th>
                                <th>Actions</th>
                            </tr>
                        </thead>
                        <tbody>
                            <?php
                            $i = 1;
                            foreach ($question as $v_question) {
                                ?>
                                <tr>
                                    <td><input name="quiz_id" id="quiz_id<?php echo $v_question->question_id; ?>" type="checkbox"  value="<?php echo $v_question->question_id; ?>" onchange="setGroupMemberIdList(this.value);"/></td>
                                    <!--<td><?php // echo $v_question->question_id; ?></td>-->
                                    <td > <?php echo $v_question->question_details; ?></td>
                                    <td><?php echo $v_question->topic_id ?></td>
                                    <td><?php // echo $v_question->quiz_topics;    ?></td>
                                    <td><?php echo $v_question->points_per_answer; ?></td>
                                    <td><?php echo $v_question->time_limit; ?></td>
                                    <td><?php echo $v_question->question_status; ?></td>
                                    <td><?php echo $v_question->created_date_time; ?></td>

                                    <!--Action: Active, Inactive, Archive, Edit-->

                                    <td><?php
                                        if ($v_question->question_status == '1') {
                                            echo '<p style="color:limegreen;">Active</p>';
                                            ?>
                                            <a href="<?php echo base_url(); ?>super_admin_quiz/inactive_question/<?php echo $v_question->question_id . '/' . $this->uri->segment(3); ?>"><i class="fa fa-user-times" title="Inactive"></i></a>
                                            <?php
                                        } else if ($v_question->question_status == '0') {
                                            echo '<p style="color:red;">Inactive</p>';
                                            ?>

                                            <a href="<?php echo base_url(); ?>super_admin_quiz/active_question/<?php echo $v_question->question_id . '/' . $this->uri->segment(3); ?>">
                                                <i class="fa fa-user-plus" title="Active"></i></a>
                                            <?php
                                        } else {
                                            echo '<p style="color:blue;">Archived';
                                            ?>
                                            <a href="<?php echo base_url(); ?>super_admin_quiz/active_question/<?php echo $v_question->question_id . '/' . $this->uri->segment(3); ?>"><i class="fa fa-user-plus" title="Active"></i> </a>
                                        <?php } ?>
                                    </td>
                                    <td>
                                        <a href="<?php echo base_url(); ?>super_admin_quiz/update_question/<?php echo $v_question->question_id; ?>"><div class="span1"><i class="fa fa-edit">Edit</i></div></a>
                                        <a href="<?php echo base_url(); ?>super_admin_quiz/question_detail/<?php echo $v_question->question_id; ?>"><div class="span1"><i class="">View Detail</i></div></a>
                                        <?php if ($v_question->question_status != 2) { ?>
                                            <a href="<?php echo base_url(); ?>super_admin_quiz/archive_question/<?php echo $v_question->question_id . '/' . $this->uri->segment(3); ?>" onclick="return checkAction('Archive');"><i class="fa fa-remove">Archive</i></a>
                                        <?php } ?>
                                    </td>

                                </tr>
                            <?php } ?>
                        </tbody>
                    </table>
                    <br>
                </form>

                <!-- Start Pagination -->
                <div class="col-lg-12 col-md-12 col-sm-12" >
                    <hr>
                    <form name="pagination">
                        <div class="col-lg-2 col-md-2 col-sm-2">
                            <label for="per_page_user">Per Page: </label>
                            <select name="per_page" onchange="test();">
                                <option value='0'>0</option>
                                <option value='10'>10</option>
                                <option value='25'>25</option>
                                <option value='50'>50</option>
                                <option value='100'>100</option>
                                <option value='200'>200</option>
                                <option value='250'>250</option>
                                <option value='500'>500</option>
                                <option value='all'>All</option>
                            </select>
                            <p>This Page :<?php echo $this_page . '/' . $total; ?></p>
                        </div>
                        <script type="text/javascript">

                            document.forms['pagination'].elements['per_page'].value = '<?php echo $limit; ?>';

                            function setPerPage(perPage) {
                                alert(perPage);
                                serverPage = '<?php echo base_url(); ?>super_admin/set_per_page/' + perPage;
                                xmlhttp.open("GET", serverPage);
                                xmlhttp.onreadystatechange = function ()
                                {
                                    if (xmlhttp.readyState === 4 && xmlhttp.status === 200)
                                    {
                                        location.reload();
                                    }
                                };
                                xmlhttp.send(null);
                            }
                        </script>


                        <!--Start Pagination-->

                        <?php
                        $limit = $this->session->userdata('per_page');
                        if ($limit == NULL) {
                            $limit = 10;
                        }
                        $number_of_pages = ceil($total / $limit);
                        ?>
                        <div class="col-lg-2 col-md-2 col-sm-2">
                            <?php if (($start - $limit) >= 0) { ?>
                                <a href="<?php echo base_url(); ?>super_admin_quiz/<?php echo 'manage_question' . '/0'; ?>" class='btn btn-sm btn-success'>First</a>
                                <a href="<?php echo base_url(); ?>super_admin_quiz/<?php echo 'manage_question' . '/' . ($start - $limit); ?>" class='btn btn-sm btn-success'>Prev</a>
                            <?php } ?>
                        </div>

                        <div class='col-lg-5 col-md-5 col-sm-5'>
                            <?php for ($i = 1; $i <= $number_of_pages; $i++) { ?>
                                <a href="<?php echo base_url(); ?>super_admin_quiz/<?php echo 'manage_question' . '/' . (($i - 1) * $limit); ?>" class='btn btn-sm btn-default'><?php echo $i; ?></a>
                            <?php } ?>
                        </div>

                        <div class="col-lg-2 col-md-2 col-sm-2">
                            <?php if ($start + $limit < $total) { ?>
                                <a href="<?php echo base_url(); ?>super_admin_quiz/<?php echo 'manage_question' . '/' . ($start + $limit); ?>" class='btn btn-sm btn-default'>Next</a>
                                <a href="<?php echo base_url(); ?>super_admin_quiz/<?php echo 'manage_question' . '/' . (($number_of_pages - 1) * $limit); ?>" class='btn btn-sm btn-success'>Last</a>
                            <?php } ?>
                        </div>

                        <!--END Pagination-->

                    </form>
                    <br>
                    <hr>
                </div>

                <!-- Start Pagination -->

            </div>

        </div>  
    </div> 

    <!-- Modal Start For Change Role and Status-->
    <!--
    
    Modal:
    Change Role
    
    -->

    <div class="modal fade" id="changeRole" tabindex="-1" role="dialog" aria-labelledby="changeRole" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h4 class="modal-title" id="myModalLabel">Change Role</h4>
                </div>
                <form name="changeRole">
                    <div class="modal-body">

                        <label for="user_role_id">User role:</label><span>*</span>
                        <select class="form-control" name="user_role_id" id="user_role_id">
                            <option value="">--Select User Type--</option>
                            <option value="1">Admin</option>
                            <option value="2">Account</option>
                            <option value="3">Resource</option>
                            <option value="4">Register</option>
                        </select>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                        <button type="submit" class="btn btn-primary" onclick="changeUsersRole();">Save changes</button>
                    </div>
                </form>
            </div>
        </div>
    </div>


    <!--
    
    Modal:: 
    Change Status
    
    -->


    <div class="modal fade" id="changeStatus" tabindex="-1" role="dialog" aria-labelledby="changeStatus" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h4 class="modal-title" id="myModalLabel">Change User Status</h4>
                </div>
                <form>
                    <div class="modal-body">
                        <h3>Select Status</h3>
                        <select class="form-control" name="change_status" id="change_status" required>
                            <option value="">--Select User Status--</option>
                            <option value="1">Active</option>
                            <option value="2">Inactive</option>
                            <option value="3">Archive</option>
                        </select>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                        <button type="button" class="btn btn-primary" onclick="changeUsersStatus();">Save changes</button>
                    </div>
                </form>
            </div>
        </div>
    </div>



    <!--
    Print Preview and then Print option
    -->


    <div class="modal fade" id="print" tabindex="-1" role="dialog" aria-labelledby="print" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h4 class="modal-title" id="myModalLabel">Change Role</h4>
                </div>
                <form name="print">
                    <div class="modal-body">

                        <label for="user_role_id">User role:</label><span>*</span>
                        <select class="form-control" name="user_role_id" id="user_role_id" required>
                            <option value="">--Select User Role--</option>
                            <?php foreach ($user_roles as $v_user_role) { ?>
                                <option value="<?php echo $v_user_role->user_role_id; ?>" <?php
                                if ($v_user_role->role_name == $user_role) {
                                    echo 'selected';
                                }
                                ?>> <?php echo $v_user_role->role_name ?></option>
                                    <?php } ?>
                        </select>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default" onclick="printDiv('user_list');">print</button>
                        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                    </div>
                </form>
            </div>
        </div>
    </div>


    <!--
    
    Modal:: 
    IMPORT FILE FORM
    
    -->



    <div class="modal fade" id="importFile" tabindex="-1" role="dialog" aria-labelledby="importFile" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h4 class="modal-title" id="myModalLabel">Add User</h4>
                </div>
                <div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
                    <p>
                        <?php
                        $message = $this->session->userdata('message');
                        $this->session->unset_userdata('message');
                        if ($message) {
                            echo $message;
                        }
                        ?>
                    </p>
                    <div class="table-responsive col-sm-12">
                        <?php // echo validation_errors();?>
                        <form action="<?php echo base_url(); ?>super_admin/import_user_csv_file" method="post" name="import_csv" enctype="multipart/form-data" >
                            <div class="form-group col-sm-8" >
                                <label for="user_info_file" style="float:left;">Select CSV File</label><span class="required"> * <?php // echo form_error('user_image');                                                      ?></span><br><br>
                                <input style="float:left;" type='file' onchange="readURL(this, 'file_0');" name="user_info_file" value="<?php // echo set_value('user_image');                                                      ?>"/>
                                <div id="file" style="float:left;width: 50px; height: 50px;" ></div>
                            </div>
                            <div class="form-group col-sm-8" >
                                <label for="user_person_info_file" style="float:left;">Select CSV File</label><span class="required"> * <?php // echo form_error('user_image');                                                      ?></span><br><br>
                                <input style="float:left;" type='file' onchange="readURL(this, 'file_0');" name="user_person_info_file" value="<?php // echo set_value('user_image');                                                      ?>"/>
                                <div id="file" style="float:left;width: 50px; height: 50px;" ></div>
                            </div>
                            <div class="checkbox col-sm-8" >
                                <button type="submit" class="btn btn-default">Submit</button>
                                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                            </div>
                        </form>
                    </div>
                </div>
                <div class="modal-footer">
                    <!--<button type="button" class="btn btn-primary">Save changes</button>-->
                </div>
            </div>
        </div>
    </div>

    <!-- Modal END For Change Role and Status-->


    <SCRIPT LANGUAGE="JavaScript">

        userList = '';
        function toggleAllUserSelection(field) {
            allUser = document.getElementById("all_user").checked;
            if (allUser) {
                for (i = 0; i < field.length; i++) {
                    field[i].checked = true;
                    userList += field[i].value + '.';
                }
                document.getElementById('change_role_button').disabled = false;
                document.getElementById('change_status_button').disabled = false;
            } else {
                for (i = 0; i < field.length; i++)
                    field[i].checked = false;
                userList = '';
                document.getElementById('change_role_button').disabled = true;
                document.getElementById('change_status_button').disabled = true;
            }
        }

        function setUserIdList(userID)
        {
            if ($("#user_id" + userID).is(":checked")) {
                userList += userID + '.';
            } else {
                userList = userList.replace(userID + ".", "");
            }
            if (userList) {
                document.getElementById('change_role_button').disabled = false;
                document.getElementById('change_status_button').disabled = false;
            } else {
                document.getElementById('change_role_button').disabled = true;
                document.getElementById('change_status_button').disabled = true;
            }
        }

        function checkAction(action) {
            message = 'do you want to ' + action + '!!';
            chk = confirm(message);
            if (chk) {
                return true;
            } else {
                return false;
            }
        }



        function changeUsersStatus()
        {
            userStatus = document.getElementById("change_status").value;
            serverPage = '<?php echo base_url(); ?>super_admin/change_users_status/' + userList + '/' + userStatus;
            xmlhttp.open("GET", serverPage);
            xmlhttp.onreadystatechange = function ()
            {
                if (xmlhttp.readyState === 4 && xmlhttp.status === 200)
                {
                    document.getElementById(objID).innerHTML = xmlhttp.responseText;
                    location.reload();
                }
            };
            xmlhttp.send(null);
        }

        function setPerPage(perPage) {

            serverPage = '<?php echo base_url(); ?>super_admin/set_per_page/' + perPage;
            xmlhttp.open("GET", serverPage);
            xmlhttp.onreadystatechange = function ()
            {
                if (xmlhttp.readyState === 4 && xmlhttp.status === 200)
                {
                    location.reload();
                }
            };
            xmlhttp.send(null);
        }

        function sendMailToUser() {
            if (userList === '') {
                userList = '';
                window.location = '<?php echo base_url(); ?>super_admin/send_mail_to_user/' + userList;
            } else {
                window.location = '<?php echo base_url(); ?>super_admin/send_mail_to_user/' + userList;
            }
        }


        function printPreview(divName) {
            serverPage = '<?php echo base_url(); ?>super_admin/make_print_data/' + userList;
            xmlhttp.open("GET", serverPage);
            xmlhttp.onreadystatechange = function ()
            {
                if (xmlhttp.readyState === 4 && xmlhttp.status === 200)
                {
                    window = document.getElementById('print_preview').innerHTML = xmlhttp.responseText;
                }
            };
            xmlhttp.send(null);
        }


        function printDiv(divName) {
            window.print();
        }
    </script>
</div>