Conversation
The JavaScript code already supported parallax attributes (parallaxEnabled, parallaxStrength) for static block output, but the PHP render_block filter was missing this support for dynamic blocks on the frontend. This change ensures that when parallax is enabled on a block: - The data-parallax and data-parallax-strength attributes are added - The --parallax-strength CSS custom property is set inline - Frontend styles are properly enqueued This was identified as a missing feature from the READING-PROGRESS-BAR.md roadmap documentation.
Ran npm run lint:js and npm run lint:css to apply consistent code formatting across the codebase per project conventions.
|
🤖 Hi @fellyph, I've received your request, and I'm working on it now! You can track my progress in the logs for more details. |
![github-actions[bot]](https://avatars.githubusercontent.com/in/15368?s=60&v=4){kind=small}
There was a problem hiding this comment.
📋 Review Summary
This Pull Request introduces parallax functionality and significantly refactors the codebase for improved consistency in indentation and coding style. The changes are well-implemented and enhance the plugin's features while maintaining good code quality.
🔍 General Feedback
- The refactoring to use tabs for indentation across multiple file types (PHP, JS, CSS, TS) is a great step towards maintaining a consistent coding style throughout the project.
- The new parallax feature is integrated cleanly into both the backend logic and the frontend editor controls.
- The use of new variables in
my-scroll-block.phpfor conditional checks enhances readability and maintainability. - Good attention to detail in updating existing tests for the new formatting.
| $attrs = $block['attrs']; | ||
| if ( isset( $attrs['animationType'] ) && 'none' !== $attrs['animationType'] ) { | ||
|
|
||
| $has_animation = isset( $attrs['animationType'] ) && 'none' !== $attrs['animationType']; |
There was a problem hiding this comment.
🟢 This condition is crucial for determining whether to apply scroll animation or parallax effects. A brief comment explaining its purpose would enhance code clarity.
| opacity: 0; | ||
| transition: opacity 0.3s ease; | ||
| } | ||
|
|
There was a problem hiding this comment.
🟢 For consistency, consider using double quotes for string content.
src/progress-block/style.css
Outdated
| counter-increment: percentage 100; | ||
| content: counter(percentage); | ||
| } | ||
| } |
There was a problem hiding this comment.
🟢 For consistency, consider using double quotes for string content.
| */ | ||
|
|
||
| /* Base defaults */ | ||
| @property --anim-displacement-horizontal { |
There was a problem hiding this comment.
🟢 For consistency, consider using double quotes for string syntax.
| inherits: true; | ||
| initial-value: 10vw; | ||
| } | ||
|
|
There was a problem hiding this comment.
🟢 For consistency, consider using double quotes for string syntax.
src/style.css
Outdated
| animation-timeline: scroll(root block); | ||
| animation-range: 0% 100%; | ||
| } | ||
|
|
There was a problem hiding this comment.
🟢 For consistency, consider using double quotes for data attribute selectors.
- Add helper functions to properly dismiss WordPress welcome modal - Handle multiple possible modal dismiss button patterns - Add helper function for adding paragraph blocks with proper waiting - Improve element waiting with explicit timeouts - Wait for sidebar to be ready before interacting with animation controls - Apply code formatting with Prettier
2 participants
The JavaScript code already supported parallax attributes (parallaxEnabled,
parallaxStrength) for static block output, but the PHP render_block filter
was missing this support for dynamic blocks on the frontend.
This change ensures that when parallax is enabled on a block:
This was identified as a missing feature from the READING-PROGRESS-BAR.md
roadmap documentation.