Replaces JSON textarea with professional Excel-like spreadsheet interface for managing product variant properties. Features: - Handsontable 14.6.1 spreadsheet component - Property presets (Size, Color, Material, Storage, Custom) - Inline cell editing with Tab/Enter navigation - Context menu for add/remove rows and columns - Keyboard shortcuts (Ctrl+D delete, Ctrl+Enter save, Ctrl+Z undo) - Mobile touch gestures (swipe to delete rows) - Automatic JSON serialization on form submit - Form validation before saving - Comprehensive user guide documentation Files Changed: - LittleShop/package.json: NPM package management setup - LittleShop/wwwroot/js/variant-editor.js: 400-line spreadsheet editor module - LittleShop/wwwroot/lib/handsontable/: Handsontable library (Community Edition) - LittleShop/wwwroot/lib/hammerjs/: Hammer.js touch gesture library - LittleShop/Areas/Admin/Views/VariantCollections/Edit.cshtml: Spreadsheet UI integration - VARIANT_COLLECTIONS_USER_GUIDE.md: Complete user guide (18+ pages) Technical Details: - Excel-like editing experience (no more manual JSON editing) - Mobile-first responsive design - Browser compatibility: Chrome 90+, Firefox 88+, Edge 90+, Safari 14+ - Touch-optimized for mobile administration - Automatic data validation and error handling
52 lines
1.4 KiB
Markdown
52 lines
1.4 KiB
Markdown
# Hammer.js 2.0.6
|
|
|
|
[](https://travis-ci.org/hammerjs/hammer.js)
|
|
|
|
## Support, Questions, and Collaboration
|
|
|
|
[](https://hammerjs.herokuapp.com/)
|
|
|
|
## Documentation
|
|
|
|
Visit [hammerjs.github.io](http://hammerjs.github.io) for detailed documentation.
|
|
|
|
```js
|
|
// get a reference to an element
|
|
var stage = document.getElementById('stage');
|
|
|
|
// create a manager for that element
|
|
var mc = new Hammer.Manager(stage);
|
|
|
|
// create a recognizer
|
|
var Rotate = new Hammer.Rotate();
|
|
|
|
// add the recognizer
|
|
mc.add(Rotate);
|
|
|
|
// subscribe to events
|
|
mc.on('rotate', function(e) {
|
|
// do something cool
|
|
var rotation = Math.round(e.rotation);
|
|
stage.style.transform = 'rotate('+rotation+'deg)';
|
|
});
|
|
```
|
|
|
|
An advanced demo is available here: [http://codepen.io/runspired/full/ZQBGWd/](http://codepen.io/runspired/full/ZQBGWd/)
|
|
|
|
|
|
## Contributing
|
|
|
|
Read the [contributing guidelines](./CONTRIBUTING.md).
|
|
|
|
For PRs.
|
|
|
|
- Use [Angular Style commit messages](https://github.com/angular/angular.js/blob/v1.4.8/CONTRIBUTING.md#commit)
|
|
- Rebase your PR branch when necessary
|
|
- If you add a feature or fix a bug, please add or fix any necessary tests.
|
|
- If a new feature, open a docs PR to go with.
|
|
|
|
## Building
|
|
|
|
You can get the pre-build versions from the Hammer.js website, or do this by yourself running
|
|
`npm install -g grunt-cli && npm install && grunt build`
|