Table of Contents

• About the Project
  • Built With
• Getting Started
  • Prerequisites
  • Installation
• Usage
• Roadmap
• Contributing
• License
• Contact
• Acknowledgements

About The Project

A simple vue.js directive that implements Shopify Swappable / Draggable. Feel free to copy/paste the directive to reduce unnecessary node modules.

Shopify Draggable

• This directive is specifically for swappable.js however you can just swap Swappable in the directive with Collidable etc.
• This directive doesn't currently support events however these are being worked on.
• Feel free to fork and add any functionality you want.

Built With

Frameworks, Modules & Tools

• Vue
• Shopify Darggable

Getting Started

To install the directive, follow these simple steps.

Install

• npm

npm i --save gridby

• Require it in your vue.js component file:

// ES5
var gridby = require('gridby');
// ES6
import 'gridby';

• Set as directive

directives: {
    gridby
},

Usage

• Add the directive to an element.

<div v-gridby="{ draggable: '.block' }">
    <div class="block"></div>
    <div class="block"></div>
</div>

Roadmap

See the open issues to propose a features (and report issues).

Contributing

👍 Any contributions you make are greatly appreciated.

1. Fork the Project
2. Create your Feature Branch (git checkout -b feature/AmazingFeature)
3. Commit your Changes (git commit -m 'Add some AmazingFeature')
4. Push to the Branch (git push origin feature/AmazingFeature)
5. Open a Pull Request

License

Distributed under the MIT License. See LICENSE for more information.

Contact

Oliver Griffith-Jones - @olzgj - [email protected]

Project Link: github.com/ogriffithjones/vue-contextmenu/

Acknowledgements

• Vue Simple Context Menu
• V Click Outside