Palindrom

Library for two-way data binding between local and remote JSON models. It uses JSON-Patch for data updates and Operational Transformation for versioning and data consistency. It operates via HTTP or WebSocket or both.

Implements Server communication.

/**
 * Defines a connection to a remote PATCH server, gives an object that is persistent between browser and server
 */
var palindrom = new Palindrom({remoteUrl: window.location.href});
 
// ...
// use palindrom.obj
palindrom.obj.someProperty = "new value";
// Your change gets propagated automatically to the remote, no glue code needed.

Documentation

Installation

You can install using bower and NPM:

Bower:

bower install Palindrom --save

Then add source to your HTML

<!-- include Palindrom bundle -->
<script src="bower_components/Palindrom/dist/palindrom.js"></script>

See Dependencies section for more details.

NPM:

npm install palindrom --save

Then you can import it ES Modules style:

import { Palindrom } from 'palindrom';
import { PalindromDOM } from 'palindrom';

Note: The NPM package uses an entry point without a default export. Depending on your environment (Node or browser), you should choose one of the two named exports available: Palindrom and PalindromDOM.

GitHub:

You can browse the source code on GitHub or download a ZIP archive from there.

Usage

After DOM is ready, initialize with the constructor:

/**
 * Defines a connection to a remote PATCH server, gives an object that is persistent between browser and server
 */
var palindrom = new Palindrom({remoteUrl: window.location.href});
 
// ..
// use palindrom.obj
palindrom.obj.someProperty = "new value";

• Note 1: Please make sure you pass the correct PATCH server URL.
• Note 2: palindrom.obj is only available after options.onStateReset is called.

Demo

• Example with Polymer's Template Binding and Web Components
• Example with Vue
• Example with React

Changelog

To see the list of recent changes, see Releases.

License

MIT