Andal.LND/edx-platform
6
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Add post type indicators to forum sidebar nav

Browse Source 
The previously existing checkmark for threads with endorsed responses is
removed, as it is mostly redundant.
This commit is contained in:
Greg Price
2014-07-22 16:35:39 -04:00
parent dd05423732
commit 2e30874180
9 changed files with 94 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
common/static/coffee/spec/discussion/view/discussion_thread_list_view_spec.coffee
View File

@@ -6,7 +6,23 @@ describe "DiscussionThreadListView", ->
<script type="text/template" id="thread-list-item-template">
<li data-id="<%- id %>" class="forum-nav-thread<% if (typeof(read) != "undefined" && !read) { %> is-unread<% } %>">
<a href="#" class="forum-nav-thread-link">
<div class="forum-nav-thread-wrapper-1">
<div class="forum-nav-thread-wrapper-0">
<%
var icon_class, sr_text;
if (thread_type == "discussion") {
icon_class = "icon-comments";
sr_text = "discussion";
} else if (endorsed) {
icon_class = "icon-ok";
sr_text = "answered question";
} else {
icon_class = "icon-question";
sr_text = "unanswered question";
}
%>
<span class="sr"><%= sr_text %></span>
<i class="icon <%= icon_class %>"></i>
</div><div class="forum-nav-thread-wrapper-1">
<span class="forum-nav-thread-title"><%- title %></span>
<%
var labels = "";
@@ -27,9 +43,6 @@ describe "DiscussionThreadListView", ->
}
%>
</div><div class="forum-nav-thread-wrapper-2">
<% if (endorsed) { %>
<span class="forum-nav-thread-endorsed"><i class="icon icon-ok"></i><span class="sr">Endorsed response</span></span>
<% } %>
<span class="forum-nav-thread-votes-count">+<%=
interpolate(
'%(votes_up_count)s%(span_sr_open)s votes %(span_close)s',
@@ -372,14 +385,21 @@ describe "DiscussionThreadListView", ->
expect($.ajax).toHaveBeenCalled()
expect(@view.addSearchAlert).not.toHaveBeenCalled()
describe "endorsed renders correctly", ->
it "when absent", ->
renderSingleThreadWithProps({})
expect($(".forum-nav-thread-endorsed").length).toEqual(0)
describe "post type renders correctly", ->
it "for discussion", ->
renderSingleThreadWithProps({thread_type: "discussion"})
expect($(".forum-nav-thread-wrapper-0 .icon")).toHaveClass("icon-comments")
expect($(".forum-nav-thread-wrapper-0 .sr")).toHaveText("discussion")
it "when present", ->
renderSingleThreadWithProps({endorsed: true})
expect($(".forum-nav-thread-endorsed").length).toEqual(1)
it "for answered question", ->
renderSingleThreadWithProps({thread_type: "question", endorsed: true})
expect($(".forum-nav-thread-wrapper-0 .icon")).toHaveClass("icon-ok")
expect($(".forum-nav-thread-wrapper-0 .sr")).toHaveText("answered question")
it "for unanswered question", ->
renderSingleThreadWithProps({thread_type: "question", endorsed: false})
expect($(".forum-nav-thread-wrapper-0 .icon")).toHaveClass("icon-question")
expect($(".forum-nav-thread-wrapper-0 .sr")).toHaveText("unanswered question")
describe "post labels render correctly", ->
beforeEach ->

1
common/static/coffee/spec/discussion/view/discussion_view_spec_helper.coffee
View File

@@ -3,6 +3,7 @@ class @DiscussionViewSpecHelper
# Minimal set of properties necessary for rendering
thread = {
id: "dummy_id",
thread_type: "discussion",
pinned: false,
endorsed: false,
votes: {up_count: '0'},

10
common/static/coffee/src/discussion/views/discussion_content_view.coffee
View File

@@ -8,16 +8,6 @@ if Backbone?
(event) -> DiscussionUtil.activateOnSpace(event, @toggleFlagAbuse)
attrRenderer:
endorsed: (endorsed) ->
if endorsed
@$(".action-endorse").show().addClass("is-endorsed")
else
if @model.get('ability')?.can_endorse
@$(".action-endorse").show()
else
@$(".action-endorse").hide()
@$(".action-endorse").removeClass("is-endorsed")
closed: (closed) ->
return if not @$(".action-openclose").length
return if not @$(".post-status-closed").length

2
common/static/coffee/src/discussion/views/discussion_thread_view.coffee
View File

@@ -216,7 +216,7 @@ if Backbone?
@model.comment()
endorseThread: (endorsed) =>
is_endorsed = @$el.find(".is-endorsed").length
is_endorsed = @$el.find(".is-endorsed").length > 0
@model.set 'endorsed', is_endorsed
submitComment: (event) ->

12
common/static/coffee/src/discussion/views/thread_response_show_view.coffee
View File

@@ -12,6 +12,18 @@ if Backbone?
"keydown .discussion-flag-abuse":
(event) -> DiscussionUtil.activateOnSpace(event, @toggleFlagAbuse)
attrRenderer: $.extend({}, DiscussionContentView.prototype.attrRenderer, {
endorsed: (endorsed) ->
if endorsed
@$(".action-endorse").show().addClass("is-endorsed")
else
if @model.get('ability')?.can_endorse
@$(".action-endorse").show()
else
@$(".action-endorse").hide()
@$(".action-endorse").removeClass("is-endorsed")
})
$: (selector) ->
@$el.find(selector)

1
common/static/coffee/src/discussion/views/thread_response_view.coffee
View File

@@ -155,6 +155,7 @@ if Backbone?
@showView = new ThreadResponseShowView(model: @model)
@showView.bind "response:_delete", @_delete
@showView.bind "response:edit", @edit
@showView.on "comment:endorse", => @trigger("comment:endorse")
renderShowView: () ->
@renderSubView(@showView)

30
lms/static/sass/discussion/elements/_navigation.scss
View File

@@ -179,14 +179,35 @@
vertical-align: middle;
}
.forum-nav-thread-wrapper-0 {
@extend %forum-nav-thread-wrapper;
width: 7%;
.icon {
@include font-size(14);
}
.icon-comments {
color: $gray-l2;
}
.icon-ok {
color: $forum-color-marked-answer;
}
.icon-question {
color: $pink;
}
}
.forum-nav-thread-wrapper-1 {
@extend %forum-nav-thread-wrapper;
width: 70%;
width: 80%;
}
.forum-nav-thread-wrapper-2 {
@extend %forum-nav-thread-wrapper;
width: 30%;
width: 13%;
text-align: right;
}
@@ -252,11 +273,6 @@
}
}
.forum-nav-thread-endorsed {
@extend %forum-nav-thread-wrapper-2-content;
color: $green-d1;
}
.forum-nav-thread-votes-count {
@extend %forum-nav-thread-wrapper-2-content;
}

1
lms/static/sass/discussion/utilities/_variables.scss
View File

@@ -3,3 +3,4 @@ $forum-color-pinned: $pink;
$forum-color-following: $blue;
$forum-color-staff: $blue;
$forum-color-community-ta: $green-d1;
$forum-color-marked-answer: $green-d1;

29
lms/templates/discussion/_underscore_templates.html
View File

@@ -264,7 +264,30 @@
<script aria-hidden="true" type="text/template" id="thread-list-item-template">
<li data-id="${'<%- id %>'}" class="forum-nav-thread${'<% if (typeof(read) != "undefined" && !read) { %> is-unread<% } %>'}">
<a href="#" class="forum-nav-thread-link">
<div class="forum-nav-thread-wrapper-1">
<div class="forum-nav-thread-wrapper-0">
${u"""<%
var icon_class, sr_text;
if (thread_type == "discussion") {{
icon_class = "icon-comments";
sr_text = "{discussion}";
}} else if (endorsed) {{
icon_class = "icon-ok";
sr_text = "{answered_question}";
}} else {{
icon_class = "icon-question";
sr_text = "{unanswered_question}";
}}
%>""".format(
## Translators: This is a label for a Discussion forum thread
discussion=escapejs(_("discussion")),
## Translators: This is a label for a Question forum thread with a marked answer
answered_question=escapejs(_("answered question")),
## Translators: This is a label for a Question forum thread without a marked answer
unanswered_question=escapejs(_("unanswered question"))
)}
<span class="sr">${"<%= sr_text %>"}</span>
<i class="icon ${"<%= icon_class %>"}"></i>
</div><div class="forum-nav-thread-wrapper-1">
<span class="forum-nav-thread-title">${"<%- title %>"}</span>
<%
js_block = u"""
@@ -297,10 +320,6 @@
%>
${"<%"}${js_block}${"%>"}
</div><div class="forum-nav-thread-wrapper-2">
${"<% if (endorsed) { %>"}
## Translators: This is a label for a forum thread with a response that was endorsed by the course staff
<span class="forum-nav-thread-endorsed"><i class="icon icon-ok"></i><span class="sr">${_("Endorsed response")}</span></span>
${"<% } %>"}
<%
js_block = u"""
interpolate(