Current build 022522 #17
@@ -2,7 +2,6 @@ import React, { useState, useEffect } from "react";
|
||||
import { fetchBySub, /* selectPosts */ } from "./postsSlice";
|
||||
import { selectAllSubs } from "../reddit/redditSlice";
|
||||
import { useSelector, useDispatch } from "react-redux";
|
||||
// import { updatePosts } from "./postsSlice";
|
||||
import { v4 } from "uuid";
|
||||
import Post from "./Post";
|
||||
|
||||
@@ -15,7 +14,6 @@ export default function Feed() {
|
||||
const [currentPage, setCurrentPage] = useState(0); // Determines current feed page; corresponds to index of feedPage array
|
||||
const dispatch = useDispatch();
|
||||
|
||||
// const posts = useSelector(selectPosts);
|
||||
const subs = useSelector(selectAllSubs); // Selects subreddits from redditSlice
|
||||
|
||||
useEffect(() => { // this useEffect loop pulls the endpoints from the selected subreddits and stores them as an array in "endpoints"
|
||||
@@ -82,7 +80,7 @@ export default function Feed() {
|
||||
|
||||
let sortedPosts = extractedPosts.sort(comparePosts); // implements sorting function
|
||||
|
||||
console.log(sortedPosts);
|
||||
// console.log(sortedPosts);
|
||||
|
||||
let newFeed = sortedPosts.map((post) => {
|
||||
return (
|
||||
@@ -93,7 +91,6 @@ export default function Feed() {
|
||||
)
|
||||
})
|
||||
|
||||
// dispatch(updatePosts(newFeed)); // stores current feed in state of postsSlice
|
||||
setFeed(newFeed);
|
||||
}
|
||||
|
||||
|
||||
@@ -1,7 +1,6 @@
|
||||
import { useState, useEffect, useRef } from 'react';
|
||||
|
||||
export default function VideoPlayer({data, src}) {
|
||||
const vidControls = useRef();
|
||||
const vid = useRef();
|
||||
const aud = useRef(); // identifies location of video/audio in DOM
|
||||
|
||||
@@ -13,24 +12,23 @@ export default function VideoPlayer({data, src}) {
|
||||
let url; // contains video source, routed accordingly by logic below
|
||||
|
||||
if (crossPostSrc) {
|
||||
url = crossPostSrc; // ... for crossposts
|
||||
} else if (data.url) {
|
||||
url = data.url; // ... for local posts, where the url
|
||||
} else { // can be accessed at data.url
|
||||
url = null; // otherwise, is null
|
||||
url = crossPostSrc;
|
||||
} else if (data.media.reddit_video.fallback_url) {
|
||||
url = data.media.reddit_video.fallback_url;
|
||||
} else {
|
||||
url = null;
|
||||
}
|
||||
|
||||
useEffect(() => { // checks the endpoint where audio may be found
|
||||
let checking = true; // if the fetch request throws an error, audio is set to null;
|
||||
const checkForAudio = async() => { // otherwise, audio is set to the endpoint, which is evaluated
|
||||
try { // below as truthy, and rendered in the page
|
||||
await fetch(`${url}/DASH_audio.mp4`)
|
||||
await fetch(`${data.url}/DASH_audio.mp4`)
|
||||
.then((response) => {
|
||||
let status = response.status;
|
||||
if (status > 400) {
|
||||
if (!response.ok) {
|
||||
setAudio(null);
|
||||
} else {
|
||||
setAudio(`${url}/DASH_audio.mp4`);
|
||||
setAudio(`${data.url}/DASH_audio.mp4`);
|
||||
}
|
||||
});
|
||||
} catch(e) {
|
||||
@@ -53,7 +51,7 @@ export default function VideoPlayer({data, src}) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (playing) {
|
||||
if (audio && playing) {
|
||||
vid.current.play(); // synchronizes play/pause between two components
|
||||
vid.current.currentTime = aud.current.currentTime; // according to section of state
|
||||
} else if (!playing) {
|
||||
@@ -63,27 +61,25 @@ export default function VideoPlayer({data, src}) {
|
||||
|
||||
return (
|
||||
<div className="video-player">
|
||||
|
||||
{
|
||||
!audio ?
|
||||
|
||||
<>
|
||||
<video id="post-video-no-audio" ref={vidControls} controls src={`${url}/DASH_1080.mp4` || `${url}/DASH_1080.mp4?source=fallback`}>
|
||||
<video id="post-video-no-audio" controls src={url}>
|
||||
This video is not supported by your browser.
|
||||
</video>
|
||||
</>
|
||||
|
||||
:
|
||||
:
|
||||
|
||||
<>
|
||||
<video id="post-video" ref={vid} autoPlay={playing ? true : false} src={`${url}/DASH_1080.mp4`}>
|
||||
<video id="post-video" ref={vid} autoPlay={playing ? true : false} src={url ? url : null}>
|
||||
This video is not supported by your browser.
|
||||
</video>
|
||||
<video id="post-audio" ref={aud} controls onPlay={() => setPlaying(true)} onPause={() => setPlaying(false)} src={audio}>
|
||||
This video is not supported by your browser.
|
||||
</video>
|
||||
</>
|
||||
|
||||
}
|
||||
</div>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user