<?php
$alias = $this->uri->segment(2);
$channelcode = "";
$txtselected = "";
if ($alias == 'blue-sky-hotel-balikpapan') {
    $channelcode = 'MTcxNg';
    $txtselected = "Blue Sky Balikpapan";
}
if ($alias == 'blue-sky-hotel-pandurata') {
    $channelcode = 'MTcxNA';
    $txtselected = "Blue Sky Pandurata";
}
if ($alias == 'blue-sky-hotel-petamburan') {
    $channelcode = 'MTcxNQ';
    $txtselected = "Blue Sky Petamburan";
}
?>
<!-- SLIDER -->
<section class="section-slider height-v">
    <div id="index12" class="owl-carousel  owl-theme">
        <?php if ($quer_home_slideshow_hotel->num_rows() > 0) :
            $quer_home_slideshow_hotel = $quer_home_slideshow_hotel->result();
        ?>
            <?php foreach ($quer_home_slideshow_hotel as $key) : ?>
                <div class="item">
                    <img alt="" src="<?= base_url(); ?>uploads/banners/<?= $key->image; ?>" class="img-responsive slider-desktop">
                    <img alt="" src="<?= base_url(); ?>uploads/banners/<?= $key->image_mobile; ?>" class="img-responsive slider-mobile">
                </div>
            <?php endforeach; ?>
        <?php endif; ?>
        <!-- <div class="item">
            <img alt="Third slide" src="<?= base_url(); ?>themes/<?= $theme; ?>/bluesky/hotel/images/hotel-slideshow2.jpg" class="img-responsive"> 
        </div>
        <div class="item">
            <img alt="Third slide" src="<?= base_url(); ?>themes/<?= $theme; ?>/bluesky/hotel/images/hotel-slideshow3.jpg" class="img-responsive"> 
        </div> -->
    </div>
    <div class="check-avail check-avail-v3" style="background:#F2F2F2; display:none">
        <div class="container">
            <?= form_open('#', array(
                "class" => "ibe",
                "data-channelcode" => $channelcode,
                "data-region" => "apac",
            )); ?>
            <div style="float: left;" class="arrival date-title ">
                <label>Choose Hotel</label>
                <select name="" id="slc_choose_hotel" style="height:28px; border-radius:0; margin-top:22px; width:100%; border:none; background:none; border-bottom:1px solid #b3b3b3; border-radius:0px !important;">
                    <option selected value="<?= $channelcode; ?>"><?= $txtselected; ?></option>
                </select>
            </div>
            <div style="float: left;" class="departure date-title ">
                <div id="datepickeri" class="input-group date" data-date-format="dd-mm-yyyy">
                    <label>Check In Date </label>
                    <input name="check_in_date" style="border-bottom:1px solid #b3b3b3;" class="form-control" type="text" value="<?= date(); ?>">
                    <span class="input-group-addon"><img src="<?= base_url(); ?>themes/<?= $theme; ?>/bluesky/images/Home-1/date-icon.png" alt="#"></span>
                </div>
                <div>
                    <label>Number of Nights </label>
                    <input style="text-align: center; border-radius: 0px; border-bottom:1px solid #b3b3b3; margin: 0; padding: 0;" class="form-control" name="number_nights" type="number" min="1" value="1">
                </div>
            </div>
            <div style="float: left;" class="adults date-title ">
                <label>Adults</label>
                <!-- <form> -->
                <input max="7" min="1" name="number_adults" type="hidden" value="1" />
                <div class="slc_adults carousel-search">
                    <div class="btn-group">
                        <a class="btn dropdown-toggle " data-toggle="dropdown" href="#">1</a>
                        <ul class="dropdown-menu">
                            <li><a>1</a></li>
                            <li><a>2</a></li>
                            <li><a>3</a></li>
                            <li><a>4</a></li>
                        </ul>
                    </div>
                </div>
                <!-- </form> -->
            </div>
            <div style="float: left;" class="children date-title ">
                <label>Children</label>
                <!-- <form> -->
                <input max="3" min="0" name="number_children" type="hidden" value="0" />
                <div class="slc_children carousel-search">
                    <div class="btn-group">
                        <a class="btn dropdown-toggle " data-toggle="dropdown" href="#">0</a>
                        <ul class="dropdown-menu">
                            <li><a>0</a></li>
                            <li><a>1</a></li>
                            <li><a>2</a></li>
                            <li><a>3</a></li>
                            <li><a>4</a></li>
                        </ul>
                    </div>
                </div>
                <!-- </form> -->
            </div>
            <div style="float: left;" class="find_btn btn_booknow date-title">
                <!-- <button style="display: none;" type="submit">Book Now</button> -->
                <div class="text-find">
                    Check
                    <br>Availability
                </div>
            </div>
            <?= form_close(); ?>
        </div>
    </div>
</section>
<!-- END / SLIDER -->
<!-- ABOUT-US-->
<section class="about" style="margin-bottom:100px;">
    <div class="container">
        <div class="row">
            <div class="col-xs-12 col-sm-6 col-md-5 col-lg-5">
                <div class="about-centent">
                    <h2 class="about-title">
                        <?= $this->session->userdata('site_lang') == 'english' ? ucwords($quer_home_about_hotel->row()->header_text_en) : ucwords($quer_home_about_hotel->row()->header_text); ?>
                    </h2>
                    <div class="line"></div>
                    <div style="font-size:20px;">
                        <?= $this->session->userdata('site_lang') == 'english' ? $quer_home_about_hotel->row()->content_text_en : $quer_home_about_hotel->row()->content_text; ?>
                    </div>
                </div>
            </div>
            <div class="col-xs-12 col-sm-6 col-md-7 col-lg-7 ">
                <div class="about-img">
                    <div class="img-1">
                        <img src="<?= base_url(); ?>uploads/home_about/<?= $quer_home_about_hotel->row()->img_name; ?>" class="img-responsive" alt="Image">
                        <!-- <div class="img-2">
                                <img src="<?= base_url(); ?>themes/<?= $theme; ?>/uploads/home_about/<?= $quer_home_about_hotel->row()->img_name; ?>" class="img-responsive" alt="Image">
                            </div>
                            <div class="img-3">
                                <img src="<?= base_url(); ?>themes/<?= $theme; ?>/uploads/home_about/<?= $quer_home_about_hotel->row()->img_name; ?>" class="img-responsive" alt="Image">
                            </div> -->
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
<!-- END/ ABOUT-US-->

<!-- BEST -->
<section class="best">
    <div class="container">
        <div class="row">
            <div class="col-xs-6 col-sm-3 col-md-3 col-lg-3">
                <div class="wrap-best">
                    <div class="icon-best">
                        <img src="<?= base_url(); ?>uploads/home_about/<?= $quer_hotel_features->row()->feature1_img; ?>" class="img-responsive" alt="Image">
                    </div>
                    <h6 class="sky-h6"><?= ucwords($quer_hotel_features->row()->feature1); ?></h6>
                </div>
            </div>
            <div class="col-xs-6 col-sm-3 col-md-3 col-lg-3">
                <div class="wrap-best">
                    <div class="icon-best">
                        <img src="<?= base_url(); ?>uploads/home_about/<?= $quer_hotel_features->row()->feature2_img; ?>" class="img-responsive" alt="Image">
                    </div>
                    <h6 class="sky-h6"><?= ucwords($quer_hotel_features->row()->feature2); ?></h6>
                </div>
            </div>
            <div class="col-xs-6 col-sm-3 col-md-3 col-lg-3">
                <div class="wrap-best">
                    <div class="icon-best">
                        <img src="<?= base_url(); ?>uploads/home_about/<?= $quer_hotel_features->row()->feature3_img; ?>" class="img-responsive" alt="Image">
                    </div>
                    <h6 class="sky-h6"><?= ucwords($quer_hotel_features->row()->feature3); ?></h6>
                </div>
            </div>
            <div class="col-xs-6 col-sm-3 col-md-3 col-lg-3">
                <div class="wrap-best">
                    <div class="icon-best">
                        <img src="<?= base_url(); ?>uploads/home_about/<?= $quer_hotel_features->row()->feature4_img; ?>" class="img-responsive" alt="Image">
                    </div>
                    <h6 class="sky-h6"><?= ucwords($quer_hotel_features->row()->feature4); ?></h6>
                </div>
            </div>
            <div class="col-xs-6 col-sm-3 col-md-3 col-lg-3">
                <div class="wrap-best">
                    <div class="icon-best">
                        <img src="<?= base_url(); ?>uploads/home_about/<?= $quer_hotel_features->row()->feature5_img; ?>" class="img-responsive" alt="Image">
                    </div>
                    <h6 class="sky-h6"><?= ucwords($quer_hotel_features->row()->feature5); ?></h6>
                </div>
            </div>
            <div class="col-xs-6 col-sm-3 col-md-3 col-lg-3">
                <div class="wrap-best">
                    <div class="icon-best">
                        <img src="<?= base_url(); ?>uploads/home_about/<?= $quer_hotel_features->row()->feature6_img; ?>" class="img-responsive" alt="Image">
                    </div>
                    <h6 class="sky-h6"><?= ucwords($quer_hotel_features->row()->feature6); ?></h6>
                </div>
            </div>
            <div class="col-xs-6 col-sm-3 col-md-3 col-lg-3">
                <div class="wrap-best">
                    <div class="icon-best">
                        <img src="<?= base_url(); ?>uploads/home_about/<?= $quer_hotel_features->row()->feature7_img; ?>" class="img-responsive" alt="Image">
                    </div>
                    <h6 class="sky-h6"><?= ucwords($quer_hotel_features->row()->feature7); ?></h6>
                </div>
            </div>
            <div class="col-xs-6 col-sm-3 col-md-3 col-lg-3">
                <div class="wrap-best">
                    <div class="icon-best">
                        <img src="<?= base_url(); ?>uploads/home_about/<?= $quer_hotel_features->row()->feature8_img; ?>" class="img-responsive" alt="Image">
                    </div>
                    <h6 class="sky-h6"><?= ucwords($quer_hotel_features->row()->feature8); ?></h6>
                </div>
            </div>
            <?php if (!empty($quer_hotel_features->row()->feature9_img)) : ?>
                <div class="col-xs-6 col-sm-3 col-md-3 col-lg-3">
                    <div class="wrap-best">
                        <div class="icon-best">
                            <img src="<?= base_url(); ?>uploads/home_about/<?= $quer_hotel_features->row()->feature9_img; ?>" class="img-responsive" alt="Image">
                        </div>
                        <h6 class="sky-h6"><?= ucwords($quer_hotel_features->row()->feature9); ?></h6>
                    </div>
                </div>
            <?php endif; ?>
        </div>
    </div>
</section>
<!-- END / BEST -->

<!--VIDEO -->
<div class="video-v4" style="display:none;">
    <div class="post">
        <div class="entry-media ">
            <a href="#"><img src="<?= base_url(); ?>themes/<?= $theme; ?>/bluesky/hotel/images/Home-4/about-video.jpg" alt="#" class="img-responsive"></a>
            <div class="section-video ">
                <a class="btn-play" href="#modal-video-1"></a>
                <div id="modal-video-1" class="modal-video" data-video="https://www.youtube.com/embed/doqrFEaXQcE" data-query-string="ecver=1&autoplay=1&showinfo=0&controls=0&modestbranding=1">
                    <iframe allowfullscreen="" height="394"></iframe>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- END / VIDEO -->

<!-- BODY-ROOM-1 -->
<section class="body-room-1 " style="background:#F2F2F2;">
    <div class="container">
        <div class="room-wrap-1">
            <div class="row">
                <?php if ($quer_hotel_promotions->num_rows() > 0) : ?>
                    <?php foreach ($quer_hotel_promotions->result() as $key) : ?>
                        <!-- ITEM -->
                        <div class="col-xs-12 col-sm-6 col-md-6 col-lg-6">
                            <div class="room-item-1">
                                <h4 class="sky-h4"><?= $this->session->userdata('site_lang') == 'english' ? ucwords(@explode(' | ', $key->header_text)[1]) : ucwords(@explode(' | ', $key->header_text)[0]); ?></h4>
                                <div class="img">
                                    <img src="<?= base_url(); ?>uploads/body_rooms/<?= $key->img_name; ?>" alt="#">
                                </div>
                                <div class="content">
                                    <?= $this->session->userdata('site_lang') == 'english' ? $key->content_text_en : $key->content_text; ?>
                                </div>
                                <div class="bottom">
                                    <!-- <span class="price">Starting <span class="amout">Rp 800.000</span> /days</span> -->
                                    <a href="<?= $key->target_loc; ?>" class="btn"><?= $this->session->userdata('site_lang') == 'english' ? strtoupper(@explode(' | ', $key->button_text)[1]) : strtoupper(@explode(' | ', $key->button_text)[0]); ?></a>
                                </div>
                            </div>
                        </div>
                        <!-- END / ITEM -->
                    <?php endforeach; ?>
                <?php endif; ?>

            </div>
        </div>
    </div>
</section>
<!-- END/BODY-ROOM-1-->

<!-- TESTIMONOALS -->
<section class="testimonials">
    <div class="testimonials-h">
        <div class="testimonials-content">
            <div class="container">
                <div id="testimonials" class="owl-carousel owl-theme">
                    <?php if ($quer_hotel_testimonies->num_rows() > 0) : ?>
                        <?php foreach ($quer_hotel_testimonies->result() as $key) : ?>
                            <div class="item " style="color:white !important;">
                                <?php if ($key->image == '') : ?>
                                <?php else : ?>
                                    <div class="img-testimonials"><img src="<?= base_url(); ?>uploads/home_about/<?= $key->image; ?>" alt="#"></div>
                                <?php endif ?>
                                <div style="overflow-x: auto;max-height: 230px;">
                                    <p class="testimonials-p">“
                                        <?= $this->session->userdata('site_lang') == 'english' ? $key->testimony_en : $key->testimony; ?>
                                        “</p>
                                    <h5 class="sky-h5"><?= ucwords($key->customer_name); ?></h5>
                                    <p class="testimonials-p1">From <?= ucwords($key->from_country); ?></p>
                                </div>
                            </div>
                        <?php endforeach; ?>
                    <?php endif; ?>
                </div>
            </div>
        </div>
    </div>
</section>
<!-- END / TESTIMONOALS -->

<!--OUR-EVENTS-->
<section class="events" style="margin-bottom:60px;">
    <div class="container">
        <h2 class="events-title">Press & Activities</h2>
        <div class="line"></div>
        <div id="events-v2" class="owl-carousel owl-theme">
            <?php if ($quer_hotel_events->num_rows() > 0) : ?>
                <?php foreach ($quer_hotel_events->result() as $key) : ?>
                    <?php
                    $header_text = $this->session->userdata('site_lang') == 'english' ? ucwords(explode(' | ', $key->header_text)[1]) : ucwords(explode(' | ', $key->header_text)[0]);
                    ?>
                    <div class="item">
                        <div class="events-item">
                            <a href="<?= base_url() . 'hotel/' . $alias . '/event/' . preg_replace('/\s+/', '-', strtolower($header_text)); ?>" title="">
                                <div class="events-img"><img src="<?= base_url(); ?>uploads/events/<?= @explode(' | ', $key->img_name)[0]; ?>" class="img-responsive" alt="Image"></div>
                            </a>
                            <div class="events-content">
                                <a href="<?= base_url() . 'hotel/' . $alias . '/event/' . preg_replace('/\s+/', '-', strtolower($header_text)); ?>" title="">
                                    <p class="sky-p"><?= $key->judul_header_text ?></p>
                                    <h3 class="sky-h3"><?= ucwords($header_text); ?></h3>
                                </a>
                            </div>
                        </div>
                    </div>
                <?php endforeach; ?>
            <?php endif; ?>
        </div>
    </div>
</section>
<!-- END / OUR EVENTS -->

<?php
$this->db->select('popup_image, popup_text, popup_day_expire, popup_active')->from('home_centerbanners_hotel')->where("hotel_id", $this_hotel->id);
$popup = $this->db->get()->row();
?>
<!-- MODAL POPUP -->
<?php if ($popup->popup_active === 'yes') : ?>
    <div class="customModalDialog" style="display: none;">
        <div>
            <a style="cursor:pointer;" title="Close" class="modalClose">&#10006;</a>
            <img style="max-width:100%;" src="<?= base_url() . 'uploads/page/' . $popup->popup_image; ?>">
            <div class="bottom">
                <a class="btn" id="popupLink" href="<?= $popup->popup_text; ?>" style="padding:5px 10px; color: white;background: #002d57;margin:10px 15px;float:right;">
                    View More
                </a>
            </div>

        </div>
    </div>
<?php endif; ?>

<style>
    .datepicker.dropdown-menu td.day:not(.disabled) {
        color: silver;
    }

    .datepicker table tr td.active.active {
        color: #fff;
        background: #13406B !important;
    }

    .datepicker table tr td span:not(.disabled) {
        color: silver !important;
    }

    .slc_adults ul.dropdown-menu li,
    .slc_children ul.dropdown-menu li {
        cursor: pointer;
    }

    .slc_adults ul.dropdown-menu li:hover a,
    .slc_children ul.dropdown-menu li:hover a {
        background: #fff !important;
        color: #002d57 !important;
    }

    @media (max-width: 1199px) {

        .section-slider .check-avail .container .arrival,
        .section-slider .check-avail .container .departure {
            width: 48%;
            height: 140px;
        }

        .section-slider .check-avail .container .children,
        .section-slider .check-avail .container .adults {
            width: 48%;
            margin-top: 10px;
        }

        .section-slider .check-avail .container .find_btn {
            width: 100%;
            margin: auto;
            margin-top: 10px;
        }

        .section-slider .check-avail .container .arrival input,
        .section-slider .check-avail .container .departure input {
            font-size: 18px;
        }
    }

    @media (max-width: 991px) {

        .section-slider .check-avail .container .arrival,
        .section-slider .check-avail .container .departure {
            width: 47%;
        }

        .section-slider .check-avail .container .children,
        .section-slider .check-avail .container .adults {
            width: 47%;
        }

        .section-slider .check-avail .container .find_btn {
            width: 100%;
        }
    }

    @media (max-width: 768px) {

        .section-slider .check-avail .container .arrival,
        .section-slider .check-avail .container .departure {
            height: 130px !important;
        }

        .section-slider .check-avail .find_btn .text-find {
            padding-top: 5px !important;
            padding-bottom: 5px !important;
        }
    }

    @media (max-width: 767px) {

        .section-slider .check-avail .container .arrival,
        .section-slider .check-avail .container .departure {
            margin-left: 13px;
        }

        .section-slider .check-avail .container .children,
        .section-slider .check-avail .container .adults {
            width: 47% !important;
            border: 1px solid #ebebeb !important;
            margin-left: 13px;
        }

    }

    @media (max-width: 590px) {

        .section-slider .check-avail .container .arrival,
        .section-slider .check-avail .container .departure {
            width: 98%;
            margin-left: 0px;
        }

        .section-slider .check-avail .container .children,
        .section-slider .check-avail .container .adults {
            width: 98% !important;
            margin-left: 0px;
        }

    }
</style>