Tabs now showing.

cms/static/js/speed-editor.js

@@ -49,6 +49,7 @@ function initProblemEditors($editor, $prev) {
     'background': '#fff'
   }).hide();
 
+//    TODO: is this necessary??
   $(simpleEditor.getWrapperElement()).bind('click', setFocus);
   $preview = $prev.find('.problem');
 }

common/lib/xmodule/xmodule/css/problem/edit.scss

@@ -61,4 +61,86 @@
   }
 }
 
+.simple-editor-cheatsheet {
+  position: absolute;
+  top: 0;
+  left: 100%;
+  width: 0;
+  border-radius: 0 3px 3px 0;
+  @include linear-gradient(left, rgba(0, 0, 0, .1), rgba(0, 0, 0, 0) 15px);
+  background-color: #fff;
+  overflow: hidden;
+  @include transition(width .3s);
+
+  &.shown {
+    width: 300px;
+  }
+
+  .cheatsheet-wrapper {
+    width: 240px;
+    padding: 20px 30px;
+  }
+
+  h6 {
+    margin-bottom: 7px;
+    font-size: 15px;
+    font-weight: 700;
+  }
+
+  .row {
+    @include clearfix;
+    padding-bottom: 5px !important;
+    margin-bottom: 10px !important;
+    border-bottom: 1px solid #ddd !important;
+
+    &:last-child {
+      border-bottom: none !important;
+      margin-bottom: 0 !important;
+    }
+  }
+
+  .col {
+    float: left;
+
+    &.sample {
+      width: 60px;
+      margin-right: 30px;
+    }
+  }
+
+  pre {
+    font-size: 12px;
+    line-height: 18px;
+  }
+
+  code {
+    padding: 0;
+    background: none;
+  }
+}
+
+.tiny-link-dialog {
+  position: fixed;
+  top: 40px;
+  left: 50%;
+  z-index: 99999;
+  width: 600px;
+  margin-left: -300px;
+  background: #fff;
+
+  .close-button {
+    @include white-button;
+    position: absolute;
+    top: 0;
+    right: 15px;
+    width: 29px;
+    height: 29px;
+    padding: 0 !important;
+    border-radius: 17px !important;
+    line-height: 29px;
+    text-align: center;
+  }
+}
+
+
 

common/lib/xmodule/xmodule/js/src/problem/edit.coffee

 class @MarkdownEditingDescriptor extends XModule.Descriptor
-  constructor: (@element) ->
-    @xml_editor = CodeMirror.fromTextArea($(".xml-box", @element)[0], {
+  constructor: (element) ->
+#    $body.on('click', '.editor-tabs .tab', @changeEditor)
+    $('.editor-tabs .tab').bind 'click', (event) => @changeEditor(event)
+    @xml_editor = CodeMirror.fromTextArea($(".xml-box", element)[0], {
     mode: "xml"
     lineNumbers: true
     lineWrapping: true
     })
+    @current_editor = @xml_editor
 
-    if $(".markdown-box", @element).length != 0
-      @markdown_editor = CodeMirror.fromTextArea($(".markdown-box", @element)[0], {
+    if $(".markdown-box", element).length != 0
+      @markdown_editor = CodeMirror.fromTextArea($(".markdown-box", element)[0], {
       lineWrapping: true
       mode: null
       onChange: @onMarkdownEditorUpdate
       })
+      @setCurrentEditor(@markdown_editor)
 
-  onMarkdownEditorUpdate: ->
+  onMarkdownEditorUpdate:  ->
     console.log('update')
 
+  changeEditor: (e) ->
+    e.preventDefault();
+    $('.editor-tabs .current').removeClass('current')
+    $(this).addClass('current');
+    if (@current_editor == @xml_editor)
+      @setCurrentEditor(@markdown_editor)
+    else
+      @setCurrentEditor(@xml_editor)
+
+
+#    switch($(this).attr('data-tab')) {
+#    case 'simple':
+#    currentEditor = simpleEditor;
+#    $(simpleEditor.getWrapperElement()).show();
+#    $(xmlEditor.getWrapperElement()).hide();
+#    $(simpleEditor).focus();
+#    onSimpleEditorUpdate();
+#    break;
+#    case 'xml':
+#    currentEditor = xmlEditor;
+#    $(simpleEditor.getWrapperElement()).hide();
+#    $(xmlEditor.getWrapperElement()).show();
+#    $(xmlEditor).focus();
+#    xmlEditor.refresh();
+#    break;
+
+  setCurrentEditor: (editor) ->
+    $(@current_editor.getWrapperElement()).hide()
+    @current_editor = editor
+    $(@current_editor.getWrapperElement()).show()
+    $(@current_editor).focus();
+
   save: ->
+#    TODO: make sure this gets unregistered correctly (changed how registration works)
+    $body.off('click', '.editor-tabs .tab', @changeEditor)
     data: @xml_editor.getValue()