Skip to content

pinussilvestrus/postit-js

main
Switch branches/tags

Name already in use

A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?
Code

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
 
 
 
 
 
 
lib
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

postit-js

Netlify Status Build Status

Create post-it brainstorming boards - built with diagram-js.

Screencast

Checkout the Demo or the Experiments Page to get some inspiration.

Features

  • Create resizable Post-its on the Canvas (squared and circled) via
    • Palette
    • Double Click (latest element type will be respected)
  • Change the color of Post-its
  • Create simple Text Boxes on the Canvas
  • Create grouping frame elements on the Canvas
  • Add external image resources on the Canvas

Installation

Install the package to include it into your web application

$ npm install postit-js-core --save

Usage

To get started, create a postit-js instance and render a post-it board into your web application

import 'postit-js-core/assets/postit-js.css';

import PostItModeler from 'postit-js-core/lib/Modeler';

let xml; // my post-it xml 

const modeler = new PostItModeler({
  container: '#canvas',
  keyboard: {
    bindTo: window,
  }
});

modeler.importXML(xml).then(function() {
  console.log('board rendered');
}).catch(function(error) {
  console.error('could not import postit board', err);
});

For using postit-js inside your web application you'll need a source code bundler, e.g. webpack. Checkout the example for getting inspiration.

Development Setup

Spin up the application for development, all strings attached:

$ npm install
$ cd  example
$ npm install
$ npm run dev

Extensions

Since diagram-js and also this project is extendable by design, there exist a couple of great community maintained extensions

License

MIT

Contains parts of (bpmn-io) released under the bpmn.io license.