sebastjan/videofolxtv
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Improve video ad integration and streamline video player initialization sequence

Browse Source 
Initialize the Video.js player without sources, load ads plugin immediately, and then set the video source in `client/src/components/video-modal.tsx`, while attaching an image.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 11420304-80a9-4ef2-adff-cbdaa418ffa8
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/11420304-80a9-4ef2-adff-cbdaa418ffa8/cKeR57s
This commit is contained in:
sebastjanartic 2025-08-05 06:12:10 +00:00
parent bc727b1d36
commit 5465e174e7
2 changed files with 28 additions and 51 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
attached_assets/IMG_0280_1754374286668.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 299 KiB

79
client/src/components/video-modal.tsx
View File

@ -101,7 +101,7 @@ export default function VideoModal({ video, isOpen, onClose }: VideoModalProps)
console.log('Loading video with Video.js:', videoUrl);
try {
// Initialize Video.js player with simplified configuration
// Initialize Video.js player without sources first
const player = videojs(videoElement, {
controls: true,
fluid: true,
@ -113,47 +113,32 @@ export default function VideoModal({ video, isOpen, onClose }: VideoModalProps)
smoothQualityChange: true,
overrideNative: false
}
},
sources: [{
src: videoUrl,
type: videoUrl.includes('.m3u8') ? 'application/x-mpegURL' : 'video/mp4'
}]
}
});
// Initialize ads plugin immediately after player creation
if (typeof (player as any).ads === 'function') {
try {
(player as any).ads({
debug: false,
prerollTimeout: 3000,
postrollTimeout: 3000,
timeout: 5000
});
console.log('Ads plugin initialized');
} catch (error) {
console.log('Ads plugin initialization failed:', error);
}
}
// Set source after ads plugin is ready
player.src({
src: videoUrl,
type: videoUrl.includes('.m3u8') ? 'application/x-mpegURL' : 'video/mp4'
});
player.ready(() => {
console.log('Video.js player ready');
// Initialize ads plugin first
if (typeof (player as any).ads === 'function') {
try {
(player as any).ads({
debug: true,
prerollTimeout: 3000,
postrollTimeout: 3000,
timeout: 5000
});
console.log('Ads plugin initialized');
// Then initialize IMA plugin for VAST ads
if (typeof (player as any).ima === 'function') {
(player as any).ima({
id: video.id,
adTagUrl: 'https://pubads.g.doubleclick.net/gampad/ads?sz=640x480&iu=/124319096/external/single_ad_samples&ciu_szs=300x250&impl=s&gdfp_req=1&env=vp&output=vast&unviewed_position_start=1&cust_params=deployment%3Ddevsite%26sample_ct%3Dlinear&correlator=' + Math.round(Math.random() * 100000000),
debug: true,
timeout: 5000,
maxRedirects: 4,
vpaidMode: 'ENABLED',
vpaidAllowed: true,
autoPlayAdBreaks: true,
adLabel: 'Advertisement',
showControlsForJSAds: true
});
console.log('IMA plugin initialized with VAST ads');
}
} catch (error) {
console.log('Ads plugin initialization failed:', error);
}
}
console.log('Video.js player ready with source');
});
player.on('error', (error: any) => {
@ -164,24 +149,16 @@ export default function VideoModal({ video, isOpen, onClose }: VideoModalProps)
handleVideoPlay();
});
// Ads event listeners
player.on('ads-request', () => {
console.log('Ad request initiated');
});
player.on('ads-load', () => {
console.log('Ad loaded successfully');
});
player.on('ads-start', () => {
// Simple ads event listeners
player.on('adstart', () => {
console.log('Ad playback started');
});
player.on('ads-end', () => {
player.on('adend', () => {
console.log('Ad playback ended');
});
player.on('ads-error', (error: any) => {
player.on('aderror', (error: any) => {
console.log('Ad error:', error);
});