2.5.2 • Published 3 years ago
passeljs v2.5.2
Passel JS
: a large number or amount
Passel is an IoT framework made on top of NodeJs with built in local, global, and file system component state.
trusted by
Getting Started
Example Usage:
For a working example, take a look at the example folder or run yarn dev in the root directory.
index.js
const passel = require("passeljs")
const TestComponent = require("./TestComponent.js")
passel.use(TestComponent)
passel.mountComponents()
TestComponent.js
const { Components } = require("passeljs")
module.exports = class TestComponent extends Components.Base{
constructor(props){
super(props)
this.componentName = "TestComponent" //required
this.state = {
temperature: 80,
windSpeed: 5,
}
}
componentDidMount(){ // All components are ready to go.
// State can be access directly through this.state or this.global if no reactivity is needed.
this.stateChanged.on("temperature", console.log) //called locally when the value of this.state.temperature changes
this.globalChanged.on("TestComponent.temperature", console.log) //called globally when TestComponent changes the value of this.state.temperature
const interval = setInterval(()=>{
this.setState({temperature: this.state.temperature + 2})
}, 2000)
setTimeout(()=>{
clearInterval(interval)
}, 10000)
}
}
Configuration
Options:
this.options = {
// Defines what values from state will be saved to the filesystem and restored upon boot
// All files are saved in app/storage/internal/[componentName]
fsState: {
recurrentUpdateLimit: null // null or number. Defines how many milliseconds between updates. This is a safe guard for devices running off of SD cards.
options: {
include: [
{key: "temperature"},
{key: "windSpeed"}
]
}
},
// defines which values to expose to the global object and if they should emit globalChanged events
globalState: {
options: {
include: [
{
key: "temperature",
emit: true,
},
{
key: "windSpeed",
emit: false
}
]
}
},
// specifies which functions to expose and be accessed through 'const { exposedComponentFunctions } = require("passeljs")'
exposeFunctions:{
options: {
include: [
{
key: "doSomething" //key of function. will be automatically bound.
}
]
}
}
}
LifeCycle Events:
componentWillMount(){
// Local and file system state has been initialized for this component, but not all components are ready.
// Not all of global state will be up to date yet.
// It is not advised to setState for properties here if they are exposed global and emit events on change.
}
componentDidMount(){
// All components are ready, global and local state are initialized. Do all of your logic here.
}
Components
const { Components } = require("passeljs")
// All components extend Components.Base and can access all the same functions.
// Has access to all of the above
class Basic extends Components.Base{
}
// Adds a function to received a FileStore class. Built on top of fsjetpack.
// Useful for components that need to persist data but not always have it in memory/state
// All files are saved in app/storage/public/[componentName]
class Backup extends Components.WithStore{
constructor(props){
super(props)
this.componentName = "Backup"
}
componentWillMount(){
class FileStore extends this.getFileStore(){
constructor(props){
super(props)
}
writeTest(fileName, data){
this.directory.write(`${fileName}.json`, data, {
atomic: true
})
}
}
this.fileStore = new FileStore()
}
}
componentDidMount(){
this.fileStore.writeTest("testData", {
text: "This is a WithStore component"
})
}
}
Nested Components
Components can use other components that derive themselves from the same Components.Base
const { Components } = require("passeljs")
class CompOne extends Components.Base{
constructor(props){
super(props)
this.componentName = "CompOne"
this.doSomethingUpHere = this.doSomethingUpHere.bind(this)
}
componentDidMount(){
this.props.doSomethingUpHere() // CompTwo
}
}
class CompTwo extends Components.Base{
constructor(props){
super(props)
this.componentName = "CompTwo"
this.doSomethingUpHere = this.doSomethingUpHere.bind(this)
}
doSomethingUpHere(){
console.log(this.componentName) // CompTwo
}
componentWillMount(){
// initialize components in here otherwise they won't ever be mounted
// Components can be passed props to use and can be accessed with this.props
this.use(CompOne, {
doSomethingUpHere
})
}
}
2.5.2
3 years ago
2.5.1
3 years ago
2.5.0
3 years ago
2.4.4
3 years ago
2.4.30
5 years ago
2.4.29
5 years ago
2.4.28
5 years ago
2.4.26
5 years ago
2.4.24
5 years ago
2.4.23
5 years ago
2.4.22
5 years ago
2.4.21
5 years ago
2.4.20
5 years ago
2.4.19
5 years ago
2.4.18
5 years ago
2.4.17
5 years ago
2.4.16
5 years ago
2.3.16
5 years ago
2.3.15
5 years ago
2.3.14
5 years ago
2.3.11
5 years ago
2.3.10
5 years ago
2.2.10
5 years ago
2.2.9
5 years ago
2.2.8
5 years ago
2.2.7
5 years ago
2.0.7
5 years ago
2.0.4
5 years ago
2.0.3
5 years ago
2.0.0
5 years ago