From f99951eee0213494fd242de836c0ae9c2190f777 Mon Sep 17 00:00:00 2001
From: Vasyl Nakvasiuk <vaxxxa@gmail.com>
Date: Fri, 14 Jun 2013 15:35:22 +0300
Subject: [PATCH 01/30] import subtitles into studio: add python side
 functionality

---
 cms/djangoapps/contentstore/utils.py      | 164 +++++++++++++++++++++-
 cms/djangoapps/contentstore/views/item.py |  71 +++++++++-
 cms/urls.py                               |   1 +
 3 files changed, 230 insertions(+), 6 deletions(-)

diff --git a/cms/djangoapps/contentstore/utils.py b/cms/djangoapps/contentstore/utils.py
index c9c40ab95dac..f66b45c614d3 100644
--- a/cms/djangoapps/contentstore/utils.py
+++ b/cms/djangoapps/contentstore/utils.py
@@ -1,11 +1,28 @@
+"""Helpers functions."""
+
+#pylint: disable=E1103
+
+from __future__ import division
+
+import copy
+import logging
+import re
+import json
+from functools import wraps
+import HTMLParser
+
+import requests
+from lxml import etree
 from django.conf import settings
+from django.core.urlresolvers import reverse
+
+from cache_toolbox.core import del_cached_content
+from django_comment_client.utils import JsonResponse
+from xmodule.contentstore.content import StaticContent
+from xmodule.contentstore.django import contentstore
 from xmodule.modulestore import Location
 from xmodule.modulestore.django import modulestore
 from xmodule.modulestore.exceptions import ItemNotFoundError
-from django.core.urlresolvers import reverse
-import copy
-import logging
-import re
 from xmodule.modulestore.draft import DIRECT_ONLY_CATEGORIES
 
 log = logging.getLogger(__name__)
@@ -255,3 +272,142 @@ def remove_extra_panel_tab(tab_type, course):
         course_tabs = [ct for ct in course_tabs if ct != tab_panel]
         changed = True
     return changed, course_tabs
+
+
+def return_ajax_status(view_function):
+    """Except, that view function return True/False, and convert
+    response to JSON HTTP response:
+        {"success": true} or {"success": false}
+    """
+    @wraps(view_function)
+    def new_view_function(request, *args, **kwargs):
+        """New view functions for decorator result."""
+        result = view_function(request, *args, **kwargs)
+        if isinstance(result, tuple):
+            status = result[0]
+            response_data = result[1]
+        else:
+            status = result
+            response_data = {}
+        response_data.update({'success': status})
+        return JsonResponse(response_data)
+    return new_view_function
+
+
+def generate_subs(speed, source_speed, source_subs):
+    """Generate and return subtitles dictionary for speed equal to
+    `speed` value, using `source_speed` and `source_subs`."""
+    if speed == source_speed:
+        return source_subs
+
+    coefficient = speed / source_speed
+    subs = {
+        'start': [
+            int(round(timestamp * coefficient)) for
+            timestamp in source_subs['start']
+        ],
+        'end': [
+            int(round(timestamp * coefficient)) for
+            timestamp in source_subs['end']
+        ],
+        'text': source_subs['text']}
+    return subs
+
+
+def save_subs_to_store(subs, subs_id, item):
+    """Save subtitles into `StaticContent`."""
+    filedata = json.dumps(subs, indent=2)
+    mime_type = 'application/json'
+    filename = 'subs_{0}.srt.sjson'.format(subs_id)
+
+    content_location = StaticContent.compute_location(
+        item.location.org, item.location.course, filename)
+    content = StaticContent(content_location, filename, mime_type, filedata)
+    contentstore().save(content)
+    del_cached_content(content_location)
+    return content_location
+
+
+def download_youtube_subs(youtube_subs, item):
+    """Download subtitles from Youtube using `youtube_ids`, and
+    save them to assets for `item` module."""
+    html_parser = HTMLParser.HTMLParser()
+    status_dict = {}
+
+    # Iterate from lowest to highest speed and try to do download subtitles
+    # from the Youtube service.
+    for speed, youtube_id in sorted(youtube_subs.iteritems()):
+        data = requests.get(
+            "http://video.google.com/timedtext",
+            params={'lang': 'en', 'v': youtube_id})
+
+        if data.status_code != 200 or not data.text:
+            status_dict.update({speed: False})
+            log.error("Can't recieved correct subtitles from Youtube.")
+            continue
+
+        sub_starts = []
+        sub_ends = []
+        sub_texts = []
+
+        xmltree = etree.fromstring(str(data.text))
+        for element in xmltree:
+            if element.tag == "text":
+                start = float(element.get("start"))
+                duration = float(element.get("dur"))
+                text = element.text
+                end = start + duration
+
+                if text:
+                    # Start and end are an int representing the
+                    # millisecond timestamp.
+                    sub_starts.append(int(start * 1000))
+                    sub_ends.append(int((end + 0.0001) * 1000))
+                    sub_texts.append(
+                        html_parser.unescape(text.replace('\n', ' ')))
+
+        available_speed = speed
+        subs = {
+            'start': sub_starts,
+            'end': sub_ends,
+            'text': sub_texts}
+
+        save_subs_to_store(subs, youtube_id, item)
+
+        log.info(
+            """Subtitles for Youtube ID {0} (speed {1})
+            are downloaded from Youtube and
+            saved.""".format(youtube_id, speed)
+        )
+
+        status_dict.update({speed: True})
+
+    if not any(status_dict.itervalues()):
+        log.error("Can't find any subtitles on the Youtube service.")
+        return False
+
+    # When we exit from the previous loop, `available_speed` and `subs`
+    # are the subtitles data with the highest speed available on the
+    # Youtube service. We use the highest speed as main speed for the
+    # generation other subtitles, cause during calculation timestamps
+    # for lower speeds we just use multiplication istead of division.
+
+    # Generate subtitles for missed speeds.
+    for speed, status in status_dict.iteritems():
+        if not status:
+            save_subs_to_store(
+                generate_subs(speed, available_speed, subs),
+                youtube_subs[speed],
+                item)
+
+            log.info(
+                """Subtitles for Youtube ID {0} (speed {1})
+                are generated from Youtube ID {2} (speed {3}) and
+                saved.""".format(
+                youtube_subs[speed],
+                speed,
+                youtube_subs[available_speed],
+                available_speed)
+            )
+
+    return True
diff --git a/cms/djangoapps/contentstore/views/item.py b/cms/djangoapps/contentstore/views/item.py
index abc5f48564e6..1fc5837752ea 100644
--- a/cms/djangoapps/contentstore/views/item.py
+++ b/cms/djangoapps/contentstore/views/item.py
@@ -1,5 +1,9 @@
+"""Views for items (modules)."""
+
 import json
+import logging
 from uuid import uuid4
+from lxml import etree
 
 from django.core.exceptions import PermissionDenied
 from django.http import HttpResponse
@@ -8,13 +12,16 @@
 from xmodule.modulestore import Location
 from xmodule.modulestore.django import modulestore
 from xmodule.modulestore.inheritance import own_metadata
+from xmodule.modulestore.exceptions import ItemNotFoundError, InvalidLocationError
 
 from util.json_request import expect_json
-from ..utils import get_modulestore
+from ..utils import get_modulestore, download_youtube_subs, return_ajax_status
 from .access import has_access
 from .requests import _xmodule_recurse
 
-__all__ = ['save_item', 'clone_item', 'delete_item']
+__all__ = ['save_item', 'clone_item', 'delete_item', 'import_subtitles']
+
+log = logging.getLogger(__name__)
 
 # cdodge: these are categories which should not be parented, they are detached from the hierarchy
 DETACHED_CATEGORIES = ['about', 'static_tab', 'course_info']
@@ -23,6 +30,7 @@
 @login_required
 @expect_json
 def save_item(request):
+    """View saving items."""
     item_location = request.POST['id']
 
     # check permissions for this user within this course
@@ -71,9 +79,67 @@ def save_item(request):
     return HttpResponse()
 
 
+@login_required
+@expect_json
+@return_ajax_status
+def import_subtitles(request):
+    """Try to import subtitles from Youtube for current modules."""
+
+    # This view return True/False, cause we use `return_ajax_status`
+    # view decorator.
+
+    item_location = request.POST.get('id')
+    if not item_location:
+        log.error('POST data without "id" property.')
+        return False
+
+    try:
+        item = modulestore().get_item(item_location)
+    except (ItemNotFoundError, InvalidLocationError):
+        log.error("Can't find item by location.")
+        return False
+
+    # Check permissions for this user within this course.
+    if not has_access(request.user, item_location):
+        raise PermissionDenied()
+
+    if item.category != 'videoalpha':
+        log.error('Subtitles are supported only for videoalpha" modules.')
+        return False
+
+    try:
+        xmltree = etree.fromstring(item.data)
+    except etree.XMLSyntaxError:
+        log.error("Can't parse source XML.")
+        return False
+
+    youtube = xmltree.get('youtube')
+    if not youtube:
+        log.error('Missing or blank "youtube" attribute.')
+        return False
+
+    try:
+        youtube_subs = dict([
+            (float(i.split(':')[0]), i.split(':')[1])
+            for i in youtube.split(',')
+        ])
+    except (IndexError, ValueError):
+        # Get `IndexError` if after splitting by ':' we have one item
+        # (missing ':' in the "youtube" attribute value).
+        # Get `ValueError` when after splitting by ':' key can't convert
+        # to float.
+        log.error('Bad "youtube" attribute.')
+        return False
+
+    status = download_youtube_subs(youtube_subs, item)
+
+    return status
+
+
 @login_required
 @expect_json
 def clone_item(request):
+    """View for cloning items."""
     parent_location = Location(request.POST['parent_location'])
     template = Location(request.POST['template'])
 
@@ -102,6 +168,7 @@ def clone_item(request):
 @login_required
 @expect_json
 def delete_item(request):
+    """View for removing items."""
     item_location = request.POST['id']
     item_location = Location(item_location)
 
diff --git a/cms/urls.py b/cms/urls.py
index d04c31116132..eeb2ebf898c8 100644
--- a/cms/urls.py
+++ b/cms/urls.py
@@ -23,6 +23,7 @@
     url(r'^unpublish_unit$', 'contentstore.views.unpublish_unit', name='unpublish_unit'),
     url(r'^create_new_course', 'contentstore.views.create_new_course', name='create_new_course'),
     url(r'^reorder_static_tabs', 'contentstore.views.reorder_static_tabs', name='reorder_static_tabs'),
+    url(r'^import_subtitles$', 'contentstore.views.import_subtitles', name='import_subtitles'),
 
     url(r'^(?P<org>[^/]+)/(?P<course>[^/]+)/course/(?P<name>[^/]+)$',
         'contentstore.views.course_index', name='course_index'),

From 5feea5191299573435d86447e483e1c05bf2f558 Mon Sep 17 00:00:00 2001
From: Vasyl Nakvasiuk <vaxxxa@gmail.com>
Date: Tue, 18 Jun 2013 12:58:02 +0300
Subject: [PATCH 02/30] import subtitles into studio: add python integration
 tests

---
 .../tests/test_course_settings.py             |   4 +-
 .../contentstore/tests/test_item.py           | 182 +++++++++++++++++-
 2 files changed, 182 insertions(+), 4 deletions(-)

diff --git a/cms/djangoapps/contentstore/tests/test_course_settings.py b/cms/djangoapps/contentstore/tests/test_course_settings.py
index 40ec2ed3c734..8e764d5a17cd 100644
--- a/cms/djangoapps/contentstore/tests/test_course_settings.py
+++ b/cms/djangoapps/contentstore/tests/test_course_settings.py
@@ -54,8 +54,8 @@ def setUp(self):
         self.client = Client()
         self.client.login(username=uname, password=password)
 
-        course = CourseFactory.create(template='i4x://edx/templates/course/Empty', org='MITx', number='999', display_name='Robot Super Course')
-        self.course_location = course.location
+        self.course = CourseFactory.create(template='i4x://edx/templates/course/Empty', org='MITx', number='999', display_name='Robot Super Course')
+        self.course_location = self.course.location
 
 
 class CourseDetailsTestCase(CourseTestCase):
diff --git a/cms/djangoapps/contentstore/tests/test_item.py b/cms/djangoapps/contentstore/tests/test_item.py
index 1831a5769a61..bc1638792283 100644
--- a/cms/djangoapps/contentstore/tests/test_item.py
+++ b/cms/djangoapps/contentstore/tests/test_item.py
@@ -1,15 +1,25 @@
+"""Tests for items views."""
+import json
+
+from lxml import etree
+from django.core.urlresolvers import reverse
+
 from contentstore.tests.test_course_settings import CourseTestCase
 from xmodule.modulestore.tests.factories import CourseFactory
-from django.core.urlresolvers import reverse
+from xmodule.modulestore.django import modulestore
+from xmodule.contentstore.django import contentstore
+from xmodule.contentstore.content import StaticContent
+from xmodule.exceptions import NotFoundError
 
 
 class DeleteItem(CourseTestCase):
+    """Tests for '/delete_item' url."""
     def setUp(self):
         """ Creates the test course with a static page in it. """
         super(DeleteItem, self).setUp()
         self.course = CourseFactory.create(org='mitX', number='333', display_name='Dummy Course')
 
-    def testDeleteStaticPage(self):
+    def test_delete_static_page(self):
         # Add static tab
         data = {
             'parent_location': 'i4x://mitX/333/course/Dummy_Course',
@@ -24,5 +34,173 @@ def testDeleteStaticPage(self):
         self.assertEqual(resp.status_code, 200)
 
 
+class BaseSubtitles(CourseTestCase):
+    """Base test class for subtitles tests."""
+
+    org = 'MITx'
+    number = '999'
+
+    def clear_subs_content(self):
+        """Remove, if subtitles content exists."""
+        for youtube_id in self.get_youtube_ids().values():
+            filename = 'subs_{0}.srt.sjson'.format(youtube_id)
+            content_location = StaticContent.compute_location(
+                self.org, self.number, filename)
+            try:
+                content = contentstore().find(content_location)
+                contentstore().delete(content.get_id())
+            except NotFoundError:
+                pass
+
+    def setUp(self):
+        """Create initial data."""
+        super(BaseSubtitles, self).setUp()
+
+        # Add videoalpha module
+        data = {
+            'parent_location': str(self.course_location),
+            'template': 'i4x://edx/templates/videoalpha/Video_Alpha'
+        }
+        resp = self.client.post(reverse('clone_item'), data)
+        self.item_location = json.loads(resp.content).get('id')
+        self.assertEqual(resp.status_code, 200)
+
+        # hI10vDNYz4M - valid Youtube ID with subtitles.
+        # JMD_ifUUfsU, AKqURZnYqpk, DYpADpL7jAY - valid Youtube IDs
+        # without subtitles.
+        data = '<videoalpha youtube="0.75:JMD_ifUUfsU,1.0:hI10vDNYz4M,1.25:AKqURZnYqpk,1.50:DYpADpL7jAY" />'
+        modulestore().update_item(self.item_location, data)
+
+        self.item = modulestore().get_item(self.item_location)
+
+        # Remove all subtitles for current module.
+        self.clear_subs_content()
+
+    def get_youtube_ids(self):
+        """Return youtube speeds and ids."""
+        xmltree = etree.fromstring(self.item.data)
+        youtube = xmltree.get('youtube')
+        return dict([
+            (float(i.split(':')[0]), i.split(':')[1])
+            for i in youtube.split(',')
+        ])
+
+
+class ImportSubtitles(BaseSubtitles):
+    """Tests for '/import_subtitles' url."""
+
+    def test_success_videoalpha_module_subs_importing(self):
+        # Import subtitles.
+        resp = self.client.post(
+            reverse('import_subtitles'), {'id': self.item_location})
+
+        self.assertEqual(resp.status_code, 200)
+        self.assertTrue(json.loads(resp.content).get('success'))
+
+        # Check assets status after importing subtitles.
+        for youtube_id in self.get_youtube_ids().values():
+            filename = 'subs_{0}.srt.sjson'.format(youtube_id)
+            content_location = StaticContent.compute_location(
+                self.org, self.number, filename)
+            self.assertTrue(contentstore().find(content_location))
+
+    def test_fail_data_without_id(self):
+        resp = self.client.post(
+            reverse('import_subtitles'), {})
+
+        self.assertEqual(resp.status_code, 200)
+        self.assertFalse(json.loads(resp.content).get('success'))
+
+    def test_fail_data_with_bad_location(self):
+        # Test for raising `InvalidLocationError` exception.
+        resp = self.client.post(
+            reverse('import_subtitles'), {'id': 'BAD_LOCATION'})
+
+        self.assertEqual(resp.status_code, 200)
+        self.assertFalse(json.loads(resp.content).get('success'))
+
+        # Test for raising `ItemNotFoundError` exception.
+        resp = self.client.post(
+            reverse('import_subtitles'),
+            {'id': '{0}_{1}'.format(self.item_location, 'BAD_LOCATION')}
+        )
+
+        self.assertEqual(resp.status_code, 200)
+        self.assertFalse(json.loads(resp.content).get('success'))
+
+    def test_fail_for_non_videoalpha_module(self):
+        # Video module: setup
+        data = {
+            'parent_location': str(self.course_location),
+            'template': 'i4x://edx/templates/video/default'
+        }
+        resp = self.client.post(reverse('clone_item'), data)
+        item_location = json.loads(resp.content).get('id')
+        data = '<video youtube="0.75:JMD_ifUUfsU,1.0:hI10vDNYz4M,1.25:AKqURZnYqpk,1.50:DYpADpL7jAY" />'
+        modulestore().update_item(item_location, data)
+
+        # Video module: testing
+        resp = self.client.post(
+            reverse('import_subtitles'), {'id': item_location})
+        self.assertEqual(resp.status_code, 200)
+        self.assertFalse(json.loads(resp.content).get('success'))
+
+    def test_fail_bad_xml(self):
+        data = '<<<videoalpha youtube="0.75:JMD_ifUUfsU,1.25:AKqURZnYqpk,1.50:DYpADpL7jAY" />'
+        modulestore().update_item(self.item_location, data)
+
+        # Import subtitles.
+        resp = self.client.post(
+            reverse('import_subtitles'), {'id': self.item_location})
+
+        self.assertEqual(resp.status_code, 200)
+        self.assertFalse(json.loads(resp.content).get('success'))
+
+    def test_fail_miss_youtube_attr(self):
+        data = '<videoalpha youtube="" />'
+        modulestore().update_item(self.item_location, data)
+
+        # Import subtitles.
+        resp = self.client.post(
+            reverse('import_subtitles'), {'id': self.item_location})
+
+        self.assertEqual(resp.status_code, 200)
+        self.assertFalse(json.loads(resp.content).get('success'))
+
+        data = '<videoalpha />'
+        modulestore().update_item(self.item_location, data)
+
+        # Import subtitles.
+        resp = self.client.post(
+            reverse('import_subtitles'), {'id': self.item_location})
+
+        self.assertEqual(resp.status_code, 200)
+        self.assertFalse(json.loads(resp.content).get('success'))
+
+    def test_fail_bad_youtube_attr(self):
+        data = '<videoalpha youtube=":JMD_ifUUfsU,1.25:AKqURZnYqpk,1.50:DYpADpL7jAY" />'
+        modulestore().update_item(self.item_location, data)
+
+        # Import subtitles.
+        resp = self.client.post(
+            reverse('import_subtitles'), {'id': self.item_location})
+
+        self.assertEqual(resp.status_code, 200)
+        self.assertFalse(json.loads(resp.content).get('success'))
+
+    def test_fail_youtube_ids_unavailable(self):
+        data = '<videoalpha youtube="0.75:BAD_YOUTUBE_ID1,1.25:BAD_YOUTUBE_ID2,1.50:BAD_YOUTUBE_ID3" />'
+        modulestore().update_item(self.item_location, data)
+
+        # Import subtitles.
+        resp = self.client.post(
+            reverse('import_subtitles'), {'id': self.item_location})
+
+        self.assertEqual(resp.status_code, 200)
+        self.assertFalse(json.loads(resp.content).get('success'))
 
+    def tearDown(self):
+        super(ImportSubtitles, self).tearDown()
 
+        # Remove all subtitles for current module.
+        self.clear_subs_content()

From 78ac544d5092f8dcfc5e4cafbb72b090372ec390 Mon Sep 17 00:00:00 2001
From: Vasyl Nakvasiuk <vaxxxa@gmail.com>
Date: Tue, 18 Jun 2013 14:26:16 +0300
Subject: [PATCH 03/30] import subtitles into studio: add python unit tests for
 utils functions

---
 .../contentstore/tests/test_utils.py          | 210 +++++++++++++++++-
 1 file changed, 208 insertions(+), 2 deletions(-)

diff --git a/cms/djangoapps/contentstore/tests/test_utils.py b/cms/djangoapps/contentstore/tests/test_utils.py
index fec82db1bb78..72c83263d9f9 100644
--- a/cms/djangoapps/contentstore/tests/test_utils.py
+++ b/cms/djangoapps/contentstore/tests/test_utils.py
@@ -1,12 +1,20 @@
-""" Tests for utils. """
-from contentstore import utils
+"""Tests for utils."""
 import mock
+import unittest
 import collections
 import copy
+import json
+from uuid import uuid4
+
 from django.test import TestCase
+
+from contentstore import utils
 from django.test.utils import override_settings
 from xmodule.modulestore.tests.factories import CourseFactory
 from xmodule.modulestore.tests.django_utils import ModuleStoreTestCase
+from xmodule.contentstore.content import StaticContent
+from xmodule.contentstore.django import contentstore
+from xmodule.exceptions import NotFoundError
 
 
 class LMSLinksTestCase(TestCase):
@@ -190,3 +198,201 @@ def test_remove_extra_panel_tab(self):
                 self.assertFalse(changed)
                 self.assertEqual(actual_tabs, expected_tabs)
 
+
+class TestReturnAjaxStatus(unittest.TestCase):
+    """Tests for `return_ajax_status` decorator."""
+    def setUp(self):
+        self.true_view_func = lambda *args, **kwargs: True
+        self.true_extra_view_func = lambda *args, **kwargs: (True, {'msg': 'some message'})
+        self.false_view_func = lambda *args, **kwargs: False
+
+    def test_success_response(self):
+        request = None
+        response = utils.return_ajax_status(self.true_view_func)(request)
+        status = json.loads(response.content).get('success')
+        self.assertTrue(status)
+
+    def test_fail_response(self):
+        request = None
+        response = utils.return_ajax_status(self.false_view_func)(request)
+        status = json.loads(response.content).get('success')
+        self.assertFalse(status)
+
+    def test_extra_response_data(self):
+        request = None
+        response = utils.return_ajax_status(self.true_extra_view_func)(request)
+        resp = json.loads(response.content)
+
+        self.assertTrue(resp.get('success'))
+        self.assertEqual(resp.get('msg'), 'some message')
+
+
+class TestGenerateSubs(unittest.TestCase):
+    """Tests for `generate_subs` function."""
+    def setUp(self):
+        self.source_subs = {
+            'start': [100, 200, 240, 390, 1000],
+            'end': [200, 240, 380, 1000, 1500],
+            'text': [
+                'subs #1',
+                'subs #2',
+                'subs #3',
+                'subs #4',
+                'subs #5'
+            ]
+        }
+
+    def test_generate_subs_increase_speed(self):
+        subs = utils.generate_subs(2, 1, self.source_subs)
+        self.assertDictEqual(
+            subs,
+            {
+                'start': [200, 400, 480, 780, 2000],
+                'end': [400, 480, 760, 2000, 3000],
+                'text': ['subs #1', 'subs #2', 'subs #3', 'subs #4', 'subs #5']
+            }
+        )
+
+    def test_generate_subs_decrease_speed_1(self):
+        subs = utils.generate_subs(0.5, 1, self.source_subs)
+        self.assertDictEqual(
+            subs,
+            {
+                'start': [50, 100, 120, 195, 500],
+                'end': [100, 120, 190, 500, 750],
+                'text': ['subs #1', 'subs #2', 'subs #3', 'subs #4', 'subs #5']
+            }
+        )
+
+    def test_generate_subs_decrease_speed_2(self):
+        """Test for correct devision during `generate_subs` process."""
+        subs = utils.generate_subs(1, 2, self.source_subs)
+        self.assertDictEqual(
+            subs,
+            {
+                'start': [50, 100, 120, 195, 500],
+                'end': [100, 120, 190, 500, 750],
+                'text': ['subs #1', 'subs #2', 'subs #3', 'subs #4', 'subs #5']
+            }
+        )
+
+
+class TestSaveSubsToStore(ModuleStoreTestCase):
+    """Tests for `save_subs_to_store` function."""
+
+    org = 'MITx'
+    number = '999'
+    display_name = 'Test course'
+
+    def clear_subs_content(self):
+        """Remove, if subtitles content exists."""
+        try:
+            content = contentstore().find(self.content_location)
+            contentstore().delete(content.get_id())
+        except NotFoundError:
+            pass
+
+    def setUp(self):
+        self.subs = {
+            'start': [100, 200, 240, 390, 1000],
+            'end': [200, 240, 380, 1000, 1500],
+            'text': [
+                'subs #1',
+                'subs #2',
+                'subs #3',
+                'subs #4',
+                'subs #5'
+            ]
+        }
+
+        self.subs_id = str(uuid4())
+        filename = 'subs_{0}.srt.sjson'.format(self.subs_id)
+        self.course = CourseFactory.create(
+            org=self.org, number=self.number, display_name=self.display_name)
+        self.content_location = StaticContent.compute_location(
+            self.org, self.number, filename)
+
+        self.clear_subs_content()
+
+    def test_save_subs_to_store(self):
+        self.assertRaises(
+            NotFoundError,
+            contentstore().find,
+            self.content_location
+        )
+
+        result_location = utils.save_subs_to_store(
+            self.subs,
+            self.subs_id,
+            self.course)
+
+        self.assertTrue(contentstore().find(self.content_location))
+        self.assertEqual(result_location, self.content_location)
+
+    def tearDown(self):
+        self.clear_subs_content()
+
+
+class TestDownloadYoutubeSubs(ModuleStoreTestCase):
+    """Tests for `download_youtube_subs` function."""
+
+    org = 'MITx'
+    number = '999'
+    display_name = 'Test course'
+
+    def clear_subs_content(self, youtube_subs):
+        """Remove, if subtitles content exists."""
+        for subs_id in youtube_subs.values():
+            filename = 'subs_{0}.srt.sjson'.format(subs_id)
+            content_location = StaticContent.compute_location(
+                self.org, self.number, filename)
+            try:
+                content = contentstore().find(content_location)
+                contentstore().delete(content.get_id())
+            except NotFoundError:
+                pass
+
+    def setUp(self):
+        self.course = CourseFactory.create(
+            org=self.org, number=self.number, display_name=self.display_name)
+
+    def test_success_downloading_subs(self):
+        good_youtube_subs = {
+            0.5: 'JMD_ifUUfsU',
+            1.0: 'hI10vDNYz4M',
+            2.0: 'AKqURZnYqpk'
+        }
+        self.clear_subs_content(good_youtube_subs)
+
+        status = utils.download_youtube_subs(good_youtube_subs, self.course)
+        self.assertTrue(status)
+
+        # Check assets status after importing subtitles.
+        for subs_id in good_youtube_subs.values():
+            filename = 'subs_{0}.srt.sjson'.format(subs_id)
+            content_location = StaticContent.compute_location(
+                self.org, self.number, filename)
+            self.assertTrue(contentstore().find(content_location))
+
+        self.clear_subs_content(good_youtube_subs)
+
+    def test_fail_downloading_subs(self):
+        bad_youtube_subs = {
+            0.5: 'BAD_YOUTUBE_ID1',
+            1.0: 'BAD_YOUTUBE_ID2',
+            2.0: 'BAD_YOUTUBE_ID3'
+        }
+        self.clear_subs_content(bad_youtube_subs)
+
+        status = utils.download_youtube_subs(bad_youtube_subs, self.course)
+        self.assertFalse(status)
+
+        # Check assets status after importing subtitles.
+        for subs_id in bad_youtube_subs.values():
+            filename = 'subs_{0}.srt.sjson'.format(subs_id)
+            content_location = StaticContent.compute_location(
+                self.org, self.number, filename)
+            self.assertRaises(
+                NotFoundError, contentstore().find, content_location)
+
+        self.clear_subs_content(bad_youtube_subs)

From 49da2f27bdcbf0612277b30333161e926abf9401 Mon Sep 17 00:00:00 2001
From: Vasyl Nakvasiuk <vaxxxa@gmail.com>
Date: Thu, 4 Jul 2013 10:48:08 +0300
Subject: [PATCH 04/30] Add import from YT

---
 .../views/videoalpha/subtitles_import.coffee  | 121 ++++++++++++++++++
 .../widgets/videoalpha/subtitles.html         |  26 ++++
 .../lib/xmodule/xmodule/videoalpha_module.py  |   2 +
 3 files changed, 149 insertions(+)
 create mode 100644 cms/static/coffee/src/views/videoalpha/subtitles_import.coffee
 create mode 100644 cms/templates/widgets/videoalpha/subtitles.html

diff --git a/cms/static/coffee/src/views/videoalpha/subtitles_import.coffee b/cms/static/coffee/src/views/videoalpha/subtitles_import.coffee
new file mode 100644
index 000000000000..1856834743ec
--- /dev/null
+++ b/cms/static/coffee/src/views/videoalpha/subtitles_import.coffee
@@ -0,0 +1,121 @@
+class CMS.Views.SubtitlesImport extends Backbone.View
+  tagName: 'div'
+  className: 'comp-subtitles-entry'
+  urlYT: "/import_subtitles"
+
+  events:
+    "click #import-from-youtube": 'clickImportFromYoutube'
+
+  initialize: ->
+    _.bindAll(@)
+    @id = @$el.closest('.component').data('id')
+    @msg =
+      success:
+        intent: 'confirmation'
+        title: gettext("Subtitles were successfully imported.")
+        actions:
+          primary:
+            text: gettext("Ok")
+            click: (view, e) ->
+              view.hide()
+              e.preventDefault()
+      warn:
+        intent: 'warning'
+        title: gettext("Are you sure that you want to import the subtitle file found on YouTube?")
+        message: gettext("If subtitles for the video already exist, importing again will overwrite them.")
+        actions:
+          primary:
+            text: gettext("Yes")
+            click: @importFromYoutubeHandler
+
+          secondary: [
+            text: gettext("No")
+            click: (view, e) ->
+              view.hide()
+              e.preventDefault()
+          ]
+      wait:
+        intent: 'warning'
+        title: gettext("Please wait for the subtitles to download")
+        message: '''
+          <div id="circle-preloader">
+            <div id="circle-preloader_1" class="circle-preloader"></div>
+            <div id="circle-preloader_2" class="circle-preloader"></div>
+            <div id="circle-preloader_3" class="circle-preloader"></div>
+          </div>
+        '''
+      error:
+        intent: 'error'
+        title: gettext("Import failed!")
+        actions:
+          primary:
+            text: gettext("Ok")
+            click: (view, e) ->
+              view.hide()
+              e.preventDefault()
+    @showImportVariants()
+
+  render: (type, params = {}) ->
+    tpl = @options.tpl[type];
+    if not tpl
+        console.error("Couldn't load #{tpl[type]} template")
+        return
+    @$el.html(tpl(params))
+
+  showPrompt: (type, data) ->
+    msg =  @msg[type] || {}
+    options = $.extend({}, CMS.Views.Prompt.prototype.options, msg)
+    prompt = new CMS.Views.Prompt(options)
+    prompt.show()
+
+  showWarnMessage: ->
+    @showPrompt('warn')
+
+  showWaitMessage: ->
+    @showPrompt('wait')
+
+  showSuccessMessage: ->
+    @showPrompt('success')
+
+  showErrorMessage: (data)->
+    type = 'error'
+    options = data || {}
+    @showPrompt('error', options)
+
+  showImportVariants: ->
+    @render('variants')
+
+  clickImportFromYoutube: (event) ->
+    event.preventDefault()
+    @showWarnMessage()
+
+  importFromYoutubeHandler: (view, event)->
+      @importFromYoutube()
+      event.preventDefault()
+
+  xhrSuccessHandler: (data) ->
+    if data.status is 'success'
+      @showSuccessMessage()
+    else
+      @showErrorMessage(data)
+
+  xhrErrorHandler: (data) ->
+    @showErrorMessage({
+      title: gettext("Import failed!")
+      message: gettext("Problems with connection.")
+    })
+
+  importFromYoutube: ->
+    @showWaitMessage()
+    $.ajax(
+          url: @urlYT
+          type: "POST"
+          dataType: "json"
+          contentType: "application/json"
+          timeout: 1000*60
+          data: JSON.stringify(
+              'id': @id
+          )
+      )
+      .success(@xhrSuccessHandler)
+      .error(@xhrErrorHandler)
diff --git a/cms/templates/widgets/videoalpha/subtitles.html b/cms/templates/widgets/videoalpha/subtitles.html
new file mode 100644
index 000000000000..9d92637bd5dc
--- /dev/null
+++ b/cms/templates/widgets/videoalpha/subtitles.html
@@ -0,0 +1,26 @@
+<%! from django.utils.translation import ugettext as _ %>
+<div class="field comp-subtitles-entry" id="comp-subtitles-${component_location}"></div>
+
+<script type="text/javascript" src="/static/coffee/src/views/videoalpha/subtitles_import.js"></script>
+
+<script id="subtitles-import-variants-${component_location}-tpl" type="text/template">
+    <ul class="comp-import-variants">
+        <li>
+            <a href="#" class="blue-button">${_("Upload from file")}</a>
+        </li>
+        <li>
+           <a href="#" id="import-from-youtube" class="blue-button">${_("Import from Youtube")}</a>
+        </li>
+    </ul>
+</script>
+
+<script type='text/javascript'>
+    $(document).ready(function(){
+        new CMS.Views.SubtitlesImport({
+            el: $('#comp-subtitles-${component_location}'),
+            tpl: {
+                variants: _.template($('#subtitles-import-variants-${component_location}-tpl').text())
+            }
+        });
+    });
+</script>
\ No newline at end of file
diff --git a/common/lib/xmodule/xmodule/videoalpha_module.py b/common/lib/xmodule/xmodule/videoalpha_module.py
index 3b5b90e6743c..69d55eadf230 100644
--- a/common/lib/xmodule/xmodule/videoalpha_module.py
+++ b/common/lib/xmodule/xmodule/videoalpha_module.py
@@ -168,3 +168,5 @@ class VideoAlphaDescriptor(VideoAlphaFields, RawDescriptor):
     """Descriptor for `VideoAlphaModule`."""
     module_class = VideoAlphaModule
     template_dir_name = "videoalpha"
+    # mako_template = "widgets/html-subtitles.html"
+    tabs = {'Subtitles': "widgets/videoalpha/subtitles.html"}

From fbda2c2c72961c8df4ab675076ba4369c206df92 Mon Sep 17 00:00:00 2001
From: Vasyl Nakvasiuk <vaxxxa@gmail.com>
Date: Thu, 20 Jun 2013 19:05:05 +0300
Subject: [PATCH 05/30] upload subtitles into studio: add python side
 functionality

---
 cms/djangoapps/contentstore/utils.py      |  48 +++++++++-
 cms/djangoapps/contentstore/views/item.py | 101 +++++++++++++++++++++-
 cms/urls.py                               |   1 +
 requirements/edx/base.txt                 |   1 +
 4 files changed, 148 insertions(+), 3 deletions(-)

diff --git a/cms/djangoapps/contentstore/utils.py b/cms/djangoapps/contentstore/utils.py
index f66b45c614d3..f41c6e7bcca5 100644
--- a/cms/djangoapps/contentstore/utils.py
+++ b/cms/djangoapps/contentstore/utils.py
@@ -8,13 +8,14 @@
 import logging
 import re
 import json
-from functools import wraps
 import HTMLParser
+from functools import wraps
 
 import requests
 from lxml import etree
 from django.conf import settings
 from django.core.urlresolvers import reverse
+from pysrt import SubRipFile
 
 from cache_toolbox.core import del_cached_content
 from django_comment_client.utils import JsonResponse
@@ -411,3 +412,48 @@ def download_youtube_subs(youtube_subs, item):
             )
 
     return True
+
+
+def generate_subs_from_source(speed_subs, subs_type, subs_filedata, item):
+    """Generate subtitles from source files (like SubRip format, etc.)
+    and save them to assets for `item` module.
+    We expect, that speed of source subs equal to 1
+
+    :param speed_subs: dictionary {speed: sub_id, ...}
+    :param subs_type: type of source subs: "srt", ...
+    :param subs_filedata: content of source subs.
+    :param item: module object.
+    :returns: True, if all subs are generated and saved successfully.
+    """
+    html_parser = HTMLParser.HTMLParser()
+
+    if subs_type != 'srt':
+        log.error("We support only SubRip (*.srt) subtitles format.")
+        return False
+
+    srt_subs_obj = SubRipFile.from_string(subs_filedata)
+    if not srt_subs_obj:
+        log.error("Something wrong with SubRip subtitles file during parsing.")
+        return False
+
+    sub_starts = []
+    sub_ends = []
+    sub_texts = []
+
+    for sub in srt_subs_obj:
+        sub_starts.append(sub.start.ordinal)
+        sub_ends.append(sub.end.ordinal)
+        sub_texts.append(html_parser.unescape(sub.text.replace('\n', ' ')))
+
+    subs = {
+        'start': sub_starts,
+        'end': sub_ends,
+        'text': sub_texts}
+
+    for speed, subs_id in speed_subs.iteritems():
+        save_subs_to_store(
+            generate_subs(speed, 1, subs),
+            subs_id,
+            item)
+
+    return True
diff --git a/cms/djangoapps/contentstore/views/item.py b/cms/djangoapps/contentstore/views/item.py
index 1fc5837752ea..117ba408845f 100644
--- a/cms/djangoapps/contentstore/views/item.py
+++ b/cms/djangoapps/contentstore/views/item.py
@@ -1,5 +1,6 @@
 """Views for items (modules)."""
 
+import os
 import json
 import logging
 from uuid import uuid4
@@ -8,6 +9,7 @@
 from django.core.exceptions import PermissionDenied
 from django.http import HttpResponse
 from django.contrib.auth.decorators import login_required
+from django.template.defaultfilters import slugify
 
 from xmodule.modulestore import Location
 from xmodule.modulestore.django import modulestore
@@ -15,11 +17,14 @@
 from xmodule.modulestore.exceptions import ItemNotFoundError, InvalidLocationError
 
 from util.json_request import expect_json
-from ..utils import get_modulestore, download_youtube_subs, return_ajax_status
+from ..utils import (get_modulestore, download_youtube_subs,
+                     return_ajax_status, generate_subs_from_source)
 from .access import has_access
 from .requests import _xmodule_recurse
 
-__all__ = ['save_item', 'clone_item', 'delete_item', 'import_subtitles']
+__all__ = [
+    'save_item', 'clone_item', 'delete_item', 'import_subtitles',
+    'upload_subtitles']
 
 log = logging.getLogger(__name__)
 
@@ -136,6 +141,98 @@ def import_subtitles(request):
     return status
 
 
+@login_required
+@return_ajax_status
+def upload_subtitles(request):
+    """Try to upload subtitles for current module."""
+
+    # This view return True/False, cause we use `return_ajax_status`
+    # view decorator.
+
+    item_location = request.POST.get('id')
+    if not item_location:
+        log.error('POST data without "id" form data.')
+        return False
+
+    if 'file' not in request.FILES:
+        log.error('POST data without "file" form data.')
+        return False
+
+    source_subs_filedata = request.FILES['file'].read()
+    source_subs_filename = request.FILES['file'].name
+
+    if '.' not in source_subs_filename:
+        log.error("Undefined file extension.")
+        return False
+
+    basename = os.path.basename(source_subs_filename)
+    source_subs_name = os.path.splitext(basename)[0]
+    source_subs_ext = os.path.splitext(basename)[1][1:]
+
+    try:
+        item = modulestore().get_item(item_location)
+    except (ItemNotFoundError, InvalidLocationError):
+        log.error("Can't find item by location.")
+        return False
+
+    # Check permissions for this user within this course.
+    if not has_access(request.user, item_location):
+        raise PermissionDenied()
+
+    if item.category != 'videoalpha':
+        log.error('Subtitles are supported only for "videoalpha" modules.')
+        return False
+
+    try:
+        xmltree = etree.fromstring(item.data)
+    except etree.XMLSyntaxError:
+        log.error("Can't parse source XML.")
+        return False
+
+    youtube_attr = xmltree.get('youtube')
+    xml_sources = xmltree.findall('source')
+
+    if youtube_attr:
+        try:
+            speed_subs = dict([
+                (float(i.split(':')[0]), i.split(':')[1])
+                for i in youtube_attr.split(',')
+            ])
+        except (IndexError, ValueError):
+            # Get `IndexError` if after splitting by ':' we have one item
+            # (missing ':' in the "youtube" attribute value).
+            # Get `ValueError` when after splitting by ':' key can't convert
+            # to float.
+            log.error('Bad "youtube" attribute.')
+            return False
+
+        status = generate_subs_from_source(
+            speed_subs,
+            source_subs_ext,
+            source_subs_filedata,
+            item)
+
+    elif xml_sources:
+        sub_attr = slugify(source_subs_name)
+
+        # Generate only one subs for speed = 1.0
+        status = generate_subs_from_source(
+            {1: sub_attr},
+            source_subs_ext,
+            source_subs_filedata,
+            item)
+
+        if status:
+            xmltree.set('sub', sub_attr)
+            store = get_modulestore(Location(item_location))
+            store.update_item(item_location, etree.tostring(xmltree))
+    else:
+        log.error('Missing or blank "youtube" attribute and "source" tag.')
+        return False
+
+    return status, {'xml': etree.tostring(xmltree)}
+
+
 @login_required
 @expect_json
 def clone_item(request):
diff --git a/cms/urls.py b/cms/urls.py
index eeb2ebf898c8..04e72802f30e 100644
--- a/cms/urls.py
+++ b/cms/urls.py
@@ -24,6 +24,7 @@
     url(r'^create_new_course', 'contentstore.views.create_new_course', name='create_new_course'),
     url(r'^reorder_static_tabs', 'contentstore.views.reorder_static_tabs', name='reorder_static_tabs'),
     url(r'^import_subtitles$', 'contentstore.views.import_subtitles', name='import_subtitles'),
+    url(r'^upload_subtitles$', 'contentstore.views.upload_subtitles', name='upload_subtitles'),
 
     url(r'^(?P<org>[^/]+)/(?P<course>[^/]+)/course/(?P<name>[^/]+)$',
         'contentstore.views.course_index', name='course_index'),
diff --git a/requirements/edx/base.txt b/requirements/edx/base.txt
index 0db55bacb2ed..ce31ebd9d9e1 100644
--- a/requirements/edx/base.txt
+++ b/requirements/edx/base.txt
@@ -48,6 +48,7 @@ sorl-thumbnail==11.12
 South==0.7.6
 sympy==0.7.1
 xmltodict==0.4.1
+pysrt==0.4.7
 
 # Used for debugging
 ipython==0.13.1

From 28e05c38893968d73250e56b16000e6335138f10 Mon Sep 17 00:00:00 2001
From: Vasyl Nakvasiuk <vaxxxa@gmail.com>
Date: Tue, 25 Jun 2013 16:38:21 +0300
Subject: [PATCH 06/30] upload subtitles into studio: add python integration
 tests

---
 .../contentstore/tests/test_item.py           | 262 ++++++++++++++++++
 1 file changed, 262 insertions(+)

diff --git a/cms/djangoapps/contentstore/tests/test_item.py b/cms/djangoapps/contentstore/tests/test_item.py
index bc1638792283..8c20c24dd774 100644
--- a/cms/djangoapps/contentstore/tests/test_item.py
+++ b/cms/djangoapps/contentstore/tests/test_item.py
@@ -1,8 +1,11 @@
 """Tests for items views."""
+import os
 import json
+import tempfile
 
 from lxml import etree
 from django.core.urlresolvers import reverse
+from django.template.defaultfilters import slugify
 
 from contentstore.tests.test_course_settings import CourseTestCase
 from xmodule.modulestore.tests.factories import CourseFactory
@@ -204,3 +207,262 @@ def tearDown(self):
 
         # Remove all subtitles for current module.
         self.clear_subs_content()
+
+
+class UploadSubtitles(BaseSubtitles):
+    """Tests for '/upload_subtitles' url."""
+
+    def setUp(self):
+        """Create initial data."""
+        super(UploadSubtitles, self).setUp()
+
+        self.good_srt_file = tempfile.NamedTemporaryFile(suffix='.srt')
+        self.good_srt_file.write("""
+1
+00:00:10,500 --> 00:00:13,000
+Elephant's Dream
+
+2
+00:00:15,000 --> 00:00:18,000
+At the left we can see...
+        """)
+        self.good_srt_file.seek(0)
+
+        self.bad_data_srt_file = tempfile.NamedTemporaryFile(suffix='.srt')
+        self.bad_data_srt_file.write('Some BAD data')
+        self.bad_data_srt_file.seek(0)
+
+        self.bad_name_srt_file = tempfile.NamedTemporaryFile(suffix='.BAD')
+        self.bad_name_srt_file.write("""
+1
+00:00:10,500 --> 00:00:13,000
+Elephant's Dream
+
+2
+00:00:15,000 --> 00:00:18,000
+At the left we can see...
+        """)
+        self.bad_name_srt_file.seek(0)
+
+    def test_success_videoalpha_module_youtube_subs_uploading(self):
+        # Check assets status before uploading subtitles.
+        for youtube_id in self.get_youtube_ids().values():
+            filename = 'subs_{0}.srt.sjson'.format(youtube_id)
+            content_location = StaticContent.compute_location(
+                self.org, self.number, filename)
+            self.assertRaises(
+                NotFoundError, contentstore().find, content_location)
+
+        resp = self.client.post(
+            reverse('upload_subtitles'),
+            {
+                'id': self.item_location,
+                'file': self.good_srt_file
+            })
+
+        self.assertEqual(resp.status_code, 200)
+        self.assertTrue(json.loads(resp.content).get('success'))
+
+        # Check assets status after uploading subtitles.
+        for youtube_id in self.get_youtube_ids().values():
+            filename = 'subs_{0}.srt.sjson'.format(youtube_id)
+            content_location = StaticContent.compute_location(
+                self.org, self.number, filename)
+            self.assertTrue(contentstore().find(content_location))
+
+    def test_success_videoalpha_module_source_subs_uploading(self):
+        data = """
+<videoalpha youtube="">
+    <source src="http://www.quirksmode.org/html5/videos/big_buck_bunny.mp4"/>
+    <source src="http://www.quirksmode.org/html5/videos/big_buck_bunny.webm"/>
+    <source src="http://www.quirksmode.org/html5/videos/big_buck_bunny.ogv"/>
+</videoalpha>
+"""
+        modulestore().update_item(self.item_location, data)
+
+        resp = self.client.post(
+            reverse('upload_subtitles'),
+            {
+                'id': self.item_location,
+                'file': self.good_srt_file
+            })
+
+        self.assertEqual(resp.status_code, 200)
+        self.assertTrue(json.loads(resp.content).get('success'))
+        self.assertTrue(json.loads(resp.content).get('xml'))
+
+        filename = slugify(
+            os.path.splitext(os.path.basename(self.good_srt_file.name))[0])
+        item = modulestore().get_item(self.item_location)
+        self.assertEqual(
+            etree.fromstring(item.data).get('sub'),
+            filename)
+
+        content_location = StaticContent.compute_location(
+            self.org, self.number, 'subs_{0}.srt.sjson'.format(filename))
+        self.assertTrue(contentstore().find(content_location))
+
+    def test_fail_data_without_id(self):
+        resp = self.client.post(
+            reverse('upload_subtitles'), {'file': self.good_srt_file})
+
+        self.assertEqual(resp.status_code, 200)
+        self.assertFalse(json.loads(resp.content).get('success'))
+
+    def test_fail_data_without_file(self):
+        resp = self.client.post(
+            reverse('upload_subtitles'), {'id': self.item_location})
+
+        self.assertEqual(resp.status_code, 200)
+        self.assertFalse(json.loads(resp.content).get('success'))
+
+    def test_fail_data_with_bad_location(self):
+        # Test for raising `InvalidLocationError` exception.
+        resp = self.client.post(
+            reverse('import_subtitles'),
+            {
+                'id': 'BAD_LOCATION',
+                'file': self.good_srt_file
+            })
+
+        self.assertEqual(resp.status_code, 200)
+        self.assertFalse(json.loads(resp.content).get('success'))
+
+        # Test for raising `ItemNotFoundError` exception.
+        resp = self.client.post(
+            reverse('upload_subtitles'),
+            {
+                'id': '{0}_{1}'.format(self.item_location, 'BAD_LOCATION'),
+                'file': self.good_srt_file
+            })
+
+        self.assertEqual(resp.status_code, 200)
+        self.assertFalse(json.loads(resp.content).get('success'))
+
+    def test_fail_for_non_videoalpha_module(self):
+        # Video module: setup
+        data = {
+            'parent_location': str(self.course_location),
+            'template': 'i4x://edx/templates/video/default'
+        }
+        resp = self.client.post(reverse('clone_item'), data)
+        item_location = json.loads(resp.content).get('id')
+        data = '<video youtube="0.75:JMD_ifUUfsU,1.0:hI10vDNYz4M" />'
+        modulestore().update_item(item_location, data)
+
+        # Video module: testing
+        resp = self.client.post(
+            reverse('upload_subtitles'),
+            {
+                'id': item_location,
+                'file': self.good_srt_file
+            })
+        self.assertEqual(resp.status_code, 200)
+        self.assertFalse(json.loads(resp.content).get('success'))
+
+    def test_fail_bad_xml(self):
+        data = '<<<videoalpha youtube="0.75:JMD_ifUUfsU,1.25:AKqURZnYqpk,1.50:DYpADpL7jAY" />'
+        modulestore().update_item(self.item_location, data)
+
+        resp = self.client.post(
+            reverse('upload_subtitles'),
+            {
+                'id': self.item_location,
+                'file': self.good_srt_file
+            })
+
+        self.assertEqual(resp.status_code, 200)
+        self.assertFalse(json.loads(resp.content).get('success'))
+
+    def test_fail_bad_youtube_attr(self):
+        data = '<videoalpha youtube=":JMD_ifUUfsU,1.25:AKqURZnYqpk,1.50:DYpADpL7jAY" />'
+        modulestore().update_item(self.item_location, data)
+
+        resp = self.client.post(
+            reverse('upload_subtitles'),
+            {
+                'id': self.item_location,
+                'file': self.good_srt_file
+            })
+
+        self.assertEqual(resp.status_code, 200)
+        self.assertFalse(json.loads(resp.content).get('success'))
+
+    def test_fail_miss_youtube_and_source_attrs(self):
+        data = '<videoalpha youtube="" />'
+        modulestore().update_item(self.item_location, data)
+
+        resp = self.client.post(
+            reverse('upload_subtitles'),
+            {
+                'id': self.item_location,
+                'file': self.good_srt_file
+            })
+
+        self.assertEqual(resp.status_code, 200)
+        self.assertFalse(json.loads(resp.content).get('success'))
+
+        data = '<videoalpha />'
+        modulestore().update_item(self.item_location, data)
+
+        resp = self.client.post(
+            reverse('upload_subtitles'),
+            {
+                'id': self.item_location,
+                'file': self.good_srt_file
+            })
+
+        self.assertEqual(resp.status_code, 200)
+        self.assertFalse(json.loads(resp.content).get('success'))
+
+    def test_fail_bad_data_srt_file(self):
+        resp = self.client.post(
+            reverse('upload_subtitles'),
+            {
+                'id': self.item_location,
+                'file': self.bad_data_srt_file
+            })
+
+        self.assertEqual(resp.status_code, 200)
+        self.assertFalse(json.loads(resp.content).get('success'))
+
+    def test_fail_bad_name_srt_file(self):
+        resp = self.client.post(
+            reverse('upload_subtitles'),
+            {
+                'id': self.item_location,
+                'file': self.bad_name_srt_file
+            })
+
+        self.assertEqual(resp.status_code, 200)
+        self.assertFalse(json.loads(resp.content).get('success'))
+
+    def test_undefined_file_extension(self):
+        srt_file = tempfile.NamedTemporaryFile(suffix='')
+        srt_file.write("""
+1
+00:00:10,500 --> 00:00:13,000
+Elephant's Dream
+
+2
+00:00:15,000 --> 00:00:18,000
+At the left we can see...
+        """)
+        srt_file.seek(0)
+
+        resp = self.client.post(
+            reverse('upload_subtitles'),
+            {
+                'id': self.item_location,
+                'file': srt_file
+            })
+
+        self.assertEqual(resp.status_code, 200)
+        self.assertFalse(json.loads(resp.content).get('success'))
+
+    def tearDown(self):
+        super(UploadSubtitles, self).tearDown()
+
+        self.good_srt_file.close()
+        self.bad_data_srt_file.close()
+        self.bad_name_srt_file.close()

From 3abba3457346f8ad6de876471ca5981e11ec411c Mon Sep 17 00:00:00 2001
From: Vasyl Nakvasiuk <vaxxxa@gmail.com>
Date: Tue, 25 Jun 2013 16:38:32 +0300
Subject: [PATCH 07/30] upload subtitles into studio: add python unit tests for
 utils

---
 .../contentstore/tests/test_utils.py          | 77 +++++++++++++++++++
 1 file changed, 77 insertions(+)

diff --git a/cms/djangoapps/contentstore/tests/test_utils.py b/cms/djangoapps/contentstore/tests/test_utils.py
index 72c83263d9f9..249d3cbd2577 100644
--- a/cms/djangoapps/contentstore/tests/test_utils.py
+++ b/cms/djangoapps/contentstore/tests/test_utils.py
@@ -396,3 +396,80 @@ def test_fail_downloading_subs(self):
                 NotFoundError, contentstore().find, content_location)
 
         self.clear_subs_content(bad_youtube_subs)
+
+
+class TestGenerateSubsFromSource(TestDownloadYoutubeSubs):
+    """Tests for `generate_subs_from_source` function."""
+
+    def test_success_generating_subs(self):
+        youtube_subs = {
+            0.5: 'JMD_ifUUfsU',
+            1.0: 'hI10vDNYz4M',
+            2.0: 'AKqURZnYqpk'
+        }
+        srt_filedata = """
+1
+00:00:10,500 --> 00:00:13,000
+Elephant's Dream
+
+2
+00:00:15,000 --> 00:00:18,000
+At the left we can see...
+        """
+        self.clear_subs_content(youtube_subs)
+
+        status = utils.generate_subs_from_source(
+            youtube_subs,
+            'srt',
+            srt_filedata,
+            self.course)
+        self.assertTrue(status)
+
+        # Check assets status after importing subtitles.
+        for subs_id in youtube_subs.values():
+            filename = 'subs_{0}.srt.sjson'.format(subs_id)
+            content_location = StaticContent.compute_location(
+                self.org, self.number, filename)
+            self.assertTrue(contentstore().find(content_location))
+
+        self.clear_subs_content(youtube_subs)
+
+    def test_fail_bad_subs_type(self):
+        youtube_subs = {
+            0.5: 'JMD_ifUUfsU',
+            1.0: 'hI10vDNYz4M',
+            2.0: 'AKqURZnYqpk'
+        }
+
+        srt_filedata = """
+1
+00:00:10,500 --> 00:00:13,000
+Elephant's Dream
+
+2
+00:00:15,000 --> 00:00:18,000
+At the left we can see...
+        """
+
+        status = utils.generate_subs_from_source(
+            youtube_subs,
+            'BAD_FORMAT',
+            srt_filedata,
+            self.course)
+        self.assertFalse(status)
+
+    def test_fail_bad_subs_filedata(self):
+        youtube_subs = {
+            0.5: 'JMD_ifUUfsU',
+            1.0: 'hI10vDNYz4M',
+            2.0: 'AKqURZnYqpk'
+        }
+
+        srt_filedata = """BAD_DATA"""
+
+        status = utils.generate_subs_from_source(
+            youtube_subs,
+            'srt',
+            srt_filedata,
+            self.course)
+        self.assertFalse(status)

From 83a7163a9c7fa6e53c1bb13df424f7a24c4a1adc Mon Sep 17 00:00:00 2001
From: Vasyl Nakvasiuk <vaxxxa@gmail.com>
Date: Thu, 4 Jul 2013 10:54:12 +0300
Subject: [PATCH 08/30] Add upload subtitles file + Refactoring

---
 .../coffee/src/views/videoalpha/import.coffee |  25 ++++
 .../src/views/videoalpha/import/file.coffee   |  95 ++++++++++++++
 .../src/views/videoalpha/import/yt.coffee     |  66 ++++++++++
 .../src/views/videoalpha/messages.coffee      |  56 ++++++++
 .../src/views/videoalpha/subtitles.coffee     |   1 +
 .../views/videoalpha/subtitles_import.coffee  | 121 ------------------
 .../subtitles-import-file.underscore          |   8 ++
 .../widgets/videoalpha/subtitles.html         |  31 ++---
 8 files changed, 267 insertions(+), 136 deletions(-)
 create mode 100644 cms/static/coffee/src/views/videoalpha/import.coffee
 create mode 100644 cms/static/coffee/src/views/videoalpha/import/file.coffee
 create mode 100644 cms/static/coffee/src/views/videoalpha/import/yt.coffee
 create mode 100644 cms/static/coffee/src/views/videoalpha/messages.coffee
 create mode 100644 cms/static/coffee/src/views/videoalpha/subtitles.coffee
 delete mode 100644 cms/static/coffee/src/views/videoalpha/subtitles_import.coffee
 create mode 100644 cms/templates/js/videoalpha/subtitles-import-file.underscore

diff --git a/cms/static/coffee/src/views/videoalpha/import.coffee b/cms/static/coffee/src/views/videoalpha/import.coffee
new file mode 100644
index 000000000000..ae97ce278605
--- /dev/null
+++ b/cms/static/coffee/src/views/videoalpha/import.coffee
@@ -0,0 +1,25 @@
+class CMS.Views.SubtitlesImport extends Backbone.View
+  tagName: 'ul'
+  className: 'comp-subtitles-import-list'
+
+  initialize: ->
+    _.bindAll(@)
+    @component_id = @options.container
+      .closest('.component')
+      .data('id')
+    @messages = new @options['msg']()
+
+    @render()
+
+  render: ->
+    @$el.appendTo(@options.container)
+
+    options = $.extend(true, {}, @options,
+      component_id: @component_id
+      msg: @messages
+      $container: @$el
+    )
+
+    modules = @options.modules
+    $.each modules, (index) ->
+      new modules[index](options)
\ No newline at end of file
diff --git a/cms/static/coffee/src/views/videoalpha/import/file.coffee b/cms/static/coffee/src/views/videoalpha/import/file.coffee
new file mode 100644
index 000000000000..1f80e6c3ce37
--- /dev/null
+++ b/cms/static/coffee/src/views/videoalpha/import/file.coffee
@@ -0,0 +1,95 @@
+class CMS.Views.SubtitlesImportFile extends Backbone.View
+  tagName: "li"
+  className: "import-file"
+  link_id: "import-from-file"
+  url: "/upload_subtitles"
+  files: null
+
+  events:
+    "click #import-from-file": "clickHandler"
+    "change .file-input": "changeHadler"
+
+  initialize: ->
+    _.bindAll(@)
+    @messages = @options.msg
+    @render()
+
+  render: ->
+    container = @options.$container
+    tpl = @options.tpl.file
+
+    if not tpl
+        console.error("Couldn't load template for file uploader")
+        return
+
+    @$el.append(
+        $('<a></a>',
+            class: "blue-button"
+            id: @link_id
+            href: "#"
+        )
+        .text(gettext("Upload from file"))
+    )
+    .append(tpl(
+      component_id: @options.component_id
+    ))
+    .appendTo(container)
+
+    @$form = container.find('.file-upload')
+    @$fileInput = @$form.find('.file-input')
+
+  clickHandler: (event) ->
+    event.preventDefault()
+    @$fileInput
+      .val(null)
+      .trigger('click')
+
+  changeHadler: (event) ->
+    event.preventDefault()
+    @files = @$fileInput.get(0).files
+    @messages.render('warn',
+      title: gettext("Are you sure that you want to upload the subtitle file?")
+      actions:
+        primary:
+          click: @importHandler
+    )
+
+  importHandler: (view, event) ->
+    event.preventDefault()
+    @import()
+
+  import: ->
+    if @files.length is 0
+        return
+
+    @$form.find('.file-chooser').ajaxSubmit(
+        beforeSend: @xhrResetProgressBar
+        uploadProgress: @xhrProgressHandler
+        complete: @xhrCompleteHandler
+    )
+
+  xhrResetProgressBar: ->
+    @messages.render(null,
+      intent: 'warning'
+      title: gettext("Uploading...")
+      message: "
+        <span class=\"file-name\">#{@files[0].name}</span>
+        <span class=\"progress-bar\">
+            <span class=\"progress-fill\"></span>
+        </span>
+      "
+    )
+    @$progressFill = @messages.prompt.$el.find('.progress-fill')
+
+  xhrProgressHandler: (event, position, total, percentComplete) ->
+    percentVal = percentComplete + '%'
+    @$progressFill
+      .width(percentVal)
+      .html(percentVal)
+
+  xhrCompleteHandler: (xhr) ->
+    resp = JSON.parse(xhr.responseText)
+    if xhr.status is 200 and resp.success is true
+        @messages.render('success')
+    else
+        @messages.render('error')
diff --git a/cms/static/coffee/src/views/videoalpha/import/yt.coffee b/cms/static/coffee/src/views/videoalpha/import/yt.coffee
new file mode 100644
index 000000000000..1bc736b426de
--- /dev/null
+++ b/cms/static/coffee/src/views/videoalpha/import/yt.coffee
@@ -0,0 +1,66 @@
+class CMS.Views.SubtitlesImportYT extends Backbone.View
+  tagName: "li"
+  className: "import-youtube"
+  link_id: "import-from-youtube"
+  url: "/import_subtitles"
+  files: null
+
+  events:
+    "click #import-from-youtube": "clickHandler"
+
+  initialize: ->
+    _.bindAll(@)
+    @messages = @options.msg
+    @render()
+
+  render: ->
+    html = @$el.append(
+        $('<a></a>',
+            class: "blue-button"
+            id: @link_id
+            href: "#"
+        )
+        .text(gettext("Import from Youtube"))
+    )
+    .appendTo(@options.$container)
+
+  clickHandler: (event) ->
+    event.preventDefault()
+    @messages.render('warn',
+      title: gettext('''
+        Are you sure that you want to import the subtitle file
+        found on YouTube?
+      ''')
+      actions:
+        primary:
+          click: @importHandler
+    )
+
+  importHandler: (view, event)->
+      event.preventDefault()
+      @import()
+
+  xhrSuccessHandler: (data) ->
+    if data.success is true
+      @messages.render('success')
+    else
+      @xhrErrorHandler()
+
+  xhrErrorHandler: ->
+    @messages.render('error')
+
+  import: ->
+    @messages.render('wait')
+
+    $.ajax(
+          url: @url
+          type: "POST"
+          dataType: "json"
+          contentType: "application/json"
+          timeout: 1000*60
+          data: JSON.stringify(
+              'id': @options.component_id
+          )
+      )
+      .success(@xhrSuccessHandler)
+      .error(@xhrErrorHandler)
diff --git a/cms/static/coffee/src/views/videoalpha/messages.coffee b/cms/static/coffee/src/views/videoalpha/messages.coffee
new file mode 100644
index 000000000000..e40664ed0a0c
--- /dev/null
+++ b/cms/static/coffee/src/views/videoalpha/messages.coffee
@@ -0,0 +1,56 @@
+class CMS.Views.SubtitlesMessages extends  Backbone.View
+
+  initialize: ->
+    @msg =
+      success:
+        intent: 'confirmation'
+        title: gettext("Subtitles were successfully imported.")
+        actions:
+          primary:
+            text: gettext("Ok")
+            click: (view, e) ->
+              view.hide()
+              e.preventDefault()
+      warn:
+        intent: 'warning'
+        title: gettext("Are you sure that you want to import/upload the subtitle?")
+        message: gettext("If subtitles for the video already exist, importing again will overwrite them.")
+        actions:
+          primary:
+            text: gettext("Yes")
+
+          secondary: [
+            text: gettext("No")
+            click: (view, e) ->
+              view.hide()
+              e.preventDefault()
+          ]
+      wait:
+        intent: 'warning'
+        title: gettext("Please wait for the subtitles to download")
+        message: '''
+          <span id="circle-preloader">
+            <span id="circle-preloader_1" class="circle-preloader"></span>
+            <span id="circle-preloader_2" class="circle-preloader"></span>
+            <span id="circle-preloader_3" class="circle-preloader"></span>
+          </span>
+        '''
+      error:
+        intent: 'error'
+        title: gettext("Import failed!")
+        actions:
+          primary:
+            text: gettext("Ok")
+            click: (view, e) ->
+              view.hide()
+              e.preventDefault()
+
+  render: (type, data) ->
+    msg =  @msg[type] || {}
+    options = $.extend(true, {}, CMS.Views.Prompt.prototype.options, msg, data)
+    @prompt = new CMS.Views.Prompt(options)
+    @prompt.show()
+
+  hide: (event) ->
+    event.preventDefault() if event
+    @prompt.hide()
diff --git a/cms/static/coffee/src/views/videoalpha/subtitles.coffee b/cms/static/coffee/src/views/videoalpha/subtitles.coffee
new file mode 100644
index 000000000000..baa1e2bc2ac8
--- /dev/null
+++ b/cms/static/coffee/src/views/videoalpha/subtitles.coffee
@@ -0,0 +1 @@
+class CMS.Views.Subtitles extends Backbone.View
\ No newline at end of file
diff --git a/cms/static/coffee/src/views/videoalpha/subtitles_import.coffee b/cms/static/coffee/src/views/videoalpha/subtitles_import.coffee
deleted file mode 100644
index 1856834743ec..000000000000
--- a/cms/static/coffee/src/views/videoalpha/subtitles_import.coffee
+++ /dev/null
@@ -1,121 +0,0 @@
-class CMS.Views.SubtitlesImport extends Backbone.View
-  tagName: 'div'
-  className: 'comp-subtitles-entry'
-  urlYT: "/import_subtitles"
-
-  events:
-    "click #import-from-youtube": 'clickImportFromYoutube'
-
-  initialize: ->
-    _.bindAll(@)
-    @id = @$el.closest('.component').data('id')
-    @msg =
-      success:
-        intent: 'confirmation'
-        title: gettext("Subtitles were successfully imported.")
-        actions:
-          primary:
-            text: gettext("Ok")
-            click: (view, e) ->
-              view.hide()
-              e.preventDefault()
-      warn:
-        intent: 'warning'
-        title: gettext("Are you sure that you want to import the subtitle file found on YouTube?")
-        message: gettext("If subtitles for the video already exist, importing again will overwrite them.")
-        actions:
-          primary:
-            text: gettext("Yes")
-            click: @importFromYoutubeHandler
-
-          secondary: [
-            text: gettext("No")
-            click: (view, e) ->
-              view.hide()
-              e.preventDefault()
-          ]
-      wait:
-        intent: 'warning'
-        title: gettext("Please wait for the subtitles to download")
-        message: '''
-          <div id="circle-preloader">
-            <div id="circle-preloader_1" class="circle-preloader"></div>
-            <div id="circle-preloader_2" class="circle-preloader"></div>
-            <div id="circle-preloader_3" class="circle-preloader"></div>
-          </div>
-        '''
-      error:
-        intent: 'error'
-        title: gettext("Import failed!")
-        actions:
-          primary:
-            text: gettext("Ok")
-            click: (view, e) ->
-              view.hide()
-              e.preventDefault()
-    @showImportVariants()
-
-  render: (type, params = {}) ->
-    tpl = @options.tpl[type];
-    if not tpl
-        console.error("Couldn't load #{tpl[type]} template")
-        return
-    @$el.html(tpl(params))
-
-  showPrompt: (type, data) ->
-    msg =  @msg[type] || {}
-    options = $.extend({}, CMS.Views.Prompt.prototype.options, msg)
-    prompt = new CMS.Views.Prompt(options)
-    prompt.show()
-
-  showWarnMessage: ->
-    @showPrompt('warn')
-
-  showWaitMessage: ->
-    @showPrompt('wait')
-
-  showSuccessMessage: ->
-    @showPrompt('success')
-
-  showErrorMessage: (data)->
-    type = 'error'
-    options = data || {}
-    @showPrompt('error', options)
-
-  showImportVariants: ->
-    @render('variants')
-
-  clickImportFromYoutube: (event) ->
-    event.preventDefault()
-    @showWarnMessage()
-
-  importFromYoutubeHandler: (view, event)->
-      @importFromYoutube()
-      event.preventDefault()
-
-  xhrSuccessHandler: (data) ->
-    if data.status is 'success'
-      @showSuccessMessage()
-    else
-      @showErrorMessage(data)
-
-  xhrErrorHandler: (data) ->
-    @showErrorMessage({
-      title: gettext("Import failed!")
-      message: gettext("Problems with connection.")
-    })
-
-  importFromYoutube: ->
-    @showWaitMessage()
-    $.ajax(
-          url: @urlYT
-          type: "POST"
-          dataType: "json"
-          contentType: "application/json"
-          timeout: 1000*60
-          data: JSON.stringify(
-              'id': @id
-          )
-      )
-      .success(@xhrSuccessHandler)
-      .error(@xhrErrorHandler)
diff --git a/cms/templates/js/videoalpha/subtitles-import-file.underscore b/cms/templates/js/videoalpha/subtitles-import-file.underscore
new file mode 100644
index 000000000000..8dc1e0144391
--- /dev/null
+++ b/cms/templates/js/videoalpha/subtitles-import-file.underscore
@@ -0,0 +1,8 @@
+<div class="file-upload">
+    <form class="file-chooser" action="/upload_subtitles"
+                        method="post" enctype="multipart/form-data">
+        <a href="#" class="choose-file-button">Choose File</a>
+        <input type="file" class="file-input" name="file">
+        <input type="hidden" name="id" value="<%= component_id %>">
+    </form>
+</div>
\ No newline at end of file
diff --git a/cms/templates/widgets/videoalpha/subtitles.html b/cms/templates/widgets/videoalpha/subtitles.html
index 9d92637bd5dc..09fb089d3fd7 100644
--- a/cms/templates/widgets/videoalpha/subtitles.html
+++ b/cms/templates/widgets/videoalpha/subtitles.html
@@ -1,26 +1,27 @@
 <%! from django.utils.translation import ugettext as _ %>
-<div class="field comp-subtitles-entry" id="comp-subtitles-${component_location}"></div>
+<%namespace name='static' file='../../static_content.html'/>
 
-<script type="text/javascript" src="/static/coffee/src/views/videoalpha/subtitles_import.js"></script>
+<div class="field comp-subtitles-entry" id="comp-subtitles-${component_location_html_id}"></div>
 
-<script id="subtitles-import-variants-${component_location}-tpl" type="text/template">
-    <ul class="comp-import-variants">
-        <li>
-            <a href="#" class="blue-button">${_("Upload from file")}</a>
-        </li>
-        <li>
-           <a href="#" id="import-from-youtube" class="blue-button">${_("Import from Youtube")}</a>
-        </li>
-    </ul>
+<script type="text/javascript" src="${static.url('coffee/src/views/videoalpha/subtitles_import.js')}"></script>
+
+<script id="subtitles-import-from-file-${component_location_html_id}-tpl" type="text/template">
+    <%static:include path="js/videoalpha/subtitles-import-file.underscore" />
 </script>
 
 <script type='text/javascript'>
     $(document).ready(function(){
         new CMS.Views.SubtitlesImport({
-            el: $('#comp-subtitles-${component_location}'),
+            container: $('#comp-subtitles-${component_location_html_id}'),
             tpl: {
-                variants: _.template($('#subtitles-import-variants-${component_location}-tpl').text())
-            }
+                file: _.template($('#subtitles-import-from-file-${component_location_html_id}-tpl').text())
+
+            },
+            msg: CMS.Views.SubtitlesMessages,
+            modules: [
+                CMS.Views.SubtitlesImportFile,
+                CMS.Views.SubtitlesImportYT
+            ]
         });
     });
-</script>
\ No newline at end of file
+</script>

From ad5e81c3c419134e009f8e707b5a00132adb152f Mon Sep 17 00:00:00 2001
From: Vasyl Nakvasiuk <vaxxxa@gmail.com>
Date: Thu, 27 Jun 2013 17:21:41 +0300
Subject: [PATCH 09/30] download subtitles into studio: add python side
 functionality

---
 cms/djangoapps/contentstore/utils.py      |  31 ++++++-
 cms/djangoapps/contentstore/views/item.py | 106 +++++++++++++++++++++-
 cms/urls.py                               |   1 +
 3 files changed, 134 insertions(+), 4 deletions(-)

diff --git a/cms/djangoapps/contentstore/utils.py b/cms/djangoapps/contentstore/utils.py
index f41c6e7bcca5..4aa3ed523826 100644
--- a/cms/djangoapps/contentstore/utils.py
+++ b/cms/djangoapps/contentstore/utils.py
@@ -9,13 +9,14 @@
 import re
 import json
 import HTMLParser
+import StringIO
 from functools import wraps
 
 import requests
 from lxml import etree
 from django.conf import settings
 from django.core.urlresolvers import reverse
-from pysrt import SubRipFile
+from pysrt import SubRipTime, SubRipItem, SubRipFile
 
 from cache_toolbox.core import del_cached_content
 from django_comment_client.utils import JsonResponse
@@ -457,3 +458,31 @@ def generate_subs_from_source(speed_subs, subs_type, subs_filedata, item):
             item)
 
     return True
+
+
+def generate_srt_from_sjson(sjson_subs, speed):
+    """Generate subtitles with speed = 1.0 from sjson to SubRip (*.srt).
+
+    :param sjson_subs: "sjson" subs.
+    :param speed: speed of `sjson_subs`.
+    :returns: "srt" subs.
+    """
+    if len(sjson_subs['start']) != len(sjson_subs['end']) or \
+       len(sjson_subs['start']) != len(sjson_subs['text']):
+        return None
+
+    sjson_speed_1 = generate_subs(speed, 1, sjson_subs)
+    output = StringIO.StringIO()
+
+    for i in range(len(sjson_speed_1['start'])):
+        item = SubRipItem(
+            index=i,
+            start=SubRipTime(milliseconds=sjson_speed_1['start'][i]),
+            end=SubRipTime(milliseconds=sjson_speed_1['end'][i]),
+            text=sjson_speed_1['text'][i])
+        output.write(unicode(item))
+        output.write('\n')
+
+    output.seek(0)
+
+    return output.read()
diff --git a/cms/djangoapps/contentstore/views/item.py b/cms/djangoapps/contentstore/views/item.py
index 117ba408845f..0739446e5273 100644
--- a/cms/djangoapps/contentstore/views/item.py
+++ b/cms/djangoapps/contentstore/views/item.py
@@ -7,7 +7,7 @@
 from lxml import etree
 
 from django.core.exceptions import PermissionDenied
-from django.http import HttpResponse
+from django.http import HttpResponse, Http404
 from django.contrib.auth.decorators import login_required
 from django.template.defaultfilters import slugify
 
@@ -15,16 +15,20 @@
 from xmodule.modulestore.django import modulestore
 from xmodule.modulestore.inheritance import own_metadata
 from xmodule.modulestore.exceptions import ItemNotFoundError, InvalidLocationError
+from xmodule.contentstore.django import contentstore
+from xmodule.contentstore.content import StaticContent
+from xmodule.exceptions import NotFoundError
 
 from util.json_request import expect_json
 from ..utils import (get_modulestore, download_youtube_subs,
-                     return_ajax_status, generate_subs_from_source)
+                     return_ajax_status, generate_subs_from_source,
+                     generate_srt_from_sjson)
 from .access import has_access
 from .requests import _xmodule_recurse
 
 __all__ = [
     'save_item', 'clone_item', 'delete_item', 'import_subtitles',
-    'upload_subtitles']
+    'upload_subtitles', 'download_subtitles']
 
 log = logging.getLogger(__name__)
 
@@ -233,6 +237,102 @@ def upload_subtitles(request):
     return status, {'xml': etree.tostring(xmltree)}
 
 
+@login_required
+def download_subtitles(request):
+    """Try to download subtitles for current modules."""
+
+    # This view return True/False, cause we use `return_ajax_status`
+    # view decorator.
+
+    item_location = request.GET.get('id')
+    if not item_location:
+        log.error('GET data without "id" property.')
+        raise Http404
+
+    try:
+        item = modulestore().get_item(item_location)
+    except (ItemNotFoundError, InvalidLocationError):
+        log.error("Can't find item by location.")
+        raise Http404
+
+    # Check permissions for this user within this course.
+    if not has_access(request.user, item_location):
+        raise PermissionDenied()
+
+    if item.category != 'videoalpha':
+        log.error('Subtitles are supported only for videoalpha" modules.')
+        raise Http404
+
+    try:
+        xmltree = etree.fromstring(item.data)
+    except etree.XMLSyntaxError:
+        log.error("Can't parse source XML.")
+        raise Http404
+
+    youtube_attr = xmltree.get('youtube')
+    sub_attr = xmltree.get('sub')
+
+    speed = 1
+    if youtube_attr:
+        try:
+            speed_subs = dict([
+                (float(i.split(':')[0]), i.split(':')[1])
+                for i in youtube_attr.split(',')
+            ])
+        except (IndexError, ValueError):
+            # Get `IndexError` if after splitting by ':' we have one item
+            # (missing ':' in the "youtube" attribute value).
+            # Get `ValueError` when after splitting by ':' key can't convert
+            # to float.
+            log.error('Bad "youtube" attribute.')
+            raise Http404
+
+        # Iterate from highest to lowest speed and try to find available
+        # subtitles in the store.
+        sjson_subtitles = None
+        youtube_id = None
+        for speed, youtube_id in sorted(speed_subs.iteritems(), reverse=True):
+            filename = 'subs_{0}.srt.sjson'.format(youtube_id)
+            content_location = StaticContent.compute_location(
+                item.location.org, item.location.course, filename)
+            try:
+                sjson_subtitles = contentstore().find(content_location)
+                break
+            except NotFoundError:
+                continue
+
+        if sjson_subtitles is None or youtube_id is None:
+            log.error("Can't find content in storage for youtube IDs.")
+            raise Http404
+
+        srt_file_name = youtube_id
+
+    elif sub_attr:
+        filename = 'subs_{0}.srt.sjson'.format(sub_attr)
+        content_location = StaticContent.compute_location(
+            item.location.org, item.location.course, filename)
+        try:
+            sjson_subtitles = contentstore().find(content_location)
+        except NotFoundError:
+            log.error("Can't find content in storage for non-youtube sub.")
+            raise Http404
+
+        srt_file_name = sub_attr
+    else:
+        log.error('Missing or blank "youtube" attribute and "source" tag.')
+        raise Http404
+
+    str_subs = generate_srt_from_sjson(json.loads(sjson_subtitles.data), speed)
+    if str_subs is None:
+        raise Http404
+
+    response = HttpResponse(str_subs, content_type='application/x-subrip')
+    response['Content-Disposition'] = 'attachment; filename="{0}.srt"'.format(
+        srt_file_name)
+
+    return response
+
+
 @login_required
 @expect_json
 def clone_item(request):
diff --git a/cms/urls.py b/cms/urls.py
index 04e72802f30e..7c76357e9c1c 100644
--- a/cms/urls.py
+++ b/cms/urls.py
@@ -25,6 +25,7 @@
     url(r'^reorder_static_tabs', 'contentstore.views.reorder_static_tabs', name='reorder_static_tabs'),
     url(r'^import_subtitles$', 'contentstore.views.import_subtitles', name='import_subtitles'),
     url(r'^upload_subtitles$', 'contentstore.views.upload_subtitles', name='upload_subtitles'),
+    url(r'^download_subtitles$', 'contentstore.views.download_subtitles', name='download_subtitles'),
 
     url(r'^(?P<org>[^/]+)/(?P<course>[^/]+)/course/(?P<name>[^/]+)$',
         'contentstore.views.course_index', name='course_index'),

From 5143b6f9b6d29b2576b473a23ec402b41101aa4f Mon Sep 17 00:00:00 2001
From: Vasyl Nakvasiuk <vaxxxa@gmail.com>
Date: Mon, 1 Jul 2013 13:38:18 +0300
Subject: [PATCH 10/30] download subtitles into studio: add python integration
 tests

---
 .../contentstore/tests/test_item.py           | 199 ++++++++++++++++++
 1 file changed, 199 insertions(+)

diff --git a/cms/djangoapps/contentstore/tests/test_item.py b/cms/djangoapps/contentstore/tests/test_item.py
index 8c20c24dd774..6693c8c4fbb3 100644
--- a/cms/djangoapps/contentstore/tests/test_item.py
+++ b/cms/djangoapps/contentstore/tests/test_item.py
@@ -2,12 +2,14 @@
 import os
 import json
 import tempfile
+from uuid import uuid4
 
 from lxml import etree
 from django.core.urlresolvers import reverse
 from django.template.defaultfilters import slugify
 
 from contentstore.tests.test_course_settings import CourseTestCase
+from cache_toolbox.core import del_cached_content
 from xmodule.modulestore.tests.factories import CourseFactory
 from xmodule.modulestore.django import modulestore
 from xmodule.contentstore.django import contentstore
@@ -466,3 +468,200 @@ def tearDown(self):
         self.good_srt_file.close()
         self.bad_data_srt_file.close()
         self.bad_name_srt_file.close()
+
+
+class DownloadSubtitles(BaseSubtitles):
+    """Tests for '/download_subtitles' url."""
+
+    def save_subs_to_store(self, subs, subs_id):
+        """Save subtitles into `StaticContent`."""
+        filedata = json.dumps(subs, indent=2)
+        mime_type = 'application/json'
+        filename = 'subs_{0}.srt.sjson'.format(subs_id)
+
+        content_location = StaticContent.compute_location(
+            self.org, self.number, filename)
+        content = StaticContent(content_location, filename, mime_type, filedata)
+        contentstore().save(content)
+        del_cached_content(content_location)
+        return content_location
+
+    def remove_subs_from_store(self, subs_id):
+        """Remove from store, if subtitles content exists."""
+        filename = 'subs_{0}.srt.sjson'.format(subs_id)
+        content_location = StaticContent.compute_location(
+            self.org, self.number, filename)
+        try:
+            content = contentstore().find(content_location)
+            contentstore().delete(content.get_id())
+        except NotFoundError:
+            pass
+
+    def test_success_download_youtube_speed_1(self):
+        data = '<videoalpha youtube="1:JMD_ifUUfsU" />'
+        modulestore().update_item(self.item_location, data)
+
+        subs = {
+            'start': [100, 200, 240],
+            'end': [200, 240, 380],
+            'text': [
+                'subs #1',
+                'subs #2',
+                'subs #3'
+            ]
+        }
+        self.save_subs_to_store(subs, 'JMD_ifUUfsU')
+
+        resp = self.client.get(
+            reverse('download_subtitles'), {'id': self.item_location})
+        self.assertEqual(resp.status_code, 200)
+
+    def test_success_download_youtube_speed_2(self):
+        data = '<videoalpha youtube="2:JMD_ifUUfsU" />'
+        modulestore().update_item(self.item_location, data)
+
+        subs = {
+            'start': [100, 200, 240],
+            'end': [200, 240, 380],
+            'text': [
+                'subs #1',
+                'subs #2',
+                'subs #3'
+            ]
+        }
+        self.save_subs_to_store(subs, 'JMD_ifUUfsU')
+
+        resp = self.client.get(
+            reverse('download_subtitles'), {'id': self.item_location})
+        self.assertEqual(resp.status_code, 200)
+
+    def test_success_download_nonyoutube(self):
+        subs_id = str(uuid4())
+        data = """
+<videoalpha youtube="" sub="{}">
+    <source src="http://www.quirksmode.org/html5/videos/big_buck_bunny.mp4"/>
+    <source src="http://www.quirksmode.org/html5/videos/big_buck_bunny.webm"/>
+    <source src="http://www.quirksmode.org/html5/videos/big_buck_bunny.ogv"/>
+</videoalpha>
+""".format(subs_id)
+        modulestore().update_item(self.item_location, data)
+
+        subs = {
+            'start': [100, 200, 240],
+            'end': [200, 240, 380],
+            'text': [
+                'subs #1',
+                'subs #2',
+                'subs #3'
+            ]
+        }
+        self.save_subs_to_store(subs, subs_id)
+
+        resp = self.client.get(
+            reverse('download_subtitles'), {'id': self.item_location})
+        self.assertEqual(resp.status_code, 200)
+
+        self.remove_subs_from_store(subs_id)
+
+    def test_fail_data_without_file(self):
+        resp = self.client.get(
+            reverse('download_subtitles'), {'id': ''})
+        self.assertEqual(resp.status_code, 404)
+
+        resp = self.client.get(
+            reverse('download_subtitles'), {})
+        self.assertEqual(resp.status_code, 404)
+
+    def test_fail_data_with_bad_location(self):
+        # Test for raising `InvalidLocationError` exception.
+        resp = self.client.get(
+            reverse('download_subtitles'), {'id': 'BAD_LOCATION'})
+        self.assertEqual(resp.status_code, 404)
+
+        # Test for raising `ItemNotFoundError` exception.
+        resp = self.client.get(
+            reverse('download_subtitles'),
+            {'id': '{0}_{1}'.format(self.item_location, 'BAD_LOCATION')})
+        self.assertEqual(resp.status_code, 404)
+
+    def test_fail_for_non_videoalpha_module(self):
+        # Video module: setup
+        data = {
+            'parent_location': str(self.course_location),
+            'template': 'i4x://edx/templates/video/default'
+        }
+        resp = self.client.post(reverse('clone_item'), data)
+        item_location = json.loads(resp.content).get('id')
+        data = '<video youtube="0.75:JMD_ifUUfsU,1.0:hI10vDNYz4M" />'
+        modulestore().update_item(item_location, data)
+
+        # Video module: testing
+        resp = self.client.get(
+            reverse('download_subtitles'), {'id': item_location})
+        self.assertEqual(resp.status_code, 404)
+
+    def test_fail_bad_xml(self):
+        data = '<<<videoalpha youtube="0.75:JMD_ifUUfsU,1.25:AKqURZnYqpk,1.50:DYpADpL7jAY" />'
+        modulestore().update_item(self.item_location, data)
+
+        resp = self.client.get(
+            reverse('download_subtitles'), {'id': self.item_location})
+        self.assertEqual(resp.status_code, 404)
+
+    def test_fail_bad_youtube_attr(self):
+        data = '<videoalpha youtube=":JMD_ifUUfsU,1.25:AKqURZnYqpk,1.50:DYpADpL7jAY" />'
+        modulestore().update_item(self.item_location, data)
+
+        resp = self.client.get(
+            reverse('download_subtitles'), {'id': self.item_location})
+        self.assertEqual(resp.status_code, 404)
+
+    def test_fail_youtube_subs_dont_exist(self):
+        resp = self.client.get(
+            reverse('download_subtitles'), {'id': self.item_location})
+        self.assertEqual(resp.status_code, 404)
+
+    def test_fail_nonyoutube_subs_dont_exist(self):
+        data = """
+<videoalpha youtube="" sub="UNDEFINED">
+    <source src="http://www.quirksmode.org/html5/videos/big_buck_bunny.mp4"/>
+    <source src="http://www.quirksmode.org/html5/videos/big_buck_bunny.webm"/>
+    <source src="http://www.quirksmode.org/html5/videos/big_buck_bunny.ogv"/>
+</videoalpha>
+"""
+        modulestore().update_item(self.item_location, data)
+
+        resp = self.client.get(
+            reverse('download_subtitles'), {'id': self.item_location})
+        self.assertEqual(resp.status_code, 404)
+
+    def test_empty_youtube_attr_and_sub_attr(self):
+        data = """
+<videoalpha youtube="">
+    <source src="http://www.quirksmode.org/html5/videos/big_buck_bunny.mp4"/>
+    <source src="http://www.quirksmode.org/html5/videos/big_buck_bunny.webm"/>
+    <source src="http://www.quirksmode.org/html5/videos/big_buck_bunny.ogv"/>
+</videoalpha>
+"""
+        modulestore().update_item(self.item_location, data)
+
+        resp = self.client.get(
+            reverse('download_subtitles'), {'id': self.item_location})
+        self.assertEqual(resp.status_code, 404)
+
+    def test_fail_bad_sjson_subs(self):
+        data = '<videoalpha youtube="1:JMD_ifUUfsU" />'
+        modulestore().update_item(self.item_location, data)
+
+        subs = {
+            'start': [100, 200, 240],
+            'end': [200, 240, 380],
+            'text': [
+                'subs #1'
+            ]
+        }
+        self.save_subs_to_store(subs, 'JMD_ifUUfsU')
+
+        resp = self.client.get(
+            reverse('download_subtitles'), {'id': self.item_location})
+        self.assertEqual(resp.status_code, 404)

From 5af2de8cc2ac259cea3c082a5211a34a0e2bbaba Mon Sep 17 00:00:00 2001
From: Vasyl Nakvasiuk <vaxxxa@gmail.com>
Date: Mon, 1 Jul 2013 11:57:03 +0300
Subject: [PATCH 11/30] download subtitles into studio: add python unit tests
 for utils functions

---
 .../contentstore/tests/test_utils.py          | 106 ++++++++++++++++++
 1 file changed, 106 insertions(+)

diff --git a/cms/djangoapps/contentstore/tests/test_utils.py b/cms/djangoapps/contentstore/tests/test_utils.py
index 249d3cbd2577..4b0e41e904cc 100644
--- a/cms/djangoapps/contentstore/tests/test_utils.py
+++ b/cms/djangoapps/contentstore/tests/test_utils.py
@@ -473,3 +473,109 @@ def test_fail_bad_subs_filedata(self):
             srt_filedata,
             self.course)
         self.assertFalse(status)
+
+
+class TestGenerateSrtFromSjson(TestDownloadYoutubeSubs):
+    """Tests for `generate_srt_from_sjson` function."""
+
+    def test_success_generating_subs(self):
+        sjson_subs = {
+            'start': [100, 200, 240, 390, 54000],
+            'end': [200, 240, 380, 1000, 78400],
+            'text': [
+                'subs #1',
+                'subs #2',
+                'subs #3',
+                'subs #4',
+                'subs #5'
+            ]
+        }
+        srt_subs = utils.generate_srt_from_sjson(sjson_subs, 1)
+        self.assertIsNotNone(srt_subs)
+        self.assertIn(
+            '00:00:00,100 --> 00:00:00,200\nsubs #1',
+            srt_subs)
+        self.assertIn(
+            '00:00:00,200 --> 00:00:00,240\nsubs #2',
+            srt_subs)
+        self.assertIn(
+            '00:00:00,240 --> 00:00:00,380\nsubs #3',
+            srt_subs)
+        self.assertIn(
+            '00:00:00,390 --> 00:00:01,000\nsubs #4',
+            srt_subs)
+        self.assertIn(
+            '00:00:54,000 --> 00:01:18,400\nsubs #5',
+            srt_subs)
+
+    def test_success_generating_subs_speed_up(self):
+        sjson_subs = {
+            'start': [100, 200, 240, 390, 54000],
+            'end': [200, 240, 380, 1000, 78400],
+            'text': [
+                'subs #1',
+                'subs #2',
+                'subs #3',
+                'subs #4',
+                'subs #5'
+            ]
+        }
+        srt_subs = utils.generate_srt_from_sjson(sjson_subs, 0.5)
+        self.assertIsNotNone(srt_subs)
+        self.assertIn(
+            '00:00:00,050 --> 00:00:00,100\nsubs #1',
+            srt_subs)
+        self.assertIn(
+            '00:00:00,100 --> 00:00:00,120\nsubs #2',
+            srt_subs)
+        self.assertIn(
+            '00:00:00,120 --> 00:00:00,190\nsubs #3',
+            srt_subs)
+        self.assertIn(
+            '00:00:00,195 --> 00:00:00,500\nsubs #4',
+            srt_subs)
+        self.assertIn(
+            '00:00:27,000 --> 00:00:39,200\nsubs #5',
+            srt_subs)
+
+    def test_success_generating_subs_speed_down(self):
+        sjson_subs = {
+            'start': [100, 200, 240, 390, 54000],
+            'end': [200, 240, 380, 1000, 78400],
+            'text': [
+                'subs #1',
+                'subs #2',
+                'subs #3',
+                'subs #4',
+                'subs #5'
+            ]
+        }
+        srt_subs = utils.generate_srt_from_sjson(sjson_subs, 2)
+        self.assertIsNotNone(srt_subs)
+        self.assertIn(
+            '00:00:00,200 --> 00:00:00,400\nsubs #1',
+            srt_subs)
+        self.assertIn(
+            '00:00:00,400 --> 00:00:00,480\nsubs #2',
+            srt_subs)
+        self.assertIn(
+            '00:00:00,480 --> 00:00:00,760\nsubs #3',
+            srt_subs)
+        self.assertIn(
+            '00:00:00,780 --> 00:00:02,000\nsubs #4',
+            srt_subs)
+        self.assertIn(
+            '00:01:48,000 --> 00:02:36,800\nsubs #5',
+            srt_subs)
+
+    def test_fail_generating_subs(self):
+        sjson_subs = {
+            'start': [100, 200],
+            'end': [100],
+            'text': [
+                'subs #1',
+                'subs #2'
+            ]
+        }
+        srt_subs = utils.generate_srt_from_sjson(sjson_subs, 1)
+        self.assertIsNone(srt_subs)

From 08c6658df87d3e56a22b579f1640632514c6a610 Mon Sep 17 00:00:00 2001
From: Vasyl Nakvasiuk <vaxxxa@gmail.com>
Date: Thu, 4 Jul 2013 11:01:53 +0300
Subject: [PATCH 12/30] Move subtitles to the edit tab

---
 .../coffee/src/views/videoalpha/import.coffee |  9 ++-
 cms/templates/widgets/edit.html               | 27 +++++++
 .../widgets/videoalpha/subtitles.html         |  8 +--
 .../xmodule/xmodule/css/videoalpha/edit.scss  | 70 +++++++++++++++++++
 .../xmodule/js/src/videoalpha/edit.coffee     | 44 ++++++++++++
 .../lib/xmodule/xmodule/videoalpha_module.py  | 24 +++++--
 6 files changed, 169 insertions(+), 13 deletions(-)
 create mode 100644 cms/templates/widgets/edit.html
 create mode 100644 common/lib/xmodule/xmodule/css/videoalpha/edit.scss
 create mode 100644 common/lib/xmodule/xmodule/js/src/videoalpha/edit.coffee

diff --git a/cms/static/coffee/src/views/videoalpha/import.coffee b/cms/static/coffee/src/views/videoalpha/import.coffee
index ae97ce278605..26562e1380ac 100644
--- a/cms/static/coffee/src/views/videoalpha/import.coffee
+++ b/cms/static/coffee/src/views/videoalpha/import.coffee
@@ -1,13 +1,13 @@
 class CMS.Views.SubtitlesImport extends Backbone.View
-  tagName: 'ul'
-  className: 'comp-subtitles-import-list'
+  tagName: "ul"
+  className: "comp-subtitles-import-list"
 
   initialize: ->
     _.bindAll(@)
     @component_id = @options.container
-      .closest('.component')
+      .closest(".component")
       .data('id')
-    @messages = new @options['msg']()
+    @messages = new @options["msg"]()
 
     @render()
 
@@ -19,7 +19,6 @@ class CMS.Views.SubtitlesImport extends Backbone.View
       msg: @messages
       $container: @$el
     )
-
     modules = @options.modules
     $.each modules, (index) ->
       new modules[index](options)
\ No newline at end of file
diff --git a/cms/templates/widgets/edit.html b/cms/templates/widgets/edit.html
new file mode 100644
index 000000000000..9655cb821d78
--- /dev/null
+++ b/cms/templates/widgets/edit.html
@@ -0,0 +1,27 @@
+<%! from django.utils.translation import ugettext as _ %>
+<div class="wrapper-comp-editor" id="editor-tab">
+    <section class="editor">
+  % if tabs.items():
+      <ul class="editor-tabs">
+        <li><a href="#advanced" class="tab current" data-tab="advanced">${_("HTML")}</a></li>
+    % for tab_name, tab_content in tabs.items():
+        <li><a href="#tab-${loop.index}" class="tab">${tab_name}</a></li>
+    % endfor
+      </ul>
+      <div class="tabs-wrapper">
+  % else:
+    <div>
+  % endif
+        <div class="component-tab" id="advanced">
+          <textarea class="edit-box">${data | h}</textarea>
+        </div>
+       % for tab_name, tab_content in tabs.items():
+        <div class="wrapper-comp-${tab_name.lower() | entity} component-edit-tab component-tab is-inactive" id="tab-${loop.index}">
+            <%include file="${tab_content}"/>
+        </div>
+        % endfor
+      </div>
+    </section>
+</div>
+
+<%include file="metadata-edit.html" />
diff --git a/cms/templates/widgets/videoalpha/subtitles.html b/cms/templates/widgets/videoalpha/subtitles.html
index 09fb089d3fd7..903cfc05304e 100644
--- a/cms/templates/widgets/videoalpha/subtitles.html
+++ b/cms/templates/widgets/videoalpha/subtitles.html
@@ -1,20 +1,20 @@
 <%! from django.utils.translation import ugettext as _ %>
 <%namespace name='static' file='../../static_content.html'/>
 
-<div class="field comp-subtitles-entry" id="comp-subtitles-${component_location_html_id}"></div>
+<div class="field comp-subtitles-entry" id="comp-subtitles-${html_id}"></div>
 
 <script type="text/javascript" src="${static.url('coffee/src/views/videoalpha/subtitles_import.js')}"></script>
 
-<script id="subtitles-import-from-file-${component_location_html_id}-tpl" type="text/template">
+<script id="subtitles-import-from-file-${html_id}-tpl" type="text/template">
     <%static:include path="js/videoalpha/subtitles-import-file.underscore" />
 </script>
 
 <script type='text/javascript'>
     $(document).ready(function(){
         new CMS.Views.SubtitlesImport({
-            container: $('#comp-subtitles-${component_location_html_id}'),
+            container: $('#comp-subtitles-${html_id}'),
             tpl: {
-                file: _.template($('#subtitles-import-from-file-${component_location_html_id}-tpl').text())
+                file: _.template($('#subtitles-import-from-file-${html_id}-tpl').text())
 
             },
             msg: CMS.Views.SubtitlesMessages,
diff --git a/common/lib/xmodule/xmodule/css/videoalpha/edit.scss b/common/lib/xmodule/xmodule/css/videoalpha/edit.scss
new file mode 100644
index 000000000000..72f19401b7f1
--- /dev/null
+++ b/common/lib/xmodule/xmodule/css/videoalpha/edit.scss
@@ -0,0 +1,70 @@
+//Videoalpha component editor
+.component-tab{
+  background: $white;
+  padding: 20px;
+  position: relative;
+  border-top: 1px solid #8891a1;
+
+  &#advanced{
+    padding: 0;
+    border: none;
+  }
+    .blue-button{
+      @include blue-button;
+    }
+}
+
+.editor{
+  @include clearfix();
+
+  .CodeMirror {
+    @include box-sizing(border-box);
+    width: 100%;
+    position: relative;
+    height: 379px;
+    border: 1px solid #3c3c3c;
+    border-top: 1px solid #8891a1;
+    background: $white;
+    color: #3c3c3c;
+  }
+
+  .CodeMirror-scroll {
+    height: 100%;
+  }
+
+  .editor-tabs {
+    top: 11px !important;
+    right: 10px;
+    z-index: 99;
+  }
+
+  .is-inactive {
+    display: none;
+  }
+
+  .comp-subtitles-entry{
+    text-align: center;
+    .file-upload{
+      display: none;
+    }
+    .comp-subtitles-import-list{
+      > li{
+        display: block;
+        margin: $baseline/2 0px $baseline/2 0;
+      }
+
+      .blue-button{
+        font-size: 1em;
+        display: block;
+        width: 70%;
+        margin: 0 auto;
+        text-align: center;
+      }
+    }
+  }
+}
+
+.tabs-wrapper{
+  padding-top: 46px;
+  position: relative;
+}
\ No newline at end of file
diff --git a/common/lib/xmodule/xmodule/js/src/videoalpha/edit.coffee b/common/lib/xmodule/xmodule/js/src/videoalpha/edit.coffee
new file mode 100644
index 000000000000..bf9268033ef5
--- /dev/null
+++ b/common/lib/xmodule/xmodule/js/src/videoalpha/edit.coffee
@@ -0,0 +1,44 @@
+class @VideoAlphaEditorTabs
+  @isInactiveClass : "is-inactive"
+
+  constructor: (element) ->
+    @element = element;
+    @$tabs = $(".tab", @element)
+    @$content = $(".component-tab", @element)
+
+    editBox = $(".edit-box", @element)[0]
+    if editBox
+      @advanced_editor = CodeMirror.fromTextArea(editBox, {
+        mode: "text/html"
+        lineNumbers: true
+        lineWrapping: true
+      })
+    @element.on('click', '.editor-tabs .tab', @onSwitchEditor)
+
+   onSwitchEditor: (e) =>
+    e.preventDefault();
+
+    isInactiveClass = HTMLEditingDescriptor.isInactiveClass
+    $currentTarget = $(e.currentTarget)
+    if not $currentTarget.hasClass('current')
+
+      @$tabs.removeClass('current')
+      $currentTarget.addClass('current')
+
+      # Tabs are implemeted like anchors. Therefore we can use hash to find corresponding content
+      hash = $currentTarget.attr('href')
+      @$content
+        .addClass(isInactiveClass)
+        .filter(hash)
+        .removeClass(isInactiveClass)
+
+      if $currentTarget.data('tab') is 'advanced' and @advanced_editor
+        @showAdvancedEditor()
+
+  # Show the Advanced (codemirror) Editor. Pulled out as a helper method for unit testing.
+  showAdvancedEditor: () ->
+    @advanced_editor.focus()
+
+  save: ->
+    @element.off('click', '.editor-tabs .tab', @onSwitchEditor)
+    data: @advanced_editor.getValue()
\ No newline at end of file
diff --git a/common/lib/xmodule/xmodule/videoalpha_module.py b/common/lib/xmodule/xmodule/videoalpha_module.py
index 69d55eadf230..29b8e97606a1 100644
--- a/common/lib/xmodule/xmodule/videoalpha_module.py
+++ b/common/lib/xmodule/xmodule/videoalpha_module.py
@@ -20,7 +20,7 @@
 from django.conf import settings
 
 from xmodule.x_module import XModule
-from xmodule.raw_module import RawDescriptor
+from xmodule.editing_module import EditingDescriptor
 from xmodule.modulestore.mongo import MongoModuleStore
 from xmodule.modulestore.django import modulestore
 from xmodule.contentstore.content import StaticContent
@@ -148,6 +148,7 @@ def get_html(self):
 
         return self.system.render_template('videoalpha.html', {
             'youtube_streams': self.youtube_streams,
+            'component_location': self.location,
             'id': self.location.html_id(),
             'sub': self.sub,
             'sources': self.sources,
@@ -164,9 +165,24 @@ def get_html(self):
         })
 
 
-class VideoAlphaDescriptor(VideoAlphaFields, RawDescriptor):
+class VideoAlphaDescriptor(VideoAlphaFields, EditingDescriptor):
     """Descriptor for `VideoAlphaModule`."""
     module_class = VideoAlphaModule
     template_dir_name = "videoalpha"
-    # mako_template = "widgets/html-subtitles.html"
-    tabs = {'Subtitles': "widgets/videoalpha/subtitles.html"}
+    mako_template = "widgets/edit.html"
+    js = {'coffee': [resource_string(__name__, 'js/src/videoalpha/edit.coffee')]}
+    js_module_name = "VideoAlphaEditorTabs"
+    css = {'scss': [resource_string(__name__, 'css/editor/edit.scss'), resource_string(__name__, 'css/videoalpha/edit.scss')]}
+
+    def get_context(self):
+        context = super(VideoAlphaDescriptor, self).get_context()
+        tabs = {
+            'Subtitles': "videoalpha/subtitles.html"
+        }
+        context.update({
+            'tabs': tabs,
+            'id': self.location,
+            'html_id': self.location.html_id()
+
+        })
+        return context

From fcd81c0010045b7a7377ba4c30905a56ced2fca9 Mon Sep 17 00:00:00 2001
From: Anton Stupak <s2pak.anton@gmail.com>
Date: Thu, 27 Jun 2013 18:19:43 +0300
Subject: [PATCH 13/30] Add tests for CMS.Views.SubtitlesImport

---
 .../spec/views/videoalpha/import.coffee       | 55 +++++++++++++++++++
 1 file changed, 55 insertions(+)
 create mode 100644 cms/static/coffee/spec/views/videoalpha/import.coffee

diff --git a/cms/static/coffee/spec/views/videoalpha/import.coffee b/cms/static/coffee/spec/views/videoalpha/import.coffee
new file mode 100644
index 000000000000..243203a2371d
--- /dev/null
+++ b/cms/static/coffee/spec/views/videoalpha/import.coffee
@@ -0,0 +1,55 @@
+describe "CMS.Views.SubtitlesImport", ->
+  beforeEach ->
+    # @stubModule = jasmine.createSpy("CMS.Models.Module")
+    # @stubModule.id = 'stub-id'
+    @message = jasmine.createSpy("CMS.Views.SubtitlesMessages")
+    @importFile = jasmine.createSpy("CMS.Views.SubtitlesImportFile")
+    @importYT = jasmine.createSpy("CMS.Views.SubtitlesImportYT")
+
+    @component_location = "component_location"
+
+    @options =
+      container: $("#comp-subtitles-#{@component_location}_html_id")
+      msg: @message
+      modules: [
+        @importFile,
+        @importYT
+      ]
+
+    setFixtures """
+    <div class="component" data-id="#{@component_location}">
+      <div class="field comp-subtitles-entry" id="comp-subtitles-#{@component_location}_html_id">
+      </div>
+    </div>
+    """
+
+    spyOn(CMS.Views.SubtitlesImport.prototype, 'render').andCallThrough()
+    @SubtitlesImport = new CMS.Views.SubtitlesImport @options
+
+  describe "class definition", ->
+    it "sets the correct tagName", ->
+      expect(@SubtitlesImport.tagName).toEqual("ul")
+
+    it "sets the correct className", ->
+      expect(@SubtitlesImport.className).toEqual("comp-subtitles-import-list")
+
+  describe "methods", ->
+    describe "initialize", ->
+      it "render the module", ->
+        expect(CMS.Views.SubtitlesImport.prototype.render).toHaveBeenCalled()
+
+      it "message module to be initialized", ->
+        expect(@message).toHaveBeenCalled()
+
+    describe "render", ->
+      it "submodules to be initialized", ->
+        options = $.extend(true, {}, @options, {
+            component_id: @component_location
+            $container: @SubtitlesImport.$el
+          }
+        )
+
+        $.each @options.modules, (index, module) ->
+          console.log options
+          expect(module).toHaveBeenCalled()
+          # expect(module).toHaveBeenCalledWith options

From f9c1b6d00df1a143f88c3e6ce95f75808f78263b Mon Sep 17 00:00:00 2001
From: Anton Stupak <s2pak.anton@gmail.com>
Date: Fri, 28 Jun 2013 15:44:23 +0300
Subject: [PATCH 14/30] Add tests for CMS.Views.SubtitlesImportFile

---
 .../spec/views/videoalpha/import.coffee       |  33 ++--
 .../spec/views/videoalpha/import/file.coffee  | 177 ++++++++++++++++++
 .../src/views/videoalpha/import/file.coffee   |   8 +-
 .../src/views/videoalpha/messages.coffee      |   3 +
 4 files changed, 202 insertions(+), 19 deletions(-)
 create mode 100644 cms/static/coffee/spec/views/videoalpha/import/file.coffee

diff --git a/cms/static/coffee/spec/views/videoalpha/import.coffee b/cms/static/coffee/spec/views/videoalpha/import.coffee
index 243203a2371d..7c204b033cbb 100644
--- a/cms/static/coffee/spec/views/videoalpha/import.coffee
+++ b/cms/static/coffee/spec/views/videoalpha/import.coffee
@@ -1,28 +1,26 @@
 describe "CMS.Views.SubtitlesImport", ->
   beforeEach ->
-    # @stubModule = jasmine.createSpy("CMS.Models.Module")
-    # @stubModule.id = 'stub-id'
+    @html_id = "html_id"
+
     @message = jasmine.createSpy("CMS.Views.SubtitlesMessages")
     @importFile = jasmine.createSpy("CMS.Views.SubtitlesImportFile")
     @importYT = jasmine.createSpy("CMS.Views.SubtitlesImportYT")
 
-    @component_location = "component_location"
+    setFixtures """
+    <div class="component" data-id="#{@html_id}">
+      <div class="field comp-subtitles-entry" id="comp-subtitles-#{@html_id}">
+      </div>
+    </div>
+    """
 
     @options =
-      container: $("#comp-subtitles-#{@component_location}_html_id")
+      container: $("#comp-subtitles-#{@html_id}")
       msg: @message
       modules: [
         @importFile,
         @importYT
       ]
 
-    setFixtures """
-    <div class="component" data-id="#{@component_location}">
-      <div class="field comp-subtitles-entry" id="comp-subtitles-#{@component_location}_html_id">
-      </div>
-    </div>
-    """
-
     spyOn(CMS.Views.SubtitlesImport.prototype, 'render').andCallThrough()
     @SubtitlesImport = new CMS.Views.SubtitlesImport @options
 
@@ -42,14 +40,19 @@ describe "CMS.Views.SubtitlesImport", ->
         expect(@message).toHaveBeenCalled()
 
     describe "render", ->
+      it "element is added into the DOM", ->
+        expect(@options.container).toContain(@SubtitlesImport.$el)
+
+      it "element is added with correct className", ->
+        expect(@SubtitlesImport.$el).toHaveClass(@SubtitlesImport.className)
+
       it "submodules to be initialized", ->
         options = $.extend(true, {}, @options, {
-            component_id: @component_location
+            component_id: @html_id
+            msg: @SubtitlesImport.messages
             $container: @SubtitlesImport.$el
           }
         )
 
         $.each @options.modules, (index, module) ->
-          console.log options
-          expect(module).toHaveBeenCalled()
-          # expect(module).toHaveBeenCalledWith options
+          expect(module).toHaveBeenCalledWith options
diff --git a/cms/static/coffee/spec/views/videoalpha/import/file.coffee b/cms/static/coffee/spec/views/videoalpha/import/file.coffee
new file mode 100644
index 000000000000..d901de189fad
--- /dev/null
+++ b/cms/static/coffee/spec/views/videoalpha/import/file.coffee
@@ -0,0 +1,177 @@
+describe "CMS.Views.SubtitlesImportFile", ->
+  beforeEach ->
+    @html_id = "html_id"
+
+    $.fn.ajaxSubmit = jasmine.createSpy('$.fn.ajaxSubmit')
+    @message = jasmine.createSpyObj("CMS.Views.SubtitlesMessages", [
+      'render',
+      'findEl'
+    ])
+
+    setFixtures """
+    <ul class="comp-subtitles-import-list"></ul>
+    """
+    @options =
+      component_id: @html_id
+      msg: @message
+      $container: $(".comp-subtitles-import-list")
+      tpl:
+        file: _.template """
+          <div id="test_el"></div>
+          <form action="#" class="file-upload">
+            <input class="file-input" type="file" />
+          </form>
+        """
+
+  describe "class definition", ->
+    beforeEach ->
+      @view = new CMS.Views.SubtitlesImportFile @options
+
+    it "sets the correct tagName", ->
+      expect(@view.tagName).toEqual("li")
+
+    it "sets the correct className", ->
+      expect(@view.className).toEqual("import-file")
+
+  describe "methods", ->
+    describe "initialize", ->
+      beforeEach ->
+        spyOn(CMS.Views.SubtitlesImportFile.prototype, 'render').andCallThrough()
+        @view = new CMS.Views.SubtitlesImportFile @options
+      it "render the module", ->
+        expect(CMS.Views.SubtitlesImportFile.prototype.render).toHaveBeenCalled()
+
+    describe "render", ->
+      describe "if all required params exist", ->
+        beforeEach ->
+          @view = new CMS.Views.SubtitlesImportFile @options
+
+        it "element is added into the DOM", ->
+            expect(@options.$container).toContain(@view.$el)
+
+        it "template is added into the DOM", ->
+          expect(@options.$container).toContain('#test_el')
+
+      describe "if params doesn't exist", ->
+        beforeEach ->
+          @options.tpl = null
+          spyOn(window.console, "error")
+          @view = new CMS.Views.SubtitlesImportFile @options
+
+        it "template doesn't exist", ->
+          expect(console.error).toHaveBeenCalledWith("Couldn't load template for file uploader")
+
+    describe "import", ->
+      beforeEach ->
+        @view = new CMS.Views.SubtitlesImportFile @options
+
+      it "files exist", ->
+        @view.files = [{name: "name"}]
+        @view.import()
+        expect($.fn.ajaxSubmit).toHaveBeenCalledWith(
+          beforeSend: @view.xhrResetProgressBar
+          uploadProgress: @view.xhrProgressHandler
+          complete: @view.xhrCompleteHandler
+        )
+
+      it "files doesn't exist", ->
+        @view.files = []
+        @view.import()
+        expect($.fn.ajaxSubmit).not.toHaveBeenCalled()
+
+    describe "events", ->
+      beforeEach ->
+        @view = new CMS.Views.SubtitlesImportFile @options
+
+      it "on change file", ->
+        expect(@view.$el).toHandle("change")
+
+      it "click on 'Upload from file' button", ->
+        expect(@view.$el).toHandle("click")
+
+    describe "handlers", ->
+      beforeEach ->
+        @view = new CMS.Views.SubtitlesImportFile @options
+
+      describe "xhrResetProgressBar", ->
+        it "show message", ->
+          @view.files = [{name: "name"}]
+          options = {
+            intent: 'warning'
+            title: gettext("Uploading...")
+            message: """
+              <span class=\"file-name\">#{@view.files[0].name}</span>
+              <span class=\"progress-bar\">
+                  <span class=\"progress-fill\"></span>
+              </span>
+            """
+          }
+          @view.xhrResetProgressBar()
+          expect(@message.render).toHaveBeenCalledWith(null, options)
+
+      describe "xhrProgressHandler", ->
+        it "show correct percentage", ->
+          percentVal = 10
+          @view.$progressFill = $('#test_el')
+          @view.xhrProgressHandler(null, null, null, percentVal)
+          percentage = @view.$progressFill.html()
+          expect(percentage).toBe(percentVal + "%")
+
+      describe "xhrCompleteHandler", ->
+        it "show success message", ->
+          xhr = {
+            status : 200
+            responseText : JSON.stringify({
+              success: true
+            })
+          }
+          @view.xhrCompleteHandler(xhr)
+          expect(@message.render).toHaveBeenCalledWith('success')
+
+        describe "show error message", ->
+
+          it "if status is not 200", ->
+            xhr = {
+              status : 404
+              responseText : JSON.stringify({
+                success: true
+              })
+            }
+            @view.xhrCompleteHandler(xhr)
+            expect(@message.render).toHaveBeenCalledWith('error')
+
+          it "if success flag is false", ->
+            xhr = {
+              status : 200
+              responseText : JSON.stringify({
+                success: false
+              })
+            }
+            @view.xhrCompleteHandler(xhr)
+            expect(@message.render).toHaveBeenCalledWith('error')
+
+      describe "clickHandler", ->
+        it "should preventDefault", ->
+          spyOnEvent("#import-from-file", "click")
+          @view.$("#import-from-file").click()
+          expect("click").toHaveBeenPreventedOn("#import-from-file")
+
+        it "value of input type file should be empty", ->
+          @view.$("#import-from-file").click()
+          expect(@view.$fileInput).toHaveValue('')
+
+      describe "changeHadler", ->
+        it "should preventDefault", ->
+          spyOnEvent(".file-input", "change")
+          @view.$fileInput.change()
+          expect("change").toHaveBeenPreventedOn(".file-input")
+
+        it "show warning message", ->
+          @view.$fileInput.trigger("change")
+          options =
+            title: gettext("Are you sure that you want to upload the subtitle file?")
+            actions:
+              primary:
+                click: @view.importHandler
+          expect(@message.render).toHaveBeenCalledWith("warn", options)
+
diff --git a/cms/static/coffee/src/views/videoalpha/import/file.coffee b/cms/static/coffee/src/views/videoalpha/import/file.coffee
index 1f80e6c3ce37..caaa37fdcd77 100644
--- a/cms/static/coffee/src/views/videoalpha/import/file.coffee
+++ b/cms/static/coffee/src/views/videoalpha/import/file.coffee
@@ -16,7 +16,7 @@ class CMS.Views.SubtitlesImportFile extends Backbone.View
 
   render: ->
     container = @options.$container
-    tpl = @options.tpl.file
+    tpl = @options.tpl.file if @options.tpl
 
     if not tpl
         console.error("Couldn't load template for file uploader")
@@ -72,14 +72,14 @@ class CMS.Views.SubtitlesImportFile extends Backbone.View
     @messages.render(null,
       intent: 'warning'
       title: gettext("Uploading...")
-      message: "
+      message: """
         <span class=\"file-name\">#{@files[0].name}</span>
         <span class=\"progress-bar\">
             <span class=\"progress-fill\"></span>
         </span>
-      "
+      """
     )
-    @$progressFill = @messages.prompt.$el.find('.progress-fill')
+    @$progressFill = @messages.findEl('.progress-fill')
 
   xhrProgressHandler: (event, position, total, percentComplete) ->
     percentVal = percentComplete + '%'
diff --git a/cms/static/coffee/src/views/videoalpha/messages.coffee b/cms/static/coffee/src/views/videoalpha/messages.coffee
index e40664ed0a0c..a6f1f3612ae2 100644
--- a/cms/static/coffee/src/views/videoalpha/messages.coffee
+++ b/cms/static/coffee/src/views/videoalpha/messages.coffee
@@ -54,3 +54,6 @@ class CMS.Views.SubtitlesMessages extends  Backbone.View
   hide: (event) ->
     event.preventDefault() if event
     @prompt.hide()
+
+  findEl: (selector) ->
+    @prompt.$el.find(selector) if @prompt

From f05fa3c11f9264a08ee3d5029dc82d50e9ef2261 Mon Sep 17 00:00:00 2001
From: Anton Stupak <s2pak.anton@gmail.com>
Date: Fri, 28 Jun 2013 16:38:56 +0300
Subject: [PATCH 15/30] Add tests for CMS.Views.SubtitlesImportYT

---
 .../spec/views/videoalpha/import/yt.coffee    | 116 ++++++++++++++++++
 .../src/views/videoalpha/import/yt.coffee     |   4 +-
 2 files changed, 118 insertions(+), 2 deletions(-)
 create mode 100644 cms/static/coffee/spec/views/videoalpha/import/yt.coffee

diff --git a/cms/static/coffee/spec/views/videoalpha/import/yt.coffee b/cms/static/coffee/spec/views/videoalpha/import/yt.coffee
new file mode 100644
index 000000000000..c5c5053b1f8b
--- /dev/null
+++ b/cms/static/coffee/spec/views/videoalpha/import/yt.coffee
@@ -0,0 +1,116 @@
+describe "CMS.Views.SubtitlesImportYT", ->
+  beforeEach ->
+    @html_id = "html_id"
+
+    spyOn($, 'ajax')
+    @message = jasmine.createSpyObj("CMS.Views.SubtitlesMessages", [
+      'render'
+    ])
+
+    setFixtures """
+    <ul class="comp-subtitles-import-list"></ul>
+    """
+    @options =
+      component_id: @html_id
+      msg: @message
+      $container: $(".comp-subtitles-import-list")
+
+  describe "class definition", ->
+    beforeEach ->
+      @view = new CMS.Views.SubtitlesImportYT @options
+
+    it "sets the correct tagName", ->
+      expect(@view.tagName).toEqual("li")
+
+    it "sets the correct className", ->
+      expect(@view.className).toEqual("import-youtube")
+
+  describe "methods", ->
+    describe "initialize", ->
+      beforeEach ->
+        spyOn(CMS.Views.SubtitlesImportYT.prototype, 'render').andCallThrough()
+        @view = new CMS.Views.SubtitlesImportYT @options
+      it "render the module", ->
+        expect(CMS.Views.SubtitlesImportYT.prototype.render).toHaveBeenCalled()
+
+    describe "render", ->
+      beforeEach ->
+        @view = new CMS.Views.SubtitlesImportYT @options
+
+      it "element is added into the DOM", ->
+          expect(@options.$container).toContain(@view.$el)
+
+      it "button is added", ->
+        expect(@view.$el).toContain('a')
+
+    describe "import", ->
+      beforeEach ->
+        @view = new CMS.Views.SubtitlesImportYT @options
+
+      it "show wait message", ->
+        @view.import()
+        expect(@message.render).toHaveBeenCalledWith('wait')
+
+      it "ajax is called", ->
+        option =
+          url: @view.url
+          type: "POST"
+          dataType: "json"
+          contentType: "application/json"
+          timeout: 1000*60
+          data: JSON.stringify(
+              'id': @html_id
+          )
+          success: @view.xhrSuccessHandler
+          error: @view.xhrErrorHandler
+
+        @view.import()
+        expect($.ajax).toHaveBeenCalledWith(option)
+
+    describe "events", ->
+      beforeEach ->
+        @view = new CMS.Views.SubtitlesImportYT @options
+
+      it "click on 'Import from Youtube' button", ->
+        expect(@view.$el).toHandle("click")
+
+    describe "handlers", ->
+      beforeEach ->
+        @view = new CMS.Views.SubtitlesImportYT @options
+
+      describe "clickHandler", ->
+        it "should preventDefault", ->
+          spyOnEvent("#import-from-youtube", "click")
+          @view.$("#import-from-youtube").click()
+          expect("click").toHaveBeenPreventedOn("#import-from-youtube")
+
+        it "show warn message", ->
+          options =
+            title: gettext('''
+              Are you sure that you want to import the subtitle file
+              found on YouTube?
+            ''')
+            actions:
+              primary:
+                click: @view.importHandler
+
+          @view.$('#import-from-youtube').click()
+          expect(@message.render).toHaveBeenCalledWith("warn", options)
+
+      describe "xhrErrorHandler", ->
+        it "show error message", ->
+          @view.xhrErrorHandler()
+          expect(@message.render).toHaveBeenCalledWith("error")
+
+      describe "xhrSuccessHandler", ->
+        it "show success message", ->
+          @view.xhrSuccessHandler({
+            success: true
+          })
+          expect(@message.render).toHaveBeenCalledWith("success")
+
+        it "show error message", ->
+          @view.xhrSuccessHandler({
+            success: false
+          })
+          expect(@message.render).toHaveBeenCalledWith("error")
diff --git a/cms/static/coffee/src/views/videoalpha/import/yt.coffee b/cms/static/coffee/src/views/videoalpha/import/yt.coffee
index 1bc736b426de..b544372cdf79 100644
--- a/cms/static/coffee/src/views/videoalpha/import/yt.coffee
+++ b/cms/static/coffee/src/views/videoalpha/import/yt.coffee
@@ -61,6 +61,6 @@ class CMS.Views.SubtitlesImportYT extends Backbone.View
           data: JSON.stringify(
               'id': @options.component_id
           )
+          success: @xhrSuccessHandler
+          error: @xhrErrorHandler
       )
-      .success(@xhrSuccessHandler)
-      .error(@xhrErrorHandler)

From 84a27397c5f3077ea1e8ef01381ab97ed49496c1 Mon Sep 17 00:00:00 2001
From: Anton Stupak <s2pak.anton@gmail.com>
Date: Mon, 1 Jul 2013 12:47:27 +0300
Subject: [PATCH 16/30] Add download subtitles button

---
 .../spec/views/videoalpha/import/file.coffee  | 177 ------------------
 .../spec/views/videoalpha/import/yt.coffee    | 116 ------------
 .../submodules/download_subtitles.coffee      |  23 +++
 .../{import => submodules}/file.coffee        |   0
 .../{import => submodules}/yt.coffee          |   1 -
 .../widgets/videoalpha/subtitles.html         |   3 +-
 6 files changed, 25 insertions(+), 295 deletions(-)
 delete mode 100644 cms/static/coffee/spec/views/videoalpha/import/file.coffee
 delete mode 100644 cms/static/coffee/spec/views/videoalpha/import/yt.coffee
 create mode 100644 cms/static/coffee/src/views/videoalpha/submodules/download_subtitles.coffee
 rename cms/static/coffee/src/views/videoalpha/{import => submodules}/file.coffee (100%)
 rename cms/static/coffee/src/views/videoalpha/{import => submodules}/yt.coffee (99%)

diff --git a/cms/static/coffee/spec/views/videoalpha/import/file.coffee b/cms/static/coffee/spec/views/videoalpha/import/file.coffee
deleted file mode 100644
index d901de189fad..000000000000
--- a/cms/static/coffee/spec/views/videoalpha/import/file.coffee
+++ /dev/null
@@ -1,177 +0,0 @@
-describe "CMS.Views.SubtitlesImportFile", ->
-  beforeEach ->
-    @html_id = "html_id"
-
-    $.fn.ajaxSubmit = jasmine.createSpy('$.fn.ajaxSubmit')
-    @message = jasmine.createSpyObj("CMS.Views.SubtitlesMessages", [
-      'render',
-      'findEl'
-    ])
-
-    setFixtures """
-    <ul class="comp-subtitles-import-list"></ul>
-    """
-    @options =
-      component_id: @html_id
-      msg: @message
-      $container: $(".comp-subtitles-import-list")
-      tpl:
-        file: _.template """
-          <div id="test_el"></div>
-          <form action="#" class="file-upload">
-            <input class="file-input" type="file" />
-          </form>
-        """
-
-  describe "class definition", ->
-    beforeEach ->
-      @view = new CMS.Views.SubtitlesImportFile @options
-
-    it "sets the correct tagName", ->
-      expect(@view.tagName).toEqual("li")
-
-    it "sets the correct className", ->
-      expect(@view.className).toEqual("import-file")
-
-  describe "methods", ->
-    describe "initialize", ->
-      beforeEach ->
-        spyOn(CMS.Views.SubtitlesImportFile.prototype, 'render').andCallThrough()
-        @view = new CMS.Views.SubtitlesImportFile @options
-      it "render the module", ->
-        expect(CMS.Views.SubtitlesImportFile.prototype.render).toHaveBeenCalled()
-
-    describe "render", ->
-      describe "if all required params exist", ->
-        beforeEach ->
-          @view = new CMS.Views.SubtitlesImportFile @options
-
-        it "element is added into the DOM", ->
-            expect(@options.$container).toContain(@view.$el)
-
-        it "template is added into the DOM", ->
-          expect(@options.$container).toContain('#test_el')
-
-      describe "if params doesn't exist", ->
-        beforeEach ->
-          @options.tpl = null
-          spyOn(window.console, "error")
-          @view = new CMS.Views.SubtitlesImportFile @options
-
-        it "template doesn't exist", ->
-          expect(console.error).toHaveBeenCalledWith("Couldn't load template for file uploader")
-
-    describe "import", ->
-      beforeEach ->
-        @view = new CMS.Views.SubtitlesImportFile @options
-
-      it "files exist", ->
-        @view.files = [{name: "name"}]
-        @view.import()
-        expect($.fn.ajaxSubmit).toHaveBeenCalledWith(
-          beforeSend: @view.xhrResetProgressBar
-          uploadProgress: @view.xhrProgressHandler
-          complete: @view.xhrCompleteHandler
-        )
-
-      it "files doesn't exist", ->
-        @view.files = []
-        @view.import()
-        expect($.fn.ajaxSubmit).not.toHaveBeenCalled()
-
-    describe "events", ->
-      beforeEach ->
-        @view = new CMS.Views.SubtitlesImportFile @options
-
-      it "on change file", ->
-        expect(@view.$el).toHandle("change")
-
-      it "click on 'Upload from file' button", ->
-        expect(@view.$el).toHandle("click")
-
-    describe "handlers", ->
-      beforeEach ->
-        @view = new CMS.Views.SubtitlesImportFile @options
-
-      describe "xhrResetProgressBar", ->
-        it "show message", ->
-          @view.files = [{name: "name"}]
-          options = {
-            intent: 'warning'
-            title: gettext("Uploading...")
-            message: """
-              <span class=\"file-name\">#{@view.files[0].name}</span>
-              <span class=\"progress-bar\">
-                  <span class=\"progress-fill\"></span>
-              </span>
-            """
-          }
-          @view.xhrResetProgressBar()
-          expect(@message.render).toHaveBeenCalledWith(null, options)
-
-      describe "xhrProgressHandler", ->
-        it "show correct percentage", ->
-          percentVal = 10
-          @view.$progressFill = $('#test_el')
-          @view.xhrProgressHandler(null, null, null, percentVal)
-          percentage = @view.$progressFill.html()
-          expect(percentage).toBe(percentVal + "%")
-
-      describe "xhrCompleteHandler", ->
-        it "show success message", ->
-          xhr = {
-            status : 200
-            responseText : JSON.stringify({
-              success: true
-            })
-          }
-          @view.xhrCompleteHandler(xhr)
-          expect(@message.render).toHaveBeenCalledWith('success')
-
-        describe "show error message", ->
-
-          it "if status is not 200", ->
-            xhr = {
-              status : 404
-              responseText : JSON.stringify({
-                success: true
-              })
-            }
-            @view.xhrCompleteHandler(xhr)
-            expect(@message.render).toHaveBeenCalledWith('error')
-
-          it "if success flag is false", ->
-            xhr = {
-              status : 200
-              responseText : JSON.stringify({
-                success: false
-              })
-            }
-            @view.xhrCompleteHandler(xhr)
-            expect(@message.render).toHaveBeenCalledWith('error')
-
-      describe "clickHandler", ->
-        it "should preventDefault", ->
-          spyOnEvent("#import-from-file", "click")
-          @view.$("#import-from-file").click()
-          expect("click").toHaveBeenPreventedOn("#import-from-file")
-
-        it "value of input type file should be empty", ->
-          @view.$("#import-from-file").click()
-          expect(@view.$fileInput).toHaveValue('')
-
-      describe "changeHadler", ->
-        it "should preventDefault", ->
-          spyOnEvent(".file-input", "change")
-          @view.$fileInput.change()
-          expect("change").toHaveBeenPreventedOn(".file-input")
-
-        it "show warning message", ->
-          @view.$fileInput.trigger("change")
-          options =
-            title: gettext("Are you sure that you want to upload the subtitle file?")
-            actions:
-              primary:
-                click: @view.importHandler
-          expect(@message.render).toHaveBeenCalledWith("warn", options)
-
diff --git a/cms/static/coffee/spec/views/videoalpha/import/yt.coffee b/cms/static/coffee/spec/views/videoalpha/import/yt.coffee
deleted file mode 100644
index c5c5053b1f8b..000000000000
--- a/cms/static/coffee/spec/views/videoalpha/import/yt.coffee
+++ /dev/null
@@ -1,116 +0,0 @@
-describe "CMS.Views.SubtitlesImportYT", ->
-  beforeEach ->
-    @html_id = "html_id"
-
-    spyOn($, 'ajax')
-    @message = jasmine.createSpyObj("CMS.Views.SubtitlesMessages", [
-      'render'
-    ])
-
-    setFixtures """
-    <ul class="comp-subtitles-import-list"></ul>
-    """
-    @options =
-      component_id: @html_id
-      msg: @message
-      $container: $(".comp-subtitles-import-list")
-
-  describe "class definition", ->
-    beforeEach ->
-      @view = new CMS.Views.SubtitlesImportYT @options
-
-    it "sets the correct tagName", ->
-      expect(@view.tagName).toEqual("li")
-
-    it "sets the correct className", ->
-      expect(@view.className).toEqual("import-youtube")
-
-  describe "methods", ->
-    describe "initialize", ->
-      beforeEach ->
-        spyOn(CMS.Views.SubtitlesImportYT.prototype, 'render').andCallThrough()
-        @view = new CMS.Views.SubtitlesImportYT @options
-      it "render the module", ->
-        expect(CMS.Views.SubtitlesImportYT.prototype.render).toHaveBeenCalled()
-
-    describe "render", ->
-      beforeEach ->
-        @view = new CMS.Views.SubtitlesImportYT @options
-
-      it "element is added into the DOM", ->
-          expect(@options.$container).toContain(@view.$el)
-
-      it "button is added", ->
-        expect(@view.$el).toContain('a')
-
-    describe "import", ->
-      beforeEach ->
-        @view = new CMS.Views.SubtitlesImportYT @options
-
-      it "show wait message", ->
-        @view.import()
-        expect(@message.render).toHaveBeenCalledWith('wait')
-
-      it "ajax is called", ->
-        option =
-          url: @view.url
-          type: "POST"
-          dataType: "json"
-          contentType: "application/json"
-          timeout: 1000*60
-          data: JSON.stringify(
-              'id': @html_id
-          )
-          success: @view.xhrSuccessHandler
-          error: @view.xhrErrorHandler
-
-        @view.import()
-        expect($.ajax).toHaveBeenCalledWith(option)
-
-    describe "events", ->
-      beforeEach ->
-        @view = new CMS.Views.SubtitlesImportYT @options
-
-      it "click on 'Import from Youtube' button", ->
-        expect(@view.$el).toHandle("click")
-
-    describe "handlers", ->
-      beforeEach ->
-        @view = new CMS.Views.SubtitlesImportYT @options
-
-      describe "clickHandler", ->
-        it "should preventDefault", ->
-          spyOnEvent("#import-from-youtube", "click")
-          @view.$("#import-from-youtube").click()
-          expect("click").toHaveBeenPreventedOn("#import-from-youtube")
-
-        it "show warn message", ->
-          options =
-            title: gettext('''
-              Are you sure that you want to import the subtitle file
-              found on YouTube?
-            ''')
-            actions:
-              primary:
-                click: @view.importHandler
-
-          @view.$('#import-from-youtube').click()
-          expect(@message.render).toHaveBeenCalledWith("warn", options)
-
-      describe "xhrErrorHandler", ->
-        it "show error message", ->
-          @view.xhrErrorHandler()
-          expect(@message.render).toHaveBeenCalledWith("error")
-
-      describe "xhrSuccessHandler", ->
-        it "show success message", ->
-          @view.xhrSuccessHandler({
-            success: true
-          })
-          expect(@message.render).toHaveBeenCalledWith("success")
-
-        it "show error message", ->
-          @view.xhrSuccessHandler({
-            success: false
-          })
-          expect(@message.render).toHaveBeenCalledWith("error")
diff --git a/cms/static/coffee/src/views/videoalpha/submodules/download_subtitles.coffee b/cms/static/coffee/src/views/videoalpha/submodules/download_subtitles.coffee
new file mode 100644
index 000000000000..c0ef9da8f649
--- /dev/null
+++ b/cms/static/coffee/src/views/videoalpha/submodules/download_subtitles.coffee
@@ -0,0 +1,23 @@
+class CMS.Views.DownloadSubtitles extends Backbone.View
+  tagName: "li"
+  className: "download-file"
+  link_id: "download-file"
+  url: "/download_subtitles"
+
+  initialize: ->
+    _.bindAll(@)
+    @messages = @options.msg
+    @render()
+
+  render: ->
+    if @options.subtitlesExist is true
+      id = encodeURIComponent(@options.component_id)
+      html = @$el.append(
+          $('<a></a>',
+              class: "blue-button"
+              id: @link_id
+              href: "#{@url}?id=#{id}"
+          )
+          .text(gettext("Download subtitles"))
+      )
+      .appendTo(@options.$container)
diff --git a/cms/static/coffee/src/views/videoalpha/import/file.coffee b/cms/static/coffee/src/views/videoalpha/submodules/file.coffee
similarity index 100%
rename from cms/static/coffee/src/views/videoalpha/import/file.coffee
rename to cms/static/coffee/src/views/videoalpha/submodules/file.coffee
diff --git a/cms/static/coffee/src/views/videoalpha/import/yt.coffee b/cms/static/coffee/src/views/videoalpha/submodules/yt.coffee
similarity index 99%
rename from cms/static/coffee/src/views/videoalpha/import/yt.coffee
rename to cms/static/coffee/src/views/videoalpha/submodules/yt.coffee
index b544372cdf79..1bb67d3af7e2 100644
--- a/cms/static/coffee/src/views/videoalpha/import/yt.coffee
+++ b/cms/static/coffee/src/views/videoalpha/submodules/yt.coffee
@@ -3,7 +3,6 @@ class CMS.Views.SubtitlesImportYT extends Backbone.View
   className: "import-youtube"
   link_id: "import-from-youtube"
   url: "/import_subtitles"
-  files: null
 
   events:
     "click #import-from-youtube": "clickHandler"
diff --git a/cms/templates/widgets/videoalpha/subtitles.html b/cms/templates/widgets/videoalpha/subtitles.html
index 903cfc05304e..8a7d1547b3e5 100644
--- a/cms/templates/widgets/videoalpha/subtitles.html
+++ b/cms/templates/widgets/videoalpha/subtitles.html
@@ -20,7 +20,8 @@
             msg: CMS.Views.SubtitlesMessages,
             modules: [
                 CMS.Views.SubtitlesImportFile,
-                CMS.Views.SubtitlesImportYT
+                CMS.Views.SubtitlesImportYT,
+                CMS.Views.DownloadSubtitles
             ]
         });
     });

From 2ffe9224a64b62f5366c8c0a5d7f539dd9556647 Mon Sep 17 00:00:00 2001
From: Anton Stupak <s2pak.anton@gmail.com>
Date: Mon, 1 Jul 2013 12:48:13 +0300
Subject: [PATCH 17/30] Add tests for Download button

---
 .../submodules/download_subtitles.coffee      |  55 ++++++
 .../views/videoalpha/submodules/file.coffee   | 177 ++++++++++++++++++
 .../views/videoalpha/submodules/yt.coffee     | 116 ++++++++++++
 3 files changed, 348 insertions(+)
 create mode 100644 cms/static/coffee/spec/views/videoalpha/submodules/download_subtitles.coffee
 create mode 100644 cms/static/coffee/spec/views/videoalpha/submodules/file.coffee
 create mode 100644 cms/static/coffee/spec/views/videoalpha/submodules/yt.coffee

diff --git a/cms/static/coffee/spec/views/videoalpha/submodules/download_subtitles.coffee b/cms/static/coffee/spec/views/videoalpha/submodules/download_subtitles.coffee
new file mode 100644
index 000000000000..5aacef9be575
--- /dev/null
+++ b/cms/static/coffee/spec/views/videoalpha/submodules/download_subtitles.coffee
@@ -0,0 +1,55 @@
+describe "CMS.Views.DownloadSubtitles", ->
+  beforeEach ->
+    @html_id = "html_id"
+
+    setFixtures """
+    <ul class="comp-subtitles-import-list"></ul>
+    """
+    @options =
+      component_id: @html_id
+      msg: @message
+      $container: $(".comp-subtitles-import-list")
+      subtitlesExist: true
+
+  describe "class definition", ->
+    beforeEach ->
+      @view = new CMS.Views.DownloadSubtitles @options
+
+    it "sets the correct tagName", ->
+      expect(@view.tagName).toEqual("li")
+
+    it "sets the correct className", ->
+      expect(@view.className).toEqual("download-file")
+
+  describe "methods", ->
+    describe "initialize", ->
+      beforeEach ->
+        spyOn(CMS.Views.DownloadSubtitles.prototype, 'render').andCallThrough()
+        @view = new CMS.Views.DownloadSubtitles @options
+
+      it "render the module", ->
+        expect(CMS.Views.DownloadSubtitles.prototype.render).toHaveBeenCalled()
+
+    describe "render", ->
+      describe "subtitles exist", ->
+
+        beforeEach ->
+          @view = new CMS.Views.DownloadSubtitles @options
+
+        it "button is added", ->
+          expect(@view.$el).toContain('a')
+
+        it "anchor contain correct url", ->
+          link = @view.$el.find("a").attr("href")
+          expect(link).toBe("/download_subtitles?id=#{@html_id}")
+
+      describe "subtitles doesn't exist", ->
+
+        beforeEach ->
+          options = $.extend({}, @options, {
+            subtitlesExist: false
+          })
+          @view = new CMS.Views.DownloadSubtitles options
+
+        it "button should not be shown", ->
+          expect(@options.$container).not.toContain(@view.$el)
diff --git a/cms/static/coffee/spec/views/videoalpha/submodules/file.coffee b/cms/static/coffee/spec/views/videoalpha/submodules/file.coffee
new file mode 100644
index 000000000000..d901de189fad
--- /dev/null
+++ b/cms/static/coffee/spec/views/videoalpha/submodules/file.coffee
@@ -0,0 +1,177 @@
+describe "CMS.Views.SubtitlesImportFile", ->
+  beforeEach ->
+    @html_id = "html_id"
+
+    $.fn.ajaxSubmit = jasmine.createSpy('$.fn.ajaxSubmit')
+    @message = jasmine.createSpyObj("CMS.Views.SubtitlesMessages", [
+      'render',
+      'findEl'
+    ])
+
+    setFixtures """
+    <ul class="comp-subtitles-import-list"></ul>
+    """
+    @options =
+      component_id: @html_id
+      msg: @message
+      $container: $(".comp-subtitles-import-list")
+      tpl:
+        file: _.template """
+          <div id="test_el"></div>
+          <form action="#" class="file-upload">
+            <input class="file-input" type="file" />
+          </form>
+        """
+
+  describe "class definition", ->
+    beforeEach ->
+      @view = new CMS.Views.SubtitlesImportFile @options
+
+    it "sets the correct tagName", ->
+      expect(@view.tagName).toEqual("li")
+
+    it "sets the correct className", ->
+      expect(@view.className).toEqual("import-file")
+
+  describe "methods", ->
+    describe "initialize", ->
+      beforeEach ->
+        spyOn(CMS.Views.SubtitlesImportFile.prototype, 'render').andCallThrough()
+        @view = new CMS.Views.SubtitlesImportFile @options
+      it "render the module", ->
+        expect(CMS.Views.SubtitlesImportFile.prototype.render).toHaveBeenCalled()
+
+    describe "render", ->
+      describe "if all required params exist", ->
+        beforeEach ->
+          @view = new CMS.Views.SubtitlesImportFile @options
+
+        it "element is added into the DOM", ->
+            expect(@options.$container).toContain(@view.$el)
+
+        it "template is added into the DOM", ->
+          expect(@options.$container).toContain('#test_el')
+
+      describe "if params doesn't exist", ->
+        beforeEach ->
+          @options.tpl = null
+          spyOn(window.console, "error")
+          @view = new CMS.Views.SubtitlesImportFile @options
+
+        it "template doesn't exist", ->
+          expect(console.error).toHaveBeenCalledWith("Couldn't load template for file uploader")
+
+    describe "import", ->
+      beforeEach ->
+        @view = new CMS.Views.SubtitlesImportFile @options
+
+      it "files exist", ->
+        @view.files = [{name: "name"}]
+        @view.import()
+        expect($.fn.ajaxSubmit).toHaveBeenCalledWith(
+          beforeSend: @view.xhrResetProgressBar
+          uploadProgress: @view.xhrProgressHandler
+          complete: @view.xhrCompleteHandler
+        )
+
+      it "files doesn't exist", ->
+        @view.files = []
+        @view.import()
+        expect($.fn.ajaxSubmit).not.toHaveBeenCalled()
+
+    describe "events", ->
+      beforeEach ->
+        @view = new CMS.Views.SubtitlesImportFile @options
+
+      it "on change file", ->
+        expect(@view.$el).toHandle("change")
+
+      it "click on 'Upload from file' button", ->
+        expect(@view.$el).toHandle("click")
+
+    describe "handlers", ->
+      beforeEach ->
+        @view = new CMS.Views.SubtitlesImportFile @options
+
+      describe "xhrResetProgressBar", ->
+        it "show message", ->
+          @view.files = [{name: "name"}]
+          options = {
+            intent: 'warning'
+            title: gettext("Uploading...")
+            message: """
+              <span class=\"file-name\">#{@view.files[0].name}</span>
+              <span class=\"progress-bar\">
+                  <span class=\"progress-fill\"></span>
+              </span>
+            """
+          }
+          @view.xhrResetProgressBar()
+          expect(@message.render).toHaveBeenCalledWith(null, options)
+
+      describe "xhrProgressHandler", ->
+        it "show correct percentage", ->
+          percentVal = 10
+          @view.$progressFill = $('#test_el')
+          @view.xhrProgressHandler(null, null, null, percentVal)
+          percentage = @view.$progressFill.html()
+          expect(percentage).toBe(percentVal + "%")
+
+      describe "xhrCompleteHandler", ->
+        it "show success message", ->
+          xhr = {
+            status : 200
+            responseText : JSON.stringify({
+              success: true
+            })
+          }
+          @view.xhrCompleteHandler(xhr)
+          expect(@message.render).toHaveBeenCalledWith('success')
+
+        describe "show error message", ->
+
+          it "if status is not 200", ->
+            xhr = {
+              status : 404
+              responseText : JSON.stringify({
+                success: true
+              })
+            }
+            @view.xhrCompleteHandler(xhr)
+            expect(@message.render).toHaveBeenCalledWith('error')
+
+          it "if success flag is false", ->
+            xhr = {
+              status : 200
+              responseText : JSON.stringify({
+                success: false
+              })
+            }
+            @view.xhrCompleteHandler(xhr)
+            expect(@message.render).toHaveBeenCalledWith('error')
+
+      describe "clickHandler", ->
+        it "should preventDefault", ->
+          spyOnEvent("#import-from-file", "click")
+          @view.$("#import-from-file").click()
+          expect("click").toHaveBeenPreventedOn("#import-from-file")
+
+        it "value of input type file should be empty", ->
+          @view.$("#import-from-file").click()
+          expect(@view.$fileInput).toHaveValue('')
+
+      describe "changeHadler", ->
+        it "should preventDefault", ->
+          spyOnEvent(".file-input", "change")
+          @view.$fileInput.change()
+          expect("change").toHaveBeenPreventedOn(".file-input")
+
+        it "show warning message", ->
+          @view.$fileInput.trigger("change")
+          options =
+            title: gettext("Are you sure that you want to upload the subtitle file?")
+            actions:
+              primary:
+                click: @view.importHandler
+          expect(@message.render).toHaveBeenCalledWith("warn", options)
+
diff --git a/cms/static/coffee/spec/views/videoalpha/submodules/yt.coffee b/cms/static/coffee/spec/views/videoalpha/submodules/yt.coffee
new file mode 100644
index 000000000000..c5c5053b1f8b
--- /dev/null
+++ b/cms/static/coffee/spec/views/videoalpha/submodules/yt.coffee
@@ -0,0 +1,116 @@
+describe "CMS.Views.SubtitlesImportYT", ->
+  beforeEach ->
+    @html_id = "html_id"
+
+    spyOn($, 'ajax')
+    @message = jasmine.createSpyObj("CMS.Views.SubtitlesMessages", [
+      'render'
+    ])
+
+    setFixtures """
+    <ul class="comp-subtitles-import-list"></ul>
+    """
+    @options =
+      component_id: @html_id
+      msg: @message
+      $container: $(".comp-subtitles-import-list")
+
+  describe "class definition", ->
+    beforeEach ->
+      @view = new CMS.Views.SubtitlesImportYT @options
+
+    it "sets the correct tagName", ->
+      expect(@view.tagName).toEqual("li")
+
+    it "sets the correct className", ->
+      expect(@view.className).toEqual("import-youtube")
+
+  describe "methods", ->
+    describe "initialize", ->
+      beforeEach ->
+        spyOn(CMS.Views.SubtitlesImportYT.prototype, 'render').andCallThrough()
+        @view = new CMS.Views.SubtitlesImportYT @options
+      it "render the module", ->
+        expect(CMS.Views.SubtitlesImportYT.prototype.render).toHaveBeenCalled()
+
+    describe "render", ->
+      beforeEach ->
+        @view = new CMS.Views.SubtitlesImportYT @options
+
+      it "element is added into the DOM", ->
+          expect(@options.$container).toContain(@view.$el)
+
+      it "button is added", ->
+        expect(@view.$el).toContain('a')
+
+    describe "import", ->
+      beforeEach ->
+        @view = new CMS.Views.SubtitlesImportYT @options
+
+      it "show wait message", ->
+        @view.import()
+        expect(@message.render).toHaveBeenCalledWith('wait')
+
+      it "ajax is called", ->
+        option =
+          url: @view.url
+          type: "POST"
+          dataType: "json"
+          contentType: "application/json"
+          timeout: 1000*60
+          data: JSON.stringify(
+              'id': @html_id
+          )
+          success: @view.xhrSuccessHandler
+          error: @view.xhrErrorHandler
+
+        @view.import()
+        expect($.ajax).toHaveBeenCalledWith(option)
+
+    describe "events", ->
+      beforeEach ->
+        @view = new CMS.Views.SubtitlesImportYT @options
+
+      it "click on 'Import from Youtube' button", ->
+        expect(@view.$el).toHandle("click")
+
+    describe "handlers", ->
+      beforeEach ->
+        @view = new CMS.Views.SubtitlesImportYT @options
+
+      describe "clickHandler", ->
+        it "should preventDefault", ->
+          spyOnEvent("#import-from-youtube", "click")
+          @view.$("#import-from-youtube").click()
+          expect("click").toHaveBeenPreventedOn("#import-from-youtube")
+
+        it "show warn message", ->
+          options =
+            title: gettext('''
+              Are you sure that you want to import the subtitle file
+              found on YouTube?
+            ''')
+            actions:
+              primary:
+                click: @view.importHandler
+
+          @view.$('#import-from-youtube').click()
+          expect(@message.render).toHaveBeenCalledWith("warn", options)
+
+      describe "xhrErrorHandler", ->
+        it "show error message", ->
+          @view.xhrErrorHandler()
+          expect(@message.render).toHaveBeenCalledWith("error")
+
+      describe "xhrSuccessHandler", ->
+        it "show success message", ->
+          @view.xhrSuccessHandler({
+            success: true
+          })
+          expect(@message.render).toHaveBeenCalledWith("success")
+
+        it "show error message", ->
+          @view.xhrSuccessHandler({
+            success: false
+          })
+          expect(@message.render).toHaveBeenCalledWith("error")

From 63e458ebb99ded3095423f7c0947feb76dac9e0d Mon Sep 17 00:00:00 2001
From: Anton Stupak <s2pak.anton@gmail.com>
Date: Thu, 4 Jul 2013 12:02:54 +0300
Subject: [PATCH 18/30] Add Tabs module to XBlock

---
 cms/templates/widgets/tabs-edit.html          |  22 +++
 .../lib/xmodule/xmodule/css/tabs/display.scss | 131 ++++++++++++++++++
 common/lib/xmodule/xmodule/editing_module.py  |  28 ++++
 .../xmodule/xmodule/js/src/tabs/edit.coffee   |  59 ++++++++
 .../lib/xmodule/xmodule/videoalpha_module.py  |  30 ++--
 5 files changed, 252 insertions(+), 18 deletions(-)
 create mode 100644 cms/templates/widgets/tabs-edit.html
 create mode 100644 common/lib/xmodule/xmodule/css/tabs/display.scss
 create mode 100644 common/lib/xmodule/xmodule/js/src/tabs/edit.coffee

diff --git a/cms/templates/widgets/tabs-edit.html b/cms/templates/widgets/tabs-edit.html
new file mode 100644
index 000000000000..94ace76b6bfa
--- /dev/null
+++ b/cms/templates/widgets/tabs-edit.html
@@ -0,0 +1,22 @@
+<%! from django.utils.translation import ugettext as _ %>
+<div class="wrapper-comp-editor" id="editor-tab-${html_id}">
+    <section class="editor">
+  % if tabs:
+      <ul class="editor-tabs">
+    % for tab in tabs:
+        <li><a href="#tab-${html_id}-${loop.index}" class="tab ${'current' if('current' in tab and tab['current'] is True) else ''}">${tab['name']}</a></li>
+    % endfor
+      </ul>
+      <div class="tabs-wrapper">
+  % else:
+      <div>
+  % endif
+       % for tab in tabs:
+        <div class="wrapper-comp-${tab['name'].lower() | entity} component-edit-tab component-tab ${'is-inactive' if(not 'current' in tab or tab['current'] is not True) else ''}" id="tab-${html_id}-${loop.index}">
+            <%include file="${tab['template']}" args="tabName=tab['name']"/>
+        </div>
+        % endfor
+      </div>
+    </section>
+</div>
+<%include file="metadata-edit.html" />
diff --git a/common/lib/xmodule/xmodule/css/tabs/display.scss b/common/lib/xmodule/xmodule/css/tabs/display.scss
new file mode 100644
index 000000000000..71098b3632a9
--- /dev/null
+++ b/common/lib/xmodule/xmodule/css/tabs/display.scss
@@ -0,0 +1,131 @@
+// This is shared CSS between the xmodule problem editor and the xmodule HTML editor.
+.editor {
+  position: relative;
+
+  .row {
+    position: relative;
+  }
+
+  .editor-bar {
+    position: relative;
+    @include linear-gradient(top, #d4dee8, #c9d5e2);
+    padding: 5px;
+    border-bottom-color: #a5aaaf;
+    @include clearfix;
+
+    a {
+      display: block;
+      float: left;
+      padding: 3px 10px 7px;
+      margin-left: 7px;
+      border-radius: 2px;
+
+      &:hover {
+        background: rgba(255, 255, 255, .5);
+      }
+    }
+  }
+
+  .editor-tabs {
+    position: absolute;
+    top: 10px;
+    right: 10px;
+
+    li {
+      float: left;
+      margin-right: 5px;
+
+      &:last-child {
+        margin-right: 0;
+      }
+    }
+
+    .tab {
+      display: block;
+      height: 24px;
+      padding: 7px 20px 3px;
+      border: 1px solid #a5aaaf;
+      border-radius: 3px 3px 0 0;
+      @include linear-gradient(top, rgba(0, 0, 0, 0) 87%, rgba(0, 0, 0, .06));
+      background-color: #e5ecf3;
+      font-size: 13px;
+      color: #3c3c3c;
+      box-shadow: 1px -1px 1px rgba(0, 0, 0, .05);
+
+      &.current {
+        background: #fff;
+        border-bottom-color: #fff;
+      }
+    }
+  }
+}
+
+.component-tab{
+  background: $white;
+  padding: 20px;
+  position: relative;
+  border-top: 1px solid #8891a1;
+
+  &#advanced{
+    padding: 0;
+    border: none;
+  }
+    .blue-button{
+      @include blue-button;
+    }
+}
+
+.editor{
+  @include clearfix();
+
+  .CodeMirror {
+    @include box-sizing(border-box);
+    width: 100%;
+    position: relative;
+    height: 379px;
+    border: 1px solid #3c3c3c;
+    border-top: 1px solid #8891a1;
+    background: $white;
+    color: #3c3c3c;
+  }
+
+  .CodeMirror-scroll {
+    height: 100%;
+  }
+
+  .editor-tabs {
+    top: 11px !important;
+    right: 10px;
+    z-index: 99;
+  }
+
+  .is-inactive {
+    display: none;
+  }
+
+  .comp-subtitles-entry{
+    text-align: center;
+    .file-upload{
+      display: none;
+    }
+    .comp-subtitles-import-list{
+      > li{
+        display: block;
+        margin: $baseline/2 0px $baseline/2 0;
+      }
+
+      .blue-button{
+        font-size: 1em;
+        display: block;
+        width: 70%;
+        margin: 0 auto;
+        text-align: center;
+      }
+    }
+  }
+}
+
+.tabs-wrapper{
+  padding-top: 46px;
+  position: relative;
+}
\ No newline at end of file
diff --git a/common/lib/xmodule/xmodule/editing_module.py b/common/lib/xmodule/xmodule/editing_module.py
index df4ebc564613..3774963672e4 100644
--- a/common/lib/xmodule/xmodule/editing_module.py
+++ b/common/lib/xmodule/xmodule/editing_module.py
@@ -29,6 +29,34 @@ def get_context(self):
         return _context
 
 
+
+class TabsEditingDescriptor(EditingFields, MakoModuleDescriptor):
+    """
+    Module that provides a raw editing view of its data and children.  It does not
+    perform any validation on its definition---just passes it along to the browser.
+
+    This class is intended to be used as a mixin.
+    """
+    mako_template = "widgets/tabs-edit.html"
+    css = {'scss': [resource_string(__name__, 'css/tabs/display.scss')]}
+    js = {'coffee': [resource_string(__name__, 'js/src/tabs/edit.coffee')]}
+    js_module_name = "TabsEditorDescriptor"
+
+    def get_context(self):
+        _context = MakoModuleDescriptor.get_context(self)
+        # Add our specific template information (the raw data body)
+        _context.update({
+            'tabs': self.tabs,
+            'id': self.location,
+            'html_id': self.location.html_id(),
+            'data': self.data
+
+        })
+        return _context
+
+
+
+
 class XMLEditingDescriptor(EditingDescriptor):
     """
     Module that provides a raw editing view of its data as XML. It does not perform
diff --git a/common/lib/xmodule/xmodule/js/src/tabs/edit.coffee b/common/lib/xmodule/xmodule/js/src/tabs/edit.coffee
new file mode 100644
index 000000000000..f865d81cd58f
--- /dev/null
+++ b/common/lib/xmodule/xmodule/js/src/tabs/edit.coffee
@@ -0,0 +1,59 @@
+class @TabsEditorDescriptor
+  @isInactiveClass : "is-inactive"
+
+  constructor: (element) ->
+    @element = element;
+    @$tabs = $(".tab", @element)
+    @$content = $(".component-tab", @element)
+
+    @element.on('click', '.editor-tabs .tab', @onSwitchEditor)
+
+    # If default visible tab is not setted or if were marked as current
+    # more than 1 tab just first tab will be shown
+    currentTab = @$tabs.filter('.current')
+    currentTab = @$tabs.first() if currentTab.length isnt 1
+    currentTab.trigger("click", [true])
+
+   onSwitchEditor: (e, reset) =>
+    e.preventDefault();
+
+    isInactiveClass = TabsEditorDescriptor.isInactiveClass
+    $currentTarget = $(e.currentTarget)
+
+    if not $currentTarget.hasClass('current') or reset is true
+
+      @$tabs.removeClass('current')
+      $currentTarget.addClass('current')
+
+      # Tabs are implemeted like anchors. Therefore we can use hash to find
+      # corresponding content
+      content_id = $currentTarget.attr('href')
+
+      @$content
+        .addClass(isInactiveClass)
+        .filter(content_id)
+        .removeClass(isInactiveClass)
+
+      @$tabs.closest('.wrapper-comp-editor').trigger(
+        'TabsEditor:changeTab',
+        [
+          $currentTarget.text(), # tab_name
+          content_id  # tab_id
+        ]
+      )
+
+  save: ->
+    @element.off('click', '.editor-tabs .tab', @onSwitchEditor)
+    # Link to instance of CodeMirror is stored in data attribute of DOM element
+    # If it exist we retreive the data from CodeMirror
+    advanced_editor = $('.edit-box', @element).first().data('CodeMirror')
+    if advanced_editor
+      text = advanced_editor.getValue()
+      data: text
+
+window.TabsEditorDescriptor = window.TabsEditorDescriptor || {};
+TabsEditorDescriptor.registerTabCallback = (id, name, callback) ->
+  $('#editor-tab-' + id).on 'TabsEditor:changeTab', (e, tab_name, tab_id) ->
+    e.stopPropagation()
+    callback() if typeof callback is "function" and tab_name is name
+
diff --git a/common/lib/xmodule/xmodule/videoalpha_module.py b/common/lib/xmodule/xmodule/videoalpha_module.py
index 29b8e97606a1..786a20e1d7ff 100644
--- a/common/lib/xmodule/xmodule/videoalpha_module.py
+++ b/common/lib/xmodule/xmodule/videoalpha_module.py
@@ -20,7 +20,7 @@
 from django.conf import settings
 
 from xmodule.x_module import XModule
-from xmodule.editing_module import EditingDescriptor
+from xmodule.editing_module import TabsEditingDescriptor
 from xmodule.modulestore.mongo import MongoModuleStore
 from xmodule.modulestore.django import modulestore
 from xmodule.contentstore.content import StaticContent
@@ -165,24 +165,18 @@ def get_html(self):
         })
 
 
-class VideoAlphaDescriptor(VideoAlphaFields, EditingDescriptor):
+class VideoAlphaDescriptor(VideoAlphaFields, TabsEditingDescriptor):
     """Descriptor for `VideoAlphaModule`."""
     module_class = VideoAlphaModule
     template_dir_name = "videoalpha"
-    mako_template = "widgets/edit.html"
-    js = {'coffee': [resource_string(__name__, 'js/src/videoalpha/edit.coffee')]}
-    js_module_name = "VideoAlphaEditorTabs"
-    css = {'scss': [resource_string(__name__, 'css/editor/edit.scss'), resource_string(__name__, 'css/videoalpha/edit.scss')]}
-
-    def get_context(self):
-        context = super(VideoAlphaDescriptor, self).get_context()
-        tabs = {
-            'Subtitles': "videoalpha/subtitles.html"
+    tabs = [
+        {
+            'name': "XML",
+            'template': "edit.html",
+            'current': True,
+        },
+        {
+            'name': "Subtitles",
+            'template': "videoalpha/subtitles.html",
         }
-        context.update({
-            'tabs': tabs,
-            'id': self.location,
-            'html_id': self.location.html_id()
-
-        })
-        return context
+    ]

From 16f68eecf5b4201b79be049e4738db1f1da08c42 Mon Sep 17 00:00:00 2001
From: Anton Stupak <s2pak.anton@gmail.com>
Date: Thu, 4 Jul 2013 12:01:55 +0300
Subject: [PATCH 19/30] Change templates according to new tabs logic

---
 cms/templates/widgets/edit.html               | 50 ++++++++++---------
 .../widgets/videoalpha/subtitles.html         |  9 +++-
 2 files changed, 34 insertions(+), 25 deletions(-)

diff --git a/cms/templates/widgets/edit.html b/cms/templates/widgets/edit.html
index 9655cb821d78..c31a0bfcf55a 100644
--- a/cms/templates/widgets/edit.html
+++ b/cms/templates/widgets/edit.html
@@ -1,27 +1,29 @@
 <%! from django.utils.translation import ugettext as _ %>
-<div class="wrapper-comp-editor" id="editor-tab">
-    <section class="editor">
-  % if tabs.items():
-      <ul class="editor-tabs">
-        <li><a href="#advanced" class="tab current" data-tab="advanced">${_("HTML")}</a></li>
-    % for tab_name, tab_content in tabs.items():
-        <li><a href="#tab-${loop.index}" class="tab">${tab_name}</a></li>
-    % endfor
-      </ul>
-      <div class="tabs-wrapper">
-  % else:
-    <div>
-  % endif
-        <div class="component-tab" id="advanced">
-          <textarea class="edit-box">${data | h}</textarea>
-        </div>
-       % for tab_name, tab_content in tabs.items():
-        <div class="wrapper-comp-${tab_name.lower() | entity} component-edit-tab component-tab is-inactive" id="tab-${loop.index}">
-            <%include file="${tab_content}"/>
-        </div>
-        % endfor
-      </div>
-    </section>
+<%page args="tabName"/>
+<div style="margin: -20px;">
+  <textarea id="advanced-${html_id}" class="edit-box">${data | h}</textarea>
 </div>
 
-<%include file="metadata-edit.html" />
+<script type='text/javascript'>
+    $(document).ready(function(){
+      (function(){
+        var
+          $el = $("#advanced-${html_id}"),
+          advanced_editor = CodeMirror.fromTextArea(
+            $el.get(0), {
+              mode: "text/html",
+              lineNumbers: true,
+              lineWrapping: true
+            }
+          );
+        ## Save link to CodeMirror in data attribute CodeMirror for further using in
+        ## TabsEditorDescriptor for save data
+        $el.data('CodeMirror', advanced_editor);
+
+        TabsEditorDescriptor.registerTabCallback('${html_id}', '${tabName}', function(){
+           advanced_editor.refresh();
+           advanced_editor.focus();
+        })
+      }());
+    });
+</script>
\ No newline at end of file
diff --git a/cms/templates/widgets/videoalpha/subtitles.html b/cms/templates/widgets/videoalpha/subtitles.html
index 8a7d1547b3e5..0e3f24aafff0 100644
--- a/cms/templates/widgets/videoalpha/subtitles.html
+++ b/cms/templates/widgets/videoalpha/subtitles.html
@@ -11,12 +11,19 @@
 
 <script type='text/javascript'>
     $(document).ready(function(){
+
+        $('#editor-tab-${html_id}').on('TabsEditor', function(e, tab_name, tab_id){
+            if (tab_name.toLowerCase() === 'subtitles'){
+                // do something if tab_name is subtitles
+            }
+        })
+
         new CMS.Views.SubtitlesImport({
             container: $('#comp-subtitles-${html_id}'),
             tpl: {
                 file: _.template($('#subtitles-import-from-file-${html_id}-tpl').text())
-
             },
+            subtitlesExist: true,
             msg: CMS.Views.SubtitlesMessages,
             modules: [
                 CMS.Views.SubtitlesImportFile,

From 0a6c9f4d76211614c356823ae85e07fad6a2f4c9 Mon Sep 17 00:00:00 2001
From: Anton Stupak <s2pak.anton@gmail.com>
Date: Tue, 2 Jul 2013 13:12:42 +0300
Subject: [PATCH 20/30] Refactor Module Name

---
 .../submodules/download_subtitles.coffee           | 14 +++++++-------
 .../submodules/download_subtitles.coffee           |  2 +-
 cms/templates/widgets/videoalpha/subtitles.html    | 12 +++---------
 3 files changed, 11 insertions(+), 17 deletions(-)

diff --git a/cms/static/coffee/spec/views/videoalpha/submodules/download_subtitles.coffee b/cms/static/coffee/spec/views/videoalpha/submodules/download_subtitles.coffee
index 5aacef9be575..6f56c62c27d1 100644
--- a/cms/static/coffee/spec/views/videoalpha/submodules/download_subtitles.coffee
+++ b/cms/static/coffee/spec/views/videoalpha/submodules/download_subtitles.coffee
@@ -1,4 +1,4 @@
-describe "CMS.Views.DownloadSubtitles", ->
+describe "CMS.Views.SubtitlesDownload", ->
   beforeEach ->
     @html_id = "html_id"
 
@@ -13,7 +13,7 @@ describe "CMS.Views.DownloadSubtitles", ->
 
   describe "class definition", ->
     beforeEach ->
-      @view = new CMS.Views.DownloadSubtitles @options
+      @view = new CMS.Views.SubtitlesDownload @options
 
     it "sets the correct tagName", ->
       expect(@view.tagName).toEqual("li")
@@ -24,17 +24,17 @@ describe "CMS.Views.DownloadSubtitles", ->
   describe "methods", ->
     describe "initialize", ->
       beforeEach ->
-        spyOn(CMS.Views.DownloadSubtitles.prototype, 'render').andCallThrough()
-        @view = new CMS.Views.DownloadSubtitles @options
+        spyOn(CMS.Views.SubtitlesDownload.prototype, 'render').andCallThrough()
+        @view = new CMS.Views.SubtitlesDownload @options
 
       it "render the module", ->
-        expect(CMS.Views.DownloadSubtitles.prototype.render).toHaveBeenCalled()
+        expect(CMS.Views.SubtitlesDownload.prototype.render).toHaveBeenCalled()
 
     describe "render", ->
       describe "subtitles exist", ->
 
         beforeEach ->
-          @view = new CMS.Views.DownloadSubtitles @options
+          @view = new CMS.Views.SubtitlesDownload @options
 
         it "button is added", ->
           expect(@view.$el).toContain('a')
@@ -49,7 +49,7 @@ describe "CMS.Views.DownloadSubtitles", ->
           options = $.extend({}, @options, {
             subtitlesExist: false
           })
-          @view = new CMS.Views.DownloadSubtitles options
+          @view = new CMS.Views.SubtitlesDownload options
 
         it "button should not be shown", ->
           expect(@options.$container).not.toContain(@view.$el)
diff --git a/cms/static/coffee/src/views/videoalpha/submodules/download_subtitles.coffee b/cms/static/coffee/src/views/videoalpha/submodules/download_subtitles.coffee
index c0ef9da8f649..4973465711c8 100644
--- a/cms/static/coffee/src/views/videoalpha/submodules/download_subtitles.coffee
+++ b/cms/static/coffee/src/views/videoalpha/submodules/download_subtitles.coffee
@@ -1,4 +1,4 @@
-class CMS.Views.DownloadSubtitles extends Backbone.View
+class CMS.Views.SubtitlesDownload extends Backbone.View
   tagName: "li"
   className: "download-file"
   link_id: "download-file"
diff --git a/cms/templates/widgets/videoalpha/subtitles.html b/cms/templates/widgets/videoalpha/subtitles.html
index 0e3f24aafff0..83e131435194 100644
--- a/cms/templates/widgets/videoalpha/subtitles.html
+++ b/cms/templates/widgets/videoalpha/subtitles.html
@@ -1,5 +1,6 @@
 <%! from django.utils.translation import ugettext as _ %>
 <%namespace name='static' file='../../static_content.html'/>
+<%page args="tabName"/>
 
 <div class="field comp-subtitles-entry" id="comp-subtitles-${html_id}"></div>
 
@@ -11,13 +12,6 @@
 
 <script type='text/javascript'>
     $(document).ready(function(){
-
-        $('#editor-tab-${html_id}').on('TabsEditor', function(e, tab_name, tab_id){
-            if (tab_name.toLowerCase() === 'subtitles'){
-                // do something if tab_name is subtitles
-            }
-        })
-
         new CMS.Views.SubtitlesImport({
             container: $('#comp-subtitles-${html_id}'),
             tpl: {
@@ -28,8 +22,8 @@
             modules: [
                 CMS.Views.SubtitlesImportFile,
                 CMS.Views.SubtitlesImportYT,
-                CMS.Views.DownloadSubtitles
+                CMS.Views.SubtitlesDownload
             ]
         });
     });
-</script>
+</script>
\ No newline at end of file

From 14d311b3560b1325b3399bf8a5423e1e4e719672 Mon Sep 17 00:00:00 2001
From: Anton Stupak <s2pak.anton@gmail.com>
Date: Thu, 4 Jul 2013 12:08:38 +0300
Subject: [PATCH 21/30] Remove old styles

---
 .../xmodule/xmodule/css/videoalpha/edit.scss  | 70 -------------------
 .../xmodule/js/src/videoalpha/edit.coffee     | 44 ------------
 2 files changed, 114 deletions(-)
 delete mode 100644 common/lib/xmodule/xmodule/css/videoalpha/edit.scss
 delete mode 100644 common/lib/xmodule/xmodule/js/src/videoalpha/edit.coffee

diff --git a/common/lib/xmodule/xmodule/css/videoalpha/edit.scss b/common/lib/xmodule/xmodule/css/videoalpha/edit.scss
deleted file mode 100644
index 72f19401b7f1..000000000000
--- a/common/lib/xmodule/xmodule/css/videoalpha/edit.scss
+++ /dev/null
@@ -1,70 +0,0 @@
-//Videoalpha component editor
-.component-tab{
-  background: $white;
-  padding: 20px;
-  position: relative;
-  border-top: 1px solid #8891a1;
-
-  &#advanced{
-    padding: 0;
-    border: none;
-  }
-    .blue-button{
-      @include blue-button;
-    }
-}
-
-.editor{
-  @include clearfix();
-
-  .CodeMirror {
-    @include box-sizing(border-box);
-    width: 100%;
-    position: relative;
-    height: 379px;
-    border: 1px solid #3c3c3c;
-    border-top: 1px solid #8891a1;
-    background: $white;
-    color: #3c3c3c;
-  }
-
-  .CodeMirror-scroll {
-    height: 100%;
-  }
-
-  .editor-tabs {
-    top: 11px !important;
-    right: 10px;
-    z-index: 99;
-  }
-
-  .is-inactive {
-    display: none;
-  }
-
-  .comp-subtitles-entry{
-    text-align: center;
-    .file-upload{
-      display: none;
-    }
-    .comp-subtitles-import-list{
-      > li{
-        display: block;
-        margin: $baseline/2 0px $baseline/2 0;
-      }
-
-      .blue-button{
-        font-size: 1em;
-        display: block;
-        width: 70%;
-        margin: 0 auto;
-        text-align: center;
-      }
-    }
-  }
-}
-
-.tabs-wrapper{
-  padding-top: 46px;
-  position: relative;
-}
\ No newline at end of file
diff --git a/common/lib/xmodule/xmodule/js/src/videoalpha/edit.coffee b/common/lib/xmodule/xmodule/js/src/videoalpha/edit.coffee
deleted file mode 100644
index bf9268033ef5..000000000000
--- a/common/lib/xmodule/xmodule/js/src/videoalpha/edit.coffee
+++ /dev/null
@@ -1,44 +0,0 @@
-class @VideoAlphaEditorTabs
-  @isInactiveClass : "is-inactive"
-
-  constructor: (element) ->
-    @element = element;
-    @$tabs = $(".tab", @element)
-    @$content = $(".component-tab", @element)
-
-    editBox = $(".edit-box", @element)[0]
-    if editBox
-      @advanced_editor = CodeMirror.fromTextArea(editBox, {
-        mode: "text/html"
-        lineNumbers: true
-        lineWrapping: true
-      })
-    @element.on('click', '.editor-tabs .tab', @onSwitchEditor)
-
-   onSwitchEditor: (e) =>
-    e.preventDefault();
-
-    isInactiveClass = HTMLEditingDescriptor.isInactiveClass
-    $currentTarget = $(e.currentTarget)
-    if not $currentTarget.hasClass('current')
-
-      @$tabs.removeClass('current')
-      $currentTarget.addClass('current')
-
-      # Tabs are implemeted like anchors. Therefore we can use hash to find corresponding content
-      hash = $currentTarget.attr('href')
-      @$content
-        .addClass(isInactiveClass)
-        .filter(hash)
-        .removeClass(isInactiveClass)
-
-      if $currentTarget.data('tab') is 'advanced' and @advanced_editor
-        @showAdvancedEditor()
-
-  # Show the Advanced (codemirror) Editor. Pulled out as a helper method for unit testing.
-  showAdvancedEditor: () ->
-    @advanced_editor.focus()
-
-  save: ->
-    @element.off('click', '.editor-tabs .tab', @onSwitchEditor)
-    data: @advanced_editor.getValue()
\ No newline at end of file

From 7f9657f1726d0b30dcbaf8a1b490077a1d24f53d Mon Sep 17 00:00:00 2001
From: Anton Stupak <s2pak.anton@gmail.com>
Date: Wed, 3 Jul 2013 08:59:52 +0300
Subject: [PATCH 22/30] Add tests for CMS.Views.SubtitlesMessages

---
 .../spec/views/videoalpha/messages.coffee     | 42 +++++++++++++++++++
 .../src/views/videoalpha/messages.coffee      |  2 +-
 2 files changed, 43 insertions(+), 1 deletion(-)
 create mode 100644 cms/static/coffee/spec/views/videoalpha/messages.coffee

diff --git a/cms/static/coffee/spec/views/videoalpha/messages.coffee b/cms/static/coffee/spec/views/videoalpha/messages.coffee
new file mode 100644
index 000000000000..a683b173ecb4
--- /dev/null
+++ b/cms/static/coffee/spec/views/videoalpha/messages.coffee
@@ -0,0 +1,42 @@
+describe "CMS.Views.SubtitlesMessages", ->
+  beforeEach ->
+    @prompt = CMS.Views.Prompt
+    spy = jasmine.createSpyObj(
+      'CMS.Views.Prompt',
+      [
+        "show",
+        "hide"
+      ]
+    )
+    spy['$el'] = $('<div><div id="example"></div></div>')
+
+    CMS.Views.Prompt = () ->
+      spy
+
+    spyOn(CMS.Views.SubtitlesMessages.prototype, 'render').andCallThrough()
+    @view = new CMS.Views.SubtitlesMessages()
+
+    afterEach ->
+      CMS.Views.Prompt = @prompt
+
+  describe "methods", ->
+    describe "initialize", ->
+      it "default messages are defined", ->
+        expect(@view.msg).toBeDefined()
+
+    describe "render", ->
+      it "popup to be shown", ->
+        @view.render()
+        expect(@view.prompt.show).toHaveBeenCalled()
+
+    describe "hide", ->
+      it "popup to be shown", ->
+        @view.render()
+        @view.hide()
+        expect(@view.prompt.hide).toHaveBeenCalled()
+
+    describe "findEl", ->
+      it "element should be found", ->
+        @view.render()
+        expect(@view.findEl('#example').length).toBe(1)
+
diff --git a/cms/static/coffee/src/views/videoalpha/messages.coffee b/cms/static/coffee/src/views/videoalpha/messages.coffee
index a6f1f3612ae2..2002ac432e31 100644
--- a/cms/static/coffee/src/views/videoalpha/messages.coffee
+++ b/cms/static/coffee/src/views/videoalpha/messages.coffee
@@ -53,7 +53,7 @@ class CMS.Views.SubtitlesMessages extends  Backbone.View
 
   hide: (event) ->
     event.preventDefault() if event
-    @prompt.hide()
+    @prompt.hide() if @prompt
 
   findEl: (selector) ->
     @prompt.$el.find(selector) if @prompt

From 8ffbf745cf3441ffa839b33a4790994b772b54fd Mon Sep 17 00:00:00 2001
From: Anton Stupak <s2pak.anton@gmail.com>
Date: Wed, 3 Jul 2013 11:50:26 +0300
Subject: [PATCH 23/30] Add tests for TabsEditorDescriptor

---
 .../xmodule/js/fixtures/tabs-edit.html        | 16 +++++
 .../xmodule/xmodule/js/spec/tabs/edit.coffee  | 68 +++++++++++++++++++
 2 files changed, 84 insertions(+)
 create mode 100644 common/lib/xmodule/xmodule/js/fixtures/tabs-edit.html
 create mode 100644 common/lib/xmodule/xmodule/js/spec/tabs/edit.coffee

diff --git a/common/lib/xmodule/xmodule/js/fixtures/tabs-edit.html b/common/lib/xmodule/xmodule/js/fixtures/tabs-edit.html
new file mode 100644
index 000000000000..b1d3f4886c5c
--- /dev/null
+++ b/common/lib/xmodule/xmodule/js/fixtures/tabs-edit.html
@@ -0,0 +1,16 @@
+<section class="tabs-edit">
+    <div class="wrapper-comp-editor" id="editor-tab-id">
+        <ul class="editor-tabs">
+            <li><a href="#tab-0" class="tab">Tab 0</a></li>
+            <li><a href="#tab-1" class="tab">Tab 1</a></li>
+        </ul>
+        <div class="tabs-wrapper">
+            <div class="component-tab" id="tab-0">
+                <textarea name="" class="edit-box">Advanced Editor Text</textarea>
+            </div>
+            <div class="component-tab" id="tab-1">
+                Some content
+            </div>
+        </div>
+    </div>
+</section>
\ No newline at end of file
diff --git a/common/lib/xmodule/xmodule/js/spec/tabs/edit.coffee b/common/lib/xmodule/xmodule/js/spec/tabs/edit.coffee
new file mode 100644
index 000000000000..3b81b306d6c2
--- /dev/null
+++ b/common/lib/xmodule/xmodule/js/spec/tabs/edit.coffee
@@ -0,0 +1,68 @@
+describe "TabsEditorDescriptor", ->
+  beforeEach ->
+    @isInactiveClass = "is-inactive"
+    @isCurrent = "current"
+    loadFixtures 'tabs-edit.html'
+    @descriptor = new TabsEditorDescriptor($('.tabs-edit'))
+
+  describe "constructor", ->
+    it "first tab should be visible", ->
+      expect(@descriptor.$tabs.first()).toHaveClass(@isCurrent)
+      expect(@descriptor.$content.first()).not.toHaveClass(@isInactiveClass)
+
+  describe "onSwitchEditor", ->
+    it "switch tabs", ->
+      @descriptor.$tabs.eq(1).trigger("click")
+      expect(@descriptor.$tabs.eq(0)).not.toHaveClass(@isCurrent)
+      expect(@descriptor.$content.eq(0)).toHaveClass(@isInactiveClass)
+      expect(@descriptor.$tabs.eq(1)).toHaveClass(@isCurrent)
+      expect(@descriptor.$content.eq(1)).not.toHaveClass(@isInactiveClass)
+
+    it "event 'TabsEditor:changeTab' is triggered", ->
+      spyOn($.fn, 'trigger').andCallThrough()
+      @descriptor.$tabs.eq(1).trigger("click")
+      expect($.fn.trigger.mostRecentCall.args[0]).toEqual('TabsEditor:changeTab')
+      expect($.fn.trigger.mostRecentCall.args[1]).toEqual(
+        [
+          'Tab 1', # tab_name
+          '#tab-1' # tab_id
+        ]
+      )
+
+    it "if click on current tab, anything should happens", ->
+      spyOn($.fn, 'trigger').andCallThrough()
+      currentTab = @descriptor.$tabs.filter('.' + @isCurrent)
+      @descriptor.$tabs.eq(0).trigger("click")
+      expect(@descriptor.$tabs.filter('.' + @isCurrent)).toEqual(currentTab)
+      expect($.fn.trigger.calls.length).toEqual(1)
+
+  describe "save", ->
+    it "if CodeMirror exist, data should be retreived", ->
+      editBox = $('.edit-box')
+      CodeMirrorStub =
+        getValue: () ->
+           editBox.val()
+
+      editBox.data('CodeMirror', CodeMirrorStub)
+      data = @descriptor.save().data
+      expect(data).toEqual('Advanced Editor Text')
+
+    it "detach click event", ->
+      spyOn($.fn, "off")
+      @descriptor.save()
+      expect($.fn.off).toHaveBeenCalledWith(
+        'click',
+        '.editor-tabs .tab',
+        @descriptor.onSwitchEditor
+      )
+
+  describe "registerTabCallback", ->
+    beforeEach ->
+      @id = 'id'
+      TabsEditorDescriptor.registerTabCallback("#{@id}")
+
+    afterEach ->
+      $("#editor-tab-#{@id}").off 'TabsEditor:changeTab'
+
+    it "event subscribed", ->
+      expect($("#editor-tab-#{@id}")).toHandle('TabsEditor:changeTab')

From fa3a7c7cf3436029867d8ed964bd321ac582a06f Mon Sep 17 00:00:00 2001
From: Vasyl Nakvasiuk <vaxxxa@gmail.com>
Date: Thu, 4 Jul 2013 10:45:13 +0300
Subject: [PATCH 24/30] Clean up

---
 cms/envs/dev.py                               |  2 +
 .../coffee/src/views/videoalpha/import.coffee |  2 +-
 .../src/views/videoalpha/subtitles.coffee     |  1 -
 cms/static/sass/assets/_anims.scss            | 29 +++++++++
 cms/static/sass/views/_unit.scss              | 62 +++++++++++++++++++
 .../subtitles-import-file.underscore          |  4 +-
 cms/templates/widgets/edit.html               |  2 +-
 cms/templates/widgets/tabs-edit.html          |  2 +-
 .../widgets/videoalpha/subtitles.html         |  2 +-
 .../lib/xmodule/xmodule/css/tabs/display.scss |  1 -
 common/lib/xmodule/xmodule/editing_module.py  |  8 +--
 11 files changed, 100 insertions(+), 15 deletions(-)
 delete mode 100644 cms/static/coffee/src/views/videoalpha/subtitles.coffee

diff --git a/cms/envs/dev.py b/cms/envs/dev.py
index 655092b74bc8..6ec8aca69884 100644
--- a/cms/envs/dev.py
+++ b/cms/envs/dev.py
@@ -8,6 +8,8 @@
 from .common import *
 from logsettings import get_logger_config
 
+import os
+
 DEBUG = True
 TEMPLATE_DEBUG = DEBUG
 LOGGING = get_logger_config(ENV_ROOT / "log",
diff --git a/cms/static/coffee/src/views/videoalpha/import.coffee b/cms/static/coffee/src/views/videoalpha/import.coffee
index 26562e1380ac..c7bb0bf0440d 100644
--- a/cms/static/coffee/src/views/videoalpha/import.coffee
+++ b/cms/static/coffee/src/views/videoalpha/import.coffee
@@ -21,4 +21,4 @@ class CMS.Views.SubtitlesImport extends Backbone.View
     )
     modules = @options.modules
     $.each modules, (index) ->
-      new modules[index](options)
\ No newline at end of file
+      new modules[index](options)
diff --git a/cms/static/coffee/src/views/videoalpha/subtitles.coffee b/cms/static/coffee/src/views/videoalpha/subtitles.coffee
deleted file mode 100644
index baa1e2bc2ac8..000000000000
--- a/cms/static/coffee/src/views/videoalpha/subtitles.coffee
+++ /dev/null
@@ -1 +0,0 @@
-class CMS.Views.Subtitles extends Backbone.View
\ No newline at end of file
diff --git a/cms/static/sass/assets/_anims.scss b/cms/static/sass/assets/_anims.scss
index 41530ef721d1..73163577d9dc 100644
--- a/cms/static/sass/assets/_anims.scss
+++ b/cms/static/sass/assets/_anims.scss
@@ -169,3 +169,32 @@
   @include animation-iteration-count($count);
   @include animation-fill-mode(both);
 }
+
+
+// =================
+
+// Subtitles Preloading animation
+
+@mixin opacityHider {
+  0% {
+    opacity: 1.0;
+  }
+
+  50% {
+    opacity: 0.0;
+  }
+}
+
+@-moz-keyframes anim-opacityHider { @include opacityHider(); }
+@-webkit-keyframes anim-opacityHider { @include opacityHider(); }
+@-o-keyframes anim-opacityHider { @include opacityHider(); }
+@keyframes anim-opacityHider { @include opacityHider(); }
+
+@mixin anim-opacityHider($duration, $timing: ease-in-out, $count: 1, $delay: 0) {
+  @include animation-name(anim-opacityHider);
+  @include animation-duration($duration);
+  @include animation-delay($delay);
+  @include animation-timing-function($timing);
+  @include animation-iteration-count($count);
+  @include animation-fill-mode(both);
+}
\ No newline at end of file
diff --git a/cms/static/sass/views/_unit.scss b/cms/static/sass/views/_unit.scss
index 26278cd0b1a7..447466c4cc3d 100644
--- a/cms/static/sass/views/_unit.scss
+++ b/cms/static/sass/views/_unit.scss
@@ -965,3 +965,65 @@ body.unit {
 div.wrapper-comp-editor.is-inactive ~ div.launch-latex-compiler{
  display: none;
 }
+
+#circle-preloader{
+  display: block;
+  width:70px;
+  padding: 20px 0;
+  margin: 0 auto;
+}
+
+.circle-preloader{
+  display: block;
+  background-color:#EDBD45;
+  float:left;
+  height:15px;
+  margin-left:8px;
+  width:15px;
+  @include anim-opacityHider(1.8s, linear, infinite);
+  border-radius:10px;
+}
+
+#circle-preloader_1{
+  @include animation-delay(0.4s);
+}
+
+#circle-preloader_2{
+  @include animation-delay(0.7s);
+}
+
+#circle-preloader_3{
+  @include animation-delay(1.0s);
+}
+
+.prompt{
+  &.warning{
+    .file-name{
+      word-break: break-all;
+    }
+    .progress-bar{
+      display: block;
+      height: 50px;
+      margin: 30px auto 10px;
+      border: 1px solid $blue;
+      text-align: center;
+      font-size: 1.14em;
+
+      &.loaded {
+        border-color: #66b93d;
+
+        .progress-fill {
+          background: #66b93d;
+        }
+      }
+      .progress-fill {
+        display: block;
+        width: 0%;
+        height: 50px;
+        background: $blue;
+        color: #fff;
+        line-height: 48px;
+      }
+    }
+  }
+}
\ No newline at end of file
diff --git a/cms/templates/js/videoalpha/subtitles-import-file.underscore b/cms/templates/js/videoalpha/subtitles-import-file.underscore
index 8dc1e0144391..9317c04481da 100644
--- a/cms/templates/js/videoalpha/subtitles-import-file.underscore
+++ b/cms/templates/js/videoalpha/subtitles-import-file.underscore
@@ -2,7 +2,7 @@
     <form class="file-chooser" action="/upload_subtitles"
                         method="post" enctype="multipart/form-data">
         <a href="#" class="choose-file-button">Choose File</a>
-        <input type="file" class="file-input" name="file">
+        <input type="file" class="file-input" name="file" accept=".srt">
         <input type="hidden" name="id" value="<%= component_id %>">
     </form>
-</div>
\ No newline at end of file
+</div>
diff --git a/cms/templates/widgets/edit.html b/cms/templates/widgets/edit.html
index c31a0bfcf55a..f5484013f7ba 100644
--- a/cms/templates/widgets/edit.html
+++ b/cms/templates/widgets/edit.html
@@ -26,4 +26,4 @@
         })
       }());
     });
-</script>
\ No newline at end of file
+</script>
diff --git a/cms/templates/widgets/tabs-edit.html b/cms/templates/widgets/tabs-edit.html
index 94ace76b6bfa..80006ec5bbda 100644
--- a/cms/templates/widgets/tabs-edit.html
+++ b/cms/templates/widgets/tabs-edit.html
@@ -12,7 +12,7 @@
       <div>
   % endif
        % for tab in tabs:
-        <div class="wrapper-comp-${tab['name'].lower() | entity} component-edit-tab component-tab ${'is-inactive' if(not 'current' in tab or tab['current'] is not True) else ''}" id="tab-${html_id}-${loop.index}">
+        <div class="component-tab ${'is-inactive' if(not 'current' in tab or tab['current'] is not True) else ''}" id="tab-${html_id}-${loop.index}">
             <%include file="${tab['template']}" args="tabName=tab['name']"/>
         </div>
         % endfor
diff --git a/cms/templates/widgets/videoalpha/subtitles.html b/cms/templates/widgets/videoalpha/subtitles.html
index 83e131435194..e28106ce7e98 100644
--- a/cms/templates/widgets/videoalpha/subtitles.html
+++ b/cms/templates/widgets/videoalpha/subtitles.html
@@ -26,4 +26,4 @@
             ]
         });
     });
-</script>
\ No newline at end of file
+</script>
diff --git a/common/lib/xmodule/xmodule/css/tabs/display.scss b/common/lib/xmodule/xmodule/css/tabs/display.scss
index 71098b3632a9..5a21b26a33fe 100644
--- a/common/lib/xmodule/xmodule/css/tabs/display.scss
+++ b/common/lib/xmodule/xmodule/css/tabs/display.scss
@@ -1,4 +1,3 @@
-// This is shared CSS between the xmodule problem editor and the xmodule HTML editor.
 .editor {
   position: relative;
 
diff --git a/common/lib/xmodule/xmodule/editing_module.py b/common/lib/xmodule/xmodule/editing_module.py
index 3774963672e4..73e8a17fdf84 100644
--- a/common/lib/xmodule/xmodule/editing_module.py
+++ b/common/lib/xmodule/xmodule/editing_module.py
@@ -29,13 +29,9 @@ def get_context(self):
         return _context
 
 
-
 class TabsEditingDescriptor(EditingFields, MakoModuleDescriptor):
     """
-    Module that provides a raw editing view of its data and children.  It does not
-    perform any validation on its definition---just passes it along to the browser.
-
-    This class is intended to be used as a mixin.
+    Module that provides tabs interface
     """
     mako_template = "widgets/tabs-edit.html"
     css = {'scss': [resource_string(__name__, 'css/tabs/display.scss')]}
@@ -55,8 +51,6 @@ def get_context(self):
         return _context
 
 
-
-
 class XMLEditingDescriptor(EditingDescriptor):
     """
     Module that provides a raw editing view of its data as XML. It does not perform

From b7a3655e69d23ec1606ae0b4d93ad2446a151311 Mon Sep 17 00:00:00 2001
From: Vasyl Nakvasiuk <vaxxxa@gmail.com>
Date: Wed, 3 Jul 2013 13:26:36 +0300
Subject: [PATCH 25/30] extend VideoAlphaDescriptor context

---
 common/lib/xmodule/xmodule/editing_module.py  |  2 +-
 .../lib/xmodule/xmodule/videoalpha_module.py  | 42 +++++++++++++++++++
 2 files changed, 43 insertions(+), 1 deletion(-)

diff --git a/common/lib/xmodule/xmodule/editing_module.py b/common/lib/xmodule/xmodule/editing_module.py
index 73e8a17fdf84..6b9ab8d610dc 100644
--- a/common/lib/xmodule/xmodule/editing_module.py
+++ b/common/lib/xmodule/xmodule/editing_module.py
@@ -39,7 +39,7 @@ class TabsEditingDescriptor(EditingFields, MakoModuleDescriptor):
     js_module_name = "TabsEditorDescriptor"
 
     def get_context(self):
-        _context = MakoModuleDescriptor.get_context(self)
+        _context = super(TabsEditingDescriptor, self).get_context()
         # Add our specific template information (the raw data body)
         _context.update({
             'tabs': self.tabs,
diff --git a/common/lib/xmodule/xmodule/videoalpha_module.py b/common/lib/xmodule/xmodule/videoalpha_module.py
index 786a20e1d7ff..ef25a7eecaa8 100644
--- a/common/lib/xmodule/xmodule/videoalpha_module.py
+++ b/common/lib/xmodule/xmodule/videoalpha_module.py
@@ -23,7 +23,9 @@
 from xmodule.editing_module import TabsEditingDescriptor
 from xmodule.modulestore.mongo import MongoModuleStore
 from xmodule.modulestore.django import modulestore
+from xmodule.contentstore.django import contentstore
 from xmodule.contentstore.content import StaticContent
+from xmodule.exceptions import NotFoundError
 from xblock.core import Integer, Scope, String
 
 import datetime
@@ -180,3 +182,43 @@ class VideoAlphaDescriptor(VideoAlphaFields, TabsEditingDescriptor):
             'template': "videoalpha/subtitles.html",
         }
     ]
+
+    def get_context(self):
+        """Extend context and add two additional flags:
+        'is_youtube' and 'has_subs_content'.VideoAlphaDescriptor
+
+        This context variables we use for CMS subtitles feature, where
+        we try to understand, must we show some buttons or not.
+        """
+        _context = super(VideoAlphaDescriptor, self).get_context()
+
+        xmltree = etree.fromstring(self.data)
+        youtube_attr = xmltree.get('youtube')
+        sub_attr = xmltree.get('sub')
+
+        content = None
+        if youtube_attr:
+            youtube_ids = [i.split(':')[1] for i in youtube_attr.split(',')]
+            for subs in youtube_ids:
+                filename = 'subs_{0}.srt.sjson'.format(subs)
+                content_location = StaticContent.compute_location(
+                    self.location.org, self.location.course, filename)
+                try:
+                    content = contentstore().find(content_location)
+                    break
+                except NotFoundError:
+                    continue
+        elif sub_attr:
+            filename = 'subs_{0}.srt.sjson'.format(sub_attr)
+            content_location = StaticContent.compute_location(
+                self.location.org, self.location.course, filename)
+            try:
+                content = contentstore().find(content_location)
+            except NotFoundError:
+                pass
+
+        _context.update({
+            'is_youtube': bool(youtube_attr),
+            'has_subs_content': bool(content)
+        })
+        return _context

From 026cdf02297208aad2ffd5f6767df0a83b87b62f Mon Sep 17 00:00:00 2001
From: Anton Stupak <s2pak.anton@gmail.com>
Date: Wed, 3 Jul 2013 16:00:42 +0300
Subject: [PATCH 26/30] Add flags

---
 .../submodules/download_subtitles.coffee      |  2 +-
 .../views/videoalpha/submodules/file.coffee   | 16 ++++++++++++++++
 .../src/views/videoalpha/submodules/yt.coffee | 19 ++++++++++---------
 .../widgets/videoalpha/subtitles.html         |  3 ++-
 4 files changed, 29 insertions(+), 11 deletions(-)

diff --git a/cms/static/coffee/src/views/videoalpha/submodules/download_subtitles.coffee b/cms/static/coffee/src/views/videoalpha/submodules/download_subtitles.coffee
index 4973465711c8..a082b169f922 100644
--- a/cms/static/coffee/src/views/videoalpha/submodules/download_subtitles.coffee
+++ b/cms/static/coffee/src/views/videoalpha/submodules/download_subtitles.coffee
@@ -10,7 +10,7 @@ class CMS.Views.SubtitlesDownload extends Backbone.View
     @render()
 
   render: ->
-    if @options.subtitlesExist is true
+    if @options.subtitlesExist is 'True'
       id = encodeURIComponent(@options.component_id)
       html = @$el.append(
           $('<a></a>',
diff --git a/cms/static/coffee/src/views/videoalpha/submodules/file.coffee b/cms/static/coffee/src/views/videoalpha/submodules/file.coffee
index caaa37fdcd77..9dda66992793 100644
--- a/cms/static/coffee/src/views/videoalpha/submodules/file.coffee
+++ b/cms/static/coffee/src/views/videoalpha/submodules/file.coffee
@@ -90,6 +90,22 @@ class CMS.Views.SubtitlesImportFile extends Backbone.View
   xhrCompleteHandler: (xhr) ->
     resp = JSON.parse(xhr.responseText)
     if xhr.status is 200 and resp.success is true
+        @updateData(resp.xml)
         @messages.render('success')
     else
         @messages.render('error')
+
+  updateData: (xml) ->
+    if xml
+      editBox = @options
+        .$container
+        .closest('.tabs-wrapper')
+        .find('.edit-box').first()
+      editBox.val(xml)
+      advanced_editor = editBox.data('CodeMirror')
+
+      if advanced_editor
+        advanced_editor.setValue(xml)
+        advanced_editor.refresh()
+
+
diff --git a/cms/static/coffee/src/views/videoalpha/submodules/yt.coffee b/cms/static/coffee/src/views/videoalpha/submodules/yt.coffee
index 1bb67d3af7e2..af6ecbc2fd11 100644
--- a/cms/static/coffee/src/views/videoalpha/submodules/yt.coffee
+++ b/cms/static/coffee/src/views/videoalpha/submodules/yt.coffee
@@ -13,15 +13,16 @@ class CMS.Views.SubtitlesImportYT extends Backbone.View
     @render()
 
   render: ->
-    html = @$el.append(
-        $('<a></a>',
-            class: "blue-button"
-            id: @link_id
-            href: "#"
-        )
-        .text(gettext("Import from Youtube"))
-    )
-    .appendTo(@options.$container)
+    if @options.isYoutube is 'True'
+      html = @$el.append(
+          $('<a></a>',
+              class: "blue-button"
+              id: @link_id
+              href: "#"
+          )
+          .text(gettext("Import from Youtube"))
+      )
+      .appendTo(@options.$container)
 
   clickHandler: (event) ->
     event.preventDefault()
diff --git a/cms/templates/widgets/videoalpha/subtitles.html b/cms/templates/widgets/videoalpha/subtitles.html
index e28106ce7e98..ddf97062afae 100644
--- a/cms/templates/widgets/videoalpha/subtitles.html
+++ b/cms/templates/widgets/videoalpha/subtitles.html
@@ -17,7 +17,8 @@
             tpl: {
                 file: _.template($('#subtitles-import-from-file-${html_id}-tpl').text())
             },
-            subtitlesExist: true,
+            isYoutube: '${is_youtube}',
+            subtitlesExist: '${has_subs_content}',
             msg: CMS.Views.SubtitlesMessages,
             modules: [
                 CMS.Views.SubtitlesImportFile,

From d854d52e08eb23fc5552e428365d83475d187883 Mon Sep 17 00:00:00 2001
From: Anton Stupak <s2pak.anton@gmail.com>
Date: Wed, 3 Jul 2013 19:46:46 +0300
Subject: [PATCH 27/30] Add tests for new flags

---
 .../submodules/download_subtitles.coffee      |  4 +--
 .../views/videoalpha/submodules/file.coffee   | 34 ++++++++++++++++++-
 .../views/videoalpha/submodules/yt.coffee     | 24 +++++++++----
 3 files changed, 53 insertions(+), 9 deletions(-)

diff --git a/cms/static/coffee/spec/views/videoalpha/submodules/download_subtitles.coffee b/cms/static/coffee/spec/views/videoalpha/submodules/download_subtitles.coffee
index 6f56c62c27d1..8bb8dc952f35 100644
--- a/cms/static/coffee/spec/views/videoalpha/submodules/download_subtitles.coffee
+++ b/cms/static/coffee/spec/views/videoalpha/submodules/download_subtitles.coffee
@@ -9,7 +9,7 @@ describe "CMS.Views.SubtitlesDownload", ->
       component_id: @html_id
       msg: @message
       $container: $(".comp-subtitles-import-list")
-      subtitlesExist: true
+      subtitlesExist: 'True'
 
   describe "class definition", ->
     beforeEach ->
@@ -47,7 +47,7 @@ describe "CMS.Views.SubtitlesDownload", ->
 
         beforeEach ->
           options = $.extend({}, @options, {
-            subtitlesExist: false
+            subtitlesExist: 'False'
           })
           @view = new CMS.Views.SubtitlesDownload options
 
diff --git a/cms/static/coffee/spec/views/videoalpha/submodules/file.coffee b/cms/static/coffee/spec/views/videoalpha/submodules/file.coffee
index d901de189fad..30b46e1096e7 100644
--- a/cms/static/coffee/spec/views/videoalpha/submodules/file.coffee
+++ b/cms/static/coffee/spec/views/videoalpha/submodules/file.coffee
@@ -9,7 +9,10 @@ describe "CMS.Views.SubtitlesImportFile", ->
     ])
 
     setFixtures """
-    <ul class="comp-subtitles-import-list"></ul>
+    <div class="tabs-wrapper">
+      <ul class="comp-subtitles-import-list"></ul>
+      <textarea class="edit-box"></textarea>
+    </div>
     """
     @options =
       component_id: @html_id
@@ -175,3 +178,32 @@ describe "CMS.Views.SubtitlesImportFile", ->
                 click: @view.importHandler
           expect(@message.render).toHaveBeenCalledWith("warn", options)
 
+      describe "updateData", ->
+        beforeEach ->
+          @CodeMirrorStub = jasmine.createSpyObj('CodeMirror',
+            [
+              "setValue",
+              "refresh"
+            ]
+          )
+          $('.edit-box').data('CodeMirror', @CodeMirrorStub)
+
+          @view = new CMS.Views.SubtitlesImportFile @options
+
+        it "advanced editor is updated", ->
+          data = 'Test Data'
+          @view.updateData(data)
+          expect(@CodeMirrorStub.setValue).toHaveBeenCalledWith(data)
+          expect(@CodeMirrorStub.refresh).toHaveBeenCalled()
+
+        it "if data absent anything should happens", ->
+          @view.updateData()
+          expect(@CodeMirrorStub.setValue).not.toHaveBeenCalled()
+          expect(@CodeMirrorStub.refresh).not.toHaveBeenCalled()
+
+        it "if CodeMirror absent anything should happens", ->
+          data = 'Test Data'
+          $('.edit-box').removeData('CodeMirror')
+          @view.updateData(data)
+          expect(@CodeMirrorStub.setValue).not.toHaveBeenCalled()
+          expect(@CodeMirrorStub.refresh).not.toHaveBeenCalled()
diff --git a/cms/static/coffee/spec/views/videoalpha/submodules/yt.coffee b/cms/static/coffee/spec/views/videoalpha/submodules/yt.coffee
index c5c5053b1f8b..06a2c1caaf56 100644
--- a/cms/static/coffee/spec/views/videoalpha/submodules/yt.coffee
+++ b/cms/static/coffee/spec/views/videoalpha/submodules/yt.coffee
@@ -13,6 +13,7 @@ describe "CMS.Views.SubtitlesImportYT", ->
     @options =
       component_id: @html_id
       msg: @message
+      isYoutube: 'True'
       $container: $(".comp-subtitles-import-list")
 
   describe "class definition", ->
@@ -34,14 +35,25 @@ describe "CMS.Views.SubtitlesImportYT", ->
         expect(CMS.Views.SubtitlesImportYT.prototype.render).toHaveBeenCalled()
 
     describe "render", ->
-      beforeEach ->
-        @view = new CMS.Views.SubtitlesImportYT @options
+      describe "if video is youtube", ->
+        beforeEach ->
+          @view = new CMS.Views.SubtitlesImportYT @options
+
+        it "element is added into the DOM", ->
+            expect(@options.$container).toContain(@view.$el)
 
-      it "element is added into the DOM", ->
-          expect(@options.$container).toContain(@view.$el)
+        it "button is added", ->
+          expect(@view.$el).toContain('a')
+
+      describe "if video is html5", ->
+        beforeEach ->
+          options = $.extend({}, @options, {
+            isYoutube: 'False'
+          })
+          @view = new CMS.Views.SubtitlesImportYT options
 
-      it "button is added", ->
-        expect(@view.$el).toContain('a')
+        it "button should not be shown", ->
+          expect(@options.$container).not.toContain(@view.$el)
 
     describe "import", ->
       beforeEach ->

From 3d7e199a22d0336a0058e589538b549507211c6c Mon Sep 17 00:00:00 2001
From: Anton Stupak <s2pak.anton@gmail.com>
Date: Thu, 4 Jul 2013 08:38:14 +0300
Subject: [PATCH 28/30] Move Styles to separate file

---
 cms/static/sass/assets/_anims.scss     | 29 --------
 cms/static/sass/base-style.scss        |  4 ++
 cms/static/sass/views/_unit.scss       | 62 -----------------
 cms/static/sass/views/_videoalpha.scss | 92 ++++++++++++++++++++++++++
 4 files changed, 96 insertions(+), 91 deletions(-)
 create mode 100644 cms/static/sass/views/_videoalpha.scss

diff --git a/cms/static/sass/assets/_anims.scss b/cms/static/sass/assets/_anims.scss
index 73163577d9dc..41530ef721d1 100644
--- a/cms/static/sass/assets/_anims.scss
+++ b/cms/static/sass/assets/_anims.scss
@@ -169,32 +169,3 @@
   @include animation-iteration-count($count);
   @include animation-fill-mode(both);
 }
-
-
-// =================
-
-// Subtitles Preloading animation
-
-@mixin opacityHider {
-  0% {
-    opacity: 1.0;
-  }
-
-  50% {
-    opacity: 0.0;
-  }
-}
-
-@-moz-keyframes anim-opacityHider { @include opacityHider(); }
-@-webkit-keyframes anim-opacityHider { @include opacityHider(); }
-@-o-keyframes anim-opacityHider { @include opacityHider(); }
-@keyframes anim-opacityHider { @include opacityHider(); }
-
-@mixin anim-opacityHider($duration, $timing: ease-in-out, $count: 1, $delay: 0) {
-  @include animation-name(anim-opacityHider);
-  @include animation-duration($duration);
-  @include animation-delay($delay);
-  @include animation-timing-function($timing);
-  @include animation-iteration-count($count);
-  @include animation-fill-mode(both);
-}
\ No newline at end of file
diff --git a/cms/static/sass/base-style.scss b/cms/static/sass/base-style.scss
index ff8405db38e7..9c8d8f0555fd 100644
--- a/cms/static/sass/base-style.scss
+++ b/cms/static/sass/base-style.scss
@@ -59,6 +59,10 @@
 @import 'views/users';
 @import 'views/checklists';
 
+// Should be removed during the implementation new mockups for videoalpha
+// transcripts
+@import 'views/videoalpha';
+
 // temp - inherited
 @import 'assets/content-types';
 
diff --git a/cms/static/sass/views/_unit.scss b/cms/static/sass/views/_unit.scss
index 447466c4cc3d..26278cd0b1a7 100644
--- a/cms/static/sass/views/_unit.scss
+++ b/cms/static/sass/views/_unit.scss
@@ -965,65 +965,3 @@ body.unit {
 div.wrapper-comp-editor.is-inactive ~ div.launch-latex-compiler{
  display: none;
 }
-
-#circle-preloader{
-  display: block;
-  width:70px;
-  padding: 20px 0;
-  margin: 0 auto;
-}
-
-.circle-preloader{
-  display: block;
-  background-color:#EDBD45;
-  float:left;
-  height:15px;
-  margin-left:8px;
-  width:15px;
-  @include anim-opacityHider(1.8s, linear, infinite);
-  border-radius:10px;
-}
-
-#circle-preloader_1{
-  @include animation-delay(0.4s);
-}
-
-#circle-preloader_2{
-  @include animation-delay(0.7s);
-}
-
-#circle-preloader_3{
-  @include animation-delay(1.0s);
-}
-
-.prompt{
-  &.warning{
-    .file-name{
-      word-break: break-all;
-    }
-    .progress-bar{
-      display: block;
-      height: 50px;
-      margin: 30px auto 10px;
-      border: 1px solid $blue;
-      text-align: center;
-      font-size: 1.14em;
-
-      &.loaded {
-        border-color: #66b93d;
-
-        .progress-fill {
-          background: #66b93d;
-        }
-      }
-      .progress-fill {
-        display: block;
-        width: 0%;
-        height: 50px;
-        background: $blue;
-        color: #fff;
-        line-height: 48px;
-      }
-    }
-  }
-}
\ No newline at end of file
diff --git a/cms/static/sass/views/_videoalpha.scss b/cms/static/sass/views/_videoalpha.scss
new file mode 100644
index 000000000000..402402ef3695
--- /dev/null
+++ b/cms/static/sass/views/_videoalpha.scss
@@ -0,0 +1,92 @@
+// Should be removed during the implementation new mockups for videoalpha
+// transcripts
+
+// Subtitles Preloading animation
+
+@mixin opacityHider {
+  0% {
+    opacity: 1.0;
+  }
+
+  50% {
+    opacity: 0.0;
+  }
+}
+
+@-moz-keyframes anim-opacityHider { @include opacityHider(); }
+@-webkit-keyframes anim-opacityHider { @include opacityHider(); }
+@-o-keyframes anim-opacityHider { @include opacityHider(); }
+@keyframes anim-opacityHider { @include opacityHider(); }
+
+@mixin anim-opacityHider($duration, $timing: ease-in-out, $count: 1, $delay: 0) {
+  @include animation-name(anim-opacityHider);
+  @include animation-duration($duration);
+  @include animation-delay($delay);
+  @include animation-timing-function($timing);
+  @include animation-iteration-count($count);
+  @include animation-fill-mode(both);
+}
+
+//==========================
+
+#circle-preloader{
+  display: block;
+  width:70px;
+  padding: 20px 0;
+  margin: 0 auto;
+}
+
+.circle-preloader{
+  display: block;
+  background-color:#EDBD45;
+  float:left;
+  height:15px;
+  margin-left:8px;
+  width:15px;
+  @include anim-opacityHider(1.8s, linear, infinite);
+  border-radius:10px;
+}
+
+#circle-preloader_1{
+  @include animation-delay(0.4s);
+}
+
+#circle-preloader_2{
+  @include animation-delay(0.7s);
+}
+
+#circle-preloader_3{
+  @include animation-delay(1.0s);
+}
+
+.prompt{
+  &.warning{
+    .file-name{
+      word-break: break-all;
+    }
+    .progress-bar{
+      display: block;
+      height: 50px;
+      margin: 30px auto 10px;
+      border: 1px solid $blue;
+      text-align: center;
+      font-size: 1.14em;
+
+      &.loaded {
+        border-color: #66b93d;
+
+        .progress-fill {
+          background: #66b93d;
+        }
+      }
+      .progress-fill {
+        display: block;
+        width: 0%;
+        height: 50px;
+        background: $blue;
+        color: #fff;
+        line-height: 48px;
+      }
+    }
+  }
+}
\ No newline at end of file

From fffe566d953674f55a2da208742408d84ffa653d Mon Sep 17 00:00:00 2001
From: Vasyl Nakvasiuk <vaxxxa@gmail.com>
Date: Thu, 4 Jul 2013 15:05:46 +0300
Subject: [PATCH 29/30] fix videoalpha tests

---
 lms/djangoapps/courseware/tests/test_videoalpha_mongo.py | 2 ++
 lms/djangoapps/courseware/tests/test_videoalpha_xml.py   | 1 +
 2 files changed, 3 insertions(+)

diff --git a/lms/djangoapps/courseware/tests/test_videoalpha_mongo.py b/lms/djangoapps/courseware/tests/test_videoalpha_mongo.py
index 182cbab9e7d9..09ebab31e7d9 100644
--- a/lms/djangoapps/courseware/tests/test_videoalpha_mongo.py
+++ b/lms/djangoapps/courseware/tests/test_videoalpha_mongo.py
@@ -49,6 +49,7 @@ def test_videoalpha_constructor(self):
             'sub': self.item_module.sub,
             'track': self.item_module.track,
             'youtube_streams': self.item_module.youtube_streams,
+            'component_location': self.item_module.location,
             'autoplay': settings.MITX_FEATURES.get('AUTOPLAY_VIDEOS', True)
         }
         self.assertDictEqual(context, expected_context)
@@ -93,6 +94,7 @@ def test_videoalpha_constructor(self):
             'sub': self.item_module.sub,
             'track': self.item_module.track,
             'youtube_streams': '',
+            'component_location': self.item_module.location,
             'autoplay': settings.MITX_FEATURES.get('AUTOPLAY_VIDEOS', True)
         }
         self.assertDictEqual(context, expected_context)
diff --git a/lms/djangoapps/courseware/tests/test_videoalpha_xml.py b/lms/djangoapps/courseware/tests/test_videoalpha_xml.py
index a14fc6cac6ee..ba8e6fab3465 100644
--- a/lms/djangoapps/courseware/tests/test_videoalpha_xml.py
+++ b/lms/djangoapps/courseware/tests/test_videoalpha_xml.py
@@ -120,6 +120,7 @@ def test_videoalpha_constructor(self):
             'sources': module.sources,
             'youtube_streams': module.youtube_streams,
             'track': module.track,
+            'component_location': module.location,
             'autoplay': settings.MITX_FEATURES.get('AUTOPLAY_VIDEOS', True)
         }
         self.assertDictEqual(context, expected_context)

From 2e1853d60f7bb8ef5d8c5036074d36d58520b3fd Mon Sep 17 00:00:00 2001
From: Anton Stupak <s2pak.anton@gmail.com>
Date: Thu, 4 Jul 2013 15:09:12 +0300
Subject: [PATCH 30/30] Remove unnecessary js include

---
 cms/templates/widgets/videoalpha/subtitles.html | 2 --
 1 file changed, 2 deletions(-)

diff --git a/cms/templates/widgets/videoalpha/subtitles.html b/cms/templates/widgets/videoalpha/subtitles.html
index ddf97062afae..c6fdd0340ecd 100644
--- a/cms/templates/widgets/videoalpha/subtitles.html
+++ b/cms/templates/widgets/videoalpha/subtitles.html
@@ -4,8 +4,6 @@
 
 <div class="field comp-subtitles-entry" id="comp-subtitles-${html_id}"></div>
 
-<script type="text/javascript" src="${static.url('coffee/src/views/videoalpha/subtitles_import.js')}"></script>
-
 <script id="subtitles-import-from-file-${html_id}-tpl" type="text/template">
     <%static:include path="js/videoalpha/subtitles-import-file.underscore" />
 </script>