<? global $vis_language; ?>
<section id="breadcrumb" class="row m-b m-l-none m-r-none">
   <div class="col-sm-6">
      <h3 class="m-b-xs text-black"><?  echo $vis_language['TXTNEWTWILIO']; ?></h3>
      <ul class="breadcrumb bg-empty no-border m-b-xxs no-padder">
		<li><a class="link" href="#/home/quick_view/<? echo $vis_language['TXTHOME']; ?>"><? echo $vis_language['TXTHOME']; ?></a></li>
		<li><a class="link" href="#/setting/setting_menu/<? echo $vis_language['TXTSETTINGS'];?>" onclick="$('#vis_workpanel_div').visExecution('load_module','<? echo $vis_language['TXTSETTINGS'];?>',{'vis_module':'setting','vis_operation':'setting_menu'});"><? echo $vis_language['TXTSETTINGS']; ?></a></li>
		<li><a class="link" href="#/setting/twilio/<? echo $vis_language['TXTTWILIO'];?>" onclick="$('#vis_workpanel_div').visExecution('load_module','<? echo $vis_language['TXTTWILIO'];?>',{'vis_module':'setting','vis_operation':'twilio'});"><? echo $vis_language['TXTTWILIO']; ?></a></li>
		<li><a class="link" href="#/setting/twilio_number/<? echo $vis_language['TXTTWILIONUMBER'];?>" onclick="$('#vis_workpanel_div').visExecution('load_module','<? echo $vis_language['TXTTWILIONUMBER'];?>',{'vis_module':'setting','vis_operation':'twilio_number'});"><? echo $vis_language['TXTTWILIONUMBER']; ?></a></li>
		<li class="active"><? echo $vis_language['TXTNEWTWILIO']; ?></li>
	 </ul>
   </div>
</section>
<section class="padder">
   <section class="panel panel-default">
      <header class="panel-heading sub_header"><? echo $vis_language['TXTNEWTWILIO']; ?></header>
      <form class="form-horizontal" data-validate="parsley" id="vis_new_twilio_num" name="vis_new_twilio_num" method="post" >
         <div class="panel-body">
            <div class="col-md-12">
               <div class="wrapper">
				   <div class="form-group">
                     <label class="col-sm-2 control-label p-d-sm"><? echo $vis_language['TXTAPP']; ?></label>
                     <div class="col-sm-10">
                        <select name="vis_integration_id" id="vis_integration_id" class="form-control input-sm selectpicker"<? if(count($integration_details)>10) echo ' data-live-search="true"';?>  onchange="javascript:vis_change_app()">
							<option value="0"> <? echo $vis_language['TXTSELECT']; ?> </option>
							<? if($integration_details!=-1) for($i=0;$i<count($integration_details); $i++)
								echo '<option value="'.$integration_details[$i]['integration_id'].'">'.$integration_details[$i]['db_name'].'</option>' ?>
						</select>
                     </div>

                  </div>
                  <div class="form-group">
                    <label class="col-sm-2 control-label p-d-sm"><? echo $vis_language['TXTTITLE']; ?></label>
                     <div class="col-sm-10">
                        <input class="form-control input-sm" type="text" name="vis_title" id="vis_title" value="">
                     </div>
				  </div>
                  <div class="form-group">
                    <label class="col-sm-2 control-label p-d-sm"><? echo $vis_language['TXTTWILIONUMBER']; ?></label>
                    <div class="col-sm-10">
                       <input class="form-control input-sm" type="text"  name="vis_twilio_number" id="vis_twilio_number"  placeholder="<? echo $vis_language['TXTPHONEEG']; ?>">
                    </div>
				  </div>
                   <div class="form-group">
                     <label class="col-sm-2 control-label p-d-sm"><? echo $vis_language['TXTWELCOMEMSG']; ?></label>
                     <div class="col-sm-10">
                        <input class="form-control input-sm" type="text" name="vis_welcome_msg" id="vis_welcome_msg" value="">
                     </div>
                  </div>
				  <div class="form-group">
                     <label class="col-sm-2 control-label p-d-sm"><? echo $vis_language['TXTALLOWOUTBOUND']; ?></label>
                     <div class="col-sm-8">
                        <label class="checkbox-inline i-checks">
							<input id="vis_inbound_outbound" type="checkbox" checked="checked" name="vis_inbound_outbound" value="0"><i></i>‌
						</label>
                     </div>
					 <div class="col-sm-2">
						  <label>
						  <button type="button" class="btn btn-primary btn-xs"  onclick="javascript:vis_add_new()"><? echo $vis_language['TXTADDNEW']; ?></button>
						  </label>
					   </div>
                  </div>

                  <div id="change_twilio_app"> </div>
				<input type="hidden" name="total_call_details" id="total_call_details" value="0">
               </div>
            </div>
            </div>
      </form>
        <div class="padder">
		    <div class="line b-b line-lg pull-in"></div><br/>
         <div class="col-sm col-sm-offset-2">
            <button type="button" class="btn btn-primary" onclick="$('#vis_workpanel_div').visExecution('submit_form',{'vis_module':'setting', 'vis_operation':'add_twilio_number', 'vis_form':'vis_new_twilio_num' })"><? echo $vis_language['TXTADD']; ?></button>
         </div><br/>
      </div>
   </section>
</section>
<script type="text/javascript">
  $(".selectpicker").selectpicker();
	function vis_change_app(){
		$("#change_twilio_app").html('');
		$("#total_call_details").val(0);
	}
    function vis_add_new(){
		var integration_id = $("#vis_integration_id").val();
		var total_call_details = $("#total_call_details").val();
		if(integration_id==0){
			$('#change_twilio_app').html('');
		}else{
			$("#total_call_details").val(parseInt(total_call_details)+1);
			var data = {'integration_id':integration_id,'type_id':total_call_details};
			$.ajax({
				url: 'index.php?vis_module=setting&vis_operation=get_twilio_call_department',
				data: data,
				type: "POST",
				success: function(data) {
					$("#change_twilio_app").append(data);
				},
				error: function(xhr, ajaxOptions, thrownError) {$("#vis_global_msg_div").visInterface("load_global_message", "Error: "+xhr.status+" - "+thrownError);}
			});
		}
	}
	function vis_change_department(id){
	    var department_id = $("#vis_department"+id).val();
		if(department_id==0){
			$("#vis_dept_list_section"+id).html('');
		}else{
			var result = department_id.split(':');
			var data = {'department_id':result[1],'type_id':id};
			$.ajax({
				url: 'index.php?vis_module=setting&vis_operation=get_department_staff',
				data: data,
				type: "POST",
				success: function(data) {
					$("#vis_dept_list_section"+id).html(data);
				},
				error: function(xhr, ajaxOptions, thrownError) {$("#vis_global_msg_div").visInterface("load_global_message", "Error: "+xhr.status+" - "+thrownError);}
			});
		}
	}
	function close_call_details(id){
		$("#call_details_div"+id).html('');
		$("#call_details_div"+id).hide();
	}

</script>
