Commit 4ae40e7b by Chris Rodriguez

Updating icons on problem type editor

parent 81d86eea
...@@ -28,7 +28,7 @@ def see_a_single_step_component(step): ...@@ -28,7 +28,7 @@ def see_a_single_step_component(step):
for step_hash in step.hashes: for step_hash in step.hashes:
component = step_hash['Component'] component = step_hash['Component']
assert_in(component, ['Discussion', 'Video']) 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), assert_true(world.is_css_present(component_css),
"{} couldn't be found".format(component)) "{} couldn't be found".format(component))
...@@ -56,7 +56,7 @@ def see_a_multi_step_component(step, category): ...@@ -56,7 +56,7 @@ def see_a_multi_step_component(step, category):
html_matcher = { html_matcher = {
'Text': '\n \n', 'Text': '\n \n',
'Announcement': '<h3>Announcement Date</h3>', 'Announcement': '<h3>Announcement Date</h3>',
'Zooming Image Tool': '<h2>Zooming Image Tool</h2>', 'Zooming Image Tool': '<h3>Zooming Image Tool</h3>',
'E-text Written in LaTeX': '<h3>Example: E-text page</h3>', 'E-text Written in LaTeX': '<h3>Example: E-text page</h3>',
'Raw HTML': '<p>This template is similar to the Text template. The only difference is', 'Raw HTML': '<p>This template is similar to the Text template. The only difference is',
} }
...@@ -64,19 +64,19 @@ def see_a_multi_step_component(step, category): ...@@ -64,19 +64,19 @@ def see_a_multi_step_component(step, category):
assert_in(html_matcher[step_hash['Component']].strip(), actual_html.strip()) assert_in(html_matcher[step_hash['Component']].strip(), actual_html.strip())
else: else:
actual_text = world.css_text(selector, index=idx) 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$') @step(u'I see a "([^"]*)" Problem component$')
def see_a_problem_component(step, category): def see_a_problem_component(step, category):
component_css = 'div.xmodule_CapaModule' component_css = '.xmodule_CapaModule'
assert_true(world.is_css_present(component_css), assert_true(world.is_css_present(component_css),
'No problem was added to the unit.') '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 # This view presents the given problem component in uppercase. Assert that the text matches
# the component selected (in uppercase) # the component selected
assert_true(world.css_contains_text(problem_css, category.upper())) assert_true(world.css_contains_text(problem_css, category))
@step(u'I add a "([^"]*)" "([^"]*)" component$') @step(u'I add a "([^"]*)" "([^"]*)" component$')
...@@ -88,17 +88,17 @@ def add_component_category(step, component, category): ...@@ -88,17 +88,17 @@ def add_component_category(step, component, category):
@step(u'I delete all components$') @step(u'I delete all components$')
def delete_all_components(step): 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.given('I delete "' + str(count) + '" component')
@step(u'I delete "([^"]*)" component$') @step(u'I delete "([^"]*)" component$')
def delete_components(step, number): def delete_components(step, number):
world.wait_for_xmodule() world.wait_for_xmodule()
delete_btn_css = 'a.delete-button' delete_btn_css = '.delete-button'
prompt_css = 'div#prompt-warning' prompt_css = '#prompt-warning'
btn_css = '{} button.action-primary'.format(prompt_css) btn_css = '{} .action-primary'.format(prompt_css)
saving_mini_css = 'div#page-notification .wrapper-notification-mini' saving_mini_css = '#page-notification .wrapper-notification-mini'
for _ in range(int(number)): for _ in range(int(number)):
world.css_click(delete_btn_css) world.css_click(delete_btn_css)
assert_true( assert_true(
...@@ -124,7 +124,7 @@ def see_no_components(steps): ...@@ -124,7 +124,7 @@ def see_no_components(steps):
@step(u'I delete a component') @step(u'I delete a component')
def delete_one_component(step): def delete_one_component(step):
world.css_click('a.delete-button') world.css_click('.delete-button')
@step(u'I edit and save a component') @step(u'I edit and save a component')
...@@ -141,16 +141,16 @@ def duplicated_component(step, ordinal): ...@@ -141,16 +141,16 @@ def duplicated_component(step, ordinal):
"third": 2, "third": 2,
} }
index = ord_map[ordinal] index = ord_map[ordinal]
duplicate_btn_css = 'a.duplicate-button' duplicate_btn_css = '.duplicate-button'
world.css_click(duplicate_btn_css, int(index)) world.css_click(duplicate_btn_css, int(index))
@step(u'I see a Problem component with display name "([^"]*)" in position "([^"]*)"$') @step(u'I see a Problem component with display name "([^"]*)" in position "([^"]*)"$')
def see_component_in_position(step, display_name, index): def see_component_in_position(step, display_name, index):
component_css = 'div.xmodule_CapaModule' component_css = '.xmodule_CapaModule'
def find_problem(_driver): 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') 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): ...@@ -158,7 +158,7 @@ def see_component_in_position(step, display_name, index):
@step(u'I see the display name is "([^"]*)"') @step(u'I see the display name is "([^"]*)"')
def check_component_display_name(step, display_name): def check_component_display_name(step, display_name):
# The display name for the unit uses the same structure, must differentiate by level-element. # 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) assert_equal(display_name, label)
......
...@@ -125,7 +125,7 @@ def my_display_name_change_is_persisted_on_save(step): ...@@ -125,7 +125,7 @@ def my_display_name_change_is_persisted_on_save(step):
@step('the problem display name is "(.*)"$') @step('the problem display name is "(.*)"$')
def verify_problem_display_name(step, name): 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') @step('I can specify special characters in the display name')
...@@ -332,8 +332,8 @@ def i_edit_blank_problem_for_annotation_response(_step): ...@@ -332,8 +332,8 @@ def i_edit_blank_problem_for_annotation_response(_step):
@step(u'I can see cheatsheet$') @step(u'I can see cheatsheet$')
def verify_cheat_sheet_displaying(_step): def verify_cheat_sheet_displaying(_step):
world.css_click("a.cheatsheet-toggle") world.css_click(".cheatsheet-toggle")
css_selector = 'article.simple-editor-cheatsheet' css_selector = '.simple-editor-cheatsheet'
world.wait_for_visible(css_selector) world.wait_for_visible(css_selector)
......
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="-286 382.3 38.5 29.7" style="enable-background:new -286 382.3 38.5 29.7;" xml:space="preserve">
<g id="Checkbox">
<g>
<rect x="-272.2" y="389.1" width="18.9" height="3.1"/>
<path d="M-272.2,398.6h18.9v-3.1h-18.9V398.6z"/>
<rect x="-272.2" y="401.8" width="18.9" height="3.1"/>
<path d="M-280.9,406.1h5.5v-5.5h-5.5V406.1z M-279.8,401.6h3.4v3.4h-3.4V401.6z"/>
<path d="M-280.9,399.9h5.5c0-0.1,0-5.5,0-5.5h-5.5V399.9z M-279.8,395.4h3.4v3.4h-3.4V395.4z"/>
<polygon points="-278.9,390.1 -280.5,388.6 -282.2,390.3 -280.7,391.9 -278.9,393.7 -277.1,391.9 -273.1,388.1 -275.2,386.2 "/>
</g>
</g>
</svg>
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="-286 382.3 38.5 29.7" style="enable-background:new -286 382.3 38.5 29.7;" xml:space="preserve">
<style type="text/css">
.st0{fill:#010101;}
</style>
<g id="Dropdown">
<path class="st0" d="M-251.5,388.6h-13.3H-282c-1.1,0-2,0.9-2,2v13.1c0,1.1,0.9,2,2,2h17.3h13.3c1.1,0,2-0.9,2-2v-13.1
C-249.5,389.5-250.3,388.6-251.5,388.6z M-258,401.7l-5.9-5.9l2.4-2.4l3.5,3.5l3.5-3.5l2.4,2.4L-258,401.7z M-283,403.7v-13.1
c0-0.6,0.4-1,1-1h15.6c-0.2,0.3-0.3,0.6-0.3,1v13.1c0,0.4,0.1,0.7,0.3,1H-282C-282.8,404.7-283,404.3-283,403.7z"/>
</g>
</svg>
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="-286 382.3 38.5 29.7" style="enable-background:new -286 382.3 38.5 29.7;" xml:space="preserve">
<g id="Explanation">
<g>
<path d="M-268.5,406.5c0,0.1-0.1,0.3-0.1,0.4c0,1.1,0.9,2,2,2s2-0.9,2-2c0-0.1,0-0.3-0.1-0.4H-268.5z"/>
<path d="M-262.4,399.3c0.4-0.6,0.6-1.4,0.7-2.1c0.1-0.4,0.1-0.6,0.1-0.6c0-2.9-2.4-5.3-5.3-5.3s-5.3,2.4-5.3,5.3
c0,0,0,0.2,0.1,0.6c0.1,0.7,0.3,1.5,0.7,2.1c0,0.1,0.1,0.1,0.1,0.2c0.1,0.1,0.1,0.1,0.2,0.2c0.1,0.2,0.3,0.4,0.5,0.6
c0.1,0.1,0.1,0.1,0.2,0.2s0.2,0.2,0.3,0.2c1.4,0.9,1.6,3.9,1.7,4.5h3.5c0-0.7,0.2-3.5,1.6-4.5c0.1-0.1,0.1-0.2,0.2-0.2
c0.1-0.1,0-0.2,0.1-0.3c0.2-0.2,0.2-0.5,0.5-0.7C-262.5,399.5-262.5,399.3-262.4,399.3L-262.4,399.3z"/>
<path d="M-266.9,389.7c0.4,0,0.8-0.4,0.8-0.8v-2.8c0-0.4-0.4-0.8-0.8-0.8s-0.8,0.4-0.8,0.8v2.8
C-267.8,389.3-267.4,389.7-266.9,389.7z"/>
<path d="M-261.1,392l2.1-2.1c0.3-0.3,0.3-0.8,0-1.1s-0.8-0.3-1.1,0l-2.1,2.1c-0.3,0.3-0.3,0.8,0,1.1
C-262.1,392.5-261.5,392.5-261.1,392z"/>
<path d="M-272.5,392c0.3,0.3,0.8,0.3,1.1,0s0.3-0.8,0-1.1l-2.1-2.1c-0.3-0.3-0.8-0.3-1.1,0s-0.3,0.8,0,1.1L-272.5,392z"/>
<path d="M-261.1,400.7c-0.3-0.3-0.8-0.3-1.1,0s-0.3,0.8,0,1.1l2.1,2.1c0.3,0.3,0.8,0.3,1.1,0s0.3-0.8,0-1.1L-261.1,400.7z"/>
<path d="M-272.5,400.7l-2.1,2.1c-0.3,0.3-0.3,0.8,0,1.1s0.8,0.3,1.1,0l2.1-2.1c0.3-0.3,0.3-0.8,0-1.1
C-271.6,400.4-272.2,400.4-272.5,400.7z"/>
<path d="M-256.5,395.6h-2.8c-0.4,0-0.8,0.4-0.8,0.8s0.4,0.8,0.8,0.8h2.8c0.4,0,0.8-0.4,0.8-0.8
C-255.7,395.9-256,395.6-256.5,395.6z"/>
<path d="M-273.4,396.4c0-0.4-0.4-0.8-0.8-0.8h-2.8c-0.4,0-0.8,0.4-0.8,0.8s0.4,0.8,0.8,0.8h2.8
C-273.8,397.2-273.4,396.8-273.4,396.4z"/>
</g>
</g>
</svg>
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="-286 382.3 38.5 29.7" style="enable-background:new -286 382.3 38.5 29.7;" xml:space="preserve">
<style type="text/css">
.st0{stroke:#000000;stroke-width:0.25;stroke-miterlimit:10;}
</style>
<g id="Heading">
<g>
<polygon class="st0" points="-285.2,398.1 -275.2,402.9 -275.2,399.7 -281.3,397.2 -275.2,394.1 -275.2,391 -285.2,396.2 "/>
<polygon class="st0" points="-264.6,395.2 -269,395.2 -269,389.6 -272.9,389.6 -272.9,404.7 -269,404.7 -269,398.5 -264.6,398.5
-264.6,404.7 -260.7,404.7 -260.7,389.6 -264.6,389.6 "/>
<polygon class="st0" points="-258.3,391.1 -258.3,394.3 -252.2,397.3 -258.3,399.9 -258.3,403 -248.3,398.3 -248.3,396.4 "/>
</g>
</g>
</svg>
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="-286 382.3 38.5 29.7" style="enable-background:new -286 382.3 38.5 29.7;" xml:space="preserve">
<g id="Numerical">
<path d="M-276.2,404.8h-4.1v-7.9c0-0.9,0-1.8,0.1-2.7c-0.3,0.3-0.6,0.6-1,0.9l-1.7,1.4l-2.1-2.6l5.2-4.2h3.6V404.8z"/>
<path d="M-262.6,404.8h-10.9V402l3.6-3.7c1.1-1.1,1.7-1.8,2.1-2.2c0.3-0.4,0.6-0.7,0.7-1c0.1-0.2,0.2-0.6,0.2-0.9
c0-0.4-0.1-0.7-0.4-0.9c-0.3-0.2-0.6-0.3-1.1-0.3s-1,0.2-1.4,0.4c-0.5,0.2-1.1,0.7-1.6,1.2l-2.2-2.6c0.8-0.7,1.4-1.2,1.9-1.5
c0.6-0.3,1.2-0.5,1.7-0.7c0.6-0.2,1.3-0.2,2.1-0.2c1,0,1.8,0.2,2.6,0.5s1.3,0.8,1.8,1.4c0.4,0.7,0.7,1.3,0.7,2.1
c0,0.6-0.1,1.1-0.2,1.6c-0.2,0.5-0.4,1-0.7,1.5s-0.8,1-1.2,1.5c-0.5,0.5-1.6,1.5-3.3,3v0.1h5.8v3.5H-262.6L-262.6,404.8z"/>
<path d="M-250,393c0,0.9-0.3,1.7-0.9,2.4c-0.6,0.7-1.4,1.2-2.5,1.4v0.1c2.5,0.3,3.7,1.5,3.7,3.5c0,1.4-0.6,2.5-1.6,3.2
c-1.2,0.8-2.7,1.2-4.6,1.2c-0.8,0-1.5-0.1-2.3-0.2c-0.7-0.1-1.4-0.3-2.2-0.7v-3.3c0.7,0.3,1.3,0.6,2,0.7c0.7,0.2,1.3,0.2,1.9,0.2
c0.9,0,1.5-0.1,1.9-0.3s0.6-0.7,0.6-1.2c0-0.4-0.1-0.7-0.3-0.9s-0.6-0.4-1.1-0.5s-1.1-0.2-1.8-0.2h-1v-3h1c2.1,0,3.1-0.5,3.1-1.6
c0-0.4-0.2-0.7-0.5-0.9s-0.7-0.2-1.2-0.2c-1,0-1.9,0.3-3,0.9l-1.7-2.7c0.8-0.6,1.6-0.9,2.5-1.2s1.8-0.3,2.9-0.3
c1.5,0,2.8,0.3,3.6,0.9C-250.4,391.1-250,392-250,393z"/>
</g>
</svg>
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="-286 382.3 38.5 29.7" style="enable-background:new -286 382.3 38.5 29.7;" xml:space="preserve">
<g id="Radios">
<g>
<path d="M-277.9,393.4c1.4,0,2.7-1.3,2.7-2.7s-1.1-2.7-2.7-2.7s-2.7,1.3-2.7,2.7C-280.6,392.3-279.3,393.4-277.9,393.4z
M-277.9,388.9c1,0,1.8,0.8,1.8,1.8s-0.8,1.8-1.8,1.8s-1.8-0.8-1.8-1.8C-279.7,389.9-278.9,388.9-277.9,388.9z"/>
<circle cx="-277.9" cy="397.3" r="2.7"/>
<circle cx="-277.9" cy="403.6" r="2.7"/>
<rect x="-271.9" y="389.3" width="19" height="3.1"/>
<path d="M-271.9,398.9h19v-3.1h-19C-271.9,395.8-271.9,398.8-271.9,398.9z"/>
<rect x="-271.9" y="401.9" width="19" height="3.1"/>
</g>
</g>
</svg>
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="-286 382.3 38.5 29.7" style="enable-background:new -286 382.3 38.5 29.7;" xml:space="preserve">
<g id="Text">
<g>
<g>
<path d="M-275.6,404l-0.7-2.6h-4.3l-0.7,2.6h-3.9l4.3-14.2h4.7l4.4,14.2H-275.6z M-277,398.2l-0.6-2.4c-0.1-0.6-0.3-1.2-0.5-2
s-0.3-1.4-0.4-1.8c-0.1,0.4-0.2,0.8-0.3,1.7c-0.2,0.8-0.5,2.3-1,4.4L-277,398.2L-277,398.2z"/>
<path d="M-270.4,389.9h4.6c1.8,0,3.1,0.3,4,0.8c0.9,0.6,1.3,1.5,1.3,2.6c0,0.8-0.2,1.5-0.6,2c-0.4,0.6-0.9,0.9-1.5,1v0.1
c0.9,0.3,1.4,0.6,1.8,1.1c0.4,0.6,0.6,1.2,0.6,2.1c0,1.3-0.5,2.3-1.3,3.1c-0.9,0.7-2.1,1.1-3.6,1.1h-5.1L-270.4,389.9
L-270.4,389.9z M-266.9,395.4h1c0.5,0,0.9-0.1,1.1-0.4c0.3-0.3,0.4-0.6,0.4-0.9c0-0.8-0.6-1.2-1.7-1.2h-0.9L-266.9,395.4
L-266.9,395.4z M-266.9,398v3h1.2c1.1,0,1.6-0.6,1.6-1.5c0-0.5-0.2-0.8-0.5-1c-0.3-0.3-0.8-0.4-1.3-0.4L-266.9,398L-266.9,398z"
/>
<path d="M-252.2,392.9c-0.9,0-1.5,0.4-2,1.1c-0.5,0.8-0.7,1.8-0.7,3.1c0,2.7,0.9,4.2,2.8,4.2c0.6,0,1.1-0.1,1.7-0.3
c0.6-0.2,1-0.4,1.6-0.6v3.2c-1.1,0.6-2.4,0.8-3.7,0.8c-2,0-3.5-0.6-4.6-1.9c-1-1.2-1.6-3.1-1.6-5.4c0-1.5,0.3-2.7,0.8-3.9
c0.5-1.1,1.2-1.9,2.2-2.6c0.9-0.6,2.1-0.8,3.4-0.8c1.4,0,2.8,0.4,4.1,0.9l-1,3c-0.5-0.3-0.9-0.5-1.4-0.6
S-251.6,392.9-252.2,392.9z"/>
</g>
</g>
</g>
</svg>
...@@ -13,24 +13,59 @@ ...@@ -13,24 +13,59 @@
%if enable_markdown: %if enable_markdown:
<div class="editor-bar"> <div class="editor-bar">
<ul class="format-buttons"> <ul class="format-buttons">
<li><a href="#" class="header-button" data-tooltip="${_("Heading 1")}"><span <li>
class="problem-editor-icon heading1"></span></a></li> <button type="button" class="header-button" data-tooltip="${_("Heading")}">
<li><a href="#" class="multiple-choice-button" data-tooltip="${_("Multiple Choice")}"><span <span class="problem-editor-icon heading3">
class="problem-editor-icon multiple-choice"></span></a></li> <img class="icon" src="${static.url('images/cms-editor_heading.png')}" alt="${_("Insert a heading")}">
<li><a href="#" class="checks-button" data-tooltip="${_("Checkboxes")}"><span </span>
class="problem-editor-icon checks"></span></a></li> </button>
<li><a href="#" class="string-button" data-tooltip="${_("Text Input")}"><span </li>
class="problem-editor-icon string"></span></a></li> <li>
<li><a href="#" class="number-button" data-tooltip="${_("Numerical Input")}"><span <button type="button" class="multiple-choice-button" data-tooltip="${_("Multiple Choice")}">
class="problem-editor-icon number"></span></a></li> <span class="problem-editor-icon multiple-choice">
<li><a href="#" class="dropdown-button" data-tooltip="${_("Dropdown")}"><span <img class="icon" src="${static.url('images/cms-editor_radio.png')}" alt="${_("Add a multiple choice question")}">
class="problem-editor-icon dropdown"></span></a></li> </span>
<li><a href="#" class="explanation-button" data-tooltip="${_("Explanation")}"><span </button>
class="problem-editor-icon explanation"></span></a></li> </li>
<li>
<button type="button" class="checks-button" data-tooltip="${_("Checkboxes")}">
<span class="problem-editor-icon checks">
<img class="icon" src="${static.url('images/cms-editor_checkbox.png')}" alt="${_("Add a question with checkboxes")}">
</span>
</button>
</li>
<li>
<button type="button" class="string-button" data-tooltip="${_("Text Input")}">
<span class="problem-editor-icon string">
<img class="icon" src="${static.url('images/cms-editor_text.png')}" alt="${_("Insert a text response")}">
</span>
</button>
</li>
<li>
<button type="button" class="number-button" data-tooltip="${_("Numerical Input")}">
<span class="problem-editor-icon number">
<img class="icon" src="${static.url('images/cms-editor_number.png')}" alt="${_("Insert a numerical response")}">
</span>
</button>
</li>
<li>
<button type="button" class="dropdown-button" data-tooltip="${_("Dropdown")}">
<span class="problem-editor-icon dropdown">
<img class="icon" src="${static.url('images/cms-editor_dropdown.png')}" alt="${_("Insert a dropdown response")}">
</span>
</button>
</li>
<li>
<button type="button" class="explanation-button" data-tooltip="${_("Explanation")}">
<span class="problem-editor-icon explanation">
<img class="icon" src="${static.url('images/cms-editor_explanation.png')}" alt="${_("Add an explanation for this question")}">
</span>
</button>
</li>
</ul> </ul>
<ul class="editor-tabs"> <ul class="editor-tabs">
<li><a href="#" class="xml-tab advanced-toggle" data-tab="xml">${_("Advanced Editor")}</a></li> <li><button type="button" class="xml-tab advanced-toggle" data-tab="xml">${_("Advanced Editor")}</button></li>
<li><a href="#" class="cheatsheet-toggle" data-tooltip="${_("Toggle Cheatsheet")}">?</a></li> <li><button type="button" class="cheatsheet-toggle" data-tooltip="${_("Toggle Cheatsheet")}">?</button></li>
</ul> </ul>
</div> </div>
<textarea class="markdown-box">${markdown | h}</textarea> <textarea class="markdown-box">${markdown | h}</textarea>
...@@ -43,12 +78,12 @@ ...@@ -43,12 +78,12 @@
<article class="simple-editor-cheatsheet"> <article class="simple-editor-cheatsheet">
<div class="cheatsheet-wrapper"> <div class="cheatsheet-wrapper">
<div class="row"> <div class="row">
<h6>${_("Heading 1")}</h6> <h6>${_("Heading")}</h6>
<div class="col sample heading-1"> <div class="col sample heading-1">
<img src="${static.url("images/header-example.png")}" /> <img class="icon" src="${static.url('images/cms-editor_heading.png')}" alt="${_("Insert a heading")}">
</div> </div>
<div class="col"> <div class="col">
<pre><code>H1 <pre><code>H3
===== =====
</pre> </pre>
</div> </div>
...@@ -56,7 +91,7 @@ ...@@ -56,7 +91,7 @@
<div class="row"> <div class="row">
<h6>${_("Multiple Choice")}</h6> <h6>${_("Multiple Choice")}</h6>
<div class="col sample multiple-choice"> <div class="col sample multiple-choice">
<img src="${static.url("images/choice-example.png")}" /> <img class="icon" src="${static.url('images/cms-editor_radio.png')}" alt="${_("Add a multiple choice question")}">
</div> </div>
<div class="col"> <div class="col">
<pre><code>( ) red <pre><code>( ) red
...@@ -67,7 +102,7 @@ ...@@ -67,7 +102,7 @@
<div class="row"> <div class="row">
<h6>${_("Checkboxes")}</h6> <h6>${_("Checkboxes")}</h6>
<div class="col sample check-multiple"> <div class="col sample check-multiple">
<img src="${static.url("images/multi-example.png")}" /> <img class="icon" src="${static.url('images/cms-editor_checkbox.png')}" alt="${_("Add a question with checkboxes")}">
</div> </div>
<div class="col"> <div class="col">
<pre><code>[x] earth <pre><code>[x] earth
...@@ -78,7 +113,7 @@ ...@@ -78,7 +113,7 @@
<div class="row"> <div class="row">
<h6>${_("Text Input")}</h6> <h6>${_("Text Input")}</h6>
<div class="col sample string-response"> <div class="col sample string-response">
<img src="${static.url("images/string-example.png")}" /> <img class="icon" src="${static.url('images/cms-editor_text.png')}" alt="${_("Insert a text response")}">
</div> </div>
<div class="col"> <div class="col">
<pre><code>= dog <pre><code>= dog
...@@ -89,7 +124,7 @@ or= mouse</code></pre> ...@@ -89,7 +124,7 @@ or= mouse</code></pre>
<div class="row"> <div class="row">
<h6>${_("Numerical Input")}</h6> <h6>${_("Numerical Input")}</h6>
<div class="col sample numerical-response"> <div class="col sample numerical-response">
<img src="${static.url("images/number-example.png")}" /> <img class="icon" src="${static.url('images/cms-editor_number.png')}" alt="${_("Insert a numerical response")}">
</div> </div>
<div class="col"> <div class="col">
<pre><code>= 3.14 +- 2%</code></pre> <pre><code>= 3.14 +- 2%</code></pre>
...@@ -99,7 +134,7 @@ or= mouse</code></pre> ...@@ -99,7 +134,7 @@ or= mouse</code></pre>
<div class="row"> <div class="row">
<h6>${_("Dropdown")}</h6> <h6>${_("Dropdown")}</h6>
<div class="col sample option-reponse"> <div class="col sample option-reponse">
<img src="${static.url("images/select-example.png")}" /> <img class="icon" src="${static.url('images/cms-editor_dropdown.png')}" alt="${_("Insert a dropdown response")}">
</div> </div>
<div class="col"> <div class="col">
<pre><code>[[wrong, (right)]]</code></pre> <pre><code>[[wrong, (right)]]</code></pre>
...@@ -114,7 +149,7 @@ or= mouse</code></pre> ...@@ -114,7 +149,7 @@ or= mouse</code></pre>
<div class="row"> <div class="row">
<h6>${_("Explanation")}</h6> <h6>${_("Explanation")}</h6>
<div class="col sample explanation"> <div class="col sample explanation">
<img src="${static.url("images/explanation-example.png")}" /> <img class="icon" src="${static.url('images/cms-editor_explanation.png')}" alt="${_("Add an explanation for this question")}">
</div> </div>
<div class="col"> <div class="col">
<pre><code>[explanation] A short explanation of the answer. [explanation]</code></pre> <pre><code>[explanation] A short explanation of the answer. [explanation]</code></pre>
......
...@@ -13,14 +13,21 @@ ...@@ -13,14 +13,21 @@
padding: ($baseline/4); padding: ($baseline/4);
border-bottom-color: #a5aaaf; border-bottom-color: #a5aaaf;
a { button {
display: block; display: inline-block;
@include float(left); @include float(left);
padding: 3px ($baseline/2) 7px; padding: 3px ($baseline/2) 5px;
margin-left: 7px; margin-left: 7px;
border: 0;
border-radius: 2px; border-radius: 2px;
background: transparent;
.icon {
height: 21px;
}
&:hover, &:focus { &:hover,
&:focus {
background: rgba(255, 255, 255, .5); background: rgba(255, 255, 255, .5);
} }
} }
...@@ -60,4 +67,4 @@ ...@@ -60,4 +67,4 @@
} }
} }
} }
} }
\ No newline at end of file
...@@ -7,6 +7,7 @@ ...@@ -7,6 +7,7 @@
margin-top: -4px; margin-top: -4px;
padding: 3px 9px; padding: 3px 9px;
font-size: 12px; font-size: 12px;
color: $link-color;
&.current { &.current {
border: 1px solid $lightGrey !important; border: 1px solid $lightGrey !important;
...@@ -16,7 +17,8 @@ ...@@ -16,7 +17,8 @@
pointer-events: none; pointer-events: none;
cursor: none; cursor: none;
&:hover, &:focus { &:hover,
&:focus {
box-shadow: 0 0 0 0 !important; box-shadow: 0 0 0 0 !important;
background-color: $white; background-color: $white;
} }
...@@ -79,11 +81,15 @@ ...@@ -79,11 +81,15 @@
} }
.col { .col {
float: left; display: block;
&.sample { &.sample {
width: 60px; width: 60px;
margin-right: 30px; margin-right: 30px;
.icon {
height: ($baseline * 1.5);
}
} }
} }
...@@ -110,40 +116,5 @@ ...@@ -110,40 +116,5 @@
width: 26px; width: 26px;
height: 21px; height: 21px;
vertical-align: middle; 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;
}
...@@ -10,7 +10,7 @@ ...@@ -10,7 +10,7 @@
<h3 class="problem-header"> <h3 class="problem-header">
Numerical Input Numerical Input
</h3> </h3>
<section class="problem-progress">(1/1 point)</section> <section class="problem-progress">(1/1 point)</section>
......
...@@ -258,9 +258,9 @@ describe 'MarkdownEditingDescriptor', -> ...@@ -258,9 +258,9 @@ describe 'MarkdownEditingDescriptor', ->
</problem>""") </problem>""")
it 'converts multiple choice shuffle to xml', -> 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. 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. 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? What Apple device competed with the portable CD player?
(!x@) The iPad (!x@) The iPad
(@) Napster (@) Napster
...@@ -268,16 +268,16 @@ describe 'MarkdownEditingDescriptor', -> ...@@ -268,16 +268,16 @@ describe 'MarkdownEditingDescriptor', ->
( ) The vegetable peeler ( ) The vegetable peeler
( ) Android ( ) Android
(@) The Beatles (@) The Beatles
[Explanation] [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. 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] [Explanation]
""") """)
expect(data).toEqual("""<problem> expect(data).toEqual("""<problem>
<p>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.</p> <p>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.</p>
<p>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.</p> <p>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.</p>
<p>What Apple device competed with the portable CD player?</p> <p>What Apple device competed with the portable CD player?</p>
<multiplechoiceresponse> <multiplechoiceresponse>
<choicegroup type="MultipleChoice" shuffle="true"> <choicegroup type="MultipleChoice" shuffle="true">
...@@ -289,11 +289,11 @@ describe 'MarkdownEditingDescriptor', -> ...@@ -289,11 +289,11 @@ describe 'MarkdownEditingDescriptor', ->
<choice correct="false" fixed="true">The Beatles</choice> <choice correct="false" fixed="true">The Beatles</choice>
</choicegroup> </choicegroup>
</multiplechoiceresponse> </multiplechoiceresponse>
<solution> <solution>
<div class="detailed-solution"> <div class="detailed-solution">
<p>Explanation</p> <p>Explanation</p>
<p>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.</p> <p>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.</p>
</div> </div>
...@@ -326,7 +326,7 @@ describe 'MarkdownEditingDescriptor', -> ...@@ -326,7 +326,7 @@ describe 'MarkdownEditingDescriptor', ->
<choice correct="false">c</choice> <choice correct="false">c</choice>
</choicegroup> </choicegroup>
</multiplechoiceresponse> </multiplechoiceresponse>
<p>yatta</p> <p>yatta</p>
<multiplechoiceresponse> <multiplechoiceresponse>
<choicegroup type="MultipleChoice"> <choicegroup type="MultipleChoice">
...@@ -335,7 +335,7 @@ describe 'MarkdownEditingDescriptor', -> ...@@ -335,7 +335,7 @@ describe 'MarkdownEditingDescriptor', ->
<choice correct="true">z</choice> <choice correct="true">z</choice>
</choicegroup> </choicegroup>
</multiplechoiceresponse> </multiplechoiceresponse>
<p>testa</p> <p>testa</p>
<multiplechoiceresponse> <multiplechoiceresponse>
<choicegroup type="MultipleChoice" shuffle="true"> <choicegroup type="MultipleChoice" shuffle="true">
...@@ -344,13 +344,13 @@ describe 'MarkdownEditingDescriptor', -> ...@@ -344,13 +344,13 @@ describe 'MarkdownEditingDescriptor', ->
<choice correct="true">iii</choice> <choice correct="true">iii</choice>
</choicegroup> </choicegroup>
</multiplechoiceresponse> </multiplechoiceresponse>
<solution> <solution>
<div class="detailed-solution"> <div class="detailed-solution">
<p>Explanation</p> <p>Explanation</p>
<p>When the student is ready, the explanation appears.</p> <p>When the student is ready, the explanation appears.</p>
</div> </div>
</solution> </solution>
</problem>""") </problem>""")
...@@ -513,25 +513,25 @@ describe 'MarkdownEditingDescriptor', -> ...@@ -513,25 +513,25 @@ describe 'MarkdownEditingDescriptor', ->
<stringresponse answer="w*.?s*Luther Kings*.*" type="ci regexp" > <stringresponse answer="w*.?s*Luther Kings*.*" type="ci regexp" >
<textline label="Who lead the civil right movement in the United States of America?" size="20"/> <textline label="Who lead the civil right movement in the United States of America?" size="20"/>
</stringresponse> </stringresponse>
<solution> <solution>
<div class="detailed-solution"> <div class="detailed-solution">
<p>Explanation</p> <p>Explanation</p>
<p>Test Explanation.</p> <p>Test Explanation.</p>
</div> </div>
</solution> </solution>
</problem>""") </problem>""")
it 'handles multiple questions with labels', -> it 'handles multiple questions with labels', ->
data = MarkdownEditingDescriptor.markdownToXml(""" data = MarkdownEditingDescriptor.markdownToXml("""
France is a country in Europe. France is a country in Europe.
>>What is the capital of France?<< >>What is the capital of France?<<
= Paris = Paris
Germany is a country in Europe, too. Germany is a country in Europe, too.
>>What is the capital of Germany?<< >>What is the capital of Germany?<<
( ) Bonn ( ) Bonn
( ) Hamburg ( ) Hamburg
...@@ -540,14 +540,14 @@ describe 'MarkdownEditingDescriptor', -> ...@@ -540,14 +540,14 @@ describe 'MarkdownEditingDescriptor', ->
""") """)
expect(data).toEqual("""<problem> expect(data).toEqual("""<problem>
<p>France is a country in Europe.</p> <p>France is a country in Europe.</p>
<p>What is the capital of France?</p> <p>What is the capital of France?</p>
<stringresponse answer="Paris" type="ci" > <stringresponse answer="Paris" type="ci" >
<textline label="What is the capital of France?" size="20"/> <textline label="What is the capital of France?" size="20"/>
</stringresponse> </stringresponse>
<p>Germany is a country in Europe, too.</p> <p>Germany is a country in Europe, too.</p>
<p>What is the capital of Germany?</p> <p>What is the capital of Germany?</p>
<multiplechoiceresponse> <multiplechoiceresponse>
<choicegroup label="What is the capital of Germany?" type="MultipleChoice"> <choicegroup label="What is the capital of Germany?" type="MultipleChoice">
...@@ -557,8 +557,8 @@ describe 'MarkdownEditingDescriptor', -> ...@@ -557,8 +557,8 @@ describe 'MarkdownEditingDescriptor', ->
<choice correct="false">Donut</choice> <choice correct="false">Donut</choice>
</choicegroup> </choicegroup>
</multiplechoiceresponse> </multiplechoiceresponse>
</problem>""") </problem>""")
it 'tests multiple questions with only one label', -> it 'tests multiple questions with only one label', ->
data = MarkdownEditingDescriptor.markdownToXml(""" data = MarkdownEditingDescriptor.markdownToXml("""
...@@ -577,14 +577,14 @@ describe 'MarkdownEditingDescriptor', -> ...@@ -577,14 +577,14 @@ describe 'MarkdownEditingDescriptor', ->
""") """)
expect(data).toEqual("""<problem> expect(data).toEqual("""<problem>
<p>France is a country in Europe.</p> <p>France is a country in Europe.</p>
<p>What is the capital of France?</p> <p>What is the capital of France?</p>
<stringresponse answer="Paris" type="ci" > <stringresponse answer="Paris" type="ci" >
<textline label="What is the capital of France?" size="20"/> <textline label="What is the capital of France?" size="20"/>
</stringresponse> </stringresponse>
<p>Germany is a country in Europe, too.</p> <p>Germany is a country in Europe, too.</p>
<p>What is the capital of Germany?</p> <p>What is the capital of Germany?</p>
<multiplechoiceresponse> <multiplechoiceresponse>
<choicegroup type="MultipleChoice"> <choicegroup type="MultipleChoice">
...@@ -594,8 +594,8 @@ describe 'MarkdownEditingDescriptor', -> ...@@ -594,8 +594,8 @@ describe 'MarkdownEditingDescriptor', ->
<choice correct="false">Donut</choice> <choice correct="false">Donut</choice>
</choicegroup> </choicegroup>
</multiplechoiceresponse> </multiplechoiceresponse>
</problem>""") </problem>""")
it 'tests malformed labels', -> it 'tests malformed labels', ->
data = MarkdownEditingDescriptor.markdownToXml(""" data = MarkdownEditingDescriptor.markdownToXml("""
...@@ -612,12 +612,12 @@ describe 'MarkdownEditingDescriptor', -> ...@@ -612,12 +612,12 @@ describe 'MarkdownEditingDescriptor', ->
""") """)
expect(data).toEqual("""<problem> expect(data).toEqual("""<problem>
<p>France is a country in Europe.</p> <p>France is a country in Europe.</p>
<p>>>What is the capital of France?<</p> <p>>>What is the capital of France?<</p>
<stringresponse answer="Paris" type="ci" > <stringresponse answer="Paris" type="ci" >
<textline size="20"/> <textline size="20"/>
</stringresponse> </stringresponse>
<p>blahWhat is the capital of Germany?</p> <p>blahWhat is the capital of Germany?</p>
<multiplechoiceresponse> <multiplechoiceresponse>
<choicegroup label="What is the capital of &lt;&lt;Germany?" type="MultipleChoice"> <choicegroup label="What is the capital of &lt;&lt;Germany?" type="MultipleChoice">
...@@ -627,8 +627,8 @@ describe 'MarkdownEditingDescriptor', -> ...@@ -627,8 +627,8 @@ describe 'MarkdownEditingDescriptor', ->
<choice correct="false">Donut</choice> <choice correct="false">Donut</choice>
</choicegroup> </choicegroup>
</multiplechoiceresponse> </multiplechoiceresponse>
</problem>""") </problem>""")
it 'adds labels to formulae', -> it 'adds labels to formulae', ->
data = MarkdownEditingDescriptor.markdownToXml(""" data = MarkdownEditingDescriptor.markdownToXml("""
...@@ -641,8 +641,8 @@ describe 'MarkdownEditingDescriptor', -> ...@@ -641,8 +641,8 @@ describe 'MarkdownEditingDescriptor', ->
<responseparam type="tolerance" default=".02" /> <responseparam type="tolerance" default=".02" />
<formulaequationinput label="Enter the numerical value of Pi:" /> <formulaequationinput label="Enter the numerical value of Pi:" />
</numericalresponse> </numericalresponse>
</problem>""") </problem>""")
it 'escapes entities in labels', -> it 'escapes entities in labels', ->
data = MarkdownEditingDescriptor.markdownToXml(""" data = MarkdownEditingDescriptor.markdownToXml("""
...@@ -654,8 +654,8 @@ describe 'MarkdownEditingDescriptor', -> ...@@ -654,8 +654,8 @@ describe 'MarkdownEditingDescriptor', ->
<stringresponse answer="Paris" type="ci" > <stringresponse answer="Paris" type="ci" >
<textline label="What is the &quot;capital&quot; of France &amp; the &apos;best&apos; &gt; place &lt; to live&quot;?" size="20"/> <textline label="What is the &quot;capital&quot; of France &amp; the &apos;best&apos; &gt; place &lt; to live&quot;?" size="20"/>
</stringresponse> </stringresponse>
</problem>""") </problem>""")
# test oddities # test oddities
it 'converts headers and oddities to xml', -> it 'converts headers and oddities to xml', ->
...@@ -710,7 +710,7 @@ describe 'MarkdownEditingDescriptor', -> ...@@ -710,7 +710,7 @@ describe 'MarkdownEditingDescriptor', ->
""") """)
expect(data).toEqual("""<problem> expect(data).toEqual("""<problem>
<p>Not a header</p> <p>Not a header</p>
<h1>A header</h1> <h3 class="problem-header">A header</h3>
<p>Multiple choice w/ parentheticals</p> <p>Multiple choice w/ parentheticals</p>
<multiplechoiceresponse> <multiplechoiceresponse>
......
...@@ -23,7 +23,7 @@ class @MarkdownEditingDescriptor extends XModule.Descriptor ...@@ -23,7 +23,7 @@ class @MarkdownEditingDescriptor extends XModule.Descriptor
@setCurrentEditor(@markdown_editor) @setCurrentEditor(@markdown_editor)
# Add listeners for toolbar buttons (only present for markdown editor) # Add listeners for toolbar buttons (only present for markdown editor)
@element.on('click', '.xml-tab', @onShowXMLButton) @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) @element.on('click', '.cheatsheet-toggle', @toggleCheatsheet)
# Hide the XML text area # Hide the XML text area
$(@element.find('.xml-box')).hide() $(@element.find('.xml-box')).hide()
...@@ -131,7 +131,7 @@ class @MarkdownEditingDescriptor extends XModule.Descriptor ...@@ -131,7 +131,7 @@ class @MarkdownEditingDescriptor extends XModule.Descriptor
### ###
save: -> save: ->
@element.off('click', '.xml-tab', @changeEditor) @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) @element.off('click', '.cheatsheet-toggle', @toggleCheatsheet)
if @current_editor == @markdown_editor if @current_editor == @markdown_editor
{ {
...@@ -202,7 +202,7 @@ class @MarkdownEditingDescriptor extends XModule.Descriptor ...@@ -202,7 +202,7 @@ class @MarkdownEditingDescriptor extends XModule.Descriptor
xml = xml.replace(/\r\n/g, '\n'); xml = xml.replace(/\r\n/g, '\n');
// replace headers // replace headers
xml = xml.replace(/(^.*?$)(?=\n\=\=+$)/gm, '<h1>$1</h1>'); xml = xml.replace(/(^.*?$)(?=\n\=\=+$)/gm, '<h3 class="problem-header">$1</h3>');
xml = xml.replace(/\n^\=\=+$/gm, ''); xml = xml.replace(/\n^\=\=+$/gm, '');
// Pull out demand hints, || a hint || // Pull out demand hints, || a hint ||
......
...@@ -293,9 +293,9 @@ function (VideoPlayer, i18n, moment) { ...@@ -293,9 +293,9 @@ function (VideoPlayer, i18n, moment) {
_hideWaitPlaceholder(state); _hideWaitPlaceholder(state);
state.el state.el
.find('.video-player div') .find('.video-player div')
.addClass('hidden') .addClass('hidden');
.end() state.el
.find('.video-player h3') .find('.video-player .video-error')
.removeClass('hidden'); .removeClass('hidden');
return false; return false;
...@@ -497,7 +497,7 @@ function (VideoPlayer, i18n, moment) { ...@@ -497,7 +497,7 @@ function (VideoPlayer, i18n, moment) {
this.el.find('.video-player div') this.el.find('.video-player div')
.removeClass('hidden'); .removeClass('hidden');
this.el.find('.video-player h3') this.el.find('.video-player .video-error')
.addClass('hidden'); .addClass('hidden');
// If in reality the timeout was to short, try to // If in reality the timeout was to short, try to
...@@ -510,7 +510,7 @@ function (VideoPlayer, i18n, moment) { ...@@ -510,7 +510,7 @@ function (VideoPlayer, i18n, moment) {
// In-browser HTML5 player does not support quality // In-browser HTML5 player does not support quality
// control. // control.
this.el.find('a.quality_control').hide(); this.el.find('.quality_control').hide();
_renderElements(this); _renderElements(this);
} }
} }
......
...@@ -99,7 +99,7 @@ function () { ...@@ -99,7 +99,7 @@ function () {
.find('.video-player div') .find('.video-player div')
.addClass('hidden') .addClass('hidden')
.end() .end()
.find('.video-player h3') .find('.video-player .video-error')
.removeClass('hidden') .removeClass('hidden')
.end() .end()
.addClass('is-initialized') .addClass('is-initialized')
...@@ -125,7 +125,7 @@ function () { ...@@ -125,7 +125,7 @@ function () {
this.el this.el
.find('.video-player div').removeClass('hidden') .find('.video-player div').removeClass('hidden')
.end() .end()
.find('.video-player h3').addClass('hidden') .find('.video-player .video-error').addClass('hidden')
.end().removeClass('is-initialized') .end().removeClass('is-initialized')
.find('.spinner').attr({'aria-hidden': 'false'}); .find('.spinner').attr({'aria-hidden': 'false'});
this.videoEl.remove(); this.videoEl.remove();
......
...@@ -14,7 +14,7 @@ import logging ...@@ -14,7 +14,7 @@ import logging
log = logging.getLogger('VideoPage') log = logging.getLogger('VideoPage')
VIDEO_BUTTONS = { VIDEO_BUTTONS = {
'transcript': '.lang', 'transcript': '.language-menu',
'transcript_button': '.toggle-transcript', 'transcript_button': '.toggle-transcript',
'cc_button': '.toggle-captions', 'cc_button': '.toggle-captions',
'volume': '.volume', 'volume': '.volume',
...@@ -35,14 +35,14 @@ CSS_CLASS_NAMES = { ...@@ -35,14 +35,14 @@ CSS_CLASS_NAMES = {
'captions_text': '.subtitles li', 'captions_text': '.subtitles li',
'captions_text_getter': '.subtitles li[role="link"][data-index="1"]', 'captions_text_getter': '.subtitles li[role="link"][data-index="1"]',
'closed_captions': '.closed-captions', 'closed_captions': '.closed-captions',
'error_message': '.video .video-player h3', 'error_message': '.video .video-player .video-error',
'video_container': '.video', 'video_container': '.video',
'video_sources': '.video-player video source', 'video_sources': '.video-player video source',
'video_spinner': '.video-wrapper .spinner', 'video_spinner': '.video-wrapper .spinner',
'video_xmodule': '.xmodule_VideoModule', 'video_xmodule': '.xmodule_VideoModule',
'video_init': '.is-initialized', 'video_init': '.is-initialized',
'video_time': '.vidtime', 'video_time': '.vidtime',
'video_display_name': '.vert h2', 'video_display_name': '.vert h3',
'captions_lang_list': '.langs-list li', 'captions_lang_list': '.langs-list li',
'video_speed': '.speeds .value', 'video_speed': '.speeds .value',
'poster': '.poster', 'poster': '.poster',
...@@ -631,7 +631,6 @@ class VideoPage(PageObject): ...@@ -631,7 +631,6 @@ class VideoPage(PageObject):
language_selector = VIDEO_MENUS["language"] + ' li[data-lang-code="{code}"]'.format(code=code) language_selector = VIDEO_MENUS["language"] + ' li[data-lang-code="{code}"]'.format(code=code)
language_selector = self.get_element_selector(language_selector) language_selector = self.get_element_selector(language_selector)
self.wait_for_element_visibility(language_selector, 'language menu is visible') self.wait_for_element_visibility(language_selector, 'language menu is visible')
self.q(css=language_selector).first.click() self.q(css=language_selector).first.click()
......
...@@ -265,7 +265,7 @@ class StudioLibraryContainerCapaFilterTest(LibraryContentTestBase, TestWithSearc ...@@ -265,7 +265,7 @@ class StudioLibraryContainerCapaFilterTest(LibraryContentTestBase, TestWithSearc
@property @property
def _problem_headers(self): def _problem_headers(self):
""" Expected XBLock headers according to populate_library_fixture """ """ Expected XBLock headers according to populate_library_fixture """
return frozenset(child.display_name.upper() for child in self.library_fixture.children) return frozenset(child.display_name for child in self.library_fixture.children)
def _set_library_content_settings(self, count=1, capa_type="Any Type"): def _set_library_content_settings(self, count=1, capa_type="Any Type"):
""" """
...@@ -304,7 +304,7 @@ class StudioLibraryContainerCapaFilterTest(LibraryContentTestBase, TestWithSearc ...@@ -304,7 +304,7 @@ class StudioLibraryContainerCapaFilterTest(LibraryContentTestBase, TestWithSearc
self.assertEqual(len(children_headers), 1) self.assertEqual(len(children_headers), 1)
self.assertLessEqual( self.assertLessEqual(
children_headers, children_headers,
set([header.upper() for header in ["Problem Choice Group 1", "Problem Choice Group 2"]]) set(["Problem Choice Group 1", "Problem Choice Group 2"])
) )
# Choice group test # Choice group test
...@@ -312,7 +312,7 @@ class StudioLibraryContainerCapaFilterTest(LibraryContentTestBase, TestWithSearc ...@@ -312,7 +312,7 @@ class StudioLibraryContainerCapaFilterTest(LibraryContentTestBase, TestWithSearc
self.assertEqual(len(children_headers), 2) self.assertEqual(len(children_headers), 2)
self.assertEqual( self.assertEqual(
children_headers, children_headers,
set([header.upper() for header in ["Problem Select 1", "Problem Select 2"]]) set(["Problem Select 1", "Problem Select 2"])
) )
# Missing problem type test # Missing problem type test
......
...@@ -1013,7 +1013,7 @@ class ProblemExecutionTest(UniqueCourseTest): ...@@ -1013,7 +1013,7 @@ class ProblemExecutionTest(UniqueCourseTest):
self.course_nav.go_to_section('Test Section', 'Test Subsection') self.course_nav.go_to_section('Test Section', 'Test Subsection')
problem_page = ProblemPage(self.browser) problem_page = ProblemPage(self.browser)
self.assertEqual(problem_page.problem_name, 'PYTHON PROBLEM') self.assertEqual(problem_page.problem_name.upper(), 'PYTHON PROBLEM')
# Does the page have computation results? # Does the page have computation results?
self.assertIn("What is the sum of 17 and 3?", problem_page.problem_text) self.assertIn("What is the sum of 17 and 3?", problem_page.problem_text)
......
...@@ -66,7 +66,7 @@ class CoursewareTest(UniqueCourseTest): ...@@ -66,7 +66,7 @@ class CoursewareTest(UniqueCourseTest):
""" """
self.courseware_page.visit() self.courseware_page.visit()
self.problem_page = ProblemPage(self.browser) self.problem_page = ProblemPage(self.browser)
self.assertEqual(self.problem_page.problem_name, 'TEST PROBLEM 1') self.assertEqual(self.problem_page.problem_name, 'Test Problem 1')
def _create_breadcrumb(self, index): def _create_breadcrumb(self, index):
""" Create breadcrumb """ """ Create breadcrumb """
...@@ -103,8 +103,8 @@ class CoursewareTest(UniqueCourseTest): ...@@ -103,8 +103,8 @@ class CoursewareTest(UniqueCourseTest):
# Visit courseware as a student. # Visit courseware as a student.
self.courseware_page.visit() self.courseware_page.visit()
# Problem name should be "TEST PROBLEM 2". # Problem name should be "Test Problem 2".
self.assertEqual(self.problem_page.problem_name, 'TEST PROBLEM 2') self.assertEqual(self.problem_page.problem_name, 'Test Problem 2')
def test_course_tree_breadcrumb(self): def test_course_tree_breadcrumb(self):
""" """
......
...@@ -56,7 +56,7 @@ class MatlabProblemTest(ProblemsTest): ...@@ -56,7 +56,7 @@ class MatlabProblemTest(ProblemsTest):
""" """
self.courseware_page.visit() self.courseware_page.visit()
matlab_problem_page = MatlabProblemPage(self.browser) matlab_problem_page = MatlabProblemPage(self.browser)
self.assertEqual(matlab_problem_page.problem_name, 'TEST MATLAB PROBLEM') self.assertEqual(matlab_problem_page.problem_name, 'Test Matlab Problem')
return matlab_problem_page return matlab_problem_page
def test_run_code(self): def test_run_code(self):
......
...@@ -128,7 +128,7 @@ Feature: LMS.LTI component ...@@ -128,7 +128,7 @@ Feature: LMS.LTI component
| open_in_a_new_page | hide_launch | | open_in_a_new_page | hide_launch |
| False | True | | False | True |
Then in the LTI component I do not see a launch button Then in the LTI component I do not see a launch button
Then I see LTI component module title with text "LTI (EXTERNAL RESOURCE)" Then I see LTI component module title with text "LTI (External resource)"
#12 #12
Scenario: LTI component that set to hide_launch and not open_in_a_new_page shows no iframe Scenario: LTI component that set to hide_launch and not open_in_a_new_page shows no iframe
...@@ -137,7 +137,7 @@ Feature: LMS.LTI component ...@@ -137,7 +137,7 @@ Feature: LMS.LTI component
| open_in_a_new_page | hide_launch | | open_in_a_new_page | hide_launch |
| True | True | | True | True |
Then in the LTI component I do not see an provider iframe Then in the LTI component I do not see an provider iframe
Then I see LTI component module title with text "LTI (EXTERNAL RESOURCE)" Then I see LTI component module title with text "LTI (External resource)"
#13 #13
Scenario: LTI component button text is correctly displayed Scenario: LTI component button text is correctly displayed
......
...@@ -114,17 +114,17 @@ def when_i_navigate_to_an_item_in_a_sequence(step): ...@@ -114,17 +114,17 @@ def when_i_navigate_to_an_item_in_a_sequence(step):
@step(u'I see the content of the section') @step(u'I see the content of the section')
def then_i_see_the_content_of_the_section(step): def then_i_see_the_content_of_the_section(step):
wait_for_problem('PROBLEM 2') wait_for_problem('Problem 2')
@step(u'I see the content of the subsection') @step(u'I see the content of the subsection')
def then_i_see_the_content_of_the_subsection(step): def then_i_see_the_content_of_the_subsection(step):
wait_for_problem('PROBLEM 4') wait_for_problem('Problem 4')
@step(u'I see the content of the sequence item') @step(u'I see the content of the sequence item')
def then_i_see_the_content_of_the_sequence_item(step): def then_i_see_the_content_of_the_sequence_item(step):
wait_for_problem('PROBLEM 6') wait_for_problem('Problem 6')
@step(u'I return to the courseware') @step(u'I return to the courseware')
...@@ -183,6 +183,6 @@ def wait_for_problem(display_name): ...@@ -183,6 +183,6 @@ def wait_for_problem(display_name):
world.wait_for_ajax_complete() world.wait_for_ajax_complete()
wait_func = lambda _: world.css_has_text( wait_func = lambda _: world.css_has_text(
'h3.problem-header', display_name, strip=True '.problem-header', display_name, strip=True
) )
world.wait_for(wait_func) world.wait_for(wait_func)
...@@ -23,7 +23,7 @@ ...@@ -23,7 +23,7 @@
<div class="video-player-pre"></div> <div class="video-player-pre"></div>
<section class="video-player"> <section class="video-player">
<div id="${id}"></div> <div id="${id}"></div>
<h3 class="hidden">${_('No playable video sources found.')}</h3> <h4 class="video-error hidden">${_('No playable video sources found.')}</h4>
</section> </section>
<div class="video-player-post"></div> <div class="video-player-post"></div>
<div class="closed-captions"></div> <div class="closed-captions"></div>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment