Allow navigating to a specific state from preview mode

[GoogleCodeExporter]

In as much detail as possible, please describe what you would like to see.

1. Create a new exploration with two states (A --> B --> END). We assume that 
the text in state B contains an error.
2. Go to preview mode. Play from A to B.
3. Notice that the text is wrong.

It would be nice to jump to the state I want to edit directly from the preview 
mode. One possibility is for each of the cards (in preview mode) to have a 
top-right dropdown menu that contains the option "Edit State".

Original issue reported on code.google.com by s...@google.com on 24 Mar 2015 at 2:31

[GoogleCodeExporter]

Original comment by s...@google.com on 25 Mar 2015 at 11:05

[GoogleCodeExporter]

Some notes:

  - See extensions/skins/conversation_v1/player.html to see the HTML for the player view. This is reused in editor preview mode; the variable isInPreviewMode will indicate the context.
  - The tricky part here is that the player view needs to work in both 'play mode' and 'editor preview mode', and, in the former, there is no concept of 'jump to the state editor'. I think a good way to handle this is to add a navigate-to-state="..." attr to the <conversation-skin></conversation-skin> tag, so that it becomes <conversation-skin navigate-to-state="navigateToMainTab"><conversation-skin>. Then when the item in the dropdown menu is clicked, the current state name is passed to navigateToMainTab() (which is a function) and is then navigated to. In the player view, navigate-to-state will be undefined. 
    This could be a bit tricky the first time you do it, so it might be worth discussing further in person -- but maybe you can poke around a bit first to get a feel for how Angular directives work!

Original comment by s...@seanlip.org on 25 Mar 2015 at 11:36