<?php 
$autocomp_url=site_url('admin/ajax/handsontable/autocomplete/');

?>

<style>
.make-me-red {
  color: #f00;
}

.currentRow {
  background-color: #F9F9FB !important;
}
.currentCol {
  background-color: #F9F9FB !important;
}

.scroll-container {
  width: 100%;
  height:  300px;
  overflow: hidden; }

.fixed-container .hot table.htCore {
  -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.4);
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.4); }

.handsontable .htItemWrapper {
  font-size: 12px;
  font-family: Verdana, Helvetica, Arial, FreeSans, sans-serif; }

.handsontable td[class*="column"] + [class*="column"]:last-child {
  float: none; }

</style>
<body dir=rtl>
<?=$tabs?>
<?php
$books_num=dbNum('id','books');
if(APP_TYPE=='f' and $books_num >= sett('free_books_limit')): ?>
	<div class="uk-alert-warning" uk-alert >
	<?= sprintf(lang('free_books_limit_msg'),sett('free_books_limit'),SHIRA_URL);?>
	</div>
<?php else: ?>
<div class="uk-card uk-card-default uk-card-body uk-padding-small">

<ul uk-accordion>
    <li>
        <a class="uk-accordion-title uk-text-muted" href="#"><span uk-icon="info"></span>
 <?=lang('add_multi.help_title')?></a>
        <div class="uk-accordion-content">
		<?=lang('add_multi.help_body')?>
		
		</div>
    </li>
</ul>

   
	
    

</div>


<div id="table" dir=ltr class="scroll-container fixed-container"></div>
  <div class="uk-margin ">
   <!--label><input id="allow_insert_other_table" class="uk-checkbox" type="checkbox"> منع إدخال الأسماء غير موجودة سابقا</label><br/-->
      <label><input id="first_row_is_header" class="uk-checkbox" type="checkbox"> <?=lang('add_multi.ignore_frist_row')?>	</label><br/>
     <button  name="save" id="save" class="uk-button uk-button-primary uk-margin-top" href=""> <?=lang('save')?> </button>       
     
        </div>
<?php endif; ?>

</body>
<script>

var data = <?=json_encode($table_rows)?>;
  save = document.getElementById('save');
  


var container = document.getElementById('table');
var hot = new Handsontable(container, {
	licenseKey: 'non-commercial-and-evaluation',
  data: data,
 
  rowHeaders: true,
  colHeaders: true,
  manualColumnResize: true,
  manualRowResize: true,

  //colWidths: 100,
  startRows: 15,
  startCols: 15,
  minSpareRows: 2,
   currentRowClassName: 'currentRow',
  currentColClassName: 'currentCol',
  contextMenu: false,
  columnSorting: false,
  

  filters: false,
 columns: [
 {"title":"<?=lang('book_id')?>","type":"numeric"},
 {"title":"<?=lang('isbn_no')?>"},
 {"title":"<?=lang('book_name')?>",width: 180},
 {"title":"<?=lang('note_line')?>"},
 {"title":"<?=lang('mujallad_no')?>","type":"numeric"},
 {"title":"<?=lang('muallif_or_musannif')?>",
 "type":"autocomplete",
  allowInvalid: true,
width: 180,
 source: function (query, process) {
        $.ajax({        
          url: '<?=$autocomp_url?>',
          dataType: 'json',
          data: {
            q: query,
            table: 'muallifeen',
            clm_name: 'name',
          },
          success: function (response) {process(response);}
        });
      },
      strict: false,
 
 },
 {"title":"<?=lang('muhaqqiq_or_mutarjim')?>",
 "type":"autocomplete",
  allowInvalid: true,
width: 180,
 source: function (query, process) {
        $.ajax({        
          url: '<?=$autocomp_url?>',
          dataType: 'json',
          data: {
            q: query,
            table: 'muallifeen',
            clm_name: 'name',
          },
          success: function (response) {process(response);}
        });
      },
      strict: false,
 
 },
 {"title":"<?=lang('cat')?>","type":"autocomplete",
  allowInvalid: true,
width: 180,
 source: function (query, process) {
        $.ajax({        
          url: '<?=$autocomp_url?>',
          dataType: 'json',
          data: {
            q: query,
            table: 'aqsam',
            clm_name: 'name',
          },
          success: function (response) {process(response);}
        });
      },
      strict: false,
 
 },
 {"title":"<?=lang('publisher')?>","type":"autocomplete",
  allowInvalid: true,
width: 180,
 source: function (query, process) {
        $.ajax({        
          url: '<?=$autocomp_url?>',
          dataType: 'json',
          data: {
            q: query,
            table: 'nashireen',
            clm_name: 'name',
          },
          success: function (response) {process(response);}
        });
      },
      strict: false,
 
 },
 {"title":"<?=lang('taba_no')?>"},
 {"title":"<?=lang('sana_taba')?>"},
 {"title":"<?=lang('lang')?>"},
 {"title":"<?=lang('book_details')?>",width: 180},
 {"title":"<?=lang('book_stts')?>"},
 {"title":"<?=lang('shelf_no')?>"},
 {"title":"<?=lang('raff_no')?>"}
 ],
  
});
  


Handsontable.dom.addEvent(save, 'click', function() {
  // save all cell's data
 // console.log(JSON.stringify({data: hot.getData()}))
  var url ='<?=site_url()?>/admin/ajax/books/add_multi';
  $.ajax({
        url: url,
		dataType: 'json',

        type: 'post',
        data: {
          json: JSON.stringify({data: hot.getData()}),
          allow_insert_other_table: $('#allow_insert_other_table').is(":checked"),
          first_row_is_header: $('#first_row_is_header').is(":checked"),

        }
      }).done(function(val) {
		
	  console.log(val)
	  if(val.ok){
		  UIkit.notification({message: val.msg, status: 'success', pos: 'top-center', timeout: 5000});
	  }else{
		  UIkit.notification({message:val.msg, status: 'danger', pos: 'top-center', timeout: 3000});
		  
	  }
		  
		}).error(function(val) {

	  console.log(val);
		  UIkit.notification({message: JSON.stringify(val), status: 'danger', pos: 'top-center', timeout: 5000});
		})
  
  

});

hot.selectCell(0,0);
</script>