1
0
mirror of https://github.com/e107inc/e107.git synced 2025-02-19 14:04:44 +01:00

Added options to e_form->carousel() to disable navigation and indicators. Custom navigation can now display a custom label when 'label' is included in the carousel array.

This commit is contained in:
Cameron 2020-02-19 10:25:22 -08:00
parent 0dbad5d72b
commit b59e55339c
2 changed files with 25 additions and 9 deletions

View File

@ -594,7 +594,7 @@ class e_form
* Render Bootstrap Carousel * Render Bootstrap Carousel
* @param string $name : A unique name * @param string $name : A unique name
* @param array $array * @param array $array
* @param array $options : default, interval, pause, wrap * @param array $options : default, interval, pause, wrap, navigation, indicators
* @return string|array * @return string|array
* @example * @example
* $array = array( * $array = array(
@ -603,7 +603,7 @@ class e_form
* 'slide3' => array('caption' => 'Slide 3', 'text' => 'third slide content' ) * 'slide3' => array('caption' => 'Slide 3', 'text' => 'third slide content' )
* ); * );
*/ */
function carousel($name="e-carousel", $array, $options = null) function carousel($name="e-carousel", $array=array(), $options = null)
{ {
$interval = null; $interval = null;
$wrap = null; $wrap = null;
@ -628,13 +628,16 @@ class e_form
$pause = 'data-pause="'.$options['pause'].'"'; $pause = 'data-pause="'.$options['pause'].'"';
} }
$navigation = isset($options['navigation']) ? $options['navigation'] : true;
$indicate = isset($options['indicators']) ? $options['indicators'] : true;
$start =' $start ='
<!-- Carousel --> <!-- Carousel -->
<div id="'.$name.'" class="carousel slide" data-ride="carousel" '.$interval.' '.$wrap.' '.$pause.'>'; <div id="'.$name.'" class="carousel slide" data-ride="carousel" '.$interval.' '.$wrap.' '.$pause.'>';
if(count($array) > 1) if($indicate && (count($array) > 1))
{ {
$indicators = ' $indicators = '
<!-- Indicators --> <!-- Indicators -->
@ -663,7 +666,8 @@ class e_form
foreach($array as $key=>$tab) foreach($array as $key=>$tab)
{ {
$active = ($c == $act) ? ' active' : ''; $active = ($c == $act) ? ' active' : '';
$inner .= '<div class="carousel-item item'.$active.'" id="'.$key.'">'; $label = !empty($tab['label']) ? ' data-label="'.$tab['label'].'"' : '';
$inner .= '<div class="carousel-item item'.$active.'" id="'.$key.'"'.$label.'>';
$inner .= $tab['text']; $inner .= $tab['text'];
if(!empty($tab['caption'])) if(!empty($tab['caption']))
@ -678,7 +682,7 @@ class e_form
$inner .= ' $inner .= '
</div>'; </div>';
if(count($array) > 1) if($navigation && (count($array) > 1))
{ {
$controls = ' $controls = '
<a class="left carousel-control carousel-left" href="#'.$name.'" role="button" data-slide="prev"> <a class="left carousel-control carousel-left" href="#'.$name.'" role="button" data-slide="prev">

View File

@ -852,10 +852,22 @@ $(document).ready(function()
$('body').on('slid.bs.carousel', '.carousel', function(){ $('body').on('slid.bs.carousel', '.carousel', function(){
var label = $(this).find('.active').attr('data-label');
var id = $(this).attr('id') + '-index'; // admin-ui-carousel-index etc.
if(label !== undefined)
{
$('#'+id).text(label);
}
else
{
var currentIndex = $(this).find('.active').index(); var currentIndex = $(this).find('.active').index();
var text = (currentIndex + 1); var text = (currentIndex + 1);
var id = $(this).attr('id') + '-index'; // admin-ui-carousel-index etc.
$('#'+id).text(text); $('#'+id).text(text);
}
// this takes commented content for each carousel slide and enables it, one slide at a time as we scroll. // this takes commented content for each carousel slide and enables it, one slide at a time as we scroll.