Skip to content

Commit 59bcf1e

Browse files
journeyjtjourneyjt
committed
Create prod debug version
1 parent d53c103 commit 59bcf1e

4 files changed

Lines changed: 162 additions & 5 deletions

File tree

‎module.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
"id": "bardic-inspiration",
33
"title": "Bardic Inspiration",
44
"description": "Synchronized YouTube DJ for Foundry VTT - Play YouTube videos in sync across all players",
5-
"version": "0.9.0",
5+
"version": "0.9.1",
66
"compatibility": {
77
"minimum": "12",
88
"verified": "13.347"

‎package-lock.json‎

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "bardic-inspiration",
3-
"version": "0.9.0",
3+
"version": "0.9.1",
44
"description": "A Foundry VTT module",
55
"type": "module",
66
"scripts": {

‎src/ui/YouTubePlayerWidget.ts‎

Lines changed: 158 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -650,6 +650,10 @@ export class YouTubePlayerWidget {
650650
? queueState.items[queueState.currentIndex]?.videoId
651651
: 'dQw4w9WgXcQ'; // Default test video
652652

653+
// Determine if we're in a production HTTPS environment
654+
const isHTTPS = window.location.protocol === 'https:';
655+
const isProduction = window.location.hostname !== 'localhost' && !window.location.hostname.includes('127.0.0.1');
656+
653657
// Log exact parameters being passed to YouTube API
654658
const playerConfig = {
655659
height: '140',
@@ -663,7 +667,13 @@ export class YouTubePlayerWidget {
663667
modestbranding: 1,
664668
playsinline: 1,
665669
rel: 0,
666-
origin: window.location.origin
670+
// In production HTTPS, be more specific about origin
671+
...(isHTTPS && isProduction ? {
672+
origin: window.location.origin,
673+
widget_referrer: window.location.origin
674+
} : {
675+
origin: window.location.origin
676+
})
667677
},
668678
events: {
669679
onReady: this.onPlayerReady.bind(this),
@@ -672,6 +682,22 @@ export class YouTubePlayerWidget {
672682
}
673683
};
674684

685+
// PRODUCTION DEBUG: Log all relevant environment info
686+
console.error('🎵 PROD DEBUG | Player creation environment:', {
687+
containerId: this.containerId,
688+
videoId,
689+
origin: window.location.origin,
690+
protocol: window.location.protocol,
691+
hostname: window.location.hostname,
692+
isHTTPS: isHTTPS,
693+
isProduction: isProduction,
694+
containerExists: !!container,
695+
containerVisible: container?.offsetParent !== null,
696+
containerDisplay: window.getComputedStyle(container || document.body).display,
697+
ytAPIReady: !!(window.YT && window.YT.Player),
698+
playerVars: playerConfig.playerVars
699+
});
700+
675701
logger.debug('🎵 YouTube DJ | Creating YT.Player with config:', {
676702
containerId: this.containerId,
677703
videoId,
@@ -681,12 +707,32 @@ export class YouTubePlayerWidget {
681707
// Create player with minimal parameters and immediate video load
682708
this.player = new YT.Player(this.containerId, playerConfig);
683709

710+
// PRODUCTION DEBUG: Log player object creation
711+
console.error('🎵 PROD DEBUG | Player object created:', {
712+
playerExists: !!this.player,
713+
playerType: typeof this.player,
714+
playerConstructor: this.player?.constructor?.name
715+
});
716+
684717
logger.info('🎵 YouTube DJ | Widget player created successfully');
685718

686719
// Check if iframe was created immediately
687720
setTimeout(() => {
688721
const containerAfterCreation = document.getElementById(this.containerId);
689722
const iframe = containerAfterCreation?.querySelector('iframe');
723+
724+
// PRODUCTION DEBUG: Detailed iframe creation check
725+
console.error('🎵 PROD DEBUG | Post-creation check (100ms):', {
726+
containerStillExists: !!containerAfterCreation,
727+
iframeCreated: !!iframe,
728+
containerContent: containerAfterCreation?.innerHTML || 'no content',
729+
containerChildren: containerAfterCreation?.children.length || 0,
730+
iframeSrc: iframe?.getAttribute('src'),
731+
containerParent: containerAfterCreation?.parentElement?.tagName,
732+
containerClasses: containerAfterCreation?.className,
733+
containerStyle: containerAfterCreation?.getAttribute('style')
734+
});
735+
690736
logger.debug('🎵 YouTube DJ | Post-creation check (100ms):', {
691737
containerStillExists: !!containerAfterCreation,
692738
iframeCreated: !!iframe,
@@ -699,6 +745,17 @@ export class YouTubePlayerWidget {
699745
setTimeout(() => {
700746
const laterContainer = document.getElementById(this.containerId);
701747
const laterIframe = laterContainer?.querySelector('iframe');
748+
749+
// PRODUCTION DEBUG: Delayed iframe check
750+
console.error('🎵 PROD DEBUG | Post-creation check (1000ms):', {
751+
containerExists: !!laterContainer,
752+
iframeCreated: !!laterIframe,
753+
containerHTML: laterContainer?.innerHTML || 'no content',
754+
iframeSrc: laterIframe?.getAttribute('src'),
755+
playerReady: this.isPlayerReady,
756+
playerObject: !!this.player
757+
});
758+
702759
logger.debug('🎵 YouTube DJ | Post-creation check (1000ms):', {
703760
containerExists: !!laterContainer,
704761
iframeCreated: !!laterIframe,
@@ -717,6 +774,15 @@ export class YouTubePlayerWidget {
717774
* Player ready event handler
718775
*/
719776
private onPlayerReady(event: YT.PlayerEvent): void {
777+
// PRODUCTION DEBUG: Player ready event fired
778+
console.error('🎵 PROD DEBUG | Player ready event fired:', {
779+
event: !!event,
780+
target: event?.target?.constructor?.name,
781+
playerId: event?.target?.h?.id,
782+
container: document.getElementById(this.containerId)?.tagName,
783+
iframe: !!document.querySelector(`#${this.containerId} iframe`)
784+
});
785+
720786
logger.info('🎵 YouTube DJ | Widget player ready');
721787

722788
// The player is ready, mark it immediately
@@ -821,6 +887,16 @@ export class YouTubePlayerWidget {
821887
* Player error handler
822888
*/
823889
private onPlayerError(event: YT.OnErrorEvent): void {
890+
// PRODUCTION DEBUG: Player error event
891+
console.error('🎵 PROD DEBUG | Player error event:', {
892+
errorCode: event.data,
893+
errorType: typeof event.data,
894+
event: event,
895+
target: event?.target?.constructor?.name,
896+
container: document.getElementById(this.containerId)?.tagName,
897+
iframe: !!document.querySelector(`#${this.containerId} iframe`)
898+
});
899+
824900
logger.error('🎵 YouTube DJ | Widget player error:', event.data);
825901
ui.notifications?.error(`YouTube Player Error: ${event.data}`);
826902
}
@@ -932,8 +1008,24 @@ export class YouTubePlayerWidget {
9321008
* Handle state changes from SessionStore
9331009
*/
9341010
private onStateChanged(event: StateChangeEvent): void {
1011+
// PRODUCTION DEBUG: Log all state changes that could trigger re-renders
1012+
console.error('🎵 PROD DEBUG | State change event received:', {
1013+
isJoiningSession: this.isJoiningSession,
1014+
changes: Object.keys(event.changes || {}),
1015+
sessionChanges: Object.keys(event.changes?.session || {}),
1016+
playerChanges: Object.keys(event.changes?.player || {}),
1017+
queueChanges: Object.keys(event.changes?.queue || {}),
1018+
hasJoinedSession: {
1019+
previous: event.previous?.session?.hasJoinedSession,
1020+
current: event.changes?.session?.hasJoinedSession
1021+
},
1022+
playerReady: this.isPlayerReady,
1023+
iframeExists: !!document.querySelector(`#${this.containerId} iframe`)
1024+
});
1025+
9351026
// Skip renders while joining session to prevent iframe destruction
9361027
if (this.isJoiningSession) {
1028+
console.error('🎵 PROD DEBUG | Skipping render during join session process');
9371029
logger.debug('🎵 YouTube DJ | Skipping render during join session process');
9381030
return;
9391031
}
@@ -949,11 +1041,28 @@ export class YouTubePlayerWidget {
9491041
);
9501042

9511043
if (needsFullRender) {
1044+
console.error('🎵 PROD DEBUG | FULL RENDER TRIGGERED - This will destroy iframe!', {
1045+
reason: 'User session join',
1046+
previous: event.previous?.session?.hasJoinedSession,
1047+
current: event.changes.session.hasJoinedSession,
1048+
isInitializing: isInitializing,
1049+
iframeBeforeRender: !!document.querySelector(`#${this.containerId} iframe`)
1050+
});
1051+
9521052
logger.debug('🎵 YouTube DJ | Widget re-rendering for USER session JOIN:', {
9531053
previous: event.previous?.session?.hasJoinedSession,
9541054
current: event.changes.session.hasJoinedSession
9551055
});
1056+
9561057
this.render();
1058+
1059+
// Check iframe after render
1060+
setTimeout(() => {
1061+
console.error('🎵 PROD DEBUG | After full render:', {
1062+
iframeAfterRender: !!document.querySelector(`#${this.containerId} iframe`),
1063+
containerHTML: document.getElementById(this.containerId)?.innerHTML
1064+
});
1065+
}, 100);
9571066
} else if (
9581067
event.changes.session?.hasJoinedSession === true &&
9591068
event.previous?.session?.hasJoinedSession === false &&
@@ -970,16 +1079,26 @@ export class YouTubePlayerWidget {
9701079
logger.debug('🎵 YouTube DJ | Widget handling session LEAVE without re-render');
9711080
this.updateSessionLeaveWithoutRender();
9721081
} else {
1082+
console.error('🎵 PROD DEBUG | Selective update path taken:', {
1083+
isMutedChange: event.changes.player?.isMuted !== undefined,
1084+
volumeChange: event.changes.player?.volume !== undefined,
1085+
membersChange: event.changes.session?.members !== undefined,
1086+
djChange: event.changes.session?.djUserId !== undefined,
1087+
otherChanges: Object.keys(event.changes || {}).filter(k => !['player', 'session'].includes(k))
1088+
});
1089+
9731090
// Handle specific player state changes without re-rendering
9741091
if (event.changes.player?.isMuted !== undefined) {
9751092
// Mute state changed - update only the mute button
1093+
console.error('🎵 PROD DEBUG | Updating mute button only (no re-render)');
9761094
logger.debug('🎵 YouTube DJ | Widget updating mute button for mute state change');
9771095
this.updateMuteButton();
9781096
return;
9791097
}
9801098

9811099
if (event.changes.player?.volume !== undefined) {
9821100
// Volume state changed - update only the volume slider
1101+
console.error('🎵 PROD DEBUG | Updating volume slider only (no re-render)');
9831102
logger.debug('🎵 YouTube DJ | Widget updating volume slider for volume state change');
9841103
this.updateVolumeSlider();
9851104
return;
@@ -990,9 +1109,11 @@ export class YouTubePlayerWidget {
9901109

9911110
// Also update member-related displays without re-rendering
9921111
if (event.changes.session?.members !== undefined || event.changes.session?.djUserId !== undefined) {
1112+
console.error('🎵 PROD DEBUG | Updating member/DJ status (no re-render)');
9931113
logger.debug('🎵 YouTube DJ | Widget updating for member/DJ changes without re-render');
9941114
// Could add specific member/DJ status updates here if needed
9951115
} else {
1116+
console.error('🎵 PROD DEBUG | Updating other elements (no re-render)');
9961117
logger.debug('🎵 YouTube DJ | Widget updating specific elements for player state change');
9971118
}
9981119
}
@@ -1270,6 +1391,15 @@ export class YouTubePlayerWidget {
12701391
* THIS IS THE ONLY INTENDED WAY TO JOIN SESSIONS
12711392
*/
12721393
async joinSession(): Promise<void> {
1394+
// PRODUCTION DEBUG: Session join start
1395+
console.error('🎵 PROD DEBUG | Session join starting:', {
1396+
playerExists: !!this.player,
1397+
playerReady: this.isPlayerReady,
1398+
containerExists: !!document.getElementById(this.containerId),
1399+
iframe: !!document.querySelector(`#${this.containerId} iframe`),
1400+
isJoiningSession: this.isJoiningSession
1401+
});
1402+
12731403
logger.debug('🎵 YouTube DJ | Joining session from widget...');
12741404

12751405
// Set flag to prevent re-renders during join process
@@ -1278,8 +1408,35 @@ export class YouTubePlayerWidget {
12781408
try {
12791409
// Check if iframe exists and restore it if needed
12801410
try {
1411+
// PRODUCTION DEBUG: Before ensure player exists
1412+
console.error('🎵 PROD DEBUG | Before ensurePlayerExists:', {
1413+
playerExists: !!this.player,
1414+
playerReady: this.isPlayerReady,
1415+
containerExists: !!document.getElementById(this.containerId),
1416+
iframe: !!document.querySelector(`#${this.containerId} iframe`),
1417+
containerHTML: document.getElementById(this.containerId)?.innerHTML
1418+
});
1419+
12811420
await this.ensurePlayerExists();
1421+
1422+
// PRODUCTION DEBUG: After ensure player exists
1423+
console.error('🎵 PROD DEBUG | After ensurePlayerExists:', {
1424+
playerExists: !!this.player,
1425+
playerReady: this.isPlayerReady,
1426+
containerExists: !!document.getElementById(this.containerId),
1427+
iframe: !!document.querySelector(`#${this.containerId} iframe`),
1428+
containerHTML: document.getElementById(this.containerId)?.innerHTML
1429+
});
12821430
} catch (error) {
1431+
// PRODUCTION DEBUG: ensurePlayerExists failed
1432+
console.error('🎵 PROD DEBUG | ensurePlayerExists failed:', {
1433+
error: error.message,
1434+
playerExists: !!this.player,
1435+
playerReady: this.isPlayerReady,
1436+
containerExists: !!document.getElementById(this.containerId),
1437+
iframe: !!document.querySelector(`#${this.containerId} iframe`)
1438+
});
1439+
12831440
logger.warn('🎵 YouTube DJ | Could not ensure player exists, continuing with existing player:', error);
12841441
// Continue with session join even if player recreation fails
12851442
}

0 commit comments

Comments
 (0)