mmun

Movement between exam pages:

Left	Right	Down	Up
h	l	j	k
[	]
Shift + ←	Shift + →	Shift + ↓	Shift + ↑

Enter marking mode	Next Unmarked

mmun

Add keyboard shortcuts to Ember

• Routes and Views can subscribe to shortcuts via some API to be determined. Fundamentally it will map key sequences (eg. esc, g i, ctrl+x ctrl+c) to actions on that object. The parsing and implementation of the key sequence can be left to an external library. Ember could ship with a basic one, ie. only length one sequences.

• The keyboard shortcuts service would register a listener on the document object (or the ApplicationView, but Firefox has some weird focus behaviour when not using tab indices).

• When a key event is caught, Ember inspects event.target for the nearest containing view (if any) and begins walking up the view tree, until it matches a shortcut on some view. If one matches then the associated action is called and the process stops.

• If no view has a matching shortcut, then Ember checks to see if any global shortcuts are registered by a route.

mmun

Examples of how the controller keywork in templates works

The controller keyword in a template is inherited from the containing template unless it overrides it.

Consider this template for the index route.

{{#each posts}}
  {{controller}}
{{/each}}

mmun

(function() {
  var get = Ember.get, set = Ember.set;

  function findItemInsertionIndex(group, changeMeta, instanceMeta) {
    for (var i = get(group, 'length') - 1; i >= 0; i--) {
      var currentItem = group.objectAt(i),
          currentIndex = instanceMeta.itemGuidToIndex[Ember.guidFor(currentItem)];

      if (currentIndex < changeMeta.index) {
        return i + 1;

mmun

Cm.GradingSidebarView = Em.View.extend Cm.Shortcuts,
  ...
   
  didInsertElement: ->
    @registerShortcuts [
      { keys: ['shift+up', 'k'], action: 'goToPrevExam' }
      { keys: ['shift+down', 'j'], action: 'goToNextExam' }
      { keys: ['shift+left', 'h', '['], action: 'goToPrevQuestion' }
      { keys: ['shift+right', 'l', ']'], action: 'goToNextQuestion' }

mmun

{{yield "header"}}
{{yield}}

mmun

# posts/1/comments/1

Blorgh.CommentsNewRoute = Ember.Route.extend
  model: ->
    post = @modelFor('post')
    @store.createRecord('comment', {post})

  actions:
    save: ->
      route = this

mmun

 <div id='content' {{bind-attr class=':columns showSidebar:twelve:sixteen'}}>

mmun

<h1>Who do you want to know about?</h1>

<p>
  {{view EmberStore.NameField person=person}}
</p>

{{#if person}}
  <h3>
    Here's some info about {{person.first_name}} {{person.last_name}}:
  </h3>

mmun

<x-foo bar="{{baz}}"></x-foo>

// helpers.WEB_COMPONENT(placeholder, tagName, context, args, hash, helpers);

helpers.WEB_COMPONENT(
  placeholder0,
 "x-foo",