<? global $vis_language;?>
<link href="<?= VIS_PATH_SCRIPT; ?>colorpicker/css/bootstrap-colorpicker.min.css" rel="stylesheet">
<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['TXTCALENDEREVENTS'];?></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="#/home/get_gcal_event_list/<?  echo $vis_language['TXTEVENTS'];?>" onclick="$('#vis_workpanel_div').visExecution('load_module', '<?  echo $vis_language['TXTEVENTS'];?>', {'vis_module':'home', 'vis_operation':'get_gcal_event_list'})"><? echo $vis_language['TXTCALENDEREVENTS']; ?></a></li>
         <li class="active"> <? echo $vis_language['TXTADDCALENDEREVENT'];?></li>
      </ul>
      <div>
      </div>
   </div>
</section>
<section class="padder">
   <section class="panel panel-default">
      <header class="panel-heading sub_header"><? echo $vis_language['TXTADDCALENDEREVENT']; ?></header>
      <div class="panel-body">
         <form  class="form-horizontal" id="vis_new_gcal_event_form" name="vis_new_gcal_event_form" method="post">
			 <div class="form-group">
				<label class="col-sm-2 control-label"><? echo $vis_language['TXTCALENDARLIST'];?></label> 
				<div class="col-sm-10">
				<select class="form-control input-sm selectpicker" id="vis_cal_list" name="vis_cal_list" <?php if(count($calList['items']) > 5) $src= 'data-live-search="true"' ; ?>   >
				<?
				   for($i=0;$i<count($calList['items']);$i++) {                                      
				   echo '<option value="'.$calList['items'][$i]['id'].'" >'.$calList['items'][$i]['summary'].'</option>'; } ?>
				</select>
				</div>
			 </div>			 
								 	
            <div class="form-group">
               <label class="col-sm-2 control-label"><? echo $vis_language['TXTTITLE']; ?></label>
               <div class="col-sm-10">
                  <input class="form-control input-sm" type="text" name="vis_eventname" id="vis_eventname" >
               </div>
            </div>
            <div class="form-group">
               <label class="col-sm-2 control-label"><? echo $vis_language['TXTDESCRIPTION']; ?></label>
               <div class="col-sm-10">
                  <textarea class="form-control" rows="2" data-minwords="6"  name="vis_event_desc" id="vis_event_desc" ></textarea>
               </div>
            </div>
			<div class="form-group">
               <label class="col-sm-2 control-label"><? echo $vis_language['TXTLOCATION']; ?></label>
               <div class="col-sm-10">
                  <input  class="form-control input-sm demo-auto" name="vis_event_loc" id="vis_event_loc" type="text">
               </div>
            </div>
		   <div class="form-group">
               <label class="col-sm-2 control-label"><? echo $vis_language['TXTGUESTEMAIL']; ?></label>
               <div class="col-sm-10">
                  <input  class="form-control input-sm demo-auto" name="vis_event_guest_email" id="vis_event_guest_email" type="text">
                   <script type="text/javascript">
                       $(document).ready(function() {
                                        $("#vis_event_guest_email").tokenInput(
                                            "index.php?vis_module=client&vis_operation=list_clients&vis_domain=<? echo $operation['domain_id']; ?>&vis_event=1",
                                            {
                                                theme: "facebook",
                                                searchDelay: 300,
                                                minChars: 3,
                                                queryParam: "vis_data",
                                                propertyToSearch: "email",
                                                tokenValue: "email",
                                                preventDuplicates: true,
                                                resultsFormatter: function(item) {
													var contact= ( item.contact_number!='' && item.email!='')? item.email+' - '+item.contact_number : ((item.contact_number!='' && item.email=='')? item.contact_number:item.email );
                                                    return "<li>" + "<div style='display: inline-block; padding-left: 10px;'><div class='full_name'>" + item.full_name + " < " +contact+ " ></div></div></li>";
                                                },
                                                tokenFormatter: function(item) {
													var contact= (item.email=='')? item.contact_number :  item.email ;
                                                    return "<li><p>" + contact + "</p></li>";
                                                }
                                            }
                                        );
                                        $("div.token-input-dropdown-facebook").css('width', $(".token-input-list-facebook").width() + 2 + 'px');
                                        $("#token-input-vis_event_guest_email").parent().css('width','100%');
                                    });
                                </script>
               </div>
            </div>
            <div class="form-group">
			  <label  class="col-sm-2 control-label"><? echo $vis_language['TXTSTARTDATE'];?></label>
			  <div class="col-sm-4">
			   <span class="input-group-addon no-padder no-borders start">  <input class="input-sm form-control" id="vis_event_start_date" name="vis_event_start_date" size="16" type="text" placeholder="DD-MM-YYYY" ></span>
			  </div>
			  <label  class="col-sm-2 control-label"><? echo $vis_language['TXTENDDATE'];?></label>
			  <div class="col-sm-4">
			   <span class="input-group-addon no-padder no-borders start">  <input class="input-sm form-control" id="vis_event_end_date" name="vis_event_end_date" size="16" type="text" placeholder="DD-MM-YYYY" ></span>
		   </div>
		   </div>
            <div class="line b-b line-lg pull-in"></div>
            <br/>
            <div class="form-group">
               <div class="col-sm-4 col-sm-offset-2">
                  <button type="button" class="btn btn-primary" onclick="$('#vis_workpanel_div').visExecution('submit_form',{'vis_module':'home', 'vis_operation':'new_gcal', 'vis_form':'vis_new_gcal_event_form','vis_event':1})"><? echo $vis_language['TXTADD']; ?></button>
               </div>
            </div>
      </form>
      </div>
   </section>
</section>
<script type="text/javascript">
 $(".selectpicker").selectpicker();
 $('.start').datetimepicker({
        format: "<?php echo VIS_DATETIMEPICKER_FORMAT;?>"
	});
</script>
