changes

src/Pages/ResourcePage.js

@@ -29,31 +29,14 @@ import CommentsArea from '../Components/ResourcePageComponents/CommentsArea.js'
 import noAvatar from "../img/default_profile.png";
 import Snackbar from '@material-ui/core/Snackbar';
 import MuiAlert from '@material-ui/lab/Alert';
+import VideoPlayer from '../Components/ResourcePageComponents/VideoPlayer.js'
 
 export function Alert(props) {
   return <MuiAlert elevation={6} variant="filled" {...props} />;
 }
 
-function GetEmbeddedLink (link) {
-    if (link.indexOf("youtube") != -1) {  //plain youtebe.com/ link
-        if(link.indexOf("embed/") != -1) { //if it's already an embedded link, return it
-            return link
-        }
-        link = link.split("&")[0] //else remove features and other queries
-        var link = link.split("v=")[1] //get video id
-        var embed = "https://www.youtube.com/embed/" + link; //create embedded link
-   }
-   else if (link.indexOf("youtu.be") != -1) { //if it's a youtu.be link
-       link = link.split("&")[0].split("?")[0] //remove queries and features if existent
-       link = link.split(".be/")[1] //get video id
-       var embed = "https://www.youtube.com/embed/" + link; //create embedded link
-   }
-   else if (link.indexOf("vimeo") != -1) {    //if the 13th character = o (vimeo videos)
-       link = link.split("?")[0].split("/")
-       console.log(link)   //key # = from 19th character on
-       var embed = "https://player.vimeo.com/video/" + link.pop();    //Add vimeo link before key #
-   }
-   return embed
+function urlVerify (url) {
+    return (url ? url.indexOf("youtu") !== -1 || url.indexOf("vimeo") !== -1 : false)
 }
 
 export default function LearningObjectPage (props){
@@ -83,8 +66,8 @@ export default function LearningObjectPage (props){
             }
             console.log(response)
             setRecurso(response.data)
-        }, (error) => {console.log(error)})
-        toggle(false)
+            toggle(false)
+        }, (error) => {console.log(error); toggle(false)})
     }, [, state.currentUser])
 
 
@@ -118,16 +101,32 @@ export default function LearningObjectPage (props){
                 :
                 (
                         <Grid container spacing={2}>
-                            {(recurso.object_type === "Vídeo" && recurso.link) &&
-                                <Grid item xs={12}>
-                                    <Card>
-                                        <div className="video-container">
-                                            <iframe src={GetEmbeddedLink(recurso.link)} frameBorder="0" allowFullScreen className="video"></iframe>
-                                        </div>
-                                    </Card>
-                                </Grid>
+                            {
+                                recurso.object_type === "Vídeo" &&
+                                !recurso.link ?
+                                (
+                                    <Grid item xs={12}><Card>
+                                        <VideoPlayer
+                                            link={recurso.link}
+                                            urlVerified={false}
+                                            videoUrl = {recurso.default_attachment_location}
+                                            />
+                                    </Card></Grid>
+
+                                )
+                                :
+                                (
+                                    urlVerify(recurso.link) &&
+                                    <Grid item xs={12}><Card>
+                                    <VideoPlayer
+                                        link={recurso.link}
+                                        urlVerified={true}
+                                    />
+                                    </Card></Grid>
+                                )
                             }
 
+
                             <Grid item xs={12}>
                                 <Card>
                                     <div>
@@ -141,6 +140,7 @@ export default function LearningObjectPage (props){
                                     <TextoObjeto
                                         name={recurso.name}
                                         rating={recurso.rating}
+                                        recursoId={id}
                                         likesCount={recurso.likes_count}
                                         likedBool={recurso.liked}
                                         objType={recurso.object_type}
@@ -163,6 +163,7 @@ export default function LearningObjectPage (props){
                                         thumb={recurso.thumbnail}
                                         currPageLink={window.location.href}
                                         handleSnackbar={handleSnackbar}
+                                        complained={recurso.complained}
                                         />
                                 </Card>
                             </Grid>
@@ -196,7 +197,7 @@ export default function LearningObjectPage (props){
                                         recursoId = {id}
                                         handleSnackbar={handleSnackbar}
                                         objType={recurso.object_type}
-
+                                        recurso={true}
                                         />
                                 </Card>
                             </Grid>
@@ -246,19 +247,4 @@ const Card = styled.div`
             width : 100%;
         }
     }
-
-    .video-container {
-        position : relative;
-        width : 100%;
-        height : 0;
-        padding-bottom : 56.25%;
-    }
-
-    .video {
-        width : 100%;
-        height : 100%;
-        position : absolute;
-        top : 0;
-        left : 0;
-    }
 `