context = $context;
}
public function get_attachment_image_html_filter( $html ) {
$settings = $this->widget->get_settings_for_display();
$widget_name = $this->context['widget_name'];
$image_classnames = [
self::CLASSNAME_IMAGE . '__img',
self::EHP_PREFIX . $widget_name . '__img',
];
if ( ! empty( $settings['show_image_border'] ) && 'yes' === $settings['show_image_border'] ) {
$image_classnames[] = 'has-border';
}
$shapes = new Ehp_Shapes( $this->widget, [
'container_prefix' => 'image',
'widget_name' => $widget_name,
] );
$image_classnames = array_merge( $image_classnames, $shapes->get_shape_classnames() );
$html = str_replace( '![]()
widget->get_settings_for_display();
$widget_name = $this->context['widget_name'];
$image = $this->defaults['image'] ?? $settings['image'];
$has_image = ! empty( $image['url'] );
$image_wrapper_classnames = [
self::CLASSNAME_IMAGE,
self::EHP_PREFIX . $widget_name . '__image-container',
];
$this->widget->add_render_attribute( 'image', [
'class' => $image_wrapper_classnames,
] );
$settings_control_value = $this->defaults['settings'] ?? $settings;
$image_key = $this->defaults['image_key'] ?? 'image';
if ( $has_image ) :
?>
widget->print_render_attribute_string( 'image' ); ?>>
widget->add_control(
'image',
[
'label' => esc_html__( 'Choose Image', 'hello-plus' ),
'type' => Controls_Manager::MEDIA,
'default' => [
'url' => Elementor_Utils::get_placeholder_image_src(),
],
'dynamic' => [
'active' => true,
],
]
);
}
public function add_style_controls() {
$widget_name = $this->context['widget_name'];
$defaults = [
'has_image_width_slider' => $this->defaults['has_image_width_slider'] ?? true,
'has_image_width_dropdown' => $this->defaults['has_image_width_dropdown'] ?? false,
];
$this->widget->add_control(
'image_stretch',
[
'label' => esc_html__( 'Stretch', 'hello-plus' ),
'type' => Controls_Manager::SWITCHER,
'label_on' => esc_html__( 'Yes', 'hello-plus' ),
'label_off' => esc_html__( 'No', 'hello-plus' ),
'return_value' => 'yes',
'default' => 'no',
]
);
$this->widget->add_responsive_control(
'image_height',
[
'label' => esc_html__( 'Height', 'hello-plus' ),
'type' => Controls_Manager::SLIDER,
'size_units' => [ 'px', 'em', 'rem', '%', 'custom' ],
'range' => [
'px' => [
'max' => 1500,
],
'%' => [
'max' => 100,
],
],
'default' => [
'size' => 380,
'unit' => 'px',
],
'selectors' => [
'{{WRAPPER}} .ehp-' . $widget_name => '--' . $widget_name . '-image-height: {{SIZE}}{{UNIT}};',
],
'condition' => [
'image_stretch!' => 'yes',
],
]
);
if ( $defaults['has_image_width_slider'] ) {
$this->widget->add_responsive_control(
'image_width',
[
'label' => esc_html__( 'Width', 'hello-plus' ),
'type' => Controls_Manager::SLIDER,
'size_units' => [ 'px', 'em', 'rem', '%', 'custom' ],
'range' => [
'px' => [
'max' => 1500,
],
'%' => [
'max' => 100,
],
],
'default' => [
'size' => 100,
'unit' => '%',
],
'selectors' => [
'{{WRAPPER}} .ehp-' . $widget_name => '--' . $widget_name . '-image-width: {{SIZE}}{{UNIT}};',
],
'condition' => [
'image_stretch!' => 'yes',
],
]
);
}
if ( $defaults['has_image_width_dropdown'] ) {
$this->widget->add_responsive_control(
'image_width',
[
'label' => esc_html__( 'Width', 'hello-plus' ),
'type' => Controls_Manager::SELECT,
'options' => [
'50%' => '50%',
'40%' => '40%',
'30%' => '30%',
],
'default' => '50%',
'selectors' => [
'{{WRAPPER}} .ehp-' . $widget_name => '--' . $widget_name . '-image-width: {{VALUE}};',
],
'condition' => [
'image_stretch!' => 'yes',
],
]
);
}
$this->widget->add_responsive_control(
'image_min_height',
[
'label' => esc_html__( 'Min Height', 'hello-plus' ),
'type' => Controls_Manager::SLIDER,
'size_units' => [ 'px', 'em', 'rem', '%', 'custom' ],
'range' => [
'px' => [
'max' => 1500,
],
'%' => [
'max' => 100,
],
],
'selectors' => [
'{{WRAPPER}} .ehp-' . $widget_name => '--' . $widget_name . '-image-min-height: {{SIZE}}{{UNIT}};',
],
'condition' => [
'image_stretch' => 'yes',
],
]
);
$this->widget->add_responsive_control(
'image_position',
[
'label' => esc_html__( 'Position', 'hello-plus' ),
'type' => Controls_Manager::SELECT,
'desktop_default' => 'center center',
'tablet_default' => 'center center',
'mobile_default' => 'center center',
'options' => [
'' => esc_html__( 'Default', 'hello-plus' ),
'center center' => esc_html__( 'Center Center', 'hello-plus' ),
'center left' => esc_html__( 'Center Left', 'hello-plus' ),
'center right' => esc_html__( 'Center Right', 'hello-plus' ),
'top center' => esc_html__( 'Top Center', 'hello-plus' ),
'top left' => esc_html__( 'Top Left', 'hello-plus' ),
'top right' => esc_html__( 'Top Right', 'hello-plus' ),
'bottom center' => esc_html__( 'Bottom Center', 'hello-plus' ),
'bottom left' => esc_html__( 'Bottom Left', 'hello-plus' ),
'bottom right' => esc_html__( 'Bottom Right', 'hello-plus' ),
],
'selectors' => [
'{{WRAPPER}} .ehp-' . $widget_name => '--' . $widget_name . '-image-position: {{VALUE}}',
],
]
);
$this->widget->add_group_control(
Group_Control_Css_Filter::get_type(),
[
'name' => 'image_css_filters',
'selector' => '{{WRAPPER}} .ehp-' . $widget_name . '__image-container img',
]
);
$this->widget->add_control(
'show_image_border',
[
'label' => esc_html__( 'Border', 'hello-plus' ),
'type' => Controls_Manager::SWITCHER,
'label_on' => esc_html__( 'Yes', 'hello-plus' ),
'label_off' => esc_html__( 'No', 'hello-plus' ),
'return_value' => 'yes',
'default' => 'no',
'separator' => 'before',
]
);
$this->widget->add_control(
'image_border_width',
[
'label' => __( 'Border Width', 'hello-plus' ),
'type' => Controls_Manager::SLIDER,
'size_units' => [ 'px' ],
'range' => [
'px' => [
'min' => 0,
'max' => 10,
'step' => 1,
],
],
'default' => [
'size' => 1,
'unit' => 'px',
],
'selectors' => [
'{{WRAPPER}} .ehp-' . $widget_name => '--' . $widget_name . '-image-border-width: {{SIZE}}{{UNIT}};',
],
'condition' => [
'show_image_border' => 'yes',
],
]
);
$this->widget->add_control(
'image_border_color',
[
'label' => esc_html__( 'Color', 'hello-plus' ),
'type' => Controls_Manager::COLOR,
'global' => [
'default' => Global_Colors::COLOR_TEXT,
],
'selectors' => [
'{{WRAPPER}} .ehp-' . $widget_name => '--' . $widget_name . '-image-border-color: {{VALUE}}',
],
'condition' => [
'show_image_border' => 'yes',
],
]
);
$shapes = new Ehp_Shapes( $this->widget, [
'widget_name' => $widget_name,
'container_prefix' => 'image',
] );
$shapes->add_style_controls();
$this->widget->add_group_control(
Group_Control_Box_Shadow::get_type(),
[
'name' => 'image_box_shadow',
'selector' => '{{WRAPPER}} .ehp-' . $widget_name . '__image-container img',
]
);
}
public function __construct( Widget_Base $widget, $context = [], $defaults = [] ) {
$this->widget = $widget;
$this->context = $context;
$this->defaults = $defaults;
}
}