[d24f17c] | 1 | # Minim
|
---|
| 2 |
|
---|
| 3 |
|
---|
| 4 | A library for interacting with [Refract elements](https://github.com/refractproject/refract-spec).
|
---|
| 5 |
|
---|
| 6 | ## Install
|
---|
| 7 |
|
---|
| 8 | ```shell
|
---|
| 9 | $ npm install minim
|
---|
| 10 | ```
|
---|
| 11 |
|
---|
| 12 | ## About
|
---|
| 13 |
|
---|
| 14 | In working with the XML-based DOM, there is a limitation on what types are available in the document. Element attributes may only be strings, and element values can only be strings, mixed types, and nested elements.
|
---|
| 15 |
|
---|
| 16 | JSON provides additional types, which include objects, arrays, booleans, and nulls. A plain JSON document, though, provides no structure and no attributes for each property and value in the document.
|
---|
| 17 |
|
---|
| 18 | Refract is a JSON structure for JSON documents to make a more flexible document object model. In Refract, each element has three components:
|
---|
| 19 |
|
---|
| 20 | 1. Name of the element
|
---|
| 21 | 1. Metadata
|
---|
| 22 | 1. Attributes
|
---|
| 23 | 1. Content (which can be of different elements depending on the element)
|
---|
| 24 |
|
---|
| 25 | An element ends up looking like this:
|
---|
| 26 |
|
---|
| 27 | ```javascript
|
---|
| 28 | const element = {
|
---|
| 29 | element: 'string',
|
---|
| 30 | content: 'bar'
|
---|
| 31 | };
|
---|
| 32 | ```
|
---|
| 33 |
|
---|
| 34 | ## Usage
|
---|
| 35 |
|
---|
| 36 | ### Converting JavaScript Values into Elements
|
---|
| 37 |
|
---|
| 38 | ```javascript
|
---|
| 39 | var minim = require('minim').namespace();
|
---|
| 40 | var arrayElement = minim.toElement([1, 2, 3]);
|
---|
| 41 | var refract = minim.toRefract(arrayElement);
|
---|
| 42 | ```
|
---|
| 43 |
|
---|
| 44 | The `refract` variable above has the following JSON value.
|
---|
| 45 |
|
---|
| 46 | ```json
|
---|
| 47 | {
|
---|
| 48 | "element": "array",
|
---|
| 49 | "content": [
|
---|
| 50 | {
|
---|
| 51 | "element": "number",
|
---|
| 52 | "content": 1
|
---|
| 53 | },
|
---|
| 54 | {
|
---|
| 55 | "element": "number",
|
---|
| 56 | "content": 2
|
---|
| 57 | },
|
---|
| 58 | {
|
---|
| 59 | "element": "number",
|
---|
| 60 | "content": 3
|
---|
| 61 | }
|
---|
| 62 | ]
|
---|
| 63 | }
|
---|
| 64 | ```
|
---|
| 65 |
|
---|
| 66 | ### Converting Serialized Refract into Elements
|
---|
| 67 |
|
---|
| 68 | Serialized Refract can be converted back to Minim elements to make a roundtrip.
|
---|
| 69 |
|
---|
| 70 | ```javascript
|
---|
| 71 | var arrayElement1 = minim.toElement([1, 2, 3]);
|
---|
| 72 | var refracted = minim.toRefract(arrayElement1);
|
---|
| 73 | var arrayElement2 = minim.fromRefract(refracted);
|
---|
| 74 | ```
|
---|
| 75 |
|
---|
| 76 | Note that due to optional refracting in `meta`, anything that looks like an element in the given serialization will be loaded as such.
|
---|
| 77 |
|
---|
| 78 | ### Extending elements
|
---|
| 79 |
|
---|
| 80 | You can extend elements using the `extend` static method.
|
---|
| 81 |
|
---|
| 82 | ```javascript
|
---|
| 83 | var StringElement = minim.getElementClass('string');
|
---|
| 84 | var NewElement = StringElement.extend({
|
---|
| 85 | constructor: function() {
|
---|
| 86 | this.__super();
|
---|
| 87 | },
|
---|
| 88 |
|
---|
| 89 | customMethod: function() {
|
---|
| 90 | // custom code here
|
---|
| 91 | }
|
---|
| 92 | })
|
---|
| 93 | ```
|
---|
| 94 |
|
---|
| 95 | ### Element Attributes
|
---|
| 96 |
|
---|
| 97 | Each Minim element provides the following attributes:
|
---|
| 98 |
|
---|
| 99 | - element (string) - The name of the element
|
---|
| 100 | - meta (object) - The element's metadata
|
---|
| 101 | - attributes (object) - The element's attributes
|
---|
| 102 | - content - The element's content, e.g. a list of other elements.
|
---|
| 103 |
|
---|
| 104 | Additionally, convenience attributes are exposed on the element:
|
---|
| 105 |
|
---|
| 106 | - id (StringElement) - Shortcut for `.meta.get('id')`.
|
---|
| 107 | - name (StringElement) - Shortcut for `.meta.get('name')`.
|
---|
| 108 | - classes (ArrayElement) - Shortcut for `.meta.get('classes')`.
|
---|
| 109 | - title (StringElement) - Shortcut for `.meta.get('title')`.
|
---|
| 110 | - description (StringElement) - Shortcut for `.meta.get('description')`.
|
---|
| 111 |
|
---|
| 112 | ### Element Methods
|
---|
| 113 |
|
---|
| 114 | Each Minim element provides the following methods.
|
---|
| 115 |
|
---|
| 116 | #### toValue
|
---|
| 117 |
|
---|
| 118 | The `toValue` method returns the JSON value of the Minim element.
|
---|
| 119 |
|
---|
| 120 | ```javascript
|
---|
| 121 | var arrayElement = minim.toElement([1, 2, 3]);
|
---|
| 122 | var arrayValue = arrayElement.toValue(); // [1, 2, 3]
|
---|
| 123 | ```
|
---|
| 124 |
|
---|
| 125 | #### toRef
|
---|
| 126 |
|
---|
| 127 | The `toRef` method returns a RefElement referencing the element.
|
---|
| 128 |
|
---|
| 129 | ```javascript
|
---|
| 130 | var ref = element.toRef();
|
---|
| 131 | ```
|
---|
| 132 |
|
---|
| 133 | `toRef` accepts an optional path.
|
---|
| 134 |
|
---|
| 135 | ```javascript
|
---|
| 136 | var ref = element.toRef('attributes');
|
---|
| 137 | ```
|
---|
| 138 |
|
---|
| 139 | #### equals
|
---|
| 140 |
|
---|
| 141 | Allows for testing equality with the content of the element.
|
---|
| 142 |
|
---|
| 143 | ```javascript
|
---|
| 144 | var stringElement = minim.toElement("foobar");
|
---|
| 145 | stringElement.equals('abcd'); // returns false
|
---|
| 146 | ```
|
---|
| 147 |
|
---|
| 148 | #### clone
|
---|
| 149 |
|
---|
| 150 | Creates a clone of the given instance.
|
---|
| 151 |
|
---|
| 152 | ```javascript
|
---|
| 153 | var stringElement = minim.toElement("foobar");
|
---|
| 154 | var stringElementClone = stringElement.clone();
|
---|
| 155 | ```
|
---|
| 156 |
|
---|
| 157 | #### findRecursive
|
---|
| 158 |
|
---|
| 159 | Recursively find an element. Returns an ArrayElement containing all elements
|
---|
| 160 | that match the given element name.
|
---|
| 161 |
|
---|
| 162 | ```javascript
|
---|
| 163 | const strings = element.findRecursive('string');
|
---|
| 164 | ```
|
---|
| 165 |
|
---|
| 166 | You may pass multiple element names to `findRecursive`. When multiple element
|
---|
| 167 | names are passed down, minim will only find an element that is found within
|
---|
| 168 | the other given elements. For example, we can pass in `member` and `string` so
|
---|
| 169 | that we are recursively looking for all `string` elements that are found within a
|
---|
| 170 | `member` element:
|
---|
| 171 |
|
---|
| 172 | ```javascript
|
---|
| 173 | const stringInsideMembers = element.findRecursive('member', 'string');
|
---|
| 174 | ```
|
---|
| 175 |
|
---|
| 176 | #### children
|
---|
| 177 |
|
---|
| 178 | The `children` property returns an `ArrayElement` containing all of the direct children elements.
|
---|
| 179 |
|
---|
| 180 | ```javascript
|
---|
| 181 | var arrayElement = minim.toElement(['a', [1, 2], 'b', 3]);
|
---|
| 182 | var numbers = arrayElement.children(function(el) {
|
---|
| 183 | return el.element === 'number';
|
---|
| 184 | }).toValue(); // [3]
|
---|
| 185 | ```
|
---|
| 186 |
|
---|
| 187 | #### recursiveChildren
|
---|
| 188 |
|
---|
| 189 | The `recursiveChildren` property returns an `ArrayElement` containing all of the children elements recursively.
|
---|
| 190 |
|
---|
| 191 | ```javascript
|
---|
| 192 | var arrayElement = minim.toElement(['a', [1, 2], 'b', 3]);
|
---|
| 193 | var children = arrayElement.recursiveChildren;
|
---|
| 194 | children.toValue(); // ['a', 1, 2, 'b', 3]
|
---|
| 195 | ```
|
---|
| 196 |
|
---|
| 197 | ##### Chaining
|
---|
| 198 |
|
---|
| 199 | ```javascript
|
---|
| 200 | var evenNumbers = array
|
---|
| 201 | .recursiveChildren
|
---|
| 202 | .findByElement('number')
|
---|
| 203 | .filter((element) => element.toValue() % 2)
|
---|
| 204 | ```
|
---|
| 205 |
|
---|
| 206 | ### Minim Elements
|
---|
| 207 |
|
---|
| 208 | Minim supports the following primitive elements
|
---|
| 209 |
|
---|
| 210 | #### NullElement
|
---|
| 211 |
|
---|
| 212 | This is an element for representing the `null` value.
|
---|
| 213 |
|
---|
| 214 | #### StringElement
|
---|
| 215 |
|
---|
| 216 | This is an element for representing string values.
|
---|
| 217 |
|
---|
| 218 | ##### set
|
---|
| 219 |
|
---|
| 220 | The `set` method sets the value of the `StringElement` instance.
|
---|
| 221 |
|
---|
| 222 | ```javascript
|
---|
| 223 | var stringElement = minim.toElement('');
|
---|
| 224 | stringElement.set('foobar');
|
---|
| 225 | var value = stringElement.toValue() // toValue() returns 'foobar'
|
---|
| 226 | ```
|
---|
| 227 |
|
---|
| 228 | #### NumberElement
|
---|
| 229 |
|
---|
| 230 | This is an element for representing number values.
|
---|
| 231 |
|
---|
| 232 | ##### set
|
---|
| 233 |
|
---|
| 234 | The `set` method sets the value of the `NumberElement` instance.
|
---|
| 235 |
|
---|
| 236 | ```javascript
|
---|
| 237 | var numberElement = minim.toElement(0);
|
---|
| 238 | numberElement.set(4);
|
---|
| 239 | var value = numberElement.toValue() // toValue() returns 4
|
---|
| 240 | ```
|
---|
| 241 |
|
---|
| 242 | #### BooleanElement
|
---|
| 243 |
|
---|
| 244 | This is an element for representing boolean values.
|
---|
| 245 |
|
---|
| 246 | ##### set
|
---|
| 247 |
|
---|
| 248 | The `set` method sets the value of the `BooleanElement` instance.
|
---|
| 249 |
|
---|
| 250 | ```javascript
|
---|
| 251 | var booleanElement = minim.toElement(false);
|
---|
| 252 | booleanElement.set(true);
|
---|
| 253 | var value = booleanElement.toValue() // toValue() returns true
|
---|
| 254 | ```
|
---|
| 255 |
|
---|
| 256 | #### ArrayElement
|
---|
| 257 |
|
---|
| 258 | This is an element for representing arrays.
|
---|
| 259 |
|
---|
| 260 | ##### Iteration
|
---|
| 261 |
|
---|
| 262 | The array element is iterable if the environment supports the [iteration protocol](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Iteration_protocols#iterable). You can then use the element in `for ... of` loops, use the spread operator, `yield*`, and destructuring assignment.
|
---|
| 263 |
|
---|
| 264 | ```js
|
---|
| 265 | const arrayElement = minim.toElement(['a', 'b', 'c']);
|
---|
| 266 |
|
---|
| 267 | for (let item of arrayElement) {
|
---|
| 268 | console.log(item);
|
---|
| 269 | }
|
---|
| 270 | ```
|
---|
| 271 |
|
---|
| 272 | ##### get
|
---|
| 273 |
|
---|
| 274 | The `get` method returns the item of the `ArrayElement` instance at the given index.
|
---|
| 275 |
|
---|
| 276 | ```javascript
|
---|
| 277 | var arrayElement = minim.toElement(['a', 'b', 'c']);
|
---|
| 278 | var value = arrayElement.get(0) // get(0) returns item for 'a'
|
---|
| 279 | ```
|
---|
| 280 |
|
---|
| 281 | ##### getValue
|
---|
| 282 |
|
---|
| 283 | The `getValue` method returns the value of the item of the `ArrayElement` instance at the given index.
|
---|
| 284 |
|
---|
| 285 | ```javascript
|
---|
| 286 | var arrayElement = minim.toElement(['a', 'b', 'c']);
|
---|
| 287 | var value = arrayElement.getValue(0) // get(0) returns 'a'
|
---|
| 288 | ```
|
---|
| 289 |
|
---|
| 290 | ##### getIndex
|
---|
| 291 |
|
---|
| 292 | The `getIndex` method returns the item of the array at a given index.
|
---|
| 293 |
|
---|
| 294 | ```javascript
|
---|
| 295 | var arrayElement = minim.toElement(['a', 'b', 'c']);
|
---|
| 296 | var value = arrayElement.getIndex(0) // returns the item for 'a'
|
---|
| 297 | ```
|
---|
| 298 |
|
---|
| 299 | ##### set
|
---|
| 300 |
|
---|
| 301 | The `set` method sets the value of the `ArrayElement` instance.
|
---|
| 302 |
|
---|
| 303 | ```javascript
|
---|
| 304 | var arrayElement = minim.toElement([]);
|
---|
| 305 | arrayElement.set(0, 'z');
|
---|
| 306 | var value = arrayElement.get(0) // get(0) returns 'z'
|
---|
| 307 | ```
|
---|
| 308 |
|
---|
| 309 | ##### remove
|
---|
| 310 |
|
---|
| 311 | The `remove` method removes an item (specified by index) from the `ArrayElement` instance.
|
---|
| 312 |
|
---|
| 313 | ```javascript
|
---|
| 314 | var arrayElement = minim.toElement(['a', 'b', 'c']);
|
---|
| 315 | arrayElement.remove(0);
|
---|
| 316 | var value = arrayElement.get(0) // returns 'b'
|
---|
| 317 | ```
|
---|
| 318 |
|
---|
| 319 | ##### map
|
---|
| 320 |
|
---|
| 321 | The `map` method may be used to map over an array. Each item given is a Minim instance.
|
---|
| 322 |
|
---|
| 323 | ```javascript
|
---|
| 324 | var arrayElement =minim.toElement(['a', 'b', 'c']);
|
---|
| 325 | var newArray = arrayElement.map(function(item) {
|
---|
| 326 | return item.element;
|
---|
| 327 | }); // newArray is now ['string', 'string', 'string']
|
---|
| 328 | ```
|
---|
| 329 |
|
---|
| 330 | ##### filter
|
---|
| 331 |
|
---|
| 332 | The `filter` method may be used to filter a Minim array. This method returns a Minim array itself rather than a JavaScript array instance.
|
---|
| 333 |
|
---|
| 334 | ```javascript
|
---|
| 335 | var arrayElement = minim.toElement(['a', 'b', 'c']);
|
---|
| 336 | var newArray = arrayElement.filter(function(item) {
|
---|
| 337 | return item.toValue() === 'a'
|
---|
| 338 | }); // newArray.toValue() is now ['a']
|
---|
| 339 | ```
|
---|
| 340 |
|
---|
| 341 | ##### reduce
|
---|
| 342 |
|
---|
| 343 | The `reduce` method may be used to reduce over a Minim array or object. The method takes a function and an optional beginning value.
|
---|
| 344 |
|
---|
| 345 | ```javascript
|
---|
| 346 | var numbers = minim.toElement([1, 2, 3, 4]);
|
---|
| 347 | var total = numbers.reduce(function(result, item) {
|
---|
| 348 | return result.toValue() + item.toValue();
|
---|
| 349 | }); // total.toValue() === 10
|
---|
| 350 | ```
|
---|
| 351 |
|
---|
| 352 | The `reduce` method also takes an initial value, which can either be a value or Minim element.
|
---|
| 353 |
|
---|
| 354 | ```javascript
|
---|
| 355 | var numbers = minim.toElement([1, 2, 3, 4]);
|
---|
| 356 | var total = numbers.reduce(function(result, item) {
|
---|
| 357 | return result.toValue() + item.toValue();
|
---|
| 358 | }, 10); // total.toValue() === 20
|
---|
| 359 | ```
|
---|
| 360 |
|
---|
| 361 | The `reduce` method also works with objects:
|
---|
| 362 |
|
---|
| 363 | ```javascript
|
---|
| 364 | var objNumbers = minim.toElement({a: 1, b:2, c:3, d:4});
|
---|
| 365 | var total = objNumbers.reduce(function(result, item) {
|
---|
| 366 | return result.toValue() + item.toValue();
|
---|
| 367 | }, 10); // total.toValue() === 20
|
---|
| 368 | ```
|
---|
| 369 |
|
---|
| 370 | The function passed to `reduce` can accept up to five optional parameters and depends on whether you are using an array element or object element:
|
---|
| 371 |
|
---|
| 372 | **Array**
|
---|
| 373 | 1. `result`: the reduced value thus far
|
---|
| 374 | 2. `item`: the current item in the array
|
---|
| 375 | 3. `index`: the zero-based index of the current item in the array
|
---|
| 376 | 4. `arrayElement`: the array element which contains `item` (e.g. `numbers` above)
|
---|
| 377 |
|
---|
| 378 | **Object**
|
---|
| 379 | 1. `result`: the reduced value thus far
|
---|
| 380 | 2. `item`: the value element of the current item in the object
|
---|
| 381 | 3. `key`: the key element of the current item in the object
|
---|
| 382 | 4. `memberElement`: the member element which contains `key` and `value`
|
---|
| 383 | 5. `objectElement`: the object element which contains `memberElement` (e.g. `objNumbers` above)
|
---|
| 384 |
|
---|
| 385 | ##### forEach
|
---|
| 386 |
|
---|
| 387 | The `forEach` method may be used to iterate over a Minim array.
|
---|
| 388 |
|
---|
| 389 | ```javascript
|
---|
| 390 | var arrayElement = minim.toElement(['a', 'b', 'c']);
|
---|
| 391 | arrayElement.forEach(function(item) {
|
---|
| 392 | console.log(item.toValue())
|
---|
| 393 | }); // logs each value to console
|
---|
| 394 | ```
|
---|
| 395 |
|
---|
| 396 | ##### shift
|
---|
| 397 |
|
---|
| 398 | The `shift` method may be used to remove an item from the start of a Minim array.
|
---|
| 399 |
|
---|
| 400 | ```javascript
|
---|
| 401 | var arrayElement = minim.toElement(['a', 'b', 'c']);
|
---|
| 402 | var element = arrayElement.shift();
|
---|
| 403 | console.log(element.toValue()); // a
|
---|
| 404 | ```
|
---|
| 405 |
|
---|
| 406 | ##### unshift
|
---|
| 407 |
|
---|
| 408 | The `unshift` method may be used to inserts items to the start of a Minim array.
|
---|
| 409 |
|
---|
| 410 | ```javascript
|
---|
| 411 | var arrayElement = minim.toElement(['a', 'b', 'c']);
|
---|
| 412 | arrayElement.unshift('d');
|
---|
| 413 | console.log(arrayElement.toValue()); // ['d', 'a', 'b', 'c']
|
---|
| 414 | ```
|
---|
| 415 |
|
---|
| 416 | ##### push
|
---|
| 417 |
|
---|
| 418 | The `push` method may be used to add items to a Minim array.
|
---|
| 419 |
|
---|
| 420 | ```javascript
|
---|
| 421 | var arrayElement = minim.toElement(['a', 'b', 'c']);
|
---|
| 422 | arrayElement.push('d');
|
---|
| 423 | console.log(arrayElement.toValue()); // ['a', 'b', 'c', 'd']
|
---|
| 424 | ```
|
---|
| 425 |
|
---|
| 426 | ##### find
|
---|
| 427 |
|
---|
| 428 | The `find` method traverses the entire descendent element tree and returns an `ArrayElement` of all elements that match the conditional function given.
|
---|
| 429 |
|
---|
| 430 | ```javascript
|
---|
| 431 | var arrayElement = minim.toElement(['a', [1, 2], 'b', 3]);
|
---|
| 432 | var numbers = arrayElement.find(function(el) {
|
---|
| 433 | return el.element === 'number'
|
---|
| 434 | }).toValue(); // [1, 2, 3]
|
---|
| 435 | ```
|
---|
| 436 |
|
---|
| 437 | ##### findByClass
|
---|
| 438 |
|
---|
| 439 | The `findByClass` method traverses the entire descendent element tree and returns an `ArrayElement` of all elements that match the given class.
|
---|
| 440 |
|
---|
| 441 | ##### findByElement
|
---|
| 442 |
|
---|
| 443 | The `findByElement` method traverses the entire descendent element tree and returns an `ArrayElement` of all elements that match the given element name.
|
---|
| 444 |
|
---|
| 445 | ##### getById
|
---|
| 446 |
|
---|
| 447 | Search the entire tree to find a matching ID.
|
---|
| 448 |
|
---|
| 449 | ```javascript
|
---|
| 450 | elTree.getById('some-id');
|
---|
| 451 | ```
|
---|
| 452 |
|
---|
| 453 | ##### includes
|
---|
| 454 |
|
---|
| 455 | Test to see if a collection includes the value given. Does a deep equality check.
|
---|
| 456 |
|
---|
| 457 | ```javascript
|
---|
| 458 | var arrayElement = minim.toElement(['a', [1, 2], 'b', 3]);
|
---|
| 459 | arrayElement.includes('a'); // returns true
|
---|
| 460 | ```
|
---|
| 461 |
|
---|
| 462 | ##### length
|
---|
| 463 |
|
---|
| 464 | Returns the amount of items in the array element.
|
---|
| 465 |
|
---|
| 466 | ```javascript
|
---|
| 467 | arrayElement.length;
|
---|
| 468 | ```
|
---|
| 469 |
|
---|
| 470 | ##### isEmpty
|
---|
| 471 |
|
---|
| 472 | Returns whether the array element is empty.
|
---|
| 473 |
|
---|
| 474 | ```javascript
|
---|
| 475 | if (arrayElement.isEmpty) {
|
---|
| 476 | console.log("We have an empty array");
|
---|
| 477 | }
|
---|
| 478 | ```
|
---|
| 479 |
|
---|
| 480 | ##### first
|
---|
| 481 |
|
---|
| 482 | Returns the first element in the collection.
|
---|
| 483 |
|
---|
| 484 | ```javascript
|
---|
| 485 | var arrayElement = minim.toElement(['a', [1, 2], 'b', 3]);
|
---|
| 486 | arrayElement.first; // returns the element for "a"
|
---|
| 487 | ```
|
---|
| 488 |
|
---|
| 489 | ##### second
|
---|
| 490 |
|
---|
| 491 | Returns the second element in the collection.
|
---|
| 492 |
|
---|
| 493 | ```javascript
|
---|
| 494 | var arrayElement = minim.toElement(['a', [1, 2], 'b', 3]);
|
---|
| 495 | arrayElement.second; // returns the element for "[1, 2]"
|
---|
| 496 | ```
|
---|
| 497 |
|
---|
| 498 | ##### last
|
---|
| 499 |
|
---|
| 500 | Returns the last element in the collection.
|
---|
| 501 |
|
---|
| 502 | ```javascript
|
---|
| 503 | var arrayElement = minim.toElement(['a', [1, 2], 'b', 3]);
|
---|
| 504 | arrayElement.last; // returns the element for "3"
|
---|
| 505 | ```
|
---|
| 506 |
|
---|
| 507 | #### ObjectElement
|
---|
| 508 |
|
---|
| 509 | This is an element for representing objects. Objects store their items as an ordered array, so they inherit most of the methods above from the `ArrayElement`.
|
---|
| 510 |
|
---|
| 511 | ##### get
|
---|
| 512 |
|
---|
| 513 | The `get` method returns the `ObjectElement` instance at the given name.
|
---|
| 514 | See `getKey` and `getMember` for ways to get more instances around a key-value pair.
|
---|
| 515 |
|
---|
| 516 | ```javascript
|
---|
| 517 | var objectElement = minim.toElement({ foo: 'bar' });
|
---|
| 518 | var value = objectElement.get('foo') // returns string instance for 'bar'
|
---|
| 519 | ```
|
---|
| 520 |
|
---|
| 521 | ##### getValue
|
---|
| 522 |
|
---|
| 523 | The `getValue` method returns the value of the `ObjectElement` instance at the given name.
|
---|
| 524 |
|
---|
| 525 | ```javascript
|
---|
| 526 | var objectElement = minim.toElement({ foo: 'bar' });
|
---|
| 527 | var value = objectElement.getValue('foo') // returns 'bar'
|
---|
| 528 | ```
|
---|
| 529 |
|
---|
| 530 | ##### getKey
|
---|
| 531 |
|
---|
| 532 | The `getKey` method returns the key element of a key-value pair.
|
---|
| 533 |
|
---|
| 534 | ```javascript
|
---|
| 535 | var objectElement = minim.toElement({ foo: 'bar' });
|
---|
| 536 | var key = objectElement.getKey('foo') // returns the key element instance
|
---|
| 537 | ```
|
---|
| 538 |
|
---|
| 539 | ##### getMember
|
---|
| 540 |
|
---|
| 541 | The `getMember` method returns the entire member for a key-value pair.
|
---|
| 542 |
|
---|
| 543 | ```javascript
|
---|
| 544 | var objectElement = minim.toElement({ foo: 'bar' });
|
---|
| 545 | var member = objectElement.getMember('foo') // returns the member element
|
---|
| 546 | var key = member.key; // returns what getKey('foo') returns
|
---|
| 547 | var value = member.value; // returns what get('foo') returns
|
---|
| 548 | ```
|
---|
| 549 |
|
---|
| 550 | ##### set
|
---|
| 551 |
|
---|
| 552 | The `set` method sets the value of the `ObjectElement` instance.
|
---|
| 553 |
|
---|
| 554 | ```javascript
|
---|
| 555 | var objectElement = minim.toElement({});
|
---|
| 556 | objectElement.set('foo', 'hello world');
|
---|
| 557 | var value = objectElement.get('foo') // get('foo') returns 'hello world'
|
---|
| 558 | ```
|
---|
| 559 |
|
---|
| 560 | ##### keys
|
---|
| 561 |
|
---|
| 562 | The `keys` method returns an array of keys.
|
---|
| 563 |
|
---|
| 564 | ```javascript
|
---|
| 565 | var objectElement = minim.toElement({ foo: 'bar' });
|
---|
| 566 | var keys = objectElement.keys() // ['foo']
|
---|
| 567 | ```
|
---|
| 568 |
|
---|
| 569 | ##### remove
|
---|
| 570 |
|
---|
| 571 | The `remove` method removes a key from the `ObjectElement` instance.
|
---|
| 572 |
|
---|
| 573 | ```javascript
|
---|
| 574 | var objectElement = minim.toElement({ foo: 'bar' });
|
---|
| 575 | objectElement.remove('foo');
|
---|
| 576 | var keys = objectElement.keys() // []
|
---|
| 577 | ```
|
---|
| 578 |
|
---|
| 579 | > You can use elementa.meta.remove() or element.attributes.remove() because of this.
|
---|
| 580 |
|
---|
| 581 | ##### values
|
---|
| 582 |
|
---|
| 583 | The `values` method returns an array of keys.
|
---|
| 584 |
|
---|
| 585 | ```javascript
|
---|
| 586 | var objectElement = minim.toElement({ foo: 'bar' });
|
---|
| 587 | var values = objectElement.values() // ['bar']
|
---|
| 588 | ```
|
---|
| 589 |
|
---|
| 590 | ##### items
|
---|
| 591 |
|
---|
| 592 | The `items` method returns an array of key value pairs which can make iteration simpler.
|
---|
| 593 |
|
---|
| 594 | ```js
|
---|
| 595 | const objectElement = minim.toElement({ foo: 'bar' });
|
---|
| 596 |
|
---|
| 597 | for (let [key, value] of objectElement.items()) {
|
---|
| 598 | console.log(key, value); // foo, bar
|
---|
| 599 | }
|
---|
| 600 | ```
|
---|
| 601 |
|
---|
| 602 | ##### map, filter, reduce, and forEach
|
---|
| 603 |
|
---|
| 604 | The `map`, `filter`, and `forEach` methods work similar to the `ArrayElement` map function, but the callback receives the value, key, and member element instances. The `reduce` method receives the reduced value, value, key, member, and object element instances.
|
---|
| 605 |
|
---|
| 606 | See `getMember` to see more on how to interact with member elements.
|
---|
| 607 |
|
---|
| 608 | ```js
|
---|
| 609 | const objectElement = minim.toElement({ foo: 'bar' });
|
---|
| 610 | const values = objectElement.map((value, key, member) => {
|
---|
| 611 | // key is an instance for foo
|
---|
| 612 | // value is an instance for bar
|
---|
| 613 | // member is an instance for the member element
|
---|
| 614 | return [key.toValue(), value.toValue()]; // ['foo', 'bar']
|
---|
| 615 | });
|
---|
| 616 | ```
|
---|
| 617 |
|
---|
| 618 | ### Namespace
|
---|
| 619 |
|
---|
| 620 | #### Namespace Methods
|
---|
| 621 |
|
---|
| 622 | ##### `toRefract`
|
---|
| 623 |
|
---|
| 624 | The `toRefract` method returns the Refract value of the Minim element.
|
---|
| 625 |
|
---|
| 626 | Note that if any element in `meta` has metadata or attributes defined that would be lost by calling `toValue()` then that element is also converted to refract.
|
---|
| 627 |
|
---|
| 628 | ```javascript
|
---|
| 629 | var arrayElement = namespace.toElement([1, 2, 3]);
|
---|
| 630 | var refract = namespace.toRefract();
|
---|
| 631 | ```
|
---|
| 632 |
|
---|
| 633 | #### Customizing Namespaces
|
---|
| 634 |
|
---|
| 635 | Minim allows you to register custom elements. For example, if the element name you wish to handle is called `category` and it should be handled like an array:
|
---|
| 636 |
|
---|
| 637 | ```javascript
|
---|
| 638 | var minim = require('minim').namespace();
|
---|
| 639 | var ArrayElement = minim.getElementClass('array');
|
---|
| 640 |
|
---|
| 641 | // Register your custom element
|
---|
| 642 | minim.register('category', ArrayElement);
|
---|
| 643 |
|
---|
| 644 | // Load serialized refract elements that includes the new element
|
---|
| 645 | var elements = minim.fromRefract({
|
---|
| 646 | element: 'category',
|
---|
| 647 | meta: {},
|
---|
| 648 | attributes: {},
|
---|
| 649 | content: [
|
---|
| 650 | {
|
---|
| 651 | element: 'string',
|
---|
| 652 | meta: {},
|
---|
| 653 | attributes: {},
|
---|
| 654 | content: 'hello, world'
|
---|
| 655 | }
|
---|
| 656 | ]
|
---|
| 657 | });
|
---|
| 658 |
|
---|
| 659 | console.log(elements.get(0).content); // hello, world
|
---|
| 660 |
|
---|
| 661 | // Unregister your custom element
|
---|
| 662 | minim.unregister('category');
|
---|
| 663 | ```
|
---|
| 664 |
|
---|
| 665 | #### Creating Namespace Plugins
|
---|
| 666 |
|
---|
| 667 | It is also possible to create plugin modules that define elements for custom namespaces. Plugin modules should export a single `namespace` function that takes an `options` object which contains an existing namespace to which you can add your elements:
|
---|
| 668 |
|
---|
| 669 | ```javascript
|
---|
| 670 | var minim = require('minim').namespace();
|
---|
| 671 |
|
---|
| 672 | // Define your plugin module (normally done in a separate file)
|
---|
| 673 | var plugin = {
|
---|
| 674 | namespace: function(options) {
|
---|
| 675 | var base = options.base;
|
---|
| 676 | var ArrayElement = base.getElementClass('array');
|
---|
| 677 |
|
---|
| 678 | base.register('category', ArrayElement);
|
---|
| 679 |
|
---|
| 680 | return base;
|
---|
| 681 | }
|
---|
| 682 | }
|
---|
| 683 |
|
---|
| 684 | // Load the plugin
|
---|
| 685 | minim.use(plugin);
|
---|
| 686 | ```
|
---|
| 687 |
|
---|
| 688 | The `load` property may be used in addition to the `namespace` property when a plugin is not implementing a namespace.
|
---|
| 689 |
|
---|
| 690 | ```javascript
|
---|
| 691 | var minim = require('minim').namespace();
|
---|
| 692 |
|
---|
| 693 | // Define your plugin module (normally done in a separate file)
|
---|
| 694 | var plugin = {
|
---|
| 695 | load: function(options) {
|
---|
| 696 | // Plugin code here
|
---|
| 697 | return base;
|
---|
| 698 | }
|
---|
| 699 | }
|
---|
| 700 |
|
---|
| 701 | // Load the plugin
|
---|
| 702 | minim.use(plugin);
|
---|
| 703 | ```
|
---|
| 704 |
|
---|
| 705 | ### Chaining
|
---|
| 706 |
|
---|
| 707 | Methods may also be chained when using getters and setters.
|
---|
| 708 |
|
---|
| 709 | ```javascript
|
---|
| 710 | var objectElement = minim.toElement({})
|
---|
| 711 | .set('name', 'John Doe')
|
---|
| 712 | .set('email', 'john@example.com')
|
---|
| 713 | .set('id', 4)
|
---|
| 714 | ```
|
---|