can-list-sort
can-list-sort
is a plugin that makes it easy to define and maintain how items are arranged in a [can-list]. To use it,
set a comparator
[can-list::attr attr] on a [can-list]. It can be a String
or Function
.
Overview
Setting a comparator will sort the list immediately and, if your list is being listened to, will automatically sort when any of its items are changed:
var CanList = ;; var cart = title: 'Juice' price: 305 title: 'Butter' price: 350 title: 'Bread' price: 400 ;cart;cart;cart;cart; // -> [Butter, Bread, Juice]
And it will be kept in sorted order when items are pushed, unshifted, or spliced into the [can-list]:
var cart = title: 'Juice' price: 305 title: 'Butter' price: 350 title: 'Bread' price: 400 ;cart;cart;cart;cart; // -> [Juice, Apple, Butter, Bread]
Usage
ES6 use
With StealJS, you can import this module directly in a template that is autorendered:
;
CommonJS use
Use require
to load can-list-sort
and everything else needed to create a template that uses can-list-sort
:
var plugin = ;
AMD use
Configure the can
and jquery
paths and the can-list-sort
package:
<script src="require.js"></script><script> require.config({ paths: { "jquery": "node_modules/jquery/dist/jquery", "can": "node_modules/canjs/dist/amd/can" }, packages: [{ name: 'can-list-sort', location: 'node_modules/can-list-sort/dist/amd', main: 'lib/can-list-sort' }] }); require(["main-amd"], function(){});</script>
Standalone use
Load the global
version of the plugin:
<script src='./node_modules/can-list-sort/dist/global/can-list-sort.js'></script>
Contributing
Making a Build
To make a build of the distributables into dist/
in the cloned repository run
npm install
node build
Running the tests
Tests can run in the browser by opening a webserver and visiting the test.html
page.
Automated tests that run the tests from the command line in Firefox can be run with
npm test