  <script src="https://cdn.ckeditor.com/4.7.1/standard/ckeditor.js"></script>
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-switch/3.3.4/css/bootstrap2/bootstrap-switch.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-switch/3.3.4/js/bootstrap-switch.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.5/css/select2.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.5/js/select2.full.min.js"></script>
        <section class="content-header">

      <h1>

        Admin Users 

      </h1>

      <ol class="breadcrumb">

        <li><a href="<?php echo base_url().'admin';?>"><i class="fa fa-dashboard"></i> Home</a></li>

        <li><a href="<?php echo base_url('admin/administrator');?>">Administrator</a></li>

        <li class="active"> Permission</li>

      </ol>

    </section>

    

    <section class="content">

      <div class="row">

      <?php echo $this->utility->showMsg();?>

        <div class="col-md-12">

        <div class="loader" style="display:none;"><img src='<?php echo base_url();?>assets/images/loading.gif' alt='loading' /></div>

          <!-- Horizontal Form -->

          <div class="box box-info">

            <div class="box-header with-border">

              <h3 class="box-title">Add </h3>

            </div>

            <!-- /.box-header -->

            <!-- form start -->

            <form id="add_frm" name="add_frm" class="form-horizontal" method="post" action="" enctype="multipart/form-data">

              <div class="box-body">

                <div class="form-group">

                  <label class="col-sm-2 control-label">Left panel modules</label>

                  <div class="col-sm-10">
                      <div class="controls">
                          <select class="form-control select2" multiple="multiple" name="selected_modules[]" data-placeholder="Select Modules" style="width: 100%;">
                              <?php
                              //print_r($user_module_ids); die;
                              foreach($modules as $value)
                              {
                                  if(in_array($value['id'],$user_module_ids))
                                      continue;

                              ?>
                              <option value="<?php echo base64_encode($value['id'])?>"><?php echo $value['module_name'];?></option>
                              <?php
                              }
                              ?>
                          </select>
                      </div>
                      
                  </div>

                </div>
                
              </div>
              <!-- /.box-body -->

              <div class="box-footer">

                <button type="button" onclick="return_back()"class="btn btn-default  margin-left  " >Cancel</button>

                <input type="submit" class="btn btn-info " value="Add" id="add">

              </div>

              <input type="hidden" name="frmSecurity" value="<?php echo $this->utility->getSecurity();?>"/>

              <!-- /.box-footer -->

            </form>

          </div>

          <div class="portlet box green">
              
              <div class="portlet-body">
                  <table class="table table-hover">
                      <thead>
                          <tr>
                              <th>#</th>
                              <th>Module</th>
                              <th class="no_sort">Read</th>
                              <th class="no_sort">Read & Write</th>
                              <th class="no_sort">Action</th>
                          </tr>
                      </thead>
                      <tbody>
                              <?php 
                              if(!empty($user_modules))
                              {
                                  foreach($user_modules as $key=>$value)
                                  {
                                  ?>
                                      <tr>
                                          <td><?php echo $key+1?></td>
                                          <td><?php echo $value['module_name']?></td>
                                          <td><input id="switch-size" user-module-id="<?php echo base64_encode($value['id']);?>" name="read_access" type="checkbox" <?php echo ($value['read_access'])?'checked':''?> data-size="mini"></td>
                                          <td><input id="switch-size" user-module-id="<?php echo base64_encode($value['id']);?>" name="write_access" type="checkbox" <?php echo ($value['write_access'])?'checked':''?> data-size="mini"></td>
                                          <td><a href="<?php echo base_url();?>admin/administrator/deleteAccess/<?php echo base64_encode($value['id']);?>/<?php echo ($this->uri->segment(4));?>" title="Delete" onclick="return confirm('Are you sure to delete ?');"><span class="fa fa-ban"></span></a></td>
                                      </tr>
                                  <?php
                                  }
                              }
                              else
                                      echo '<tr>'
                                      . '<td>No Permissions are found</td></tr>';
                              ?>
                      </tbody>
                  </table>
              </div>
          </div>

          <!-- /.box -->

         

          <!-- /.box -->

        </div>

        <!--/.col (right) -->

      </div>

      <!-- /.row -->

    </section>

    <style type="text/css">

    .loader{

      position: fixed;

      left: 0;

      top: 0;

      right: 0;

      bottom: 0;

      width: 100%;

      height: 100%;

      background-color: rgba(0, 0, 0, 0.60);

      z-index: 9999;

      text-align: center;

    }

    .loader img{

      z-index: 99999;

      margin-top: 10%;

    }
    input#password {
        -webkit-text-security: disc;
        -moz-text-security: disc;
    }

    </style>
  <script type='text/javascript'>
      $("#add_frm").validate({
        rules: {
          useremail: {
            required: true,
            email:true
          },
          userusername:{
            required: true,
          },
          userpassword:{
            required:true
          }
        }
      });
      $(function(){
        //$('.past').multiselect();
          var change_permission=function(data){
            var targetUrl="<?php echo base_url().'admin/administrator/change_permission'?>";
            var obj=ajaxFunctionNew(data,targetUrl);
            obj.success(function(res){
                //alert(res);
            });
          };

          function ajaxFunctionNew(data,url,dataType)
          {
            if(!dataType)
                dataType="JSON";
              return $.ajax({
                  url:url,
                  data:data,
                  type:'POST',
                  dataType:dataType
                });
          }
          $(".select2").select2();
          $('#select').click(function(){
              $('select[name=modules] option:selected').each(function(i,j){
                  $('#selected_modules')
                      .append($("<option></option>")
                      .attr("value",$(this).val())
                      .attr("selected","selected")
                      .text($(this).text())); 
                  $('select[name=modules] option[value=\''+$(this).val()+'\']').remove();
                  $('.select2').trigger('change.select2');
              });
          });
          $('#unselect').click(function(){
              $('#selected_modules option').each(function(i,j){
                  if(!$(this).is(':selected'))
                  {
                      $('select[name=modules]')
                          .append($("<option></option>")
                          .attr("value",$(this).val())
                          .text($(this).text())); 
                      $('#selected_modules option[value=\''+$(this).val()+'\']').remove();
                      $('.select2').trigger('change.select2');
                  }
              });
          });
          $('#selected_modules').on("select2:unselect", function(e) { 
              $('#unselect').trigger('click');
          });

          $("input[type=checkbox]").bootstrapSwitch({
              offColor:'danger'
          });

          $("input[name='read_access']").on('switchChange.bootstrapSwitch', function(event, state) {
              var data={
                  'frmSecurity':'<?php echo $this->utility->getSecurity();?>',
                  'read_access':2,
                  'id':$(this).attr('user-module-id')
              };
              if(state==true)
                  data.read_access=1;
              change_permission(data);

          });
          $("input[name='write_access']").on('switchChange.bootstrapSwitch', function(event, state) {
             var data={
                  'frmSecurity':'<?php echo $this->utility->getSecurity();?>',
                  'write_access':2,
                  'id':$(this).attr('user-module-id')
              };
              if(state==true)
              {
                  data.write_access=1;
                  $(this).closest('tr').find("input[name='read_access']").bootstrapSwitch('state', true, true);
              }
              change_permission(data);
          });
      });
      
  </script>

  <script type="text/javascript">
    function return_back()
    {
      var back_url='<?php echo base_url()?>admin/administrator';
      window.location=back_url;
    }
  </script>
  <style type="text/css">
   .multiselect-container {background: #131217;height: 200px; overflow-y: scroll; overflow-x: hidden;}
   .multiselect-container input[type="checkbox"] { margin-left: -20px !important; margin-right: 0 !important;}
   .box-footer .btn.btn-default, .btn.btn-default:hover {
    color: #ffffff;
    background-color: #ff6600 !important;
    border-color: #ff9630 !important;
    border-radius: 0 !important;
    text-transform: uppercase !important;
}
.dropdown-menu > li > a {
    color: #b3975b;
}
button.multiselect {
    background: #22222c;
    border-color: #b3975b;
    color: #b3975b;
    margin-left: -7px !important;
}
   </style>