@PelagicCreatures/sargasso

git / npm

Simple, Powerful, Fast, Supervised Javascript Controllers for HTML Elements.

Sargasso Makes HTML elements aware of events such as Document (DOM) insertions and deletions, HIJAX Page load, Scrolling, Resizing, Orientation and messages from Managed Web Workers allowing them to efficiently implement any behavior they need to perform.

Adding Your Sargasso class to an HTML element

Sargasso watches the DOM for any elements tagged with the `data-sargasso-class` attribute and instantiates the Sargasso class specified while hooking up the appropriate services. When the underlying element is removed from the DOM (loading a new page or something) it automatically destroys any dangling Sargasso objects.

<div data-sargasso-class="MyClass">This element has a MyClass Sargasso controller	</div>

You can also defer the instantiation using the lazy method by tagging it with `data-lazy-sargasso-class` instead of `data-sargasso-class` which will only start up the class when the element is visible in the viewport

arrow_downwardScoll down to see an element that is aware of when it is in the viewport and can do math in a web worker once it scrolls into view.

I'm off stage. This text will change when I scroll into view.

This Sargasso component watches for enterViewport events, does a little dance when it enters the viewport and then starts up a web worker to do some compution which reports back in the html of the element when done. See Code Here

I'm a noisy Sargasso controller - Look in the browser console to see what events I see.