<?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\HTML\HTMLHelper;
use TechFry\Library\TResource;

class Modal extends Bootstrap
{
    public $modal_id;
    
    public $modal_content_class;

    public $class_options = array('width', 'bg', 'animation', 'modal_class');

    // Title, Body
    // item - trigger_button_text, body, title, button_text (for action button at footer)
    // config - button_class, width, bg, close_class, body_class, on_load, delay

    public function display()
    {
        $this->modal_id = $this->get_id();
        $this->modal_content_class = $this->get_class();
        $this->data = (array) $this->data;

        $output = '';

        // Button trigger
        $output .= $this->modal_trigger();

        // Modal 
        $output .= '<div class="modal fade" id="' . $this->modal_id . '" tabindex="-1" aria-hidden="true">';
        $output .= '<div class="modal-dialog">';
        $output .= '<div class="modal-content ' . $this->modal_content_class . '">';

        $output .= $this->modal_header();

        $output .= $this->modal_body();

        // Modal footer shows action buttons
        $output .= $this->modal_footer();

        $output .= '</div>';
        $output .= '</div>';
        $output .= '</div>';

        // Add CSS
        $this->include_tfcss('modal');

        // Add JavaScript
        $this->include_bsjs('modal');

        // Show on Page Load with delay
        if ($this->config['on_load'])
        {
            $delay = $this->config['delay'] * 1000;
            
            $script = 'window.onload = function() {
            setTimeout(function() {
            const myModal = new bootstrap.Modal(\'#' . $this->modal_id . '\');
            myModal.show();
            }, ' . $delay . ');
            };';

            $r = new TResource();
            $r->add_script($script);
        }

        return $output;
    }

    public function modal_trigger()
    {
        $output = '<button type="button" class="' . $this->config['button_class'] . '" data-bs-toggle="modal" data-bs-target="#' . $this->modal_id . '"';
        $output .= '>' . $this->data['trigger_button_text'] . '</button>';

        return $output;
    }

    public function modal_header()
    {
        $output = '<div class="modal-header">';
            if (isset($this->data['title']) && $this->data['title'])
            {
                $output .= $this->html->h1($this->data['title'], array('class' => 'modal-title fs-5'));
            }
            $output .= '<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>';
        $output .= '</div>';

        return $output;
    }

    public function modal_body()
    {
        $output = '<div class="modal-body ' . $this->config['body_class'] . '">';
            $output .= $this->data['body'];
        $output .= '</div>';

        return $output;
    }

    public function modal_footer()
    {
        $output = '<div class="modal-footer">';
            $output .= '<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>';
            if (isset($this->data['button_text']) && $this->data['button_text'])
            {
                $button_class = $this->data['button_class'] ?? '';
                $button = array(
                    'text' => $this->data['button_text'],
                    'url' => $this->data['button_url'],
                    'icon' => $this->data['button_icon'] ?? '',
                    'target' => $this->data['button_target'],
                );

                $btn = new Button($button, array('button_class' => $button_class));
                $output .= $btn->display();
            }
        $output .= '</div>';

        return $output;
    }

    public function get_output_amp()
    {
        $this->config['modal_id'] = 'myModal';
        $this->modal_content_class = trim($config['width'] . ' ' . $config['bg'] . ' ' . $config['animation'] . ' ' . $config['modal_class']);
        $this->item = (array) $this->data;

        $r = new TResource();
        $r->add_resource('https://cdn.ampproject.org/v0/amp-lightbox-0.1.js', 'js', array('async' => 'async', 'custom-element' => 'amp-lightbox'));

        // Button trigger
        $output = '<button class="' . $this->config['button_class'] . '" on="tap:' . $this->config['modal_id'] . '">';
        $output .= $this->item['button_text'] . '</button>'; 

        // Modal
        $output .= '<amp-lightbox id="' . $this->config['modal_id'] . '" layout="nodisplay">';
        $output .= '<button on="tap:' . $this->config['modal_id'] . '.close" tabindex="0">Close</button>';
        $output .= $this->item['body'];
        $output .= '</amp-lightbox>';	

        return $output;
    }
}