feat(extensions): add willytop8.click-ripple cursor-effect example#411
feat(extensions): add willytop8.click-ripple cursor-effect example#411willytop8 wants to merge 1 commit intowebadderallorg:mainfrom
Conversation
|
|
|
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: Path: .coderabbit.yaml Review profile: CHILL Plan: Pro Plus Run ID: ⛔ Files ignored due to path filters (6)
📒 Files selected for processing (10)
✅ Files skipped from review due to trivial changes (7)
🚧 Files skipped from review as they are similar to previous changes (3)
📝 WalkthroughWalkthroughAdds a new "Click Ripple" extension example: documentation, manifest, build tooling, TypeScript types, source implementation that registers a cursor-effect rendering ripple/pulse/burst animations on clicks, and supporting project files (README, LICENSE, package, tsconfig, .gitignore). ChangesClick Ripple Extension Example
Sequence DiagramsequenceDiagram
actor User
participant Recordly as Recordly Core
participant Ext as ClickRipple Extension
participant Canvas as Render Canvas
User->>Recordly: click (position + button)
Recordly->>Ext: invoke registered cursor effect with context
Ext->>Ext: read settings, compute elapsed/progress/style/coords
Ext->>Canvas: draw frame (ripple / pulse / burst)
Ext-->>Recordly: return true/false (continue or stop)
Recordly->>Canvas: composite frame into preview/export
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~25 minutes Possibly related PRs
Suggested labels
Poem
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
Tip 💬 Introducing Slack Agent: The best way for teams to turn conversations into code.Slack Agent is built on CodeRabbit's deep understanding of your code, so your team can collaborate across the entire SDLC without losing context.
Built for teams:
One agent for your entire SDLC. Right inside Slack. Review rate limit: 8/10 reviews remaining, refill in 10 minutes and 31 seconds. Comment |
|
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 2
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@extension-examples/willytop8.click-ripple/README.md`:
- Line 11: The README currently hard-codes the release asset name
"recordly-click-ripple-1.0.0.zip" which will become stale; change the
instruction to point users to the latest release rather than a versioned
filename—for example, link to the repository Releases page or use a "latest"
release asset URL instead of "recordly-click-ripple-1.0.0.zip" so the install
step always references the newest ZIP; update the line that mentions
"recordly-click-ripple-1.0.0.zip" accordingly.
In `@extension-examples/willytop8.click-ripple/src/index.ts`:
- Around line 52-53: The division by t.scale when computing x and y can produce
Infinity/NaN if t.scale is 0 or non-finite; in the block that computes x and y
(using variables t, ctx, ctx.cx, ctx.cy, ctx.width, ctx.height) add a guard that
checks t && Number.isFinite(t.scale) && t.scale !== 0 before using ( ... /
t.scale ), and otherwise fall back to a safe no-transform calculation (e.g. use
ctx.cx * ctx.width and ctx.cy * ctx.height) or a normalized safeScale (like 1)
so the draw path never receives invalid coordinates.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro Plus
Run ID: 31241a7c-3fc6-454e-acec-1902c7ba5e7a
⛔ Files ignored due to path filters (6)
extension-examples/willytop8.click-ripple/dist/index.jsis excluded by!**/dist/**extension-examples/willytop8.click-ripple/package-lock.jsonis excluded by!**/package-lock.jsonextension-examples/willytop8.click-ripple/screenshots/burst-style.pngis excluded by!**/*.pngextension-examples/willytop8.click-ripple/screenshots/pulse-style.pngis excluded by!**/*.pngextension-examples/willytop8.click-ripple/screenshots/ripple-style.pngis excluded by!**/*.pngextension-examples/willytop8.click-ripple/screenshots/settings-panel.pngis excluded by!**/*.png
📒 Files selected for processing (10)
EXTENSIONS.mdextension-examples/willytop8.click-ripple/.gitignoreextension-examples/willytop8.click-ripple/LICENSEextension-examples/willytop8.click-ripple/README.mdextension-examples/willytop8.click-ripple/build.mjsextension-examples/willytop8.click-ripple/package.jsonextension-examples/willytop8.click-ripple/recordly-extension.jsonextension-examples/willytop8.click-ripple/src/index.tsextension-examples/willytop8.click-ripple/src/recordly-types.d.tsextension-examples/willytop8.click-ripple/tsconfig.json
|
|
3 similar comments
|
|
|
|
|
|
Adds a cursor-effect extension under extension-examples/ demonstrating registerCursorEffect() with three switchable styles (ripple, pulse, burst) and a settings panel nested under the Cursor section. Also adds a one-line entry to EXTENSIONS.md under ## Examples.
willytop8
force-pushed
the
feature/click-ripple-extension-example
branch
from
7712278 to
5de8d44
Compare
|
|
1 similar comment
|
|
|
Closing to reopen with a cleaner PR. |
1 participant
Description
Adds a packaged example extension under
extension-examples/willytop8.click-ripple/demonstratingregisterCursorEffect()with three switchable styles (ripple, pulse, burst) and a settings panel nested under the existing Cursor section.Motivation
EXTENSIONS.mdreferencesextension-examples/and currently lists one bundle (webadderall.more-wallpapers). A cursor-effect example gives extension authors a working reference for the cursor APIs (registerCursorEffect,CursorEffectContext, settings panel nesting viaparentSection) which are not covered by the existing wallpaper-bundle example.The bundle is also separately published as a standalone repo at https://github.com/willytop8/recordly-click-ripple.
Type of Change
EXTENSIONS.md## Examples)Screenshots
Settings panel nested under Cursor:
Ripple style:
Pulse style:
Burst style:
Testing Guide
cp -r extension-examples/willytop8.click-ripple ~/Library/Application\ Support/Recordly/extensions/(macOS). The directory is also accessible via Extensions → Open Directory in the app.npm run dev).Implementation Notes
["cursor", "ui"]only.extension-examples/.src/index.ts, bundled todist/index.jsvia esbuild. Both committed (bundle is what the manifest'smainpoints to).videoLayout.maskRect.widthrather than canvas width so it renders consistently across export resolutions and padding settings.Checklist
🤖 Generated with Claude Code
Summary by CodeRabbit
New Features
Documentation
Chores