Giter VIP home page Giter VIP logo

wams-example's Introduction

wams-example

A quick demo of how WAMS would be used if we made it a library instead of a framework.

To run

node index.js

About

This uses the easier-integration branch of the WAMS repo, which includes changes to support this.

This demonstrates how, with a few changes, we could support integrating WAMS into other applications, by featuring a web page that has the WAMS canvas as just another element in the page, in an application that has defined its own HTML and CSS files.

  • The server and the static files are provided by this application instead of WAMS.
  • The canvas does not take up the whole page, but rather just whatever space this application wants it to take up.
    • This would need more work to make sure that coordinates are appropriately transformed in all cases into canvas-relative coordinates before being sent to the server.

With a bit more work, we can also make the client side more flexible. We could allow users to import the WAMS client code into their client scripts, decide for themselves when to instantiate WAMS, when to connect/disconnect, etc, and perhaps even manually send model change requests to the server.

Demo app details

  • Static files are defined under dist/.
  • The WAMS client script is served directly from the package in node_modules.

How the demo was created

mkdir demo && cd demo
npm init
npm install mvanderkamp/wams#easier-integration

Then I ported over the polygons example and the static files.

wams-example's People

Contributors

mvanderkamp avatar

Watchers

 avatar

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.