Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP

Loading…

adds dom/insertAt #54

Merged
merged 3 commits into from

1 participant

@MathiasPaumgarten

This module lets you insert an element or an array of nodes into the children of a parent node at a given index.

Not sure about the name but even less sure about the signature

Currently:

insertAt( parent, nodes, index );

I wonder if it should be

insertAt( parent, index, ...nodes );
@MathiasPaumgarten

@conradz Should a negative index count from the other end??

@MathiasPaumgarten MathiasPaumgarten merged commit 2512349 into master

1 check passed

Details default The Travis CI build passed
@MathiasPaumgarten MathiasPaumgarten deleted the dom/insertAt branch
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Commits on Jan 14, 2014
  1. adds dom/insertAt

    authored
Commits on Mar 3, 2014
Commits on Mar 10, 2014
This page is out of date. Refresh to see the latest.
Showing with 143 additions and 0 deletions.
  1. +33 −0 docs/dom.md
  2. +21 −0 source/dom/insertAt.js
  3. +89 −0 tests/dom/spec-insertAt.js
View
33 docs/dom.md
@@ -100,6 +100,39 @@ var f = fragment(element);
```
+## insertAt(parent, nodes, index)
+
+Inserts a node or an array of nodes into the parents list of children at given index. Any
+index smaller than 0 will determine the insertion point counting from the end of the array
+and any index larger than the amount of children in the parent node will result in appending the nodes.
+
+```html
+<ul id="list">
+ <li>One</li>
+ <li>Two</li>
+ <li>Four</li>
+ <li>Five</li>
+</ul>
+```
+```js
+var three = document.createElement("li");
+three.innerText = "Three";
+
+var ul = document.getElementById("list");
+
+insertAt(ul, three, 2);
+```
+This results in:
+```html
+<ul id="list">
+ <li>One</li>
+ <li>Two</li>
+ <li>Three</li>
+ <li>Four</li>
+ <li>Five</li>
+</ul>
+```
+
## matches(selector, items...)
Returns true if all items match the CSS selector.
View
21 source/dom/insertAt.js
@@ -0,0 +1,21 @@
+define([
+ "./append",
+ "./fragment"
+], function(append, fragment) {
+
+ function insertAt(parent, nodes, index) {
+
+ if (index < 0) {
+ index = Math.max(0, parent.children.length + index);
+ }
+
+ if (index >= parent.children.length) {
+ append(parent, nodes);
+ } else {
+ var sibling = parent.children[index];
+ parent.insertBefore(fragment(nodes), sibling);
+ }
+ }
+
+ return insertAt;
+});
View
89 tests/dom/spec-insertAt.js
@@ -0,0 +1,89 @@
+define(["cane/dom/insertAt"], function(insertAt) {
+
+ describe("dom/insertAt", function() {
+
+ it("should insert node at index", function() {
+ var parent = document.createElement("div"),
+ first = document.createElement("span"),
+ second = document.createElement("span"),
+ third = document.createElement("span"),
+ div = document.createElement("div");
+
+ parent.appendChild(first);
+ parent.appendChild(second);
+ parent.appendChild(third);
+
+ insertAt(parent, div, 1);
+
+ expect(parent.children[1]).to.be(div);
+ });
+
+ it("should append if index is higher then children", function() {
+ var parent = document.createElement("div"),
+ first = document.createElement("span"),
+ second = document.createElement("span"),
+ third = document.createElement("span"),
+ div = document.createElement("div");
+
+ parent.appendChild(first);
+ parent.appendChild(second);
+ parent.appendChild(third);
+
+ insertAt(parent, div, 10);
+
+ expect(parent.children[3]).to.be(div);
+ });
+
+ it("should determin index from the end of array if index is negative", function() {
+ var parent = document.createElement("div"),
+ first = document.createElement("span"),
+ second = document.createElement("span"),
+ third = document.createElement("span"),
+ foo = document.createElement("div");
+
+
+ parent.appendChild(first);
+ parent.appendChild(second);
+ parent.appendChild(third);
+
+ insertAt(parent, foo, -1);
+
+ expect(parent.children[0]).to.be(first);
+ expect(parent.children[1]).to.be(second);
+ expect(parent.children[2]).to.be(foo);
+ expect(parent.children[3]).to.be(third);
+
+ parent.removeChild(foo);
+
+ insertAt(parent, foo, -2);
+
+ expect(parent.children[1]).to.be(foo);
+
+ parent.removeChild(foo);
+
+ insertAt(parent, foo, -7);
+
+ expect(parent.children[0]).to.be(foo);
+ });
+
+ it("should insert multiple nodes", function() {
+ var parent = document.createElement("div"),
+ first = document.createElement("span"),
+ second = document.createElement("span"),
+ third = document.createElement("span"),
+ foo = document.createElement("div"),
+ bar = document.createElement("div");
+
+ parent.appendChild(first);
+ parent.appendChild(second);
+ parent.appendChild(third);
+
+ insertAt(parent, [foo, bar], 1);
+
+ expect(parent.children[1]).to.be(foo);
+ expect(parent.children[2]).to.be(bar);
+ });
+
+ });
+
+});
Something went wrong with that request. Please try again.