Have questions? Stuck? Please check our FAQ for some common questions and answers.

ThemeService

ThemeService is an Angular Factory in the Util module with the name theme.js. It provides an API to programmatically get and set the theme (color scheme) and to add theme listeners. To use these functions, see the documentation on injecting Angular services.

Current Themes

The ONOS GUI currently has two themes that can be toggled between by pressing the T key on any view.

The Light Theme on the Topology View. The theme name is 'light'.

The Dark Theme on the Topology View. The theme name is 'dark'.

NameSummary
initInitializes the ThemeService and sets the current theme.
themeGets or sets the current theme.
toggleThemeToggle the current theme to the next theme in the theme list.
addListenerAdd a listener to a theme event.
removeListenerRemove a theme event listener.

Function Descriptions

init

Initializes the ThemeService and sets the current theme. You probably won't have to call this because the ThemeService is initialized in onos.js.

Example UsageArgumentsReturn Value
ts.init();nonenone

theme

Gets or sets the current theme. This function is getter/setter.

Example UsageArgumentsReturn Value
ts.theme(x);

x - undefined or a string of the name of theme you want to set the current theme to

if x is undefined - a string of the name of the current theme

if x is a string - no return value

toggleTheme

Toggle the current theme to the next theme in the theme list. Currently it toggles between the 'light' and 'dark' themes (see above).

Example UsageArgumentsReturn Value
ts.toggleTheme();nonethe current theme that it was toggled to as a string

addListener

Add a listener to a theme event. Currently, the only theme event is "themeChange".

Example UsageArgumentsReturn Value
ts.addListener(callback);

callback - function reference to be executed on a theme event. The function is passed an object containing:

event: 'themeChange',

value: <the current theme as a string>

An object containing:

id: Number of which listener ID this is

cb: callback

error: 'No callback defined' (if there was a problem)

removeListener

Remove a theme event listener.

Example UsageArgumentsReturn Value
ts.removeListener(lsnr);lsnr - the object that was returned from addListenernone, but removes the listener and callback from the themeChange event
  • No labels