<?php
/**
 * @package DJ-SlideshowTimeline
 * @copyright Copyright (C) 2017  DJ-Extensions.com LTD, All rights reserved.
 * @license http://www.gnu.org/licenses GNU/GPL
 * @author url: http://dj-extensions.com
 * @author email contact@dj-extensions.com
 *
 * DJ-SlideshowTimeline is free software: you can redistribute it and/or modify
 * it under the terms of the GNU General Public License as published by
 * the Free Software Foundation, either version 3 of the License, or
 * (at your option) any later version.
 *
 * DJ-SlideshowTimeline is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
 * GNU General Public License for more details.
 *
 * You should have received a copy of the GNU General Public License
 * along with DJ-SlideshowTimeline. If not, see <http://www.gnu.org/licenses/>.
 *
 */

defined('_JEXEC') or die;
?>

<?php

$nav = $this->el('div', [

    'class' => [
        'el-nav',
        'uk-margin[-{switcher_margin}] {@switcher_position: top|bottom}',
        'uk-{switcher_style: thumbnav} [uk-flex-nowrap {@switcher_thumbnail_nowrap}]',
        'uk-child-width-expand uk-grid uk-active',
        'uk-visible@l'
    ],

    'uk-switcher' => [
        'connect: #{connect};',
        'animation: uk-animation-{switcher_animation};',
        'media: @{switcher_grid_breakpoint} {@switcher_position: left|right} {@switcher_style: tab};',
    ],

    'uk-margin' => ['1{@switcher_style: thumbnav} {@!switcher_thumbnail_nowrap}'],
]);

$nav_horizontal = [
    'uk-{switcher_style: subnav.*}',
    'uk-tab-{switcher_position: bottom} {@switcher_style: tab}',
    'uk-flex-{switcher_align: right|center}',
    'uk-child-width-expand {@switcher_align: justify}',
];

$nav_vertical = [
    'uk-nav uk-nav-[primary {@switcher_style_primary}][default {@!switcher_style_primary}] [uk-text-left {@text_align}] {@switcher_style: subnav.*}',
    'uk-tab-{switcher_position} {@switcher_style: tab}',
    'uk-thumbnav-vertical {@switcher_style: thumbnav}',
];

$nav_switcher = in_array($props['switcher_position'], ['top', 'bottom'])
    ? ['class' => $nav_horizontal]
    : ['class' => $nav_vertical,
        'uk-toggle' => $props['switcher_style'] != 'tab' ? [
            "cls: {$this->expr(array_merge($nav_vertical, $nav_horizontal), $props)};",
            'mode: media;',
            'media: @{switcher_grid_breakpoint};',
        ] : false,
    ];


?>

<?= $nav($props, $nav_switcher) ?>
    <?php foreach ($children as $child) :
    ?>
    <div class="uk-padding-remove uk-text-center uk-timeline-nav">
            <a href="#" data-year="<?= $child->props['title'] ?>">
                <hr class="uk-divider-icon uk-timeline-icon">
                <span><?= $child->props['title'] ?></span>
            </a>
    </div>
    <?php endforeach ?>
</div>

