=== JuZ DualView ===
Contributors: juzed
Tags: before after, comparison, slider, eco-friendly, accessible
Requires at least: 6.6
Requires PHP: 7.4
Tested up to: 7.1
Stable tag: 1.1.1
License: GPLv2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html

Easily compare before and after content with an interactive slider in the WordPress block editor.

== Description ==

The JuZ DualView Block allows you to create interactive before/after comparisons directly in the WordPress block editor. Perfect for showcasing transformations, improvements, or any content that benefits from side-by-side comparison with an interactive slider.

**Key Features:**
- Interactive slider to compare before/after content
- Works with images, covers, text, or any block content, as long as it is not interactive (see below)
- Customizable labels and descriptions
- Responsive design that works on all devices
- Accessibility-ready with proper ARIA attributes
- Easy to use with a simple interface

**Use Cases:**
- Showcasing design improvements
- Demonstrating product before/after results
- Comparing old vs. new versions
- Highlighting transformations
- Any content that benefits from visual comparison

**What to put in it:**
Any blocks, as long as the content is not interactive: images, covers, text, a whole layout. Links, buttons, forms or video players would sit under the slider and could not be used. When both sides hold text, give them a background so that one does not show through the other.

**Labels in the language of the page:**
The default labels of the slider and its buttons are added when the page is displayed, in the language of the page (English by default). On a multilingual site, each page gets its own language; the labels typed in the block settings are kept as they are.

**Live demo:**
See it in action on [playground.juzed.dev](https://playground.juzed.dev/our-plugins/juz-dualview/), or try it in the editor with [WordPress Playground](https://playground.wordpress.net/?blueprint-url=https://wordpress.org/plugins/wp-json/plugins/v1/plugin/juz-dualview/blueprint.json), nothing to install.

**Accessibility Credits:**
This plugin's accessibility features were developed with expert guidance from:
- [Jean-Baptiste Audras](https://profiles.wordpress.org/audrasjb/) ([Whodunit](https://www.linkedin.com/company/agence-wordpress-whodunit/))
- [Sorya Huon](https://www.linkedin.com/in/sorya-huon-6b101040/) ([Ecedi](https://www.ecedi.fr/))
- [Myriam Niaré-Guilloux](https://www.linkedin.com/in/myriam-niare-guilloux/) ([Ecedi](https://www.ecedi.fr/))

== Installation ==

1. Upload the plugin files to the `/wp-content/plugins/juz-dualview` directory, or install the plugin through the WordPress plugins screen directly.
2. Activate the plugin through the 'Plugins' screen in WordPress
3. Use the "JuZ DualView" block in the Gutenberg editor

== Frequently Asked Questions ==

= How do I use the block? =

1. Add the "JuZ DualView" block to your post or page
2. Add your "Before" content in the first section
3. Add your "After" content in the second section
4. Customize the block settings as needed
5. Publish your content

= Can I compare more than just images? =

Yes! The block works with any content type. You can compare images, text, or any combination of blocks.

= Is the block responsive? =

Yes, the block is fully responsive and will adapt to different screen sizes.

= Can I customize the colors? =

Yes, you can customize the background colors and text colors using the block's color settings.

= Is the block accessible? =

Yes, the block includes proper ARIA attributes and keyboard navigation support to ensure accessibility.

== Screenshots ==

1. The block in the WordPress editor showing before/after sections
2. The interactive slider in action on the frontend
3. Block settings panel with customization options

== Changelog ==

= 1.1.1 =
* Live demo: new address of the demo page, and a WordPress Playground preview that opens the editor on a demo page.

= 1.1.0 =
* Default labels added when the page is displayed, in the language of the page: they are no longer saved in the content, so a block stays valid when the translations or the editor language change. Blocks saved by earlier versions are converted when edited, and show their labels in the language of the page right away.
* Slider: aria-valuemax set to 100.
* Tested with WordPress 7.1.
* Requires WordPress 6.6 and PHP 7.4.
* Block version aligned with the plugin version.
* Build tooling updated.

= 1.0.1 =
* Fix CSS selector specificity for range input to avoid conflicts with Ollie theme styles
* Fix figure margin-block-end inside the block (Ollie theme compatibility)
* Tested with WordPress 6.9

= 1.0.0 =
* Initial release
* Interactive slider functionality
* Support for any block content
* Customizable labels and descriptions
* Accessibility features

== Upgrade Notice ==

= 1.1.1 =
Demo links only, no code change.

= 1.1.0 =
Labels in the language of the page, blocks no longer invalidated by a translation change, and compatibility with WordPress 7.1.

= 1.0.1 =
CSS fixes for compatibility with the Ollie theme.

= 1.0.0 =
Initial release of the JuZ DualView Block plugin.

== Additional Notes ==

* Requires WordPress 6.0 or higher
* Works with the Gutenberg block editor
* Tested with major WordPress themes
* Lightweight and performance optimized

