Add language sorting,

Transcript title video file format extesion removed dynamically,
Code refactor

cms/djangoapps/contentstore/views/videos.py

@@ -575,7 +575,25 @@ def _get_index_videos(course):
     ]
 
 def get_all_transcript_languages():
-    return get_3rd_party_transcription_plans()[TranscriptProvider.THREE_PLAY_MEDIA]['languages']
+    """
+    Returns all possible languages for transcript.
+    """
+    transcription_plans = get_3rd_party_transcription_plans()
+    cielo_fidelity = transcription_plans[TranscriptProvider.CIELO24]['fidelity']
+
+    # Get third party transcription languages.
+    third_party_transcription_languages = transcription_plans[TranscriptProvider.THREE_PLAY_MEDIA]['languages']
+    third_party_transcription_languages = dict(third_party_transcription_languages, **cielo_fidelity['MECHANICAL']['languages'])
+    third_party_transcription_languages = dict(third_party_transcription_languages , **cielo_fidelity['PREMIUM']['languages'])
+    third_party_transcription_languages = dict(third_party_transcription_languages, **cielo_fidelity['PROFESSIONAL']['languages'])
+
+    # Get all settings languages dict.
+    all_languages = {}
+    for language in settings.ALL_LANGUAGES:
+        all_languages.update({language[0]: language[1]})
+
+    # Return combined settings and 3rd party transcript languages.
+    return dict(all_languages, **third_party_transcription_languages)
 
 def videos_index_html(course):
     """

cms/static/js/factories/videos_index.js

@@ -53,7 +53,8 @@ define([
                                 collection: updatedCollection,
                                 encodingsDownloadUrl: encodingsDownloadUrl,
                                 videoImageSettings: videoImageSettings,
-                                transcriptAvailableLanguages: transcriptAvailableLanguages
+                                transcriptAvailableLanguages: transcriptAvailableLanguages,
+                                videoSupportedFileFormats: videoSupportedFileFormats
                             });
                         $contentWrapper.find('.wrapper-assets').replaceWith(updatedView.render().$el);
                     });
@@ -66,7 +67,8 @@ define([
                 collection: new Backbone.Collection(previousUploads),
                 encodingsDownloadUrl: encodingsDownloadUrl,
                 videoImageSettings: videoImageSettings,
-                transcriptAvailableLanguages: transcriptAvailableLanguages
+                transcriptAvailableLanguages: transcriptAvailableLanguages,
+                videoSupportedFileFormats: videoSupportedFileFormats
             });
         $contentWrapper.append(activeView.render().$el);
         $contentWrapper.append(previousView.render().$el);

cms/static/js/views/previous_video_upload.js

@@ -33,7 +33,8 @@ define(
                     transcripts: this.model.get('transcripts'),
                     edxVideoID: this.model.get('edx_video_id'),
                     clientVideoID: this.model.get('client_video_id'),
-                    transcriptAvailableLanguages: this.options.transcriptAvailableLanguages
+                    transcriptAvailableLanguages: options.transcriptAvailableLanguages,
+                    videoSupportedFileFormats: options.videoSupportedFileFormats
                 });
             },
 

cms/static/js/views/previous_video_upload_list.js

@@ -17,7 +17,8 @@ define(
                         videoHandlerUrl: options.videoHandlerUrl,
                         videoImageSettings: options.videoImageSettings,
                         model: model,
-                        transcriptAvailableLanguages: options.transcriptAvailableLanguages
+                        transcriptAvailableLanguages: options.transcriptAvailableLanguages,
+                        videoSupportedFileFormats: options.videoSupportedFileFormats
                     });
                 });
             },

cms/static/js/views/video_transcripts.js

@@ -19,14 +19,42 @@ define(
                 this.edxVideoID = options.edxVideoID;
                 this.clientVideoID = options.clientVideoID;
                 this.transcriptAvailableLanguages = options.transcriptAvailableLanguages;
+                this.videoSupportedFileFormats = options.videoSupportedFileFormats;
                 this.template = HtmlUtils.template(videoTranscriptsTemplate);
             },
 
+            /*
+            Sorts object by value and returns a sorted array.
+            */
+            sortByValue: function(itemObject) {
+                var sortedArray = [];
+
+                _.each(itemObject, function(value, key) {
+                    // Push each JSON Object entry in array by [value, key]
+                    sortedArray.push([value, key]);
+                });
+
+                return sortedArray.sort();
+            },
+
+            /*
+            Returns transcript title.
+            */
             getTranscriptClientTitle: function() {
-                // TODO: Use supported video file types.
-                return this.clientVideoID.substring(0, 20).replace('.mp4', '');
+                // Use a fixed length tranascript name.
+                var clientTitle = this.clientVideoID.substring(0, 20);
+
+                // Remove video file extension for transcript title.
+                _.each(this.videoSupportedFileFormats, function(videoFormat) {
+                    clientTitle.replace(videoFormat, '');
+                });
+
+                return clientTitle;
             },
 
+            /*
+            Toggles Show/Hide transcript button and transcripts container.
+            */
             toggleShowTranscripts: function() {
                 var $transcriptsWrapperEl = this.$el.find('.show-video-transcripts-wrapper');
 
@@ -53,15 +81,17 @@ define(
                     this.$el.find('.toggle-show-transcripts-icon').removeClass('fa-caret-right');
                     this.$el.find('.toggle-show-transcripts-icon').addClass('fa-caret-down');
                 }
-
             },
 
+            /*
+            Renders transcripts view.
+            */
             render: function() {
                 HtmlUtils.setHtml(
                     this.$el,
                     this.template({
                         transcripts: this.transcripts,
-                        transcriptAvailableLanguages: this.transcriptAvailableLanguages,
+                        transcriptAvailableLanguages: this.sortByValue(this.transcriptAvailableLanguages),
                         edxVideoID: this.edxVideoID,
                         // Slice last 4 letters so that video filetype is not attached
                         // eg. eg. Harry-Potter.mp4 would give us eg. Harry-Potter

cms/templates/js/video-transcripts.underscore

@@ -16,8 +16,8 @@
         <strong><%- StringUtils.interpolate(gettext('{transcriptClientTitle}_{transcriptLanguageCode}.{fileExtension}'), {transcriptClientTitle: transcriptClientTitle, transcriptLanguageCode: transcriptLanguageCode, fileExtension: transcriptDownloadFileFormat}) %></strong>
         <select id='transcript-language-<%- transcriptLanguageCode %>' class='transcript-language-menu'>
             <option value=''>Select Language</option>
-            <% _.each(transcriptAvailableLanguages, function(languageText, languageCode){ %>
-                <option value='<%- languageCode %>' <%- transcriptLanguageCode === languageCode ? 'selected': '' %>><%- languageText %></option>
+            <% _.each(transcriptAvailableLanguages, function(availableLanguage){ %>
+                <option value='<%- availableLanguage[1] %>' <%- transcriptLanguageCode === availableLanguage[1] ? 'selected': '' %>><%- availableLanguage[0] %></option>
             <% }) %>
         </select>
         <div class='transcript-actions'>