Giter Site home page Giter Site logo

polymer-noflo's Introduction

NoFlo Web Components

This repository provides Polymer Web Components for running NoFlo flow-based programs on HTML pages.

Usage

To use the Polymer NoFlo components, you need to include Polymer and NoFlo on your page. The easiest way to do this is to utilize the combined build:

<script src="./browser/polymer-noflo.js"></script>

Once the script is loaded, you can enable Web Components with:

<script>
  require('components-polymer');
</script>

Now the NoFlo components (and other web components) can be used anywhere on the page!

Loading external graphs

The noflo-graph tag supports loading and launching NoFlo graphs loaded from external JSON definition files.

Make the component available on your pages with:

<link rel="import" href="noflo-graph.html">

Then you can use it as a HTML tag:

<noflo-graph src="touch-demo.json" root="/bergie-noflo"></noflo-graph>

Attributes:

  • src provides the URL from where the graph JSON file will be loaded via AJAX
  • root provides the root library from which NoFlo will start loading components

Additionally, inports of the graph will be available as attributes. For example, to send an IIP to the IN port of the ReadFile node, set the value as attribute readfile-in.

Running NoFlo graphs inline

The noflo-fbp tag support running NoFlo graphs from inline FBP language syntax.

Make the component available on your pages with:

<link rel="import" href="noflo-fbp.html">

The you can use it as a HTML tag:

<noflo-fbp root="/bergie-noflo">
  'Hello, world!' -> IN Display(Output)
</noflo-fbp>

Attributes:

  • root provides the root library from which NoFlo will start loading components

Development

You need a checkout of this repository, and the Grunt command-line runner. Grab it with:

$ npm install -g grunt-cli

You also need the NPM build dependencies of this library. Get them with:

$ npm install

Then you're ready build polymer-noflo with:

$ grunt build

The resulting JavaScript library will be placed in the browser directory under the repository.

polymer-noflo's People

Contributors

bergie avatar greenkeeper[bot] avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar

polymer-noflo's Issues

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.