Skip to content

Commit

Permalink
taking duration from videometadata table
Browse files Browse the repository at this point in the history
  • Loading branch information
nimit9 committed Mar 24, 2024
1 parent 14e04d7 commit 9bf512c
Show file tree
Hide file tree
Showing 9 changed files with 148 additions and 65 deletions.

This file was deleted.

Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
-- AlterTable
ALTER TABLE "VideoProgress" ADD COLUMN "updatedAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP;
1 change: 0 additions & 1 deletion prisma/schema.prisma
Original file line number Diff line number Diff line change
Expand Up @@ -155,7 +155,6 @@ model VideoProgress {
content Content @relation(fields: [contentId], references: [id], onDelete: Cascade)
markAsCompleted Boolean @default(false)
updatedAt DateTime @default(now()) @updatedAt
videoDuration Int @default(0)
@@unique([contentId, userId])
}
Expand Down
156 changes: 125 additions & 31 deletions prisma/seed.ts
Original file line number Diff line number Diff line change
Expand Up @@ -45,6 +45,55 @@ async function main() {
],
});

const moreVideos = [];
for (let i = 4; i <= 40; i++) {
moreVideos.push({
id: i,
type: 'video',
title: `Another test video ${i} for week 1`,
hidden: false,
thumbnail:
'https://appx-recordings.s3.ap-south-1.amazonaws.com/drm/100x/images/week-1.jpg',
parentId: 1,
commentsCount: 0,
});
}

const moreVideosMetadata = [];
for (let i = 2; i <= 38; i++) {
moreVideosMetadata.push({
id: i,
contentId: i + 2,
video_1080p_mp4_1: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_1080p_mp4_2: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_1080p_mp4_3: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_1080p_mp4_4: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_1080p_1: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_1080p_2: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_1080p_3: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_1080p_4: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_720p_mp4_1: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_720p_mp4_2: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_720p_mp4_3: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_720p_mp4_4: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_720p_1: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_720p_2: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_720p_3: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_720p_4: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_360p_mp4_1: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_360p_mp4_2: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_360p_mp4_3: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_360p_mp4_4: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_360p_1: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_360p_2: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_360p_3: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_360p_4: 'https://www.w3schools.com/html/mov_bbb.mp4',
slides:
'https://appx-recordings.s3.ap-south-1.amazonaws.com/drm/100x/slides/Loops%2C+callbacks.pdf',
duration: 10,
});
}

await db.content.createMany({
data: [
{
Expand Down Expand Up @@ -76,6 +125,7 @@ async function main() {
parentId: 1,
commentsCount: 0,
},
...moreVideos,
],
});

Expand All @@ -93,37 +143,81 @@ async function main() {
},
});

await db.videoMetadata.create({
data: {
id: 1,
contentId: 3,
video_1080p_mp4_1: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_1080p_mp4_2: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_1080p_mp4_3: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_1080p_mp4_4: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_1080p_1: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_1080p_2: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_1080p_3: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_1080p_4: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_720p_mp4_1: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_720p_mp4_2: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_720p_mp4_3: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_720p_mp4_4: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_720p_1: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_720p_2: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_720p_3: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_720p_4: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_360p_mp4_1: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_360p_mp4_2: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_360p_mp4_3: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_360p_mp4_4: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_360p_1: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_360p_2: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_360p_3: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_360p_4: 'https://www.w3schools.com/html/mov_bbb.mp4',
slides:
'https://appx-recordings.s3.ap-south-1.amazonaws.com/drm/100x/slides/Loops%2C+callbacks.pdf',
},
await db.videoMetadata.createMany({
data: [
{
id: 1,
contentId: 3,
video_1080p_mp4_1: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_1080p_mp4_2: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_1080p_mp4_3: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_1080p_mp4_4: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_1080p_1: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_1080p_2: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_1080p_3: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_1080p_4: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_720p_mp4_1: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_720p_mp4_2: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_720p_mp4_3: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_720p_mp4_4: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_720p_1: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_720p_2: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_720p_3: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_720p_4: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_360p_mp4_1: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_360p_mp4_2: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_360p_mp4_3: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_360p_mp4_4: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_360p_1: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_360p_2: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_360p_3: 'https://www.w3schools.com/html/mov_bbb.mp4',
video_360p_4: 'https://www.w3schools.com/html/mov_bbb.mp4',
slides:
'https://appx-recordings.s3.ap-south-1.amazonaws.com/drm/100x/slides/Loops%2C+callbacks.pdf',
duration: 10,
},
...moreVideosMetadata,
],
});

const data = [];
const uniqueDates = [
...Array.from({ length: 5 }, () => getRandomDate()),
new Date(Date.now()),
new Date(Date.now() - 24 * 60 * 60 * 1000),
];

for (let i = 3; i <= 40; i++) {
const updatedAt =
uniqueDates[Math.floor(Math.random() * uniqueDates.length)];

for (let j = 0; j < 1; j++) {
// Each contentId will have exactly 1 entry
data.push({
id: i,
contentId: i,
userId: '1',
currentTimestamp: getRandomTimestamp(),
updatedAt, // Set updatedAt time to be the same for the first 5 entries
});
}
}

function getRandomTimestamp() {
return Math.floor(Math.random() * 11); // Random number between 0 and 10
}

function getRandomDate() {
const startDate = new Date(2023, 0, 1); // Random start date
const endDate = new Date(); // Current date
return new Date(
startDate.getTime() +
Math.random() * (endDate.getTime() - startDate.getTime()),
);
}

await db.videoProgress.createMany({
data,
});
}

Expand Down
4 changes: 1 addition & 3 deletions src/app/api/course/videoProgress/route.ts
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@ export async function GET(req: NextRequest) {
}

export async function POST(req: NextRequest) {
const { contentId, currentTimestamp, videoDuration } = await req.json();
const { contentId, currentTimestamp } = await req.json();
const session = await getServerSession(authOptions);
if (!session || !session?.user) {
return NextResponse.json({}, { status: 401 });
Expand All @@ -43,11 +43,9 @@ export async function POST(req: NextRequest) {
contentId: Number(contentId),
userId: session.user.id,
currentTimestamp,
videoDuration,
},
update: {
currentTimestamp,
...(videoDuration && { videoDuration }),
},
});
revalidatePath('/history');
Expand Down
6 changes: 6 additions & 0 deletions src/app/history/page.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ import { Fragment } from 'react';
export type TWatchHistory = VideoProgress & {
content: Content & {
parent: { id: number; courses: CourseContent[] } | null;
VideoMetadata: { duration: number | null } | null;
};
};

Expand Down Expand Up @@ -51,6 +52,11 @@ async function getWatchHistory() {
include: {
content: {
include: {
VideoMetadata: {
select: {
duration: true,
},
},
parent: {
select: {
id: true,
Expand Down
17 changes: 0 additions & 17 deletions src/components/VideoPlayer2.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,6 @@ export const VideoPlayer: FunctionComponent<VideoPlayerProps> = ({
}) => {
const videoRef = useRef<HTMLDivElement>(null);
const playerRef = useRef<Player | null>(null);
const [videoDuration, setVideoDuration] = useState<number | null>(null);
const [player, setPlayer] = useState<any>(null);
const searchParams = useSearchParams();
useEffect(() => {
Expand Down Expand Up @@ -190,22 +189,6 @@ export const VideoPlayer: FunctionComponent<VideoPlayerProps> = ({
if (currentTime <= 20) {
return;
}
const duration = Math.floor(player.duration());
if (!videoDuration) {
await fetch('/api/course/videoProgress', {
body: JSON.stringify({
currentTimestamp: currentTime,
contentId,
videoDuration: duration,
}),
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
});
setVideoDuration(duration);
return;
}
await fetch('/api/course/videoProgress', {
body: JSON.stringify({
currentTimestamp: currentTime,
Expand Down
12 changes: 6 additions & 6 deletions src/components/WatchHistoryClient.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -30,18 +30,18 @@ const HistoryCard = ({
id,
contentId,
currentTimestamp,
videoDuration,
content: { type, title, thumbnail, hidden, parent },
content: { type, title, thumbnail, hidden, parent, VideoMetadata },
}: TWatchHistory) => {
const router = useRouter();

if (parent && !hidden && type === 'video') {
if (parent && !hidden && type === 'video' && VideoMetadata) {
const { duration: videoDuration } = VideoMetadata;
const { id: folderId, courses } = parent;
const courseId = courses[0].courseId;
const videoUrl = `/courses/${courseId}/${folderId}/${contentId}`;
const videoProgressPercent = Math.round(
(currentTimestamp / videoDuration) * 100,
);
const videoProgressPercent = videoDuration
? Math.round((currentTimestamp / videoDuration) * 100)
: 0;
return (
<ContentCard
type={type}
Expand Down
12 changes: 8 additions & 4 deletions src/db/course.ts
Original file line number Diff line number Diff line change
Expand Up @@ -180,8 +180,14 @@ async function getAllContent() {
where: {
hidden: false,
},
include: {
VideoMetadata: {
select: {
duration: true,
},
},
},
});

Cache.getInstance().set('getAllContent', [], allContent);

return allContent;
Expand Down Expand Up @@ -250,9 +256,7 @@ export const getFullCourseContent = async (courseId: number) => {
markAsCompleted: videoProgress.find(
(x) => x.contentId === content.id,
)?.markAsCompleted,
videoFullDuration: videoProgress.find(
(x) => x.contentId === content.id,
)?.videoDuration,
videoFullDuration: content.VideoMetadata?.duration,
}
: null,
},
Expand Down

0 comments on commit 9bf512c

Please sign in to comment.