|
// +----------------------------------------------------------------------+
/**
* Base class for sidebar settigns of graph based charts.
*
* @category Visualizer
* @package Render
* @subpackage Sidebar
*
* @since 1.0.0
* @abstract
*/
abstract class Visualizer_Render_Sidebar_Google extends Visualizer_Render_Sidebar {
/**
* The array of available legend positions.
*
* @since 1.0.0
*
* @access protected
* @var array
*/
protected $_legendPositions;
/**
* The array of available alignments.
*
* @since 1.0.0
*
* @access protected
* @var array
*/
protected $_alignments;
/**
* The constructor.
*/
public function __construct( $data = array() ) {
$this->_library = 'google';
parent::__construct( $data );
$this->_legendPositions = array(
'' => esc_html__( 'Default', 'visualizer' ),
'left' => esc_html__( 'Left of the chart', 'visualizer' ),
'right' => esc_html__( 'Right of the chart', 'visualizer' ),
'top' => esc_html__( 'Above the chart', 'visualizer' ),
'bottom' => esc_html__( 'Below the chart', 'visualizer' ),
'none' => esc_html__( 'Omit the legend', 'visualizer' ),
);
$chart_type = $this->get_chart_type( false );
if ( ! in_array( $chart_type, array( 'Pie' ), true ) ) {
$this->_legendPositions['in'] = esc_html__( 'Inside the chart', 'visualizer' );
}
if ( in_array( $chart_type, array( 'Bubble' ), true ) ) {
unset( $this->_legendPositions['left'] );
}
$this->_alignments = array(
'' => '',
'start' => esc_html__( 'Aligned to the start of the allocated area', 'visualizer' ),
'center' => esc_html__( 'Centered in the allocated area', 'visualizer' ),
'end' => esc_html__( 'Aligned to the end of the allocated area', 'visualizer' ),
);
}
/**
* Registers additional hooks.
*
* @access protected
*/
protected function hooks() {
if ( $this->_library === 'google' ) {
add_filter( 'visualizer_assets_render', array( $this, 'load_google_assets' ), 10, 2 );
}
}
/**
* Loads the assets.
*/
public function load_google_assets( $deps, $is_frontend ) {
wp_register_script( 'google-jsapi', '//www.gstatic.com/charts/loader.js', array(), null, true );
wp_register_script( 'dom-to-image', VISUALIZER_ABSURL . 'js/lib/dom-to-image.min.js', array(), null, true );
wp_register_script(
'visualizer-render-google-lib',
VISUALIZER_ABSURL . 'js/render-google.js',
array(
'google-jsapi',
'dom-to-image',
),
Visualizer_Plugin::VERSION,
true
);
return array_merge(
$deps,
array( 'visualizer-render-google-lib' )
);
}
/**
* Enqueue assets.
*/
public static function enqueue_assets( $deps = array() ) {
wp_enqueue_script( 'visualizer-google-jsapi', '//www.gstatic.com/charts/loader.js', array(), null, true );
wp_enqueue_script( 'visualizer-render-google-lib', VISUALIZER_ABSURL . 'js/render-google.js', array_merge( $deps, array( 'visualizer-google-jsapi' ) ), Visualizer_Plugin::VERSION, true );
return 'visualizer-render-google-lib';
}
/**
* Renders the role field.
*
* @since 3.4.0
*
* @access protected
*/
protected function _renderRoleField( $index ) {
self::_renderSelectItem(
esc_html__( 'Special Role', 'visualizer' ),
'series[' . $index . '][role]',
isset( $this->series[ $index ]['role'] ) ? $this->series[ $index ]['role'] : '',
array(
'' => esc_html__( 'Default (Data)', 'visualizer' ),
'annotation' => esc_html__( 'Annotation', 'visualizer' ),
'annotationText' => esc_html__( 'Annotation Text', 'visualizer' ),
'certainty' => esc_html__( 'Certainty', 'visualizer' ),
'emphasis' => esc_html__( 'Emphasis', 'visualizer' ),
'scope' => esc_html__( 'Scope', 'visualizer' ),
'style' => esc_html__( 'Style', 'visualizer' ),
'tooltip' => esc_html__( 'Tooltip', 'visualizer' ),
'interval' => esc_html__( 'Interval', 'visualizer' ),
),
sprintf(
// translators: %1$s - HTML link tag, %2$s - HTML closing link tag, %3$s - HTML link tag, %4$s - HTML closing link tag
esc_html__( 'Determines whether the series has to be used for a special role as mentioned in %1$shere%2$s. You can view a few examples %3$shere%4$s.', 'visualizer' ),
'',
' ',
'',
' '
)
);
}
/**
* Renders chart general settings group.
*
* @since 1.0.0
*
* @access protected
*/
protected function _renderGeneralSettings() {
self::_renderGroupStart( esc_html__( 'General Settings', 'visualizer' ) );
self::_renderSectionStart();
self::_renderSectionDescription( esc_html__( 'Configure title, font styles, tooltip, legend and else settings for the chart.', 'visualizer' ) );
self::_renderSectionEnd();
self::_renderSectionStart( esc_html__( 'Title', 'visualizer' ), false );
$this->_renderChartTitleSettings();
self::_renderSectionEnd();
self::_renderSectionStart( esc_html__( 'Font Styles', 'visualizer' ), false );
echo '';
echo '
[?] ';
echo '
', esc_html__( 'Font Family And Size', 'visualizer' ), ' ';
echo '
';
echo '';
echo '';
echo '';
echo 'fontName, false ), '>';
echo $label;
echo ' ';
}
echo ' ';
echo ' ';
echo '';
echo '';
echo 'fontSize, false ), '>', $i, ' ';
}
echo ' ';
echo ' ';
echo ' ';
echo '
';
echo '
';
esc_html_e( 'The default font family and size for all text in the chart.', 'visualizer' );
echo '
';
echo '
';
echo '
[?] ';
echo '
', esc_html__( 'Width And Height Of Chart', 'visualizer' ), ' ';
echo '
';
echo '
';
esc_html_e( 'Determines the total width and height of the chart. This will only show in the front-end.', 'visualizer' );
echo '
';
echo '
';
self::_renderSectionDescription( esc_html__( 'Set the chart\'s background color, border width, and border color.', 'visualizer' ) );
self::_renderTextItem(
esc_html__( 'Stroke Width', 'visualizer' ),
'backgroundColor[strokeWidth]',
isset( $this->backgroundColor['strokeWidth'] ) ? $this->backgroundColor['strokeWidth'] : null,
esc_html__( 'The chart border width in pixels.', 'visualizer' ),
'0'
);
self::_renderColorPickerItem(
esc_html__( 'Stroke Color', 'visualizer' ),
'backgroundColor[stroke]',
! empty( $this->backgroundColor['stroke'] ) ? $this->backgroundColor['stroke'] : null,
'#666'
);
$background_color = ! empty( $this->backgroundColor['fill'] ) ? $this->backgroundColor['fill'] : null;
self::_renderColorPickerItem(
esc_html__( 'Background Color', 'visualizer' ),
'backgroundColor[fill]',
$background_color,
'#fff'
);
echo '';
echo '';
echo ' ';
echo '
';
self::_renderSectionEnd();
self::_renderSectionStart( esc_html__( 'Placement', 'visualizer' ), false );
self::_renderSectionDescription( esc_html__( 'Configure the placement and size of the chart area (where the chart itself is drawn, excluding axis and legends). Two formats are supported: a number, or a number followed by %. A simple number is a value in pixels; a number followed by % is a percentage.', 'visualizer' ) );
echo '';
echo '
[?] ';
echo '
', esc_html__( 'Left And Top Margins', 'visualizer' ), ' ';
echo '
';
echo '
';
esc_html_e( 'Determines how far to draw the chart from the left and top borders.', 'visualizer' );
echo '
';
echo '
';
echo '
[?] ';
echo '
', esc_html__( 'Width And Height Of Chart Area', 'visualizer' ), ' ';
echo '
';
echo '
';
esc_html_e( 'Determines the width and height of the chart area.', 'visualizer' );
echo '
';
echo '