Unstyled prototype for new list editor design.
This commit is contained in:
@@ -22,3 +22,17 @@ def set_show_captions(step, setting):
|
||||
world.wait_for(lambda _driver: world.css_visible('a.save-button'))
|
||||
world.browser.select('Show Captions', setting)
|
||||
world.css_click('a.save-button')
|
||||
|
||||
|
||||
@step('I see the correct videoalpha settings and default values$')
|
||||
def correct_videoalpha_settings(_step):
|
||||
world.verify_all_setting_entries([['Display Name', 'Video Alpha', False],
|
||||
['Download Track', '', False],
|
||||
['Download Video', '', False],
|
||||
['HTML5 Subtitles', '', False],
|
||||
['Show Captions', 'True', False],
|
||||
['Video Sources', '', False],
|
||||
['Youtube ID', 'OEoXaMPEzfM', False],
|
||||
['Youtube ID for .75x speed', '', False],
|
||||
['Youtube ID for 1.25x speed', '', False],
|
||||
['Youtube ID for 1.5x speed', '', False]])
|
||||
|
||||
@@ -22,3 +22,30 @@ Feature: Video Component
|
||||
Given I have created a Video component
|
||||
And I have toggled captions
|
||||
Then when I view the video it does show the captions
|
||||
|
||||
Scenario: Autoplay is disabled in Studio for Video Alpha
|
||||
Given I have created a Video Alpha component
|
||||
Then when I view the videoalpha it does not have autoplay enabled
|
||||
|
||||
Scenario: User can view Video Alpha metadata
|
||||
Given I have created a Video Alpha component
|
||||
And I edit and select Settings
|
||||
Then I see the correct videoalpha settings and default values
|
||||
|
||||
Scenario: User can modify Video Alpha display name
|
||||
Given I have created a Video Alpha component
|
||||
And I edit and select Settings
|
||||
Then I can modify the display name
|
||||
And my display name change is persisted on save
|
||||
|
||||
@skip
|
||||
Scenario: Video Alpha captions are hidden when "show captions" is false
|
||||
Given I have created a Video Alpha component
|
||||
And I have set "show captions" to False
|
||||
Then when I view the video it does not show the captions
|
||||
|
||||
@skip
|
||||
Scenario: Video Alpha captions are shown when "show captions" is true
|
||||
Given I have created a Video Alpha component
|
||||
And I have set "show captions" to True
|
||||
Then when I view the video it does show the captions
|
||||
|
||||
@@ -5,9 +5,9 @@ from lettuce import world, step
|
||||
############### ACTIONS ####################
|
||||
|
||||
|
||||
@step('when I view the video it does not have autoplay enabled')
|
||||
def does_not_autoplay(_step):
|
||||
assert world.css_find('.video')[0]['data-autoplay'] == 'False'
|
||||
@step('when I view the (.*) it does not have autoplay enabled')
|
||||
def does_not_autoplay(_step, video_type):
|
||||
assert world.css_find('.%s' % video_type)[0]['data-autoplay'] == 'False'
|
||||
assert world.css_has_class('.video_control', 'play')
|
||||
|
||||
|
||||
|
||||
@@ -1,25 +0,0 @@
|
||||
Feature: Video Alpha Component Editor
|
||||
As a course author, I want to be able to create videoalpha components.
|
||||
|
||||
Scenario: User can view metadata
|
||||
Given I have created a Video Alpha component
|
||||
And I edit and select Settings
|
||||
Then I see the correct videoalpha settings and default values
|
||||
|
||||
Scenario: User can modify display name
|
||||
Given I have created a Video Alpha component
|
||||
And I edit and select Settings
|
||||
Then I can modify the display name
|
||||
And my display name change is persisted on save
|
||||
|
||||
@skip
|
||||
Scenario: Captions are hidden when "show captions" is false
|
||||
Given I have created a Video component
|
||||
And I have set "show captions" to False
|
||||
Then when I view the video it does not show the captions
|
||||
|
||||
@skip
|
||||
Scenario: Captions are shown when "show captions" is true
|
||||
Given I have created a Video component
|
||||
And I have set "show captions" to True
|
||||
Then when I view the video it does show the captions
|
||||
@@ -1,18 +0,0 @@
|
||||
# disable missing docstring
|
||||
# pylint: disable=C0111
|
||||
|
||||
from lettuce import world, step
|
||||
|
||||
|
||||
@step('I see the correct videoalpha settings and default values$')
|
||||
def correct_videoalpha_settings(_step):
|
||||
world.verify_all_setting_entries([['Default Speed', '', False],
|
||||
['Display Name', 'Video Alpha', False],
|
||||
['Download Track', '', False],
|
||||
['Download Video', '', False],
|
||||
['HTML5 Subtitles', '', False],
|
||||
['Show Captions', 'True', False],
|
||||
['Speed: .75x', '', False],
|
||||
['Speed: 1.25x', '', False],
|
||||
['Speed: 1.5x', '', False],
|
||||
['Video Sources', '', False]])
|
||||
@@ -1,6 +0,0 @@
|
||||
Feature: Video Alpha Component
|
||||
As a course author, I want to be able to view my created videos in Studio.
|
||||
|
||||
Scenario: Autoplay is disabled in Studio
|
||||
Given I have created a Video Alpha component
|
||||
Then when I view the video alpha it does not have autoplay enabled
|
||||
@@ -1,10 +0,0 @@
|
||||
# disable missing docstring
|
||||
# pylint: disable=C0111
|
||||
|
||||
from lettuce import world, step
|
||||
|
||||
|
||||
@step('when I view the video alpha it does not have autoplay enabled')
|
||||
def does_not_autoplay(_step):
|
||||
assert world.css_find('.videoalpha')[0]['data-autoplay'] == 'False'
|
||||
assert world.css_has_class('.video_control', 'play')
|
||||
@@ -334,3 +334,13 @@ describe "Test Metadata Editor", ->
|
||||
|
||||
it "has an update model method", ->
|
||||
assertUpdateModel(@listView, null, ['a new value'])
|
||||
|
||||
it "can add an entry", ->
|
||||
expect(@listView.model.get('value').length).toEqual(2)
|
||||
@listView.$el.find('.setting-add').click()
|
||||
expect(@listView.$el.find('input.input').length).toEqual(3)
|
||||
|
||||
it "can remove an entry", ->
|
||||
expect(@listView.model.get('value').length).toEqual(2)
|
||||
@listView.$el.find('.setting-remove').first().click()
|
||||
expect(@listView.model.get('value').length).toEqual(1)
|
||||
|
||||
@@ -319,17 +319,46 @@ CMS.Views.Metadata.List = CMS.Views.Metadata.AbstractEditor.extend({
|
||||
events : {
|
||||
"click .setting-clear" : "clear",
|
||||
"keypress .setting-input" : "showClearButton",
|
||||
"change input" : "updateModel"
|
||||
"change input" : "updateModel",
|
||||
"click .setting-add" : "addEntry",
|
||||
"click .setting-remove" : "removeEntry"
|
||||
},
|
||||
|
||||
templateName: "metadata-list-entry",
|
||||
|
||||
getValueFromEditor: function () {
|
||||
return _.map(this.$el.find('#' + this.uniqueId).val().split(/,/),
|
||||
function (url) { return url.trim(); });
|
||||
return _.map(
|
||||
this.$el.find('li input'),
|
||||
function (ele) { return ele.value.trim(); }
|
||||
).filter(_.identity);
|
||||
},
|
||||
|
||||
setValueInEditor: function (value) {
|
||||
this.$el.find('.input').val(value.join(', '));
|
||||
var list = this.$el.find('ol');
|
||||
list.empty();
|
||||
_.each(value, function(ele, index) {
|
||||
var template = _.template(
|
||||
'<li>' +
|
||||
'<input class="input" value="<%= ele %>">' +
|
||||
'<a href="#" class="setting-remove" data-index="<%= index %>">remove</a>' +
|
||||
'</li>'
|
||||
);
|
||||
list.append($(template({'ele': ele, 'index': index})));
|
||||
});
|
||||
},
|
||||
|
||||
addEntry: function(event) {
|
||||
event.preventDefault();
|
||||
// We don't call updateModel here since it's bound to the
|
||||
// change event
|
||||
var list = this.model.get('value') || [];
|
||||
this.setValueInEditor(list.concat(['']))
|
||||
},
|
||||
|
||||
removeEntry: function(event) {
|
||||
event.preventDefault();
|
||||
var entry = $(event.currentTarget).siblings().val();
|
||||
this.setValueInEditor(_.without(this.model.get('value'), entry));
|
||||
this.updateModel();
|
||||
}
|
||||
});
|
||||
|
||||
@@ -1,6 +1,9 @@
|
||||
<div class="wrapper-comp-setting">
|
||||
<label class="label setting-label" for="<%= uniqueId %>"><%= model.get('display_name')%></label>
|
||||
<input class="input setting-input" type="text" id="<%= uniqueId %>" value='<%= model.get("value") %>'/>
|
||||
<div id="<%= uniqueId %>" class="setting-list-wrapper">
|
||||
<ol class="setting-input" type="text"></ol>
|
||||
</div>
|
||||
<a href="#" class="setting-add">add</a>
|
||||
<button class="action setting-clear inactive" type="button" name="setting-clear" value="<%= gettext("Clear") %>" data-tooltip="<%= gettext("Clear") %>">
|
||||
<i class="icon-undo"></i><span class="sr">"<%= gettext("Clear Value") %>"</span>
|
||||
</button>
|
||||
|
||||
Reference in New Issue
Block a user