mirror of
https://github.com/balzack/databag.git
synced 2025-02-12 03:29:16 +00:00
adding audio support
This commit is contained in:
Roland Osborne
parent
e64490f994
commit
641b553999
@ -11,6 +11,7 @@
|
||||
"react": "^17.0.2",
|
||||
"react-dom": "^17.0.2",
|
||||
"react-easy-crop": "^4.1.4",
|
||||
"react-player": "^2.10.0",
|
||||
"react-resize-detector": "^7.0.0",
|
||||
"react-router-dom": "^6.2.2",
|
||||
"react-scripts": "5.0.0",
|
||||
|
||||
@ -1,4 +1,5 @@
|
||||
import React, { useState, useRef } from 'react';
|
||||
import ReactPlayer from 'react-player'
|
||||
import { Button, Dropdown, Input, Tooltip, Menu } from 'antd';
|
||||
import { AddTopicWrapper, BusySpin } from './AddTopic.styled';
|
||||
import { Carousel } from '../../../Carousel/Carousel';
|
||||
@ -69,10 +70,10 @@ export function AddTopic() {
|
||||
return <img style={{ height: '100%', objectFit: 'contain' }} src={item.url} alt="" />
|
||||
}
|
||||
if (item.audio) {
|
||||
return <img style={{ height: '100%', objectFit: 'contain' }} src={test} alt="" />
|
||||
return <ReactPlayer height="100%" width="auto" url={item.url} />
|
||||
}
|
||||
if (item.video) {
|
||||
return <img style={{ height: '100%', objectFit: 'contain' }} src={login} alt="" />
|
||||
return <ReactPlayer height="100%" width="auto" url={item.url} />
|
||||
}
|
||||
return <></>
|
||||
}
|
||||
|
||||
@ -1,4 +1,5 @@
|
||||
import React, { useEffect, useState } from 'react';
|
||||
import ReactPlayer from 'react-player'
|
||||
import { TopicItemWrapper } from './TopicItem.styled';
|
||||
import ReactResizeDetector from 'react-resize-detector';
|
||||
import { useTopicItem } from './useTopicItem.hook';
|
||||
@ -19,6 +20,12 @@ export function TopicItem({ topic }) {
|
||||
if (asset.image) {
|
||||
return <img style={{ height: '100%', objectFit: 'container' }} src={actions.getAssetUrl(asset.image.full)} alt="" />
|
||||
}
|
||||
if (asset.video) {
|
||||
return <ReactPlayer height="100%" width="auto" controls="true" url={actions.getAssetUrl(asset.video.full)} />
|
||||
}
|
||||
if (asset.audio) {
|
||||
return <ReactPlayer height="100%" width="auto" controls="true" url={actions.getAssetUrl(asset.audio.full)} />
|
||||
}
|
||||
return <></>
|
||||
}
|
||||
|
||||
|
||||
@ -38,13 +38,12 @@ export async function addChannelTopic(token, channelId, message, assets ) {
|
||||
else if (asset.video) {
|
||||
const formData = new FormData();
|
||||
formData.append('asset', asset.video);
|
||||
let transform = encodeURIComponent(JSON.stringify(["vthumb;video", "vcopy;video"]));
|
||||
let transform = encodeURIComponent(JSON.stringify(["vcopy;video"]));
|
||||
let topicAsset = await fetch(`/content/channels/${channelId}/topics/${slot.id}/assets?transforms=${transform}&agent=${token}`, { method: 'POST', body: formData });
|
||||
checkResponse(topicAsset);
|
||||
let assetEntry = await topicAsset.json();
|
||||
message.assets.push({
|
||||
image: {
|
||||
thumb: assetEntry.find(item => item.transform === 'vthumb;video').assetId,
|
||||
video: {
|
||||
full: assetEntry.find(item => item.transform === 'vcopy;video').assetId,
|
||||
}
|
||||
});
|
||||
@ -57,7 +56,7 @@ export async function addChannelTopic(token, channelId, message, assets ) {
|
||||
checkResponse(topicAsset);
|
||||
let assetEntry = await topicAsset.json();
|
||||
message.assets.push({
|
||||
image: {
|
||||
audio: {
|
||||
full: assetEntry.find(item => item.transform === 'acopy;audio').assetId,
|
||||
}
|
||||
});
|
||||
|
||||
@ -39,13 +39,12 @@ export async function addContactChannelTopic(server, token, channelId, message,
|
||||
else if (asset.video) {
|
||||
const formData = new FormData();
|
||||
formData.append('asset', asset.video);
|
||||
let transform = encodeURIComponent(JSON.stringify(["vthumb;video", "vcopy;video"]));
|
||||
let transform = encodeURIComponent(JSON.stringify(["vcopy;video"]));
|
||||
let topicAsset = await fetch(`https://${server}/content/channels/${channelId}/topics/${slot.id}/assets?transforms=${transform}&contact=${token}`, { method: 'POST', body: formData });
|
||||
checkResponse(topicAsset);
|
||||
let assetEntry = await topicAsset.json();
|
||||
message.assets.push({
|
||||
image: {
|
||||
thumb: assetEntry.find(item => item.transform === 'vthumb;video').assetId,
|
||||
video: {
|
||||
full: assetEntry.find(item => item.transform === 'vcopy;video').assetId,
|
||||
}
|
||||
});
|
||||
@ -58,7 +57,7 @@ export async function addContactChannelTopic(server, token, channelId, message,
|
||||
checkResponse(topicAsset);
|
||||
let assetEntry = await topicAsset.json();
|
||||
message.assets.push({
|
||||
image: {
|
||||
audio: {
|
||||
full: assetEntry.find(item => item.transform === 'acopy;audio').assetId,
|
||||
}
|
||||
});
|
||||
|
||||
@ -3578,7 +3578,7 @@ deep-is@^0.1.3, deep-is@~0.1.3:
|
||||
resolved "https://registry.npmjs.org/deep-is/-/deep-is-0.1.4.tgz"
|
||||
integrity sha512-oIPzksmTg4/MriiaYGO+okXDT7ztn/w3Eptv/+gSIdMdKsJo0u4CfYNFJPy+4SKMuCqGw2wxnA+URMg3t8a/bQ==
|
||||
|
||||
deepmerge@^4.2.2:
|
||||
deepmerge@^4.0.0, deepmerge@^4.2.2:
|
||||
version "4.2.2"
|
||||
resolved "https://registry.npmjs.org/deepmerge/-/deepmerge-4.2.2.tgz"
|
||||
integrity sha512-FJ3UgI4gIl+PHZm53knsuSFpE+nESMr7M4v9QcgB7S63Kj/6WqMiFQJpBBYz1Pt+66bZpP3Q7Lye0Oo9MPKEdg==
|
||||
@ -5861,6 +5861,11 @@ lines-and-columns@^1.1.6:
|
||||
resolved "https://registry.npmjs.org/lines-and-columns/-/lines-and-columns-1.2.4.tgz"
|
||||
integrity sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==
|
||||
|
||||
load-script@^1.0.0:
|
||||
version "1.0.0"
|
||||
resolved "https://registry.yarnpkg.com/load-script/-/load-script-1.0.0.tgz#0491939e0bee5643ee494a7e3da3d2bac70c6ca4"
|
||||
integrity sha1-BJGTngvuVkPuSUp+PaPSuscMbKQ=
|
||||
|
||||
loader-runner@^4.2.0:
|
||||
version "4.2.0"
|
||||
resolved "https://registry.npmjs.org/loader-runner/-/loader-runner-4.2.0.tgz"
|
||||
@ -6018,6 +6023,11 @@ memfs@^3.1.2, memfs@^3.4.1:
|
||||
dependencies:
|
||||
fs-monkey "1.0.3"
|
||||
|
||||
memoize-one@^5.1.1:
|
||||
version "5.2.1"
|
||||
resolved "https://registry.yarnpkg.com/memoize-one/-/memoize-one-5.2.1.tgz#8337aa3c4335581839ec01c3d594090cebe8f00e"
|
||||
integrity sha512-zYiwtZUcYyXKo/np96AGZAckk+FWWsUdJ3cHGGmld7+AhvcWmQyGCYUh1hc4Q/pkOhb65dQR/pqCyK0cOaHz4Q==
|
||||
|
||||
memoize-one@^6.0.0:
|
||||
version "6.0.0"
|
||||
resolved "https://registry.npmjs.org/memoize-one/-/memoize-one-6.0.0.tgz"
|
||||
@ -7673,6 +7683,11 @@ react-error-overlay@^6.0.10:
|
||||
resolved "https://registry.npmjs.org/react-error-overlay/-/react-error-overlay-6.0.10.tgz"
|
||||
integrity sha512-mKR90fX7Pm5seCOfz8q9F+66VCc1PGsWSBxKbITjfKVQHMNF2zudxHnMdJiB1fRCb+XsbQV9sO9DCkgsMQgBIA==
|
||||
|
||||
react-fast-compare@^3.0.1:
|
||||
version "3.2.0"
|
||||
resolved "https://registry.yarnpkg.com/react-fast-compare/-/react-fast-compare-3.2.0.tgz#641a9da81b6a6320f270e89724fb45a0b39e43bb"
|
||||
integrity sha512-rtGImPZ0YyLrscKI9xTpV8psd6I8VAtjKCzQDlzyDvqJA8XOW78TXYQwNRNd8g8JZnDu8q9Fu/1v4HPAVwVdHA==
|
||||
|
||||
react-is@^16.12.0, react-is@^16.13.1, react-is@^16.7.0:
|
||||
version "16.13.1"
|
||||
resolved "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz"
|
||||
@ -7688,6 +7703,17 @@ react-lifecycles-compat@^3.0.4:
|
||||
resolved "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz"
|
||||
integrity sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA==
|
||||
|
||||
react-player@^2.10.0:
|
||||
version "2.10.0"
|
||||
resolved "https://registry.yarnpkg.com/react-player/-/react-player-2.10.0.tgz#bd3e0f10ae756cc644efb14177a515d455d97e20"
|
||||
integrity sha512-PccIqea9nxSHAdai6R+Yj9lp6tb2lyXWbaF6YVHi5uO4FiXYMKKr9rMXJrivwV5vXwQa65rYKBmwebsBmRTT3w==
|
||||
dependencies:
|
||||
deepmerge "^4.0.0"
|
||||
load-script "^1.0.0"
|
||||
memoize-one "^5.1.1"
|
||||
prop-types "^15.7.2"
|
||||
react-fast-compare "^3.0.1"
|
||||
|
||||
react-refresh@^0.11.0:
|
||||
version "0.11.0"
|
||||
resolved "https://registry.npmjs.org/react-refresh/-/react-refresh-0.11.0.tgz"
|
||||
|
||||
Loading…
Reference in New Issue
Block a user