Skip to content

Commit

Permalink
* **IMPORTANT**: This release has a breaking change if you are using …
Browse files Browse the repository at this point in the history
…the **Mux/Video Encoding** feature. If you are using the video.js or hls.js video player, you will need to enable the separate *Video Player* feature to continue using those players. There will be a notification in WordPress admin warning you about this, but only if it applies to you.

* Upgraded video.js player to latest 7.19.0
* Upgraded hls.js player to latest 1.1.5
* Separated the video player into it's own feature from the video encoding feature.
* Video player now supports playing any uploaded videos, not just Mux encoded videos.
* You can now allow video downloads for logged in users only in *Video Player Settings*
* The Video Player gutenberg block allows you to override the download setting for an individual video.
* Filmstrip generation can now be enabled regardless of video player in use.
  • Loading branch information
jawngee committed Apr 7, 2022
1 parent 232cbe5 commit b841444
Show file tree
Hide file tree
Showing 32 changed files with 1,075 additions and 303 deletions.
1 change: 1 addition & 0 deletions classes/Tools/ToolsManager.php
Original file line number Diff line number Diff line change
Expand Up @@ -336,6 +336,7 @@ public static function Boot()
ToolsManager::registerTool( "storage", include ILAB_CONFIG_DIR . '/storage.config.php' );
ToolsManager::registerTool( "imgix", include ILAB_CONFIG_DIR . '/imgix.config.php' );
ToolsManager::registerTool( "video-encoding", include ILAB_CONFIG_DIR . '/video-encoding.config.php' );
ToolsManager::registerTool( "video-player", include ILAB_CONFIG_DIR . '/video-player.config.php' );
ToolsManager::registerTool( "vision", include ILAB_CONFIG_DIR . '/vision.config.php' );
ToolsManager::registerTool( "crop", include ILAB_CONFIG_DIR . '/crop.config.php' );
ToolsManager::registerTool( "debugging", include ILAB_CONFIG_DIR . '/debugging.config.php' );
Expand Down
55 changes: 0 additions & 55 deletions classes/Tools/Video/Driver/Mux/MuxHooks.php
Original file line number Diff line number Diff line change
Expand Up @@ -60,12 +60,6 @@ public function __construct()
}

add_filter( 'template_include', [ $this, 'handleWebhook' ] );
add_filter(
'render_block',
[ $this, 'filterBlocks' ],
PHP_INT_MAX - 1,
2
);
}

//endregion
Expand Down Expand Up @@ -717,54 +711,5 @@ public function handleUpload( $attachmentId, $file, $meta )
{
$this->handleDirectUpload( $attachmentId, $meta );
}

//endregion
//region Content Filters
/**
* Filters the File block to include the goddamn attachment ID
*
* @param $block_content
* @param $block
*
* @return mixed
* @throws \Exception
*/
function filterBlocks( $block_content, $block )
{
if ( isset( $block['blockName'] ) ) {
if ( $block['blockName'] === 'media-cloud/mux-video-block' ) {
return $this->filterVideoBlock( $block_content, $block );
}
}
return $block_content;
}

protected function filterVideoBlock( $block_content, $block )
{
$muxId = arrayPath( $block, 'attrs/muxId', null );
$asset = MuxAsset::asset( $muxId );

if ( $asset !== null ) {
$classes = "mux-player";
$extras = "";
$metadata = [];
$metadataKey = sanitize_title( gen_uuid( 12 ) );
if ( !empty($this->settings->playerCSSClasses) ) {
$classes .= " {$this->settings->playerCSSClasses}";
}
$block_content = str_replace( '<video ', "<video class='{$classes}' {$extras} ", $block_content );
$url = $asset->videoUrl();
$source = "<source src='{$url}' type='application/x-mpegURL' />";
$block_content = str_replace( '<source/>', $source, $block_content );

if ( !empty($metadata) ) {
$metadataHTML = "<script id='mux-{$metadataKey}' type='application/json'>" . json_encode( $metadata, JSON_PRETTY_PRINT ) . "</script>";
$block_content .= "\n" . $metadataHTML;
}

}

return $block_content;
}

}
123 changes: 5 additions & 118 deletions classes/Tools/Video/Driver/Mux/MuxTool.php
Original file line number Diff line number Diff line change
Expand Up @@ -12,11 +12,8 @@
// **********************************************************************
namespace MediaCloud\Plugin\Tools\Video\Driver\Mux;

use Elementor\Elements_Manager ;
use Elementor\Plugin ;
use MediaCloud\Plugin\Tasks\TaskManager ;
use MediaCloud\Plugin\Tools\Video\Driver\Mux\Data\MuxDatabase ;
use MediaCloud\Plugin\Tools\Video\Driver\Mux\Elementor\MuxVideoWidget ;
use MediaCloud\Plugin\Tools\Video\Driver\Mux\Models\MuxAsset ;
use MediaCloud\Plugin\Tools\Video\Driver\Mux\Tasks\MigrateToMuxTask ;
use MediaCloud\Plugin\Tools\Tool ;
Expand All @@ -32,8 +29,6 @@ class MuxTool extends Tool
protected $settings = null ;
/** @var MuxHooks */
protected $hooks = null ;
/** @var MuxShortcode|null */
protected $shortCode = null ;
public function __construct( $toolName, $toolInfo, $toolManager )
{
$this->settings = MuxToolSettings::instance();
Expand All @@ -44,7 +39,6 @@ public function __construct( $toolName, $toolInfo, $toolManager )
5
);
parent::__construct( $toolName, $toolInfo, $toolManager );
$this->initBlocks();
}

//region Tool Overrides
Expand All @@ -70,7 +64,6 @@ public function setup()

if ( $this->enabled() ) {
MuxDatabase::init();
$this->shortCode = new MuxShortcode();
$this->hooks = new MuxHooks();

if ( is_admin() ) {
Expand All @@ -87,8 +80,7 @@ public function setup()
$this->integrateWithMediaLibrary();
$this->integrateWithAdmin();
}

static::enqueuePlayer( is_admin() );

}

}
Expand All @@ -103,21 +95,6 @@ public function hooks()
return $this->hooks;
}

//endregion
//region Static
public static function enqueuePlayer( $admin = false )
{
add_action( ( !empty($admin) ? 'admin_enqueue_scripts' : 'wp_enqueue_scripts' ), function () {
wp_enqueue_script(
'mux_video_player_hlsjs',
ILAB_PUB_JS_URL . '/mux-hls.js',
null,
null,
true
);
} );
}

//endregion
// region Settings
public function registerMuxSettingTypes(
Expand Down Expand Up @@ -170,99 +147,9 @@ public function providerHelp()
];
}

//endregion
//region Blocks
protected function initBlocks()
{
add_action( 'init', function () {
wp_register_style(
'mux_video_block_style',
ILAB_BLOCKS_URL . 'mediacloud-mux.blocks.style.css',
[ 'wp-editor' ],
null
);
wp_register_script(
'mux_video_block_js',
ILAB_BLOCKS_URL . 'mediacloud-mux.blocks.js',
[
'wp-blocks',
'wp-i18n',
'wp-element',
'wp-editor'
],
null,
true
);
wp_register_style(
'mux_video_block_editor_style',
ILAB_BLOCKS_URL . 'mediacloud-mux.blocks.editor.css',
[ 'wp-edit-blocks' ],
null
);
register_block_type( 'media-cloud/mux-video-block', [
'style' => 'mux_video_block_style',
'editor_script' => 'mux_video_block_js',
'editor_style' => 'mux_video_block_editor_style',
] );
} );
add_filter(
'block_categories_all',
function ( $categories, $editorContext ) {
foreach ( $categories as $category ) {
if ( $category['slug'] === 'mediacloud' ) {
return $categories;
}
}
$categories[] = [
'slug' => 'mediacloud',
'title' => 'Media Cloud',
'icon' => null,
];
return $categories;
},
10,
2
);

if ( class_exists( 'Elementor\\Plugin' ) ) {
add_action( 'elementor/widgets/widgets_registered', function () {
Plugin::instance()->widgets_manager->register_widget_type( new MuxVideoWidget() );
} );
add_action(
'elementor/elements/categories_registered',
function ( $elementsManager ) {
/** @var Elements_Manager $elementsManager */
$elementsManager->add_category( 'media-cloud', [
'title' => 'Media Cloud',
'icon' => 'fa fa-plug',
] );
},
10,
1
);
add_filter(
'the_content',
function ( $content ) {
return MuxVideoWidget::filterContent( $content );
},
PHP_INT_MAX,
1
);
add_action( 'wp_enqueue_scripts', function () {
wp_enqueue_style(
'mcloud-elementor',
trailingslashit( ILAB_PUB_CSS_URL ) . 'mcloud-elementor.css',
[],
MEDIA_CLOUD_VERSION
);
} );
}

}

//endregion
//region Integration
protected function handleCaptionDelete()
protected function actionCaptionDelete()
{
$nonce = arrayPath( $_POST, 'nonce' );
if ( empty($nonce) || !wp_verify_nonce( $nonce, 'mux-delete-caption' ) ) {
Expand Down Expand Up @@ -298,7 +185,7 @@ protected function handleCaptionDelete()
], 400 );
}

protected function handleCaptionUpload()
protected function actionCaptionUpload()
{
$nonce = arrayPath( $_POST, 'nonce' );
if ( empty($nonce) || !wp_verify_nonce( $nonce, 'mux-upload-caption' ) ) {
Expand Down Expand Up @@ -378,10 +265,10 @@ protected function integrateWithAdmin()

if ( current_user_can( 'manage_options' ) ) {
add_action( 'wp_ajax_mux-upload-caption', function () {
$this->handleCaptionUpload();
$this->actionCaptionUpload();
} );
add_action( 'wp_ajax_mux-delete-caption', function () {
$this->handleCaptionDelete();
$this->actionCaptionDelete();
} );
}

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -10,18 +10,19 @@
// WITHOUT ANY WARRANTY; without even the implied warranty of
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
// **********************************************************************
namespace MediaCloud\Plugin\Tools\Video\Driver\Mux;
namespace MediaCloud\Plugin\Tools\Video\Player;

use MediaCloud\Plugin\Tools\Video\Driver\Mux\Models\MuxAsset ;
use MediaCloud\Plugin\Utilities\View ;
use function MediaCloud\Plugin\Utilities\arrayPath ;
class MuxShortcode
use function MediaCloud\Plugin\Utilities\postIdExists ;
class VideoPlayerShortcode
{
/** @var MuxToolSettings|MuxToolProSettings|null */
/** @var VideoPlayerToolSettings|VideoPlayerToolProSettings|null */
private $settings = null ;
public function __construct()
{
$this->settings = MuxToolSettings::instance();
$this->settings = VideoPlayerToolSettings::instance();

if ( is_admin() ) {
global $pagenow, $typenow ;
Expand All @@ -34,34 +35,32 @@ public function __construct()
] ) && $typenow !== 'download' ) {
add_action( 'media_buttons', [ $this, 'addMediaButtons' ], 11 );
add_action( 'admin_footer', function () {
echo View::render_view( 'admin.mux-video-shortcode-editor', [] ) ;
echo View::render_view( 'admin.video-shortcode-editor', [] ) ;
} );
}

}

add_action( 'init', function () {
add_shortcode( "mux_video", [ $this, 'renderShortCode' ] );
add_shortcode( "mcloud_video", [ $this, 'renderShortCode' ] );
} );
}

public function addMediaButtons()
{
$img = '<span class="wp-media-buttons-icon mux-shortcode-icon" id="edd-media-button"></span>';
$output = '<a name="Add Mux Video" href="#" class="button mux-shortcode-wizard" style="padding-left: .4em;">' . $img . 'Add Mux Video' . '</a>';
$output = '<a name="Add Media Cloud Video" href="#" class="button mux-shortcode-wizard" style="padding-left: .4em;">' . $img . 'Add Media Cloud Video' . '</a>';
echo $output ;
}

public function renderShortCode( $attrs )
{
$muxId = $attrs['id'];
if ( empty($muxId) ) {
return '';
}
$asset = MuxAsset::assetForAttachment( $muxId );
if ( $asset === null ) {
$attachmentId = $attrs['id'];
if ( empty($attachmentId) || !postIdExists( $attachmentId ) ) {
return '';
}
$meta = wp_get_attachment_metadata( $attachmentId );
$tagAttributeList = [];
if ( arrayPath( $attrs, 'autoplay', 'false' ) !== 'false' ) {
$tagAttributeList[] = 'autoplay';
Expand All @@ -85,17 +84,50 @@ public function renderShortCode( $attrs )
$tagAttributes = implode( ' ', $tagAttributeList );
$classes = "mux-player";
$extras = "";
$asset = MuxAsset::assetForAttachment( $attachmentId );
if ( !empty($this->settings->playerCSSClasses) ) {
$classes .= " {$this->settings->playerCSSClasses}";
}
$extras .= " width={$asset->width} height={$asset->height}";
$posterUrl = get_the_post_thumbnail_url( $asset->attachmentId, 'full' );

if ( empty($asset) ) {
$width = intval( arrayPath( $meta, 'width', (int) 0 ) );
$height = intval( arrayPath( $meta, 'height', (int) 0 ) );
if ( !empty($width) && !empty($height) ) {
$extras .= " width={$asset->width} height={$asset->height}";
}
} else {
$extras .= " width={$asset->width} height={$asset->height}";
}

$posterUrl = get_the_post_thumbnail_url( $attachmentId, 'full' );
if ( !empty($posterUrl) ) {
$extras .= " poster='{$posterUrl}'";
}
$tag = "<figure><video class='{$classes}' {$extras} {$tagAttributes}>";
$url = $asset->videoUrl();
$source = "<source src='{$url}' type='application/x-mpegURL' />";

if ( empty($asset) ) {
$url = wp_get_attachment_url( $attachmentId );
$mime = arrayPath( $meta, 'mime_type', null );

if ( $mime === 'video/quicktime' ) {
$fileformat = arrayPath( $meta, 'fileformat', null );
if ( !empty($fileformat) && $fileformat === 'mp4' ) {
$mime = 'video/mp4';
}
}


if ( !empty($mime) ) {
$source = "<source src='{$url}' type='{$mime}' />";
} else {
$source = "<source src='{$url}' />";
}

} else {
$url = $asset->videoUrl();
$source = "<source src='{$url}' type='application/x-mpegURL' />";
}

$tag .= $source . '</video></figure>';
return $tag;
}
Expand Down
Loading

0 comments on commit b841444

Please sign in to comment.