Giter Club home page Giter Club logo

windowmanagerjsdemo's Introduction

Demonstration of windowmanager module in Web, Electron and OpenFin

Build Status

This is a simple demonstration of the windowmanagerjs module that shows the ability to create draggable windows inside an HTML page regardless of runtime. A single codeset was written that generates interactive windows in any modern browser OR in native desktop applications contained in the Chromium-based OpenFin and Electron runtimes.

The windowmanagerjs repository referenced by this project can be found here:

Eikos Partners windowmanager on GitHub

Eikos Partners windowmanager Documentation

A production-quality implementation of windowmanagerjs complied for all three runtimes and for Windows, macOS, and Linux can be found here:

Eikos Partners Blotter Demonstration

Below is a breakdown of how to execute this project by runtime.

Server

The backend of the is project is provided via node.js. It uses standard npm packages to standup an HTTP and WebSocket server that powers the client interfaces and messaging. After cloning the repository perform an package install:

  npm install

To start the server, simply press F5 in Visual Studio Code or run command line:

  npm start

The server provides all of the HTML and JavaScript content the application will consume. Also, the server provides an installation page which can be reached at http://localhost:5000/install for any of the three runtimes. Or the runtimes can be invoked via command line as explained in the follow sections.

Web Browser

Web Screen Shot Windowmanagerjs supports all modern browsers including Chrome, Firefox, IE, Edge, and Safari. With the node server running, view the application in a browser through the URL http://localhost:5000/.

Electron

Electron Screen Shot

Electron is a very popular open-source runtime based on Google's Chromium project that allows for native desktop applications in Windows, macOS, and Linux.

With the node server running, start the application in Electron with following command line in the root folder:

  npm run electron

Also, to compile an installation package for the current operating system run the command:

  npm run electron-build

More information about the Electron runtime http://electron.atom.io/.

OpenFin

OpenFin Screen Shot

OpenFin is also a Chromium container based on Electron that allows native desktop applications in Windows, macOS and Linux. Besides all standard Electron functionally, OpenFin includes subscription-based support with guaranteed response times, enterprise version management, and cross-language APIs (.Net, Java, etc.).

With the node server running, start the application in OpenFin with following command line in the root folder:

  npm run openfin

More information about the OpenFin runtime and the company can be found at https://openfin.co/.

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.