depicter / app / src / Document / Models / Common / Background.php

Background.php in Depicter — Popup & Slider Builder 1.3.3, at app/src/Document/Models/Common/Background.php

239 lines 5.2 KB

Raw Download Zip

1	<?php
2	namespace Depicter\Document\Models\Common;
3
4
5	use Depicter\Document\CSS\Breakpoints;
6	use Depicter\Document\CSS\Selector;
7	use Depicter\Document\Models\Traits\HasDataSheetTrait;
8	use Depicter\Html\Html;
9	use Depicter\Services\MediaBridge;
10
11	class Background
12	{
13	use HasDataSheetTrait;
14
15	/**
16	* @var Color
17	*/
18	public $color;
19
20	/**
21	* @var string
22	*/
23	public $fitMode;
24
25	/**
26	* @var object
27	*/
28	public $video;
29
30	/**
31	* @var object
32	*/
33	public $image;
34
35	/**
36	* @var Color
37	*/
38	public $overlay;
39
40	/**
41	* @var Styles\Filter
42	*/
43	public $filter;
44
45	/**
46	* Check if section has background or not
47	*
48	* @return boolean
49	*/
50	public function hasBackground() {
51	return !empty( $this->image->src ) \|\| !empty( $this->video->src );
52	}
53
54
55	/**
56	* @return Html\|string
57	*/
58	public function render() {
59
60	$html = '';
61
62	if ( !empty( $this->image->src ) ) {
63	$originalSrc = $this->image->src;
64	$this->image->src = $this->maybeReplaceDataSheetTag( $this->image->src, '{{{featuredImage}}}' );
65	$html .= $this->renderImage( \Depicter::media()->getSourceUrl( $this->image->src ) );
66	// restore original image src
67	$this->image->src = $originalSrc;
68	}
69
70	if ( !empty( $this->video->src ) ) {
71	$html .= $this->renderVideo( \Depicter::media()->getSourceUrl( $this->video->src ) );
72	}
73
74	return $html;
75
76	}
77
78	/**
79	* render images
80	* @param $image
81	*
82	* @return Html
83	*/
84	protected function renderImage( $imageUrl ) {
85	$imageSrcSet = is_numeric( $this->image->src ) ? \Depicter::media()->getSrcSet( $this->image->src, 'full' ) : '';
86
87	$args = [
88	'class' => 'depicter-bg',
89	'src' => \Depicter::media()::IMAGE_PLACEHOLDER_SRC,
90	'data-src' => $imageUrl,
91	'alt' => is_numeric( $this->image->src ) ? \Depicter::media()->getAltText( $this->image->src ) : ''
92	];
93
94	if ( $imageSrcSet ) {
95	$args['data-srcset'] = $imageSrcSet;
96	}
97
98	$available_args = [
99	'responsiveArgs' => [
100	'data-object-fit' => 'fitMode',
101	'data-object-position' => 'position'
102	]
103	];
104
105	$args = $this->get_element_attributes( 'image', $args, $available_args );
106
107	return Html::img( $imageUrl, $args);
108	}
109
110	public function renderVideo( $videoUrl ) {
111
112	$args = [
113	'class' => Selector::prefixify( 'bg-video' ),
114	'src' => $videoUrl,
115	'preload' => 'metadata',
116	'playsinline' => "true"
117	];
118
119	$available_args = [
120	'muted' => 'muted',
121	'loop' => 'loop',
122	'data-goto-next' => 'goNextSlide',
123	'data-auto-pause' => 'pause',
124	'responsiveArgs' => [
125	'data-object-fit' => 'fitMode',
126	'data-object-position' => 'position'
127	]
128	];
129
130	$args = $this->get_element_attributes( 'video', $args, $available_args );
131
132	return Html::video( $args );
133	}
134
135	public function get_element_attributes( $element_type, $args, $available_args ) {
136	foreach ( $available_args as $attribute => $property ) {
137	// for object properties that has responsive value like fitMode and position
138	if ( $attribute == 'responsiveArgs' ) {
139	foreach ( $property as $key => $value ) {
140	$breakpointNames = Breakpoints::names();
141	if ( !empty( $this->{$element_type}->{$value} ) ) {
142	foreach ( $breakpointNames as $device ) {
143	$args[ $key ][] = !empty( $this->{$element_type}->{$value}->{$device} ) ? $this->{$element_type}->{$value}->{$device} : '';
144	}
145	$args[ $key ] = implode(',', $args[ $key ] );
146	}
147	}
148
149	// for simple object properties
150	} elseif ( !empty( $this->{$element_type}->{$property} ) ) {
151	$value = $this->{$element_type}->{$property} == "1" ? "true" : $this->{$element_type}->{$property};
152	$args[ $attribute ] = $value;
153	}
154
155	// In video background, if each of `muted` or `loop` are not set, consider it as `true` by default
156	if( $element_type === 'video' ){
157	if( in_array( $property, ['muted', 'loop'] ) ){
158	if( ! isset( $this->{$element_type}->{$property} ) ){
159	$args[ $attribute ] = 'true';
160	}
161	}
162	}
163	}
164	return $args;
165	}
166
167	/**
168	* Get css background color
169	*
170	* @return array
171	*/
172	public function getColor() {
173	$devices = Breakpoints::names();
174
175	$css = [];
176	foreach ( $devices as $device ) {
177	if ( !empty( $this->color->{$device} ) ) {
178	$css[ $device]['background-color'] = $this->color->{$device};
179	}
180	}
181
182	return $css;
183	}
184
185	/**
186	* Get background overlay styles
187	*
188	* @return array
189	*/
190	public function getOverlayStyles() {
191	$default = [
192	"content" => '""',
193	"display" => "block",
194	"position"=> "absolute",
195	"top" => "0",
196	"bottom" => "0",
197	"right" => "0",
198	"left" => "0",
199	"z-index" => "1",
200	];
201
202	$devices = Breakpoints::names();
203
204	$css = [];
205	foreach ( $devices as $device ) {
206	if ( !empty( $this->overlay->{$device} ) && ('transparent' !== $this->overlay->{$device} ) ) {
207	$css[ $device] = $default;
208	$css[ $device]['background-color'] = $this->overlay->{$device};
209	}
210	}
211
212	return $css;
213	}
214
215	/**
216	* Get filter styles of background
217	*
218	* @return array\|mixed
219	*/
220	public function getSectionBackgroundFilter() {
221	if( empty( $this->filter ) ){
222	return [];
223	}
224	return $this->filter->set([]);
225	}
226
227	/**
228	* Get class name of background container
229	*
230	* @return string
231	*/
232	public function getContainerClassName() {
233	if ( !empty( $this->video->src ) ) {
234	return Selector::prefixify('bg-video-container');
235	}
236	return Selector::prefixify('bg-container');
237	}
238	}
239