Skip to content

Instantly share code, notes, and snippets.

@annevk annevk/credit.md
Last active Aug 29, 2015

Embed
What would you like to do?
Imperative Distribution

After Ryosuke, Travis, Wilson, William, and I discussed the problem for an hour over a burrito, William came up with this approach. All hail William.

var shadow = host.createShadowRoot({
mode: "closed",
distribute: (distributionList, insertionList) => {
for(var i = 0; i < distributionList.length; i++) {
for(var ii = 0; ii < insertionList.length; ii++) {
var select = insertionList[ii].getAttribute("select")
if(select != null && distributionList[i].matches(select)) {
insertionList[ii].add(distrubtionList[i])
} else if(select == null) {
insertionList[ii].add(distrubtionList[i])
}
}
}
}
})
host.shadowRoot.distribute()
// mutation observer code that invokes distribute() on childList changes
callback DistributionCallback = void (sequence<(Text or Element)>, sequence<HTMLContentElement>);
enum ShadowRootMode { "open", "closed" };
dictionary ShadowRootInit {
require ShadowRootMode mode;
require DistributionCallback distribute;
};
partial interface Element {
ShadowRoot createShadowRoot(ShadowRootInit options);
};
partial interface ShadowRoot {
void distribute(); // invoke the callback, recursively if there's nesting
};
interface HTMLContentElement : HTMLElement {
void add((Text or Element) node);
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.