<script type="text/javascript">
    $(document).ready(function() {
        var num_messages = <?= $num_messages ?>;
        var loaded_messages = 0;
        $("#more_button").click(function() {
            loaded_messages += 3;
            $.get("news/get_messages/" + loaded_messages, function(data) {
                $("#main_content").append(data);

            });

            if (loaded_messages >= num_messages - 3)
            {
                $("#more_button").hide();
                //alert('hide');
            }
            return false;
        })
    })
</script>
<!-- Section -->
<section class="page-section">
    <div class="container relative">

        <div class="row">

            <!-- Content -->
            <div class="col-sm-8">
                <div  id="main_content">
                    <?php foreach ($latest_messages as $message) { ?>
                        <!-- Post -->
                        <div class="blog-item">

                            <!-- Post Title -->
                            <h2 class="blog-item-title font-alt">
                                <a href="<?= base_url() ?>news/read/<?= $message->id ?>/<?= url_title($message->title) ?>.html"><?= $message->title ?></a>
                            </h2>

                            <!-- Author, Categories, Comments -->
                            <div class="blog-item-data">
                                <a href="#"><i class="fa fa-clock-o"></i> <?= DateToIndo($message->datepost) ?></a>
                                <span class="separator">&nbsp;</span>
                                <a href="#"><i class="fa fa-user"></i> Amazinkprint</a>

                            </div>

                            <!-- Image -->
                            <div class="blog-media">
                                <a href="<?= base_url() ?>news/read/<?= $message->id ?>/<?= url_title($message->title) ?>.html">
                                    <img src="<?= base_url() ?>assets/article/<?= $message->picture ?>" alt="<?= $message->title ?>" />
                                </a>
                            </div>

                            <!-- Text Intro -->
                            <div class="blog-item-body">
                                <p>
                                    <?= substr(strip_tags($message->content), 0, 200) ?>...
                                </p>
                            </div>

                            <!-- Read More Link -->
                            <div class="blog-item-foot">
                                <a href="<?= base_url() ?>news/read/<?= $message->id ?>/<?= url_title($message->title) ?>.html" class="btn btn-mod btn-round  btn-small">Read More <i class="fa fa-angle-right"></i></a>
                            </div>

                        </div>
                        <!-- End Post -->

                        <?php
                    }
                    ?>

                </div>
                <center>
                    <a href="#" id="more_button" class="btn btn-mod btn-large btn-round">berita selanjutnya <i class="fa fa-angle-right"></i></a>
                </center>

            </div>
            <!-- End Content -->


            <!-- Sidebar -->
            <div class="col-sm-4 col-md-3 col-md-offset-1 sidebar">

                <!-- Widget -->
                <div class="widget">

                    <h5 class="widget-title font-alt">Shop Categories</h5>

                    <div class="widget-body">
                        <ul class="clearlist widget-menu">
                            <li>
                                <a href="<?= base_url() ?>toko/kategori/Tinta.html?id=1" title="">Tinta</a>
                            </li>
                            <li>
                                <a href="<?= base_url() ?>toko/kategori/Toner.html?id=2" title="">Toner</a>

                            </li>
                            <li>
                                <a href="<?= base_url() ?>toko/kategori/Compatible.html?id=3" title="">Compatible</a>

                            </li>
                            <li>
                                <a href="<?= base_url() ?>toko/kategori/Ciss.html?id=4" title="">Ciss</a>

                            </li>
                            <li>
                                <a href="<?= base_url() ?>toko/kategori/Photo-paper.html?id=5" title="">Photo Paper</a>
                            </li>
                        </ul>
                    </div>

                </div>
                <!-- End Widget -->



                <!-- Widget -->
                <div class="widget">

                    <h5 class="widget-title font-alt">Facebook</h5>
                    <div class="widget-body">
                        <div id="fb-root"></div>
                        <script>(function(d, s, id) {
                                        var js, fjs = d.getElementsByTagName(s)[0];
                                        if (d.getElementById(id))
                                            return;
                                        js = d.createElement(s);
                                        js.id = id;
                                        js.src = "https://connect.facebook.net/en_US/all.js#xfbml=1";
                                        fjs.parentNode.insertBefore(js, fjs);
                                    }(document, 'script', 'facebook-jssdk'));</script>
                        <div class="fb-like-box" data-href="https://www.facebook.com/AmazinkPrint" data-width="240" data-connections="12" data-height="255" data-show-faces="true" data-stream="false" data-header="false" data-border-color="#fff"></div>
                    </div>


                </div>
                <!-- End Widget -->

                <!-- Widget -->
                <div class="widget">

                    <h5 class="widget-title font-alt">Twitter Amazinkprint</h5>

                    <div class="widget-body">
                        <a class="twitter-timeline" data-height="500" href="https://twitter.com/amazinkprint">
                            Tweets by TwitterDev</a> 
                        <script async src="//platform.twitter.com/widgets.js" charset="utf-8">
                        </script>
                    </div>

                </div>
                <!-- End Widget -->

                <!-- Widget -->
                <div class="widget">

                    <h5 class="widget-title font-alt">Reseller Amazink</h5>

                    <div class="widget-body">
                        <div class="widget-text clearfix">

                            Daftar reseller resmi amazink klik <a href="http://amazinkprint.com/reseller">disini</a>

                        </div>
                    </div>

                </div>                            
                <!-- End Widget -->

            </div>
            <!-- End Sidebar -->
        </div>

    </div>
</section>
<!-- End Section -->
<br/><br/><br/>