add new text fields to schedule and details settings page

cms/static/js/models/settings/course_details.js

@@ -12,6 +12,10 @@ var CourseDetails = Backbone.Model.extend({
         enrollment_start: null,
         enrollment_end: null,
         syllabus: null,
+        title: "",
+        subtitle: "",
+        duration: "",
+        description: "",
         short_description: "",
         overview: "",
         intro_video: null,
@@ -32,9 +36,30 @@ var CourseDetails = Backbone.Model.extend({
             newattrs, ["start_date", "end_date", "enrollment_start", "enrollment_end"]
         );
 
+        if (newattrs.title.length > 50) {
+            errors.title = gettext("The title field must be limited to 50 characters.");
+        }
+
+        if (newattrs.subtitle.length > 150) {
+            errors.subtitle = gettext("The subtitle field must be limited to 150 characters.");
+        }
+
+        if (newattrs.duration.length > 50) {
+            errors.duration = gettext("The duration field must be limited to 50 characters.");
+        }
+
+        if (newattrs.short_description.length > 150) {
+            errors.short_description = gettext("The short description field must be limited to 150 characters.");
+        }
+
+        if (newattrs.description.length > 1000) {
+            errors.description = gettext("The description field must be limited to 1000 characters.");
+        }
+
         if (newattrs.start_date === null) {
             errors.start_date = gettext("The course must have an assigned start date.");
         }
+
         if (newattrs.start_date && newattrs.end_date && newattrs.start_date >= newattrs.end_date) {
             errors.end_date = gettext("The course end date must be later than the course start date.");
         }

cms/static/js/spec/views/settings/main_spec.js

@@ -21,6 +21,10 @@ define([
                 course_id : '',
                 run : '',
                 syllabus : null,
+                title: '',
+                subtitle: '',
+                duration: '',
+                description: '',
                 short_description : '',
                 overview : '',
                 intro_video : null,

cms/static/js/views/settings/main.js

@@ -71,6 +71,16 @@ var DetailsView = ValidatingView.extend({
         this.$el.find('#' + this.fieldToSelectorMap['overview']).val(this.model.get('overview'));
         this.codeMirrorize(null, $('#course-overview')[0]);
 
+        if (this.model.get('title') !== '') {
+            this.$el.find('#' + this.fieldToSelectorMap.title).val(this.model.get('title'));
+        } else {
+            var displayName = this.$el.find('#' + this.fieldToSelectorMap.title).attr('data-display-name');
+            this.$el.find('#' + this.fieldToSelectorMap.title).val(displayName);
+        }
+        this.$el.find('#' + this.fieldToSelectorMap.subtitle).val(this.model.get('subtitle'));
+        this.$el.find('#' + this.fieldToSelectorMap.duration).val(this.model.get('duration'));
+        this.$el.find('#' + this.fieldToSelectorMap.description).val(this.model.get('description'));
+
         this.$el.find('#' + this.fieldToSelectorMap['short_description']).val(this.model.get('short_description'));
 
         this.$el.find('.current-course-introduction-video iframe').attr('src', this.model.videosourceSample());
@@ -126,6 +136,10 @@ var DetailsView = ValidatingView.extend({
         'enrollment_start' : 'enrollment-start',
         'enrollment_end' : 'enrollment-end',
         'overview' : 'course-overview',
+        'title': 'course-title',
+        'subtitle': 'course-subtitle',
+        'duration': 'course-duration',
+        'description': 'course-description',
         'short_description' : 'course-short-description',
         'intro_video' : 'course-introduction-video',
         'effort' : "course-effort",
@@ -194,9 +208,6 @@ var DetailsView = ValidatingView.extend({
 
     updateModel: function(event) {
         switch (event.currentTarget.id) {
-        case 'course-language':
-            this.setField(event);
-            break;
         case 'course-image-url':
             this.setField(event);
             var url = $(event.currentTarget).val();
@@ -208,9 +219,6 @@ var DetailsView = ValidatingView.extend({
                 $('#course-image').attr('src', $(event.currentTarget).val());
             }, 1000);
             break;
-        case 'course-effort':
-            this.setField(event);
-            break;
         case 'entrance-exam-enabled':
             if($(event.currentTarget).is(":checked")){
                 this.$('.div-grade-requirements').show();
@@ -228,9 +236,6 @@ var DetailsView = ValidatingView.extend({
                 this.setField(event);
             }
             break;
-        case 'course-short-description':
-            this.setField(event);
-            break;
         case 'pre-requisite-course':
             var value = $(event.currentTarget).val();
             value = value == "" ? [] : [value];
@@ -257,6 +262,15 @@ var DetailsView = ValidatingView.extend({
         case 'course-pace-instructor-paced':
             this.model.set('self_paced', JSON.parse(event.currentTarget.value));
             break;
+        case 'course-language':
+        case 'course-effort':
+        case 'course-title':
+        case 'course-subtitle':
+        case 'course-duration':
+        case 'course-description':
+        case 'course-short-description':
+            this.setField(event);
+            break;
         default: // Everything else is handled by datepickers and CodeMirror.
             break;
         }