cirnostream v1.0.5

CirnoStream

CirnoStream is a JavaScript event stream trigger, it can execute the function of Event periodically, and easy to manage those Event in Trigger Map.

The code form of CirnoStream is very close to setInterval and setTimeout, but more concise.

You can create a css animation in a simple way instead of setTimeout nest setTimeout. You can also set a periodic event and not to be worried about forgot clearInterval.

CirnoStream can help you manage those interval tasks without use more and more setTimeout or setInterval that can save lot of Browser resource.

Explore more, please to see the DEMO, expecting you find out more usages.

The document is poorly written and you are welcome to refine your documentation in the process of using it to better help others.

Install

First make sure you have installed the latest version of node.js (You may need to restart your computer after this step).

npm install cirnostream

Demo Usage

Please pull the repository from Github, npm version does not contain entire files.

npm install

npm run dev

Usage

IN Node

import CirnoStream from 'cirnostream';
// This is The deault delay of CirnoStream
const DefaultDelay = 1000;
// Get Stream Constructor
const { Stream } = CirnoStream;
// Create CirnoStream Commonly
const stream = new Stream(DefaultDelay);
// Via CirnoStream's create function
const stream = CirnoStream.create(DefaultDelay);

In Vue

// Use CirnoStream in Vue's entry file, usually locate in "./src/main./js"
Vue.use(CirnoStream);
// in Vue components, try it.
this.$stream.push(() => { console.log('Awsome! it works in Vue!'); });

IN Brower

<script src="https://cdn.jsdelivr.net/npm/cirnostream@1.0.5/build/cirnostream.min.js"></script>
<script>
    var stream = new CirnoStream();
    ...
</script>

Quick Start

// It's just like a 1000ms Timeout
stream.push(function (event) {
    ...
}, 1000);

// It's just like a 1000ms Interval
stream.push(function (event) {
    ...
}, 1000, true);

// function in list willbe executed one by one per 1000ms
stream.push([
    function A(event) { ... },
    function B(event) { ... },
    function C(event) { ... },
], 1000);

Advance

You can also use an object as options to add new Event. [see event options properties]

stream.push({
    name: 'AwsomeEvent',
    handler: function (item) {
        // your awsome code...
    },
    delay: 1000,
})

API Document

Stream Methods

Push Parameters

returnValue(String) Method push will return the name of Event which is defined manually or generated by uuid.v4

Push Options Properties

If handler is null or eventList is empty, Push Method will be refused to execute

Callback of Event

Event will call back a modified Object after handler, created or onclose function executed It it meaningless to change the property of this Object, because of that is not equal to the original Event

About "freeze" and "release"

// Suppose I have a time consuming task to wait, and I do not know the time of finish
stream.push(async (event) => {
    // Event will not to be triggered until release executed
    event.freeze();
    // this task perhaps consuming 5000ms or more
    await ComplicatedTask();
    // Event will be triggered in the next period
    event.release();
}, 1000, true)

Type of Modified Event

• execute: from handler of Event or functions of eventList.
• created: from function "created" of Event
• closed: from function "onclose" of Event
• forced: from method "on" of Stream, this method will execute handler of specific Event Compulsorily and dose not decrease the Number of Remain.
• get: from method "getEvent" of Stream