From a9b3b28d001941921aa70d37fdc87c758a163a44 Mon Sep 17 00:00:00 2001
From: Jake Vanderwerf <get@jakevanderwerf.ca>
Date: Fri, 05 Jun 2026 16:47:03 +0000
Subject: [PATCH] =Some hefty changes to FeedBlock. Transitioning to loading first page in php to save on extra requests. Got a bit to do yet, but I have to work on Northeh for a bit here.
---
src/video/edit.js | 113 ++++++++++++++++++++++----------------------------------
1 files changed, 44 insertions(+), 69 deletions(-)
diff --git a/src/video/edit.js b/src/video/edit.js
index df46c62..9830e65 100644
--- a/src/video/edit.js
+++ b/src/video/edit.js
@@ -1,3 +1,4 @@
+//edit.js
import { __ } from '@wordpress/i18n';
import {
useBlockProps,
@@ -17,7 +18,7 @@
} from '@wordpress/components';
import './editor.scss';
-const ALLOWED_VIDEO_TYPES = ['video/mp4', 'video/webm', 'video/ogg', 'video/ogv'];
+const ALLOWED_VIDEO_TYPES = ['video'];
const INNER_BLOCKS_TEMPLATE = [
['core/heading', {
@@ -34,12 +35,13 @@
}]
];
+
+
export default function Edit({ attributes, setAttributes }) {
const {
posterId,
posterUrl,
videoSources,
- mobileSources,
fadeEffect,
overlayOpacity,
contentAlignment,
@@ -68,42 +70,28 @@
});
};
- const onSelectVideo = (media, isMobile = false) => {
- const newSource = {
- id: media.id,
- url: media.url,
- mime: media.mime
- };
+ const onSelectVideos = (mediaItems) => {
+ // multiple=true returns an array
+ const items = Array.isArray(mediaItems) ? mediaItems : [mediaItems];
+ const newSources = items
+ .filter(media => !videoSources.some(s => s.id === media.id))
+ .map(media => ({
+ id: media.id,
+ url: media.url,
+ mime: media.mime
+ }));
- if (isMobile) {
- // Check if this format already exists in mobile sources
- const exists = mobileSources.some(s => s.mime === media.mime);
- if (!exists) {
- setAttributes({
- mobileSources: [...mobileSources, newSource]
- });
- }
- } else {
- // Check if this format already exists in desktop sources
- const exists = videoSources.some(s => s.mime === media.mime);
- if (!exists) {
- setAttributes({
- videoSources: [...videoSources, newSource]
- });
- }
+ if (newSources.length) {
+ setAttributes({
+ videoSources: [...videoSources, ...newSources]
+ });
}
};
- const removeVideoSource = (index, isMobile = false) => {
- if (isMobile) {
- const updated = [...mobileSources];
- updated.splice(index, 1);
- setAttributes({ mobileSources: updated });
- } else {
- const updated = [...videoSources];
- updated.splice(index, 1);
- setAttributes({ videoSources: updated });
- }
+ const removeVideoSource = (index) => {
+ const updated = [...videoSources];
+ updated.splice(index, 1);
+ setAttributes({ videoSources: updated });
};
const renderVideoSourceList = (sources, isMobile = false) => {
@@ -173,43 +161,33 @@
</BaseControl>
<BaseControl
- label={__('Desktop Video Sources', 'jvb')}
- help={__('Add multiple formats for better browser support', 'jvb')}
+ label={__('Video Sources', 'jvb')}
+ help={__('Add multiple formats for better browser support (mp4, webm, etc.)', 'jvb')}
>
- {renderVideoSourceList(videoSources, false)}
+ {videoSources.length > 0 && (
+ <ul className="video-source-list">
+ {videoSources.map((source, index) => (
+ <li key={index} className="video-source-item">
+ <span className="video-source-mime">{source.mime}</span>
+ <Button
+ isDestructive
+ isSmall
+ onClick={() => removeVideoSource(index)}
+ >
+ {__('Remove', 'jvb')}
+ </Button>
+ </li>
+ ))}
+ </ul>
+ )}
<MediaUploadCheck>
<MediaUpload
- multiple={ true }
- onSelect={(media) => onSelectVideo(media, false)}
+ multiple={true}
+ onSelect={onSelectVideos}
allowedTypes={ALLOWED_VIDEO_TYPES}
render={({ open }) => (
- <Button
- onClick={open}
- variant="secondary"
- >
- {__('Add Desktop Video', 'jvb')}
- </Button>
- )}
- />
- </MediaUploadCheck>
- </BaseControl>
-
- <BaseControl
- label={__('Mobile Video Sources (Optional)', 'jvb')}
- help={__('Smaller videos for mobile devices', 'jvb')}
- >
- {renderVideoSourceList(mobileSources, true)}
- <MediaUploadCheck>
- <MediaUpload
- multiple={ true }
- onSelect={(media) => onSelectVideo(media, true)}
- allowedTypes={ALLOWED_VIDEO_TYPES}
- render={({ open }) => (
- <Button
- onClick={open}
- variant="secondary"
- >
- {__('Add Mobile Video', 'jvb')}
+ <Button onClick={open} variant="secondary">
+ {__('Add Video', 'jvb')}
</Button>
)}
/>
@@ -284,9 +262,6 @@
<div className="video-info">
<p>
{videoSources.length} {__('desktop source(s)', 'jvb')}
- {mobileSources.length > 0 &&
- `, ${mobileSources.length} ${__('mobile source(s)', 'jvb')}`
- }
</p>
</div>
</div>
--
Gitblit v1.10.0