Skip to content

Commit

Permalink
Merge pull request #95 from westonruter/update/selected-symbol-names
Browse files Browse the repository at this point in the history 
Rename remaining references of "selected" to "highlighted"
  • Loading branch information
@westonruter
westonruter authored May 6, 2020
2 parents 9c21913 + 639c3ce commit adda4e2
Showing 1 changed file with 58 additions and 67 deletions.
125 changes: 58 additions & 67 deletions syntax-highlighting-code-block.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
* Plugin Name: Syntax-highlighting Code Block (with Server-side Rendering)
* Plugin URI: https://github.com/westonruter/syntax-highlighting-code-block
* Description: Extending the Code block with syntax highlighting rendered on the server, thus being AMP-compatible and having faster frontend performance.
* Version: 1.2-beta
* Version: 1.2-beta2
* Author: Weston Ruter
* Author URI: https://weston.ruter.net/
* License: GPL2
Expand All @@ -22,7 +22,7 @@
use WP_Customize_Manager;
use WP_Styles;

const PLUGIN_VERSION = '1.2-beta';
const PLUGIN_VERSION = '1.2-beta2';

const BLOCK_NAME = 'core/code';

Expand All @@ -34,7 +34,7 @@

const BLOCK_STYLE_FILTER = 'syntax_highlighting_code_block_style';

const SELECTED_LINE_BG_FILTER = 'syntax_highlighting_code_selected_line_bg';
const HIGHLIGHTED_LINE_BACKGROUND_COLOR_FILTER = 'syntax_highlighted_line_background_color';

const FRONTEND_STYLE_HANDLE = 'syntax-highlighting-code-block';

Expand All @@ -43,7 +43,6 @@
*
* @param float[] $rgb_array An array representing an RGB color.
* @param float $tint How much of a tint to apply; a number between 0 and 1.
*
* @return float[] The new color as an RGB array.
*/
function add_tint_to_rgb( $rgb_array, $tint ) {
Expand All @@ -57,10 +56,9 @@ function add_tint_to_rgb( $rgb_array, $tint ) {
/**
* Get the relative luminance of a color.
*
* @param float[] $rgb_array An array representing an RGB color.
*
* @link https://en.wikipedia.org/wiki/Relative_luminance
*
* @param float[] $rgb_array An array representing an RGB color.
* @return float A value between 0 and 100 representing the luminance of a color.
* The closer to to 100, the higher the luminance is; i.e. the lighter it is.
*/
Expand All @@ -74,7 +72,6 @@ function get_relative_luminance( $rgb_array ) {
* Check whether or not a given RGB array is considered a "dark theme."
*
* @param float[] $rgb_array The RGB array to test.
*
* @return bool True if the theme's background has a "dark" luminance.
*/
function is_dark_theme( $rgb_array ) {
Expand All @@ -85,7 +82,6 @@ function is_dark_theme( $rgb_array ) {
* Convert an RGB array to hexadecimal representation.
*
* @param float[] $rgb_array The RGB array to convert.
*
* @return string A hexadecimal representation.
*/
function get_hex_from_rgb( $rgb_array ) {
Expand All @@ -98,18 +94,17 @@ function get_hex_from_rgb( $rgb_array ) {
}

/**
* Get the default selected line background color.
* Get the default highlighted line background color.
*
* In a dark theme, the background color is decided by adding a 15% tint to the
* color.
*
* In a light theme, a default light blue is used.
*
* @param string $theme_name The theme name to get a color for.
*
* @return string A hexadecimal value.
*/
function get_default_line_bg_color( $theme_name ) {
function get_default_line_background_color( $theme_name ) {
require_highlight_php_functions();

$theme_rgb = \HighlightUtilities\getThemeBackgroundColor( $theme_name );
Expand All @@ -128,14 +123,14 @@ function get_default_line_bg_color( $theme_name ) {
*
* @return array
*/
function get_options() {
function get_plugin_options() {
$options = \get_option( OPTION_NAME, [] );

$theme_name = isset( $options['theme_name'] ) ? $options['theme_name'] : DEFAULT_THEME;
return array_merge(
[
'theme_name' => DEFAULT_THEME,
'selected_line_bg_color' => get_default_line_bg_color( $theme_name ),
'theme_name' => DEFAULT_THEME,
'highlighted_line_background_color' => get_default_line_background_color( $theme_name ),
],
$options
);
Expand All @@ -145,11 +140,14 @@ function get_options() {
* Get the single, specified plugin option.
*
* @param string $option_name The plugin option name.
*
* @return mixed
* @return string|null
*/
function get_option( $option_name ) {
return get_options()[ $option_name ];
function get_plugin_option( $option_name ) {
$options = get_plugin_options();
if ( array_key_exists( $option_name, $options ) ) {
return $options[ $option_name ];
}
return null;
}

/**
Expand Down Expand Up @@ -294,7 +292,7 @@ function register_styles( WP_Styles $styles ) {
*/
$style = apply_filters( BLOCK_STYLE_FILTER, DEFAULT_THEME );
} else {
$style = get_option( 'theme_name' );
$style = get_plugin_option( 'theme_name' );
}

$default_style_path = sprintf(
Expand Down Expand Up @@ -343,21 +341,21 @@ function get_styles( $attributes ) {
$added_inline_style = true;
}

if ( ! $added_highlighted_color_style && $attributes['highlightedLines'] ) {
if ( has_filter( SELECTED_LINE_BG_FILTER ) ) {
if ( ! $added_highlighted_color_style && ! empty( $attributes['highlightedLines'] ) ) {
if ( has_filter( HIGHLIGHTED_LINE_BACKGROUND_COLOR_FILTER ) ) {
/**
* Filters the background color of a selected line.
* Filters the background color of a highlighted line.
*
* This filter takes precedence over any settings set in the database as an option. Additionally, if this filter
* is provided, then a color selector will not be provided in Customizer.
*
* @param string $rgb_color An RGB hexadecimal (with the #) to be used as the background color of a selected line.
* @param string $rgb_color An RGB hexadecimal (with the #) to be used as the background color of a highlighted line.
*
* @since 1.1.5
*/
$line_color = apply_filters( SELECTED_LINE_BG_FILTER, get_default_line_bg_color( DEFAULT_THEME ) );
$line_color = apply_filters( HIGHLIGHTED_LINE_BACKGROUND_COLOR_FILTER, get_default_line_background_color( DEFAULT_THEME ) );
} else {
$line_color = get_option( 'selected_line_bg_color' );
$line_color = get_plugin_option( 'highlighted_line_background_color' );
}

$styles .= "<style>.hljs > mark.shcb-loc { background-color: $line_color; }</style>";
Expand Down Expand Up @@ -411,10 +409,6 @@ function render_block( $attributes, $content ) {
$added_classes .= ' shcb-line-numbers';
}

if ( $attributes['highlightedLines'] ) {
$added_classes .= ' shcb-selected-lines';
}

if ( $attributes['wrapLines'] ) {
$added_classes .= ' shcb-wrap-lines';
}
Expand All @@ -438,6 +432,10 @@ function render_block( $attributes, $content ) {
return preg_replace( '/(<pre[^>]*>)(<code)/', '$1<div>$2', $start_tags, 1 );
};

$render_output = function ( $attributes, $before, $content, $end_tags ) use ( $inject_classes ) {
return get_styles( $attributes ) . $inject_classes( $before, $attributes ) . $content . $end_tags;
};

/**
* Filters the list of languages that are used for auto-detection.
*
Expand All @@ -449,7 +447,7 @@ function render_block( $attributes, $content ) {
$highlighted = get_transient( $transient_key );

if ( ! DEVELOPMENT_MODE && $highlighted && isset( $highlighted['content'] ) ) {
return $inject_classes( $matches['before'], $highlighted['attributes'] ) . $highlighted['content'] . $end_tags;
return $render_output( $highlighted['attributes'], $matches['before'], $highlighted['content'], $end_tags );
}

try {
Expand Down Expand Up @@ -490,26 +488,21 @@ function render_block( $attributes, $content ) {
if ( $attributes['showLineNumbers'] || $attributes['highlightedLines'] ) {
require_highlight_php_functions();

$selected_lines = parse_selected_lines( $attributes['highlightedLines'] );
$lines = \HighlightUtilities\splitCodeIntoArray( $content );
$content = '';
$highlighted_lines = parse_highlighted_lines( $attributes['highlightedLines'] );
$lines = \HighlightUtilities\splitCodeIntoArray( $content );
$content = '';

// We need to wrap the line of code twice in order to let out `white-space: pre` CSS setting to be respected
// by our `table-row`.
foreach ( $lines as $i => $line ) {
$tag_name = in_array( $i, $selected_lines, true ) ? 'mark' : 'span';
$tag_name = in_array( $i, $highlighted_lines, true ) ? 'mark' : 'span';
$content .= "<$tag_name class='shcb-loc'><span>$line\n</span></$tag_name>";
}
}

set_transient( $transient_key, compact( 'content', 'attributes' ), MONTH_IN_SECONDS );

$matches['before'] = $inject_classes(
$matches['before'],
$attributes
);

return get_styles( $attributes ) . $matches['before'] . $content . $end_tags;
return $render_output( $attributes, $matches['before'], $content, $end_tags );
} catch ( Exception $e ) {
return sprintf(
'<!-- %s(%s): %s -->%s',
Expand All @@ -522,44 +515,42 @@ function render_block( $attributes, $content ) {
}

/**
* Parse the selected line syntax from the front-end and return an array of selected lines.
*
* @param string $selected_lines The selected line syntax.
* Parse the highlighted line syntax from the front-end and return an array of highlighted line numbers.
*
* @param string $highlighted_lines The highlighted line syntax.
* @return int[]
*/
function parse_selected_lines( $selected_lines ) {
$highlighted_lines = [];
function parse_highlighted_lines( $highlighted_lines ) {
$highlighted_line_numbers = [];

if ( ! $selected_lines || empty( trim( $selected_lines ) ) ) {
return $highlighted_lines;
if ( ! $highlighted_lines || empty( trim( $highlighted_lines ) ) ) {
return $highlighted_line_numbers;
}

$ranges = explode( ',', preg_replace( '/\s/', '', $selected_lines ) );
$ranges = explode( ',', preg_replace( '/\s/', '', $highlighted_lines ) );

foreach ( $ranges as $chunk ) {
if ( strpos( $chunk, '-' ) !== false ) {
$range = explode( '-', $chunk );

if ( count( $range ) === 2 ) {
for ( $i = (int) $range[0]; $i <= (int) $range[1]; $i++ ) {
$highlighted_lines[] = $i - 1;
$highlighted_line_numbers[] = $i - 1;
}
}
} else {
$highlighted_lines[] = (int) $chunk - 1;
$highlighted_line_numbers[] = (int) $chunk - 1;
}
}

return $highlighted_lines;
return $highlighted_line_numbers;
}

/**
* Validate the given stylesheet name against available stylesheets.
*
* @param WP_Error $validity Validator object.
* @param string $input Incoming theme name.
*
* @return mixed
*/
function validate_theme_name( $validity, $input ) {
Expand All @@ -580,7 +571,7 @@ function validate_theme_name( $validity, $input ) {
* @param WP_Customize_Manager $wp_customize The Customizer object.
*/
function customize_register( $wp_customize ) {
if ( has_filter( BLOCK_STYLE_FILTER ) && has_filter( SELECTED_LINE_BG_FILTER ) ) {
if ( has_filter( BLOCK_STYLE_FILTER ) && has_filter( HIGHLIGHTED_LINE_BACKGROUND_COLOR_FILTER ) ) {
return;
}

Expand Down Expand Up @@ -611,9 +602,9 @@ function customize_register( $wp_customize ) {
);
}

if ( ! has_filter( SELECTED_LINE_BG_FILTER ) ) {
if ( ! has_filter( HIGHLIGHTED_LINE_BACKGROUND_COLOR_FILTER ) ) {
$wp_customize->add_setting(
'syntax_highlighting[selected_line_bg_color]',
'syntax_highlighting[highlighted_line_background_color]',
[
'type' => 'option',
'sanitize_callback' => 'sanitize_hex_color',
Expand All @@ -622,12 +613,12 @@ function customize_register( $wp_customize ) {
$wp_customize->add_control(
new \WP_Customize_Color_Control(
$wp_customize,
'syntax_highlighting[selected_line_bg_color]',
'syntax_highlighting[highlighted_line_background_color]',
[
'section' => 'colors',
'settings' => 'syntax_highlighting[selected_line_bg_color]',
'settings' => 'syntax_highlighting[highlighted_line_background_color]',
'label' => __( 'Highlighted Line Color', 'syntax-highlighting-code-block' ),
'description' => __( 'The background color of a selected line.', 'syntax-highlighting-code-block' ),
'description' => __( 'The background color of a highlighted line.', 'syntax-highlighting-code-block' ),
]
)
);
Expand All @@ -636,19 +627,19 @@ function customize_register( $wp_customize ) {
add_action( 'customize_register', __NAMESPACE__ . '\customize_register' );

/**
* Override the post value for the selected line background color when the theme has been selected.
* Override the post value for the highlighted line background color when the theme has been highlighted.
*
* This is an unfortunate workaround for the Customizer not respecting dynamic updates to the default setting value.
*
* @todo What's missing is dynamically changing the default value of the selected_line_bg_color control based on the selected theme.
* @todo What's missing is dynamically changing the default value of the highlighted_line_background_color control based on the selected theme.
*
* @param \WP_Customize_Manager $wp_customize Customize manager.
* @param WP_Customize_Manager $wp_customize Customize manager.
*/
function override_selected_line_bg_color_post_value( \WP_Customize_Manager $wp_customize ) {
$selected_line_bg_color_setting = $wp_customize->get_setting( 'syntax_highlighting[selected_line_bg_color]' );
if ( $selected_line_bg_color_setting && ! $selected_line_bg_color_setting->post_value() ) {
$selected_line_bg_color_setting->default = get_default_line_bg_color( get_option( 'theme_name' ) ); // This has no effect.
$wp_customize->set_post_value( $selected_line_bg_color_setting->id, $selected_line_bg_color_setting->default );
function override_highlighted_line_background_color_post_value( WP_Customize_Manager $wp_customize ) {
$highlighted_line_background_color_setting = $wp_customize->get_setting( 'syntax_highlighting[highlighted_line_background_color]' );
if ( $highlighted_line_background_color_setting && ! $highlighted_line_background_color_setting->post_value() ) {
$highlighted_line_background_color_setting->default = get_default_line_background_color( get_plugin_option( 'theme_name' ) ); // This has no effect.
$wp_customize->set_post_value( $highlighted_line_background_color_setting->id, $highlighted_line_background_color_setting->default );
}
}
add_action( 'customize_preview_init', __NAMESPACE__ . '\override_selected_line_bg_color_post_value' );
add_action( 'customize_preview_init', __NAMESPACE__ . '\override_highlighted_line_background_color_post_value' );

0 comments on commit adda4e2

Please sign in to comment.