0.3.0 • Published 7 years ago

promystore v0.3.0

Weekly downloads
-
License
ISC
Repository
github
Last release
7 years ago

PromyStore

By Matias Trujillo Olivares

formatsize
uncompress10.19KB
compress3.06KB
Gzip1.13KB

NPM

npm install promystore

Allows you to manage asynchronous states within an application by leveraging the potential of promises and Redux ideas on Flux. This tool perfectly complements PromyCycle

First steps

First I want to remember that you create PromyStore by understanding that all events generated within an application are mostly ASYNCHRONIZED (Server calls, client events, animations and time intervals). For this, PromyStore offers a simple interface, composed of 4 interaction methods to manage this asynchrony.

  • action : Allows you to define store actions
  • middleware : Define middleware that runs when launching an action
  • dispatch : Allows to issue shares to the store
  • subscribe : Subscribe to store changes
  • unsubscribe : Allows you to unsubscribe from store changes
  • child : It allows you to generate a child that issues the father changes of his own state.

Implementing PromyStore Example 1

This example demonstrates a simple storage based on a counter.

var store = new PromyStore(0);

store.middleware((store,action,next)=>{
  console.log(action)
  return next(store,action);
})

store.action({
  ADD(state,{value}){
    return state + value;
  },
  RES(state,{value}){
    return state - value;
  }
})

store.subscribe((state)=>{
  document.querySelector('#view-total').textContent = state;
})

Explaining Example 1

.middleware()

This method pertaining to the store allows to define a middleware for the same store, this one receives a function, that to the sold by the store will give 3 parameters

  • @param {Object} - It's store status
  • @param {Object} - The action issued by the dispatcher
  • @param {Function} - Function that allows to continue the process, this returns a promise
Synchronous execution
store.middleware((state,action)=>{
    console.log('State before action',state)
    state = next(state,action)
    console.log('State after action',state)
    return state;
})
Asynchronous execution

Note that to generate an asynchronous wait on next as a promise you must indicate that the action has an asynchronous behavior using the async property, That can be assigned mounted the current action or creating a new action with the property.

store.middleware((state,action)=>{
    action.async = true;  // !important
    console.log('State before action',state)
    return next(state,action)
           .then((state)=>{
              console.log('State after action',state)
           });
})

.action(<function|object>)

They allow to manage a state change based on a specific type of action, if by default the action is not defined, the action will be issued default

Defining actions for the store with a function
store.action((state,action)=>{
    return state
})
Defining actions for the store with an object
store.action({
    INIT(state,action){

    },
    default(state,action){

    }
})

remember that the action is saved inside an actions object, being a function this happens to define as default within the object but you can quickly replace it or add actions that redirect the default actions to a specific type

.child(<string|object,store>)

store.child({
  posts    : storePosts,
  comments : storeComments
})

It allows to generate properties belonging to the store, but these are in turn sub instances of PromyStore, similar to how it operates combinerReduce in redux, but this is asynchronous

.subscribe(<function,function,function>)

It allows to subscribe to the states of the store, this receives a function that when executed will receive 2 parameters store state and actin modifying the state.

store.subscribe(
  function onDone(){

  },
  function onError(){

  },
  function onNext(){

  }
)
.getState(string)

Allows obtaining the current state of the application, and if given a string parameter allows to choose the parameter of the state

var allStore   = store.getStore(),
    posts      = store.getStore('posts'),
    firstPosts = store.getStore('posts[0]')
.subscribe(onDone)

Is executed by defining until the last child of the state tree

.subscribe(false,onError)

Executed when an error is generated within the execution of the subscribed state

.subscribe(false,false,onNext)

It is executed when passing from one middleware to another until reaching the action in the subscribed state

Explaining the core

Run-time example

PromyStore Generates a single promise to control the general state of the store, this is created by launching the dispatcher with an action, this promise will hear other promises only in the following cases:

  • child : A subscriber son, The child can delay the update of the dispatcher, by a prosynous asynchronous
  • return : The cycle of promyStore is synchronous but ud to return a promise transforms it into asynchronous when dispatching the subscribers
  • action or middleware : If one of the 2 returns a promise, so that the suctors hope the promise

I invite you to contribute to this project, be it with testing, corrections or new ideas

0.3.0

7 years ago

0.2.6

7 years ago

0.2.5

7 years ago

0.2.4

7 years ago

0.2.3

7 years ago

0.2.2

7 years ago

0.2.1

7 years ago

0.2.0

7 years ago