10. Getting started using just the keyboard

In this paragraph we’ll retrace the steps in the first chapters of this tutorial, just using the keyboard. We’ll go through things a little more quickly, not explaining concepts but focussing on controlling the user interface.

10.1. Download and install

  • After opening https://mycontexts.com, move to the 'Create account' tab if necessary by using the tab key.

  • Then tab into the radio controls.

  • Select the first option by pressing space.

  • Move to the user name field with tab.

  • Enter a username.

  • Press enter.

Warning
There is an issue with the radio controls: see Issue #2.

10.2. The System context

  • Tab onto the Home icon on the menu. Press space to open the System context.

  • Tab to the set of tabs that appears (it will take some key presses). Use the right and left arrow keys to successively show all tabs and stay with the User tab.

  • Tab into the FirstName field and enter your first name.

  • Leave the field by pressing Tab. Notice that the value you’ve typed shows up in the card on the menu bar below the fields.

  • Enter your last name. Press Enter to commit the value.

Just for practice: * use shift+tab to move into the first name field. * Type "not me" and then press escape. Changes to a field that have not yet been committed can be discarded in this way.

10.3. Notifications

  • Tab to the bell-shaped icon in the MyContexts menu (the Notificatons icon).

  • Press space to allow notifications. The browser shows a dialog.

  • Tab to the "Allow" button and press space.

Notifications are now allowed. To actually see them:

  • (shift) tab to the icon left of the Notifications icon (it appears as a dotted line with an arrow pointing downward).

  • Press space. A new table appears below the form: it will show notifications when they arrive.

10.4. Add a model

  • Tab your way into the tab "Manage models".

  • Tab to the "Table for the role Modellen" that this context form shows.

  • Use the down arrow key to move to the row "Simple Chat" (make sure that the first column is selected; this will be so when the cell appears colored).

  • Now copy the card representing Simple Chat onto the clipboard, by simultaneously pressing ctrl and c. Notice that

  • A smaller version of the card appears in the menu bar;

  • After a few seconds, a message appears saying: "model:SimpleChat added!".

10.5. Simple Chat

Now you will do a few things with the model Simple Chat, to practice role card manipulation using the keyboard only.

  • Using the shift+tab key combination, select the tab "Start contexts" and press enter to show the tab’s contents.

  • Using the tab key, move to the "Table for the role IndexedContexts".

  • Using the arrow keys, select the card "My Chats".

  • Press the key combination shift+space to open the context represented by that card.

The screen now shows the context form for "My Chats".

10.6. Create a context and name it

  • Press tab until you’ve selected the + icon in the toolbar below the "Table for the role Chats". Notice that it has a downward triangle next to it, signalling there is a menu hidden under the icon.

  • Press enter to show that menu.

  • Press the down arrow key to select the first and only item ("model:SimpleChat$Chat").

  • Press space to commit that choice. In the table above the toolbar, a new row appears with a blank card.

You have now created an instance of the context type "Chat". * Press the shift+tab combination to move into the table, landing on the first row. * Press the key combination shift+space to open the context represented by that card. The screen content is replaced by the context form for a Chat. * Press tab to move into the title field (with the label "Change the title" in front of it). * Enter enter the text "My first chat!".

10.6.1. Remove a context

In the previous paragraph you created a new Chat context, titled "My first chat!". Assuming that context is still on screen, now move back to the "My Chats" context and remove it:

  • press the key combination that instructs your browser to move one page backwards in history (under macOS, in Chrome this is: cmd+[).

  • Press tab until you’ve selected the card that reads "My first chat!".

  • Press the delete key. A dialog appears.

  • Tab your way to the "Yes" button and press space.

The table row disappears and a message appears saying "Chat ' My first chat! ' has been removed."

10.6.2. Remove the filler of a role

  • Create a new instance of the context Chat, following the procedure above (you don’t have to open it or name it).

  • Press the key combination ctrl+c. The card is copied onto the clipboard. Because you had not entered a title, it is shown with the stand-in text "No title".

  • (shift) tab your way onto the (un)Chain icon in the toolbar at the top of the screen.

  • Press space. A dialog appears.

It turns out that you cannot remove the filler of this role. Tab your way to the "Close" button and press space. For good measures, press escape to clear the clipboard.

model:SimpleChat does not allow you to remove the external role of a Chat context instance, from the Chats role instance that represents it in the context "My Chats". Other roles may be modelled such that you are allowed to remove its filler.

Note
That a context is represented by a role and that this role can be used to fill other roles may appear strange to you now. It is the basic mechanism by which contexts form a graph; by doing you will build an intuition.

10.6.3. Create and fill a role

  • Move to the system context (e.g. by selecting the Home icon and pressing space).

  • Tab your way into the User tab and show it on screen.

  • Tab to the card that represents the user (i.e. you!), on the toolbar below the form.

  • Copy it onto the clipboard (ctrl+v).

  • Open the context "My Chats".

  • Open a Chat instance (create one if necessary).

  • Tab to the role dropzone below the text "This chat’s partner".

  • Press space. The screen changes.

What you now see is a custom form (i.e. it was created by hand). It shows the chat’s title and two text fields. The partners in the chat can enter text in those fields; it will be sent to and fro between them. However, the situation at hand is atypical in the sense that both partners are you! This is because, in this part of the tutorial, we do not assume you are already connected to other users.

10.6.4. Open a context in a new browser tab

  • Move to the "My Chats" context (if you continue from the paragraph above, just press key combination that instructs your browser to move one page back in history).

  • Select an instance of Chat in the "Table for the role Chats".

  • Press the key combination shift+alt+space. A new browser tab opens. It shows the context form for the Chat instance.

10.6.5. Move around in a table and select a row

  • Move to the System context (e.g. with the Home icon).

  • Show the "Manage models" tab.

  • Tab into the "Table for the role Modellen".

  • Use the up and down arrow keys to move from row to row.

  • Use the right arrow key to select a cell in the column "Description". Notice that the card in the column "Name" no longer has a background color.

  • Press the shift+space combination to select the current row; its card will again show the background color.

10.6.6. Edit the text of a card in a table

The contexts you’ve seen so far has a few roles that can be instantiated multiple times. These will show up as tables in their contexts' form, where each role instance is represented by a row, having a card to manipulate the role instance. However, you are not allowed to edit any of the card texts in the tables you have seen up to now. There is, however, one table whose cards you may edit. In this paragraph you’ll explore how to do so.

  • Move to the System context.

  • Show the SystemCaches tab on screen.

  • Move to the card in the toolbar at the bottom of the form. It represents a context.

  • Use shift+space to open it. A context form showing a single table appears on screen.

  • Move to a row somewhere in that table; make sure the row is selected (i.e. its card in the Name column has a background color).

You are now in a position to edit the text on this card.

  • Press enter. The background color disappears and the cell is now displaying a text field with a cursor inside.

  • Add some text.

  • Press escape. The text you’ve entered disappears; the role card is shown as selected again. You’ve dismissed your change before committing.

  • Press enter again to edit the text.

  • Add some text.

  • Press enter to commit those changes. Now the card is shown as selected again, but this time your changes are still visible.

10.6.7. Things missing in this tutorial

You have now met all user interface interaction with the keyboard that are specific to MyContexts, except one: to fill a role with another. In the models that are available to you right now, you have no opportunity to do so. However, here is how it would work:

  • select a card (representing the filler role) and copy it to the clipboard.

  • Select another card (representing the filled role).

  • Press the key combination ctrl+v to fill the filled role with the filler.

Note
A model most likely contains restrictions on role fillers . If the filler you’ve selected does not fit the filled role (candidate), your action is not carried through and a message is shown saying so.