Omit able player if defined class is set.

See #13

Author: joedolson

src/assets/css/admin.css

@@ -158,6 +158,20 @@
 	padding: 10px;
 }
 
+.ableplayer-tabs .label-number,
+.ableplayer-tabs .label-select,
+.ableplayer-tabs .label-text {
+	display: block;
+}
+
+.ableplayer-input-description {
+	display: inline-flex;
+	align-items: center;
+	border-left: 4px solid #72aee6;
+	box-shadow: 0 3px 6px #ddd;
+	padding: 4px;
+}
+
 @media screen and ( width < 481px ) {
 	.ableplayer-tabs.vertical {
 		display: flex;

src/assets/js/media.js

@@ -9,12 +9,18 @@ if ( 0 !== ableplayer_selectors.length ) {
 	const mediaEls = document.querySelectorAll( ableplayer_selectors );
 	if ( mediaEls ) {
 		mediaEls.forEach((el,index,listObj) => {
-			el.removeAttribute( 'controls' );
-			if ( ! el.hasAttribute( 'data-able-player' ) ) {
-				el.setAttribute( 'data-able-player', 'true' );
-			}
-			if ( ! el.hasAttribute( 'id' ) ) {
-				el.setAttribute( 'id', 'able-player-id-' + index );
+			let excludeClass = ableplayer.settings.exclude_class;
+			if ( excludeClass !== '' && el.classList.contains( excludeClass ) || el.closest( 'figure' ).classList.contains( excludeClass ) ) {
+				el.classList.add( 'ableplayer-skipped' );
+			} else {
+				el.removeAttribute( 'controls' );
+
+				if ( ! el.hasAttribute( 'data-able-player' ) ) {
+					el.setAttribute( 'data-able-player', 'true' );
+				}
+				if ( ! el.hasAttribute( 'id' ) ) {
+					el.setAttribute( 'id', 'able-player-id-' + index );
+				}
 			}
 		});
 	}

src/inc/settings.php

@@ -249,6 +249,7 @@ function ableplayer_update_settings( $post ) {
 	$settings          = array();
 	$replace_video     = ( ! empty( $post['replace_video'] ) && 'on' === $post['replace_video'] ) ? 'true' : 'false';
 	$replace_audio     = ( ! empty( $post['replace_audio'] ) && 'on' === $post['replace_audio'] ) ? 'true' : 'false';
+	$exclude_class     = ( ! empty( $post['exclude_class'] ) ) ? sanitize_text_field( $post['exclude_class'] ) : '';
 	$replace_playlists = ( ! empty( $post['replace_playlists'] ) && 'on' === $post['replace_playlists'] ) ? 'true' : 'false';
 	$youtube_nocookie  = ( ! empty( $post['youtube_nocookie'] ) && 'on' === $post['youtube_nocookie'] ) ? 'true' : 'false';
 	$play_inline       = ( ! empty( $post['play_inline'] ) && 'on' === $post['play_inline'] ) ? 'true' : 'false';
@@ -260,6 +261,7 @@ function ableplayer_update_settings( $post ) {
 
 	$settings['replace_video']     = $replace_video;
 	$settings['replace_audio']     = $replace_audio;
+	$settings['exclude_class']     = $exclude_class;
 	$settings['replace_playlists'] = $replace_playlists;
 	$settings['youtube_nocookie']  = $youtube_nocookie;
 	$settings['seek_interval']     = $seek_interval;
@@ -333,6 +335,18 @@ function ableplayer_settings_form() {
 								</p>
 								<p>
 								<?php
+								ableplayer_settings_field(
+									array(
+										'name'    => 'exclude_class',
+										'label'   => __( 'Exclude class from Able Player parsing', 'ableplayer' ),
+										'note'    => __( 'Disable Able Player on <code>video</code> or <code>audio</code> elements with this class or with a parent element with the class.', 'ableplayer' ),
+										'type'    => 'text',
+									)
+								);
+								?>
+								</p>
+								<p>
+								<?php
 								ableplayer_settings_field(
 									array(
 										'name'  => 'replace_playlists',
@@ -556,6 +570,7 @@ function ableplayer_default_settings() {
 	$settings = array(
 		'replace_video'     => 'false',
 		'replace_audio'     => 'false',
+		'exclude_class'     => '',
 		'replace_playlists' => 'false',
 		'youtube_nocookie'  => 'false',
 		'play_inline'       => 'true',