You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
{{ message }}
Repository navigation
feat(lightbox): play live photos from a dock button in v7 and v8 - #4933
Hide the LivePhotosKit LIVE badge in the main lightbox and add a play/stop toggle to the dock. While on, a muted looping video of the clip plays over the still until the button is turned off. Viewers without edit rights get a dock with only this button. Flow and Moderation keep the native controls.
Spec impact: FR-100-06, S-100-25, S-100-26, UI-100-04 added to feature 100
Summary by CodeRabbit
New Features
Added play and stop controls for Live Photos in the v7 and v8 lightbox docks, including for viewers without photo-editing access.
Live Photos play as muted, looping video overlays. Dock controls are keyboard-operable and have accessible labels.
Added translated labels for clockwise and counterclockwise photo-rotation actions.
Bug Fixes
Playback stops when a video fails, the displayed photo changes, or the lightbox closes.
Dock visibility accounts for photo-editing, zoom, and PDF states.
Hide the LivePhotosKit LIVE badge in the main lightbox and add a play/stop toggle to the dock. While on, a muted looping video of the clip plays over the still until the button is turned off. Viewers without edit rights get a dock with only this button. Flow and Moderation keep the native controls.
Spec impact: FR-100-06, S-100-25, S-100-26, UI-100-04 added to feature 100
Included review availability: This review used your included allowance. Your plan provides up to 8 included reviews per hour; 5 remain after this review.
Walkthrough
The v7 and v8 lightboxes add a dock button for Live Photo playback through a looping video overlay. A shared composable tracks playback state and control ownership. The dock can appear for viewers without edit permission. The changes also update accessibility labels, translations, tests, and feature documentation.
The specification describes dock-controlled playback, button states, and viewer scenarios. The plan and task list track the related increment and work. The knowledge map records the playback arrangement and native-control exception.
Shared toggle and playback state resources/js/stores/PhotoState.ts, resources/js/composables/photo/useLivePhotoToggle.ts, resources/js/composables/photo/useLivePhotoToggle.test.ts
The store and composable track the active playback control and playing state. Tests cover toggling, stopping, deactivation, and overlapping photo-box lifecycles.
Lightbox video overlays resources/js/v7/components/gallery/photoModule/PhotoBox.vue, resources/js/v8/components/gallery/photoModule/PhotoBox.vue
Both photo boxes render a looping video overlay during dock-controlled playback and stop playback on video errors. LivePhotosKit renders the still and retains native controls outside dock-controlled playback.
Dock controls and visibility resources/js/v7/components/gallery/photoModule/Dock.vue, resources/js/v7/components/gallery/photoModule/DockButton.vue, resources/js/v7/components/gallery/photoModule/PhotoPanel.vue, resources/js/v8/components/gallery/photoModule/Dock.vue, resources/js/v8/components/gallery/photoModule/DockButton.vue, resources/js/v8/components/gallery/photoModule/PhotoPanel.vue, lang/*/gallery.php
The docks show the Live Photo control separately from edit actions. The panels show the dock when the viewer can edit or Live Photo controls are available, subject to view-specific conditions. Dock controls use button elements and translated labels.
The updated playback specification presents no identified merge-blocking issue.
Pre-merge checks: 1
Failed checks: 1 warning
Check name
Status
Explanation
Resolution
Docstring Coverage
Docstring coverage is 50.00% which is insufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff with cyclomatic complexity of at least 2. Documenta…
Write docstrings for the functions missing them to satisfy the coverage threshold.
Full details: Docstring Coverage
Explanation
Docstring coverage is 50.00% which is insufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff with cyclomatic complexity of at least 2. Documentation-only edits and deletions within surviving functions are included; unchanged diff context and fully deleted functions are excluded. Analyzed 2 functions across 26 files. (1 skipped: 1 unsupported.)
Resolution
Write docstrings for the functions missing them to satisfy the coverage threshold.
Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.
A rabbit taps the dock to start, A looping clip springs into view. The still stays near, the controls track, Then errors bring the motion back. New labels help the buttons speak, And tests check each transition’s beat.
Included review availability: This review used your included allowance. Your plan provides up to 8 included reviews per hour; 7 remain after this review.
DockButton renders a button instead of an anchor without href in v7 and v8, so every dock button can be focused and triggered with Enter or Space. The live photo button gets an aria-label and aria-pressed. Record the owner's Firefox and Chrome checks on the feature 100 tasks.
Spec impact: FR-100-06 accessibility details, T-100-28 added
Included review availability: This review used your included allowance. Your plan provides up to 8 included reviews per hour; 7 remain after this review.
Every icon-only dock button in v7 and v8 gets a translated aria-label, with new gallery.photo.actions.rotate_ccw and rotate_cw keys in all locales. The watermark tooltip uses the existing translated key instead of a hard-coded string.
Align the plan scope, FR-100-06, UI-100-04 and the knowledge map with the dock video overlay and the useLivePhotoToggle composable that owns the control registration.
Spec impact: FR-100-06 and UI-100-04 wording, T-100-29 added
The reason will be displayed to describe this comment to others. Learn more.
Follow-up Comments
Stop live playback when the photo changes.
36-48: Minor · Functional Correctness · Quick win
Stop live playback when the photo changes.
On Timeline and Album, a next or previous step from a playing live photo to another live photo remounts PhotoBox under the keyed PhotoPanel transition. The outgoing box keeps its local playing state until its leave transition ends. The shared useLivePhotoToggle composable stops playback only when isActive changes, so the outgoing clip keeps playing during that transition.
Included review availability: This review used your included allowance. Your plan provides up to 8 included reviews per hour; 6 remain after this review.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
Hide the LivePhotosKit LIVE badge in the main lightbox and add a play/stop toggle to the dock. While on, a muted looping video of the clip plays over the still until the button is turned off. Viewers without edit rights get a dock with only this button. Flow and Moderation keep the native controls.
Spec impact: FR-100-06, S-100-25, S-100-26, UI-100-04 added to feature 100
Summary by CodeRabbit