<?php
defined('BASEPATH') or exit('No direct script access allowed');
define('HIDE_SUBNAVBAR', true);

include_once (APPPATH.'third_party/simple_html_dom.php');
$dom = new simple_html_dom();
$dom->load($post->bp_deskripsi);
if ($image = $dom->find('img', 0)) {
  $thumbnail = $image->src;
} else {
  $thumbnail = '';
}
$dom->clear();
$kat = get_post_category($post->bp_kategori);
$page_description = substr(trim(strip_tags($post->bp_deskripsi)), 0, 200);
?>
<!DOCTYPE html>
<html>
  <head>
    <title><?php echo html_escape($post->bp_judul);?></title>
    <meta property="og:title" content="<?php echo  html_escape($post->bp_judul);?>"/>
    <meta property="og:image" content="<?php echo $thumbnail ? $thumbnail : base_url('assets/logo.png');?>"/>
    <meta property="og:description" content="<?php echo($page_description);?>"/>
    <?php include_once(VIEWPATH.'includes/head.php'); ?>
    <style type="text/css">
    body{padding-top:70px;}
    .title {font-size: 22px;line-height: 1;margin: 0 0 20px;padding: 0;border-bottom: 3px solid #ffdf7e;}
    .title span {display: inline-block;margin-bottom: -3px;padding-bottom: 10px;color: #333;border-bottom: 3px solid #f90;}
    .blog-content{padding-top:320px}
    .pager{margin:0;}
    .blog-post-content,.blog-post-meta{padding:16px 22px}
    .blog-post{margin-bottom:30px}
    .blog-post a{text-decoration:none}
    .total-comments{margin:10px auto;color:#999;}
    .blog-comments-title,.blog-post-title{margin-bottom:5px;font-size:24px;font-weight:400;color:#333}
    .blog-comments-title{font-size: 22px;}
    .blog-comments-title>span{margin: 5px auto;}
    .blog-comments .panel-body.bgcol{background-color: #f9f9f9;}
    .blog-post-meta{color:#999;display:block;border-bottom:1px solid #EDEDED}
    .blog-post-date{margin:6px auto}
    .blog-post-content p{color:#999;margin:18px auto}
    .blog-post-content .btn{padding-left:20px;padding-right:20px;border-radius:20px}
    .blog-post p{font-size:13px;font-weight:400}
    .blog-post .panel-body{padding:0}
    .blog-post .panel>img{border-top-left-radius:2px;border-top-right-radius:2px;margin: 0 auto}
    .blog-comments .panel,.blog-post .panel{-webkit-transition:all .3s ease;transition:all .3s ease}
    /*.blog-comments:hover .panel,.blog-post:hover .panel{-webkit-box-shadow:0 10px 20px rgba(0,0,0,.19),0 6px 6px rgba(0,0,0,.23);box-shadow:0 10px 20px rgba(0,0,0,.19),0 6px 6px rgba(0,0,0,.23)}*/
    .label{font-size:12px;padding:4px 12px;border-radius:16px;font-weight:400;-webkit-transition:all .15s ease;transition:all .15s ease}
    .label-light{color:#333}
    .label-light,.label-light.label-default{background-color:#EBEBEB}
    .label-light.label-inverse{background-color:#D9DCF0}
    .label-light.label-primary{background-color:#CDEAE7}
    .label-light.label-success{background-color:#DBEFDC}
    .label-light.label-info{background-color:#CDEEFC}
    .label-light.label-warning{background-color:#FFDED3}
    .label-light.label-danger{background-color:#FCDAD7}
    .blog-post-meta>span+span{margin-left:5px}
    .sidebar-module .categories li{margin:12px auto}
    .social-share{margin-bottom: 40px;}
    .social-share ul li{float:left;margin-right:10px;}
    .social-share ul li a{display:inline-block;padding:4px 12px;font-size:12px;color:#FFF;}
    .social-share ul li a.facebook{background: #5b79b4;}
    .social-share ul li a.facebook:hover{background: #4565a3;}
    .social-share ul li a.twitter{background: #2fccf7;}
    .social-share ul li a.twitter:hover{background: #1db9e3;}
    .social-share ul li a.gplus{background: #ed492a;}
    .social-share ul li a.gplus:hover{background: #d33416;}
    .social-share ul li a i{border-right: 1px solid #FFF;padding-right:6px;margin-right:6px;}
    </style>
  </head>
  <body>
    <?php include_once(VIEWPATH.'includes/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('blog');?>">Blog</a></li>
        <?php if (isset($kat[0])):?>
        <li><?php echo $kat[0];?></li>
        <?php else:?>
        <li><a href="<?php echo site_url('blog/kategori/tak-berkategori');?>">Tak Berkategori</a></li>
        <?php endif;?>
        <li class="active"><span><?php echo html_escape($post->bp_judul);?></span></li>
      </ul>
      <div class="row">
        <div class="col-sm-8 blog-main">
          <section class="blog-post">
            <div class="panel panel-default">
              <?php /* if ($thumbnail):?>
              <img src="<?php echo $thumbnail;?>" class="img-responsive" alt="<?php echo html_escape($post->bp_judul);?>"/>-->
              <?php endif; */?>
              <div class="panel-body">
                <div class="blog-post-meta">
                  <?php if ($kat):?>
                  <span class="label label-light label-info"><?php echo implode('</span><span class="label label-light label-warning">', $kat);?></span>
                  <?php else:?>
                  <span class="label label-light label-info"><a href="<?php echo site_url('blog/kategori/tak-berkategori');?>">Tak Berkategori</a></span>
                  <?php endif;?>
                  <p class="blog-post-date pull-right"><?php echo format_tanggal($post->bp_tanggal);?></p>
                </div>
                <div class="blog-post-content">
                  <h1 class="blog-post-title"><?php if ($this->user->is_admin()):?><a href="<?php echo site_url('admin/modules/blog/edit_posting/'.$post->bp_id);?>" class="pull-right" data-toggle="tooltip" data-title="Edit Posting"><i class="fa fa-edit"></i></a><?php endif;?><?php echo html_escape($post->bp_judul);?></h1>
                  <?php echo $post->bp_deskripsi;?>
                  <div class="social-share">
                    <ul class="list-unstyled">
                      <li><a href="https://www.facebook.com/sharer/sharer.php?u=<?php echo urlencode(current_url());?>" target="_blank" class="facebook"><i class="fa fa-facebook fa-lg"></i>Facebook</a></li>
                      <li><a href="https://twitter.com/home?status=<?php echo urlencode(current_url());?>" target="_blank" class="twitter"><i class="fa fa-twitter fa-lg"></i>Twitter</a></li>
                      <li><a href="https://plus.google.com/share?url=<?php echo urlencode(current_url());?>" target="_blank" class="gplus"><i class="fa fa-google-plus fa-lg"></i>Google+</a></li>
                    </ul>
                  </div>
                  <div class="clearfix"></div>
                </div>
              </div>
            </div>
          </section>
          <?php if ($total_comments || $post->bp_allow_comment):?>
          <section class="blog-comments" id="comments">
            <div class="panel panel-default">
              <div class="panel-body bgcol" style="padding-bottom: 0;">
                <h2 class="blog-comments-title"><span class="badge badge-default pull-right"><?php echo $total_comments;?></span><i class="fa fa-comments"></i> Komentar</h2>
                <hr style="margin-top: 15px; margin-bottom: 15px;" />
                <?php if ($this->blog_model->get_set('allow_comment') && $post->bp_allow_comment):?>
                <?php if ($this->blog_model->get_set('allow_comment') == 2 && !$this->user->is_user()):?>
                <div class="alert alert-warning" style="margin-bottom: 15px;">Hanya member yang diijinkan mengirim komentar baru</div>
                <?php else:?>
                <?php echo form_open(current_url().'#comment-form','id="comment-form"');?>
                  <div class="row">
                    <div class="col-sm-6 col-md-8" style="padding-bottom: 15px;">
                      <textarea class="form-control" name="komentar" style="height: 132px;" required="required"><?php echo set_value('komentar');?></textarea>
                    </div>
                    <div class="col-sm-6 col-md-4">
                      <div class="row">
                        <div class="col-xs-12" style="margin-bottom: 15px;">
                          <div class="input-group">
                            <span class="input-group-addon" data-toggle="tooltip" data-title="<?php echo ($this->user->is_user() ? 'Profil' : 'Login');?>"><a href="<?php echo ($this->user->is_user() ? site_url('akun/profil') : site_url('user/login'));?>"><i class="fa fa-user-o"></i></a></span>
                            <input type="text" name="nama" value="<?php echo set_value('nama', $this->user->is_user() ? $this->user->us_name : '');?>" class="form-control" placeholder="Nama" <?php echo ($this->user->is_user() ? 'readonly="readonly"' : '');?> required="required" />
                          </div>
                        </div>
                        <?php if (!$this->user->is_user()):?>
                        <div class="col-xs-12" style="margin-bottom: 15px;">
                          <div class="input-group">
                            <span class="input-group-addon" data-toggle="tooltip" data-title="Email"><i class="fa fa-envelope-o"></i></span>
                            <input type="email" name="email" value="<?php echo set_value('email', '');?>" class="form-control" placeholder="user@domain.tld" required="required" />
                          </div>
                        </div>
                        <?php else:?>
                        <input type="hidden" name="email" value="<?php echo $this->user->us_email;?>"/>
                        <?php endif;?>
                        <div class="col-xs-12" style="margin-bottom: 15px;">
                          <div class="input-group">
                            <span class="input-group-addon" data-toggle="tooltip" data-title="Website URL"><i class="fa fa-globe"></i></span>
                            <input type="url" name="url" value="<?php echo set_value('url', '');?>" class="form-control" placeholder="http://" maxlength="64" />
                          </div>
                        </div>
                        <?php if ($this->blog_model->get_set('comment_captcha') || !$this->user->is_user()):?>
                        <div class="col-xs-12" style="margin-bottom: 15px;">
                          <div class="input-group">
                            <span class="input-group-addon" style="padding: 0;"><img id="captcha-image" src="<?php echo site_url('captcha?r='.time());?>" style="height:30px"></span>
                            <input type="text" name="captcha" class="form-control" placeholder="Kode keamanan" required="required" autocomplete="off"/>
                          </div>
                        </div>
                        <?php endif;?>
                        <div class="col-xs-12" style="margin-bottom: 15px;">
                        <button type="submit" class="btn btn-warning btn-block" name="submit" value="kirim_komentar"><i class="fa fa-paper-plane"></i> Kirim Komentar</button>
                        </div>
                      </div>
                    </div>
                  </div>
                <?php echo form_close();?>
                <?php endif;?>
                <?php else:?>
                <div class="alert alert-warning" style="margin-bottom: 15px;">Komentar baru dinonaktifkan</div>
                <?php endif;?>
              </div>
              <div class="list-group" id="comment-lists">
                <?php if ($total_comments):?>
                <?php if ($page > 1): ?>
                <a class="list-group-item" id="previous-comments" href="#" data-page="<?php echo $page;?>">&laquo; Komentar sebelumnya</a>
                <?php endif;?>
                <?php include(dirname(__file__).'/comments.php');?>
                <?php else:?>
                <div class="list-group-item"><div class="alert alert-warning" style="margin-bottom: 0;">Belum ada komentar</div></div>
                <?php endif;?>
              </div>
            </div>
          </section>
          <?php endif;?>
        </div>
        <div class="col-sm-3 col-sm-offset-1 blog-sidebar">
          <?php include(VIEWPATH.'blog/widgets.php');?>
        </div>
      </div>
    </div>
    <?php include_once(VIEWPATH.'includes/foot.php'); ?>
    <script src="<?php echo base_url('assets/js/lazyload.min.js');?>"></script>
    <script>
      var myLazyLoad = new LazyLoad();
    </script>
    <script>
      $("#previous-comments").click(function(){
        var page = $(this).attr('data-page');
        $.get("<?php echo site_url('blog/get-comments/'.$post->bp_slug.'/'.$post->bp_id);?>/"+(page - 1), function(data) {
          $("#previous-comments").after(data);
          $("#previous-comments").attr('data-page', page - 1);
          if (page == 2) {
            $("#previous-comments").remove();
          }
        });
        return false;
      })
    </script>
  </body>
</html>