Extension for Mozaïk that allows to place multiple widgets into same grid cell and switch periodically between them. Despite the preview shown below, it does the switch with smooth transition.
-
Install extension in dashboard
npm install --save mozaik-ext-switch
-
Register extension in dashboard
src/App.jsx
// Import extension import switcher from 'mozaik-ext-switch' Registry.addExtensions({ github, gitlab, time, travis, // Add into extension with name 'switch' switch: switcher, })
-
Rebuild dasbboard:
npm run build-assets
-
Configure widgets in dashboard
config.js
(see usage) -
Done.
Switch between widgets
key | required | description |
---|---|---|
duration |
no | Duration how long to show each widget. Defaults to 8000 |
Create switch.widgets
widget and place widgets within widgets
parameter:
dashboards: [
// First dashboard view
{
columns: 1,
rows: 1,
widgets: [
// 1st row
{
type: 'switch.widgets',
columns: 1, rows: 1,
x: 0, y: 0,
// Duration how long to show each widget
duration: 8000,
// Structure within widgets is same normally
// with widgets. Naturally the size and placement
// comes from switch.widgets
widgets: [
{
type: 'time.clock',
timezone: 'America/Los_Angeles',
info: 'date',
title: 'Los Angeles'
},
{
type: 'weather.weather',
city: 'Helsinki',
country: 'FI',
lang: 'en',
},
{
type: 'time.clock',
info: 'time',
timezone: 'Asia/Tokyo',
title: 'Tokyo'
}
]
}
]
}
]
- First stable release
- No changes since prev version
- Added support for switch transition
- Using opacity instead of display none to fix widget layout issues
- Fixed style regression due the name change
- Renamed project to
mozaik-ext-switch
- Fixed the data fetching by mounting all widgets at once
- Initial release
Module is MIT -licensed