mirror of
https://github.com/publiclab/image-sequencer.git
synced 2025-12-18 14:20:06 +01:00
update
This commit is contained in:
101
node_modules/selectize/docs/plugins.md
generated
vendored
Normal file
101
node_modules/selectize/docs/plugins.md
generated
vendored
Normal file
@@ -0,0 +1,101 @@
|
||||
## Selectize API – Plugins
|
||||
|
||||
Via the [microplugin](https://github.com/brianreavis/microplugin.js) interface,
|
||||
features can be added to Selectize without modifying the main library.
|
||||
This is great because it protects against code bloat, allows for lean builds,
|
||||
and allows for addons to be sanely isolated. The plugin system isn't meant
|
||||
to be sexy; it's lean, makes very few assumptions, and gives the developer
|
||||
complete control.
|
||||
|
||||
[**Example Plugins**](../src/plugins)
|
||||
|
||||
**A few notes:**
|
||||
- All plugins live in their own folders in ["src/plugins"](../src/plugins).
|
||||
- Plugin names should be in follow the format: `/[a-z_]+$`
|
||||
- JS source should live in a "plugin.js" file (required).
|
||||
- CSS should live in a "plugin.less" file (optional). It will be bundled at build time.
|
||||
- Plugins are initialized right before the control is setup.
|
||||
This means that if you want to listen for events on any of the control's
|
||||
elements, you should override the `setup()` method (see ["DOM Events"](#dom-events)).
|
||||
|
||||
### Boilerplate
|
||||
|
||||
```js
|
||||
Selectize.define('plugin_name', function(options) {
|
||||
// options: plugin-specific options
|
||||
// this: Selectize instance
|
||||
});
|
||||
```
|
||||
|
||||
#### Adding Dependencies
|
||||
|
||||
```js
|
||||
Selectize.define('plugin_name', function(options) {
|
||||
this.require('another_plugin');
|
||||
});
|
||||
```
|
||||
|
||||
## Overriding Methods
|
||||
|
||||
Methods should be extended by [wrapping them](http://coreymaynard.com/blog/extending-a-javascript-function/):
|
||||
|
||||
```js
|
||||
var self = this;
|
||||
this.someMethod = (function() {
|
||||
var original = self.someMethod;
|
||||
return function() {
|
||||
// do your logic
|
||||
return original.apply(this, arguments);
|
||||
};
|
||||
})();
|
||||
```
|
||||
|
||||
**Important:** If the method you're overriding returns a value, make sure the
|
||||
overridden function returns a value as well.
|
||||
|
||||
## DOM Events
|
||||
|
||||
Because all elements for the control are created within the `setup()` method (which is
|
||||
invoked after the plugin initialized) events should be added by overriding the setup method,
|
||||
like so:
|
||||
|
||||
```js
|
||||
Selectize.define('plugin_name', function(options) {
|
||||
var self = this;
|
||||
|
||||
// override the setup method to add an extra `click` handler
|
||||
this.setup = (function() {
|
||||
var original = self.setup;
|
||||
return function() {
|
||||
original.apply(this, arguments);
|
||||
this.$control.on('click', 'div', function(e) {
|
||||
alert('A div was clicked!');
|
||||
});
|
||||
};
|
||||
})();
|
||||
|
||||
});
|
||||
```
|
||||
|
||||
## Plugin Usage
|
||||
|
||||
#### List (without options)
|
||||
|
||||
```js
|
||||
$('select').selectize({
|
||||
plugins: ['plugin_a', 'plugin_b']
|
||||
});
|
||||
```
|
||||
|
||||
#### List (with options)
|
||||
|
||||
```js
|
||||
$('select').selectize({
|
||||
plugins: {
|
||||
'plugin_a': { /* ... */ },
|
||||
'plugin_b': { /* ... */ }
|
||||
}
|
||||
});
|
||||
```
|
||||
|
||||
For a more detailed description of plugin option formats and how the plugin system works, check out the [microplugin](https://github.com/brianreavis/microplugin.js) documentation.
|
||||
Reference in New Issue
Block a user