How to Organize Widgets with motorcycle#


Learning Goals#

This is a beginner tutorial on organizing widgets using the motorcycle Jupyter extension. By the end of this tutorial, you will:

  • Understand the different widget layouts supported by motorcycle.

  • Locate and utilize the motorcycle controls.

  • Change widget layouts using motorcycle to fit your preferences in the Roman Research Nexus (RRN).

Table of Contents#

Introduction#

This tutorial familiarizes you with how to use the motorcycle Jupyter extension to manage the layout of your jupyterlab widgets. We will use the jupyterlab-sidecar package to display widgets in dedicated, separate panels inside a jupyterlab workspace. A detailed tutorial on sidecar can be found in the How to Organize Widgets with jupyterlab-sidecar notebook. In this notebook, we use the widgets mast-aladin and jdaviz alongside a custom widget made with the ipywidgets library to demonstrate functionality, though motorcycle can be used to organize many other widgets you might use in your workflow.

Imports#

We will leverage the sidecar package to create dedicated panels inside our jupyterlab workspace, and we will use mast-aladin, jdaviz, and ipywidgets to populate the sidecars with example widgets.

  • sidecar to create sidecars

  • mast-aladin for creating an example widget to organize

  • jdaviz for creating an example widget to organize

  • ipywidgets for creating an example generic widget to organize

from sidecar import Sidecar
from mast_aladin import MastAladin
import jdaviz as jd

from ipywidgets import widgets

Organizing Widgets with motorcycle#

Setup#

We will create 3 different sidecar examples, two with viz and one with generic HTML, to show off the different layouts that can be achieved with motorcycle.

# Create a mast-aladin instance
mast_aladin = MastAladin()

# Create a sidecar with defined anchor
sc = Sidecar(title="mast-aladin Main", anchor="split-right")

# Display the widget within the sidecar
with sc:
    display(mast_aladin)
# Create a sidecar with defined anchor
sc = Sidecar(title="jdaviz Main", anchor="split-bottom", ref=sc)

# Display a jdaviz instance widget within the sidecar
with sc:
    jd.show()
# Create a generic sidecar widget
sc = Sidecar(title='Generic Sidecar Widget', anchor='split-right', ref=sc)

with sc:
    display(
        widgets.HTML(
            "<h2>generic sidecar widget</h2>"
        )
    )

Layout Controls#

The controls for motorcycle are found in the “Layout” menu option at the end of the JupyterLab menu bar (after File, Edit, …). motorcycle supports the following layout options:

  • All Tabs: These commands will move all widgets, including sidecars, viz apps, and notebook tabs.

  • Sidecars: These commands will move all sidecars, including the viz apps and any others that are open in the workspace.

  • Viz apps: These commands will only move instances of jdaviz, mast-aladin, or mast-table.

alt-text

Exercise#

Now that you understand how to use motorcycle, try to recreate the screen layout shown below

alt-text

About this Notebook#

Author: Patrick Custer
Keyword(s): motorcycle, sidecar, mast-aladin, jdaviz
First published: Aug 2026
Last updated: Aug 2026


Top of Page Space Telescope Logo