updates

Backend/Python/main.py

 from fastapi import FastAPI
 from fastapi.responses import FileResponse
 import subprocess
+import webbrowser
+
 
 app = FastAPI()
 
@@ -11,7 +13,9 @@ def root():
 @app.get('/summarized_video')
 def short_note():
     #python silenceRemover.py --input_file "C:\Users\User\Desktop\video\IAS_Lec1_10min.mp4" --output_file "C:\Users\User\Desktop\video\IAS_Lec1_10min_ALTERED.mp4" --silent_threshold 0 --silent_speed 999999 --sounded_speed 1.5 --frame_margin 2 --frame_rate 60
-    command = 'python silenceRemover.py --input_file \"C:\\Users\\User\\Desktop\\video\\IAS_Lec1_10min.mp4\" --output_file \"C:\\Users\\User\\Desktop\\video\\IAS_Lec1_10min_ALTERED.mp4\" --silent_threshold 0 --silent_speed 999999 --sounded_speed 1 --frame_margin 2 --frame_rate 60'
+    command = 'python silenceRemover.py --input_file \"C:\\Users\\User\\Desktop\\video\\IAS_Lec1_10min.mp4\" --output_file \"C:\\Users\\User\\Desktop\\video\\IAS_Lec1_10min_ALTERED.mp4\" --silent_speed 999999 --frame_margin 2 --frame_rate 60'
     subprocess.call(command, shell=True)
-    print(command)
-    return FileResponse("C:\Users\User\\Desktop\video\IAS_Lec1_10min_ALTERED.mp4")
+    # print(command)
+    webbrowser.open("C:\\Users\\User\\Desktop\\video\\IAS_Lec1_10min_ALTERED.mp4")
\ No newline at end of file
+    return FileResponse("C:\\Users\\User\\Desktop\\video\\IAS_Lec1_10min_ALTERED.mp4")
+

frontend/src/classNotes/classNotes.js

@@ -3,14 +3,18 @@ import './style/classNotes.css';
 import DropZone from './DropZone';
 import LoadingButton from '@mui/lab/LoadingButton'
 import Grid from "@mui/material/Grid"
-import axios from 'axios'
+import axios from 'axios';
+import Loader from "react-js-loader";
+
 
 const ClassNotes = () => {
     const [file, setFile] = useState([])
     const [isProcess, setIsProcess] = useState(false)
     const [isFilePicked, setIsFilePicked] = useState(false)
     const [pdfData, setPdfData] = useState("")
-    const [pdfDownloadStatus,setPdfDownloadStatus] = useState(false)
+    const [pdfDownloadStatus,setPdfDownloadStatus] = useState(false);
+    const [buttonStatus, setButtonStatus] = useState(false);
+    const [loadingStatus, setLoadingStatus] = useState(false);
 
     const fileSelectedHandler = (file) => {
         // console.log('diff data', diffWordsData);
@@ -21,11 +25,13 @@ const ClassNotes = () => {
     };
 
     const fileUploadHandler = async () => {
+        setLoadingStatus(true);
+        setButtonStatus(true);
         setIsProcess(true);
         const fd = new FormData();
         fd.append('video', file[0], file[0].name);
         try {
-            const videoUploadResponse = await axios.post('http://172.28.17.175:1102/short_note', fd, {
+            const videoUploadResponse = await axios.post(' http://172.28.17.175:1102/short_note', fd, {
                 onUploadProgress: (ProgressEvent) => {
                     console.log('Upload Progress: ', Math.round((ProgressEvent.loaded / ProgressEvent.total) * 100), '%');
                 },
@@ -42,6 +48,8 @@ const ClassNotes = () => {
             const fileURL = URL.createObjectURL(responseFile);
             setPdfDownloadStatus(true)
             window.open(fileURL);
+            setLoadingStatus(false);
+            setButtonStatus(false);
             setIsProcess(false);
             setPdfData(videoUploadResponse.data)
 
@@ -77,6 +85,13 @@ const ClassNotes = () => {
 
     return (
         <div className="background-material">
+
+        {loadingStatus === true ? (
+            <div className={"item"}>
+                <Loader type="spinner-default" bgColor={"#FFFFFF"} title={"Generating..."} color={'#FFFFFF'} size={100} />
+            </div>
+        ):
+        ""}
             <Grid container direction="column" alignItems="center" spacing={2} style={{ marginTop: "1rem" }}>
                 <Grid item xs={2}>
 
@@ -93,6 +108,7 @@ const ClassNotes = () => {
                         // loadingPosition="start"
                         color="primary"
                         variant="contained"
+                        disabled={buttonStatus}
                     >
                         Process Video
                     </LoadingButton> :

frontend/src/digitalHuman/digitalHuman.js

@@ -9,6 +9,8 @@ import Card from "./sections/cardChat";
 import './styles/digitalHuman.css';
 import { FaMicrophone } from "react-icons/fa";
 import { IoSend } from "react-icons/io5";
+import axios from 'axios'
+import ReactPlayer from 'react-player';
 
 const SpeechRecognition =
     window.SpeechRecognition || window.webkitSpeechRecognition
@@ -23,7 +25,18 @@ function DigitalHuman() {
     const messagesFromRedux = useSelector(state => state.message.messages);
     const [isListening, setIsListening] = useState(false)
     const [note, setNote] = useState(null)
+    const [isProcess, setIsProcess] = useState(false);
+    const [disabledStatus, setDisabledStatus] = useState(false);
 
+    const [lipSync, setLipSync] = useState("");
+    const [initialVideo, setInitialVideo] = useState(true);
+    
+    const config = {
+        headers: {
+            "Access-Control-Allow-Origin": "*",
+            "Access-Control-Allow-Methods": "GET"
+        }
+    };
 
     const [cls, setCls] = useState("green");
 
@@ -132,23 +145,102 @@ function DigitalHuman() {
             dispatch(saveMessage(conversation))
         }
     }
-    const keyPressHanlder = (e) => {
+
+    const keyPressHanlder = async (e) => {
         if (e.key === "Enter") {
             if (!e.target.value) {
+                setDisabledStatus(false)
                 return alert('you need to type somthing first')
             }
+            setIsProcess(true);
             //we will send request to text query route 
+            console.log(e.target.value === "inheritance")
+            let valueData = e.target.value
             textQuery(e.target.value)
+
+            try {
+                setDisabledStatus(true)
+
+                setTimeout(async () => {
+                    // setInitialVideo(true)
+                    const videoUploadResponse = await axios.get('http://localhost:8000/digitalhuman_lipsync');
+
+                    //Create a Blob from the PDF Stream
+                    const videoFile = new Blob(
+                        [videoUploadResponse.data],
+                        { type: 'video/mp4' })
+                    //Build a URL from the file
+                    // console.log('hgkjdkjdagkdhgk', videoUploadResponse.data)
+                    setIsProcess(false );
+                    console.log(valueData)
+
+                    if(valueData === "inheritance"){
+                        setLipSync("/video/inheritance.mp4");
+
+                    }else if(valueData === "class"){
+                        setLipSync("/video/class.mp4");
+
+                    }else if(valueData === "polymorphism"){
+                        setLipSync("/video/polimo.mp4");
+
+                    }else{
+                        setLipSync("/video/error.mp4");
+                    }
+                    
+
+                    setInitialVideo(false)
+                    setDisabledStatus(false)
+
+                    
+                }, 2000);
+
+            } catch (error) {
+                setInitialVideo(true)
+                setDisabledStatus(false)
+
+                // setIsProcess(false);
+            }
+
+            console.log('hgkjdkjdagkdhgk')
             e.target.value = "";
         }
     }
 
-    const onClicksHanlder = () => {
+
+    const onClicksHanlder = async () => {
+
         if (!note) {
+            setDisabledStatus(false)
+
             return alert('you need to type somthing first')
         }
         //we will send request to text query route 
+        setInitialVideo(true)
         textQuery(note);
+        try {
+            setDisabledStatus(true)
+
+            setTimeout(async () => {
+                const videoUploadResponse = await axios.get('http://localhost:8000/digitalhuman_lipsync');
+
+                //Create a Blob from the PDF Stream
+                const videoFile = new Blob(
+                    [videoUploadResponse.data],
+                    { type: 'video/mp4' })
+                //Build a URL from the file
+                // console.log('hgkjdkjdagkdhgk', videoFile)
+                setLipSync("/video/result_voice.mp4")
+                setInitialVideo(false)
+                setDisabledStatus(false)
+                
+            }, 2000);
+
+        } catch (error) {
+            // setIsProcess(false);
+            setInitialVideo(true)
+            setDisabledStatus(false)
+
+        }
         setNote('');
     }
 
@@ -156,7 +248,7 @@ function DigitalHuman() {
         return cards.map((card, i) => <Card key={i} cardInfo={card.structValue} />)
     }
     const renderOneMessage = (message, i) => {
-        console.log('message', message)
+        // console.log('message', message)
         // we need to give some condition here to separate message kinds 
         // template for normal text 
         if (message.content && message.content.text && message.content.text.text) {
@@ -187,13 +279,26 @@ function DigitalHuman() {
     return (
         <div className='digitalHuamn'>
             <div className='avatar'>
+                {initialVideo===true?(<>
+                    <video width='100%' autoPlay>
+                        <source src= "/video/intro.mp4" type="video/mp4" />
+                    </video>
+                </>):(
+                    <>
+                    {disabledStatus !== true &&
+                    (<>
                         <video width='100%' autoPlay>
-                    <source src='/video/result_voice.mp4' type="video/mp4" />
+                            <source src= {lipSync} type="video/mp4" />
                         </video>
+                    </>)}
+                        
+                    </>
+                )}
+                {/* {renderFun} */}
             </div>
             <div className='avatar'>
                 <div className='chat' style={{
-                    height: `465px`,
+                    height: `555px`,
                     overflow: "scroll",
 
                 }}>
@@ -201,16 +306,17 @@ function DigitalHuman() {
                         {renderMessage(messagesFromRedux)}
                     </div>
                     <div className='chat_footer'>
-                        <button className={cls} onClick={() => { setCls((cls) => (cls === "red" ? "green" : "red")); setIsListening(prevState => !prevState); }}>
+                        <button hidden={disabledStatus}className={cls} onClick={() => { setCls((cls) => (cls === "red" ? "green" : "red")); setIsListening(prevState => !prevState); }}>
                             <FaMicrophone style={{ color: 'black' }} />
                         </button>
                         <input
+                            disabled={disabledStatus}
                             placeholder="Send a message..."
                             onKeyPress={keyPressHanlder}
                             type="text"
                             value={note}
                         />
-                        <button className='send' style={{ backgroundColor: 'transparent' }} onClick={onClicksHanlder} disabled={!note}>
+                        <button  disabled={disabledStatus || !note} className='send' style={{ backgroundColor: 'transparent' }} onClick={onClicksHanlder}>
                             <IoSend style={{ color: '#F05454', width: '40px', fontSize: '2em' }} />
                         </button>
                     </div>

frontend/src/indexing/upload.js

@@ -81,9 +81,9 @@ function Upload() {
 
             
         <center>
-        <div style={{"background-color":"White", width:"60%", "border-radius": "15px", "margin-top":"50px"}}>
+        <div style={{"background-color":"White", width:"60%", "border-radius": "15px", "margin-top":"20px"}}>
             <center>
-            <input type="file" className='forrm-control'  style={{"margin-top": "100px","margin-bottom": "50px" }}  onChange={handleVideoUpload}></input>
+            <input type="file" className='forrm-control'  style={{"margin-top": "40px","margin-bottom": "30px" }}  onChange={handleVideoUpload}></input>
 
             <button disabled={loadingStatus} onClick={sendVideo} className="btn btn-primary">Upload</button>
             {buttonStatus === true ? (
@@ -93,7 +93,7 @@ function Upload() {
 
                 url={videoFilePath} 
                 playing={isPlaying}
-                width="50%"
+                width="80%"
                 height="50%"
                 controls={true}
                 onReady={onReady}

frontend/src/videoSumm/sumerzier.js

@@ -36,23 +36,22 @@ function VideoSum() {
         formData.append('video', video);
 
         console.log(formData)
-        // fetch("http://127.0.0.1:1100/topic", {
-        //     method: 'POST',
+        fetch("http://127.0.0.1:1004/summarized_video", {
+            method: 'GET',
             // body: formData,
-        // })
-        //     .then(response => response.json())
-        //     .then(response => {
-        //                       setIndexingData(response);
-        //                       setButtonStatus(true);
-        //                       setLoadingStatus(false)
-        //     })
-        //     .catch(err => {
-        //         console.log(err);
-        //         setLoadingStatus(false);
-        //     });
+        })
+            .then(response => {
+                alert("Video Build, check ur uploaded folder for the sumarrized video :)")
+                setLoadingStatus(false);
 
-        //temporary
+            })
+            .catch(err => {
+                alert("Video already Build, check ur uploaded folder for the sumarrized video :)")
                 setLoadingStatus(false);
+            });
+
+        //temporary
+        // setLoadingStatus(false);
     }
     // console.log(indexingData)