diff --git a/cms/djangoapps/contentstore/features/component.py b/cms/djangoapps/contentstore/features/component.py index b5aa8195d1..8adbb0fdae 100644 --- a/cms/djangoapps/contentstore/features/component.py +++ b/cms/djangoapps/contentstore/features/component.py @@ -28,7 +28,7 @@ def see_a_single_step_component(step): for step_hash in step.hashes: component = step_hash['Component'] assert_in(component, ['Discussion', 'Video']) - component_css = 'div.xmodule_{}Module'.format(component) + component_css = '.xmodule_{}Module'.format(component) assert_true(world.is_css_present(component_css), "{} couldn't be found".format(component)) @@ -56,7 +56,7 @@ def see_a_multi_step_component(step, category): html_matcher = { 'Text': '\n \n', 'Announcement': '

Announcement Date

', - 'Zooming Image Tool': '

Zooming Image Tool

', + 'Zooming Image Tool': '

Zooming Image Tool

', 'E-text Written in LaTeX': '

Example: E-text page

', 'Raw HTML': '

This template is similar to the Text template. The only difference is', } @@ -64,19 +64,19 @@ def see_a_multi_step_component(step, category): assert_in(html_matcher[step_hash['Component']].strip(), actual_html.strip()) else: actual_text = world.css_text(selector, index=idx) - assert_in(step_hash['Component'].upper(), actual_text) + assert_in(step_hash['Component'], actual_text) @step(u'I see a "([^"]*)" Problem component$') def see_a_problem_component(step, category): - component_css = 'div.xmodule_CapaModule' + component_css = '.xmodule_CapaModule' assert_true(world.is_css_present(component_css), 'No problem was added to the unit.') - problem_css = 'li.studio-xblock-wrapper div.xblock-student_view' + problem_css = '.studio-xblock-wrapper .xblock-student_view' # This view presents the given problem component in uppercase. Assert that the text matches - # the component selected (in uppercase) - assert_true(world.css_contains_text(problem_css, category.upper())) + # the component selected + assert_true(world.css_contains_text(problem_css, category)) @step(u'I add a "([^"]*)" "([^"]*)" component$') @@ -88,17 +88,17 @@ def add_component_category(step, component, category): @step(u'I delete all components$') def delete_all_components(step): - count = len(world.css_find('ol.reorderable-container li.studio-xblock-wrapper')) + count = len(world.css_find('.reorderable-container .studio-xblock-wrapper')) step.given('I delete "' + str(count) + '" component') @step(u'I delete "([^"]*)" component$') def delete_components(step, number): world.wait_for_xmodule() - delete_btn_css = 'a.delete-button' - prompt_css = 'div#prompt-warning' - btn_css = '{} button.action-primary'.format(prompt_css) - saving_mini_css = 'div#page-notification .wrapper-notification-mini' + delete_btn_css = '.delete-button' + prompt_css = '#prompt-warning' + btn_css = '{} .action-primary'.format(prompt_css) + saving_mini_css = '#page-notification .wrapper-notification-mini' for _ in range(int(number)): world.css_click(delete_btn_css) assert_true( @@ -124,7 +124,7 @@ def see_no_components(steps): @step(u'I delete a component') def delete_one_component(step): - world.css_click('a.delete-button') + world.css_click('.delete-button') @step(u'I edit and save a component') @@ -141,16 +141,16 @@ def duplicated_component(step, ordinal): "third": 2, } index = ord_map[ordinal] - duplicate_btn_css = 'a.duplicate-button' + duplicate_btn_css = '.duplicate-button' world.css_click(duplicate_btn_css, int(index)) @step(u'I see a Problem component with display name "([^"]*)" in position "([^"]*)"$') def see_component_in_position(step, display_name, index): - component_css = 'div.xmodule_CapaModule' + component_css = '.xmodule_CapaModule' def find_problem(_driver): - return world.css_text(component_css, int(index)).startswith(display_name.upper()) + return world.css_text(component_css, int(index)).startswith(display_name) world.wait_for(find_problem, timeout_msg='Did not find the duplicated problem') @@ -158,7 +158,7 @@ def see_component_in_position(step, display_name, index): @step(u'I see the display name is "([^"]*)"') def check_component_display_name(step, display_name): # The display name for the unit uses the same structure, must differentiate by level-element. - label = world.css_html("section.level-element>header>div>div>span.xblock-display-name") + label = world.css_html(".level-element>header>div>div>span.xblock-display-name") assert_equal(display_name, label) diff --git a/cms/djangoapps/contentstore/features/problem-editor.py b/cms/djangoapps/contentstore/features/problem-editor.py index 92f9fda6f9..c8fc76ed87 100644 --- a/cms/djangoapps/contentstore/features/problem-editor.py +++ b/cms/djangoapps/contentstore/features/problem-editor.py @@ -125,7 +125,7 @@ def my_display_name_change_is_persisted_on_save(step): @step('the problem display name is "(.*)"$') def verify_problem_display_name(step, name): - assert_equal(name.upper(), world.browser.find_by_css('.problem-header').text) + assert_equal(name, world.browser.find_by_css('.problem-header').text) @step('I can specify special characters in the display name') @@ -332,8 +332,8 @@ def i_edit_blank_problem_for_annotation_response(_step): @step(u'I can see cheatsheet$') def verify_cheat_sheet_displaying(_step): - world.css_click("a.cheatsheet-toggle") - css_selector = 'article.simple-editor-cheatsheet' + world.css_click(".cheatsheet-toggle") + css_selector = '.simple-editor-cheatsheet' world.wait_for_visible(css_selector) diff --git a/cms/static/images/cms-editor_checkbox.png b/cms/static/images/cms-editor_checkbox.png new file mode 100644 index 0000000000..30e0591cbd Binary files /dev/null and b/cms/static/images/cms-editor_checkbox.png differ diff --git a/cms/static/images/cms-editor_checkbox.svg b/cms/static/images/cms-editor_checkbox.svg new file mode 100644 index 0000000000..28a841b07c --- /dev/null +++ b/cms/static/images/cms-editor_checkbox.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + + diff --git a/cms/static/images/cms-editor_dropdown.png b/cms/static/images/cms-editor_dropdown.png new file mode 100644 index 0000000000..fc204e7779 Binary files /dev/null and b/cms/static/images/cms-editor_dropdown.png differ diff --git a/cms/static/images/cms-editor_dropdown.svg b/cms/static/images/cms-editor_dropdown.svg new file mode 100644 index 0000000000..1c454266af --- /dev/null +++ b/cms/static/images/cms-editor_dropdown.svg @@ -0,0 +1,13 @@ + + + + + + + + diff --git a/cms/static/images/cms-editor_explanation.png b/cms/static/images/cms-editor_explanation.png new file mode 100644 index 0000000000..ef5d270c50 Binary files /dev/null and b/cms/static/images/cms-editor_explanation.png differ diff --git a/cms/static/images/cms-editor_explanation.svg b/cms/static/images/cms-editor_explanation.svg new file mode 100644 index 0000000000..545e28a80c --- /dev/null +++ b/cms/static/images/cms-editor_explanation.svg @@ -0,0 +1,26 @@ + + + + + + + + + + + + + + + + + diff --git a/cms/static/images/cms-editor_heading.png b/cms/static/images/cms-editor_heading.png new file mode 100644 index 0000000000..11e7442ef8 Binary files /dev/null and b/cms/static/images/cms-editor_heading.png differ diff --git a/cms/static/images/cms-editor_heading.svg b/cms/static/images/cms-editor_heading.svg new file mode 100644 index 0000000000..1db34636ac --- /dev/null +++ b/cms/static/images/cms-editor_heading.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + diff --git a/cms/static/images/cms-editor_number.png b/cms/static/images/cms-editor_number.png new file mode 100644 index 0000000000..05cd08076d Binary files /dev/null and b/cms/static/images/cms-editor_number.png differ diff --git a/cms/static/images/cms-editor_number.svg b/cms/static/images/cms-editor_number.svg new file mode 100644 index 0000000000..d011a79831 --- /dev/null +++ b/cms/static/images/cms-editor_number.svg @@ -0,0 +1,17 @@ + + + + + + + + + diff --git a/cms/static/images/cms-editor_radio.png b/cms/static/images/cms-editor_radio.png new file mode 100644 index 0000000000..1657b72c61 Binary files /dev/null and b/cms/static/images/cms-editor_radio.png differ diff --git a/cms/static/images/cms-editor_radio.svg b/cms/static/images/cms-editor_radio.svg new file mode 100644 index 0000000000..a21b231fe7 --- /dev/null +++ b/cms/static/images/cms-editor_radio.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + + diff --git a/cms/static/images/cms-editor_text.png b/cms/static/images/cms-editor_text.png new file mode 100644 index 0000000000..7c16befbfe Binary files /dev/null and b/cms/static/images/cms-editor_text.png differ diff --git a/cms/static/images/cms-editor_text.svg b/cms/static/images/cms-editor_text.svg new file mode 100644 index 0000000000..f999157204 --- /dev/null +++ b/cms/static/images/cms-editor_text.svg @@ -0,0 +1,22 @@ + + + + + + + + + + + + + diff --git a/cms/static/images/problem-editor-icons.png b/cms/static/images/problem-editor-icons.png deleted file mode 100644 index 2d958fb96a..0000000000 Binary files a/cms/static/images/problem-editor-icons.png and /dev/null differ diff --git a/cms/templates/ux/reference/container.html b/cms/templates/ux/reference/container.html index 569e379105..8563122086 100644 --- a/cms/templates/ux/reference/container.html +++ b/cms/templates/ux/reference/container.html @@ -336,9 +336,9 @@

-

+

Multiple Choice -

+
(1 point possible)
diff --git a/cms/templates/widgets/problem-edit.html b/cms/templates/widgets/problem-edit.html index 80596193f9..da0be1724e 100644 --- a/cms/templates/widgets/problem-edit.html +++ b/cms/templates/widgets/problem-edit.html @@ -13,24 +13,59 @@ %if enable_markdown:
@@ -43,12 +78,12 @@
-
${_("Heading 1")}
+
${_("Heading")}
- + ${_(
-
H1
+
H3
 =====
 
@@ -56,7 +91,7 @@
${_("Multiple Choice")}
- + ${_(
( ) red
@@ -67,7 +102,7 @@
             
${_("Checkboxes")}
- + ${_(
[x] earth
@@ -78,7 +113,7 @@
             
${_("Text Input")}
- + ${_(
= dog
@@ -89,7 +124,7 @@ or= mouse
${_("Numerical Input")}
- + ${_(
= 3.14 +- 2%
@@ -99,7 +134,7 @@ or= mouse
${_("Dropdown")}
- + ${_(
[[wrong, (right)]]
@@ -114,7 +149,7 @@ or= mouse
${_("Explanation")}
- + ${_(
[explanation] A short explanation of the answer. [explanation]
diff --git a/common/lib/xmodule/xmodule/css/editor/edit.scss b/common/lib/xmodule/xmodule/css/editor/edit.scss index c31c9656f7..d8cb28f966 100644 --- a/common/lib/xmodule/xmodule/css/editor/edit.scss +++ b/common/lib/xmodule/xmodule/css/editor/edit.scss @@ -13,14 +13,21 @@ padding: ($baseline/4); border-bottom-color: #a5aaaf; - a { - display: block; + button { + display: inline-block; @include float(left); - padding: 3px ($baseline/2) 7px; + padding: 3px ($baseline/2) 5px; margin-left: 7px; + border: 0; border-radius: 2px; + background: transparent; - &:hover, &:focus { + .icon { + height: 21px; + } + + &:hover, + &:focus { background: rgba(255, 255, 255, .5); } } @@ -60,4 +67,4 @@ } } } -} \ No newline at end of file +} diff --git a/common/lib/xmodule/xmodule/css/problem/edit.scss b/common/lib/xmodule/xmodule/css/problem/edit.scss index ac6f3f90ff..a3c6576e9a 100644 --- a/common/lib/xmodule/xmodule/css/problem/edit.scss +++ b/common/lib/xmodule/xmodule/css/problem/edit.scss @@ -7,6 +7,7 @@ margin-top: -4px; padding: 3px 9px; font-size: 12px; + color: $link-color; &.current { border: 1px solid $lightGrey !important; @@ -16,7 +17,8 @@ pointer-events: none; cursor: none; - &:hover, &:focus { + &:hover, + &:focus { box-shadow: 0 0 0 0 !important; background-color: $white; } @@ -79,11 +81,15 @@ } .col { - float: left; + display: block; &.sample { width: 60px; margin-right: 30px; + + .icon { + height: ($baseline * 1.5); + } } } @@ -110,40 +116,5 @@ width: 26px; height: 21px; vertical-align: middle; - background: url('#{$static-path}/images/problem-editor-icons.png') no-repeat; + color: $base-font-color; } - -.problem-editor-icon.heading1 { - width: 18px; - background-position: -265px 0; -} - -.problem-editor-icon.multiple-choice { - background-position: 0 0; -} - -.problem-editor-icon.checks { - background-position: -56px 0; -} - -.problem-editor-icon.string { - width: 28px; - background-position: -111px 0; -} - -.problem-editor-icon.number { - width: 24px; - background-position: -168px 0; -} - -.problem-editor-icon.dropdown { - width: 17px; - background-position: -220px 0; -} - -.problem-editor-icon.explanation { - width: 17px; - background-position: -307px 0; -} - - diff --git a/common/lib/xmodule/xmodule/js/fixtures/crowdsource_hinter.html b/common/lib/xmodule/xmodule/js/fixtures/crowdsource_hinter.html index d7edb42a79..d7d6d952d2 100644 --- a/common/lib/xmodule/xmodule/js/fixtures/crowdsource_hinter.html +++ b/common/lib/xmodule/xmodule/js/fixtures/crowdsource_hinter.html @@ -8,9 +8,9 @@
-

+

Numerical Input -

+
(1/1 point)
diff --git a/common/lib/xmodule/xmodule/js/fixtures/jsinput_problem.html b/common/lib/xmodule/xmodule/js/fixtures/jsinput_problem.html index 94a1d8f729..1d48e92e3a 100644 --- a/common/lib/xmodule/xmodule/js/fixtures/jsinput_problem.html +++ b/common/lib/xmodule/xmodule/js/fixtures/jsinput_problem.html @@ -1,4 +1,4 @@ -

Custom Javascript Display and Grading

+

Custom Javascript Display and Grading

diff --git a/common/lib/xmodule/xmodule/js/fixtures/problem_content.html b/common/lib/xmodule/xmodule/js/fixtures/problem_content.html index 3e7d2107b7..60c0c78a7c 100644 --- a/common/lib/xmodule/xmodule/js/fixtures/problem_content.html +++ b/common/lib/xmodule/xmodule/js/fixtures/problem_content.html @@ -1,4 +1,4 @@ -

Problem Header

+

Problem Header

diff --git a/common/lib/xmodule/xmodule/js/fixtures/problem_content_1240.html b/common/lib/xmodule/xmodule/js/fixtures/problem_content_1240.html index 0538ae498f..cb6aab2541 100644 --- a/common/lib/xmodule/xmodule/js/fixtures/problem_content_1240.html +++ b/common/lib/xmodule/xmodule/js/fixtures/problem_content_1240.html @@ -1,4 +1,4 @@ -

Problem Header

+

Problem Header

diff --git a/common/lib/xmodule/xmodule/js/spec/problem/edit_spec.coffee b/common/lib/xmodule/xmodule/js/spec/problem/edit_spec.coffee index 575b4c4246..a10ad3d4e4 100644 --- a/common/lib/xmodule/xmodule/js/spec/problem/edit_spec.coffee +++ b/common/lib/xmodule/xmodule/js/spec/problem/edit_spec.coffee @@ -258,9 +258,9 @@ describe 'MarkdownEditingDescriptor', -> """) it 'converts multiple choice shuffle to xml', -> data = MarkdownEditingDescriptor.markdownToXml("""A multiple choice problem presents radio buttons for student input. Students can only select a single option presented. Multiple Choice questions have been the subject of many areas of research due to the early invention and adoption of bubble sheets. - + One of the main elements that goes into a good multiple choice question is the existence of good distractors. That is, each of the alternate responses presented to the student should be the result of a plausible mistake that a student might make. - + What Apple device competed with the portable CD player? (!x@) The iPad (@) Napster @@ -268,16 +268,16 @@ describe 'MarkdownEditingDescriptor', -> ( ) The vegetable peeler ( ) Android (@) The Beatles - + [Explanation] The release of the iPod allowed consumers to carry their entire music library with them in a format that did not rely on fragile and energy-intensive spinning disks. [Explanation] """) expect(data).toEqual("""

A multiple choice problem presents radio buttons for student input. Students can only select a single option presented. Multiple Choice questions have been the subject of many areas of research due to the early invention and adoption of bubble sheets.

- +

One of the main elements that goes into a good multiple choice question is the existence of good distractors. That is, each of the alternate responses presented to the student should be the result of a plausible mistake that a student might make.

- +

What Apple device competed with the portable CD player?

@@ -289,11 +289,11 @@ describe 'MarkdownEditingDescriptor', -> The Beatles - +

Explanation

- +

The release of the iPod allowed consumers to carry their entire music library with them in a format that did not rely on fragile and energy-intensive spinning disks.

@@ -326,7 +326,7 @@ describe 'MarkdownEditingDescriptor', -> c - +

yatta

@@ -335,7 +335,7 @@ describe 'MarkdownEditingDescriptor', -> z - +

testa

@@ -344,13 +344,13 @@ describe 'MarkdownEditingDescriptor', -> iii - +

Explanation

- +

When the student is ready, the explanation appears.

- +
""") @@ -513,25 +513,25 @@ describe 'MarkdownEditingDescriptor', -> - +

Explanation

- +

Test Explanation.

- +
""") it 'handles multiple questions with labels', -> data = MarkdownEditingDescriptor.markdownToXml(""" France is a country in Europe. - + >>What is the capital of France?<< = Paris - + Germany is a country in Europe, too. - + >>What is the capital of Germany?<< ( ) Bonn ( ) Hamburg @@ -540,14 +540,14 @@ describe 'MarkdownEditingDescriptor', -> """) expect(data).toEqual("""

France is a country in Europe.

- +

What is the capital of France?

- +

Germany is a country in Europe, too.

- +

What is the capital of Germany?

@@ -557,8 +557,8 @@ describe 'MarkdownEditingDescriptor', -> Donut - - + +
""") it 'tests multiple questions with only one label', -> data = MarkdownEditingDescriptor.markdownToXml(""" @@ -577,14 +577,14 @@ describe 'MarkdownEditingDescriptor', -> """) expect(data).toEqual("""

France is a country in Europe.

- +

What is the capital of France?

- +

Germany is a country in Europe, too.

- +

What is the capital of Germany?

@@ -594,8 +594,8 @@ describe 'MarkdownEditingDescriptor', -> Donut - - + +
""") it 'tests malformed labels', -> data = MarkdownEditingDescriptor.markdownToXml(""" @@ -612,12 +612,12 @@ describe 'MarkdownEditingDescriptor', -> """) expect(data).toEqual("""

France is a country in Europe.

- +

>>What is the capital of France?<

- +

blahWhat is the capital of Germany?

@@ -627,8 +627,8 @@ describe 'MarkdownEditingDescriptor', -> Donut - - + +
""") it 'adds labels to formulae', -> data = MarkdownEditingDescriptor.markdownToXml(""" @@ -641,8 +641,8 @@ describe 'MarkdownEditingDescriptor', -> - - + + """) it 'escapes entities in labels', -> data = MarkdownEditingDescriptor.markdownToXml(""" @@ -654,8 +654,8 @@ describe 'MarkdownEditingDescriptor', -> - - + + """) # test oddities it 'converts headers and oddities to xml', -> @@ -710,7 +710,7 @@ describe 'MarkdownEditingDescriptor', -> """) expect(data).toEqual("""

Not a header

-

A header

+

A header

Multiple choice w/ parentheticals

diff --git a/common/lib/xmodule/xmodule/js/src/problem/edit.coffee b/common/lib/xmodule/xmodule/js/src/problem/edit.coffee index 0419e096dc..2e791633a4 100644 --- a/common/lib/xmodule/xmodule/js/src/problem/edit.coffee +++ b/common/lib/xmodule/xmodule/js/src/problem/edit.coffee @@ -23,7 +23,7 @@ class @MarkdownEditingDescriptor extends XModule.Descriptor @setCurrentEditor(@markdown_editor) # Add listeners for toolbar buttons (only present for markdown editor) @element.on('click', '.xml-tab', @onShowXMLButton) - @element.on('click', '.format-buttons a', @onToolbarButton) + @element.on('click', '.format-buttons button', @onToolbarButton) @element.on('click', '.cheatsheet-toggle', @toggleCheatsheet) # Hide the XML text area $(@element.find('.xml-box')).hide() @@ -131,7 +131,7 @@ class @MarkdownEditingDescriptor extends XModule.Descriptor ### save: -> @element.off('click', '.xml-tab', @changeEditor) - @element.off('click', '.format-buttons a', @onToolbarButton) + @element.off('click', '.format-buttons button', @onToolbarButton) @element.off('click', '.cheatsheet-toggle', @toggleCheatsheet) if @current_editor == @markdown_editor { @@ -202,7 +202,7 @@ class @MarkdownEditingDescriptor extends XModule.Descriptor xml = xml.replace(/\r\n/g, '\n'); // replace headers - xml = xml.replace(/(^.*?$)(?=\n\=\=+$)/gm, '

$1

'); + xml = xml.replace(/(^.*?$)(?=\n\=\=+$)/gm, '

$1

'); xml = xml.replace(/\n^\=\=+$/gm, ''); // Pull out demand hints, || a hint || @@ -264,8 +264,8 @@ class @MarkdownEditingDescriptor extends XModule.Descriptor // ]] // // - //
diff --git a/lms/templates/lti.html b/lms/templates/lti.html index 4e496ee4a3..faf55d6aef 100644 --- a/lms/templates/lti.html +++ b/lms/templates/lti.html @@ -3,10 +3,10 @@ import json from django.utils.translation import ugettext as _ %> -

+

## Translators: "External resource" means that this learning module is hosted on a platform external to the edX LMS ${display_name} (${_('External resource')}) -

+ % if has_score and weight:
@@ -51,9 +51,9 @@ from django.utils.translation import ugettext as _ > % endif % elif not hide_launch: -

+

${_('Please provide launch_url. Click "Edit", and fill in the required fields.')} -

+ % endif % if has_score and comment: diff --git a/lms/templates/problem.html b/lms/templates/problem.html index 94c961bfed..f124e5e0c1 100644 --- a/lms/templates/problem.html +++ b/lms/templates/problem.html @@ -1,9 +1,9 @@ <%! from django.utils.translation import ugettext as _ %> <%namespace name='static' file='static_content.html'/> -

+

${ problem['name'] } -

+
diff --git a/lms/templates/video.html b/lms/templates/video.html index 8df4b34895..c5fb463102 100644 --- a/lms/templates/video.html +++ b/lms/templates/video.html @@ -1,7 +1,7 @@ <%! from django.utils.translation import ugettext as _ %> % if display_name is not UNDEFINED and display_name is not None: -

${display_name}

+

${display_name}

% endif
- +