Elektron Tauon Side Panel module

Welcome to the Elektron Tauon Side Panel module.
This module implements Elektron Muon to implement a panel to configure the components.

General Behavior

This module exports 3 classes which leverage a basic side panel on the page based on Office UI Fabric Panel.

Elektron Panel

The ElektronPanel class is the main abstract class implementing the interface IComponentPanel<IComponentConfiguration>;

The main methods to implement are BindConfiguration() and SaveConfiguration(). Use these methods to build/read from the Configuration property of the panel.

Use the Render() method to render the panel HTML elements on the page. Then use the OpenPanel() to open the panel, and ClosePanel() to close it. The ClosePanel() method takes one parameter to specifiy if the page should be reloaded after closing the panel.

Site Configuration Panel

This abstract class leverage the abstract class Elektron Panel to configure anything on the site

Import the class SiteConfigurationPanel from this module: import { SiteConfigurationPanel } from 'elektron-tauon-sidepanel'; And extends your class with this one as follows: export class MyPanel extends SiteConfigurationPanel The Configuration property must implement the IComponentConfiguration interface. Using this implementation, you must implement the Save() method as well to define the behavior when clicking on the "Save" button.

Component Configuration Panel

This abstract class leverage the abstract class Elektron Panel to configure an Elektron component locally on a page by using the IComponentConfiguration interface implementation defined in elektron-muon-configuration and elektron-tauon-dataproperties.

Import the class ComponentConfigurationPanel from this module: import { ComponentConfigurationPanel } from 'elektron-tauon-sidepanel'; And extends your class with this one as follows: export class MyPanel extends ComponentConfigurationPanel The Configuration property must implement the IComponentConfiguration interface. You can extends your class to implements the abstract class EditingPageComponentConfiguration from the elektron-tauon-dataproperties module to edit the elektron webpart properties when in editing mode.

Getting Started

Tools

• latest current version of NodeJs
• We recommend using Visual Studio Code as a lot of settings are pre-configured for it.

Having your environment ready

npm i typescript tslint -g

Installing the dependencies

npm i  

Building

npm run build

Debugging

Run this command from this repo:
npm link
(npm unlink to undo)
Create a project using the generator.
Run this command from the debugging repo:
npm link elektron-tauon-sidepanel
(npm unlink elektron-tauon-sidepanel to undo)

Publishing

Please refer to the following documentation

Continuous integration

Please refer to the following documentation
static analysis url.
No unit testing in place at the moment.

Contributing

Please refer to the following documentation
repo url