Merge pull request #20 from LapsTimeOFF/ocr-end

implement OCR detection for end of stream
LapsTimeOFF · Aug 1, 2024 · ff529d7 · ff529d7
2 parents 66c6ceb + e42dbb8
commit ff529d7
Show file tree

Hide file tree

Showing 11 changed files with 435 additions and 140 deletions.
diff --git a/book.md b/book.md
diff --git a/bun.lockb b/bun.lockb
diff --git a/electron/main/utils/config.ts b/electron/main/utils/config.ts
@@ -13,18 +13,15 @@ const store = new Store({
 
 const set = (key: string, value: unknown) => {
   store.set(key, value);
-  console.log(key, value);
 };
 
 const get = (key?: string) => {
-  console.log("get", key);
   if (!key || key === "") return store.store;
   return store.get(key);
 };
 
 const remove = (key: string) => {
   store.delete(key);
-  console.log("delete", key);
 };
 
 export default function () {

diff --git a/index.html b/index.html
@@ -6,7 +6,7 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <meta
       http-equiv="Content-Security-Policy"
-      content="script-src 'self' 'unsafe-inline';"
+      content="script-src 'self' 'unsafe-inline' 'unsafe-eval';"
     />
     <title>MultiViewer for 9NOW</title>
   </head>

diff --git a/package.json b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "multiviewer-for-9now",
   "displayName": "MultiViewer for 9NOW",
-  "version": "1.1.0",
+  "version": "1.2.0",
   "main": "dist-electron/main/index.js",
   "description": "Watch many channels at the same time from 9NOW",
   "author": "Quentin Baguette",
@@ -33,7 +33,8 @@
     "react-router-dom": "^6.25.1",
     "serve-handler": "^6.1.5",
     "shaka-player": "^4.10.9",
-    "swr": "^2.2.5"
+    "swr": "^2.2.5",
+    "tesseract.js": "^5.1.0"
   },
   "devDependencies": {
     "@eslint/js": "^9.8.0",

diff --git a/src/components/Channel.tsx b/src/components/Channel.tsx
@@ -5,7 +5,8 @@ import {
   CardContent,
   CardMedia,
   Stack,
-  Typography
+  Typography,
+  CardActionArea
 } from "@mui/material";
 import moment from "moment";
 import React, { FC } from "react";
@@ -64,27 +65,37 @@ const Channel: FC<Props> = ({
             }}
           />
         </Box>
-        <Stack direction="row" spacing={2}>
-          <CardMedia
-            component="img"
-            sx={{
-              width: 125,
-              height: 125
-            }}
-            image={channel.switcherLogo.sizes.w768}
-            alt={channel.switcherLogo.alt}
-          />
-          <CardContent>
-            <Typography variant="h4">{channel.name}</Typography>
-            <Typography variant="body1">
-              {currentAiring?.title || "No current airing"}
-            </Typography>
-            <Typography variant="subtitle2" color="#c4c4c4">
-              {moment(currentAiring?.startDate).format("h:mm a")} -{" "}
-              {moment(currentAiring?.endDate).format("h:mm a")}
-            </Typography>
-          </CardContent>
-        </Stack>
+        <CardActionArea
+          onClick={() => {
+            window.mv.player.create(
+              `/grid/${encodeURI(JSON.stringify([channel.slug]))}`,
+              location.port,
+              [channel.slug]
+            );
+          }}
+        >
+          <Stack direction="row" spacing={2}>
+            <CardMedia
+              component="img"
+              sx={{
+                width: 125,
+                height: 125
+              }}
+              image={channel.switcherLogo.sizes.w768}
+              alt={channel.switcherLogo.alt}
+            />
+            <CardContent>
+              <Typography variant="h4">{channel.name}</Typography>
+              <Typography variant="body1">
+                {currentAiring?.title || "No current airing"}
+              </Typography>
+              <Typography variant="subtitle2" color="#c4c4c4">
+                {moment(currentAiring?.startDate).format("h:mm a")} -{" "}
+                {moment(currentAiring?.endDate).format("h:mm a")}
+              </Typography>
+            </CardContent>
+          </Stack>
+        </CardActionArea>
       </Stack>
     </Card>
   );

diff --git a/src/components/LiveEventGroup.tsx b/src/components/LiveEventGroup.tsx
@@ -25,7 +25,7 @@ interface Props {
   olympicsFilter: boolean;
 }
 
-const nonOlympicsSlug = [
+export const nonOlympicsSlug = [
   "100-footy",
   "60-minutes-australia",
   "9crime",
@@ -222,50 +222,62 @@ const Stream: FC<StreamProps> = ({ stream, gridList, setGridList }) => {
             }}
           />
         </Box>
-        <CardMedia
-          component="img"
-          sx={{
-            width: 800 / 3,
-            height: 150
+        <CardActionArea
+          onClick={() => {
+            window.mv.player.create(
+              `/grid/${encodeURI(JSON.stringify([stream.slug]))}`,
+              location.port,
+              [stream.slug]
+            );
           }}
-          image={stream.image.sizes.w320}
-          alt={stream.image.alt}
-        />
-        <CardContent>
-          <Typography
-            variant="h5"
-            sx={{
-              opacity: isLive() ? 1 : 0.5
-            }}
-          >
-            {stream.name}{" "}
-            <FiberManualRecordIcon
-              color="error"
+        >
+          <Stack direction="row" spacing={2}>
+            <CardMedia
+              component="img"
               sx={{
-                display: isLive() ? "inline" : "none",
-                pt: 0.5,
-                animation: "flashLive 1.5s infinite"
+                width: 800 / 3,
+                height: 150
               }}
+              image={stream.image.sizes.w320}
+              alt={stream.image.alt}
             />
-          </Typography>
-          <Typography
-            variant="body1"
-            sx={{
-              opacity: isLive() ? 1 : 0.5
-            }}
-          >
-            {stream.description}
-          </Typography>
-          <Typography
-            variant="subtitle2"
-            sx={{
-              opacity: isLive() ? 1 : 0.5
-            }}
-          >
-            {moment(stream.startDate).format("h:mm a")} -{" "}
-            {moment(stream.endDate).format("h:mm a")}
-          </Typography>
-        </CardContent>
+            <CardContent>
+              <Typography
+                variant="h5"
+                sx={{
+                  opacity: isLive() ? 1 : 0.5
+                }}
+              >
+                {stream.name}{" "}
+                <FiberManualRecordIcon
+                  color="error"
+                  sx={{
+                    display: isLive() ? "inline" : "none",
+                    pt: 0.5,
+                    animation: "flashLive 1.5s infinite"
+                  }}
+                />
+              </Typography>
+              <Typography
+                variant="body1"
+                sx={{
+                  opacity: isLive() ? 1 : 0.5
+                }}
+              >
+                {stream.description}
+              </Typography>
+              <Typography
+                variant="subtitle2"
+                sx={{
+                  opacity: isLive() ? 1 : 0.5
+                }}
+              >
+                {moment(stream.startDate).format("h:mm a")} -{" "}
+                {moment(stream.endDate).format("h:mm a")}
+              </Typography>
+            </CardContent>
+          </Stack>
+        </CardActionArea>
       </Stack>
     </Card>
   );