[Doc] Add menu example to tutorials section

[laurensvalk]

This would make a good example on the tutorials page:

---

Hello. I'm new here, so hope this is the right forum to ask this question. I understand that for the Spike Prime using the lego supplied app you can store multipel programs on the hub (slots 0 - 19) and then use the hub to switch between programs. Can something similar be done for pybricks? i.e. can you save different pybricks programs on different slots?

Originally posted by @mrinalraghupathi in https://gitter.im/pybricks/community?at=639c0b6b0c89e71a337faa88

---

Good question! Yes, though for now you can do it with your own menu program. It's slightly more work, but on the bright side, you can make the menu do exactly what you want.

Let's say I am making an FLL program with three missions. Let's say these are my programs:

mission_drive.py:

from pybricks.tools import wait

print("Let's do the driving mission.")
wait(1000)
print("Driving is done!")

mission_line.py

from pybricks.hubs import PrimeHub
from pybricks.parameters import Color
from pybricks.tools import wait

hub = PrimeHub()

print("Let's do the line following mission...")

for c in (Color.RED, Color.GREEN, Color.MAGENTA):

    print("I saw", c)
    hub.light.on(c)
    wait(1000)

mission_fly.py

from pybricks.tools import wait

print("Let's do the flying mission.")
wait(1000)
print("I believe I can fly!")

You can try all of these first as independent programs if you want.

Then, you can make a menu like this:

menu.py

from pybricks.hubs import PrimeHub
from pybricks.parameters import Button, Color, Direction, Port, Stop
from pybricks.tools import wait

# Let's offer these menu options. You can add as many as you like.
menu_options = ("D", "L", "F")

# Normally, the center button stops the program. But we want to use the
# center button for our menu. So we can disable the stop button.
hub = PrimeHub()
hub.system.set_stop_button(None)

menu_index = 0

while True:

    hub.display.char(menu_options[menu_index])

    # Wait for any button.
    pressed = ()
    while not pressed:
        pressed = hub.buttons.pressed()
        wait(10)
    
    # Wait for the button to be released.
    while hub.buttons.pressed():
        wait(10)

    # Now check which button was pressed.
    if Button.CENTER in pressed:
        # Center button, so the menu is done!
        break
    elif Button.LEFT in pressed:
        # Left button, so decrement menu menu_index.
        menu_index = (menu_index + 1) % len(menu_options)
    elif Button.RIGHT in pressed:
        # Right button, so increment menu menu_index.
        menu_index = (menu_index - 1) % len(menu_options)

# Now we want to use the Center button as the stop button again.
hub.system.set_stop_button(Button.CENTER)

# Based on the selection, choose a program.
selected = menu_options[menu_index]
if selected == "D":
    import mission_drive
elif selected == "L":
    import mission_line
elif selected == "F":
    import mission_fly

As you can see, the menu allows you to pick a letter with the button. Then, based on the letter, you import the desired program in order to run it.

I used letters here, but you can could use numbers (0--99), images, sounds, or whatever you like.

Make sure you run menu.py as the last program. This will re-upload the menu along with each of the missions.

Originally posted by @laurensvalk in https://gitter.im/pybricks/community?at=639c26193daaa326ba88a9dc