<?php defined('BASEPATH') or exit('No direct script access allowed'); ?>
<!DOCTYPE html>
<html>
  <head>
    <title>Admin &gt; Blog &gt; Widget</title>
    <?php include_once(VIEWPATH. 'includes/head.php'); ?>
    <style type="text/css">
    body.dragging, body.dragging * {cursor: move !important;}
    .dragged {position: absolute;opacity: 0.5;z-index: 2000;}
    ol#sort li button, ol#edit li button{margin-bottom: 15px}
    ol#sort li.placeholder {position: relative;}
    ol#sort li.placeholder:before {position: absolute;}
    ol#sort>li>button:hover{cursor: move;}
    </style>
  </head>
  <body>
    <?php include_once(VIEWPATH. 'admin/_navbar.php'); ?>
    <div class="container">
      <ul class="breadcrumb">
        <li><a href="<?php echo site_url();?>"><i class="fa fa-home"></i></a></li>
        <li><a href="<?php echo site_url('admin');?>">Admin Panel</a></li>
        <li><a href="<?php echo site_url('admin/modules/blog');?>">Blog</a></li>
        <li class="active"><span>Widget</span></li>
      </ul>
      <div class="row">
        <div class="col-sm-4 col-md-3">
          <?php include(dirname(__FILE__).'/_sidebar.php');?>
        </div>
        <div class="col-sm-8 col-md-9">
          <div class="panel panel-default">
            <div class="panel-heading">
              <h3><i class="fa fa-cubes"></i> Widget</h3>
            </div>
            <div class="panel-body">
              <div class="row">
                <div class="col-sm-4 col-md-3" style="margin-bottom: 15px;">
                  <?php if ($this->input->get('sort')):?>
                  <a class="btn btn-default btn-block" href="<?php echo site_url('admin/modules/blog/widgets');?>"><i class="fa fa-edit"></i> Kelola</a>
                  <?php else:?>
                  <a class="btn btn-default btn-block" href="<?php echo site_url('admin/modules/blog/widgets?sort=1');?>"><i class="fa fa-sort"></i> Urutkan</a>
                  <?php endif;?>
                </div>
                <div class="col-sm-8 col-md-offset-3 col-md-6" style="margin-bottom: 15px;">
                  <?php echo form_open();?>
                    <div class="input-group">
                      <span class="input-group-addon"><i class="fa fa-cube"></i></span>
                      <select class="form-control" name="widget" required="required">
                        <option value="">-- Pilih Widget --</option>
                        <?php foreach ($this->blog_model->widgets as $wg_key=>$wg_val):?>
                        <option value="<?php echo $wg_key;?>"><?php echo $wg_val;?></option>
                        <?php endforeach;?>
                      </select>
                      <span class="input-group-btn">
                        <button type="submit" class="btn btn-primary" name="add_widget" value="1"><span class="visible-xs"><i class="fa fa-plus"></i></span> <span class="hidden-xs">Tambahkan</span></button>
                      </span>
                    </div>
                  <?php echo form_close();?>
                </div>
              </div>
              <hr style="margin-top: 0;margin-bottom:15px;" />
              <?php if ($this->input->get('sort')):?>
              <?php echo form_open(current_url().'?sort=1')?>
                <ol id="sort" class="list-unstyled vertical">
                  <?php for ($i = 0; $i < count($widgets); $i++):?>
                  <li>
                    <button class="btn btn-default btn-block" style="text-align: left;" type="button" title="<?php echo $this->blog_model->get_widget_label($widgets[$i][0]);?>">
                      <i class="fa fa-arrows"></i> <?php echo $widgets[$i][1][0];?>
                    </button>
                    <input type="hidden" name="widgets[]" value="<?php echo $i;?>" />
                  </li>
                  <?php endfor;?>
                </ol>
                <div>
                  <button class="btn btn-primary" id="submit" name="sort" value="simpan" type="submit">Simpan</button>
                </div>
              <?php echo form_close();?>
              <?php else:?>
              <div class="alert alert-info  alert-dismissible fade in" role="alert">
                <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <i class="fa fa-info-circle"></i> Widget akan ditampilkan pada sidebar di semua halaman blog.
              </div>
              <div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
                <?php for ($i = 0; $i < count($widgets); $i++):?>
                <div class="panel panel-default" role="tab" id="widget<?php echo $i;?>">
                  <div class="panel-heading">
                    <a data-toggle="modal" data-target="#myModal" title="Hapus" class="pull-right text-danger" href="<?php echo site_url('admin/modules/blog/hapus_widget/'.$i);?>"><i class="fa fa-trash"></i></a>
                    <a title="Widget <?php echo $this->blog_model->get_widget_label($widgets[$i][0]);?>" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapse<?php echo $i;?>" aria-expanded="false" aria-controls="collapse<?php echo $i;?>"><strong><i class="fa fa-cube"></i> <?php echo html_escape($widgets[$i][1][0]);?></strong></a>
                  </div>
                  <div id="collapse<?php echo $i;?>" class="panel-collapse collapse <?php echo @$this->input->get('widget') == '_'.$i.'_' ? 'in' : '';?>" role="tabpanel" aria-labelledby="widget<?php echo $i;?>">
                    <div class="panel-body">
                      <?php echo form_open('admin/modules/blog/edit_widget/'.$i);?>
                      <div class="form-group">
                        <label>Judul</label>
                        <input type="text" class="form-control" name="judul" value="<?php echo html_escape($widgets[$i][1][0]);?>" />
                      </div>
                      <?php if ($widgets[$i][0] == 'html'):?>
                      <div class="form-group">
                        <label>HTML</label>
                        <textarea class="form-control" name="html" rows="8"><?php echo html_escape(@file_get_contents(VIEWPATH.'blog/'.$widgets[$i][1][1].'.html'));?></textarea>
                      </div>
                      <?php elseif ($widgets[$i][0] == 'recent_posts'):?>
                      <ul class="nav nav-tabs" role="tablist" style="margin-bottom: 15px;">
                        <li role="presentation" class="active"><a href="#pengaturan<?php echo $i;?>" aria-controls="pengaturan<?php echo $i;?>" role="tab" data-toggle="tab">Pengaturan</a></li>
                        <li role="presentation"><a href="#preview<?php echo $i;?>" aria-controls="preview<?php echo $i;?>" role="tab" data-toggle="tab">Preview</a></li>
                        <li role="presentation"><a href="#kodephp<?php echo $i;?>" aria-controls="kodephp<?php echo $i;?>" role="tab" data-toggle="tab">Kode PHP</a></li>
                      </ul>
                      <div class="tab-content">
                        <div role="tabpanel" class="tab-pane fade in active" id="pengaturan<?php echo $i;?>">
                          <div class="form-group">
                            <label>Jumlah Posting</label>
                            <input type="number" class="form-control" name="jumlah" value="<?php echo html_escape($widgets[$i][1][1]);?>" min="1" max="10" />
                          </div>
                        </div>
                        <div role="tabpanel" class="tab-pane fade" id="preview<?php echo $i;?>">
                          <?php
                          $recent_posts = $this->blog_model->get_recent_posts($num = 5);
                          if ($recent_posts) {
                            echo '<div class="list-group">';
                            foreach ($recent_posts as $recent_post) {
                              echo '<a class="list-group-item" href="'.site_url('blog/' . $recent_post['bp_slug']).'">' .
                                  '<span class="pull-right"><i class="fa fa-comments-o"></i> '.$recent_post['bp_total_comments'] .
                                  '</span>'.html_escape($recent_post['bp_judul']).'</a>';
                            }
                            echo '</div>';
                          }
                          ?>
                        </div>
                        <div role="tabpanel" class="tab-pane fade" id="kodephp<?php echo $i;?>">
                          <p class="help-block"><i class="fa fa-info-circle"></i> Kode PHP ini dapat ditambahkan di semua halaman situs, berikut adalah contoh penggunaannya</p>
                          <pre><?php echo html_escape("# Controller: application/controllers/akun/Profil.php\r\n" . "\$this->load->model('blog_model');\r\n" .
                          "\$recent_posts = \$this->blog_model->get_recent_posts(\$max_posts = 5);\r\n" .
                          "\$this->load->view('akun/profil', array('recent_posts' => \$recent_posts))\r\n\r\n" .
                          "# View: view/akun/profil.php\r\n" . "<div class=\"list-group\">\r\n  " .
                          "<?php foreach (\$recent_posts as \$recent_post): ?>\r\n  " . "<a class=\"list-group-item\" href=\"<?php echo site_url('blog/' . \$recent_post['bp_slug']);?>\">\r\n    " .
                          "<span class=\"pull-right\">\r\n      "."<i class=\"fa fa-comments-o\"></i> <?php echo \$recent_post['bp_total_comments'];?>\r\n    "."</span>\r\n    "."<?php echo html_escape(\$recent_post['bp_judul']);?>\r\n  "."</a>" .
                          "\r\n  <?php endforeach;?>\r\n" . "</div>");?></pre>
                        </div>
                      </div>
                      <?php elseif ($widgets[$i][0] == 'recent_comments'):?>
                      <div class="form-group">
                        <label>Jumlah Komentar</label>
                        <input type="number" class="form-control" name="jumlah" value="<?php echo html_escape($widgets[$i][1][1]);?>" min="1" max="10" />
                      </div>
                      <?php elseif ($widgets[$i][0] == 'pinned_posts'):?>
                      <ul class="nav nav-tabs" role="tablist" style="margin-bottom: 15px;">
                        <li role="presentation" class="active"><a href="#pengaturan<?php echo $i;?>" aria-controls="pengaturan<?php echo $i;?>" role="tab" data-toggle="tab">Pengaturan</a></li>
                        <li role="presentation"><a href="#preview<?php echo $i;?>" aria-controls="preview<?php echo $i;?>" role="tab" data-toggle="tab">Preview</a></li>
                        <li role="presentation"><a href="#kodephp<?php echo $i;?>" aria-controls="kodephp<?php echo $i;?>" role="tab" data-toggle="tab">Kode PHP</a></li>
                      </ul>
                      <div class="tab-content">
                        <div role="tabpanel" class="tab-pane fade in active" id="pengaturan<?php echo $i;?>">
                          <p class="help-block">Untuk memilih postingan yang ingin disematkan silakan kunjungi <a href="<?php echo site_url('admin/modules/blog');?>" class="alert-link">halaman posting</a> kemudian klik link <strong>Sematkan</strong> dan maksimal 10 posting yang disematkan.</p>
                        </div>
                        <div role="tabpanel" class="tab-pane fade" id="preview<?php echo $i;?>">
                          <?php
                          $pinned_posts = $this->blog_model->get_pinned_posts($num = 5);
                          if ($pinned_posts) {
                            echo '<div class="list-group">';
                            foreach ($pinned_posts as $pinned_post) {
                              echo '<a class="list-group-item" href="'.site_url('blog/' . $pinned_post['bp_slug']).'">' .
                                  '<span class="pull-right"><i class="fa fa-comments-o"></i> '.$pinned_post['bp_total_comments'] .
                                  '</span>'.html_escape($pinned_post['bp_judul']).'</a>';
                            }
                            echo '</div>';
                          }
                          ?>
                        </div>
                        <div role="tabpanel" class="tab-pane fade" id="kodephp<?php echo $i;?>">
                          <p class="help-block"><i class="fa fa-info-circle"></i> Kode PHP ini dapat ditambahkan di semua halaman situs, berikut adalah contoh penggunaannya</p>
                          <pre><?php echo html_escape("# Controller: application/controllers/akun/Profil.php\r\n" . "\$this->load->model('blog_model');\r\n" .
                          "\$pinned_posts = \$this->blog_model->get_pinned_posts(\$max_posts = 5);\r\n" .
                          "\$this->load->view('akun/profil', array('pinned_posts' => \$pinned_posts))\r\n\r\n" .
                          "# View: view/akun/profil.php\r\n" . "<div class=\"list-group\">\r\n  " .
                          "<?php foreach (\$pinned_posts as \$pinned_post): ?>\r\n  " . "<a class=\"list-group-item\" href=\"<?php echo site_url('blog/' . \$pinned_post['bp_slug']);?>\">\r\n    " .
                          "<span class=\"pull-right\">\r\n      "."<i class=\"fa fa-comments-o\"></i> <?php echo \$pinned_post['bp_total_comments'];?>\r\n    "."</span>\r\n    "."<?php echo html_escape(\$pinned_post['bp_judul']);?>\r\n  "."</a>" .
                          "\r\n  <?php endforeach;?>\r\n" . "</div>");?></pre>
                        </div>
                      </div>
                      <?php endif;?>
                      <div class="row">
                        <div class="col-sm-4 col-md-3 col-lg-2">
                          <button class="btn btn-primary btn-block" type="submit" name="edit" value="1"><i class="fa fa-check"></i> Simpan</button>
                        </div>
                      </div>
                      <?php echo form_close();?>
                    </div>
                  </div>
                </div>
                <?php endfor;?>
              </div>
              <?php endif;?>
            </div>
          </div>
        </div>
      </div>
    </div>
    <?php include_once(VIEWPATH.'includes/foot.php'); ?>
    <script>
      $("#edit li .delete").click(function(){
        window.location.href = '<?php echo site_url('admin/modules/blog/hapus_widget');?>/'+$(this).attr('data-id');
        return false;
      });
    </script>
    <?php if ($this->input->get('sort')):?>
    <script src="<?php echo base_url('assets/js/jquery-sortable.js');?>"></script>
    <script>
    $(function(){
        var adjustment;
        $("#sort").sortable({
            group: 'vertical',
            pullPlaceholder: false,
            onDrop: function  ($item, container, _super) {
                var $clonedItem = $('<li/>').css({height: 0});
                $item.before($clonedItem);
                $clonedItem.animate({'height': $item.height()});
                $item.animate($clonedItem.position(), function  () {
                    $clonedItem.detach();
                    _super($item, container);
                });
            },
            onDragStart: function ($item, container, _super) {
                var offset = $item.offset(),
                    pointer = container.rootGroup.pointer;
                adjustment = {
                    left: pointer.left - offset.left,
                    top: pointer.top - offset.top
                };
                _super($item, container);
            },
            onDrag: function ($item, position) {
                $item.css({
                    left: position.left - adjustment.left,
                    top: position.top - adjustment.top
                });
            }
        });
    });
    </script>
    <?php endif;?>
  </body>
</html>