betterdocs / views / templates / parts / code-snippet-tab.php

code-snippet-tab.php in BetterDocs – AI Documentation, Knowledge Base, MCP Server, Docs, Wikis, FAQ & Chatbot 4.9.3, at views/templates/parts/code-snippet-tab.php

125 lines 5.6 KB

Raw Download Zip

1	<?php
2	// phpcs:disable WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound -- view template receives variables via extract(); prefixing is impractical.
3
4	if ( ! defined( 'ABSPATH' ) ) {
5	exit;
6	}
7	/**
8	* Template part for BetterDocs Code Snippet Tab.
9	*
10	* Reuses the Code Snippet shell (wrapper / header / panels / copy button / dark
11	* + light themes / line numbers). Instead of a language dropdown it renders a
12	* row of HTTP-status tabs — one per response — each switching a code panel.
13	*
14	* @var array $responses [ { status, language, code } ] — one tab per entry.
15	* @var bool $show_copy_button
16	* @var bool $show_header
17	* @var bool $show_line_numbers
18	* @var string $theme
19	* @var string $block_id (optional)
20	* @var string $widget_type (optional)
21	*/
22
23	use WPDeveloper\BetterDocs\Utils\Helper;
24
25	if ( empty( $responses ) \|\| ! is_array( $responses ) ) {
26	return;
27	}
28
29	// Drop entries with no code so empty tabs never render.
30	$responses = array_values( array_filter( $responses, function ( $r ) {
31	return is_array( $r ) && '' !== (string) ( isset( $r['code'] ) ? $r['code'] : '' );
32	} ) );
33
34	if ( empty( $responses ) ) {
35	return;
36	}
37
38	$snippet_id = isset( $block_id ) && $block_id ? $block_id : 'betterdocs-code-snippet-tab-' . wp_rand( 1000, 9999 );
39	$show_copy_button = isset( $show_copy_button ) ? $show_copy_button : true;
40	$show_header = isset( $show_header ) ? $show_header : true;
41	$show_line_numbers = isset( $show_line_numbers ) ? $show_line_numbers : false;
42	$theme = sanitize_text_field( isset( $theme ) ? $theme : 'light' );
43
44	$active = $responses[0];
45	$active_lang = sanitize_text_field( isset( $active['language'] ) ? $active['language'] : 'json' );
46
47	// First digit of the status → the `--Nxx` colour bucket (2xx green, 4xx red…).
48	$status_class = function ( $status ) {
49	$status = trim( (string) $status );
50	$digit = ( '' !== $status && ctype_digit( $status[0] ) ) ? $status[0] : '';
51	return '' !== $digit ? 'betterdocs-api-response--' . $digit . 'xx' : '';
52	};
53
54	wp_enqueue_script( 'betterdocs-code-snippet-tab' );
55	wp_enqueue_style( 'betterdocs-code-snippet-tab' );
56	?>
57
58	<div class="betterdocs-code-snippet-wrapper betterdocs-code-snippet-tab theme-<?php echo esc_attr( $theme ); ?> <?php echo esc_attr( $snippet_id ); ?> is-multi-tab"
59	id="<?php echo esc_attr( $snippet_id ); ?>"
60	data-language="<?php echo esc_attr( $active_lang ); ?>"
61	data-copy-button="<?php echo $show_copy_button ? 'true' : 'false'; ?>">
62
63	<?php if ( $show_header ) : ?>
64	<div class="betterdocs-code-snippet-header betterdocs-file-preview-header betterdocs-code-snippet-tab-header">
65	<div class="betterdocs-file-preview-left">
66	<div class="betterdocs-code-snippet-tabs" role="tablist">
67	<?php foreach ( $responses as $i => $response ) : ?>
68	<?php
69	$status = isset( $response['status'] ) ? (string) $response['status'] : '';
70	$s_class = $status_class( $status );
71	?>
72	<button type="button"
73	class="betterdocs-code-snippet-tab-item<?php echo 0 === $i ? ' is-active' : ''; ?> <?php echo esc_attr( $s_class ); ?>"
74	role="tab"
75	aria-selected="<?php echo 0 === $i ? 'true' : 'false'; ?>"
76	data-tab-index="<?php echo esc_attr( $i ); ?>">
77	<span class="betterdocs-code-snippet-tab-dot <?php echo esc_attr( $s_class ); ?>"></span>
78	<span class="betterdocs-code-snippet-tab-label"><?php echo esc_html( '' !== $status ? $status : ( $i + 1 ) ); ?></span>
79	</button>
80	<?php endforeach; ?>
81	</div>
82	</div>
83
84	<div class="betterdocs-file-preview-right">
85	<?php if ( $show_copy_button ) : ?>
86	<?php Helper::code_snippet_copy_button(); ?>
87	<?php endif; ?>
88	</div>
89	</div>
90	<?php endif; ?>
91
92	<div class="betterdocs-code-snippet-content">
93	<?php foreach ( $responses as $i => $response ) : ?>
94	<?php
95	$v_lang = sanitize_text_field( isset( $response['language'] ) ? $response['language'] : 'json' );
96	$v_code = (string) ( isset( $response['code'] ) ? $response['code'] : '' );
97	?>
98	<div class="betterdocs-code-snippet-panel<?php echo 0 === $i ? ' is-active' : ''; ?>"
99	data-tab-index="<?php echo esc_attr( $i ); ?>"
100	<?php echo 0 === $i ? '' : 'hidden'; ?>>
101	<?php if ( $show_line_numbers ) : ?>
102	<div class="betterdocs-code-snippet-line-numbers" aria-hidden="true">
103	<?php foreach ( range( 1, max( 1, substr_count( $v_code, "\n" ) + 1 ) ) as $line_num ) : ?>
104	<div class="line-number"><?php echo esc_html( $line_num ); ?></div>
105	<?php endforeach; ?>
106	</div>
107	<?php endif; ?>
108
109	<pre class="betterdocs-code-snippet-code language-<?php echo esc_attr( $v_lang ); ?>"><code><?php echo esc_html( $v_code ); ?></code></pre>
110	</div>
111	<?php endforeach; ?>
112	</div>
113	</div>
114
115	<?php if ( $show_copy_button ) : ?>
116	<script type="text/javascript">
117	document.addEventListener('DOMContentLoaded', function() {
118	const snippet = document.getElementById('<?php echo esc_js( $snippet_id ); ?>');
119	if (snippet && window.BetterDocsCodeSnippetTab) {
120	window.BetterDocsCodeSnippetTab.initCopyButton(snippet);
121	}
122	});
123	</script>
124	<?php endif; ?>
125