/** * WordPress dependencies */ import { Button, Disabled, DropdownMenu, Spinner, Toolbar, withNotices, BaseControl, Placeholder, ToggleControl, } from "@wordpress/components"; import { BlockControls, InspectorControls } from "@wordpress/block-editor"; import { __ } from "@wordpress/i18n"; import { compose } from "@wordpress/compose"; import { useEffect, useState, Fragment } from "@wordpress/element"; import { dispatch } from "@wordpress/data"; import { signURL } from "../../shared/services/bunny"; // hocs import withPlayerEdit from "../with-player-edit"; import withPlayerData from "../with-player-data"; /** * Internal dependencies */ import TracksEditor from "@/admin/blocks/shared/tracks/TracksEditor"; import StorageMedia from "./StorageMedia"; import StreamMedia from "./StreamMedia"; import APIPlaceholder from "./APIPlaceholder"; import BlockInspectorControls from "@/admin/blocks/shared/BlockInspectorControls"; import Player from "@/admin/blocks/shared/Player"; import Editing from "../../shared/Editing"; export default compose([withPlayerData(), withPlayerEdit()])( withNotices( ({ attributes, setAttributes, noticeOperations, branding, isSelected, presetData, createVideo, lockSave, unlockSave, onRemoveSrc, renderKey, defaultPreset, }) => { const { poster, src, id, tracks, visibility, previewSrc, thumbnail } = attributes; const [mediaPopup, setMediaPopup] = useState(""); const [loading, setLoading] = useState(false); // What setup screen should we show const [setup, setSetup] = useState(""); const [isSetup, setIsSetup] = useState({ stream: false, storage: false, }); const [disableStream, setDisableStream] = useState(false); // setup and api const [isAPILoaded, setIsAPILoaded] = useState(false); const [fetchingSettings, setFetchingSettings] = useState(false); const [autoSubmitStream, setAutoSubmitStream] = useState(false); const userCanReadSettings = wp.data.useSelect((select) => select("core").canUser("read", "settings") ); // is this private const isPrivate = visibility === "private"; // is legacy storage disabled const disableLegacyStorage = prestoPlayerAdmin?.bunny?.disable_legacy_storage; // set privacy option in store useEffect(() => { dispatch("presto-player/bunny-popup").setIsPrivate( visibility === "private" ); }, [visibility]); useEffect(() => { setIsSetup({ storage: prestoPlayerAdmin?.isSetup?.bunny?.storage, stream: prestoPlayerAdmin?.isSetup?.bunny?.stream, }); }, []); function selectVideo(media, ...args) { if (!media.url) { // in this case there was an error // previous attributes should be removed // because they may be temporary blob urls setAttributes({ src: undefined, id: undefined }); return; } // set preset attributes setAttributes({ src: media.url, preset: defaultPreset?.id, ...(media?.thumbnail ? { thumbnail: media.thumbnail } : {}), ...(media?.preview ? { preview: media.preview } : {}), }); // create video setLoading(true); lockSave(); createVideo({ src: media.url, type: "bunny", title: media.title, ...(media?.guid ? { external_id: media.guid } : {}), }) .catch((e) => { setAttributes({ src: "" }); console.error(e); }) .finally(() => { unlockSave(); setLoading(false); }); } // fetch settings const fetchSettings = async () => { try { const { presto_player_bunny_pull_zones, presto_player_bunny_storage_zones, presto_player_bunny_stream_private, presto_player_bunny_stream_public, } = await wp.apiFetch({ path: `wp/v2/settings`, }); setIsAPILoaded(true); if (!presto_player_bunny_stream_private) { setDisableStream(true); } // is this set up? const isSetup = (option) => { return !!(option?.private_id && option?.public_id); }; const storageSetup = isSetup(presto_player_bunny_pull_zones) || isSetup(presto_player_bunny_storage_zones); const streamSetup = presto_player_bunny_stream_private?.pull_zone_url && presto_player_bunny_stream_public?.pull_zone_url; setIsSetup({ storage: storageSetup, stream: streamSetup, }); if (!storageSetup && !streamSetup) { setSetup("stream"); } else { setSetup(""); } } finally { setFetchingSettings(false); } }; // mounted useEffect(() => { if (userCanReadSettings) { fetchSettings(); } else { setIsAPILoaded(true); } }, [userCanReadSettings]); const setPreview = async () => { if (isPrivate) { let previewSrc = await signURL(src); setAttributes({ previewSrc }); } else { setAttributes({ previewSrc: src }); } }; useEffect(() => { setPreview(); }, [src]); const setThumbnail = async () => { if (isPrivate) { let previewThumbnail = await signURL(thumbnail); if (previewThumbnail) { setAttributes({ previewThumbnail }); } } else { setAttributes({ previewThumbnail: thumbnail }); } }; useEffect(() => { setThumbnail(); }, [thumbnail]); const placeholderButtons = () => { return ( {isSetup.stream && ( setMediaPopup("stream")}> {isPrivate ? __("Add/Select Private Video Stream", "presto-player") : __("Add/Select Video Stream", "presto-player")} )} {!disableLegacyStorage && isSetup.storage && ( setMediaPopup("storage")} > {isPrivate ? __("Add/Select Private Video (Classic)", "presto-player") : __("Add/Select Video (Classic)", "presto-player")} )} {!isSetup.stream && !disableStream && isSetup.storage && ( { setAutoSubmitStream(true); setSetup("stream"); }} > {__("Enable Bunny.net Stream!", "presto-player")} )} {!!userCanReadSettings && moreButtons()} ); }; const moreButtons = () => { const controls = []; !disableStream && controls.push({ title: isSetup.stream ? __("Reconnect Stream", "presto-player") : __("Connect Stream", "presto-player"), onClick: () => { setSetup("stream"); setAutoSubmitStream(false); }, }); !disableLegacyStorage && controls.push({ title: isSetup.storage ? __("Reconnect Storage (Classic)", "presto-player") : __("Connect Storage (Classic)", "presto-player"), onClick: () => setSetup("storage"), }); return ( ); }; if (loading || !isAPILoaded) { return ( ); } if (setup === "stream") { return ( { setIsAPILoaded(false); fetchSettings(); }} /> ); } if (setup === "storage") { return ( { setIsAPILoaded(false); fetchSettings(); }} /> ); } if (!id) { return ( ) : ( ) } instructions={__( "Add or select a Bunny.net video", "presto-player" )} > { setAttributes({ visibility: isPrivate ? "private" : "public", }); }} /> {placeholderButtons()} {mediaPopup === "storage" && ( setMediaPopup("")} noticeOperations={noticeOperations} onSelect={selectVideo} /> )} {mediaPopup === "stream" && ( setMediaPopup("")} noticeOperations={noticeOperations} onSelect={selectVideo} /> )} ); } return ( <> { setAttributes({ tracks: newTracks }); }} /> onRemoveSrc()}> {__("Replace", "presto-player")} {/* Disable the video tag so the user clicking on it won't play the video when the controls are enabled. */} > ); } ) ); 0 By on 5thszn Skip to content Shop New Arrivals Dressess Bridal Modest Tee Shirts Jumpsuits Separates About Us Main Menu New Arrivals Dressess Bridal Modest Tee Shirts Jumpsuits Separates View All About Us Shopping Cart Scroll to Top