Add TabsEditingDescriptor for VideoAlpha

Updates comment
Make Model descriptor class property.
Fix tests

cms/templates/widgets/tabs-aggregator.html

@@ -0,0 +1,21 @@
+<%! from django.utils.translation import ugettext as _ %>
+<div class="wrapper-comp-editor" id="editor-tab-${html_id}" data-html_id="${html_id}">
+    <section class="editor-with-tabs">
+     <div class="edit-header">
+        <span class="component-name"></span>
+        <ul class="${'editor-tabs' if (len(tabs) != 1) else 'editor-single-tab-name' }">
+        % for tab in tabs:
+            <li class="inner_tab_wrap"><a href="#tab-${html_id}-${loop.index}" class="tab ${'current' if tab.get('current', False) else ''}">${_(tab['name'])}</a></li>
+        % endfor
+        </ul>
+      </div>
+      <div class="${'tabs-wrapper' if (len(tabs) != 1) else 'editor-single-tab' }">
+       % for tab in tabs:
+        <div class="component-tab ${'is-inactive' if not tab.get('current', False) else ''}" id="tab-${html_id}-${loop.index}" >
+            <%include file="${tab['template']}" args="tabName=tab['name']"/>
+        </div>
+        % endfor
+      </div>
+    </section>
+</div>
+

cms/templates/widgets/tabs/metadata-edit-tab.html

@@ -0,0 +1,24 @@
+<%namespace name='static' file='../../static_content.html'/>
+<%
+  import json
+%>
+
+## js templates
+<script id="metadata-editor-tpl" type="text/template">
+    <%static:include path="js/metadata-editor.underscore" />
+</script>
+
+<script id="metadata-number-entry" type="text/template">
+    <%static:include path="js/metadata-number-entry.underscore" />
+</script>
+
+<script id="metadata-string-entry" type="text/template">
+    <%static:include path="js/metadata-string-entry.underscore" />
+</script>
+
+<script id="metadata-option-entry" type="text/template">
+    <%static:include path="js/metadata-option-entry.underscore" />
+</script>
+
+<div class="wrapper-comp-settings metadata_edit" id="settings-tab" data-metadata='${json.dumps(editable_metadata_fields) | h}'/>
+

cms/templates/widgets/videoalpha/codemirror-edit.html

@@ -0,0 +1,33 @@
+<%! from django.utils.translation import ugettext as _ %>
+<%page args="tabName"/>
+<div>
+  <textarea id="xml-${html_id}" class="edit-box">${data | h}</textarea>
+</div>
+
+<script type='text/javascript'>
+  $(document).ready(function(){
+      ## Init CodeMirror editor
+      var el = $("#xml-${html_id}"),
+            xml_editor = CodeMirror.fromTextArea(el.get(0), {
+              mode: "application/xml",
+              lineNumbers: true,
+              lineWrapping: true
+            });
+
+      TabsEditingDescriptor.Model.addModelUpdate(
+        '${html_id}',
+        '${tabName}',
+        function()  { return xml_editor.getValue(); })
+
+      TabsEditingDescriptor.Model.addOnSwitch(
+        '${html_id}',
+        '${tabName}',
+        function(){
+            ## CodeMirror should get focus when tab is active
+            xml_editor.refresh();
+            xml_editor.focus();
+        }
+      )
+  });
+</script>
+