<script src="<?php echo base_url();?>ckeditor/ckeditor.js"></script>
      <section class="content-header">
      <h1>

        Members 

      </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/users/alllist');?>">Members</a></li>

        <li class="active"> Instant Message</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">Instant Message </h3>

            </div>
              <form id="add_cat_add" name="add_cat_add" class="form-horizontal" method="post" action="" enctype="multipart/form-data">
           <div class="box-body">
             <div class="row">

               <div class="col-sm-6">
                    <div class="form-group">
                      <label class="col-sm-3 control-label">User Language</label>
                      <div class="col-sm-9">
                      <span style="margin-top: 6px;display: block"><?php if($userDetails['userlanguage']==1){ echo 'German';}elseif($userDetails['userlanguage']==3){ echo 'Spanish';}else{ echo 'English';} ?></span>              
                      </div>
                    </div>
                    <div class="form-group subj">
                      <label class="col-sm-3 control-label">Subject</label>
                      <div class="col-sm-9">
                      <input type="text" class="form-control required" name="subject" id="">              
                      <span style="color:#f00; font-weight: bold"></span>
                      </div>
                    </div>

                    <div class="form-group email_msg">
                      <label class="col-sm-3 control-label">Message</label>
                      <div class="col-sm-9">
                      <textarea id="message" rows="5" class="form-control required" name="message" ></textarea> 
                      <script>
                        CKEDITOR.replace( 'message',{
                                filebrowserBrowseUrl : '/fileman/index.html',
                                filebrowserImageBrowseUrl : '/fileman/index.html?type=image',
                                removeDialogTabs: 'link:upload;image:upload',
                        });
                      </script> 
                      </div>
                    </div>

                    <div class="form-group sms_msg" style="display: none;">
                      <label class="col-sm-3 control-label">Message</label>
                      <div class="col-sm-9">
                      <textarea id="message1" rows="5" class="form-control required" name="message1" ></textarea> 
                      <span style="color:green; display:none;" id="sms_char"><span id="rchars">160</span> Character(s) Remaining...</span><br/>           
                      </div>
                    </div>
               </div>

               <div class="col-sm-6">
                    <ul class="switchList">
                      <li> 
                        <label class="switch"> 
                          <input type="checkbox" name="test" value="1" class="acc_type"> 
                          <span class="slider round"></span>
                        </label>
                        <span class="swtchtext">TEST</span>
                      </li>
                      <span class="email_thing">
                      <li> 
                        <label class="switch"> 
                          <input type="checkbox" name="priority" value="1" class="acc_type"> 
                          <span class="slider round"></span>
                        </label>
                        <span class="swtchtext">Priority high !!!</span>
                      </li>

                      <li> 
                        <label class="switch"> 
                          <input type="checkbox" name="instant_message" value="1" class="acc_type"> 
                          <span class="slider round"></span>
                        </label>
                        <span class="swtchtext">Instant Message</span>
                      </li>

                      <li> 
                        <label class="switch"> 
                          <input type="checkbox" name="email" value="1" class="acc_type" checked> 
                          <span class="slider round"></span>
                        </label>
                        <span class="swtchtext">Email</span>
                      </li>
                      <?php if($to_number!=''){ ?>
                      <li> 
                        <label class="switch"> 
                          <input type="checkbox" name="sms" value="1" class="acc_type"> 
                          <span class="slider round"></span>
                        </label>
                        <span class="swtchtext">SMS</span>
                      </li>
                      <?php } ?>
                     </span>
                    </ul>
                    <span class="receipant" style="margin-bottom:50px;"></span><br/>
                    <input type="hidden" name="sms_msg" id="sms_msg" value="1">
                    <input type="button" class="btn btn-gold" value="Send Message" id="add" onclick="return confirm('Are you sure you want to send?')">
                    
               </div>
             </div>
          </div>
        </form>
          </div>
      
    </div>

  </div>
</div>
    <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;
    }
    .viewfield span input {

    width: 92% !important;
    float: left;

}
.viewfield button {

    height: 35px;
    background: none;
    border: 1px solid #b3975b;
   margin-left: 5px;

}
    </style>

   <script type='text/javascript'>
      /*$("#add_cat_add").validate({
        rules: {
          subject: {
            required: true
          }
        },
        submitHandler: function (form) {
           console.log($('input[name="sms"]').is(':checked'));
           form.submit();
        }
      });*/
      $('#add').click(function(e){
        e.preventDefault();
        if($('input[name="email"]').is(':checked') || $('input[name="instant_message"]').is(':checked'))
        {
          if($('input[name="subject"]').val()=='')
          {
            $('input[name="subject"]').next().html('This field is required');
            return false;
          }
          else{
            $('input[name="subject"]').next().html('');
            $('#add_cat_add').submit();
          }
        }
        else{
          $('input[name="subject"]').next().html('');
          $('#add_cat_add').submit();
        }
      })
      var maxLength = 160;
      /*CKEDITOR.instances['message'].on('key', function(e) {
        if($('input[name="sms"]').is(':checked'))
        {
          var self = this;
          var textlen = maxLength - self.getData().replace(/<[^>]*>|\s/g, '').length;
          if (e.data.keyCode != 32) { 
            $('#rchars').text(textlen);
          }
          if (textlen <= 0) {
              //self.setData((self.getData()).substring(0, 160));
              //CKEDITOR.instances['editor1'].setData((self.getData()).substring(0, 160));
              $('#rchars').text(0);
              //return false;
          }
        }
        
      });
      CKEDITOR.instances['message'].on('focus', function(e) {
        if($('input[name="sms"]').is(':checked'))
        {
          var self = this;
          var textlen = maxLength - self.getData().replace(/<[^>]*>|\s/g, '').length;
          //if (e.keyCode == 32) { 
            $('#rchars').text(textlen);
          //}
          if (textlen <= 0) {
              //self.setData((self.getData()).substring(0, 160));
              //CKEDITOR.instances['editor1'].setData((self.getData()).substring(0, 160));
              $('#rchars').text(0);
              //return false;
          }
        }
      });*/
      $('#message1').on('keyup', function(){
        if($('input[name="sms"]').is(':checked'))
        {
          var self = this;
          var textlen = maxLength - $(this).val().replace(/<[^>]*>|\s/g, '').length;
          //if (e.keyCode == 32) { 
            $('#rchars').text(textlen);
          //}
          if (textlen <= 0) {
              //self.setData((self.getData()).substring(0, 160));
              //CKEDITOR.instances['editor1'].setData((self.getData()).substring(0, 160));
              $('#rchars').text(0);
              //return false;
          }
        }
      })

      $('input[name="sms"]').click(function(){
        if($('input[name="sms"]').is(':checked'))
        {
          $('#sms_char').show();
          $('.subj').hide();
          $('.sms_msg').show();
          $('.email_msg').hide();
          $('input[name="instant_message"]').prop('checked', false);
          $('input[name="email"]').prop('checked', false);
        }
        else
        {
          $('#sms_char').hide();
          $('.subj').show();
          $('.sms_msg').hide();
          $('.email_msg').show();
          $('input[name="sms"]').prop('checked', false);
          $('input[name="email"]').prop('checked', 'checked');
        }
      })
    </script>
    <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/12.1.6/css/intlTelInput.css">
    <script src="<?php echo base_url(); ?>assets/js/intlTelInput.js"></script>  
   <script type="text/javascript">
    function return_back()
    {
      var back_url='<?php echo base_url()?>admin/users/alllist';
      window.location=back_url;
    }
   </script>
