WordPress.org
Get WordPress

Plugin Directory

Changeset 3468098


Ignore:
Timestamp:
02/23/2026 11:50:40 PM (5 weeks ago)
Author:
klate
Message:

Release 1.0.1: fix button CLS, add Playground support, update readme and banners

Location:
glitter-bomb
Files:
2 added
8 edited
5 copied

Legend:

Unmodified
Added
Removed

  • glitter-bomb/tags/1.0.1/build/block.json

    r3466160 r3468098  
    33  "apiVersion": 3,
    44  "name": "glitter-bomb/glitter-bomb",
    5   "version": "1.0.0",
     5  "version": "1.0.1",
    66  "title": "Glitter Bomb",
    77  "category": "widgets",

  • glitter-bomb/tags/1.0.1/build/style-index.css

    r3466160 r3468098  
    1 .wp-block-glitter-bomb-glitter-bomb{min-height:50px;position:relative}.glitter-bomb-toggle{border:2px solid #fff;border-radius:8px;box-shadow:0 4px 12px rgba(0,0,0,.15);cursor:pointer;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;font-size:14px;font-weight:600;min-height:44px;min-width:44px;padding:12px 16px;position:fixed;transition:all .3s ease;z-index:9999;-webkit-tap-highlight-color:rgba(0,0,0,0);touch-action:manipulation;-webkit-user-select:none;-moz-user-select:none;user-select:none}.glitter-bomb-toggle:hover{box-shadow:0 6px 16px rgba(0,0,0,.2);filter:brightness(1.1);transform:translateY(-2px)}.glitter-bomb-toggle:focus{outline:3px solid #4a90e2;outline-offset:2px}.glitter-bomb-toggle:active{transform:translateY(0)}.glitter-bomb-toggle.position-top-left{left:20px;top:20px}.glitter-bomb-toggle.position-top-right{right:20px;top:20px}.glitter-bomb-toggle.position-bottom-left{bottom:20px;left:20px}.glitter-bomb-toggle.position-bottom-right{bottom:20px;right:20px}.glitter-bomb-canvas{height:100%;left:0;pointer-events:none;position:fixed;top:0;touch-action:none;width:100%;z-index:9998}.glitter-bomb-sr-only{height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;clip:rect(0,0,0,0);border-width:0;white-space:nowrap}@media(prefers-reduced-motion:reduce){.glitter-bomb-toggle{transition:none}.glitter-bomb-toggle:hover{transform:none}}
     1.wp-block-glitter-bomb-glitter-bomb{min-height:50px;position:relative}.glitter-bomb-toggle{border:2px solid #fff;border-radius:8px;box-shadow:0 4px 12px rgba(0,0,0,.15);cursor:pointer;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;font-size:14px;font-weight:600;min-height:44px;min-width:44px;padding:12px 16px;position:fixed;transition:transform .3s ease,box-shadow .3s ease,filter .3s ease;z-index:9999;-webkit-tap-highlight-color:rgba(0,0,0,0);touch-action:manipulation;-webkit-user-select:none;-moz-user-select:none;user-select:none}.glitter-bomb-toggle:hover{box-shadow:0 6px 16px rgba(0,0,0,.2);filter:brightness(1.1);transform:translateY(-2px)}.glitter-bomb-toggle:focus{outline:3px solid #4a90e2;outline-offset:2px}.glitter-bomb-toggle:active{transform:translateY(0)}.glitter-bomb-toggle.position-top-left{left:20px;top:20px}.glitter-bomb-toggle.position-top-right{right:20px;top:20px}.glitter-bomb-toggle.position-bottom-left{bottom:20px;left:20px}.glitter-bomb-toggle.position-bottom-right{bottom:20px;right:20px}.glitter-bomb-canvas{height:100%;left:0;pointer-events:none;position:fixed;top:0;touch-action:none;width:100%;z-index:9998}.glitter-bomb-sr-only{height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;clip:rect(0,0,0,0);border-width:0;white-space:nowrap}@media(prefers-reduced-motion:reduce){.glitter-bomb-toggle{transition:none}.glitter-bomb-toggle:hover{transform:none}}

  • glitter-bomb/tags/1.0.1/glitter-bomb.php

    r3466160 r3468098  
    33 * Plugin Name:       Glitter Bomb
    44 * Plugin URI:        https://klatespencer.com/glitter-bomb/
    5  * Description:       Create magical, accessible particle effects with cursor-following sparkles and full-screen glitter fields. Two experience modes: Sprinkle Trail and Particle Field. WCAG 2.2 AA compliant with full keyboard and screen reader support.
    6  * Version:           1.0.0
     5 * Description:       Create animated particle effects with cursor and touch following sparkles and full-screen glitter fields. Two experience modes: Sprinkle Trail and Particle Field. WCAG 2.2 AA compliant. Optimized for mobile.
     6 * Version:           1.0.1
    77 * Requires at least: 6.1
    88 * Requires PHP:      7.4
    … …  
    1515 *
    1616 * @package GlitterBomb
    17  * @version 1.0.0
     17 * @version 1.0.1
    1818 */
    1919
    … …  
    2323
    2424// Define plugin constants
    25 define( 'GLITTER_BOMB_VERSION', '1.0.0' );
     25define( 'GLITTER_BOMB_VERSION', '1.0.1' );
    2626define( 'GLITTER_BOMB_PLUGIN_DIR', plugin_dir_path( __FILE__ ) );
    2727define( 'GLITTER_BOMB_PLUGIN_URL', plugin_dir_url( __FILE__ ) );

  • glitter-bomb/tags/1.0.1/readme.txt

    r3466160 r3468098  
    22
    33Contributors:      klate
    4 Tags:              block, particles, glitter, animation, accessibility
     4Tags:              particles, animation, interactive, cursor, effects
    55Tested up to:      6.9
    6 Stable tag:        1.0.0
     6Stable tag:        1.0.1
    77License:           GPLv2 or later
    88License URI:       https://www.gnu.org/licenses/gpl-2.0.html
    … …  
    1010Requires PHP:      7.4
    1111
    12 Create magical, accessible particle effects with cursor-following sparkles and full-screen glitter fields. WCAG 2.2 AA compliant.
     12Maximalist particle effects for WordPress — touch-responsive sparkle trails and glitter fields. WCAG 2.2 AA compliant.
    1313
    1414== Description ==
    1515
    16 Glitter Bomb brings wildly extra, interactive particle effects to your WordPress site with two delightful experience modes that work beautifully on **desktop, tablet, and mobile devices** with full **touch and gesture support**.
     16Haven't you ever wondered what the world would be like if GeoCities worked on your phone? Glitter Bomb brings interactive cursor effects and confetti-style particle fields to WordPress — with touch support that actually works. See it in action at [klatespencer.com/glitter-bomb](https://klatespencer.com/glitter-bomb/).
    1717
    18 **✨ Sprinkle Trail Mode**
    19 Create zany particle trails that follow your cursor on desktop or touch path on mobile devices. Perfectly optimized for touch screens with smooth gesture tracking and responsive sizing. Perfect for adding a touch of magic to hero sections, landing pages, or special announcements.
     18**[✨ Sprinkle Trail Mode](https://klatespencer.com/rainbow-sprinkle/)**
     19Particles follow your cursor on desktop and your finger on mobile with smooth gesture tracking. Choose between compact trails or scattered drifting patterns.
    2020
    21 **💫 Particle Field Mode**
    22 Transform your entire page into a magical canvas filled with hundreds of shimmering glitter particles. Particles gently drift, attract to your cursor or touch, and explode into sparkles on click or tap - creating an enchanting, physics-based experience that works flawlessly across all devices.
     21**[💫 Particle Field Mode](https://klatespencer.com/particle-field/)**
     22Your entire page becomes a canvas of shimmering glitter. Particles drift, attract to your cursor or touch, and explode into sparkles on click or tap.
    2323
    24 **🎯 Why Choose Glitter Bomb?**
     24**Honest assessment:** No site *needs* this. It adds JavaScript, it competes with your content, and enabling it by default on a checkout page would be irresponsible. On a hero section, birthday page, portfolio, or anywhere a little extra is exactly right? Absolutely your call.
    2525
    26 * **Fully Responsive & Mobile-Optimized**: Works beautifully on all screen sizes from mobile phones to desktop monitors with adaptive particle sizing and touch-optimized controls
    27 * **Touch & Gesture Support**: Complete touch event optimization with smooth gesture tracking, tap explosions, and mobile-specific performance enhancements
    28 * **Two Distinct Modes**: Choose between cursor-following sprinkle trails or immersive full-screen particle fields
    29 * **Fully Accessible**: WCAG 2.2 AA compliant with keyboard navigation, screen reader support, and reduced motion respect
    30 * **Performance Optimized**: Advanced optimizations including object pooling, canvas scaling, particle culling, and mobile-specific performance features ensure smooth framerates even on mobile devices
    31 * **Highly Customizable**: Extensive controls for colors, sizes, animation speed, particle behavior, with separate desktop and mobile settings
    32 * **Beautiful Color Palettes**: Choose from Rainbow, Metallic, Neutral Spectrum, Warm Sunset, Cool Ocean, or custom colors - all with smooth cycling animations
    33 * **Zero Configuration**: Works beautifully out of the box with smart defaults, or customize every detail to match your brand
     26**Features:**
    3427
    35 **📱 Mobile & Touch Features:**
     28* Touch-optimized from the start — particle trails follow your finger, tap triggers explosions, separate sizing controls for mobile vs. desktop, and an option to disable on mobile entirely
     29* WCAG 2.2 AA compliant — keyboard navigation, screen reader support, `prefers-reduced-motion` respect
     30* Six color palettes (Rainbow, Metallic, Neutral Spectrum, Warm Sunset, Cool Ocean, Custom)
     31* Customizable toggle button: position, text, and gradient colors
     32* No external dependencies, no tracking, no data collection
     33* Performance optimizations: object pooling, particle culling, canvas scaling, RAF animation
    3634
    37 * **Touch-Optimized Interface**: All controls meet minimum 44x44px touch target requirements
    38 * **Gesture Tracking**: Smooth particle trails follow your finger movements with precision
    39 * **Tap Explosions**: Dramatic sparkle bursts respond to touch taps (Particle Field mode)
    40 * **Separate Mobile Sizing**: Configure different particle sizes for mobile vs desktop for optimal visual balance
    41 * **Mobile Disable Option**: Optionally disable effects on mobile devices for maximum performance flexibility
    42 * **Canvas Resolution Optimization**: Automatically reduces canvas resolution on high-DPI mobile screens for better performance without visual quality loss
    43 * **Touch Event Throttling**: Smart touch event handling prevents overwhelming mobile processors
    44 * **Responsive Viewport**: Automatically adapts to mobile browser UI changes (address bar appearance/disappearance)
    45 
    46 **🎨 Key Features:**
    47 
    48 * **Interactive Effects**: Smooth, animated particles that respond to cursor and touch movements
    49 * **Color Cycling**: Beautiful color palette animations that smoothly transition between hues
    50 * **Physics-Based Movement**: Natural particle behavior with attraction, drift, and spreading forces
    51 * **Click/Tap Explosions**: Dramatic sparkle bursts on click or tap (Particle Field mode)
    52 * **Customizable Controls**: Adjust opacity, size, speed, particle count, and behavior
    53 * **Position Control**: Place toggle button in any screen corner
    54 * **Enable by Default**: Choose whether effects are active on page load
    55 * **User Preferences**: Remembers user's enable/disable choice across sessions
    56 * **Gradient Buttons**: Beautiful gradient controls that automatically match your color palette
    57 * **Compact or Scattered**: Choose particle display behavior (Sprinkle Trail mode)
    58 * **Mobile Optimization**: Separate sizing controls and optional disable for mobile devices
    59 
    60 **♿ Accessibility Features:**
    61 
    62 * Keyboard activation with Enter and Space keys
    63 * Screen reader announcements via ARIA live regions
    64 * Semantic HTML structure
    65 * Visible focus indicators
    66 * Respects `prefers-reduced-motion` settings
    67 * Minimum 44x44px touch targets for mobile
    68 * WCAG 2.2 AA color contrast compliance
    69 
    70 **⚡ Performance Features:**
    71 
    72 * Object pooling for efficient memory usage
    73 * RequestAnimationFrame optimization
    74 * Particle culling for off-screen particles
    75 * Canvas resolution scaling on mobile devices
    76 * Touch event optimization
    77 * Tab visibility detection to pause animations
    78 * Smart particle limits to maintain smooth framerates
    79 * Mobile-specific performance enhancements
    80 
    81 **💻 Developer Friendly:**
    82 
    83 * Clean-ish, well-documented code
    84 * WordPress coding standards compliant
    85 * No external dependencies
    86 * Lightweight bundle size
    87 * Proper cleanup and resource management
    88 * Safari privacy-friendly (non-fingerprinting)
     35Built with [Telex](https://telex.im) and [Claude Code](https://claude.ai/code). More details at [klatespencer.com/glitter-bomb](https://klatespencer.com/glitter-bomb/).
    8936
    9037== Installation ==
    9138
    92 **Automatic Installation:**
     391. In your WordPress dashboard, go to Plugins → Add New
     402. Search for "Glitter Bomb" and click Install, then Activate
     413. Add the "Glitter Bomb" block to any post or page from the block editor
     424. Customize in the right sidebar — effects only appear on the frontend, not in the editor
    9343
    94 1. Log in to your WordPress dashboard
    95 2. Navigate to Plugins → Add New
    96 3. Search for "Glitter Bomb"
    97 4. Click "Install Now" and then "Activate"
    98 5. Add the block to any post or page using the block editor
    99 
    100 **Manual Installation:**
    101 
    102 1. Download the plugin ZIP file
    103 2. Log in to your WordPress dashboard
    104 3. Navigate to Plugins → Add New → Upload Plugin
    105 4. Choose the downloaded ZIP file and click "Install Now"
    106 5. Activate the plugin
    107 6. Add the "Glitter Bomb" block to any post or page
    108 
    109 **After Installation:**
    110 
    111 1. Edit any post or page with the block editor
    112 2. Click the "+" button to add a new block
    113 3. Search for "Glitter Bomb" or find it in the Widgets category
    114 4. Add the block to your content
    115 5. Customize using the settings in the right sidebar
    116 6. Preview on the frontend - effects only appear outside the editor
    117 7. Test on mobile devices to experience the touch-optimized interface
     44**Manual install:** Download the ZIP, go to Plugins → Add New → Upload Plugin.
    11845
    11946== Frequently Asked Questions ==
    12047
    121 = Why don't I see the particles in the editor? =
     48= Why don't I see particles in the editor? =
    12249
    123 The particle effects only appear on the frontend to prevent performance issues in the editor. The editor displays a beautiful preview with settings summary and all customization controls. Click the expand/collapse toggle to view your current settings.
     50Effects only render on the frontend. The editor shows a settings summary instead.
    12451
    125 = Does this work on mobile devices and tablets? =
     52= Does this work on mobile? =
    12653
    127 Absolutely! Glitter Bomb is fully optimized for mobile and tablet devices with:
    128 * Complete touch event support for particle trails following your finger
    129 * Tap-responsive explosion effects
    130 * Separate mobile particle size controls for optimal visual balance
    131 * Canvas resolution optimization for better performance on high-DPI screens
    132 * Touch-optimized toggle button meeting minimum 44x44px touch target requirements
    133 * Optional mobile disable feature for older devices
    134 * Responsive viewport handling that adapts to mobile browser UI changes
    135 * Smooth gesture tracking with touch event throttling
     54Yes. Particle trails follow your finger with smooth gesture tracking, tap triggers sparkle explosions in Particle Field mode, and you can configure separate particle sizes for mobile vs. desktop. If you need to, you can disable effects on mobile entirely — but the touch interactions are the fun part.
    13655
    137 The plugin works beautifully on iOS (iPhone/iPad), Android phones and tablets, and all modern touch-enabled devices.
     56= Is it accessible? =
    13857
    139 = Is this block accessible? =
     58Yes. WCAG 2.2 AA compliant: keyboard navigation, screen reader announcements via ARIA live regions, visible focus indicators, and automatic respect for `prefers-reduced-motion` per [WCAG 2.1 Success Criterion 2.3.3](https://www.w3.org/WAI/WCAG21/Understanding/animation-from-interactions.html).
    14059
    141 Yes! Glitter Bomb was built with WCAG 2.2 AA criteria in mind and includes:
    142 * Complete keyboard navigation support
    143 * Screen reader announcements
    144 * Focus indicators that meet contrast requirements
    145 * Respect for `prefers-reduced-motion` user preferences
    146 * Minimum touch target sizes for mobile (44x44px)
    147 * Semantic HTML structure
     60= What's the difference between the two modes? =
    14861
    149 = How many particles can be displayed at once? =
     62**Sprinkle Trail** creates particles that follow cursor or touch movement in compact or scattered patterns. **Particle Field** fills the entire viewport with physics-based glitter that drifts, attracts to your cursor, and explodes on click.
    15063
    151 For optimal performance across all devices:
    152 * **Sprinkle Trail mode**: Maximum 100 particles (default 50)
    153 * **Particle Field mode**: Maximum 500 particles (default 200)
     64= Will this slow down my site? =
    15465
    155 You can adjust these limits in the block settings. The plugin uses advanced optimizations to ensure smooth performance even at higher particle counts on both desktop and mobile devices.
     66Only on pages where the block is used — scripts and styles are loaded conditionally and won't touch pages that don't have the block. On pages that do have it, yes, there's an inordinate amount of JavaScript making this work. Object pooling, particle culling, canvas scaling, and smart particle limits help keep it reasonable — but it's still a lot. Plan accordingly.
    15667
    157 = Will this affect my site's performance? =
     68= Can users turn it off? =
    15869
    159 Yes, 100% this is a wildly extra effect with a ton of JavaScript. However, I've done my best to mitigate that by applying:
    160 * Object pooling reduces memory usage
    161 * Particle culling prevents off-screen rendering
    162 * Canvas scaling optimizes mobile performance
    163 * Touch event throttling prevents overwhelming mobile processors
    164 * Animation pauses when tab is hidden
    165 * Smart particle limits maintain smooth framerates
    166 * Proper resource cleanup prevents memory leaks
    167 * Mobile-specific optimizations for high-DPI screens
     70Yes, always. There's a customizable toggle button (position, text, colors) and the plugin remembers the user's choice for the session. If you're going to shove glitter in people's faces, at least have the decency to let them turn it off.
    16871
    169 = Can I customize the colors? =
     72= How many particles? =
    17073
    171 Yes! You have multiple color options:
    172 * **Pre-defined palettes**: Rainbow, Metallic, Neutral Spectrum, Warm Sunset, Cool Ocean
    173 * **Color cycling**: All palettes smoothly cycle through their colors
    174 * **Custom colors**: Use the color picker for precise color control
    175 * **Gradient buttons**: Toggle buttons automatically match your palette or use custom gradients
     74Sprinkle Trail: up to 100 (default 50). Particle Field: up to 500 (default 200).
    17675
    177 = What's the difference between Sprinkle Trail and Particle Field modes? =
     76= Does it collect data or set cookies? =
    17877
    179 **Sprinkle Trail Mode**: Creates particles that follow your cursor or finger on touch devices, perfect for focused effects on specific content areas. Choose between:
    180 * **Compact**: Tight trailing effect with faster fade
    181 * **Scattered**: Particles drift outward as they fade
     78No. Zero tracking, zero analytics. It uses sessionStorage (not cookies) to remember whether a user turned effects on or off — that data never leaves their browser.
    18279
    183 **Particle Field Mode**: Creates a full-screen magical experience with hundreds of particles that:
    184 * Gently drift across the entire viewport
    185 * Attract to your cursor or touch with physics-based movement
    186 * Explode into sparkles on click or tap
    187 * Return to their home positions when cursor/touch leaves
     80= One block per page? =
    18881
    189 = Can users disable the effects? =
    190 
    191 Yes! A customizable toggle button allows users to enable/disable effects at any time. The plugin remembers their preference using sessionStorage. You can also:
    192 * Set whether effects are enabled by default
    193 * Customize button text and colors
    194 * Position the button in any screen corner
    195 * Disable effects entirely on mobile if desired
    196 
    197 = Is only one block allowed per page? =
    198 
    199 Yes, by design. The Glitter Bomb block creates full-page effects and is limited to one instance per post/page. This ensures:
    200 * Optimal performance
    201 * Consistent user experience
    202 * No conflicting particle systems
    203 
    204 = What browsers are supported? =
    205 
    206 The block works on all modern browsers:
    207 * Chrome (latest)
    208 * Firefox (latest)
    209 * Safari (latest) - Privacy-friendly, non-fingerprinting implementation
    210 * Edge (latest)
    211 * Mobile browsers (iOS Safari, Chrome Mobile, Samsung Internet)
    212 
    213 The plugin uses standard HTML5 Canvas and modern JavaScript features supported by all current browsers.
    214 
    215 = Can I use this with page builders? =
    216 
    217 Yes! Glitter Bomb works with any WordPress setup that supports Gutenberg blocks, including:
    218 * Classic WordPress block editor
    219 * Full Site Editing (FSE)
    220 * Page builders that support Gutenberg blocks
     82Yes, by design. Full-page effects don't stack well.
    22183
    22284= Does it work with caching plugins? =
    22385
    224 Yes! The block is fully compatible with caching plugins. All interactive functionality runs in the browser, so cached pages work perfectly.
    225 
    226 = How do I report bugs or request features? =
    227 
    228 Please use the WordPress.org support forum for this plugin. We actively monitor and respond to all support requests.
     86Yes — all effects run client-side, so cached pages work fine.
    22987
    23088== Screenshots ==
    23189
    232 1. Beautiful editor placeholder with gradient background and settings summary
    233 2. Comprehensive settings panel with all customization options
    234 3. Sprinkle Trail mode following cursor movement on desktop
    235 4. Particle Field mode with shimmering glitter particles
    236 5. Click explosion effect in Particle Field mode
    237 6. Color palette options with cycling animations
    238 7. Mobile view with touch-optimized controls and finger tracking
    239 8. Accessibility settings and features
    240 9. Button customization with gradient support
    241 10. Performance settings including mobile-specific optimizations
     901. Editor placeholder with settings summary
     912. Settings panel
     923. Sprinkle Trail mode on desktop
     934. Particle Field mode
     945. Click explosion effect
     956. Color palette options
     967. Mobile with touch controls
     978. Accessibility settings
     989. Button customization
    24299
    243100== Changelog ==
    244101
     102= 1.0.1 - 2026 =
     103* Fix button width CLS by scoping transition to specific properties
     104* Add WordPress Playground Live Preview support via blueprint.json
     105* Update plugin description and readme copy
     106* Add WCAG 2.1 reduced motion criterion link to accessibility FAQ
     107
    245108= 1.0.0 - 2026 =
    246109* Initial release
    247 * **Two Experience Modes**:
    248   * Sprinkle Trail: Cursor/touch-following particle effects
    249   * Particle Field: Full-screen glitter field with physics
    250 * **Mobile & Touch Features**:
    251   * Complete touch event support with gesture tracking
    252   * Separate mobile particle sizing controls
    253   * Touch-optimized controls (44x44px minimum targets)
    254   * Canvas resolution optimization for mobile
    255   * Touch event throttling for performance
    256   * Tap explosion effects
    257   * Responsive viewport handling
    258 * **Interactive Features**:
    259   * Smooth cursor and touch tracking
    260   * Click/tap explosion effects (Particle Field)
    261   * Physics-based particle movement
    262   * Color cycling animations
    263 * **Customization Options**:
    264   * Multiple color palettes (Rainbow, Metallic, Neutral, Sunset, Ocean, Custom)
    265   * Particle size, opacity, and count controls
    266   * Separate desktop and mobile sizing
    267   * Animation speed adjustment
    268   * Display behavior options (Compact/Scattered)
    269   * Button position and styling
    270 * **Accessibility Features**:
    271   * WCAG 2.2 AA compliance
    272   * Keyboard navigation support
    273   * Screen reader compatibility
    274   * Reduced motion respect
    275   * Visible focus indicators
    276   * Minimum touch target sizes
    277 * **Performance Optimizations**:
    278   * Object pooling for memory efficiency
    279   * RequestAnimationFrame optimization
    280   * Particle culling
    281   * Canvas resolution scaling on mobile
    282   * Touch event optimization
    283   * Tab visibility detection
    284 * **User Experience**:
    285   * Enable by default option
    286   * SessionStorage preference persistence
    287   * Collapsible editor preview
    288   * Gradient button support
    289   * Custom button text and colors
    290   * Optional mobile disable
    291110
    292111== Upgrade Notice ==
    293112
     113= 1.0.1 =
     114Bug fix for button width CLS and added Playground Live Preview support.
     115
    294116= 1.0.0 =
    295 Initial release of Glitter Bomb. Create magical, accessible particle effects with sprinkle trails and glitter fields! Fully responsive with complete mobile and touch support.
    296 
    297 == Performance & Browser Support ==
    298 
    299 The block uses modern JavaScript features and is optimized for performance with:
    300 * Object pooling for efficient memory management
    301 * Passive event listeners for smooth scrolling
    302 * RequestAnimationFrame for optimized animations
    303 * Particle culling to prevent off-screen rendering
    304 * Canvas resolution scaling on mobile devices (reduces to 1.5x pixel ratio on high-DPI screens)
    305 * Touch event throttling for mobile performance
    306 * Tab visibility detection to pause animations
    307 * Particle count limits to maintain framerates
    308 * Proper cleanup to prevent memory leaks
    309 * Safari privacy-friendly implementation (non-fingerprinting)
    310 
    311 **Supported browsers**: Chrome, Firefox, Safari, Edge (latest versions)
    312 **Mobile browsers**: iOS Safari, Chrome Mobile, Samsung Internet, Firefox Mobile
    313 
    314 **Tested on**:
    315 * WordPress 6.1, 6.2, 6.3, 6.4, 6.5, 6.6, 6.7, 6.8
    316 * PHP 7.4, 8.0, 8.1, 8.2, 8.3
    317 * Desktop: Windows, macOS, Linux
    318 * Mobile: iOS (iPhone/iPad), Android phones and tablets
    319 * Various screen sizes: 320px to 4K displays
    320 * Touch devices: phones, tablets, touch-enabled laptops
    321 
    322 == Privacy & Data ==
    323 
    324 Glitter Bomb respects your privacy:
    325 * **No external requests**: All code runs locally in the browser
    326 * **No tracking**: No analytics or user tracking
    327 * **No cookies**: Uses sessionStorage for user preferences (not persistent)
    328 * **No personal data**: Does not collect or transmit any user information
    329 * **GDPR compliant**: No personal data processing
    330 * **Safari privacy-friendly**: Non-fingerprinting canvas implementation
    331 
    332 == Support ==
    333 
    334 For support, please use the WordPress.org support forum for this plugin.
     117Initial release.
    335118
    336119== Contributing ==
    337120
    338 I welcome contributions! If you'd like to contribute code, report bugs, or suggest features, please visit the GitHub repository: https://github.com/klatespencer
     121Bug reports and contributions welcome: [github.com/klatespencer](https://github.com/klatespencer)

  • glitter-bomb/trunk/build/block.json

    r3466160 r3468098  
    33  "apiVersion": 3,
    44  "name": "glitter-bomb/glitter-bomb",
    5   "version": "1.0.0",
     5  "version": "1.0.1",
    66  "title": "Glitter Bomb",
    77  "category": "widgets",

  • glitter-bomb/trunk/build/style-index.css

    r3466160 r3468098  
    1 .wp-block-glitter-bomb-glitter-bomb{min-height:50px;position:relative}.glitter-bomb-toggle{border:2px solid #fff;border-radius:8px;box-shadow:0 4px 12px rgba(0,0,0,.15);cursor:pointer;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;font-size:14px;font-weight:600;min-height:44px;min-width:44px;padding:12px 16px;position:fixed;transition:all .3s ease;z-index:9999;-webkit-tap-highlight-color:rgba(0,0,0,0);touch-action:manipulation;-webkit-user-select:none;-moz-user-select:none;user-select:none}.glitter-bomb-toggle:hover{box-shadow:0 6px 16px rgba(0,0,0,.2);filter:brightness(1.1);transform:translateY(-2px)}.glitter-bomb-toggle:focus{outline:3px solid #4a90e2;outline-offset:2px}.glitter-bomb-toggle:active{transform:translateY(0)}.glitter-bomb-toggle.position-top-left{left:20px;top:20px}.glitter-bomb-toggle.position-top-right{right:20px;top:20px}.glitter-bomb-toggle.position-bottom-left{bottom:20px;left:20px}.glitter-bomb-toggle.position-bottom-right{bottom:20px;right:20px}.glitter-bomb-canvas{height:100%;left:0;pointer-events:none;position:fixed;top:0;touch-action:none;width:100%;z-index:9998}.glitter-bomb-sr-only{height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;clip:rect(0,0,0,0);border-width:0;white-space:nowrap}@media(prefers-reduced-motion:reduce){.glitter-bomb-toggle{transition:none}.glitter-bomb-toggle:hover{transform:none}}
     1.wp-block-glitter-bomb-glitter-bomb{min-height:50px;position:relative}.glitter-bomb-toggle{border:2px solid #fff;border-radius:8px;box-shadow:0 4px 12px rgba(0,0,0,.15);cursor:pointer;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;font-size:14px;font-weight:600;min-height:44px;min-width:44px;padding:12px 16px;position:fixed;transition:transform .3s ease,box-shadow .3s ease,filter .3s ease;z-index:9999;-webkit-tap-highlight-color:rgba(0,0,0,0);touch-action:manipulation;-webkit-user-select:none;-moz-user-select:none;user-select:none}.glitter-bomb-toggle:hover{box-shadow:0 6px 16px rgba(0,0,0,.2);filter:brightness(1.1);transform:translateY(-2px)}.glitter-bomb-toggle:focus{outline:3px solid #4a90e2;outline-offset:2px}.glitter-bomb-toggle:active{transform:translateY(0)}.glitter-bomb-toggle.position-top-left{left:20px;top:20px}.glitter-bomb-toggle.position-top-right{right:20px;top:20px}.glitter-bomb-toggle.position-bottom-left{bottom:20px;left:20px}.glitter-bomb-toggle.position-bottom-right{bottom:20px;right:20px}.glitter-bomb-canvas{height:100%;left:0;pointer-events:none;position:fixed;top:0;touch-action:none;width:100%;z-index:9998}.glitter-bomb-sr-only{height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;clip:rect(0,0,0,0);border-width:0;white-space:nowrap}@media(prefers-reduced-motion:reduce){.glitter-bomb-toggle{transition:none}.glitter-bomb-toggle:hover{transform:none}}

  • glitter-bomb/trunk/glitter-bomb.php

    r3466160 r3468098  
    33 * Plugin Name:       Glitter Bomb
    44 * Plugin URI:        https://klatespencer.com/glitter-bomb/
    5  * Description:       Create magical, accessible particle effects with cursor-following sparkles and full-screen glitter fields. Two experience modes: Sprinkle Trail and Particle Field. WCAG 2.2 AA compliant with full keyboard and screen reader support.
    6  * Version:           1.0.0
     5 * Description:       Create animated particle effects with cursor and touch following sparkles and full-screen glitter fields. Two experience modes: Sprinkle Trail and Particle Field. WCAG 2.2 AA compliant. Optimized for mobile.
     6 * Version:           1.0.1
    77 * Requires at least: 6.1
    88 * Requires PHP:      7.4
    … …  
    1515 *
    1616 * @package GlitterBomb
    17  * @version 1.0.0
     17 * @version 1.0.1
    1818 */
    1919
    … …  
    2323
    2424// Define plugin constants
    25 define( 'GLITTER_BOMB_VERSION', '1.0.0' );
     25define( 'GLITTER_BOMB_VERSION', '1.0.1' );
    2626define( 'GLITTER_BOMB_PLUGIN_DIR', plugin_dir_path( __FILE__ ) );
    2727define( 'GLITTER_BOMB_PLUGIN_URL', plugin_dir_url( __FILE__ ) );

  • glitter-bomb/trunk/readme.txt

    r3466160 r3468098  
    22
    33Contributors:      klate
    4 Tags:              block, particles, glitter, animation, accessibility
     4Tags:              particles, animation, interactive, cursor, effects
    55Tested up to:      6.9
    6 Stable tag:        1.0.0
     6Stable tag:        1.0.1
    77License:           GPLv2 or later
    88License URI:       https://www.gnu.org/licenses/gpl-2.0.html
    … …  
    1010Requires PHP:      7.4
    1111
    12 Create magical, accessible particle effects with cursor-following sparkles and full-screen glitter fields. WCAG 2.2 AA compliant.
     12Maximalist particle effects for WordPress — touch-responsive sparkle trails and glitter fields. WCAG 2.2 AA compliant.
    1313
    1414== Description ==
    1515
    16 Glitter Bomb brings wildly extra, interactive particle effects to your WordPress site with two delightful experience modes that work beautifully on **desktop, tablet, and mobile devices** with full **touch and gesture support**.
     16Haven't you ever wondered what the world would be like if GeoCities worked on your phone? Glitter Bomb brings interactive cursor effects and confetti-style particle fields to WordPress — with touch support that actually works. See it in action at [klatespencer.com/glitter-bomb](https://klatespencer.com/glitter-bomb/).
    1717
    18 **✨ Sprinkle Trail Mode**
    19 Create zany particle trails that follow your cursor on desktop or touch path on mobile devices. Perfectly optimized for touch screens with smooth gesture tracking and responsive sizing. Perfect for adding a touch of magic to hero sections, landing pages, or special announcements.
     18**[✨ Sprinkle Trail Mode](https://klatespencer.com/rainbow-sprinkle/)**
     19Particles follow your cursor on desktop and your finger on mobile with smooth gesture tracking. Choose between compact trails or scattered drifting patterns.
    2020
    21 **💫 Particle Field Mode**
    22 Transform your entire page into a magical canvas filled with hundreds of shimmering glitter particles. Particles gently drift, attract to your cursor or touch, and explode into sparkles on click or tap - creating an enchanting, physics-based experience that works flawlessly across all devices.
     21**[💫 Particle Field Mode](https://klatespencer.com/particle-field/)**
     22Your entire page becomes a canvas of shimmering glitter. Particles drift, attract to your cursor or touch, and explode into sparkles on click or tap.
    2323
    24 **🎯 Why Choose Glitter Bomb?**
     24**Honest assessment:** No site *needs* this. It adds JavaScript, it competes with your content, and enabling it by default on a checkout page would be irresponsible. On a hero section, birthday page, portfolio, or anywhere a little extra is exactly right? Absolutely your call.
    2525
    26 * **Fully Responsive & Mobile-Optimized**: Works beautifully on all screen sizes from mobile phones to desktop monitors with adaptive particle sizing and touch-optimized controls
    27 * **Touch & Gesture Support**: Complete touch event optimization with smooth gesture tracking, tap explosions, and mobile-specific performance enhancements
    28 * **Two Distinct Modes**: Choose between cursor-following sprinkle trails or immersive full-screen particle fields
    29 * **Fully Accessible**: WCAG 2.2 AA compliant with keyboard navigation, screen reader support, and reduced motion respect
    30 * **Performance Optimized**: Advanced optimizations including object pooling, canvas scaling, particle culling, and mobile-specific performance features ensure smooth framerates even on mobile devices
    31 * **Highly Customizable**: Extensive controls for colors, sizes, animation speed, particle behavior, with separate desktop and mobile settings
    32 * **Beautiful Color Palettes**: Choose from Rainbow, Metallic, Neutral Spectrum, Warm Sunset, Cool Ocean, or custom colors - all with smooth cycling animations
    33 * **Zero Configuration**: Works beautifully out of the box with smart defaults, or customize every detail to match your brand
     26**Features:**
    3427
    35 **📱 Mobile & Touch Features:**
     28* Touch-optimized from the start — particle trails follow your finger, tap triggers explosions, separate sizing controls for mobile vs. desktop, and an option to disable on mobile entirely
     29* WCAG 2.2 AA compliant — keyboard navigation, screen reader support, `prefers-reduced-motion` respect
     30* Six color palettes (Rainbow, Metallic, Neutral Spectrum, Warm Sunset, Cool Ocean, Custom)
     31* Customizable toggle button: position, text, and gradient colors
     32* No external dependencies, no tracking, no data collection
     33* Performance optimizations: object pooling, particle culling, canvas scaling, RAF animation
    3634
    37 * **Touch-Optimized Interface**: All controls meet minimum 44x44px touch target requirements
    38 * **Gesture Tracking**: Smooth particle trails follow your finger movements with precision
    39 * **Tap Explosions**: Dramatic sparkle bursts respond to touch taps (Particle Field mode)
    40 * **Separate Mobile Sizing**: Configure different particle sizes for mobile vs desktop for optimal visual balance
    41 * **Mobile Disable Option**: Optionally disable effects on mobile devices for maximum performance flexibility
    42 * **Canvas Resolution Optimization**: Automatically reduces canvas resolution on high-DPI mobile screens for better performance without visual quality loss
    43 * **Touch Event Throttling**: Smart touch event handling prevents overwhelming mobile processors
    44 * **Responsive Viewport**: Automatically adapts to mobile browser UI changes (address bar appearance/disappearance)
    45 
    46 **🎨 Key Features:**
    47 
    48 * **Interactive Effects**: Smooth, animated particles that respond to cursor and touch movements
    49 * **Color Cycling**: Beautiful color palette animations that smoothly transition between hues
    50 * **Physics-Based Movement**: Natural particle behavior with attraction, drift, and spreading forces
    51 * **Click/Tap Explosions**: Dramatic sparkle bursts on click or tap (Particle Field mode)
    52 * **Customizable Controls**: Adjust opacity, size, speed, particle count, and behavior
    53 * **Position Control**: Place toggle button in any screen corner
    54 * **Enable by Default**: Choose whether effects are active on page load
    55 * **User Preferences**: Remembers user's enable/disable choice across sessions
    56 * **Gradient Buttons**: Beautiful gradient controls that automatically match your color palette
    57 * **Compact or Scattered**: Choose particle display behavior (Sprinkle Trail mode)
    58 * **Mobile Optimization**: Separate sizing controls and optional disable for mobile devices
    59 
    60 **♿ Accessibility Features:**
    61 
    62 * Keyboard activation with Enter and Space keys
    63 * Screen reader announcements via ARIA live regions
    64 * Semantic HTML structure
    65 * Visible focus indicators
    66 * Respects `prefers-reduced-motion` settings
    67 * Minimum 44x44px touch targets for mobile
    68 * WCAG 2.2 AA color contrast compliance
    69 
    70 **⚡ Performance Features:**
    71 
    72 * Object pooling for efficient memory usage
    73 * RequestAnimationFrame optimization
    74 * Particle culling for off-screen particles
    75 * Canvas resolution scaling on mobile devices
    76 * Touch event optimization
    77 * Tab visibility detection to pause animations
    78 * Smart particle limits to maintain smooth framerates
    79 * Mobile-specific performance enhancements
    80 
    81 **💻 Developer Friendly:**
    82 
    83 * Clean-ish, well-documented code
    84 * WordPress coding standards compliant
    85 * No external dependencies
    86 * Lightweight bundle size
    87 * Proper cleanup and resource management
    88 * Safari privacy-friendly (non-fingerprinting)
     35Built with [Telex](https://telex.im) and [Claude Code](https://claude.ai/code). More details at [klatespencer.com/glitter-bomb](https://klatespencer.com/glitter-bomb/).
    8936
    9037== Installation ==
    9138
    92 **Automatic Installation:**
     391. In your WordPress dashboard, go to Plugins → Add New
     402. Search for "Glitter Bomb" and click Install, then Activate
     413. Add the "Glitter Bomb" block to any post or page from the block editor
     424. Customize in the right sidebar — effects only appear on the frontend, not in the editor
    9343
    94 1. Log in to your WordPress dashboard
    95 2. Navigate to Plugins → Add New
    96 3. Search for "Glitter Bomb"
    97 4. Click "Install Now" and then "Activate"
    98 5. Add the block to any post or page using the block editor
    99 
    100 **Manual Installation:**
    101 
    102 1. Download the plugin ZIP file
    103 2. Log in to your WordPress dashboard
    104 3. Navigate to Plugins → Add New → Upload Plugin
    105 4. Choose the downloaded ZIP file and click "Install Now"
    106 5. Activate the plugin
    107 6. Add the "Glitter Bomb" block to any post or page
    108 
    109 **After Installation:**
    110 
    111 1. Edit any post or page with the block editor
    112 2. Click the "+" button to add a new block
    113 3. Search for "Glitter Bomb" or find it in the Widgets category
    114 4. Add the block to your content
    115 5. Customize using the settings in the right sidebar
    116 6. Preview on the frontend - effects only appear outside the editor
    117 7. Test on mobile devices to experience the touch-optimized interface
     44**Manual install:** Download the ZIP, go to Plugins → Add New → Upload Plugin.
    11845
    11946== Frequently Asked Questions ==
    12047
    121 = Why don't I see the particles in the editor? =
     48= Why don't I see particles in the editor? =
    12249
    123 The particle effects only appear on the frontend to prevent performance issues in the editor. The editor displays a beautiful preview with settings summary and all customization controls. Click the expand/collapse toggle to view your current settings.
     50Effects only render on the frontend. The editor shows a settings summary instead.
    12451
    125 = Does this work on mobile devices and tablets? =
     52= Does this work on mobile? =
    12653
    127 Absolutely! Glitter Bomb is fully optimized for mobile and tablet devices with:
    128 * Complete touch event support for particle trails following your finger
    129 * Tap-responsive explosion effects
    130 * Separate mobile particle size controls for optimal visual balance
    131 * Canvas resolution optimization for better performance on high-DPI screens
    132 * Touch-optimized toggle button meeting minimum 44x44px touch target requirements
    133 * Optional mobile disable feature for older devices
    134 * Responsive viewport handling that adapts to mobile browser UI changes
    135 * Smooth gesture tracking with touch event throttling
     54Yes. Particle trails follow your finger with smooth gesture tracking, tap triggers sparkle explosions in Particle Field mode, and you can configure separate particle sizes for mobile vs. desktop. If you need to, you can disable effects on mobile entirely — but the touch interactions are the fun part.
    13655
    137 The plugin works beautifully on iOS (iPhone/iPad), Android phones and tablets, and all modern touch-enabled devices.
     56= Is it accessible? =
    13857
    139 = Is this block accessible? =
     58Yes. WCAG 2.2 AA compliant: keyboard navigation, screen reader announcements via ARIA live regions, visible focus indicators, and automatic respect for `prefers-reduced-motion` per [WCAG 2.1 Success Criterion 2.3.3](https://www.w3.org/WAI/WCAG21/Understanding/animation-from-interactions.html).
    14059
    141 Yes! Glitter Bomb was built with WCAG 2.2 AA criteria in mind and includes:
    142 * Complete keyboard navigation support
    143 * Screen reader announcements
    144 * Focus indicators that meet contrast requirements
    145 * Respect for `prefers-reduced-motion` user preferences
    146 * Minimum touch target sizes for mobile (44x44px)
    147 * Semantic HTML structure
     60= What's the difference between the two modes? =
    14861
    149 = How many particles can be displayed at once? =
     62**Sprinkle Trail** creates particles that follow cursor or touch movement in compact or scattered patterns. **Particle Field** fills the entire viewport with physics-based glitter that drifts, attracts to your cursor, and explodes on click.
    15063
    151 For optimal performance across all devices:
    152 * **Sprinkle Trail mode**: Maximum 100 particles (default 50)
    153 * **Particle Field mode**: Maximum 500 particles (default 200)
     64= Will this slow down my site? =
    15465
    155 You can adjust these limits in the block settings. The plugin uses advanced optimizations to ensure smooth performance even at higher particle counts on both desktop and mobile devices.
     66Only on pages where the block is used — scripts and styles are loaded conditionally and won't touch pages that don't have the block. On pages that do have it, yes, there's an inordinate amount of JavaScript making this work. Object pooling, particle culling, canvas scaling, and smart particle limits help keep it reasonable — but it's still a lot. Plan accordingly.
    15667
    157 = Will this affect my site's performance? =
     68= Can users turn it off? =
    15869
    159 Yes, 100% this is a wildly extra effect with a ton of JavaScript. However, I've done my best to mitigate that by applying:
    160 * Object pooling reduces memory usage
    161 * Particle culling prevents off-screen rendering
    162 * Canvas scaling optimizes mobile performance
    163 * Touch event throttling prevents overwhelming mobile processors
    164 * Animation pauses when tab is hidden
    165 * Smart particle limits maintain smooth framerates
    166 * Proper resource cleanup prevents memory leaks
    167 * Mobile-specific optimizations for high-DPI screens
     70Yes, always. There's a customizable toggle button (position, text, colors) and the plugin remembers the user's choice for the session. If you're going to shove glitter in people's faces, at least have the decency to let them turn it off.
    16871
    169 = Can I customize the colors? =
     72= How many particles? =
    17073
    171 Yes! You have multiple color options:
    172 * **Pre-defined palettes**: Rainbow, Metallic, Neutral Spectrum, Warm Sunset, Cool Ocean
    173 * **Color cycling**: All palettes smoothly cycle through their colors
    174 * **Custom colors**: Use the color picker for precise color control
    175 * **Gradient buttons**: Toggle buttons automatically match your palette or use custom gradients
     74Sprinkle Trail: up to 100 (default 50). Particle Field: up to 500 (default 200).
    17675
    177 = What's the difference between Sprinkle Trail and Particle Field modes? =
     76= Does it collect data or set cookies? =
    17877
    179 **Sprinkle Trail Mode**: Creates particles that follow your cursor or finger on touch devices, perfect for focused effects on specific content areas. Choose between:
    180 * **Compact**: Tight trailing effect with faster fade
    181 * **Scattered**: Particles drift outward as they fade
     78No. Zero tracking, zero analytics. It uses sessionStorage (not cookies) to remember whether a user turned effects on or off — that data never leaves their browser.
    18279
    183 **Particle Field Mode**: Creates a full-screen magical experience with hundreds of particles that:
    184 * Gently drift across the entire viewport
    185 * Attract to your cursor or touch with physics-based movement
    186 * Explode into sparkles on click or tap
    187 * Return to their home positions when cursor/touch leaves
     80= One block per page? =
    18881
    189 = Can users disable the effects? =
    190 
    191 Yes! A customizable toggle button allows users to enable/disable effects at any time. The plugin remembers their preference using sessionStorage. You can also:
    192 * Set whether effects are enabled by default
    193 * Customize button text and colors
    194 * Position the button in any screen corner
    195 * Disable effects entirely on mobile if desired
    196 
    197 = Is only one block allowed per page? =
    198 
    199 Yes, by design. The Glitter Bomb block creates full-page effects and is limited to one instance per post/page. This ensures:
    200 * Optimal performance
    201 * Consistent user experience
    202 * No conflicting particle systems
    203 
    204 = What browsers are supported? =
    205 
    206 The block works on all modern browsers:
    207 * Chrome (latest)
    208 * Firefox (latest)
    209 * Safari (latest) - Privacy-friendly, non-fingerprinting implementation
    210 * Edge (latest)
    211 * Mobile browsers (iOS Safari, Chrome Mobile, Samsung Internet)
    212 
    213 The plugin uses standard HTML5 Canvas and modern JavaScript features supported by all current browsers.
    214 
    215 = Can I use this with page builders? =
    216 
    217 Yes! Glitter Bomb works with any WordPress setup that supports Gutenberg blocks, including:
    218 * Classic WordPress block editor
    219 * Full Site Editing (FSE)
    220 * Page builders that support Gutenberg blocks
     82Yes, by design. Full-page effects don't stack well.
    22183
    22284= Does it work with caching plugins? =
    22385
    224 Yes! The block is fully compatible with caching plugins. All interactive functionality runs in the browser, so cached pages work perfectly.
    225 
    226 = How do I report bugs or request features? =
    227 
    228 Please use the WordPress.org support forum for this plugin. We actively monitor and respond to all support requests.
     86Yes — all effects run client-side, so cached pages work fine.
    22987
    23088== Screenshots ==
    23189
    232 1. Beautiful editor placeholder with gradient background and settings summary
    233 2. Comprehensive settings panel with all customization options
    234 3. Sprinkle Trail mode following cursor movement on desktop
    235 4. Particle Field mode with shimmering glitter particles
    236 5. Click explosion effect in Particle Field mode
    237 6. Color palette options with cycling animations
    238 7. Mobile view with touch-optimized controls and finger tracking
    239 8. Accessibility settings and features
    240 9. Button customization with gradient support
    241 10. Performance settings including mobile-specific optimizations
     901. Editor placeholder with settings summary
     912. Settings panel
     923. Sprinkle Trail mode on desktop
     934. Particle Field mode
     945. Click explosion effect
     956. Color palette options
     967. Mobile with touch controls
     978. Accessibility settings
     989. Button customization
    24299
    243100== Changelog ==
    244101
     102= 1.0.1 - 2026 =
     103* Fix button width CLS by scoping transition to specific properties
     104* Add WordPress Playground Live Preview support via blueprint.json
     105* Update plugin description and readme copy
     106* Add WCAG 2.1 reduced motion criterion link to accessibility FAQ
     107
    245108= 1.0.0 - 2026 =
    246109* Initial release
    247 * **Two Experience Modes**:
    248   * Sprinkle Trail: Cursor/touch-following particle effects
    249   * Particle Field: Full-screen glitter field with physics
    250 * **Mobile & Touch Features**:
    251   * Complete touch event support with gesture tracking
    252   * Separate mobile particle sizing controls
    253   * Touch-optimized controls (44x44px minimum targets)
    254   * Canvas resolution optimization for mobile
    255   * Touch event throttling for performance
    256   * Tap explosion effects
    257   * Responsive viewport handling
    258 * **Interactive Features**:
    259   * Smooth cursor and touch tracking
    260   * Click/tap explosion effects (Particle Field)
    261   * Physics-based particle movement
    262   * Color cycling animations
    263 * **Customization Options**:
    264   * Multiple color palettes (Rainbow, Metallic, Neutral, Sunset, Ocean, Custom)
    265   * Particle size, opacity, and count controls
    266   * Separate desktop and mobile sizing
    267   * Animation speed adjustment
    268   * Display behavior options (Compact/Scattered)
    269   * Button position and styling
    270 * **Accessibility Features**:
    271   * WCAG 2.2 AA compliance
    272   * Keyboard navigation support
    273   * Screen reader compatibility
    274   * Reduced motion respect
    275   * Visible focus indicators
    276   * Minimum touch target sizes
    277 * **Performance Optimizations**:
    278   * Object pooling for memory efficiency
    279   * RequestAnimationFrame optimization
    280   * Particle culling
    281   * Canvas resolution scaling on mobile
    282   * Touch event optimization
    283   * Tab visibility detection
    284 * **User Experience**:
    285   * Enable by default option
    286   * SessionStorage preference persistence
    287   * Collapsible editor preview
    288   * Gradient button support
    289   * Custom button text and colors
    290   * Optional mobile disable
    291110
    292111== Upgrade Notice ==
    293112
     113= 1.0.1 =
     114Bug fix for button width CLS and added Playground Live Preview support.
     115
    294116= 1.0.0 =
    295 Initial release of Glitter Bomb. Create magical, accessible particle effects with sprinkle trails and glitter fields! Fully responsive with complete mobile and touch support.
    296 
    297 == Performance & Browser Support ==
    298 
    299 The block uses modern JavaScript features and is optimized for performance with:
    300 * Object pooling for efficient memory management
    301 * Passive event listeners for smooth scrolling
    302 * RequestAnimationFrame for optimized animations
    303 * Particle culling to prevent off-screen rendering
    304 * Canvas resolution scaling on mobile devices (reduces to 1.5x pixel ratio on high-DPI screens)
    305 * Touch event throttling for mobile performance
    306 * Tab visibility detection to pause animations
    307 * Particle count limits to maintain framerates
    308 * Proper cleanup to prevent memory leaks
    309 * Safari privacy-friendly implementation (non-fingerprinting)
    310 
    311 **Supported browsers**: Chrome, Firefox, Safari, Edge (latest versions)
    312 **Mobile browsers**: iOS Safari, Chrome Mobile, Samsung Internet, Firefox Mobile
    313 
    314 **Tested on**:
    315 * WordPress 6.1, 6.2, 6.3, 6.4, 6.5, 6.6, 6.7, 6.8
    316 * PHP 7.4, 8.0, 8.1, 8.2, 8.3
    317 * Desktop: Windows, macOS, Linux
    318 * Mobile: iOS (iPhone/iPad), Android phones and tablets
    319 * Various screen sizes: 320px to 4K displays
    320 * Touch devices: phones, tablets, touch-enabled laptops
    321 
    322 == Privacy & Data ==
    323 
    324 Glitter Bomb respects your privacy:
    325 * **No external requests**: All code runs locally in the browser
    326 * **No tracking**: No analytics or user tracking
    327 * **No cookies**: Uses sessionStorage for user preferences (not persistent)
    328 * **No personal data**: Does not collect or transmit any user information
    329 * **GDPR compliant**: No personal data processing
    330 * **Safari privacy-friendly**: Non-fingerprinting canvas implementation
    331 
    332 == Support ==
    333 
    334 For support, please use the WordPress.org support forum for this plugin.
     117Initial release.
    335118
    336119== Contributing ==
    337120
    338 I welcome contributions! If you'd like to contribute code, report bugs, or suggest features, please visit the GitHub repository: https://github.com/klatespencer
     121Bug reports and contributions welcome: [github.com/klatespencer](https://github.com/klatespencer)
Note: See TracChangeset for help on using the changeset viewer.