Raynos/0readme.md

## 0readme.md

      
    Raw
  

              0readme.md
            
          
    Widget

For when you need a widget interface
With sorta


## example.js
var sorta = require("sorta")
    , Element = require("fragment").Element
    , string = "<span data-foo></span>"
    , DeltaStream = require("delta-stream")
    , databind = require("data-bind")
    , SpliceStream = require("splice-stream")

var spliceStream = SpliceStream()
    , list = spliceStream.createList()
    , deltaStream = DeltaStream()
    , delta = deltaStream.createDelta()
    , sort = sorta({ list: "ul", item: "li" }, createWidget)

spliceStream.pipe(sort)

list.push(deltaStream)

delta.set("foo", "bar")

sort.appendTo(document.body)

/*
    <body>
        <ul>
            <li>
                <span data-foo>bar</span>
            </li>
        </ul>
    </body>
*/

function createWidget(stream, element) {
    var elem = Element(string)
        , widget = Widget(elem)

    stream.pipe(databind(elem))

    widget.appendTo(element)
}

## widget.js
module.exports = Widget

function Widget(elem) {
    return {
        appendTo: appendTo
    }

    function appendTo(parent) {
        parent.appendChild(elem)
    }
}
	var sorta = require("sorta")
	, Element = require("fragment").Element
	, string = "<span data-foo></span>"
	, DeltaStream = require("delta-stream")
	, databind = require("data-bind")
	, SpliceStream = require("splice-stream")

	var spliceStream = SpliceStream()
	, list = spliceStream.createList()
	, deltaStream = DeltaStream()
	, delta = deltaStream.createDelta()
	, sort = sorta({ list: "ul", item: "li" }, createWidget)

	spliceStream.pipe(sort)

	list.push(deltaStream)

	delta.set("foo", "bar")

	sort.appendTo(document.body)

	/*
	<body>
	<ul>
	<li>
	<span data-foo>bar</span>
	</li>
	</ul>
	</body>
	*/

	function createWidget(stream, element) {
	var elem = Element(string)
	, widget = Widget(elem)

	stream.pipe(databind(elem))

	widget.appendTo(element)
	}
	module.exports = Widget

	function Widget(elem) {
	return {
	appendTo: appendTo
	}

	function appendTo(parent) {
	parent.appendChild(elem)
	}
	}