<?php
/*
* @package		Tech Fry Library
* @license		https://www.gnu.org/licenses/gpl-3.0.en.html
*/

namespace TechFry\Library\View\Sky;

defined('_JEXEC') or die;

use Joomla\CMS\Factory;

class Countdown extends Bootstrap
{
    // https://albert-gonzalez.github.io/easytimer.js
    public function display()
    {
        // data - countdown_date
        // config - duration_class, on_expire, finished_text

        if (empty($this->data))
        {
            return;
        }
        
        $this->data = (array) $this->data;

        // Finished text can be set in data or config
        $finished_text = $this->data['finished_text'] ?? $this->config['finished_text'] ?? '';

        $launch_date = Factory::getDate($this->data['countdown_date']);
        $today = Factory::getDate();

        // When countdown is expired
        $on_expire = $this->config['on_expire'] ?? 'hide';
        if ($on_expire == 'message' && $launch_date < $today)
        {
            return '<h3>' . $finished_text . '</h3>';
        }
        elseif ($on_expire == 'hide' && $launch_date < $today)
        {
            return;
        }

        $interval = $launch_date->getTimestamp() - $today->getTimestamp();

        $duration_class = $this->config['duration_class'] ?? 'border p-3 flex-fill';

        $output = '';

        $output .= '<div class="text-center d-flex justify-content-center gap-3">';
            
            // Days
            $show_days = isset($this->config['show_days']) && !$this->config['show_days'] ? 'd-none ' : '';
            $days_label = $this->config['days_label'] ?? 'Days';

            $output .= '<div class="' . $show_days . $duration_class . '">';
                $output .= '<h3 id="days"></h3>';
                $output .= '<span class="d-block fs-6">' . $days_label . '</span>';
            $output.= '</div>';

            // Hours
            $show_hours = isset($this->config['show_hours']) && !$this->config['show_hours'] ? 'd-none ' : '';
            $hours_label = $this->config['hours_label'] ?? 'Hours';

            $output .= '<div class="' . $show_hours . $duration_class . '">';
                $output .= '<h3 id="hours"></h3>';
                $output .= '<span class="d-block fs-6">' . $hours_label . '</span>';
            $output.= '</div>';

            // Minutes
            $show_minutes = isset($this->config['show_minutes']) && !$this->config['show_minutes'] ? 'd-none ' : '';
            $minutes_label = $this->config['minutes_label'] ?? 'Minutes';

            $output .= '<div class="' . $show_minutes . $duration_class . '">';
                $output .= '<h3 id="minutes"></h3>';
                $output .= '<span class="d-block fs-6">' . $minutes_label . '</span>';
            $output.= '</div>';

            // Seconds
            $show_seconds = isset($this->config['show_seconds']) && !$this->config['show_seconds'] ? 'd-none ' : '';
            $seconds_label = $this->config['seconds_label'] ?? 'Seconds';

            $output .= '<div class="' . $show_seconds . $duration_class . '">';
                $output .= '<h3 id="seconds"></h3>';
                $output .= '<span class="d-block fs-6">' . $seconds_label . '</span>';
            $output.= '</div>';

        $output .= '</div>';

        //$output .= '<div id="basicUsage">00:00:00</div>';

        $output .= '<script>var timer = new easytimer.Timer();
            timer.start({countdown: true, startValues: {seconds: ' . $interval . '}});

            const s = document.getElementById(\'seconds\');
            const m = document.getElementById(\'minutes\');
            const h = document.getElementById(\'hours\');
            const d = document.getElementById(\'days\');

            timer.addEventListener(\'secondsUpdated\', function (e) {
                d.textContent = timer.getTimeValues().days
                h.textContent = timer.getTimeValues().hours
                m.textContent = timer.getTimeValues().minutes
                s.textContent = timer.getTimeValues().seconds
            });</script>';

        // basicUsage.html(timer.getTimeValues().toString());

        // Include Javascript
        $this->include_tfjs('easytimer.min');
        
        return $output;
    }
}