landing-klikaset/wp-content/plugins/stratum/includes/templates/circle-progress-bar.php

103 lines
3.7 KiB
PHP
Raw Normal View History

2024-05-06 11:04:37 +07:00
<?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>