You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
42 lines
1005 B
42 lines
1005 B
// Loads the assets/components into the Rivets.js framework
|
|
export default class Loader {
|
|
constructor({ components }) {
|
|
this.components = components
|
|
this.state = {}
|
|
}
|
|
|
|
// Prepare the Rivets.js framework by loading component definitions
|
|
initialize() {
|
|
for ( const key in this.components ) {
|
|
if ( !this.components.hasOwnProperty(key) ) continue
|
|
const component = this.components[key]
|
|
|
|
// Register the component class with the rivets framework
|
|
rivets.components[component.selector()] = {
|
|
template: () => {
|
|
return component.template()
|
|
},
|
|
|
|
initialize: (el, data) => {
|
|
return new component(el, data)
|
|
}
|
|
}
|
|
}
|
|
|
|
// Load the custom property binders
|
|
this._init_binders()
|
|
}
|
|
|
|
_init_binders() {
|
|
// Binds to the CSS background property
|
|
rivets.binders.background = (el, value) => {
|
|
el.style.background = value;
|
|
}
|
|
}
|
|
|
|
// Bind the Rivets.js application to the specified target
|
|
bind(target) {
|
|
rivets.bind(document.querySelector(target), this.state)
|
|
}
|
|
}
|