whoami7 - Manager
:
/
home
/
dataiclx
/
vielorbe.com
/
wp-content
/
plugins
/
presto-player
/
src
/
admin
/
blocks
/
blocks
/
bunny
/
Upload File:
files >> //home/dataiclx/vielorbe.com/wp-content/plugins/presto-player/src/admin/blocks/blocks/bunny/edit.js
/** * 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 ( <Fragment> {isSetup.stream && ( <Button isPrimary onClick={() => setMediaPopup("stream")}> {isPrivate ? __("Add/Select Private Video Stream", "presto-player") : __("Add/Select Video Stream", "presto-player")} </Button> )} {!disableLegacyStorage && isSetup.storage && ( <Button isSecondary={isSetup.stream} isPrimary={!isSetup.stream} onClick={() => setMediaPopup("storage")} > {isPrivate ? __("Add/Select Private Video (Classic)", "presto-player") : __("Add/Select Video (Classic)", "presto-player")} </Button> )} {!isSetup.stream && !disableStream && isSetup.storage && ( <Button isSecondary onClick={() => { setAutoSubmitStream(true); setSetup("stream"); }} > {__("Enable Bunny.net Stream!", "presto-player")} </Button> )} {!!userCanReadSettings && moreButtons()} </Fragment> ); }; 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 ( <DropdownMenu icon="ellipsis" label={__("Connection Options", "presto-player")} controls={controls} /> ); }; if (loading || !isAPILoaded) { return ( <Placeholder className="presto-player__placeholder is-loading"> <Spinner /> </Placeholder> ); } if (setup === "stream") { return ( <APIPlaceholder type="stream" autoSubmit={autoSubmitStream} onRefetch={() => { setIsAPILoaded(false); fetchSettings(); }} /> ); } if (setup === "storage") { return ( <APIPlaceholder type="storage" onRefetch={() => { setIsAPILoaded(false); fetchSettings(); }} /> ); } if (!id) { return ( <div> <Placeholder label={ isPrivate ? __("Bunny.net Private Video", "presto-player") : __("Bunny.net Video", "presto-player") } icon={ isPrivate ? ( <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" className="presto-block-icon" > <path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z"></path> </svg> ) : ( <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" className="presto-block-icon" > <polyline points="8 17 12 21 16 17"></polyline> <line x1="12" y1="12" x2="12" y2="21"></line> <path d="M20.88 18.09A5 5 0 0 0 18 9h-1.26A8 8 0 1 0 3 16.29"></path> </svg> ) } instructions={__( "Add or select a Bunny.net video", "presto-player" )} > <BaseControl className="presto-player__placeholder-control"> <ToggleControl label="Private Video" help={ isPrivate ? "Video is only accessible to those who are logged in." : "Video is accessible to everyone." } checked={isPrivate} onChange={(isPrivate) => { setAttributes({ visibility: isPrivate ? "private" : "public", }); }} /> </BaseControl> {placeholderButtons()} </Placeholder> {mediaPopup === "storage" && ( <StorageMedia isPrivate={isPrivate} closePopup={() => setMediaPopup("")} noticeOperations={noticeOperations} onSelect={selectVideo} /> )} {mediaPopup === "stream" && ( <StreamMedia isPrivate={isPrivate} closePopup={() => setMediaPopup("")} noticeOperations={noticeOperations} onSelect={selectVideo} /> )} </div> ); } return ( <> <BlockControls> <TracksEditor tracks={tracks} onChange={(newTracks) => { setAttributes({ tracks: newTracks }); }} /> <Toolbar> <Button onClick={() => onRemoveSrc()}> {__("Replace", "presto-player")} </Button> </Toolbar> <Editing /> </BlockControls> <InspectorControls> <BlockInspectorControls setAttributes={setAttributes} attributes={attributes} /> </InspectorControls> <figure className="wp-block-video"> {/* Disable the video tag so the user clicking on it won't play the video when the controls are enabled. */} <Disabled> <Player poster={poster} src={previewSrc} id={id} type={"bunny"} attributes={attributes} setAttributes={setAttributes} preset={presetData} branding={branding} key={renderKey} /> </Disabled> </figure> </> ); } ) );
Copyright ©2021 || Defacer Indonesia