<?php defined('BASEPATH') or exit('No direct script access allowed');?>
<!DOCTYPE html>
<html>
  <head>
    <title>Admin &gt; Daftar Server</title>
    <?php include_once(VIEWPATH.'includes/head.php'); ?>
    <style type="text/css">
    .title{font-size:18px;line-height:1;margin: 0 0 10px;padding:0;border-bottom: 3px solid #ffdf7e;}
    .title span{display:inline-block;margin-bottom:-3px;padding-bottom:10px;color:#666;border-bottom: 3px solid #f90;}
    .panel-default:hover{border-color:#f90;}
    .item .panel-body{padding: 10px;}
    .item h5{white-space: nowrap;text-overflow: ellipsis;overflow: hidden;}
    .item hr{margin-top: 10px; margin-bottom: 10px}
    dl{width:100%;overflow:hidden;padding:0;margin:0}
    dt{float:left;width:50%;padding:0;margin:0}
    dd{float:left;width:50%;padding:0;margin:0}
    .rating{color:#777}
    nav {margin-bottom: 15px;float: right;}
    .modal tr>td:first-child {white-space: nowrap;}
    </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 class="active"><span>Daftar Server</span></li>
      </ul>
      <h1 class="title"><span class="pull-right"><?php echo $total;?></span><span><i class="fa fa-server"></i> Daftar Server</span></h1>
      <div class="row">
        <div class="col-sm-offset-6 col-sm-6 col-md-offset-8 col-md-4" style="margin-bottom: 15px;">
          <form method="get" action="<?php echo site_url('admin/servers');?>">
            <div class="input-group">
              <input type="text" class="form-control" name="search" value="<?php echo html_escape($search);?>" />
              <span class="input-group-btn"><button type="submit" class="btn btn-primary"><i class="fa fa-search"></i></button></span>
            </div>
          </form>
        </div>
      </div>
      <?php if (!$results):?>
      <div class="alert alert-warning">Tidak ada daftar server.</div>
      <?php else:?>
      <div class="row">
        <?php foreach ($results as $result):
        $content = '<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"><i class="fa fa-server"></i> '.$result['name'].'</h4></div><div class="modal-body">';
        $content .= '<div class="text-center" style="margin-bottom:15px;"><img class="img-thumbnail" style="margin: 0 auto;" src="'.str_replace('=w120','=w230-rw',($result['app_icon'] ? $result['app_icon'] : '//via.placeholder.com/120x120')).'"/></div>';
        $content .= '<div class="table-responsive"><table class="table table-striped"><tbody>';
        $content .= '<tr><td>Nama</td><td>'.$result['name'].'</td></tr>';
        $content .= '<tr><td>Website</td><td><a href="'.$result['website'].'" target="_blank">'.$result['website'].'</a></td></tr>';
        $content .= '<tr><td>API URL</td><td>'.$result['api_url'].'</td></tr>';
        $content .= '<tr><td>API Key</td><td>'.$result['api_key'].'</td></tr>';
        if (isset($result['api_key2']))
          $content .= '<tr><td>API Key 2 <span class="text-muted">(API v3)</span></td><td>'.$result['api_key2'].'</td></tr>';
        $content .= '<tr><td>Jalur Trx</td><td>SMS, Otomax API</td></tr>';
        $content .= '</tbody></table></div>';
        if ($result['app_id']) {
          $content .= '<div class="text-center" style="margin-top:15px"><a href="https://play.google.com/store/apps/details?id='.$result['app_id'].'" target="_blank"><img src="https://play.google.com/intl/en_us/badges/images/badge_new.png"/></a></div>';
        }
        $content .= '<div>';
        ?>
        <div class="col-xs-12 col-sm-4 col-lg-3 item">
          <div class="panel panel-default">
            <div class="panel-body">
            <div class="row">
              <div class="col-xs-4">
                <img class="img-thumbnail" style="margin: 0 auto;" data-src="<?php echo $result['app_icon'] ? $result['app_icon'] : '//via.placeholder.com/120x120';?>" alt="<?php echo $result['name'];?>"/>
              </div>
              <div class="col-xs-8">
                <a href="#" class="detail" data-server='<?php echo base64_encode($content);?>'><h5 title="<?php echo $result['name'];?>"><?php echo $result['name'];?></h5></a>
                <p class="rating"><!--<span><i class="fa fa-star"></i><i class="fa fa-star"></i><i class="fa fa-star"></i><i class="fa fa-star-half-o"></i><i class="fa fa-star-o"></i></span> <span>12</span> <span><i class="fa fa-user"></i></span>--><?php echo $result['app_id'];?></p>
              </div>
              <div class="col-xs-12">
                <hr/>
                <dl>
                  <dt>Website</dt><dd><a style="white-space: nowrap;overflow: hidden;" href="<?php echo $result['website'];?>" title="<?php echo $result['website'];?>" target="_blank"><?php echo parse_url($result['website'], PHP_URL_HOST);?></a></dd>
                  <dt>Jalur Trx</dt><dd><?php echo $result['api_url'] ? 'SMS, Otomax API' : 'SMS';?></dd>
                </dl>
              </div>
            </div>
            </div>
          </div>
        </div>
        <?php endforeach;?>
      </div>
      <?php echo pagination(site_url('admin/servers/index'),$start,$total,$this->system->set['list_per_page'],'/%d'.($search ? '?search='.urlencode($search) : ''));?>
      <?php endif;?>
    </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();
      $(document).ready(function(){
        $(".detail").click(function(){
          $("#myModal").modal("show");
          var content = atob($(this).attr('data-server'));
          $("#myModal .modal-content").html(content);
          return false;
        });
      });
    </script>
  </body>
</html>