diff --git a/common/static/common/js/discussion/discussion_module_view.js b/common/static/common/js/discussion/discussion_module_view.js index 0d600aa69f..36ed2a4859 100644 --- a/common/static/common/js/discussion/discussion_module_view.js +++ b/common/static/common/js/discussion/discussion_module_view.js @@ -74,6 +74,7 @@ NewPostView */ this.toggleDiscussionBtn = this.$('.discussion-show'); match = this.page_re.exec(window.location.href); this.context = options.context || 'course'; + this.readOnly = $('.discussion-module').data('read-only'); if (match) { this.page = parseInt(match[1]); } else { @@ -169,6 +170,7 @@ NewPostView */ }); $discussion = _.template($('#inline-discussion-template').html())({ 'threads': response.discussion_data, + read_only: this.readOnly, 'discussionId': discussionId }); if (this.$('section.discussion').length) { diff --git a/common/static/common/templates/discussion/inline-discussion.underscore b/common/static/common/templates/discussion/inline-discussion.underscore index 96dde1bed8..908c2d2380 100644 --- a/common/static/common/templates/discussion/inline-discussion.underscore +++ b/common/static/common/templates/discussion/inline-discussion.underscore @@ -1,4 +1,8 @@ -
+
+
+ +
+
diff --git a/common/test/acceptance/pages/lms/teams.py b/common/test/acceptance/pages/lms/teams.py index 467b5885b0..4a06c5905a 100644 --- a/common/test/acceptance/pages/lms/teams.py +++ b/common/test/acceptance/pages/lms/teams.py @@ -569,7 +569,7 @@ class TeamPage(CoursePage, PaginatedUIMixin, BreadcrumbsMixin): @property def new_post_button_present(self): """ Returns True if New Post button is present else False """ - return self.q(css='.discussion-module .new-post-btn').present + return self.q(css='.discussion-module .new-post-btn').visible @property def edit_team_button_present(self): diff --git a/common/test/acceptance/tests/discussion/test_discussion.py b/common/test/acceptance/tests/discussion/test_discussion.py index ee6eca1bde..75db0960d8 100644 --- a/common/test/acceptance/tests/discussion/test_discussion.py +++ b/common/test/acceptance/tests/discussion/test_discussion.py @@ -1051,6 +1051,11 @@ class InlineDiscussionTest(UniqueCourseTest, DiscussionResponsePaginationTestMix # Check if 'thread-wrapper' is focused after expanding thread self.assertFalse(thread_page.check_if_selector_is_focused(selector='.thread-wrapper')) + def test_add_a_post_is_present_if_can_create_thread_when_expanded(self): + self.discussion_page.expand_discussion() + # Add a Post link is present + self.assertTrue(self.discussion_page.q(css='.new-post-btn').present) + def test_initial_render(self): self.assertFalse(self.discussion_page.is_discussion_expanded()) @@ -1096,14 +1101,8 @@ class InlineDiscussionTest(UniqueCourseTest, DiscussionResponsePaginationTestMix [Comment(id="comment1", user_id="other"), Comment(id="comment2", user_id=self.user_id)]) thread_fixture.push() self.setup_thread_page(thread.get("id")) - self.assertFalse(self.discussion_page.element_exists(".new-post-btn")) self.assertFalse(self.thread_page.has_add_response_button()) - self.assertFalse(self.thread_page.is_response_editable("response1")) - self.assertFalse(self.thread_page.is_add_comment_visible("response1")) - self.assertFalse(self.thread_page.is_comment_editable("comment1")) - self.assertFalse(self.thread_page.is_comment_editable("comment2")) - self.assertFalse(self.thread_page.is_comment_deletable("comment1")) - self.assertFalse(self.thread_page.is_comment_deletable("comment2")) + self.assertFalse(self.thread_page.is_element_visible("action-more")) def test_dual_discussion_xblock(self): """ @@ -1124,13 +1123,16 @@ class InlineDiscussionTest(UniqueCourseTest, DiscussionResponsePaginationTestMix """ self.discussion_page.wait_for_page() self.additional_discussion_page.wait_for_page() + self.discussion_page.expand_discussion() self.discussion_page.click_new_post_button() with self.discussion_page.handle_alert(): self.discussion_page.click_cancel_new_post() + self.additional_discussion_page.expand_discussion() self.additional_discussion_page.click_new_post_button() self.assertFalse(self.discussion_page._is_element_visible(".new-post-article")) with self.additional_discussion_page.handle_alert(): self.additional_discussion_page.click_cancel_new_post() + self.discussion_page.expand_discussion() self.discussion_page.click_new_post_button() self.assertFalse(self.additional_discussion_page._is_element_visible(".new-post-article")) diff --git a/common/test/acceptance/tests/lms/test_teams.py b/common/test/acceptance/tests/lms/test_teams.py index fec3e5a7f1..41e376cd94 100644 --- a/common/test/acceptance/tests/lms/test_teams.py +++ b/common/test/acceptance/tests/lms/test_teams.py @@ -1705,7 +1705,6 @@ class TeamPageTest(TeamsTabBase): assertion = self.assertTrue if should_have_permission else self.assertFalse assertion(discussion.q(css='.post-header-actions').present) assertion(discussion.q(css='.add-response').present) - assertion(discussion.q(css='.new-post-btn').present) def test_discussion_on_my_team_page(self): """ diff --git a/lms/djangoapps/courseware/tests/test_discussion_xblock.py b/lms/djangoapps/courseware/tests/test_discussion_xblock.py index fa6d85d9b2..496affd263 100644 --- a/lms/djangoapps/courseware/tests/test_discussion_xblock.py +++ b/lms/djangoapps/courseware/tests/test_discussion_xblock.py @@ -241,14 +241,11 @@ class TestTemplates(TestDiscussionXBlock): self.block.has_permission = lambda perm: permission_dict[perm] fragment = self.block.student_view() - + read_only = 'false' if permissions[0] else 'true' self.assertIn('data-discussion-id="{}"'.format(self.discussion_id), fragment.content) self.assertIn('data-user-create-comment="{}"'.format(json.dumps(permissions[1])), fragment.content) self.assertIn('data-user-create-subcomment="{}"'.format(json.dumps(permissions[2])), fragment.content) - if permissions[0]: - self.assertIn("Add a Post", fragment.content) - else: - self.assertNotIn("Add a Post", fragment.content) + self.assertIn('data-read-only="{read_only}"'.format(read_only=read_only), fragment.content) @ddt.ddt diff --git a/lms/djangoapps/teams/static/teams/js/spec/views/team_profile_spec.js b/lms/djangoapps/teams/static/teams/js/spec/views/team_profile_spec.js index e9362173b5..2021c3d36e 100644 --- a/lms/djangoapps/teams/static/teams/js/spec/views/team_profile_spec.js +++ b/lms/djangoapps/teams/static/teams/js/spec/views/team_profile_spec.js @@ -108,19 +108,17 @@ define([ var requests = AjaxHelpers.requests(this), view = createTeamProfileView(requests, {}); - expect(view.$('.new-post-btn').length).toEqual(0); teamModel.set('membership', DEFAULT_MEMBERSHIP); // This should re-render the view. view.render(); - expect(view.$('.new-post-btn').length).toEqual(1); + expect(view.$('.btn-link.new-post-btn.is-hidden').length).toEqual(0); }); it('hides New Post button when user left a team', function() { var requests = AjaxHelpers.requests(this), view = createTeamProfileView(requests, {membership: DEFAULT_MEMBERSHIP}); - expect(view.$('.new-post-btn').length).toEqual(1); clickLeaveTeam(requests, view, {cancel: false}); - expect(view.$('.new-post-btn').length).toEqual(0); + expect(view.$('.new-post-btn.is-hidden').length).toEqual(0); }); }); diff --git a/lms/djangoapps/teams/static/teams/js/views/team_discussion.js b/lms/djangoapps/teams/static/teams/js/views/team_discussion.js index 49f87a2ace..2d4d336523 100644 --- a/lms/djangoapps/teams/static/teams/js/views/team_discussion.js +++ b/lms/djangoapps/teams/static/teams/js/views/team_discussion.js @@ -13,6 +13,7 @@ render: function() { var discussionModuleView = new DiscussionModuleView({ el: this.$el, + readOnly: this.$el.data('read-only') === true, context: 'standalone' }); discussionModuleView.render(); diff --git a/lms/djangoapps/teams/static/teams/js/views/team_profile.js b/lms/djangoapps/teams/static/teams/js/views/team_profile.js index b78b51b397..d65c2cf1f9 100644 --- a/lms/djangoapps/teams/static/teams/js/views/team_profile.js +++ b/lms/djangoapps/teams/static/teams/js/views/team_profile.js @@ -55,7 +55,8 @@ }) ); this.discussionView = new TeamDiscussionView({ - el: this.$('.discussion-module') + el: this.$('.discussion-module'), + readOnly: this.$('.discussion-module').data('read-only') === true }); this.discussionView.render(); diff --git a/lms/djangoapps/teams/static/teams/templates/team-profile.underscore b/lms/djangoapps/teams/static/teams/templates/team-profile.underscore index adb58c4fcb..7d6402970f 100644 --- a/lms/djangoapps/teams/static/teams/templates/team-profile.underscore +++ b/lms/djangoapps/teams/static/teams/templates/team-profile.underscore @@ -4,11 +4,6 @@ data-read-only="<%- readOnly %>" data-user-create-comment="<%- !readOnly %>" data-user-create-subcomment="<%- !readOnly %>"> - <% if ( !readOnly) { %> - - <% } %> diff --git a/lms/static/sass/base/_headings.scss b/lms/static/sass/base/_headings.scss index 038462cca6..0f7c725a41 100644 --- a/lms/static/sass/base/_headings.scss +++ b/lms/static/sass/base/_headings.scss @@ -125,7 +125,11 @@ $headings-base-color: $gray-d2; margin-bottom: 0; font-size: 1.5em; } + + &.discussion-module-title { + margin-bottom: 0; + display: inline-block; + } } } - diff --git a/lms/static/sass/course/courseware/_courseware.scss b/lms/static/sass/course/courseware/_courseware.scss index ba54c98573..2875abca8f 100644 --- a/lms/static/sass/course/courseware/_courseware.scss +++ b/lms/static/sass/course/courseware/_courseware.scss @@ -121,6 +121,7 @@ html.video-fullscreen { h1 { margin: 0 0 lh(); + letter-spacing: 0; } div.timed-exam { h3 { diff --git a/lms/static/sass/discussion/_discussion-v1.scss b/lms/static/sass/discussion/_discussion-v1.scss index 80af8faaf8..9059f02718 100644 --- a/lms/static/sass/discussion/_discussion-v1.scss +++ b/lms/static/sass/discussion/_discussion-v1.scss @@ -18,8 +18,11 @@ box-shadow: none; height: 40px; text-shadow: none; + font-family: $f-sans-serif; // without this, it would fallback to lms button tag style font-size: 14px; font-weight: 600; + word-wrap: break-word; + white-space: nowrap; // Display: block, one button per line, full width &.block { diff --git a/lms/static/sass/discussion/_discussion.scss b/lms/static/sass/discussion/_discussion.scss index d43305a3ff..8201afaebf 100644 --- a/lms/static/sass/discussion/_discussion.scss +++ b/lms/static/sass/discussion/_discussion.scss @@ -299,7 +299,7 @@ body.discussion { position: relative; margin: $baseline 0; padding: $baseline; - background: #f6f6f6 !important; + border: 1px solid $forum-color-border !important; border-radius: $forum-border-radius; header { @@ -308,9 +308,30 @@ body.discussion { } } - .new-post-btn { - @include float(right); - @include margin-right(4px); + .inline-discussion-topic { + width: flex-grid(12); + font-size: $forum-small-font-size; + + .inline-discussion-topic-title { + font-weight: bold; + } + } + + .discussion-module-header { + @include float(left); + width: flex-grid(7); + } + + .add_post_btn_container { + @include text-align(right); + position: relative; + top: -45px; + } + + .discussion { + &.inline-discussion { + padding-top: $baseline * 3; + } } div.add-response.post-extended-content { @@ -324,27 +345,17 @@ body.discussion { } .discussion-show { + @include float(right); position: relative; top: 3px; font-size: $forum-base-font-size; text-align: center; &.shown { - .show-hide-discussion-icon { - background-position: 0 0; - } + background-color: $btn-default-background-color; + color: $uxpl-primary-blue; } - .show-hide-discussion-icon { - display: inline-block; - position: relative; - top: 5px; - @include margin-right(6px); - width: 21px; - height: 19px; - background: url('#{$static-path}/images/show-hide-discussion-icon.png') no-repeat; - background-position: -21px 0; - } } section.discussion { diff --git a/lms/static/sass/discussion/utilities/_variables-v1.scss b/lms/static/sass/discussion/utilities/_variables-v1.scss index 3e913e1be5..0e57bb85a1 100644 --- a/lms/static/sass/discussion/utilities/_variables-v1.scss +++ b/lms/static/sass/discussion/utilities/_variables-v1.scss @@ -35,3 +35,7 @@ $forum-small-font-size: 12px; // borders $forum-border-radius: 3px; + +// btn colors +$uxpl-primary-blue: $blue !default; +$btn-default-background-color: $white; diff --git a/lms/static/sass/discussion/utilities/_variables-v2.scss b/lms/static/sass/discussion/utilities/_variables-v2.scss index c1c3e73461..6dfdb0b900 100644 --- a/lms/static/sass/discussion/utilities/_variables-v2.scss +++ b/lms/static/sass/discussion/utilities/_variables-v2.scss @@ -35,3 +35,8 @@ $forum-small-font-size: font-size(x-small); // borders $forum-border-radius: $component-border-radius; + + +// btn colors +$uxpl-primary-blue: palette(primary, base) !default; +$btn-default-background-color: $lms-container-background-color; diff --git a/lms/static/sass/discussion/views/_response.scss b/lms/static/sass/discussion/views/_response.scss index 2faceb6817..ee465cd8c1 100644 --- a/lms/static/sass/discussion/views/_response.scss +++ b/lms/static/sass/discussion/views/_response.scss @@ -145,6 +145,7 @@ > li { border-top: 1px solid $forum-color-border; padding: ($baseline/2) $baseline; + position: relative; } blockquote { diff --git a/lms/static/sass/discussion/views/_thread.scss b/lms/static/sass/discussion/views/_thread.scss index 2ab890c1ab..4ba192200c 100644 --- a/lms/static/sass/discussion/views/_thread.scss +++ b/lms/static/sass/discussion/views/_thread.scss @@ -80,6 +80,9 @@ .comment-actions-list { @include float(right); + @include right($baseline / 2); + position: absolute; + top: $baseline / 2; } } diff --git a/lms/static/sass/elements/_controls.scss b/lms/static/sass/elements/_controls.scss index cf1ad9848b..12657928f1 100644 --- a/lms/static/sass/elements/_controls.scss +++ b/lms/static/sass/elements/_controls.scss @@ -461,6 +461,7 @@ background-image: none; box-shadow: none; text-shadow: none; + white-space: nowrap; @extend %t-action3; @extend %t-strong; diff --git a/lms/templates/discussion/_discussion_inline.html b/lms/templates/discussion/_discussion_inline.html index b616d9e8fe..2d9aca2fab 100644 --- a/lms/templates/discussion/_discussion_inline.html +++ b/lms/templates/discussion/_discussion_inline.html @@ -8,13 +8,17 @@ from json import dumps as json_dumps from openedx.core.djangolib.js_utils import js_escaped_string %> -
- - ${_("Show Discussion")} - - % if can_create_thread: - - % endif +
+
+

${_(display_name)}

+
${_("Topic:")} ${discussion_category} / ${discussion_target}
+
+