Merge pull request #102 from eye-on-surveillance/AI/timestamps-addition

AI/timestamps-addition
eye-on-surveillance · Sep 30, 2023 · 989ce6d · 989ce6d
2 parents 339c4a7 + 32ec08b
commit 989ce6d
Show file tree

Hide file tree

Showing 3 changed files with 43 additions and 7 deletions.
diff --git a/packages/googlecloud/functions/getanswer/inquirer.py b/packages/googlecloud/functions/getanswer/inquirer.py
@@ -17,6 +17,12 @@
 logger = logging.getLogger(__name__)
 
 
+def timestamp_to_seconds(timestamp):
+    start_time = timestamp.split("-")[0]  # Split by '-' and take the first part
+    h, m, s = [int(i) for i in start_time.split(":")]
+    return h * 3600 + m * 60 + s
+
+
 def process_responses_llm(responses_llm, docs=None):
     generated_responses = responses_llm.split("\n\n")
     responses = []
@@ -61,13 +67,19 @@ def gen_responses(i):
             section["source_timestamp"] = timestamps[i] if i < len(timestamps) else None
             section["source_url"] = urls[i] if i < len(urls) else None
 
+            if section["source_url"] and section["source_timestamp"]:
+                time_in_seconds = timestamp_to_seconds(section["source_timestamp"])
+                if "?" in section["source_url"]:                      section["source_url"] += f"&t={time_in_seconds}s"
+                else:
+                    section["source_url"] += f"?t={time_in_seconds}s"
+
             citation = {}
             if section["source_title"] is not None:
                 citation["Title"] = section["source_title"]
             if section["source_publish_date"] is not None:
                 citation["Published"] = section["source_publish_date"]
             if section["source_url"] is not None:
-                citation["URL"] = section["source_url"]
+                citation["URL"] = section["source_url"]  # Add this line
             if section["source_timestamp"] is not None:
                 citation["Video timestamp"] = section["source_timestamp"]
             if section["source_name"] is not None:

diff --git a/packages/web/components/Citation.tsx b/packages/web/components/Citation.tsx
@@ -9,7 +9,7 @@ const citationKeyMap: { [key: string]: string } = {
   source_title: "Source Title",
   source_name: "Source Name",
   source_publish_date: "Source Publish Date",
-  source_url: "Source URL",
+  source_url: "Source URL (with timestamp)",
 };
 
 const Citation = ({ citation, index }: CitationProps) => {

diff --git a/packages/web/components/NewQuery.tsx b/packages/web/components/NewQuery.tsx
@@ -8,12 +8,30 @@ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { useState } from "react";
 import { useCardResults } from "./CardResultsProvider";
 
+function YouTubeEmbed({ url }: { url: string }) {
+  const videoId = url.split("v=")[1]?.split("&")[0];
+  if (!videoId) return null;
+
+  return (
+    <iframe 
+      width="560" 
+      height="315" 
+      src={`https://www.youtube.com/embed/${videoId}`} 
+      frameBorder="0" 
+      title="YouTube Video"
+      allowFullScreen
+    ></iframe>
+  );
+}
+
 export default function NewQuery() {
   const apiEndpoint = process.env.NEXT_PUBLIC_TGI_API_ENDPOINT!;
   const [query, setQuery] = useState("");
   const [isProcessing, setIsProcessing] = useState(false);
   const [cardType, setCardType] = useState(ECardType.QUERY_IN_DEPTH);
   const { addMyCard } = useCardResults();
+  const [card, setCard] = useState<ICard | null>(null);  
+
 
   const insertSupabaseCard = async (): Promise<ICard> => {
     const newCard: ICard = {
@@ -74,9 +92,7 @@ export default function NewQuery() {
   ) => {
     const genResponseMs = Math.ceil(Date.now() - startedProcessingAt);
     const queryUpdate = {
-      // responses: JSON.stringify(card.responses),
       responses: card.responses,
-      // citations: JSON.stringify(card.citations),
       citations: card.citations,
       processing_time_ms: genResponseMs,
     };
@@ -90,7 +106,6 @@ export default function NewQuery() {
       console.warn(error);
       return;
     } else {
-      // successfully updated
     }
   };
 
@@ -110,7 +125,7 @@ export default function NewQuery() {
   return (
     <div className="my-12">
       <form onSubmit={submitQuery}>
-        <div className="relative  block">
+        <div className="relative block">
           <FontAwesomeIcon
             className="absolute left-2 top-1/2 ml-2 h-[28px] w-[28px] -translate-y-1/2 cursor-pointer object-contain"
             icon={faMagnifyingGlass}
@@ -127,7 +142,6 @@ export default function NewQuery() {
               setQuery(e.currentTarget.value);
             }}
           ></input>
-          {/* <p className="text-xs italic text-red-500">Please choose a password.</p> */}
         </div>
         <button
           className={`w-full rounded-lg md:w-1/2 ${
@@ -139,6 +153,16 @@ export default function NewQuery() {
           Get answer
         </button>
       </form>
+
+      <div className="mt-10">
+        {card?.citations?.map((citation, index) => (
+          <div key={index}>
+            <p>{citation.source_title}</p>
+            {citation.source_url && citation.source_url.includes("youtube.com") && 
+              <YouTubeEmbed url={citation.source_url} />}
+          </div>
+        ))}
+      </div>
     </div>
   );
 }