Pass sizing attribute to determine if responsiveness should be enabled

10up · Jan 17, 2022 · 542df19 · 542df19
1 parent 4a243c6
commit 542df19
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 3 deletions.
diff --git a/includes/class-bc-playlist-shortcode.php b/includes/class-bc-playlist-shortcode.php
@@ -27,6 +27,7 @@ public static function bc_playlist( $atts ) {
 			'autoplay'    => '',
 			'mute'        => '',
 			'embed'       => '',
+			'sizing'      => 'responsive',
 			'padding_top' => '56.25%',
 			'min_width'   => '0px',
 			'max_width'   => '100%',

diff --git a/includes/class-bc-utility.php b/includes/class-bc-utility.php
@@ -822,6 +822,7 @@ public static function get_video_player( $atts ) {
 		$id          = self::sanitize_id( $atts['video_id'] );
 		$height      = sanitize_text_field( $atts['height'] );
 		$width       = sanitize_text_field( $atts['width'] );
+		$sizing      = sanitize_text_field( $atts['sizing'] );
 		$min_width   = sanitize_text_field( $atts['min_width'] );
 		$max_width   = sanitize_text_field( $atts['max_width'] );
 		$padding_top = sanitize_text_field( $atts['padding_top'] );
@@ -863,7 +864,7 @@ class="vjs-fluid"
 							data-usage="<?php echo esc_attr( self::get_usage_data() ); ?>javascript"
 							data-embed="default" class="video-js"
 							controls <?php echo esc_attr( $playsinline ); ?> <?php echo esc_attr( $autoplay ); ?> <?php echo esc_attr( $mute ); ?>
-							style="width: <?php echo esc_attr( $width ); ?>; height: <?php echo esc_attr( $height ); ?>; position: absolute; top: 0; bottom: 0; right: 0; left: 0;">
+							style="width: <?php echo 'responsive' !== $sizing ? esc_attr( $width ) : '100%'; ?>; height: <?php echo esc_attr( $height ); ?>; position: absolute; top: 0; bottom: 0; right: 0; left: 0;">
 					</video>
 
 					<script src="<?php echo esc_url( $js_src ); ?>"></script>
@@ -892,7 +893,7 @@ class="vjs-fluid"
 							allowfullscreen
 							webkitallowfullscreen
 							mozallowfullscreen
-							style="width: <?php echo esc_attr( $width ); ?>; height: <?php echo esc_attr( $height ); ?>; position: absolute; top: 0; bottom: 0; right: 0; left: 0;">
+                            style="width: <?php echo 'responsive' !== $sizing ? esc_attr( $width ) : '100%'; ?>; height: <?php echo esc_attr( $height ); ?>; position: absolute; top: 0; bottom: 0; right: 0; left: 0;">
 					</iframe>
 				</div>
 			</div>
@@ -960,6 +961,7 @@ public static function get_playlist_player( $atts ) {
 		$id          = self::sanitize_id( $atts['playlist_id'] );
 		$height      = sanitize_text_field( $atts['height'] );
 		$width       = sanitize_text_field( $atts['width'] );
+		$sizing      = sanitize_text_field( $atts['sizing'] );
 		$min_width   = sanitize_text_field( $atts['min_width'] );
 		$max_width   = sanitize_text_field( $atts['max_width'] );
 		$padding_top = sanitize_text_field( $atts['padding_top'] );
@@ -1116,7 +1118,7 @@ class="video-js"
 							allowfullscreen
 							webkitallowfullscreen
 							mozallowfullscreen
-							style="width: <?php echo esc_attr( $width ); ?>; height: <?php echo esc_attr( $height ); ?>; position: absolute; top: 0; bottom: 0; right: 0; left: 0;">
+							style="width: <?php echo 'responsive' !== $sizing ? esc_attr( $width ) : '100%'; ?>; height: <?php echo esc_attr( $height ); ?>; position: absolute; top: 0; bottom: 0; right: 0; left: 0;">
 					</iframe>
 				</div>
 			</div>

diff --git a/includes/class-bc-video-shortcode.php b/includes/class-bc-video-shortcode.php
@@ -30,6 +30,7 @@ public static function bc_video( $atts ) {
 			'autoplay'           => '',
 			'mute'               => '',
 			'embed'              => '',
+			'sizing'             => 'responsive',
 			'padding_top'        => '56.25%',
 			'min_width'          => '0px',
 			'max_width'          => '100%',