Add UI Toolkit to the platform

.jshintrc

@@ -142,6 +142,7 @@
         // Django i18n catalog globals
         "interpolate",
         "gettext",
+        "ngettext",
 
         // Miscellaneous globals
         "JSON"

cms/djangoapps/contentstore/features/component.feature

@@ -59,19 +59,3 @@ Feature: CMS.Component Adding
 #           | Component                     |
 #           | Problem Written in LaTeX      |
 #           | Problem with Adaptive Hint in Latex  |
-
-    Scenario: I can set the display name of a component
-        Given I am in Studio editing a new unit
-        When I add a "Text" "HTML" component
-        Then I see the display name is "Text"
-        When I change the display name to "I'm the Cuddliest!"
-        Then I see the display name is "I'm the Cuddliest!"
-
-    Scenario: If a component has no display name, the category is displayed
-        Given I am in Studio editing a new unit
-        When I add a "Blank Advanced Problem" "Advanced Problem" component
-        Then I see the display name is "Blank Advanced Problem"
-        When I change the display name to ""
-        Then I see the display name is "problem"
-        When I unset the display name
-        Then I see the display name is "Blank Advanced Problem"

cms/djangoapps/contentstore/features/course-export.feature

@@ -2,14 +2,6 @@
 Feature: Course export
   I want to export my course to a tar.gz file to share with others or check into source control
 
-  Scenario: User is directed to unit with bad XML when export fails
-    Given I am in Studio editing a new unit
-    When I add a "Blank Advanced Problem" "Advanced Problem" component
-    And I edit and enter bad XML
-    And I export the course
-    Then I get an error dialog
-    And I can click to go to the unit with the error
-
  # Disabling due to failure on master. 05/21/2014 TODO: fix
  # Scenario: User is directed to problem with & in it when export fails
  #   Given I am in Studio editing a new unit

cms/djangoapps/contentstore/features/courses.feature

@@ -4,15 +4,6 @@ Feature: CMS.Create Course
   As a course author
   I want to create courses
 
-  Scenario: Create a course
-    Given There are no courses
-    And I am logged into Studio
-    When I click the New Course button
-    And I fill in the new course information
-    And I press the "Create" button
-    Then the Courseware page has loaded in Studio
-    And I see a link for adding a new section
-
   Scenario: Error message when org/course/run tuple is too long
     Given There are no courses
     And I am logged into Studio

cms/static/edx-ui-toolkit/js

@@ -0,0 +1 @@
+../../../node_modules/edx-ui-toolkit/src/js

cms/static/js_test.yml

@@ -78,6 +78,8 @@ src_paths:
     - js/certificates
     - js/factories
     - common/js
+    - edx-pattern-library/js
+    - edx-ui-toolkit/js
 
 # Paths to spec (test) JavaScript files
 # We should define the custom path mapping in /coffee/spec/main.coffee as well e.g. certificates etc.

cms/static/js_test_squire.yml

@@ -73,6 +73,8 @@ src_paths:
     - js/utils
     - js/views
     - common/js
+    - edx-pattern-library/js
+    - edx-ui-toolkit/js
 
 # Paths to spec (test) JavaScript files
 spec_paths:

common/lib/xmodule/xmodule/capa_base.py

@@ -399,7 +399,6 @@ def get_html(self):
             'ajax_url': self.runtime.ajax_url,
             'progress_status': Progress.to_js_status_str(progress),
             'progress_detail': Progress.to_js_detail_str(progress),
-            'content': self.get_problem_html(encapsulate=False)
         })
 
     def check_button_name(self):

common/lib/xmodule/xmodule/js/spec/capa/display_spec.coffee

@@ -1,4 +1,6 @@
 describe 'Problem', ->
+  problem_content_default = readFixtures('problem_content.html')
+
   beforeEach ->
     # Stub MathJax
     window.MathJax =
@@ -20,7 +22,7 @@ describe 'Problem', ->
 
     spyOn Logger, 'log'
     spyOn($.fn, 'load').andCallFake (url, callback) ->
-      $(@).html readFixtures('problem_content.html')
+      $(@).html problem_content_default
       callback()
 
   describe 'constructor', ->
@@ -96,13 +98,27 @@ describe 'Problem', ->
         @problem.renderProgressState()
         expect(@problem.$('.problem-progress').html()).toEqual "(1 point possible)"
 
+      it 'displays the number of points possible when rendering happens with the content', ->
+        @problem.el.data('progress_status', 'none')
+        @problem.el.data('progress_detail', '0/2')
+        expect(@problem.$('.problem-progress').html()).toEqual ""
+        @problem.render(problem_content_default)
+        expect(@problem.$('.problem-progress').html()).toEqual "(2 points possible)"
+
     describe 'with any other valid status', ->
       it 'reports the current score', ->
         @problem.el.data('progress_status', 'foo')
         @problem.el.data('progress_detail', '1/1')
         @problem.renderProgressState()
         expect(@problem.$('.problem-progress').html()).toEqual "(1/1 point)"
 
+      it 'shows current score when rendering happens with the content', ->
+        @problem.el.data('progress_status', 'test status')
+        @problem.el.data('progress_detail', '2/2')
+        expect(@problem.$('.problem-progress').html()).toEqual ""
+        @problem.render(problem_content_default)
+        expect(@problem.$('.problem-progress').html()).toEqual "(2/2 points)"
+
   describe 'render', ->
     beforeEach ->
       @problem = new Problem($('.xblock-student_view'))

common/lib/xmodule/xmodule/js/src/capa/display.coffee

@@ -5,15 +5,14 @@ class @Problem
     @id = @el.data('problem-id')
     @element_id = @el.attr('id')
     @url = @el.data('url')
-    @content = @el.data('content')
 
     # has_timed_out and has_response are used to ensure that are used to
     # ensure that we wait a minimum of ~ 1s before transitioning the check
     # button from disabled to enabled
     @has_timed_out = false
     @has_response = false
 
-    @render(@content)
+    @render()
 
   $: (selector) ->
     $(selector, @el)
@@ -159,6 +158,7 @@ class @Problem
         @setupInputTypes()
         @bind()
         @queueing()
+        @renderProgressState()
       @el.attr('aria-busy', 'false')
     else
       $.postWithPrefix "#{@url}/problem_get", (response) =>

common/lib/xmodule/xmodule/video_module/video_module.py

@@ -589,6 +589,20 @@ def definition_to_xml(self, resource_fs):
 
         return xml
 
+    def create_youtube_url(self, youtube_id):
+        """
+
+        Args:
+            youtube_id: The ID of the video to create a link for
+
+        Returns:
+            A full youtube url to the video whose ID is passed in
+        """
+        if youtube_id:
+            return 'https://www.youtube.com/watch?v={0}'.format(youtube_id)
+        else:
+            return ''
+
     def get_context(self):
         """
         Extend context by data for transcript basic tab.
@@ -612,10 +626,7 @@ def get_youtube_link(video_id):
                 if val_youtube_id:
                     video_id = val_youtube_id
 
-            if video_id:
-                return 'http://youtu.be/{0}'.format(video_id)
-            else:
-                return ''
+            return self.create_youtube_url(video_id)
 
         _ = self.runtime.service(self, "i18n").ugettext
         video_url.update({
@@ -848,7 +859,8 @@ def student_view_data(self, context=None):
                     val_video_data = edxval_api.get_video_info(self.edx_video_id)
                     # Unfortunately, the VAL API is inconsistent in how it returns the encodings, so remap here.
                     for enc_vid in val_video_data.pop('encoded_videos'):
-                        encoded_videos[enc_vid['profile']] = {key: enc_vid[key] for key in ["url", "file_size"]}
+                        if enc_vid['profile'] in video_profile_names:
+                            encoded_videos[enc_vid['profile']] = {key: enc_vid[key] for key in ["url", "file_size"]}
                 except edxval_api.ValVideoNotFoundError:
                     pass
 
@@ -861,6 +873,14 @@ def student_view_data(self, context=None):
                     "file_size": 0,  # File size is unknown for fallback URLs
                 }
 
+            # Include youtube link if there is no encoding for mobile- ie only a fallback URL or no encodings at all
+            # We are including a fallback URL for older versions of the mobile app that don't handle Youtube urls
+            if self.youtube_id_1_0:
+                encoded_videos["youtube"] = {
+                    "url": self.create_youtube_url(self.youtube_id_1_0),
+                    "file_size": 0,  # File size is not relevant for external link
+                }
+
         transcripts_info = self.get_transcripts_info()
         transcripts = {
             lang: self.runtime.handler_url(self, 'transcript', 'download', query="lang=" + lang, thirdparty=True)

common/static/common/js/components/views/feedback_notification.js

@@ -1,34 +1,34 @@
-;(function (define) {
+;(function(define) {
     'use strict';
-    define(["jquery", "underscore", "underscore.string", "common/js/components/views/feedback"],
+    define(['jquery', 'underscore', 'underscore.string', 'common/js/components/views/feedback'],
         function($, _, str, SystemFeedbackView) {
 
-        var Notification = SystemFeedbackView.extend({
-            options: $.extend({}, SystemFeedbackView.prototype.options, {
-                type: "notification",
-                closeIcon: false
-            })
-        });
-
-        // create Notification.Warning, Notification.Confirmation, etc
-        var capitalCamel, intents;
-        capitalCamel = _.compose(str.capitalize, str.camelize);
-        intents = ["warning", "error", "confirmation", "announcement", "step-required", "help", "mini"];
-        _.each(intents, function(intent) {
-            var subclass;
-            subclass = Notification.extend({
-                options: $.extend({}, Notification.prototype.options, {
-                    intent: intent
+            var Notification = SystemFeedbackView.extend({
+                options: $.extend({}, SystemFeedbackView.prototype.options, {
+                    type: 'notification',
+                    closeIcon: false
                 })
             });
-            Notification[capitalCamel(intent)] = subclass;
-        });
 
-        // set more sensible defaults for Notification.Mini views
-        var miniOptions = Notification.Mini.prototype.options;
-        miniOptions.minShown = 1250;
-        miniOptions.closeIcon = false;
+            // create Notification.Warning, Notification.Confirmation, etc
+            var capitalCamel, intents;
+            capitalCamel = _.compose(str.capitalize, str.camelize);
+            intents = ['warning', 'error', 'confirmation', 'announcement', 'step-required', 'help', 'mini'];
+            _.each(intents, function(intent) {
+                var subclass;
+                subclass = Notification.extend({
+                    options: $.extend({}, Notification.prototype.options, {
+                        intent: intent
+                    })
+                });
+                Notification[capitalCamel(intent)] = subclass;
+            });
+
+            // set more sensible defaults for Notification.Mini views
+            var miniOptions = Notification.Mini.prototype.options;
+            miniOptions.minShown = 1250;
+            miniOptions.closeIcon = false;
 
-        return Notification;
-    });
+            return Notification;
+        });
 }).call(this, define || RequireJS.define);

common/static/edx-pattern-library/js

@@ -0,0 +1 @@
+../../../node_modules/edx-pattern-library/pattern-library/js

common/static/edx-ui-toolkit/js

@@ -0,0 +1 @@
+../../../node_modules/edx-ui-toolkit/src/js/

common/static/js_test_requirejs.yml

@@ -50,6 +50,8 @@ lib_paths:
 # Paths to source JavaScript files
 src_paths:
     - common/js
+    - edx-pattern-library/js
+    - edx-ui-toolkit/js
 
 # Paths to spec (test) JavaScript files
 spec_paths:

common/static/sass/bourbon/css3/_animation.scss

@@ -3,50 +3,50 @@
 
 // Official animation shorthand property.
 @mixin animation ($animations...) {
-  @include prefixer(animation, $animations, webkit moz spec);
+  @include prefixer(animation, $animations, spec);
 }
 
 // Individual Animation Properties
 @mixin animation-name ($names...) {
-  @include prefixer(animation-name, $names, webkit moz spec);
+  @include prefixer(animation-name, $names, spec);
 }
 
 
 @mixin animation-duration ($times...) {
-  @include prefixer(animation-duration, $times, webkit moz spec);
+  @include prefixer(animation-duration, $times, spec);
 }
 
 
 @mixin animation-timing-function ($motions...) {
 // ease | linear | ease-in | ease-out | ease-in-out
-  @include prefixer(animation-timing-function, $motions, webkit moz spec);
+  @include prefixer(animation-timing-function, $motions, spec);
 }
 
 
 @mixin animation-iteration-count ($values...) {
 // infinite | <number>
-  @include prefixer(animation-iteration-count, $values, webkit moz spec);
+  @include prefixer(animation-iteration-count, $values, spec);
 }
 
 
 @mixin animation-direction ($directions...) {
 // normal | alternate
-  @include prefixer(animation-direction, $directions, webkit moz spec);
+  @include prefixer(animation-direction, $directions, spec);
 }
 
 
 @mixin animation-play-state ($states...) {
 // running | paused
-  @include prefixer(animation-play-state, $states, webkit moz spec);
+  @include prefixer(animation-play-state, $states, spec);
 }
 
 
 @mixin animation-delay ($times...) {
-  @include prefixer(animation-delay, $times, webkit moz spec);
+  @include prefixer(animation-delay, $times, spec);
 }
 
 
 @mixin animation-fill-mode ($modes...) {
 // none | forwards | backwards | both
-  @include prefixer(animation-fill-mode, $modes, webkit moz spec);
+  @include prefixer(animation-fill-mode, $modes, spec);
 }

common/static/sass/bourbon/css3/_backface-visibility.scss

@@ -2,5 +2,5 @@
 // Backface-visibility mixin
 //************************************************************************//
 @mixin backface-visibility($visibility) {
-  @include prefixer(backface-visibility, $visibility, webkit spec);
+  @include prefixer(backface-visibility, $visibility, spec);
 }