1 Topic by antiben (edited by antiben 2013-02-28 01:24:51)

Topic: carousel snippet (bootstrap)

carousel snippet:

<?php
    // you have to specify a folder
    if (isset($folder)) {
        $carousel = File::scan($folder, array('jpg', 'png','gif'));
        $id = Text::random('alpha');
?>
<div id="<?php echo $id; ?>Carousel" class="carousel slide">
  <ol class="carousel-indicators">
<?php
        for($i=0; $i < count($carousel); $i++) {
?>
          <li data-target="#<?php echo $id; ?>Carousel" data-slide-to="<?php echo $i; ?>"<?php if ($i == 0) echo ' class="active"'; ?>></li>
<?php
        }
?>
  </ol>
  <!-- Carousel items -->
  <div class="carousel-inner">
<?php
        for($i=0; $i < count($carousel); $i++) {
?>
          <div class="<?php if ($i == 0) echo 'active '; ?>item"><img src="<?php echo Option::get('siteurl') . $folder . DS . $carousel[$i]; ?>"></div>
<?php
        }
?>
  </div>
  <!-- Carousel nav -->
  <a class="carousel-control left" href="#<?php echo $id; ?>Carousel" data-slide="prev">‹</a>
  <a class="carousel-control right" href="#<?php echo $id; ?>Carousel" data-slide="next">›</a>
</div>
<?php
    }
?>

usage:

{snippet get="carousel" folder="public/uploads/gallery"}

info:
based on the lightbox carousel. (so this plugin is required, but only for the js trigger[¹])

tested against a default monstra 2.1.3 install and while doing this, i noticed, these indicators seems to require bootstrap 2.3.0, so replace it and delete the tmp files (admin->system)
(the lightbox plugin uses these indicators also...)

[¹]carousel js trigger:

$(document).ready(function(){
    $('.carousel').carousel();
});