wc-tier-and-package-prices/releases/RELEASE-INFO-1.1.7.md

# WooCommerce Tier and Package Prices - Release 1.1.7

**Release Date:** December 22, 2025
**Version:** 1.1.7
**Package Size:** 55 KB
**Git Tag:** v1.1.7

## Download

**File:** `wc-tier-and-package-prices-1.1.7.zip`

### Checksums

**SHA256:**
```
00e7c473a8b0fc23eb1cd52f4b38db030618ed142a9a9fdfd9b1aa4c5849ec70
```

**MD5:**
```
c593b6fc730133ecaf772f77d5659080
```

## What's New in 1.1.7

This is an **enhancement release** that adds three new customer-facing features to improve product page interaction and tier pricing functionality.

### New Features

1. **Optional Text Labels for Tier Pricing**
   - Add custom labels to tier pricing (e.g., "Wholesale", "Bulk Discount", "Business Rate")
   - Labels display below quantity in tier pricing table
   - Similar to existing package label functionality
   - Completely optional - tiers work the same without labels

2. **Clickable Tier Pricing Rows**
   - Click any row in the tier pricing table to auto-populate quantity field
   - Smooth scroll animation brings quantity field into view
   - Visual hover feedback shows rows are clickable
   - Makes it easy for customers to select tier quantities

3. **Add to Cart Button Auto-Disable**
   - Button automatically disables when quantity is 0 or less
   - Visual feedback with reduced opacity and not-allowed cursor
   - Prevents accidental form submission with invalid quantity
   - Re-enables automatically when valid quantity is entered

## What's Changed

### Added

- Optional `label` field in tier pricing admin meta box
- Click handler for tier pricing table rows
- Add to Cart button state management function
- CSS styling for tier labels (italic, gray, smaller font)
- Cursor pointer and hover animation for tier rows
- Disabled button styling with visual feedback

### Enhanced

- Tier pricing table now fully interactive and clickable
- Improved user experience with visual feedback throughout
- Better quantity selection workflow
- Prevents invalid cart submissions

### Technical Details

**PHP Changes:**
- `templates/admin/tier-row.twig` - Added label input field
- `includes/class-wc-tpp-product-meta.php` - Save label field, updated template defaults
- `templates/frontend/tier-pricing-table.twig` - Display labels conditionally

**JavaScript Changes:**
- `assets/js/frontend.js` - Added tier row click handler (lines 174-186)
- `assets/js/frontend.js` - Added `updateAddToCartButton()` function (lines 157-166)
- Initial button state check on page load
- Button state updates on quantity change

**CSS Changes:**
- `assets/css/frontend.css` - `.wc-tpp-tier-label` styling (lines 72-78)
- `assets/css/frontend.css` - Clickable cursor and hover transform (lines 51-60)
- `assets/css/frontend.css` - Disabled button styling (lines 213-218)

## Installation

### New Installation

1. Download the ZIP file: `wc-tier-and-package-prices-1.1.7.zip`
2. Log in to your WordPress admin panel
3. Navigate to **Plugins > Add New > Upload Plugin**
4. Choose the downloaded ZIP file
5. Click **Install Now**
6. After installation, click **Activate Plugin**
7. Go to **WooCommerce > Settings > Tier & Package Prices** to configure

### Upgrade from 1.1.6

This is an **enhancement release** with new UX features.

**Steps:**
1. Deactivate version 1.1.6 (if active)
2. Upload and activate version 1.1.7
3. All existing settings and data will be automatically preserved
4. No additional configuration required
5. New features available immediately

**What Happens After Upgrade:**
- Existing tier pricing continues to work without labels
- To add labels, edit products and fill in the optional label field
- Tier rows are immediately clickable
- Add to Cart button auto-disable works automatically

### Upgrade from 1.1.5 or Earlier

Safe to upgrade directly. This version includes all features from v1.1.6 plus three new UX enhancements.

**Steps:**
1. Deactivate the current version
2. Upload and activate version 1.1.7
3. All existing settings and data will be automatically preserved
4. Enjoy improved user experience

### Requirements

- **WordPress:** 6.0 or higher
- **PHP:** 7.4 or higher
- **WooCommerce:** 8.0 or higher (must be installed and activated)

## Feature Details

### 1. Tier Pricing Labels

**Admin Experience:**
- New optional "Label (Optional)" field in tier pricing meta box
- Appears below "Price per Unit" field
- Placeholder: "e.g., Wholesale"
- Field can be left empty - labels are completely optional

**Frontend Display:**
- Labels appear below quantity in tier table
- Styled in italic, gray, smaller font
- Example:
  ```
  10+
  Wholesale
  ```

**Use Cases:**
- "Wholesale" for business customers
- "Bulk Discount" for large orders
- "VIP Pricing" for special customers
- "Trade Price" for resellers
- Any custom text to describe the tier

### 2. Clickable Tier Rows

**User Experience:**
1. Customer views tier pricing table on product page
2. Hovers over any tier row - sees cursor change and subtle animation
3. Clicks on desired tier row
4. Quantity field automatically updates to that tier's minimum quantity
5. Page smoothly scrolls to bring quantity field into view
6. Customer clicks "Add to Cart"

**Visual Feedback:**
- Cursor changes to pointer when hovering
- Row slides slightly right on hover (2px transform)
- Background changes to light gray on hover
- Active tier highlighted in green (existing feature)

**Technical:**
- Click handler reads `data-min-qty` attribute from row
- Sets quantity input value
- Triggers change event to update price display and highlighting
- Smooth scroll animation (300ms) to quantity field

### 3. Add to Cart Button Auto-Disable

**Behavior:**
- On page load, checks if quantity is 0 and disables button if needed
- Every time quantity changes (manual input, tier click, package selection), updates button state
- Quantity ≤ 0: Button disabled
- Quantity > 0: Button enabled

**Visual Feedback When Disabled:**
- Opacity reduced to 50%
- Cursor changes to not-allowed
- Pointer events disabled (can't click)

**Use Cases:**
- Prevents "Add to Cart" with quantity 0
- Prevents "Add to Cart" with negative quantities
- Provides immediate visual feedback
- Works with all quantity change methods (manual, tier click, package selection)

## Complete Feature Set

### Tier Pricing (Enhanced in v1.1.7)

- ✅ Quantity-based discount tiers
- ✅ Automatic price calculation
- ✅ Volume discount display
- ✅ **NEW:** Optional custom labels per tier
- ✅ **NEW:** Clickable rows to select tier quantity
- ✅ Visual highlighting of active tier

### Package Pricing

- ✅ Fixed-price bundles
- ✅ Custom package labels
- ✅ Multiple package options per product
- ✅ Quantity restriction to packages only
- ✅ Cart quantity enforcement
- ✅ Catalog button modification
- ✅ WooCommerce Blocks support

### Admin Features

- ✅ WooCommerce Settings integration
- ✅ Easy-to-use product meta boxes
- ✅ Configurable display positions
- ✅ Native WooCommerce UI
- ✅ Global restriction setting
- ✅ Per-product restriction override
- ✅ **NEW:** Optional tier labels

### Frontend Features (Enhanced in v1.1.7)

- ✅ Beautiful pricing tables (Twig templates)
- ✅ Real-time cart updates
- ✅ Responsive design
- ✅ 3 languages supported
- ✅ Package-only selection mode
- ✅ Automatic quantity field hiding (product page & cart)
- ✅ Visual package selection
- ✅ Read-only cart quantity display
- ✅ Professional "View Options" button
- ✅ WooCommerce Blocks compatibility
- ✅ **NEW:** Clickable tier pricing rows
- ✅ **NEW:** Tier labels in pricing table
- ✅ **NEW:** Auto-disable invalid Add to Cart

### User Experience (New in v1.1.7)

- ✅ **NEW:** One-click tier quantity selection
- ✅ **NEW:** Visual feedback on all interactive elements
- ✅ **NEW:** Smooth scroll animations
- ✅ **NEW:** Disabled state prevents invalid actions
- ✅ **NEW:** Custom tier labeling for clarity

## Breaking Changes

**None.** This release is fully backward compatible with v1.1.6 and all previous versions.

## Migration Notes

### From 1.1.6

- No migration needed
- All new features work automatically
- Tier labels are optional - existing tiers work unchanged
- No settings or configuration required

### From 1.1.5 or Earlier

- All v1.1.6 and v1.1.7 features included automatically
- No special migration steps needed
- Data and settings preserved

### Settings Location

All settings remain in: **WooCommerce > Settings > Tier & Package Prices**

### Data Preservation

- All existing tier pricing data preserved
- All existing package pricing data preserved
- All product meta data preserved
- No database changes required
- Label field added automatically to existing tiers (empty by default)

## User Impact

### Before v1.1.7

- Customers manually typed tier quantities
- No visual indication tiers were selectable
- Add to Cart could be clicked with quantity 0
- No way to add descriptive labels to tiers

### After v1.1.7

- Customers can click tier rows for instant selection
- Clear visual feedback with hover effects
- Add to Cart automatically disabled when invalid
- Store owners can add descriptive labels to tiers
- Smoother, more intuitive shopping experience

## Example Use Case

**Scenario:** Wholesale store with three tier levels

**Admin Setup:**
```
Tier 1: 10+ units at $9.99 - Label: "Small Business"
Tier 2: 50+ units at $8.99 - Label: "Wholesale"
Tier 3: 100+ units at $7.99 - Label: "Distributor"
```

**Customer Experience:**
1. Views product page with tier pricing table
2. Sees three tiers with clear labels explaining each level
3. Hovers over "Wholesale" tier - row highlights
4. Clicks on "Wholesale" tier row
5. Quantity field updates to 50
6. Page scrolls smoothly to quantity field
7. Price updates to $8.99 per unit
8. Tier row highlighted in green
9. Clicks "Add to Cart" (enabled because quantity > 0)

## Browser & Theme Compatibility

### Tested With

- ✅ Classic WooCommerce product pages
- ✅ WooCommerce Cart Block
- ✅ WooCommerce Mini-Cart Block
- ✅ Storefront theme
- ✅ Twenty Twenty-Four theme
- ✅ Astra theme
- ✅ Kadence theme
- ✅ All modern browsers (Chrome, Firefox, Safari, Edge)

### JavaScript Requirements

- jQuery (included with WordPress)
- Modern browser with CSS transform support
- No additional dependencies

## Known Limitations

### Current Version

1. Tier labels are plain text only (no HTML or formatting)
2. Tier row click only works on non-restricted products
3. Button disable only affects quantity 0, not other validation rules
4. Label field limited to 255 characters (standard text field)

### Future Enhancements

These features may be added in future versions:
- Rich text formatting for tier labels
- Customizable tier row click behavior
- Advanced button validation rules
- Tier label templates
- Color coding for tier levels

## Changelog Summary

### Version History

- **v1.1.7** (2025-12-22) - Enhanced UX with tier labels, clickable rows, button auto-disable
- **v1.1.6** (2025-12-21) - Critical fix for plugin activation
- **v1.1.5** (2025-12-21) - Critical bug fix attempt (incomplete)
- **v1.1.4** (2025-12-21) - WooCommerce Blocks support + improved button styling
- **v1.1.3** (2025-12-21) - Cart quantity visibility bug fix
- **v1.1.2** (2025-12-21) - Catalog button modification
- **v1.1.1** (2025-12-21) - Cart quantity bypass fix
- **v1.1.0** (2025-12-21) - Package quantity restriction feature
- **v1.0.2** (2025-12-21) - WooCommerce Settings integration
- **v1.0.1** (2025-12-21) - Twig template engine integration
- **v1.0.0** (2025-12-21) - Initial release

## Modified Files in 1.1.7

### Core Files Updated

- `wc-tier-and-package-prices.php` - Version updated to 1.1.7
- `composer.json` - Version updated to 1.1.7
- `CHANGELOG.md` - Added v1.1.7 section

### Templates Modified

- `templates/admin/tier-row.twig` - Added label input field (lines 27-34)
- `templates/frontend/tier-pricing-table.twig` - Display labels (lines 28-33)

### PHP Classes Modified

- `includes/class-wc-tpp-product-meta.php`:
  - Updated tier template default to include label (line 84)
  - Save label field with sanitization (line 131)

### JavaScript Modified

- `assets/js/frontend.js`:
  - Added `$addToCartButton` selector (line 11)
  - Added `updateAddToCartButton()` function (lines 158-166)
  - Added tier row click handler (lines 175-187)
  - Button state update on quantity change (line 172)
  - Initial button state check (lines 217-219)

### CSS Modified

- `assets/css/frontend.css`:
  - Clickable cursor for tier rows (line 54)
  - Hover animation for tier rows (line 59)
  - Tier label styling (lines 72-78)
  - Disabled button styling (lines 214-218)

## Support

- **Documentation:** See README.md and CHANGELOG.md
- **Previous Release:** See RELEASE-INFO-1.1.6.md
- **Issues:** https://src.bundespruefstelle.ch/magdev/wc-tier-package-prices/issues
- **Author:** Marco Graetsch

## License

GPL v2 or later - https://www.gnu.org/licenses/gpl-2.0.html

---

**Production Ready:** This package includes optimized autoloader and no development dependencies.

**Recommended Update:** Version 1.1.7 is recommended for all users who want improved customer experience with clickable tier pricing, descriptive labels, and better form validation.