Merge pull request #116 from NOctu1412/main

Added bts view support
s-alad · Jun 21, 2024 · 4062940 · 4062940
2 parents d08462d + 0614329
commit 4062940
Show file tree

Hide file tree

Showing 3 changed files with 33 additions and 7 deletions.
diff --git a/client/components/instant/instant.module.scss b/client/components/instant/instant.module.scss
@@ -65,6 +65,11 @@
             @include c.center();
             cursor: pointer;
         }
+        .btsView {
+            width: 30px;
+            @include c.center();
+            cursor: pointer;
+        }
     }
 
     .content {

diff --git a/client/components/instant/instant.tsx b/client/components/instant/instant.tsx
@@ -9,7 +9,7 @@ import axios from "axios";
 import { useRouter } from "next/router";
 
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
-import { faAdd, faArrowCircleRight, faArrowLeft, faArrowRight, faCaretDown, faCaretLeft, faCaretRight, faCaretUp, faCheck, faCross, faDownload, faFaceFrown, faFaceSadCry, faFaceSmile, faPlusCircle, faTrashCan } from "@fortawesome/free-solid-svg-icons";
+import { faAdd, faArrowCircleRight, faArrowLeft, faArrowRight, faCaretDown, faCaretLeft, faCaretRight, faCaretUp, faCheck, faCross, faDownload, faFaceFrown, faFaceSadCry, faFaceSmile, faPlusCircle, faTrashCan, faPlayCircle } from "@fortawesome/free-solid-svg-icons";
 
 import Carousel from 'react-multi-carousel';
 import 'react-multi-carousel/lib/styles.css';
@@ -77,6 +77,10 @@ export default function Instant({ instance, mymojis }: _Instant) {
 
     }
 
+    function viewBts() {
+        window.open(instance.btsMedia, "_blank")?.focus();
+    }
+
     let [swap, setSwap] = useState<boolean>(true);
     let [expanded, setExpanded] = useState<boolean>(false);
 
@@ -198,18 +202,26 @@ export default function Instant({ instance, mymojis }: _Instant) {
                 </div>
                 {
                     instance.user.uid == localStorage.getItem("uid") ?
-                        <div className={s.trash} onClick={deletepost}>
+                        <div className={s.trash} onClick={deletepost} title="Click to delete">
                             <FontAwesomeIcon icon={faTrashCan} />
                         </div>
                         :
-                        <div className={s.trash}>
+                        <div className={s.trash} title="Click to react">
                             {
                                 reactionLoading ?
                                     <div className={s.addloading}><div className={l.loadersmall}></div></div> :
                                     getReactionState()
                             }
                         </div>
                 }
+                {
+                    instance.btsMedia != undefined ? 
+                    <div className={s.btsView} onClick={viewBts} title="Click to view the BTS">
+                        <FontAwesomeIcon icon={faPlayCircle} />
+                    </div>
+                    :
+                    <div></div>
+                }
             </div>
 
             <div className={s.content}>

diff --git a/client/models/instance.ts b/client/models/instance.ts
@@ -16,9 +16,10 @@ class Instance {
     instanceid: string;
     primary: string;
     secondary: string;
+    btsMedia: string | undefined;
 
     // make a constructor
-    constructor(user: User, realmojis: Realmoji[], comments: Comment[], location: { latitude: number, longitude: number } | undefined, creationdate: string ,caption: string, instanceid: string, primary: string, secondary: string) {
+    constructor(user: User, realmojis: Realmoji[], comments: Comment[], location: { latitude: number, longitude: number } | undefined, creationdate: string ,caption: string, instanceid: string, primary: string, secondary: string, btsMedia: string | undefined) {
         this.user = user;
         this.realmojis = realmojis;
         this.comments = comments;
@@ -28,9 +29,10 @@ class Instance {
         this.instanceid = instanceid;
         this.primary = primary;
         this.secondary = secondary;
+        this.btsMedia = btsMedia;
     }
 
-    // static method to create instances
+    // static method to create instances (old api)
     static async create(raw: any) {
         let user = User.create(raw.user);
 
@@ -60,9 +62,10 @@ class Instance {
             comments.push(Comment.create(raw_comment));
         }
 
-        return new Instance(user, realmojis, comments, location, creationdate, caption, instanceid, primary, secondary);
+        return new Instance(user, realmojis, comments, location, creationdate, caption, instanceid, primary, secondary, "");
     }
 
+    // same but new api
     static async moment(raw: any, rawuser: any) {
         let user = User.create(rawuser);
 
@@ -92,7 +95,13 @@ class Instance {
         for (let raw_comment of raw.comments) {
             comments.push(Comment.moment(raw_comment));
         }
-        return new Instance(user, realmojis, comments, location, creationdate ,caption, instanceid, primary, secondary);
+
+        let bts: string | undefined = undefined;
+        if (raw.btsMedia) {
+            bts = raw.btsMedia.url;
+        }
+
+        return new Instance(user, realmojis, comments, location, creationdate ,caption, instanceid, primary, secondary, bts);
     }
 }