<?php 

require_once ("$toolkit/selecthourmin.php");

class ImageCapture  {
  private $field;
  private $rowList;
  private $cardinals;
  private $control;
  private $label;

  public function __construct($field) {

  $props = (object)array(
              "field"     => "time_taken",
              "label"     => "Time",
              "hourRange" => "00,23",
              "iterator"  => "selectimage_divisions",
              "format"    => "time",              
              "minList"   => "00,15,30,45"
 	            );

      $photoTime = new SelectHourMin($props);
      $this->photoTimeLayout = $photoTime->outputLayout();
      $this->photoTimeScript = $photoTime->outputScript();

    if (isset($field)) {
      $this->field   = $field->field;
      $this->label   = $field->label;

      if (isset($field->rowList))
        $this->rowList = $field->rowList;
      else
        $this->rowList = '{}';

//$cnt = count($field->directions);
//print_r ("ecnt:$cnt");     
      $directions = "<option value=0>Direction</option>";
      foreach ($field->cardinals as $option) {
        $directions .= "<option value=$option->id>$option->descr</option>";
      }

      $groupings = "<option value=0>Grouping</option>";
//      foreach ($field->grpList as $option) {
//        $groupings .= "<option value=$option->id>$option->text</option>";
//      }

      $this->control = "
      <tr id='template$this->field' style='border:1px solid grey;height:80px'>
        <td style='width:5%;margin-bottom:0px;'>
          <input id=0 type='checkbox' class='img-summ$this->field'>
          <div id=0 class='upd-sub$this->field'></div> 
        </td>          
        <td style='margin-bottom:0px;'>
          <button id='realButton' type='button' class='btn btn-default' style='width:110px;height:85px;position:relative;'>
            <span style='font-size:3.0em;position:absolute;right:10;bottom:0;' class='glyphicon glyphicon-camera'></span>
            <input id='upload$this->field' type='file' id='files' visbility='hidden'
            style='width:100%;height:100%;opacity:0;'/>
          </button>
        </td>
        
        <td valign='top' style='width:15%;margin-bottom:0px;'>        
     $this->photoTimeLayout<br>
          <select class='image$this->field' name='cardinal_id' style='margin:0px;height:26px'>
            $directions
          </select>
          <div id=filename style='height:12px;font-size:12px;font-weight:700;'></div>
        </td>
        <td valign='top' style='width:15%;margin-bottom:0px;'>        
          <label style='margin-bottom:0px;'>Location</label><br>   
          <input type='text' class='image$this->field' name='location'>          
          <select class='image$this->field' name='phototag_id' style='margin:0px;height:26px'>
            $groupings
          </select>
        </td>
        <td valign='top' colspan='3' style='width:45%;margin-bottom:0px;'> 
          <label style='margin-bottom:0px;'>Notes</label>        
          <textarea class='image$this->field' name='note' rows='3'></textarea>
        </td>
        <td style=width:5%;margin-bottom:0px;>
          <button id=0 class='btn btn-inverse commit$this->field' name='commit$this->field'>Commit</button>
        </td>
      </tr>
    ";
    }
  }
  
  public function outputLayout() {

    $layout = "
<label style='margin-bottom:0px;'>$this->label</label><br>
<div style='border:1px solid #ccc;height:30em;overflow-x:auto;'>

  <table class='list$this->field' style='float:right;'>
    <tbody id='list$this->field'>
    ";    
    
    foreach ($this->rowList as $row) {

      $layout .= "
    $this->control
      "; 
    }
                      
    $layout .= "
      <tr>
        <td colspan='6'>
          <button class='btn btn-inverse' id='delete$this->field' style='width:150px;'>Delete</button>
        </td>
      </tr>  
    </tbody>
  </table>
</div>
   ";
    return $layout;
  }	

  public function outputScript() {

	  $script = "
    
$this->photoTimeScript
    
// IMAGE-CAPTURE

var selectId$this->field = 0;
var rowid$this->field = 0;

$(document).on('click', '.commit$this->field', function (e) {
  var rowid  = $(this).prop('id'); // selected row id
  put$this->field (rowid);
});

$(document).on('click', '#delete$this->field', function (e) {
  putdel$this->field (rowid$this->field);
});

$(document).on('change', '#upload$this->field', function(e) {
  var photoToUpload = $(this).prop('files')[0];
 
  var now = new Date();  
  var hours = now.getHours();
  var minutes = now.getMinutes();
  var m = (((minutes + 7.5)/15 | 0) * 15) % 60;
  var h = ((((minutes/105) + .5) | 0) + hours) % 24;
  var time = addZero$this->field (h) + ':' + addZero$this->field (m);

  add$this->field (photoToUpload, time); 
  
});

$(document).on('click', '.img-summ$this->field', function (e) {
  
  if (!$(this).prop('checked')) {
    $('#delete$this->field').prop('disabled', false);
    var rowid$this->field = 0;
  }
  else {  
    $('.img-summ$this->field').prop('checked', false);
    $(this).prop('checked', true);
    $('#delete$this->field').prop('disabled', false);
    var rowid$this->field = $(this).prop('id');
  }	
});

function addZero$this->field (i) {
  if (i < 10) {
    i = '0' + i;
  }
  return i;
}

function setimgImageCapture (id) {
  selectId$this->field = id;    
}

function com$this->field (message) {
  var key = Object.keys(message); 

  $('#valmsg$this->field').html('');

  if (key == 'selectId') {
    selectId$this->field = message[key][0];
    get$this->field (selectId$this->field);
  }
}

multiFunction['com$this->field'] = {
  com$this->field: com$this->field
}; 

function gen$this->field(rows) {

  $('.listrow$this->field').each (function () {
    $(this).remove();
  });    
  
  for (var i=0; i<rows.length; i++) {

    var rowid       = rows[i].id;
    var filePath    = rows[i].filename;
    var fileName    = filePath.substring(filePath.lastIndexOf('/')+1);
    var cardinal_id = rows[i].cardinal_id;
    var phototag_id = rows[i].phototag_id;
    var note        = rows[i].note;
    var location    = rows[i].location;
    var taken       = rows[i].time_taken;
    var note        = rows[i].note;
//alert (filePath); 
    $('#template$this->field').clone().appendTo('#list$this->field');
    $('#template$this->field td:eq(1)').html('<div class=thumbs><div class=thumb><img src=\"../..'+filePath+'\"/></div></div>');
    

    $('#template$this->field').prop('class', 'listrow$this->field');
    $('#template$this->field').prop('id', rowid);
    $('#template$this->field').prependTo('#list$this->field');
    $('#'+rowid+'.listrow$this->field .img-summ$this->field').prop('id',rowid);
    $('#'+rowid+'.listrow$this->field .upd-sub$this->field').prop('id',rowid);

    
    
    $('#'+rowid+'.listrow$this->field input[name='+'time_taken'+']').prop('id',rowid);
    $('#'+rowid+'.listrow$this->field select[name='+'hour_taken'+']').prop('id', rowid);
    $('#'+rowid+'.listrow$this->field select[name='+'min_taken'+']').prop('id',rowid);
    $('#'+rowid+'.listrow$this->field input[name='+'time_taken'+']').prop('value',
      taken).trigger('chgselectimage_divisions', [rowid]);

    $('#'+rowid+'.listrow$this->field input[name='+'location'+']').prop('value',location);
    $('#'+rowid+'.listrow$this->field textarea[name='+'note'+']').prop('value', note);

    $('#'+rowid+'.listrow$this->field div[id='+'filename'+']').html(fileName);

    $('#'+rowid+'.listrow$this->field select[name='+'cardinal_id'+']').find('option[value='+cardinal_id+']').prop('selected', true);
    $('#'+rowid+'.listrow$this->field select[name='+'phototag_id'+']').find('option[value='+phototag_id+']').prop('selected', true);
    $('#'+rowid+'.listrow$this->field button[name='+'commit$this->field'+']').prop('id',rowid);

  }  
} 

function get$this->field (id) {

  var params = 'currid=' + id;
  
  var xhr = new XMLHttpRequest();
  xhr.open('POST', 'ajax/get$this->field.php', true);
  xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
  xhr.onreadystatechange = function() {//Call a function when the state changes.
    if (xhr.readyState == 4 && xhr.status == 200) {
      var response = JSON.parse(xhr.responseText)
      gen$this->field(response);
   }
  }  
  xhr.send(params);
}

function add$this->field (photoFile, time) {
  var params = 'taken=' + time + '&' + 'selectid=' + selectId$this->field;
  var xhr = new XMLHttpRequest();
  xhr.open('POST', 'ajax/add$this->field.php', true);
  xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
  xhr.onreadystatechange = function() {//Call a function when the state changes.
    if (xhr.readyState == 4 && xhr.status == 200) {
      var response = JSON.parse(xhr.responseText);
      var fd = new FormData();
      fd.append('fileToUpload', photoFile);
      fd.append('photo_id', response[0]);
      fd.append('fileName', response[1]);
      fd.append('dirName', response[2]);
      fd.append('pathName', response[3]);
      fd.append('timeTaken', response[4]);
      upl$this->field (fd);
    }
  }  
  xhr.send(params);
}

function put$this->field (rowid) {
  
  var params = 'rowid=' + rowid + '&';
  params += 'time_taken=' + $('#'+rowid+'.listrow$this->field input[name='+'time_taken'+']').val() + '&';
  params += 'cardinal_id=' + $('#'+rowid+'.listrow$this->field select[name='+'cardinal_id'+']').val() + '&';
  params += 'location=' + $('#'+rowid+'.listrow$this->field input[name='+'location'+']').val() + '&';
  params += 'phototag_id=' + $('#'+rowid+'.listrow$this->field select[name='+'phototag_id'+']').val() + '&';
  params += 'note=' + $('#'+rowid+'.listrow$this->field textarea[name='+'note'+']').val();

  var xhr = new XMLHttpRequest();
  xhr.open('POST', 'ajax/put$this->field.php', true);
  xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
  xhr.onreadystatechange = function() {//Call a function when the state changes.
    if (xhr.readyState == 4 && xhr.status == 200) {
      var response = JSON.parse(xhr.responseText)
    }
  }  
  xhr.send(params);
}

function putdel$this->field (id) {

  var params = 'rowid=' + id;
  
  var xhr = new XMLHttpRequest();
  xhr.open('POST', 'ajax/putdel$this->field.php', true);
  xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
  xhr.onreadystatechange = function() {//Call a function when the state changes.
    if (xhr.readyState == 4 && xhr.status == 200) {
      var response = JSON.parse(xhr.responseText)
      get$this->field (abcdef$this->field);
    }
  }  
  xhr.send(params);
}

function upl$this->field (formData) {

  var xhr = new XMLHttpRequest();
  xhr.open('POST', 'ajax/upl$this->field.php', true);
  xhr.onload = function() {//Call a function when the state changes.
    var response = JSON.parse(xhr.responseText);
    var filePath = response[3] + '/' + response[1];
    var button = 'button';
    var rowid = response[0]; 
      
    $('#template$this->field').clone().appendTo('#list$this->field');
    $('#template$this->field td:eq(1)').html('<div class=thumbs><div class=thumb><img src=\"../..'+filePath+'\"/></div></div>');
    $('#template$this->field').prop('class', 'listrow$this->field');
    $('#template$this->field').prop('id', rowid);
    $('#template$this->field').prependTo('#list$this->field');
    $('#'+rowid+'.listrow$this->field input[name='+'time_taken'+']').prop('id',rowid);
    $('#'+rowid+'.listrow$this->field input[name='+'time_taken'+']').prop('id',rowid);
    $('#'+rowid+'.listrow$this->field select[name='+'hour_taken'+']').prop('id', rowid);
    $('#'+rowid+'.listrow$this->field select[name='+'min_taken'+']').prop('id',rowid);
    $('#'+rowid+'.listrow$this->field input[name='+'time_taken'+']').prop('value',
      response[4]).trigger('chgselectimage_divisions', [rowid]);
    $('#'+rowid+'.listrow$this->field button[name='+'commit$this->field'+']').prop('id',rowid);

  }  
  xhr.send(formData);
}

function up$this->field(form_data) {
  $.ajax({
    url: 'ajax/upload$this->field.php', // point to server-side PHP script 
    dataType: 'text',  // what to expect back from the PHP script, if anything
    cache: false,
    contentType: false,
    processData: false,
    data: form_data,                         
    type: 'post',
    success: function(php_script_response){
      return(php_script_response);
    }
  });
}

    "; 
    return $script;
  }
}

?>