default_attributes = [ "title" => esc_html__("Table of Contents", "essential-blocks"), "titleTag" => "h2", "collapsible" => false, "initialCollapse" => false, "displayTitle" => true, "isSmooth" => true, "seperator" => false, "isSticky" => false, "contentAlign" => "left", "scrollTarget" => "scroll_to_toc", "stickyPosition" => "left", "enableCopyLink" => false, "showListSeparator" => false, "scrollToTop" => false, "scrollToTopIcon" => "fas fa-angle-up", "stickyHideOnMobile" => false, "hideOnDesktop" => false, "hideOnTab" => false, "hideOnMobile" => false, "topOffset" => "", "listStyle" => "ul", "itemCollapsed" => false, "preset" => "style-1", "enableListStyle" => false, "enableHighlight" => false ]; } /** * Unique name of the block. * @return string */ public function get_name() { return 'table-of-contents'; } /** * Register all other scripts * @return void */ public function register_scripts() { $this->assets_manager->register( 'table-of-contents-block-frontend', $this->path() . '/frontend.js', ['clipboard', 'essential-blocks-controls-frontend'] ); } /** * Get Editor Type * * @return string */ public function get_editor_type() { global $pagenow; $editor_type = ""; if ($pagenow == 'post-new.php' || $pagenow == 'post.php') { $editor_type = 'edit-post'; } elseif ($pagenow == 'site-editor.php' || ($pagenow == 'themes.php' && isset($_GET['page']) && $_GET['page'] == 'gutenberg-edit-site')) { $editor_type = 'edit-site'; } elseif ($pagenow == 'widgets.php') { $editor_type = 'edit-widgets'; } return $editor_type; } /** * Check if a array all values are false * * @return boolean */ public function areAllFalse($array) { return array_reduce($array, function ($carry, $item) { return $carry && ($item === false); }, true); } /** * Generate TOC * * @param array $data */ public function generate_toc($data, $listStyle, $itemCollapsed) { $toc = "<$listStyle class='eb-toc__list'>"; $stack = []; for ($i = 0; $i < count($data); $i++) { $level = $data[$i]['level']; $content = $data[$i]['content']; $link = $data[$i]['link']; while (count($stack) > 0 && $stack[count($stack) - 1]['level'] >= $level) { array_pop($stack); $toc .= ""; } $toc .= "

$content"; if ($i < count($data) - 1 && $data[$i + 1]['level'] > $level) { if ($itemCollapsed == 'true' && ! count($stack)) { $toc .= ''; } $toc .= "<$listStyle class='eb-toc__list'>"; array_push($stack, ['level' => $level, 'content' => $content, 'link' => $link]); } } while (count($stack) > 0) { array_pop($stack); $toc .= "

"; } $toc .= ""; return $toc; } /** * Generate headers from content */ public function getHeadersFromContent($visibleHeaders, $postContent) { if (empty($postContent)) { return []; } $dom = new \DOMDocument(); libxml_use_internal_errors(true); $dom->loadHTML('' . $postContent . ''); libxml_use_internal_errors(false); $queryArray = ["h1", "h2", "h3", "h4", "h5", "h6"]; if (isset($visibleHeaders)) { $queryArray = []; if ($visibleHeaders[0]) { $queryArray[] = "self::h1"; } if ($visibleHeaders[1]) { $queryArray[] = "self::h2"; } if ($visibleHeaders[2]) { $queryArray[] = "self::h3"; } if ($visibleHeaders[3]) { $queryArray[] = "self::h4"; } if ($visibleHeaders[4]) { $queryArray[] = "self::h5"; } if ($visibleHeaders[5]) { $queryArray[] = "self::h6"; } } $queryString = implode(' or ', $queryArray); $queryString = '//*[' . $queryString . ']'; if (! $this->areAllFalse($visibleHeaders)) { $xpath = new \DOMXpath($dom); $headingElements = iterator_to_array($xpath->query($queryString)); return $this->getHeadingsFromHeadingElements($headingElements); } return []; } /** * generate heading from headings elements */ public function getHeadingsFromHeadingElements($headingElements) { $headings = []; foreach ($headingElements as $index => $heading) { $level = null; switch ($heading->tagName) { case "h1": $level = 1; break; case "h2": $level = 2; break; case "h3": $level = 3; break; case "h4": $level = 4; break; case "h5": $level = 5; break; case "h6": $level = 6; break; } $value = apply_filters('eb_dynamic_tag_value', $heading->textContent, '', true); $value = empty($value) ? $heading->textContent : $value; $heading_string = $this->parseTocSlug(wp_strip_all_tags($value)); $headings[] = [ "level" => $level, "content" => $value, "text" => $value, "link" => preg_match('/^[A-Za-z0-9\-\_]+$/', $heading_string) === 1 ? $heading_string : "eb-table-content-$index" ]; } return $headings; } /** * parse slug */ public function parseTocSlug($slug) { if (! $slug) { return $slug; } // TODO: have to remove accent function $parsedSlug = strtolower($slug); $parsedSlug = preg_replace('/&(amp;)/', '', $parsedSlug); // Remove & $parsedSlug = preg_replace('/&(mdash;)/', '', $parsedSlug); // Remove long dash $parsedSlug = preg_replace('/[\x{2013}\x{2014}]/u', '', $parsedSlug); // Remove long dash $parsedSlug = preg_replace('/[&]nbsp[;]/i', '-', $parsedSlug); // Replace inseccable spaces $parsedSlug = preg_replace('/\s+/', '-', $parsedSlug); // Replace spaces with - $parsedSlug = preg_replace('/[&\/\\#,^!+()$~%.\'":*?<>{}@‘’”“]/', '', $parsedSlug); // Remove special chars $parsedSlug = preg_replace('/\-+/', '-', $parsedSlug); // Replace multiple - with single - $parsedSlug = preg_replace('/^-+/', '', $parsedSlug); // Trim - from start of text $parsedSlug = preg_replace('/-+$/', '', $parsedSlug); // Trim - from end of text return urldecode(rawurlencode($parsedSlug)); } /** * Callback function for wp_kses_allowed_html * * @param array $tags * * @return array */ public function allowed_html($tags) { return array_merge($tags, [ 'svg' => [ 'xmlns' => true, 'version' => true, 'width' => true, 'height' => true, 'viewBox' => true, 'fill' => true, 'stroke' => true, 'stroke-width' => true, 'xmlns:xlink' => true ], 'g' => [], 'path' => [ 'd' => true ] ]); } /** * Render Table of Contents Block * * @param array $attributes the blocks attribtues. */ public function render_callback($attributes, $content) { $the_post = get_post(); if (! $the_post) { return; } $attributes = wp_parse_args($attributes, $this->default_attributes); $blockId = esc_attr($attributes['blockId']); $scrollToTop = $attributes['scrollToTop'] ? 'true' : 'false'; $scrollToTopIcon = $attributes['scrollToTopIcon']; $listStyle = $attributes['listStyle']; $collapsible = $attributes['collapsible'] ? 'true' : 'false'; $initialCollapse = $attributes['initialCollapse'] ? 'true' : 'false'; $stickyHideOnMobile = $attributes['stickyHideOnMobile'] ? 'true' : 'false'; $isSticky = $attributes['isSticky'] ? 'true' : 'false'; $stickyPosition = $attributes['stickyPosition']; $scrollTarget = $attributes['scrollTarget']; $enableCopyLink = $attributes['enableCopyLink'] ? 'true' : 'false'; $displayTitle = $attributes['displayTitle'] ? 'true' : 'false'; $title = $attributes['title']; $titleTag = $attributes['titleTag']; $isSmooth = $attributes['isSmooth'] ? 'true' : 'false'; $itemCollapsed = $attributes['itemCollapsed'] ? 'true' : 'false'; $topOffset = $attributes['topOffset']; $preset = $attributes['preset']; $enableListStyle = $attributes['enableListStyle']; $hideOnDesktop = $attributes['hideOnDesktop'] ? 'true' : 'false'; $hideOnTab = $attributes['hideOnTab'] ? 'true' : 'false'; $hideOnMobile = $attributes['hideOnMobile'] ? 'true' : 'false'; $visibleHeaders = isset($attributes['visibleHeaders']) ? $attributes['visibleHeaders'] : array_fill(0, 6, true); $content = html_entity_decode(preg_replace("~~s", "", $the_post->post_content)); $headers = $this->getHeadersFromContent($visibleHeaders, wp_kses_post($content)); $enableHighlight = $attributes['enableHighlight'] ? 'true' : 'false'; $deleteHeaderList = isset($attributes['deleteHeaderList']) ? $attributes['deleteHeaderList'] : []; $classHook = isset($attributes['classHook']) ? $attributes['classHook'] : ''; $container_class = []; $container_class[] = 'eb-toc-container ' . $blockId; $container_class[] = $isSticky == 'true' ? 'eb-toc-sticky-' . $stickyPosition : ''; $container_class[] = $isSticky == 'true' ? 'eb-toc-is-sticky' : 'eb-toc-is-not-sticky'; $container_class[] = $collapsible == 'true' ? 'eb-toc-collapsible' : 'eb-toc-not-collapsible'; $container_class[] = $initialCollapse == 'true' ? 'eb-toc-initially-collapsed' : 'eb-toc-initially-not-collapsed'; $container_class[] = $scrollToTop ? 'eb-toc-scrollToTop' : 'eb-toc-not-scrollToTop'; $container_class[] = $preset; $container_class[] = $enableListStyle === false ? 'list-style-none' : ''; $wrapper_class = []; $wrapper_class[] = $collapsible == 'true' && $initialCollapse == 'true' && $isSticky == 'false' ? 'hide-content' : ''; $wrapper_attributes = get_block_wrapper_attributes( [ 'class' => 'root-' . $blockId ] ); $output = ""; $output .= '

'; $output .= '

'; $output .= '

'; $output .= '

'; if ($isSticky == 'true') { $output .= ''; $output .= ''; } if ($displayTitle == 'true') { $output .= '<' . $titleTag . ' class="eb-toc-title">' . $title . ''; } $output .= '

'; // header $output .= '

'; if ($visibleHeaders && count($headers) > 0 && count(array_filter($headers, function ($header) use ($visibleHeaders) { return isset($visibleHeaders[$header['level'] - 1]); })) > 0) { $newHeaders = []; foreach ($headers as $index => $item) { if ( isset($deleteHeaderList) && is_array($deleteHeaderList) && count($deleteHeaderList) > 0 && isset($deleteHeaderList[$index]) && isset($deleteHeaderList[$index]["isDelete"]) && $deleteHeaderList[$index]["isDelete"] === false ) { $newHeaders[] = $headers[$index]; } } $output .= '

'; $output .= count($newHeaders) > 0 ? $this->generate_toc($newHeaders, $listStyle, $itemCollapsed) : $this->generate_toc($headers, $listStyle, $itemCollapsed); $output .= '

'; } $output .= '

'; // wrapper $stickyPositionClass = $isSticky ? " eb-toc-button-$stickyPosition" : ''; if ('false' !== $isSticky) { $output .= ''; } $output .= '

'; // container $output .= '

'; // parent wrapper $output .= "

"; // block add_filter('wp_kses_allowed_html', [$this, 'allowed_html']); $content = wp_kses_post($output); remove_filter('wp_kses_allowed_html', [$this, 'allowed_html']); return $content; } }