Change Graphic For TOC

foo0z0ool
Topic Author
Offline
Junior Member

1 year 1 month ago - 1 year 1 month ago #69919 by foo0z0ool

Change Graphic For TOC was created by foo0z0ool

hi
i see some Table of Content in other site
this toc have 3 options
if u added this 3 option will be good.

1- top of Title Make some name ( LIST ) in my language name is (فهرست)
2- 1 Button if click on it the list minimize
3- this table have Color and User can choice color or change CSS for new color

i added this codes and make something box but i think u can do it very better

Code:

use Joomla\CMS\Language\Text;

    function createTable() {
        
        // get the card heading class
        $toc_head_class = $this->params->get('toc_head_class', 'center');
        if ($toc_head_class === 'left')
        {
            $headclass = 'text-left';
        }
        else
        {
            $headclass = 'text-center';
        }
        
        
        // assemble the html to generate the top part of the card
        $html = '<ol class="table-of-contents-ck" style="background: #f9f9f9;border: 1px solid #aaa;box-shadow: 0 1px 1px rgba(0,0,0,.05);display: table;margin-bottom: 1rem;position: relative;width: auto">';
        $html .= '<div class="table-of-contents-ck-header" style="background-color: rgba(0,0,0,0.1);">';
        $html .= '<h3 class="' . $headclass . '">' . Text::_('فهرست') . '</h3>';
        $html .= '</div><div class="card-body">';
          $html .= '<ul style="margin-left: 0;">';
          
        $openedTags = 0;
        foreach ($this->titles as $i => $title) {
            if (isset($this->titles[$i -1])) {
                $prevTitle = $this->titles[$i -1];
                $diffLevel = $title['level'] - $prevTitle['level'];
                if ($diffLevel > 0) {
                    $html .= str_repeat('<ol>', abs($diffLevel));
                    $openedTags += abs($diffLevel);
                } else if ($diffLevel < 0) {
                    $html .= str_repeat('</li>', abs($diffLevel));
                    $html .= str_repeat('</ol>', abs($diffLevel));
                    $openedTags -= abs($diffLevel);
                }
                if ($diffLevel == 0) $html .= '</li>';

            }

            $html .= '<li><a href="#' . $title['anchorId'] . '" class="scrollTo"> ' . $title['text'] .'</a>';
        }
        
        $html .= str_repeat('</li>', $openedTags);
        $html .= str_repeat('</ol>', $openedTags);
        $html .= '</li>';
        $html .= '</div>';
        $html .= '</ol>';
        
        return $html;
    }

thanks for anything.

Attachments: