← All changes | includes/widgets/progress.php +66 -167 4.2.0 → 3.24.4 View file →

		@@ -90,12 +90,8 @@
90	90	public function get_style_depends(): array {
91	91	return [ 'widget-progress' ];
92	92	}
93	93
94		- public function has_widget_inner_wrapper(): bool {
95		- return ! Plugin::$instance->experiments->is_feature_active( 'e_optimized_markup' );
96		- }
97		-
98	94	/**
99	95	* Register progress widget controls.
100	96	*
101	97	* Adds different input fields to allow the user to change and customize the widget settings.
		@@ -148,22 +144,8 @@
148	144	]
149	145	);
150	146
151	147	$this->add_control(
152		- 'title_display',
153		- [
154		- 'label' => esc_html__( 'Display Title', 'elementor' ),
155		- 'type' => Controls_Manager::SWITCHER,
156		- 'label_on' => esc_html__( 'Show', 'elementor' ),
157		- 'label_off' => esc_html__( 'Hide', 'elementor' ),
158		- 'default' => 'yes',
159		- 'condition' => [
160		- 'title!' => '',
161		- ],
162		- ]
163		- );
164		-
165		- $this->add_control(
166	148	'progress_type',
167	149	[
168	150	'label' => esc_html__( 'Type', 'elementor' ),
169	151	'type' => Controls_Manager::SELECT,
		@@ -193,9 +175,8 @@
193	175	],
194	176	'dynamic' => [
195	177	'active' => true,
196	178	],
197		- 'separator' => 'before',
198	179	]
199	180	);
200	181
201	182	$this->add_control(
		@@ -206,11 +187,8 @@
206	187	'label_on' => esc_html__( 'Show', 'elementor' ),
207	188	'label_off' => esc_html__( 'Hide', 'elementor' ),
208	189	'return_value' => 'show',
209	190	'default' => 'show',
210		- 'condition' => [
211		- 'percent!' => '',
212		- ],
213	191	]
214	192	);
215	193
216	194	$this->add_control(
		@@ -223,9 +201,8 @@
223	201	],
224	202	'placeholder' => esc_html__( 'e.g. Web Designer', 'elementor' ),
225	203	'default' => esc_html__( 'Web Designer', 'elementor' ),
226	204	'label_block' => true,
227		- 'separator' => 'before',
228	205	]
229	206	);
230	207
231	208	$this->end_controls_section();
		@@ -238,70 +215,8 @@
238	215	]
239	216	);
240	217
241	218	$this->add_control(
242		- 'title_heading',
243		- [
244		- 'label' => esc_html__( 'Title', 'elementor' ),
245		- 'type' => Controls_Manager::HEADING,
246		- 'condition' => [
247		- 'title!' => '',
248		- ],
249		- ]
250		- );
251		-
252		- $this->add_control(
253		- 'title_color',
254		- [
255		- 'label' => esc_html__( 'Text Color', 'elementor' ),
256		- 'type' => Controls_Manager::COLOR,
257		- 'selectors' => [
258		- '{{WRAPPER}} .elementor-title' => 'color: {{VALUE}};',
259		- ],
260		- 'global' => [
261		- 'default' => Global_Colors::COLOR_PRIMARY,
262		- ],
263		- 'condition' => [
264		- 'title!' => '',
265		- ],
266		- ]
267		- );
268		-
269		- $this->add_group_control(
270		- Group_Control_Typography::get_type(),
271		- [
272		- 'name' => 'typography',
273		- 'selector' => '{{WRAPPER}} .elementor-title',
274		- 'global' => [
275		- 'default' => Global_Typography::TYPOGRAPHY_TEXT,
276		- ],
277		- 'condition' => [
278		- 'title!' => '',
279		- ],
280		- ]
281		- );
282		-
283		- $this->add_group_control(
284		- Group_Control_Text_Shadow::get_type(),
285		- [
286		- 'name' => 'title_shadow',
287		- 'selector' => '{{WRAPPER}} .elementor-title',
288		- 'condition' => [
289		- 'title!' => '',
290		- ],
291		- ]
292		- );
293		-
294		- $this->add_control(
295		- 'percentage_heading',
296		- [
297		- 'label' => esc_html__( 'Percentage', 'elementor' ),
298		- 'type' => Controls_Manager::HEADING,
299		- 'separator' => 'before',
300		- ]
301		- );
302		-
303		- $this->add_control(
304	219	'bar_color',
305	220	[
306	221	'label' => esc_html__( 'Color', 'elementor' ),
307	222	'type' => Controls_Manager::COLOR,
		@@ -354,11 +269,8 @@
354	269	[
355	270	'label' => esc_html__( 'Inner Text', 'elementor' ),
356	271	'type' => Controls_Manager::HEADING,
357	272	'separator' => 'before',
358		- 'condition' => [
359		- 'inner_text!' => '',
360		- ],
361	273	]
362	274	);
363	275
364	276	$this->add_control(
		@@ -368,11 +280,8 @@
368	280	'type' => Controls_Manager::COLOR,
369	281	'selectors' => [
370	282	'{{WRAPPER}} .elementor-progress-bar' => 'color: {{VALUE}};',
371	283	],
372		- 'condition' => [
373		- 'inner_text!' => '',
374		- ],
375	284	]
376	285	);
377	286
378	287	$this->add_group_control(
		@@ -382,11 +291,8 @@
382	291	'selector' => '{{WRAPPER}} .elementor-progress-bar',
383	292	'exclude' => [
384	293	'line_height',
385	294	],
386		- 'condition' => [
387		- 'inner_text!' => '',
388		- ],
389	295	]
390	296	);
391	297
392	298	$this->add_group_control(
		@@ -393,14 +299,54 @@
393	299	Group_Control_Text_Shadow::get_type(),
394	300	[
395	301	'name' => 'bar_inner_shadow',
396	302	'selector' => '{{WRAPPER}} .elementor-progress-bar',
397		- 'condition' => [
398		- 'inner_text!' => '',
	303	+ ]
	304	+ );
	305	+
	306	+ $this->end_controls_section();
	307	+
	308	+ $this->start_controls_section(
	309	+ 'section_title',
	310	+ [
	311	+ 'label' => esc_html__( 'Title Style', 'elementor' ),
	312	+ 'tab' => Controls_Manager::TAB_STYLE,
	313	+ ]
	314	+ );
	315	+
	316	+ $this->add_control(
	317	+ 'title_color',
	318	+ [
	319	+ 'label' => esc_html__( 'Text Color', 'elementor' ),
	320	+ 'type' => Controls_Manager::COLOR,
	321	+ 'selectors' => [
	322	+ '{{WRAPPER}} .elementor-title' => 'color: {{VALUE}};',
399	323	],
	324	+ 'global' => [
	325	+ 'default' => Global_Colors::COLOR_PRIMARY,
	326	+ ],
400	327	]
401	328	);
402	329
	330	+ $this->add_group_control(
	331	+ Group_Control_Typography::get_type(),
	332	+ [
	333	+ 'name' => 'typography',
	334	+ 'selector' => '{{WRAPPER}} .elementor-title',
	335	+ 'global' => [
	336	+ 'default' => Global_Typography::TYPOGRAPHY_TEXT,
	337	+ ],
	338	+ ]
	339	+ );
	340	+
	341	+ $this->add_group_control(
	342	+ Group_Control_Text_Shadow::get_type(),
	343	+ [
	344	+ 'name' => 'title_shadow',
	345	+ 'selector' => '{{WRAPPER}} .elementor-title',
	346	+ ]
	347	+ );
	348	+
403	349	$this->end_controls_section();
404	350	}
405	351
406	352	/**
		@@ -426,28 +372,19 @@
426	372	$progress_percentage = 100;
427	373	}
428	374
429	375	if ( ! Utils::is_empty( $settings['title'] ) ) {
	376	+ $this->add_render_attribute(
	377	+ 'title',
	378	+ [
	379	+ 'class' => 'elementor-title',
	380	+ 'id' => $progressbar_id,
	381	+ ]
	382	+ );
430	383
431		- if ( 'yes' === $settings['title_display'] ) {
	384	+ $this->add_inline_editing_attributes( 'title' );
432	385
433		- $this->add_render_attribute(
434		- 'title',
435		- [
436		- 'class' => 'elementor-title',
437		- 'id' => $progressbar_id,
438		- ]
439		- );
440		-
441		- $this->add_inline_editing_attributes( 'title' );
442		-
443		- $this->add_render_attribute( 'wrapper', 'aria-labelledby', $progressbar_id );
444		-
445		- } else {
446		-
447		- $this->add_render_attribute( 'wrapper', 'aria-label', $settings['title'] );
448		-
449		- }
	386	+ $this->add_render_attribute( 'wrapper', 'aria-labelledby', $progressbar_id );
450	387	}
451	388
452	389	$this->add_render_attribute(
453	390	'wrapper',
		@@ -479,17 +416,17 @@
479	416	$this->add_render_attribute( 'inner_text', 'class', 'elementor-progress-text' );
480	417
481	418	$this->add_inline_editing_attributes( 'inner_text' );
482	419
483		- if ( ! Utils::is_empty( $settings['title'] ) && 'yes' === $settings['title_display'] ) { ?>
	420	+ if ( ! Utils::is_empty( $settings['title'] ) ) { ?>
484	421	<<?php Utils::print_validated_html_tag( $settings['title_tag'] ); ?> <?php $this->print_render_attribute_string( 'title' ); ?>>
485		- <?php echo wp_kses_post( $settings['title'] ); ?>
	422	+ <?php $this->print_unescaped_setting( 'title' ); ?>
486	423	</<?php Utils::print_validated_html_tag( $settings['title_tag'] ); ?>>
487	424	<?php } ?>
488	425
489	426	<div <?php $this->print_render_attribute_string( 'wrapper' ); ?>>
490	427	<div <?php $this->print_render_attribute_string( 'progress-bar' ); ?>>
491		- <span <?php $this->print_render_attribute_string( 'inner_text' ); ?>><?php echo wp_kses_post( $settings['inner_text'] ); ?></span>
	428	+ <span <?php $this->print_render_attribute_string( 'inner_text' ); ?>><?php $this->print_unescaped_setting( 'inner_text' ); ?></span>
492	429	<?php if ( 'show' === $settings['display_percentage'] ) { ?>
493	430	<span class="elementor-progress-percentage"><?php echo $progress_percentage; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>%</span>
494	431	<?php } ?>
495	432	</div>
		@@ -520,28 +457,19 @@
520	457	progress_percentage = 100 < settings.percent.size ? 100 : settings.percent.size;
521	458	}
522	459
523	460	if ( settings.title ) {
	461	+ view.addRenderAttribute(
	462	+ 'title',
	463	+ {
	464	+ 'class': 'elementor-title',
	465	+ 'id': progressbar_id,
	466	+ }
	467	+ );
524	468
525		- if ( 'yes' === settings.title_display ) {
	469	+ view.addInlineEditingAttributes( 'title' );
526	470
527		- view.addRenderAttribute(
528		- 'title',
529		- {
530		- 'class': 'elementor-title',
531		- 'id': progressbar_id,
532		- }
533		- );
534		-
535		- view.addInlineEditingAttributes( 'title' );
536		-
537		- view.addRenderAttribute( 'progressWrapper', 'aria-labelledby', progressbar_id );
538		-
539		- } else {
540		-
541		- view.addRenderAttribute( 'progressWrapper', 'aria-label', settings.title );
542		-
543		- }
	471	+ view.addRenderAttribute( 'wrapper', 'aria-labelledby', progressbar_id );
544	472	}
545	473
546	474	view.addRenderAttribute(
547	475	'progressWrapper',
		@@ -561,14 +489,14 @@
561	489	view.addRenderAttribute( 'inner_text', 'class', 'elementor-progress-text' );
562	490
563	491	view.addInlineEditingAttributes( 'inner_text' );
564	492	#>
565		- <# if ( settings.title && 'yes' === settings.title_display ) { #>
566		- <{{ title_tag }} {{{ view.getRenderAttributeString( 'title' ) }}}>{{ settings.title }}</{{ title_tag }}>
	493	+ <# if ( settings.title ) { #>
	494	+ <{{ title_tag }} {{{ view.getRenderAttributeString( 'title' ) }}}>{{{ settings.title }}}</{{ title_tag }}>
567	495	<# } #>
568	496	<div {{{ view.getRenderAttributeString( 'progressWrapper' ) }}}>
569	497	<div class="elementor-progress-bar" data-max="{{ progress_percentage }}">
570		- <span {{{ view.getRenderAttributeString( 'inner_text' ) }}}>{{ settings.inner_text }}</span>
	498	+ <span {{{ view.getRenderAttributeString( 'inner_text' ) }}}>{{{ settings.inner_text }}}</span>
571	499	<# if ( 'show' === settings.display_percentage ) { #>
572	500	<span class="elementor-progress-percentage">{{{ progress_percentage }}}%</span>
573	501	<# } #>
574	502	</div>
		@@ -573,35 +501,6 @@
573	501	<# } #>
574	502	</div>
575	503	</div>
576	504	<?php
577		- }
578		-
579		- public function render_markdown(): string {
580		- $settings = $this->get_settings_for_display();
581		- $title = Utils::html_to_plain_text( $settings['title'] ?? '' );
582		- $inner_text = Utils::html_to_plain_text( $settings['inner_text'] ?? '' );
583		- $percent = $settings['percent']['size'] ?? ( $settings['percent'] ?? '' );
584		-
585		- $parts = [];
586		-
587		- if ( ! empty( $title ) ) {
588		- $parts[] = $title;
589		- }
590		-
591		- if ( ! empty( $inner_text ) ) {
592		- $parts[] = $inner_text;
593		- }
594		-
595		- if ( empty( $parts ) && empty( $percent ) ) {
596		- return '';
597		- }
598		-
599		- $label = implode( ' - ', $parts );
600		-
601		- if ( ! empty( $percent ) ) {
602		- return ! empty( $label ) ? $label . ': ' . $percent . '%' : $percent . '%';
603		- }
604		-
605		- return $label;
606	505	}
607	506	}