| 1 |
<?php |
| 2 |
namespace WPDeveloper\BetterDocs\Editors\BlockEditor\Blocks; |
| 3 |
|
| 4 |
if ( ! defined( 'ABSPATH' ) ) { |
| 5 |
exit; |
| 6 |
} |
| 7 |
|
| 8 |
|
| 9 |
use WPDeveloper\BetterDocs\Editors\BlockEditor\Block; |
| 10 |
|
| 11 |
class CodeSnippet extends Block { |
| 12 |
|
| 13 |
protected $frontend_scripts = [ 'betterdocs-code-snippet' ]; |
| 14 |
protected $frontend_styles = [ 'betterdocs-code-snippet' ]; |
| 15 |
|
| 16 |
/** |
| 17 |
* Unique name of the block |
| 18 |
* @return string |
| 19 |
*/ |
| 20 |
public function get_name() { |
| 21 |
return 'code-snippet'; |
| 22 |
} |
| 23 |
|
| 24 |
/** |
| 25 |
* Block default attributes |
| 26 |
* @return array |
| 27 |
*/ |
| 28 |
public function get_default_attributes() { |
| 29 |
return [ |
| 30 |
'blockId' => '', |
| 31 |
'blockMeta' => (object) [], |
| 32 |
'resOption' => 'Desktop', |
| 33 |
'codeContent' => '', |
| 34 |
'language' => 'javascript', |
| 35 |
'showLanguageLabel' => true, |
| 36 |
'showCopyButton' => true, |
| 37 |
'showLineNumbers' => false, |
| 38 |
'theme' => 'light' |
| 39 |
]; |
| 40 |
} |
| 41 |
|
| 42 |
/** |
| 43 |
* Register scripts and styles |
| 44 |
*/ |
| 45 |
public function register_scripts() { |
| 46 |
$this->assets_manager->register( 'betterdocs-code-snippet', 'public/css/code-snippet.css' ); |
| 47 |
$this->assets_manager->register( 'betterdocs-code-snippet', 'public/js/code-snippet.js', [ 'wp-element' ] ); |
| 48 |
|
| 49 |
// Enqueue CodeMirror for Gutenberg editor |
| 50 |
if ( is_admin() ) { |
| 51 |
add_action( 'enqueue_block_editor_assets', [ $this, 'enqueue_editor_assets' ], 5 ); |
| 52 |
add_action( 'admin_enqueue_scripts', [ $this, 'enqueue_editor_assets' ], 5 ); |
| 53 |
} |
| 54 |
} |
| 55 |
|
| 56 |
/** |
| 57 |
* Enqueue CodeMirror assets for the block editor |
| 58 |
*/ |
| 59 |
public function enqueue_editor_assets() { |
| 60 |
// Only enqueue on block editor pages |
| 61 |
$screen = get_current_screen(); |
| 62 |
if ( ! $screen || ( $screen->base !== 'post' && $screen->base !== 'site-editor' ) ) { |
| 63 |
return; |
| 64 |
} |
| 65 |
|
| 66 |
// Enqueue WordPress CodeMirror with basic settings |
| 67 |
if ( function_exists( 'wp_enqueue_code_editor' ) ) { |
| 68 |
wp_enqueue_code_editor( [ |
| 69 |
'type' => 'text/html' |
| 70 |
] ); |
| 71 |
} |
| 72 |
|
| 73 |
// Enqueue frontend assets for syntax highlighting in editor preview |
| 74 |
wp_enqueue_style( 'betterdocs-code-snippet' ); |
| 75 |
wp_enqueue_script( 'betterdocs-code-snippet' ); |
| 76 |
} |
| 77 |
|
| 78 |
/** |
| 79 |
* Check if we're in editor mode |
| 80 |
* @return bool |
| 81 |
*/ |
| 82 |
public function is_editor_mode() { |
| 83 |
// phpcs:ignore WordPress.Security.NonceVerification.Recommended -- REST request context check. |
| 84 |
$context = isset( $_REQUEST['context'] ) ? sanitize_text_field( wp_unslash( $_REQUEST['context'] ) ) : ''; |
| 85 |
return defined( 'REST_REQUEST' ) && REST_REQUEST && 'edit' === $context; |
| 86 |
} |
| 87 |
|
| 88 |
/** |
| 89 |
* Render the block |
| 90 |
* @param array $attributes |
| 91 |
* @param string $content |
| 92 |
*/ |
| 93 |
public function render( $attributes, $content ) { |
| 94 |
// Use the template with view_params |
| 95 |
$this->views( 'templates/parts/code-snippet' ); |
| 96 |
} |
| 97 |
|
| 98 |
/** |
| 99 |
* View parameters for the template |
| 100 |
* @return array |
| 101 |
*/ |
| 102 |
public function view_params() { |
| 103 |
$attributes = &$this->attributes; |
| 104 |
|
| 105 |
return [ |
| 106 |
'code_content' => $attributes['codeContent'], |
| 107 |
'language' => $attributes['language'], |
| 108 |
'show_language_label' => $attributes['showLanguageLabel'], |
| 109 |
'show_copy_button' => $attributes['showCopyButton'], |
| 110 |
'show_copy_tooltip' => isset( $attributes['showCopyTooltip'] ) ? $attributes['showCopyTooltip'] : false, |
| 111 |
'show_header' => isset( $attributes['showHeader'] ) ? $attributes['showHeader'] : true, |
| 112 |
'show_line_numbers' => $attributes['showLineNumbers'], |
| 113 |
'theme' => $attributes['theme'], |
| 114 |
'block_id' => $attributes['blockId'], |
| 115 |
'widget_type' => 'blocks', |
| 116 |
'is_editor_mode' => $this->is_editor_mode(), |
| 117 |
// File Preview Header |
| 118 |
'file_name' => isset( $attributes['fileName'] ) ? $attributes['fileName'] : 'filename.js', |
| 119 |
'show_traffic_lights' => isset( $attributes['showTrafficLights'] ) ? $attributes['showTrafficLights'] : true, |
| 120 |
'show_file_icon' => isset( $attributes['showFileIcon'] ) ? $attributes['showFileIcon'] : true, |
| 121 |
'file_icon' => isset( $attributes['fileIcon'] ) ? $attributes['fileIcon'] : '', |
| 122 |
]; |
| 123 |
} |
| 124 |
} |
| 125 |
|