Security News
Bun 1.2 Released with 90% Node.js Compatibility and Built-in S3 Object Support
Bun 1.2 enhances its JavaScript runtime with 90% Node.js compatibility, built-in S3 and Postgres support, HTML Imports, and faster, cloud-first performance.
backbone.smartclasses
Advanced tools
While Backbone.ModelBinding (and, I assume, most of the other legitimate model binding plugins) provides the ability to bind data values to view element attributes, it requires three data attributes and a custom function to alter class names in the general case. In fact, it actually requires more markup and more complex JavaScript than simply adding a model listener to the view class. More over, there's no way (in markup) to bind a model attribute to the View's $el at all.
This plugin was conceived for dealing with the case of adding and removing classnames from a View's $el.
backbone.smartclasses
has hard dependencies on lodash and backbone however, it is intended to work as a cocktail mixin. While you can include backbone.smartclasses
without including cocktail
, it's unlikely to have any effect.
In order to run tests in a node-like environment, I've included a forked build of cocktail
as a devDependency, which I'll likely be removing at some point. You'll want to include onsi's original version and, optionally, use browserify if you need to include it in your own node-like environment.
Add the computed hash to a View to automatically add/remove classes:
smartclasses:
<className>:
deps:[]
test: <function>
And invoke the initializer:
Backbone.View.extend({
...
initialize: function() {
this.initComputed();
},
...
});
###Options
Type: Array
Specifies the fields (for models) or events (for collections) induce recomputation of smartclasses.
It is strongly recommend that, for performance reasons, you specify this property for collection-bound views; in most cases, you probably only care about ['add', 'remove']
or [change:<specific-field>]
.
Type: function
The method for determining whether or not class should be added to the view. If omitted and any item in deps
is truthy, the class will be added to the view
The following JS and CSS show how to automatically show and hide a view based on its model's state.
.hidden {
display: none;
}
Backbone.View.extend({
smartclasses: {
hidden: {
deps: [
'firstName',
'lastName',
]
},
test: function() {
return this.has('firstName') && this.has('lastName');
}
},
initialize: function() {
this.initComputed();
}
});
FAQs
Automatically add and remove class names from views.
We found that backbone.smartclasses demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Bun 1.2 enhances its JavaScript runtime with 90% Node.js compatibility, built-in S3 and Postgres support, HTML Imports, and faster, cloud-first performance.
Security News
Biden's executive order pushes for AI-driven cybersecurity, software supply chain transparency, and stronger protections for federal and open source systems.
Security News
Fluent Assertions is facing backlash after dropping the Apache license for a commercial model, leaving users blindsided and questioning contributor rights.