129 lines
4.4 KiB
PHP
129 lines
4.4 KiB
PHP
<?php
|
|
/*
|
|
|
|
# Usage -
|
|
array(
|
|
'type' => 'radio_image_box',
|
|
'options' => array(
|
|
'image-1' => plugins_url('../assets/images/patterns/01.png',__FILE__),
|
|
'image-2' => plugins_url('../assets/images/patterns/12.png',__FILE__),
|
|
),
|
|
'useextension' => false, // if false it will use key as value instead file name. Eg - "image-1" instead "01.png"
|
|
'css' => array(
|
|
'width' => '40px',
|
|
'height' => '35px',
|
|
'background-repeat' => 'repeat',
|
|
'background-size' => 'cover'
|
|
),
|
|
)
|
|
|
|
*/
|
|
if(!class_exists('Ultimate_Radio_Image_Param'))
|
|
{
|
|
class Ultimate_Radio_Image_Param
|
|
{
|
|
function __construct()
|
|
{
|
|
if(defined('WPB_VC_VERSION') && version_compare(WPB_VC_VERSION, 4.8) >= 0) {
|
|
if(function_exists('vc_add_shortcode_param'))
|
|
{
|
|
vc_add_shortcode_param('radio_image_box' , array(&$this, 'radio_image_settings_field' ) );
|
|
}
|
|
}
|
|
else {
|
|
if(function_exists('add_shortcode_param'))
|
|
{
|
|
add_shortcode_param('radio_image_box' , array(&$this, 'radio_image_settings_field' ) );
|
|
}
|
|
}
|
|
}
|
|
|
|
function radio_image_settings_field($settings, $value)
|
|
{
|
|
$default_css = array(
|
|
'width' => '25px',
|
|
'height' => '25px',
|
|
'background-repeat' => 'repeat',
|
|
'background-size' => 'cover'
|
|
);
|
|
$dependency = '';
|
|
$param_name = isset($settings['param_name']) ? $settings['param_name'] : '';
|
|
$type = isset($settings['type']) ? $settings['type'] : '';
|
|
$options = isset($settings['options']) ? $settings['options'] : '';
|
|
$css = isset($settings['css']) ? $settings['css'] : $default_css;
|
|
$class = isset($settings['class']) ? $settings['class'] : '';
|
|
$useextension = (isset($settings['useextension']) && $settings['useextension'] != '' ) ? $settings['useextension'] : 'true';
|
|
$default = isset($settings['default']) ? $settings['default'] : 'transperant';
|
|
|
|
$uni = uniqid();
|
|
|
|
$output = '';
|
|
$output = '<input id="radio_image_setting_val_'.esc_attr( $uni ).'" class="wpb_vc_param_value ' . esc_attr( $param_name ) . ' ' . esc_attr( $type ) . ' ' . esc_attr( $class ) . ' '.esc_attr( $value ).' vc_ug_gradient" name="' . esc_attr( $param_name ) . '" style="display:none" value="'.esc_attr( $value ).'" '.$dependency.'/>';
|
|
$output .= '<div class="ult-radio-image-box" data-uniqid="'.esc_attr( $uni ).'">';
|
|
if($value == 'transperant')
|
|
$checked = 'checked';
|
|
else
|
|
$checked = '';
|
|
$output .= '<label>
|
|
<input type="radio" name="radio_image_'.esc_attr( $uni ).'" '.$checked.' class="radio_pattern_image" value="'.esc_attr( $default ).'" />
|
|
<span class="pattern-background no-bg" style="background:transperant;"></span>
|
|
</label>';
|
|
foreach($options as $key => $img_url)
|
|
{
|
|
if($value == $key)
|
|
$checked = 'checked';
|
|
else
|
|
$checked = '';
|
|
if($useextension != 'true')
|
|
{
|
|
$temp = pathinfo($key);
|
|
$temp_filename = $temp['filename'];
|
|
$key = $temp_filename;
|
|
}
|
|
$output .= '<label>
|
|
<input type="radio" name="radio_image_'.esc_attr( $uni ).'" '.$checked.' class="radio_pattern_image" value="'.esc_attr( $key ).'" />
|
|
<span class="pattern-background" style="background:url('.esc_url( $img_url ).')"></span>
|
|
</label>';
|
|
}
|
|
$output .= '</div>';
|
|
$output .= '<style>
|
|
.ult-radio-image-box label > input{ /* HIDE RADIO */
|
|
display:none;
|
|
}
|
|
.ult-radio-image-box label > input + img{ /* IMAGE STYLES */
|
|
cursor:pointer;
|
|
border:2px solid transparent;
|
|
}
|
|
.ult-radio-image-box .no-bg {
|
|
border:2px solid #ccc;
|
|
}
|
|
.ult-radio-image-box label > input:checked + img, .ult-radio-image-box label > input:checked + .pattern-background{ /* (CHECKED) IMAGE STYLES */
|
|
border:2px solid #f00;
|
|
}
|
|
.pattern-background {';
|
|
foreach($css as $attr => $inine_style)
|
|
{
|
|
$output .= $attr.':'.$inine_style.';';
|
|
}
|
|
$output .= 'display: inline-block;
|
|
border:2px solid transparent;
|
|
}
|
|
</style>';
|
|
$output .= '<script type="text/javascript">
|
|
jQuery(".radio_pattern_image").change(function(){
|
|
var radio_id = jQuery(this).parent().parent().data("uniqid");
|
|
var val = jQuery(this).val();
|
|
jQuery("#radio_image_setting_val_"+radio_id).val(val);
|
|
});
|
|
</script>';
|
|
return $output;
|
|
}
|
|
|
|
}
|
|
}
|
|
|
|
if(class_exists('Ultimate_Radio_Image_Param'))
|
|
{
|
|
$Ultimate_Radio_Image_Param = new Ultimate_Radio_Image_Param();
|
|
}
|