<?php $_shouldextend[1]=1; ?>

<?php $this->startSection('content'); ?>

 <?php $this->startPush("metadata"); ?>
 <?php echo $metadata; ?>

 <?php $this->stopPush(); ?>
 <div class="bg-white ">

 <section class="pt-x-sm-0 pt-5 mt-5 position-relative container-fluid ">
 <div class="container-fluid">
 <div class="row align-items-top pt-5">
 <?php 
 $i=0;
 ?>
 <?php $__currentLoopData = $combined; $this->addLoop($__currentLoopData); foreach($__currentLoopData as $item): $this->incrementLoopIndices(); $loop = $this->getFirstLoop(); ?>
 <?php $__currentLoopData = $item->attashments; $this->addLoop($__currentLoopData); foreach($__currentLoopData as $atm): $this->incrementLoopIndices(); $loop = $this->getFirstLoop(); ?>
 <?php 
 $i++;
 ?>
 <div class="col-lg-2 col-12 px-0 py-0" >
 <div class="scale-item-1 pb-1 " data-rand="<?php echo static::e($loop->index-1); ?>">
 <div class=" img-card position-relative">
 <img src="assets/img/uploads/<?php echo static::e($atm->url); ?>" class="w-100" alt="<?php echo static::e($item->name); ?>">
 <div class= "hidden img-card-holder position-absolute  on-top-0 on-left-0 w-100 h-100 card-dark" data-toggle="modal" data-target="#see-img-modal" data-src = "<?php echo static::e($i); ?>">
 <div class="d-flex align-items-center justify-content-center on-hover  h-100 w-100">
 <i class="text-light material-icons big-font">remove_red_eye</i>
 </div>
 </div>
 </div>
 </div>
 </div>
 <?php endforeach; $this->popLoop(); $loop = $this->getFirstLoop(); ?>
 <?php endforeach; $this->popLoop(); $loop = $this->getFirstLoop(); ?>
 </div>
 </div>
 </section>
 </div>

 <div class="modal" id="see-img-modal">
 <div class="modal-dialog modal-dialog-centered modal-xl">
 <div class="modal-content rounded-0 bg-white">

 <!-- Modal Header -->
 <div class="modal-header border-x-bottom-dark">
 <h6 class="modal-title pt-2 text-std-2 sm-font">IMAGEM</h6>
 <div class="mx-auto">
 <a class="btn btn-outline-dark  on-hover border-x rounded-0 mr-2"
 href="#img-slider" data-slide="prev"
 >
 <i class="fa fa-long-arrow-left"></i>
 </a>
 <a class="btn btn-outline-dark on-hover border-x rounded-0 mr-2"
 href="#img-slider" data-slide="next"
 >
 <i class="fa fa-long-arrow-right"></i>
 </a>
 </div>
 <button type="button" class="close ml-0" data-dismiss="modal">&times;</button>
 </div>

 <!-- Modal body -->
 <div class="modal-body px-0 py-0">
 <div id="img-slider" class="carousel slide carousel-fade my-0" data-interval="false" data-ride="carousel">
 <ul class="hidden carousel-indicators">
 <?php 
 $i2=0;
 ?>
 <?php $__currentLoopData = $combined; $this->addLoop($__currentLoopData); foreach($__currentLoopData as $item): $this->incrementLoopIndices(); $loop = $this->getFirstLoop(); ?>
 <?php $__currentLoopData = $item->attashments; $this->addLoop($__currentLoopData); foreach($__currentLoopData as $attachment): $this->incrementLoopIndices(); $loop = $this->getFirstLoop(); ?>
 <li data-target="#img-slider" data-slide-to="<?php echo static::e($i2); ?>"></li>
 <?php 
 $i2++;
 ?>
 <?php endforeach; $this->popLoop(); $loop = $this->getFirstLoop(); ?>
 <?php endforeach; $this->popLoop(); $loop = $this->getFirstLoop(); ?>
 </ul>
 <?php 
 $i2=0;
 ?>
 <?php $__currentLoopData = $combined; $this->addLoop($__currentLoopData); foreach($__currentLoopData as $item): $this->incrementLoopIndices(); $loop = $this->getFirstLoop(); ?>
 <?php $__currentLoopData = $item->attashments; $this->addLoop($__currentLoopData); foreach($__currentLoopData as $attachment): $this->incrementLoopIndices(); $loop = $this->getFirstLoop(); ?>
 <div class="carousel-item <?php echo static::e($i2== 0 ? 'active' : ''); ?>">
 <img src="assets/img/uploads/<?php echo static::e($attachment->url); ?>" class="w-100">
 </div>
 <?php 
 $i2++;
 ?>
 <?php endforeach; $this->popLoop(); $loop = $this->getFirstLoop(); ?>
 <?php endforeach; $this->popLoop(); $loop = $this->getFirstLoop(); ?>
 </div>
 </div>

 <!-- Modal footer -->
 <div class="modal-footer border-x-top-dark">
 </div>

 </div>
 </div>
 </div>
 <?php $this->startPush("scripts"); ?>

 <script type="text/javascript">

 /*document.getElementById("video1").addEventListener("loadedmetadata", function() {
 this.currentTime = 2.5;
 }, false);*/

 const carouselItemTo = carouselItem => {
 $("#img-slider").find(".carousel-item").removeClass("active");
 $("#img-slider").find(".carousel-item").eq(carouselItem-1).addClass("active");
 $("#img-slider").carousel(carouselItem);
 $(`[data-target='#img-slider'][data-slide-to=${carouselItem}]`).click();

 };

 $('.img-card').mouseenter(function () {
 $('.img-card').find('.img-card-holder').fadeOut();
 $(this).find('.img-card-holder').fadeToggle('fast');
 });

 $('.img-card-holder').on('click', function () {
 console.log("entrei", $(this).data('src'));
 carouselItemTo(parseInt($(this).data('src')));
 });
 $('.app-selection').on('click', function () {

 if ($(this).hasClass("active")) {

//  console.log("Imgame: "+$(this).find("img").attr("src") + "Tamanho: " +$(this).find("img").attr("src").indexOf("c"));
 if ($(this).find("img").attr("src").indexOf("c") > 0) {
 $(this).find("img").attr("src", $(this).find("img").attr("src").split("_")[0] + ".svg");
 console.log("Imgame2: " + $(this).find("img").attr("src"));


 }

 $(this).find("input").click();

 $(this).css('background-color', '#fff');
 $(this).removeClass('active');
 $(this).find("h6").css("color", "#000");

 } else {


 if ($(this).find("img").attr("src").indexOf("_") == -1) {
 $(this).find("img").attr("src", $(this).find("img").attr("src").split(".")[0] + "_branco.svg");

// console.log("Imgame2323: "+$(this).find("img").attr("src") + "Tamanho: " +$(this).find("img").attr("src").indexOf("c"));
 }

 $(this).find("input").click();
 $(this).css('background-color', 'rgba(2,119,189 ,1)');
 $(this).addClass('active');
 $(this).find("h6").css("color", "#fff");


 }


 });

 $('.btn-move-to-slide').on('click', function () {

 $("#form-slider").find(".carousel-item").removeClass("active");
 $($("#form-slider").find(".carousel-item").eq(0)).addClass("active");

 });

 $("a.scroll-link").click(function (event) {
 event.preventDefault();

 if ($($(this).attr('href')).hasClass('is-new'))
 $("html, body").animate({scrollTop: $($(this).attr("href")).offset().top + 70}, 600);
 else
 $("html, body").animate({scrollTop: $($(this).attr("href")).offset().top}, 600);

 });


 $('.btn-show-enterprise').on('click', function () {

 if (!$(this).hasClass('shown')) {
 $(this).parent().parent().parent().parent().find('.carousel').show('fast');
 $(this).addClass('shown');
 $(this).text("Esconder empresas");
 } else {
 $(this).parent().parent().parent().parent().find('.carousel').hide('fast');
 $(this).removeClass('shown');
 $(this).text("Ver empresas");
 }
 });

 $('.btn-see-img').on('click', function (e) {
 console.log("entrei");
 $('#img-displayer').attr('src', $(this).parents('.img-advertising').find('img').attr('src'));

 });


 </script>

 <?php $this->stopPush(); ?>

<?php $this->stopSection(); ?>

<?php if (@$_shouldextend[1]) { echo $this->runChild('guest.layouts.guestApp', ["title" => "Galeria", "isOdd" =>true]); } ?>