103 lines
3.7 KiB
PHP
103 lines
3.7 KiB
PHP
<?php
|
|
|
|
//Settings
|
|
$text = ($type == 'php') ? $settings['text'] : '{{{settings.text}}}';
|
|
$show_percents = ($type == 'php') ? $settings['show_percents'] : '{{{settings.show_percents}}}';
|
|
$value = ($type == 'php') ? $settings['value'] : '{{{settings.value}}}';
|
|
$round = ($type == 'php') ? $settings['round'] : '{{{settings.round}}}';
|
|
$circle = ($type == 'php') ? $settings['circle'] : '{{{settings.circle}}}';
|
|
$padding = ($type == 'php') ? $settings['padding'] : '{{{settings.padding}}}';
|
|
$widget_width = ($type == 'php') ? $settings['widget_width'] : '{{{settings.widget_width}}}';
|
|
$thickness = ($type == 'php') ? $settings['thickness'] : '{{{settings.thickness}}}';
|
|
$line_color = ($type == 'php') ? $settings['line_color'] : '{{{settings.line_color}}}';
|
|
$background_color = ($type == 'php') ? $settings['background_color'] : '{{{settings.background_color}}}';
|
|
|
|
//=======================RENDER TYPE=======================
|
|
$js_settings = '';
|
|
|
|
//-----------PHP-----------
|
|
if ( $type == 'php' ) {
|
|
$options = [
|
|
'min' => 0,
|
|
'max' => 100,
|
|
'value' => isset($value['size']) ? $value['size'] : $value,
|
|
'text' => ($show_percents == 'yes' ? true : false),
|
|
'round' => ($round == 'yes' ? true : false),
|
|
'circle' => ($circle == 'yes' ? true : false),
|
|
'padding' => isset($padding['size']) ? $padding['size'] : $padding,
|
|
'radius' => ($widget_width['size'] / 2),
|
|
'thickness' => isset($thickness['size']) ? $thickness['size'] : $thickness,
|
|
'bg' => $background_color,
|
|
'color' => $line_color
|
|
];
|
|
|
|
$this->add_render_attribute( 'widget', [
|
|
'class' => [ 'stratum-circle-progress-bar' ]
|
|
] );
|
|
|
|
$this->add_render_attribute( 'wrapper', [
|
|
'class' => 'stratum-circle-progress-bar__wrapper',
|
|
'data-options' => json_encode( $options )
|
|
] );
|
|
//-----------/PHP-----------
|
|
|
|
}
|
|
//-----------JS (BACKBONE)-----------
|
|
elseif ( $type == 'js' ) {
|
|
?>
|
|
<#
|
|
const options = {
|
|
min: 0,
|
|
max: 100,
|
|
value: (settings.value.size != '' ? settings.value.size : 0),
|
|
text: (settings.show_percents == 'yes' ? true : false),
|
|
round: (settings.round == 'yes' ? true : false),
|
|
circle: (settings.circle == 'yes' ? true : false),
|
|
padding: settings.padding.size,
|
|
radius: (settings.widget_width.size / 2),
|
|
thickness: settings.thickness.size,
|
|
bg: settings.background_color,
|
|
color: settings.line_color
|
|
};
|
|
|
|
view.addRenderAttribute( 'widget', {
|
|
'class': [ 'stratum-circle-progress-bar' ]
|
|
} );
|
|
|
|
view.addRenderAttribute( 'wrapper', {
|
|
'class': [ 'stratum-circle-progress-bar__wrapper' ],
|
|
'data-options': JSON.stringify(options),
|
|
} );
|
|
#>
|
|
<?php
|
|
}
|
|
//-----------/JS (BACKBONE)-----------
|
|
|
|
//Render attr
|
|
$attr_widget = ($type == 'php') ? $this->get_render_attribute_string( 'widget' ) : "{{{ view.getRenderAttributeString( 'widget' ) }}}";
|
|
$attr_wrapper = ($type == 'php') ? $this->get_render_attribute_string( 'wrapper' ): "{{{ view.getRenderAttributeString( 'wrapper' ) }}}";
|
|
|
|
?>
|
|
|
|
<div <?php echo $attr_widget; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>>
|
|
<div <?php echo $attr_wrapper; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>>
|
|
<?php
|
|
if ( $show_percents != 'yes' ) {
|
|
if ( $type == 'php' ) {
|
|
if ( ! empty( $text ) ) {
|
|
?>
|
|
<span class="stratum-circle-progress-bar__title"><?php echo esc_html( $text ); ?></span>
|
|
<?php
|
|
}
|
|
} elseif ( $type == 'js' ) {
|
|
?>
|
|
<# if ( settings.show_percents == '' && settings.text != '' ) { #>
|
|
<span class="stratum-circle-progress-bar__title"><?php echo esc_html( $text ); ?></span>
|
|
<# } #>
|
|
<?php
|
|
}
|
|
}
|
|
?>
|
|
</div>
|
|
</div>
|