Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/gghez/optionjs
Option manager for javascript components.
https://github.com/gghez/optionjs
Last synced: about 1 month ago
JSON representation
Option manager for javascript components.
- Host: GitHub
- URL: https://github.com/gghez/optionjs
- Owner: gghez
- License: mit
- Created: 2014-11-26T09:46:36.000Z (about 10 years ago)
- Default Branch: master
- Last Pushed: 2015-02-07T23:31:27.000Z (almost 10 years ago)
- Last Synced: 2024-11-08T11:12:17.497Z (about 2 months ago)
- Language: JavaScript
- Size: 930 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
optionjs
========Option manager for javascript components.
[![Build Status](https://travis-ci.org/gghez/optionjs.svg?branch=master)](https://travis-ci.org/gghez/optionjs)
[![NPM version](https://badge.fury.io/js/optionjs.png)](http://badge.fury.io/js/optionjs)## Why
Optionjs handles options creation using default values and read/write operations. The most interesting part of using optionjs is the ability to attach handler on an option value change.
Using kind of util inside a component to read/write related options also gives more flexibility to add more options in the future without changing your shipped interfaces.
## Installation
Using bower package manager:
```
bower install https://github.com/gghez/optionjs.git
```Using npm package manager for nodejs module:
```
npm install optionjs
```## Usage
You can use **optionjs** as client side javascript resource as well as nodejs module.
### Client side (Regular/HTML JS)
Reference **optionjs.js** script:
```html```
Assuming you create a prototype which needs to be configurable using option list. Optionjs replaces option management logical layer. Use **optionjs** this way:
```js
// onOpt1Change handler
function onOpt1Change(newValue, oldValue) {
console.log('opt1 option value changed from', opt1OldValue, 'to', opt1NewValue);
}// Constructor
var MyProto = function(options) {
this.options = new OptionsManager(options, {
'opt1': 'opt1 default value',
'opt2': null
});// An opt1 value change raises onOpt1Change function.
this.options.onChange('opt1', onOpt1Change);
};// Getter / Setter example
MyProto.prototype.options = function(optKey, optValue) {
if (optValue === undefined) { // Use as getter
return this.options.get(optKey);
} else { // Use as setter
this.options.set(optKey, optValue);
}
}
```### Server side (NodeJS)
```js
var optionjs = require('optionjs');var options = optionjs(
{ opt1: 'string1', opt3: 'string3'},
{ opt2: 'default string 2' }
);console.log(options.get('opt1')); // string 1
console.log(options.get('opt2')); // default string 2
```## API
###OptionsManager(options, defaults)
Constructor creates a new instance of **OptionsManager**.
Example:
```js
var options = OptionsManager(
{opt1: 'string1', opt3: null},
{opt2: 'string2', opt3: 'string3'});console.log(options.get('opt1')); // string1
console.log(options.get('opt2')); // string2
console.log(options.get('opt3')); // null
```
Parameter | Description
------------|------------
options | Options object using keys as option names and values as option values.
defaults | Options object used to complete ```options``` on non-existing option name.###.get(optKey)
Retrieves an option value given its name (```optKey```).###.set(optKey, optValue)
Defines or overrides existing option given its name (```optKey```) and new value (```optValue```).###.onChange(optKey, handler)
Attach an event handler called each time option has its value changed.Parameter | Description
------------|------------
optKey | The option name.
handler | A user defined function called with respectively new value and old value of option on which it has been attached.###.hasChangeHandler(optKey)
Indicates whether option named ```optKey``` has an attached handler spying its value changes.
Returns ```true``` or ```false``` only.##Development
1. Clone git repository
```
git clone https://github.com/gghez/optionjs.git
```
2. Installation
```
npm install
```
3. Run testsa. Continuous integration
```
grunt run
```b. One time
```
grunt test
```## License
[MIT](LICENSE)