<?php

/*
Slovenski narečni atlas / Slovenian dialectal atlas
    Copyright (C) 2017  Gregor Šajn

    This program is free software: you can redistribute it and/or modify
    it under the terms of the GNU General Public License as published by
    the Free Software Foundation, either version 3 of the License, or
    (at your option) any later version.

    This program is distributed in the hope that it will be useful,
    but WITHOUT ANY WARRANTY; without even the implied warranty of
    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
    GNU General Public License for more details.

    You should have received a copy of the GNU General Public License
    along with this program. If not, see <http://www.gnu.org/licenses/>.
*/

?>

<div class="container container-panel">
  <?
  $this->load->view('admin/index_view.php');
  ?>
  <div class="row" style="overflow: none">
    <?
    $this->load->view('admin/admin_nav.php');
    ?>
    <!-- tukaj se naloži poljuben pogled -->
    <div class="col-sm-9">
      <ol class="breadcrumb">
        <li><a href="<?=$this->url?>edit_content">Teme</a></li>
        <li><a href="<?=$this->url?>edit_subject/<?=$subject['id']?>"><?=$subject['title']?></a></li>
        <li><a href="#"><?=$word['title']?></a></li>
      </ol>
      <div class="row">
        <div class="col-sm-10"><h4 class="text-muted"><?=$word['title']?></h4></div>
        <div class="col-sm-2 text-right">
        <a class="btn btn-danger confirm" href="<?=$this->url?>word_delete/<?=$word['id']?>" title="Odstrani besedo">Odstrani</a></div>
      </div>
      <br>
      <!-- alerts -->
      <?
      
      if(isset($errfields) and $errfields)
      {
        $alert_text='<ul>';
        foreach($errfields as $errfield)
        {
          $alert_text.='<li>'.$errfield.'</li>';
        }
        $alert_text.='</ul>'
        ?>
        <div class="alert alert-danger fade in" id="alert_err" role="alert">
        <button type="button" class="close">
            <span aria-hidden="true">&times;</span>
        </button>
        <span class="text-danger glyphicon glyphicon-exclamation-sign"></span> <?=$alert_text?>
        </div>
        <?
      }

      elseif(isset($status) and $status=='ok')
      {
        ?>
        <div class="alert alert-success fade in" id="alert_ok" role="alert">
        <button type="button" class="close">
            <span aria-hidden="true">&times;</span>
        </button>
        <span class="text-success glyphicon glyphicon-ok"></span> Spremembe uspešno shranjene!
        </div>
        <?
      }

      ?>
      <div class="alert fade in hidden" id="alert" role="alert">
        <button type="button" class="close">
            <span aria-hidden="true">&times;</span>
        </button>
        <span id="alert_text"></span>
      </div>
      <form class="form-horizontal form-border" action="<?=$this->url?>post_edit_word" method="POST"  enctype="multipart/form-data" id="edit_word">
        <input type="hidden" id="id_word" name="id_word" value="<?=$word['id']?>">
        <input type="hidden" id="id_subject" name="id_subject" value="<?=$subject['id']?>">
        <div class="form-group">
          <label for="title" class="col-sm-2 control-label">Naziv besede<span class="text-danger">*</span></label>
          <div class="col-sm-10">
            <input type="text" class="form-control input-md" value="<?=$word['title']?>" id="title" name="title">
          </div>
        </div>
        <div class="form-group">
          <label for="title" class="col-sm-2 control-label">Slika besede</label>
          <div class="col-sm-10">
            <?
            if($word['image'])
            {
              ?>
              <div class="img-wrap" onclick="open_modal('#modal_image');">
                <span class="close glyphicon glyphicon-remove text-danger" onclick="if(confirm('Izbriši sliko?')){ajax_image_delete(<?=$word['id']?>,'<?=$word['image']?>')};event.stopPropagation();"></span>
                <img src="<?=base_url().$word['image']?>?<?php echo filemtime($word['image']) ?>" class="thumbnail" /> 
              </div>
              <?
            }
            else
            {
              ?>
              <input type="file" class="upload-btn" accept="image/x-png,image/gif,image/jpeg" id="image_file" name="image_file">
              <?
            }
            ?>
            
          </div>
        </div>
        <div class="form-group">
          <label for="title" class="col-sm-2 control-label">Komentar besede</label>
          <div class="col-sm-10">
            <?
            if($word['comment'])
            {
              ?>
              <div style="padding-top:10px">
              <a href="javascript:;" onclick="open_modal('#modal_comment');" class="btn btn-default"><span class="glyphicon glyphicon-book"></span> Odpri komentar </a> <a href="javascript:;" onclick="if(confirm('Izbriši komentar?')){ajax_comment_delete(<?=$word['id']?>,'<?=$word['comment']?>');}" class="text-danger">Odstrani komentar</a>
              </div>
              <?
            }
            else
            {
              ?>
              <input type="file" class="upload-btn" id="comment_file" name="comment_file">
              <?
            }
            ?>
            
          </div>
        </div>
        <div class="form-group">
          <div class="col-sm-offset-2 col-sm-10">
            <button type="submit" class="btn btn-success button-medium">Shrani</button>
            <button type="submit" class="btn btn-default button-medium" name="save_close">Shrani in zapri</button>
          </div>
        </div>
      </form>
      <br>

    </div>
  </div>
</div>

<!-- modals -->
<div class="modal fade" id="modal_image" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
  <div class="modal-dialog  modal-lg" role="document">
    <div class="modal-content" style="height: 80%;">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="myModalLabel">Slika</h4>
      </div>
      <div class="modal-body text-center" id="modal_image_content">
          <img src="<?=base_url().$word['image']?>?<?php echo filemtime($word['image']) ?>" style="height:500px;">
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Zapri</button>
      </div>
    </div>
  </div>
</div>

<div class="modal fade" id="modal_comment" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
  <div class="modal-dialog  modal-lg" role="document">
    <div class="modal-content" style="height: 80%;">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="myModalLabel">Komentar</h4>
      </div>
      <div class="modal-body text-center" id="modal_image_content">
          <iframe id="modal_iframe" frameBorder="0" src="<?=base_url().$word['comment']?>#zoom=100"></iframe>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Zapri</button>
      </div>
    </div>
  </div>
</div>


<script type="text/javascript">

$('.close').click(function() {
    $('#alert_err').fadeOut(500);
    $('#alert_ok').fadeOut(500);
    $('#alert').fadeOut(500);
    $('alert').addClass('hidden'); 
});

$('.confirm').click(function() {
        return window.confirm("Izbriši besedo?");
    });

function open_modal(modal_id)
{
  $(modal_id).modal('show');
}

function ajax_edit_subject_save()
{
  var form=$('#edit_subject');

  $.ajax({
        type: "POST",
      url: "<?=$this->url?>ajax_edit_subject_save",
      cache: false,               
      data:form.serialize(),
      dataType: "json",
        success: function(data){  
            if(data.status=='ok')
            {
                status('ok','Spremembe uspešno shranjene!');
            }
            else
            {
              var errors='';
              $.each(data.errfields, function(i, error){
                  errors+=error+'\n';
              });
              status('error',errors);
              
            }      
        },
        error: function(){                      
            alert('Prišlo je do napake pri nalaganju podatkov. Prosimo poskusite ponovno!');
        }
  });
}

function ajax_image_delete(id_word,image)
{
  $.ajax({
        type: "POST",
        url: "<?=$this->url?>ajax_image_delete",
        cache: false,               
        data:{
          id_word:id_word,
          image,image
        },
        dataType: "json",
        success: function(data){  
            if(data.status=='ok')
            { 
                location.reload();
            }
            else
            {
              var errors='';
              $.each(data.errfields, function(i, error){
                  errors+=error+'\n';
              });
              alert(errors);
            }      
        },
        error: function(){                      
            alert('Prišlo je do napake pri nalaganju podatkov. Prosimo poskusite ponovno!');
        }
  });
}

function ajax_comment_delete(id_word,comment)
{
  $.ajax({
        type: "POST",
        url: "<?=$this->url?>ajax_comment_delete",
        cache: false,               
        data:{
          id_word:id_word,
          comment,comment
        },
        dataType: "json",
        success: function(data){  
            if(data.status=='ok')
            { 
                location.reload();
            }
            else
            {
              var errors='';
              $.each(data.errfields, function(i, error){
                  errors+=error+'\n';
              });
              alert(errors);
            }      
        },
        error: function(){                      
            alert('Prišlo je do napake pri nalaganju podatkov. Prosimo poskusite ponovno!');
        }
  });
}

function status(status,text)
{
  $('#alert').fadeIn(400);
  //change div color
  if(status=='ok')
  {
    $('#alert').removeClass();
    $('#alert').addClass('alert alert-success');
    $('#alert_text').html("<span class='glyphicon glyphicon-ok text-success'></span> "+text);
  }
  else
  {
    $('#alert').removeClass();
    $('#alert').addClass('alert alert-danger');
    $('#alert_text').html("<span class='glyphicon glyphicon-exclamation-sign text-danger'></span> "+text);
  }
}

</script>