Feat/godam player loading

[KMchaudhary]

Partially Fixes: Performance of Video Loading (rtCamp/godam-core#731)

This pull request refactors how video player styles are loaded and improves the loading experience for the Godam video player. The main focus is on removing the redundant godam-player-frontend-style stylesheet, ensuring critical wrapper styles are loaded inline for faster rendering, and enhancing the video player's loading and placeholder UI. Several files are updated to reflect these changes, including PHP, SCSS, and JavaScript files.

Style and Asset Loading Improvements:

• Removed all references to the godam-player-frontend-style stylesheet from block registration, PHP enqueues, and dependencies, consolidating style usage to godam-player-style for simplicity and maintainability. [1] [2] [3] [4] [5] [6] [7] [8]
• Added logic to inc/templates/godam-player.php to output the godam-player-wrapper.css styles inline with high priority, ensuring fast and reliable rendering of wrapper styles and preventing FOUC (flash of unstyled content).

Video Player Loading and Placeholder Enhancements:

• Refactored the video player's loading structure in the template to use a dedicated .godam-video-placeholder and .easydam-video-container.loading for clearer separation of loading state and video content, including better poster image handling.
• Updated the player initialization logic in videoPlayer.js to hide the placeholder and reveal the video container once the player is ready, improving perceived performance and user experience.

Styling and Animation Updates:

• Added new SCSS for .godam-video-placeholder, .godam-animate-video-loading, and related classes, including responsive play button styling and a refined pulse animation for loading state. [1] [2]
• Ensured video.js styles are imported only in the main SCSS, not redundantly in JS, to avoid duplication and improve build efficiency. [1] [2]

Before

Screen.Recording.2026-02-11.at.2.38.19.PM.mov

After

Screen.Recording.2026-02-11.at.2.30.00.PM.mov

Testing Instructions

Step 1: Add the GoDAM video block above the fold area on the page and test with Slow 4G network speed.

Screen.Recording.2026-02-11.at.2.30.00.PM.mov

Step 2: Verify the video player container loads within its boundaries, and no layout shift should be noticed during page load.

[rtBot]

Code analysis identified issues

action-phpcs-code-review has identified potential problems in this pull request during automated scanning. We recommend reviewing the issues noted and that they are resolved.

phpcs scanning turned up:

🚫 2 errors

---

Powered by rtCamp's GitHub Actions Library

[Copilot]

Pull request overview

This PR updates GoDAM player loading behavior by introducing a pre-init placeholder UI and attempting to prioritize initial render styles, while also consolidating CSS delivery by removing the separate “frontend” stylesheet and moving Video.js styles into the main player stylesheet.

Changes:

• Inline-inject a new “player wrapper” stylesheet early (via wp_head) and add a poster-based placeholder skeleton before player initialization.
• Remove godam-player-frontend-style registrations/enqueues and stop importing Video.js CSS from JS.
• Update player JS initialization to hide the placeholder and reveal the real player container.

Reviewed changes

Copilot reviewed 11 out of 11 changed files in this pull request and generated 7 comments.

Show a summary per file

File	Description
inc/templates/godam-player.php	Adds inline CSS injection and introduces the new placeholder markup + loading container class changes.
inc/classes/shortcodes/class-godam-video-gallery.php	Removes enqueue of the removed godam-player-frontend-style handle.
inc/classes/shortcodes/class-godam-player.php	Removes registration/enqueue of the removed godam-player-frontend-style handle.
inc/classes/fluentforms/fields/class-recorder-field.php	Removes enqueue of the removed godam-player-frontend-style handle.
inc/classes/elementor-widgets/class-godam-video.php	Drops dependency on the removed godam-player-frontend-style handle.
inc/classes/elementor-widgets/class-godam-gallery.php	Drops dependency on the removed godam-player-frontend-style handle.
assets/src/js/godam-player/videoPlayer.js	Changes “loading state cleanup” logic to hide the new placeholder and remove .loading.
assets/src/js/godam-player/frontend.js	Removes JS import of Video.js CSS.
assets/src/css/godam-player.scss	Attempts to include Video.js CSS from SCSS and tweaks pulse opacity.
assets/src/css/godam-player-wrapper.scss	Adds new wrapper/placeholder/loading CSS and hides .easydam-video-container.loading.
assets/src/blocks/godam-player/block.json	Removes references to the removed godam-player-frontend-style style handle.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[subodhr258]

LGTM, approved with comment
Tested again as well

Stale review