Electron-panel NPM

electron-panel

Manipulate panels in window for Electron.

NOTE

This module use Custom Element v1 which only support in Electron 1.15.x or above version.

Install

npm install --save electron-panel

Run Examples

npm start examples/${name}

Usage

main process

// init panel in main process
const panel = require('electron-panel');
const protocols = require('electron-protocols');

// register a protocol so that the panel can load by it.
protocols.register('app', protocols.basepath(app.getAppPath()));

renderer process

panel.js

module.exports = {
  style: `
    :host {
      .layout-vertical();

      padding: 5px;
      box-sizing: border-box;
    }

    h2 {
      color: #f90;
      text-align: center;
    }
  `,

  template: `
    <h2>Panel</h2>
  `,

  ready () {
    // do something
  },
};

index.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Panel Example</title>
  </head>

  <body>
    <ui-panel-frame id="foobar" src="app://panel.js"></ui-panel-frame>
  </body>
</html>

Documentation

Main Process
- Panel
Renderer Process
- Panel
- Panel Frame

TODO

New Feature Warnning/Error notification at panel-frame.
New Feature Out of date notification at panel-frame, and a reload button for user.
Test main2panel-reply
Test panel2panel-reply
Test panelFrame.close()
Test panel.closeAll()