Why Gemfury? Push, build, and install  RubyGems npm packages Python packages Maven artifacts PHP packages Go Modules Bower components Debian packages RPM packages NuGet packages

jsarnowski / jsarnowski/jet-elements   php

Repository URL to install this package:

Version: 2.5.6 

/ jet-circle-progress / global / circle.php

<?php
/**
 * SVG circle template
 */

$settings   = $this->get_settings_for_display();
$size       = is_array( $settings['circle_size'] ) ? $settings['circle_size']['size'] : $settings['circle_size'];
$radius     = $size / 2;
$center     = $radius;
$viewbox    = sprintf( '0 0 %1$s %1$s', $size );
$val_stroke = is_array( $settings['value_stroke'] ) ? $settings['value_stroke']['size'] : $settings['value_stroke'];
$bg_stroke  = is_array( $settings['bg_stroke'] ) ? $settings['bg_stroke']['size'] : $settings['bg_stroke'];

// Fix radius relative to stroke
$max    = ( $val_stroke >= $bg_stroke ) ? $val_stroke : $bg_stroke;
$radius = $radius - ( $max / 2 );

$value = 0;

if ( 'percent' === $settings['values_type'] ) {
	$value = $settings['percent_value']['size'];
} elseif ( 0 !== absint( $settings['absolute_value_max'] ) ) {

	$curr  = $settings['absolute_value_curr'];
	$max   = $settings['absolute_value_max'];
	$value = round( ( ( absint( $curr ) * 100 ) / absint( $max ) ), 0 );
}

$circumference = 2 * M_PI * $radius;

$meter_stroke = ( 'color' === $settings['bg_stroke_type'] ) ? $settings['val_bg_color'] : 'url(#circle-progress-meter-gradient-' . $this->get_id() . ')';
$value_stroke = ( 'color' === $settings['val_stroke_type'] ) ? $settings['val_stroke_color'] : 'url(#circle-progress-value-gradient-' . $this->get_id() . ')';

// Tablet size data.
$tablet_size    = is_array( $settings['circle_size_tablet'] ) ? $settings['circle_size_tablet']['size'] : $settings['circle_size_tablet'];
$tablet_size    = ! empty( $tablet_size ) ? $tablet_size : $size;
$tablet_viewbox = sprintf( '0 0 %1$s %1$s', $tablet_size );
$tablet_center  = $tablet_size / 2;

$tablet_val_stroke = is_array( $settings['value_stroke_tablet'] ) ? $settings['value_stroke_tablet']['size'] : $settings['value_stroke_tablet'];
$tablet_val_stroke = ! empty( $tablet_val_stroke ) ? $tablet_val_stroke : $val_stroke;
$tablet_bg_stroke  = is_array( $settings['bg_stroke_tablet'] ) ? $settings['bg_stroke_tablet']['size'] : $settings['bg_stroke_tablet'];
$tablet_bg_stroke  = ! empty( $tablet_bg_stroke ) ? $tablet_bg_stroke : $bg_stroke;

$tablet_max    = ( $tablet_val_stroke >= $tablet_bg_stroke ) ? $tablet_val_stroke : $tablet_bg_stroke;
$tablet_radius = ( $tablet_size / 2 ) - ( $tablet_max / 2 );

$tablet_circumference = 2 * M_PI * $tablet_radius;

// Mobile size data.
$mobile_size    = is_array( $settings['circle_size_mobile'] ) ? $settings['circle_size_mobile']['size'] : $settings['circle_size_mobile'];
$mobile_size    = ! empty( $mobile_size ) ? $mobile_size : $tablet_size;
$mobile_viewbox = sprintf( '0 0 %1$s %1$s', $mobile_size );
$mobile_center  = $mobile_size / 2;

$mobile_val_stroke = is_array( $settings['value_stroke_mobile'] ) ? $settings['value_stroke_mobile']['size'] : $settings['value_stroke_mobile'];
$mobile_val_stroke = ! empty( $mobile_val_stroke ) ? $mobile_val_stroke : $tablet_val_stroke;
$mobile_bg_stroke  = is_array( $settings['bg_stroke_mobile'] ) ? $settings['bg_stroke_mobile']['size'] : $settings['bg_stroke_mobile'];
$mobile_bg_stroke  = ! empty( $mobile_bg_stroke ) ? $mobile_bg_stroke : $tablet_bg_stroke;

$mobile_max    = ( $mobile_val_stroke >= $mobile_bg_stroke ) ? $mobile_val_stroke : $mobile_bg_stroke;
$mobile_radius = ( $mobile_size / 2 ) - ( $mobile_max / 2 );

$mobile_circumference = 2 * M_PI * $mobile_radius;

$responsive_sizes = array(
	'desktop' => array(
		'size'          => $size,
		'viewBox'       => $viewbox,
		'center'        => $center,
		'radius'        => $radius,
		'valStroke'     => $val_stroke,
		'bgStroke'      => $bg_stroke,
		'circumference' => $circumference,
	),
	'tablet' => array(
		'size'          => $tablet_size,
		'viewBox'       => $tablet_viewbox,
		'center'        => $tablet_center,
		'radius'        => $tablet_radius,
		'valStroke'     => $tablet_val_stroke,
		'bgStroke'      => $tablet_bg_stroke,
		'circumference' => $tablet_circumference,
	),
	'mobile' => array(
		'size'          => $mobile_size,
		'viewBox'       => $mobile_viewbox,
		'center'        => $mobile_center,
		'radius'        => $mobile_radius,
		'valStroke'     => $mobile_val_stroke,
		'bgStroke'      => $mobile_bg_stroke,
		'circumference' => $mobile_circumference,
	),
);

$val_bg_gradient_angle     = ! empty( $settings['val_bg_gradient_angle'] ) ? $settings['val_bg_gradient_angle'] : 0;
$val_stroke_gradient_angle = ! empty( $settings['val_stroke_gradient_angle'] ) ? $settings['val_stroke_gradient_angle'] : 0;

?>
<svg class="circle-progress" width="<?php echo $size; ?>" height="<?php echo $size; ?>" viewBox="<?php echo $viewbox; ?>" data-radius="<?php echo $radius; ?>" data-circumference="<?php echo $circumference; ?>" data-responsive-sizes="<?php echo esc_attr( json_encode( $responsive_sizes ) ); ?>">
	<linearGradient id="circle-progress-meter-gradient-<?php echo $this->get_id(); ?>" gradientUnits="objectBoundingBox" gradientTransform="rotate(<?php echo $val_bg_gradient_angle; ?> 0.5 0.5)" x1="-0.25" y1="0.5" x2="1.25" y2="0.5">
		<stop offset="0%" stop-color="<?php echo $settings['val_bg_gradient_color_a']; ?>"/>
		<stop offset="100%" stop-color="<?php echo $settings['val_bg_gradient_color_b']; ?>"/>
	</linearGradient>
	<linearGradient id="circle-progress-value-gradient-<?php echo $this->get_id(); ?>" gradientUnits="objectBoundingBox" gradientTransform="rotate(<?php echo $val_stroke_gradient_angle; ?> 0.5 0.5)" x1="-0.25" y1="0.5" x2="1.25" y2="0.5">
		<stop offset="0%" stop-color="<?php echo $settings['val_stroke_gradient_color_a']; ?>"/>
		<stop offset="100%" stop-color="<?php echo $settings['val_stroke_gradient_color_b']; ?>"/>
	</linearGradient>
	<circle
		class="circle-progress__meter"
		cx="<?php echo $center; ?>"
		cy="<?php echo $center; ?>"
		r="<?php echo $radius; ?>"
		stroke="<?php echo $meter_stroke; ?>"
		stroke-width="<?php echo $bg_stroke; ?>"
		fill="none"
	/>
	<circle
		class="circle-progress__value"
		cx="<?php echo $center; ?>"
		cy="<?php echo $center; ?>"
		r="<?php echo $radius; ?>"
		stroke="<?php echo $value_stroke; ?>"
		stroke-width="<?php echo $val_stroke; ?>"
		data-value="<?php echo $value; ?>"
		style="stroke-dasharray: <?php echo $circumference; ?>; stroke-dashoffset: <?php echo $circumference; ?>;"
		fill="none"
	/>
</svg>