When plugins are loaded in Cider the constructor() in the plugin class is passed a PluginEnv object, this object contains:

• app - The Electron app

• store - Electron Store

• utils - Cider utils

• win - The renderer window

• dir - Path to the plugin directory

• dirName - Plugin directory name

To load a front end plugin (typically named index.frontend.js) from index.js PluginEnv.utils.loadJSFrontend(path: string) is used.

Example: PluginEnv.utils.loadJSFrontend(path.join(PluginEnv.dir, "index.frontend.js"))

• getPath(path: string) - Returns path used by Cider by name.

  • srcPath - src/ folder

  • rendererPath - renderer/ folder

  • mainPath - main/ path

  • resourcePath - resources/ path

  • i18nPath - i18n/ path

  • ciderCache - Cider cache path

  • themes - Themes

  • plugins - Plugins

• getLocale(language: string, key: string)

  • Fetches the i18n locale for the given language.

• getStoreValue(key: string)

  • Gets a store value

• getStore()

  • Returns store

• setStoreValue(key: string, value: any)

  • Sets a store value

• getWindow()

  • Gets the renderer window

• loadJSFrontend(path: string)

  • Loads a JavaScript file into the renderer, this is the main method of loading front end plugins.

• playback. - Controls playback

  • .play() - Play

  • .pause() - Pause

  • .playPause() - Toggles playback

  • .next() - Next track in queue

  • .previous() - Previous track in queue

Cider plugins support these methods by default, however more can be made with the use of ipcMain and ipcRenderer

• onReady(win) - (Required) Executes when the back end is ready

• onRendererReady() - Executes when the renderer has finished loading (app.init())

• onPlaybackStateDidChange(attributes) - Executes when playback state changes, passes song attributes

• onNowPlayingItemDidChange(attributes) - Executes when song changes, passes song attributes

• onBeforeQuit - Executes before Cider quits

• CiderFrontAPI.*

• AddMenuEntry(entry: CiderFrontAPI.Objects.MenuEntry) - Add an entry to the Cider menu

• StyleSheets

  • Add(href: string) - Load a .less stylesheet from a URL

Registering a Vue component is done by adding plugin. to the front of the component name. Pages can then be loaded with app.appRoute("plugin/<component name without plugin.>")

Additional resources in the plugins such as images and other files can be accessed with methods like fetch() from ./plugins/:packageName/:file this resolves to http://localhost:{port}/plugins/:packageName/:file

:packageName refers to the name property in package.json for the plugin.

Example:

CiderFrontAPI.StyleSheets.Add("./plugins/:packageName/mystylesheet.less")

:packageName refers to the name property in package.json for the plugin.

Note: CiderAudio requires Advanced Audio Functionality to be enabled in the app settings.

Cider features a custom audio stack, available in the renderer.

• CiderAudio.context - Primary AudioContext

• CiderAudio.source - Audio Source

CiderAudio contains the following nodes:

• CiderAudio.audioNodes.gainNode - Main gain node

• CiderAudio.audioNodes.spatialNode - Used by audio spatialization

• CiderAudio.audioNodes.audioBands - Used by EQ

• CiderAudio.audioNodes.vibrantbassNode - Used to deliver vibrant bass functionality

• CiderAudio.audioNodes.llpw - Used by Cider Adrenaline Processor (CAP)

• CiderAudio.audioNodes.analogWarmth - Used by Analog Warmth

audio.js explained

https://github.com/ciderapp/Cider/blob/develop/src/renderer/audio/audio.js

CiderAudio initializes with CiderAudio.hierarchical_loading() Inside the loading process, all audioNodes are cleared and re-initialized and chained based on what the user has enabled. The designed hierarchy for loading audio functions is as follows:

• h1 item - AudioBand (final output)

• h2 item 1 - AudioBands vibrantbass_h2_1() (vibrant bass node)

• h2 item 2 - llpw_h2_2() (CiderAudio.audioNodes.llpw)

• h2 item 3 - analogWarmth_h2_3() (CiderAudio.audioNodes.analogWarmth)

• Spatial Node is always the last node in the chain

When plugins are loaded in Cider the constructor() in the plugin class is passed a PluginEnv object, this object contains:

• app - The Electron app

• store - Electron Store

• utils - Cider utils

• win - The renderer window

• dir - Path to the plugin directory

• dirName - Plugin directory name

To load a front end plugin (typically named index.frontend.js) from index.js PluginEnv.utils.loadJSFrontend(path: string) is used.

Example: PluginEnv.utils.loadJSFrontend(path.join(PluginEnv.dir, "index.frontend.js"))

• getPath(path: string) - Returns path used by Cider by name.

  • srcPath - src/ folder

  • rendererPath - renderer/ folder

  • mainPath - main/ path

  • resourcePath - resources/ path

  • i18nPath - i18n/ path

  • ciderCache - Cider cache path

  • themes - Themes

  • plugins - Plugins

• getLocale(language: string, key: string)

  • Fetches the i18n locale for the given language.

• getStoreValue(key: string)

  • Gets a store value

• getStore()

  • Returns store

• setStoreValue(key: string, value: any)

  • Sets a store value

• getWindow()

  • Gets the renderer window

• loadJSFrontend(path: string)

  • Loads a JavaScript file into the renderer, this is the main method of loading front end plugins.

• playback. - Controls playback

  • .play() - Play

  • .pause() - Pause

  • .playPause() - Toggles playback

  • .next() - Next track in queue

  • .previous() - Previous track in queue

Cider plugins support these methods by default, however more can be made with the use of ipcMain and ipcRenderer

• onReady(win) - (Required) Executes when the back end is ready

• onRendererReady() - Executes when the renderer has finished loading (app.init())

• onPlaybackStateDidChange(attributes) - Executes when playback state changes, passes song attributes

• onNowPlayingItemDidChange(attributes) - Executes when song changes, passes song attributes

• onBeforeQuit - Executes before Cider quits

• CiderFrontAPI.*

• AddMenuEntry(entry: CiderFrontAPI.Objects.MenuEntry) - Add an entry to the Cider menu

• StyleSheets

  • Add(href: string) - Load a .less stylesheet from a URL

Registering a Vue component is done by adding plugin. to the front of the component name. Pages can then be loaded with app.appRoute("plugin/<component name without plugin.>")

Additional resources in the plugins such as images and other files can be accessed with methods like fetch() from ./plugins/:packageName/:file this resolves to http://localhost:{port}/plugins/:packageName/:file

:packageName refers to the name property in package.json for the plugin.

Example:

CiderFrontAPI.StyleSheets.Add("./plugins/:packageName/mystylesheet.less")

:packageName refers to the name property in package.json for the plugin.

Note: CiderAudio requires Advanced Audio Functionality to be enabled in the app settings.

Cider features a custom audio stack, available in the renderer.

• CiderAudio.context - Primary AudioContext

• CiderAudio.source - Audio Source

CiderAudio contains the following nodes:

• CiderAudio.audioNodes.gainNode - Main gain node

• CiderAudio.audioNodes.spatialNode - Used by audio spatialization

• CiderAudio.audioNodes.audioBands - Used by EQ

• CiderAudio.audioNodes.vibrantbassNode - Used to deliver vibrant bass functionality

• CiderAudio.audioNodes.llpw - Used by Cider Adrenaline Processor (CAP)

• CiderAudio.audioNodes.analogWarmth - Used by Analog Warmth

audio.js explained

https://github.com/ciderapp/Cider/blob/develop/src/renderer/audio/audio.js

CiderAudio initializes with CiderAudio.hierarchical_loading() Inside the loading process, all audioNodes are cleared and re-initialized and chained based on what the user has enabled. The designed hierarchy for loading audio functions is as follows:

• h1 item - AudioBand (final output)

• h2 item 1 - AudioBands vibrantbass_h2_1() (vibrant bass node)

• h2 item 2 - llpw_h2_2() (CiderAudio.audioNodes.llpw)

• h2 item 3 - analogWarmth_h2_3() (CiderAudio.audioNodes.analogWarmth)

• Spatial Node is always the last node in the chain