__( 'Monday', 'a1-tools' ),
'tue' => __( 'Tuesday', 'a1-tools' ),
'wed' => __( 'Wednesday', 'a1-tools' ),
'thu' => __( 'Thursday', 'a1-tools' ),
'fri' => __( 'Friday', 'a1-tools' ),
'sat' => __( 'Saturday', 'a1-tools' ),
'sun' => __( 'Sunday', 'a1-tools' ),
);
}
/**
* Register widget controls.
*/
protected function register_controls() {
// ── Content ──────────────────────────────────────────────────────
$this->start_controls_section(
'content_section',
array(
'label' => __( 'Content', 'a1-tools' ),
'tab' => \Elementor\Controls_Manager::TAB_CONTENT,
)
);
$hours = $this->get_hours_data();
if ( ! empty( $hours ) ) {
$days = $this->get_days();
$lines = array();
foreach ( $days as $k => $label ) {
$val = isset( $hours[ $k ] ) && '' !== $hours[ $k ] ? $hours[ $k ] : 'Closed';
$lines[] = '' . $label . ': ' . esc_html( $val );
}
$this->add_control(
'info_notice',
array(
'type' => \Elementor\Controls_Manager::RAW_HTML,
'raw' => 'Current hours:
' . implode( '
', $lines ) . '
Edit hours in the A1 Tools app.',
'content_classes' => 'elementor-panel-alert elementor-panel-alert-success',
)
);
} else {
$this->add_control(
'info_notice',
array(
'type' => \Elementor\Controls_Manager::RAW_HTML,
'raw' => __( 'No operating hours configured.
Set them in the A1 Tools app under Site Variables.', 'a1-tools' ),
'content_classes' => 'elementor-panel-alert elementor-panel-alert-warning',
)
);
}
$this->add_control(
'title_text',
array(
'label' => __( 'Title', 'a1-tools' ),
'type' => \Elementor\Controls_Manager::TEXT,
'default' => __( 'Hours', 'a1-tools' ),
'placeholder' => __( 'Hours of Operation', 'a1-tools' ),
'label_block' => true,
)
);
$this->add_control(
'show_icon',
array(
'label' => __( 'Show Icon', 'a1-tools' ),
'type' => \Elementor\Controls_Manager::SWITCHER,
'label_on' => __( 'Yes', 'a1-tools' ),
'label_off' => __( 'No', 'a1-tools' ),
'return_value' => 'yes',
'default' => 'yes',
)
);
$this->add_control(
'icon',
array(
'label' => __( 'Icon', 'a1-tools' ),
'type' => \Elementor\Controls_Manager::ICONS,
'default' => array(
'value' => 'far fa-clock',
'library' => 'fa-regular',
),
'condition' => array(
'show_icon' => 'yes',
),
)
);
$this->add_control(
'layout',
array(
'label' => __( 'Layout', 'a1-tools' ),
'type' => \Elementor\Controls_Manager::SELECT,
'default' => 'list',
'options' => array(
'list' => __( 'List', 'a1-tools' ),
'table' => __( 'Table', 'a1-tools' ),
'inline' => __( 'Inline', 'a1-tools' ),
),
)
);
$this->add_control(
'closed_text',
array(
'label' => __( 'Closed Text', 'a1-tools' ),
'type' => \Elementor\Controls_Manager::TEXT,
'default' => __( 'Closed', 'a1-tools' ),
'placeholder' => __( 'Closed', 'a1-tools' ),
)
);
$this->add_control(
'hide_closed',
array(
'label' => __( 'Hide Closed Days', 'a1-tools' ),
'type' => \Elementor\Controls_Manager::SWITCHER,
'label_on' => __( 'Yes', 'a1-tools' ),
'label_off' => __( 'No', 'a1-tools' ),
'return_value' => 'yes',
'default' => '',
)
);
$this->end_controls_section();
// ── Title Style ─────────────────────────────────────────────────
$this->start_controls_section(
'title_style_section',
array(
'label' => __( 'Title', 'a1-tools' ),
'tab' => \Elementor\Controls_Manager::TAB_STYLE,
)
);
$this->add_control(
'title_color',
array(
'label' => __( 'Title Color', 'a1-tools' ),
'type' => \Elementor\Controls_Manager::COLOR,
'selectors' => array(
'{{WRAPPER}} .a1tools-hours-title' => 'color: {{VALUE}};',
),
)
);
$this->add_group_control(
\Elementor\Group_Control_Typography::get_type(),
array(
'name' => 'title_typography',
'label' => __( 'Title Typography', 'a1-tools' ),
'selector' => '{{WRAPPER}} .a1tools-hours-title',
)
);
$this->add_control(
'title_spacing',
array(
'label' => __( 'Title Bottom Spacing', 'a1-tools' ),
'type' => \Elementor\Controls_Manager::SLIDER,
'size_units' => array( 'px' ),
'range' => array(
'px' => array( 'min' => 0, 'max' => 50, 'step' => 1 ),
),
'default' => array( 'unit' => 'px', 'size' => 10 ),
'selectors' => array(
'{{WRAPPER}} .a1tools-hours-title' => 'margin-bottom: {{SIZE}}{{UNIT}};',
),
)
);
$this->end_controls_section();
// ── Icon Style ──────────────────────────────────────────────────
$this->start_controls_section(
'icon_style_section',
array(
'label' => __( 'Icon', 'a1-tools' ),
'tab' => \Elementor\Controls_Manager::TAB_STYLE,
'condition' => array( 'show_icon' => 'yes' ),
)
);
$this->add_control(
'icon_color',
array(
'label' => __( 'Icon Color', 'a1-tools' ),
'type' => \Elementor\Controls_Manager::COLOR,
'default' => '#E53935',
'selectors' => array(
'{{WRAPPER}} .a1tools-hours-icon' => 'color: {{VALUE}};',
'{{WRAPPER}} .a1tools-hours-icon svg' => 'fill: {{VALUE}};',
),
)
);
$this->add_control(
'icon_size',
array(
'label' => __( 'Icon Size', 'a1-tools' ),
'type' => \Elementor\Controls_Manager::SLIDER,
'size_units' => array( 'px' ),
'range' => array(
'px' => array( 'min' => 10, 'max' => 80, 'step' => 1 ),
),
'default' => array( 'unit' => 'px', 'size' => 24 ),
'selectors' => array(
'{{WRAPPER}} .a1tools-hours-icon' => 'font-size: {{SIZE}}{{UNIT}};',
'{{WRAPPER}} .a1tools-hours-icon svg' => 'width: {{SIZE}}{{UNIT}}; height: {{SIZE}}{{UNIT}};',
),
)
);
$this->add_control(
'icon_bg_heading',
array(
'label' => __( 'Background', 'a1-tools' ),
'type' => \Elementor\Controls_Manager::HEADING,
'separator' => 'before',
)
);
$this->add_control(
'icon_bg_color',
array(
'label' => __( 'Background Color', 'a1-tools' ),
'type' => \Elementor\Controls_Manager::COLOR,
'default' => '',
'selectors' => array(
'{{WRAPPER}} .a1tools-hours-icon' => 'background-color: {{VALUE}};',
),
)
);
$this->add_control(
'icon_padding',
array(
'label' => __( 'Padding', 'a1-tools' ),
'type' => \Elementor\Controls_Manager::DIMENSIONS,
'size_units' => array( 'px' ),
'selectors' => array(
'{{WRAPPER}} .a1tools-hours-icon' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
),
)
);
$this->add_control(
'icon_border_heading',
array(
'label' => __( 'Border', 'a1-tools' ),
'type' => \Elementor\Controls_Manager::HEADING,
'separator' => 'before',
)
);
$this->add_group_control(
\Elementor\Group_Control_Border::get_type(),
array(
'name' => 'icon_border',
'label' => __( 'Border', 'a1-tools' ),
'selector' => '{{WRAPPER}} .a1tools-hours-icon',
)
);
$this->add_control(
'icon_border_radius',
array(
'label' => __( 'Border Radius', 'a1-tools' ),
'type' => \Elementor\Controls_Manager::SLIDER,
'size_units' => array( 'px', '%' ),
'range' => array(
'px' => array( 'min' => 0, 'max' => 50 ),
'%' => array( 'min' => 0, 'max' => 50 ),
),
'selectors' => array(
'{{WRAPPER}} .a1tools-hours-icon' => 'border-radius: {{SIZE}}{{UNIT}};',
),
)
);
$this->add_control(
'icon_spacing',
array(
'label' => __( 'Icon Spacing', 'a1-tools' ),
'type' => \Elementor\Controls_Manager::SLIDER,
'size_units' => array( 'px' ),
'range' => array(
'px' => array( 'min' => 0, 'max' => 30, 'step' => 1 ),
),
'default' => array( 'unit' => 'px', 'size' => 8 ),
'separator' => 'before',
'selectors' => array(
'{{WRAPPER}} .a1tools-hours-icon' => 'margin-right: {{SIZE}}{{UNIT}};',
),
)
);
$this->end_controls_section();
// ── List Style ──────────────────────────────────────────────────
$this->start_controls_section(
'list_style_section',
array(
'label' => __( 'Hours List', 'a1-tools' ),
'tab' => \Elementor\Controls_Manager::TAB_STYLE,
)
);
$this->add_responsive_control(
'alignment',
array(
'label' => __( 'Alignment', 'a1-tools' ),
'type' => \Elementor\Controls_Manager::CHOOSE,
'options' => array(
'left' => array(
'title' => __( 'Left', 'a1-tools' ),
'icon' => 'eicon-text-align-left',
),
'center' => array(
'title' => __( 'Center', 'a1-tools' ),
'icon' => 'eicon-text-align-center',
),
'right' => array(
'title' => __( 'Right', 'a1-tools' ),
'icon' => 'eicon-text-align-right',
),
),
'default' => 'left',
'selectors' => array(
'{{WRAPPER}} .a1tools-hours-widget' => 'text-align: {{VALUE}};',
),
)
);
$this->add_control(
'day_color',
array(
'label' => __( 'Day Name Color', 'a1-tools' ),
'type' => \Elementor\Controls_Manager::COLOR,
'selectors' => array(
'{{WRAPPER}} .a1tools-hours-day' => 'color: {{VALUE}};',
),
)
);
$this->add_group_control(
\Elementor\Group_Control_Typography::get_type(),
array(
'name' => 'day_typography',
'label' => __( 'Day Name Typography', 'a1-tools' ),
'selector' => '{{WRAPPER}} .a1tools-hours-day',
)
);
$this->add_control(
'time_color',
array(
'label' => __( 'Time Color', 'a1-tools' ),
'type' => \Elementor\Controls_Manager::COLOR,
'selectors' => array(
'{{WRAPPER}} .a1tools-hours-time' => 'color: {{VALUE}};',
),
)
);
$this->add_group_control(
\Elementor\Group_Control_Typography::get_type(),
array(
'name' => 'time_typography',
'label' => __( 'Time Typography', 'a1-tools' ),
'selector' => '{{WRAPPER}} .a1tools-hours-time',
)
);
$this->add_control(
'closed_color',
array(
'label' => __( 'Closed Text Color', 'a1-tools' ),
'type' => \Elementor\Controls_Manager::COLOR,
'default' => '',
'selectors' => array(
'{{WRAPPER}} .a1tools-hours-closed .a1tools-hours-time' => 'color: {{VALUE}};',
),
)
);
$this->add_control(
'content_gap',
array(
'label' => __( 'Day / Time Gap', 'a1-tools' ),
'type' => \Elementor\Controls_Manager::SLIDER,
'size_units' => array( 'px' ),
'range' => array(
'px' => array( 'min' => 0, 'max' => 60, 'step' => 1 ),
),
'default' => array( 'unit' => 'px', 'size' => 16 ),
'selectors' => array(
'{{WRAPPER}} .a1tools-hours-row' => 'gap: {{SIZE}}{{UNIT}};',
),
)
);
$this->add_control(
'day_min_width',
array(
'label' => __( 'Day Column Width', 'a1-tools' ),
'type' => \Elementor\Controls_Manager::SLIDER,
'size_units' => array( 'px' ),
'range' => array(
'px' => array( 'min' => 60, 'max' => 200, 'step' => 5 ),
),
'default' => array( 'unit' => 'px', 'size' => 110 ),
'selectors' => array(
'{{WRAPPER}} .a1tools-hours-day' => 'min-width: {{SIZE}}{{UNIT}};',
),
)
);
$this->add_control(
'separator_heading',
array(
'label' => __( 'Row Separator', 'a1-tools' ),
'type' => \Elementor\Controls_Manager::HEADING,
'separator' => 'before',
)
);
$this->add_control(
'show_divider',
array(
'label' => __( 'Show Divider', 'a1-tools' ),
'type' => \Elementor\Controls_Manager::SWITCHER,
'label_on' => __( 'Yes', 'a1-tools' ),
'label_off' => __( 'No', 'a1-tools' ),
'return_value' => 'yes',
'default' => '',
)
);
$this->add_control(
'divider_color',
array(
'label' => __( 'Divider Color', 'a1-tools' ),
'type' => \Elementor\Controls_Manager::COLOR,
'default' => '#e0e0e0',
'condition' => array( 'show_divider' => 'yes' ),
'selectors' => array(
'{{WRAPPER}} .a1tools-hours-row' => 'border-bottom-color: {{VALUE}};',
),
)
);
$this->add_control(
'row_spacing',
array(
'label' => __( 'Row Spacing', 'a1-tools' ),
'type' => \Elementor\Controls_Manager::SLIDER,
'size_units' => array( 'px' ),
'range' => array(
'px' => array( 'min' => 0, 'max' => 30, 'step' => 1 ),
),
'default' => array( 'unit' => 'px', 'size' => 6 ),
'selectors' => array(
'{{WRAPPER}} .a1tools-hours-row' => 'padding: {{SIZE}}{{UNIT}} 0;',
),
)
);
$this->end_controls_section();
// ── Background / Border ─────────────────────────────────────────
$this->start_controls_section(
'box_style_section',
array(
'label' => __( 'Box Style', 'a1-tools' ),
'tab' => \Elementor\Controls_Manager::TAB_STYLE,
)
);
$this->add_control(
'box_bg_color',
array(
'label' => __( 'Background Color', 'a1-tools' ),
'type' => \Elementor\Controls_Manager::COLOR,
'selectors' => array(
'{{WRAPPER}} .a1tools-hours-widget' => 'background-color: {{VALUE}};',
),
)
);
$this->add_group_control(
\Elementor\Group_Control_Border::get_type(),
array(
'name' => 'box_border',
'label' => __( 'Border', 'a1-tools' ),
'selector' => '{{WRAPPER}} .a1tools-hours-widget',
)
);
$this->add_control(
'box_border_radius',
array(
'label' => __( 'Border Radius', 'a1-tools' ),
'type' => \Elementor\Controls_Manager::DIMENSIONS,
'size_units' => array( 'px', '%' ),
'selectors' => array(
'{{WRAPPER}} .a1tools-hours-widget' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
),
)
);
$this->add_control(
'box_padding',
array(
'label' => __( 'Padding', 'a1-tools' ),
'type' => \Elementor\Controls_Manager::DIMENSIONS,
'size_units' => array( 'px', 'em' ),
'selectors' => array(
'{{WRAPPER}} .a1tools-hours-widget' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
),
)
);
$this->add_group_control(
\Elementor\Group_Control_Box_Shadow::get_type(),
array(
'name' => 'box_shadow',
'label' => __( 'Box Shadow', 'a1-tools' ),
'selector' => '{{WRAPPER}} .a1tools-hours-widget',
)
);
$this->end_controls_section();
}
/**
* Render widget output on the frontend.
*/
protected function render() {
$settings = $this->get_settings_for_display();
$hours = $this->get_hours_data();
$days = $this->get_days();
$layout = ! empty( $settings['layout'] ) ? $settings['layout'] : 'list';
$closed_text = ! empty( $settings['closed_text'] ) ? $settings['closed_text'] : __( 'Closed', 'a1-tools' );
$hide_closed = 'yes' === ( $settings['hide_closed'] ?? '' );
$show_divider = 'yes' === ( $settings['show_divider'] ?? '' );
$divider_class = $show_divider ? ' a1tools-hours-has-divider' : '';
echo '';
return;
}
echo ''; // .a1tools-hours-list
echo ''; // .a1tools-hours-widget
}
/**
* Render widget output in the editor.
*/
protected function content_template() {
$hours = $this->get_hours_data();
$days = $this->get_days();
// Build JS-friendly data
$js_days = array();
foreach ( $days as $key => $label ) {
$val = isset( $hours[ $key ] ) && '' !== $hours[ $key ] ? $hours[ $key ] : '';
$js_days[] = array(
'key' => $key,
'label' => $label,
'time' => $val,
);
}
?>
<#
var layout = settings.layout || 'list';
var closedText = settings.closed_text || 'Closed';
var hideClosed = settings.hide_closed === 'yes';
var showDivider = settings.show_divider === 'yes';
var dividerClass = showDivider ? ' a1tools-hours-has-divider' : '';
var days = ;
#>