Skip to content

Commit

Permalink
WP Editor shortcode UI
Browse files Browse the repository at this point in the history 
See #32
  • Loading branch information
@JoryHogeveen
JoryHogeveen committed Aug 29, 2017
1 parent cb17f79 commit 9d5bc11
Show file tree
Hide file tree
Showing 4 changed files with 946 additions and 6 deletions.
238 changes: 238 additions & 0 deletions includes/class-editor-shortcode-generator.php
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,238 @@
<?php
/**
* Off-Canvas Sidebars plugin shortcode generator
*
* Shortcode generator
* @author Jory Hogeveen <[email protected]>
* @package off-canvas-sidebars
* @version 0.4
*/

if ( ! defined( 'ABSPATH' ) ) {
die();
}

final class OCS_Off_Canvas_Sidebars_Editor_Shortcode_Generator
{
/**
* The single instance of the class.
*
* @var OCS_Off_Canvas_Sidebars_Editor_Shortcode_Generator
* @since 0.4
*/
protected static $_instance = null;

private $settings = array();

/**
* This class gets called in the init hook
*
* @since 0.4
* @access private
*/
private function __construct() {
// check user permissions
/*if ( !current_user_can( 'edit_posts' ) && !current_user_can( 'edit_pages' ) ) {
return;
}*/

if ( 'true' === get_user_option( 'rich_editing' ) ) {
//add_action( 'admin_init', array( $this, 'load_plugin_data' ) );
$this->load_plugin_data();
add_action( 'media_buttons', array( $this, 'media_buttons' ), 20 );
add_filter( 'mce_external_plugins', array( $this, 'mce_external_plugins' ) );
add_filter( 'tiny_mce_before_init', array( $this, 'mce_inline_css' ) );
add_action( 'after_wp_tiny_mce', array( $this, 'print_scripts' ) );
}
}

/**
* Get plugin defaults
* @since 0.4
*/
function load_plugin_data() {
$this->settings = off_canvas_sidebars()->get_settings();
}

/**
* Show our own button
* @since 0.4
* @param string $editor_id The Editor ID.
*/
function media_buttons( $editor_id ) {
//dashicons-move dashicons-editor-code
?><button type="button" class="ocs-shortcode-generator button hidden" data-editor="<?php echo esc_attr( $editor_id ) ?>">
<span class="dashicons dashicons-editor-contract" style="vertical-align: text-top; margin: -1px 0 -1px -2px; color: #82878c;"></span>
<?php _e( 'Off-Canvas trigger', 'off-canvas-sidebars' ) ?>
</button><?php

}

/**
* Add our tinyMCE plugin to the list
*
* @since 0.4
* @param array $plugin_array
* @return array
*/
function mce_external_plugins( $plugin_array ) {
$plugin_array['off_canvas_sidebars'] = OCS_PLUGIN_URL . 'js/mce-plugin-shortcode.js';
return $plugin_array;
}

/**
* Add our tinyMCE styles
*
* @since 0.4
* @param $init_array
* @return array
*/
function mce_inline_css( $init_array ) {

$styles = '.mceItem.ocsTrigger { border: 1px dashed #0073aa; display: inline-block; } ';
$styles .= 'img.mceItem.ocsTrigger { padding: 5px; } ';
$styles .= '.mceItem.ocsTrigger img { margin: 5px; } ';

if ( isset( $init_array['content_style'] ) ) {
$init_array['content_style'] .= ' ' . $styles . ' ';
} else {
$init_array['content_style'] = $styles . ' ';
}

return $init_array;
}

/**
* Print our scripts
* @since 0.4
* @see after_wp_tiny_mce hook
*/
function print_scripts() {
static $done = false;

if ( ! $done ) {
$done = true;

$sidebars = array();
foreach ( $this->settings['sidebars'] as $sidebar_id => $sidebar_data ) {
if ( empty( $sidebar_data['enable'] ) ) {
continue;
}
$label = $sidebar_id;
if ( ! empty( $sidebar_data['label'] ) ) {
$label = $sidebar_data['label'] . ' (' . $sidebar_id . ')';
}
$sidebars[] = array(
'text' => $label,
'value' => $sidebar_id,
);
}

$elements = array( 'button', 'span', 'a', 'b', 'strong', 'i', 'em', 'img', 'div' );
$element_values = array();
foreach ( $elements as $e ) {
$element_values[] = array(
'text' => '<' . $e . '>',
'value' => $e,
);
}

$fields = array(
'id' => array(
'type' => 'listbox',
'name' => 'id',
'label' => __( 'Sidebar ID', 'off-canvas-sidebars' ),
'value' => '',
'values' => $sidebars,
'tooltip' => __( '(Required) The off-canvas sidebar ID', 'off-canvas-sidebars' ),
),
'text' => array(
'type' => 'textbox',
'name' => 'text',
'label' => __( 'Text', 'off-canvas-sidebars' ),
'value' => '',
'tooltip' => __( 'Limited HTML allowed', 'off-canvas-sidebars' ),
'multiline' => true,
),
'optional_container' => array(
'type' => 'container',
'html' => '<b style="font-weight: 600 !important;">' . __( 'Optional options', 'off-canvas-sidebars' ) . ':</b>',
),
'action' => array(
'type' => 'listbox',
'name' => 'action',
'label' => __( 'Trigger action', 'off-canvas-sidebars' ),
'value' => '',
'values' => array(
array(
'text' => __( 'Toggle', 'off-canvas-sidebars' ) . ' (' . __( 'Default', 'off-canvas-sidebars' ) . ')',
'value' => '',
),
array( 'text' => __( 'Open', 'off-canvas-sidebars' ), 'value' => 'open' ),
array( 'text' => __( 'Close', 'off-canvas-sidebars' ), 'value' => 'close' ),
),
//'tooltip' => __( 'The trigger action. Default: toggle', 'off-canvas-sidebars' ),
),
'element' => array(
'type' => 'listbox',
'name' => 'element',
'label' => __( 'HTML element', 'off-canvas-sidebars' ),
'value' => '',
'values' => $element_values,
'tooltip' => __( 'Choose wisely', 'off-canvas-sidebars' ),
),
'class' => array(
'type' => 'textbox',
'name' => 'class',
'label' => __( 'Extra classes', 'off-canvas-sidebars' ),
'value' => '',
'tooltip' => __( 'Separate multiple classes with a space', 'off-canvas-sidebars' ),
),
'attr' => array(
'type' => 'textbox',
'name' => 'attr',
'label' => __( 'Custom attributes', 'off-canvas-sidebars' ),
'value' => '',
'tooltip' => __( 'key : value ; key : value', 'off-canvas-sidebars' ),
'multiline' => true,
),
'nested' => array(
'type' => 'checkbox',
'name' => 'nested',
'label' => __( 'Nested shortcode', 'off-canvas-sidebars' ) . '?',
'value' => '',
'tooltip' => __( '[ocs_trigger text="Your text"] or [ocs_trigger]Your text[/ocs_trigger]', 'off-canvas-sidebars' ),
),
);

?>
<script type="text/javascript" id="ocs-mce-settings">
var ocsMceSettings = {
prefix: '<?php echo $this->settings['css_prefix'] ?>',
title: '<?php _e( 'Off-Canvas Sidebars - Trigger Control Shortcode', 'off-canvas-sidebars' ) ?>',
fields: <?php echo wp_json_encode( $fields ); ?>,
elements: <?php echo wp_json_encode( $elements ); ?>,
render: <?php echo ( $this->settings['wp_editor_shortcode_rendering'] ) ? 'true' : 'false'; ?>
};
</script>
<?php
} // End if().
}

/**
* Main Off-Canvas Sidebars Shortcode Generator Instance.
*
* Ensures only one instance of this class is loaded or can be loaded.
*
* @since 0.4
* @static
* @return OCS_Off_Canvas_Sidebars_Editor_Shortcode_Generator
*/
public static function get_instance() {
if ( is_null( self::$_instance ) ) {
self::$_instance = new self();
}
return self::$_instance;
}

} // End class
25 changes: 20 additions & 5 deletions includes/class-settings.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -348,6 +348,19 @@ private function register_general_settings() {
),
)
);

add_settings_field(
'wp_editor_shortcode_rendering',
esc_attr__( 'Enable shortcode UI for the WordPress Editor?', 'off-canvas-sidebars' ),
array( $this, 'checkbox_option' ),
$this->settings_tab,
'section_admin',
array(
'name' => 'wp_editor_shortcode_rendering',
'label' => __( 'Yes', 'off-canvas-sidebars' ) . ' (<a href="https://github.com/JoryHogeveen/off-canvas-sidebars/issues/32" target="_blank">' . __( 'Experimental', 'off-canvas-sidebars' ) . '</a>)',
'description' => __( 'This will render the shortcodes to actual HTML elements in the WP Editor.', 'off-canvas-sidebars' ),
)
);
}

/**
Expand Down Expand Up @@ -614,11 +627,12 @@ protected function parse_input( $input ) {
unset( $input['sidebars']['ocs_add_new'] );

if ( $this->post_tab === $this->settings_tab ) {
$input['enable_frontend'] = $this->validate_numeric_boolean( $input, 'enable_frontend' );
$input['site_close'] = $this->validate_numeric_boolean( $input, 'site_close' );
$input['hide_control_classes'] = $this->validate_numeric_boolean( $input, 'hide_control_classes' );
$input['scroll_lock'] = $this->validate_numeric_boolean( $input, 'scroll_lock' );
$input['use_fastclick'] = $this->validate_numeric_boolean( $input, 'use_fastclick' );
$input['enable_frontend'] = $this->validate_numeric_boolean( $input, 'enable_frontend' );
$input['site_close'] = $this->validate_numeric_boolean( $input, 'site_close' );
$input['hide_control_classes'] = $this->validate_numeric_boolean( $input, 'hide_control_classes' );
$input['scroll_lock'] = $this->validate_numeric_boolean( $input, 'scroll_lock' );
$input['use_fastclick'] = $this->validate_numeric_boolean( $input, 'use_fastclick' );
$input['wp_editor_shortcode_rendering'] = $this->validate_numeric_boolean( $input, 'wp_editor_shortcode_rendering' );
}

// Handle existing sidebars.
Expand Down Expand Up @@ -722,6 +736,7 @@ public function validate_input( $input ) {
$output['hide_control_classes'] = $this->validate_checkbox( $output['hide_control_classes'] );
$output['scroll_lock'] = $this->validate_checkbox( $output['scroll_lock'] );
$output['use_fastclick'] = $this->validate_checkbox( $output['use_fastclick'] );
$output['wp_editor_shortcode_rendering'] = $this->validate_checkbox( $output['wp_editor_shortcode_rendering'] );

// Numeric values, not integers!
$output['disable_over'] = $this->validate_numeric( $output['disable_over'] );
Expand Down
Loading

0 comments on commit 9d5bc11

Please sign in to comment.