merge

lms/static/coffee/src/discussion/content.coffee

@@ -16,7 +16,6 @@ if Backbone?
     urlMappers: {}
 
     urlFor: (name) ->
-      console.log @
       @urlMappers[name].apply(@)
 
     can: (action) ->
@@ -247,7 +246,6 @@ if Backbone?
           @model.set('votes_point', response.votes.point)
 
     toggleVote: (event) ->
-      console.log("HERE")
       $elem = $(event.target)
       value = $elem.attr("value")
       $elem.toggleClass("is-cast")
@@ -449,6 +447,14 @@ if Backbone?
       @set('subscribed', false)
       @trigger "thread:unfollow"
 
+    vote: ->
+      @get("votes")["up_count"] = parseInt(@get("votes")["up_count"]) + 1
+      @trigger "change"
+
+    unvote: ->
+      @get("votes")["up_count"] = parseInt(@get("votes")["up_count"]) - 1
+      @trigger "change"
+
     display_body: ->
       if @has("highlighted_body")
         String(@get("highlighted_body")).replace(/<highlight>/g, '<mark>').replace(/<\/highlight>/g, '</mark>')

lms/static/coffee/src/discussion/models/discussion_user.coffee

@@ -4,3 +4,11 @@ class @DiscussionUser extends Backbone.Model
 
     voted: (thread) ->
         _.include(@get('upvoted_ids'), thread.id)
+
+    vote: (thread) ->
+        @get('upvoted_ids').push(thread.id)
+        thread.vote()
+
+    unvote: (thread) ->
+        @set('upvoted_ids', _.without(@get('upvoted_ids'), thread.id))
+        thread.unvote()

lms/static/coffee/src/discussion/views/discussion_thread_view.coffee

@@ -22,22 +22,32 @@ class @DiscussionThreadView extends DiscussionContentView
 
   template: _.template($("#thread-template").html())
 
+  initialize: ->
+    @model.on "change", @updateModelDetails
+
   render: ->
     @$el.html(@template(@model.toJSON()))
-    @model.bind "change", @updateModelDetails
-    if window.user.following(@model)
-      @$(".dogear").addClass("is-followed")
-
-    if window.user.voted(@model)
-      @$(".vote-btn").addClass("is-cast")
+    @renderDogear()
+    @renderVoted()
     @$("span.timeago").timeago()
     Markdown.makeWmdEditor @$(".reply-body"), "", DiscussionUtil.urlFor("upload"), (text) -> DiscussionUtil.postMathJaxProcessor(text)
     @convertMath()
     @renderResponses()
     @
 
+  renderDogear: ->
+    if window.user.following(@model)
+      @$(".dogear").addClass("is-followed")
+
+  renderVoted: =>
+    if window.user.voted(@model)
+      @$("[data-role=discussion-vote]").addClass("is-cast")
+    else
+      @$("[data-role=discussion-vote]").removeClass("is-cast")
+
   updateModelDetails: =>
-    @$(".discussion-vote .votes-count-number").html(@model.get("votes")["up_count"])
+    @renderVoted()
+    @$("[data-role=discussion-vote] .votes-count-number").html(@model.get("votes")["up_count"])
 
   convertMath: ->
     element = @$(".post-body")
@@ -64,10 +74,10 @@ class @DiscussionThreadView extends DiscussionContentView
 
   toggleVote: (event) ->
     event.preventDefault()
-    if not @model.get('voted')#@$(".discussion-vote").hasClass("is-cast")
-      @vote()
-    else
+    if window.user.voted(@model)
       @unvote()
+    else
+      @vote()
 
   toggleFollowing: (event) ->
     $elem = $(event.target)
@@ -84,9 +94,8 @@ class @DiscussionThreadView extends DiscussionContentView
       type: "POST"
 
   vote: ->
+    window.user.vote(@model)
     url = @model.urlFor("upvote")
-    @model.set('votes_point', parseInt(@model.get('votes_point')) + 1)
-    #@$(".discussion-vote .votes-count-number").html(parseInt(@$(".discussion-vote .votes-count-number").html()) + 1)
     DiscussionUtil.safeAjax
       $elem: @$(".discussion-vote")
       url: url
@@ -96,9 +105,8 @@ class @DiscussionThreadView extends DiscussionContentView
           @model.set(response)
 
   unvote: ->
+    window.user.unvote(@model)
     url = @model.urlFor("unvote")
-    @model.set('votes_point', parseInt(@model.get('votes_point')) - 1)
-    #@$(".discussion-vote .votes-count-number").html(parseInt(@$(".discussion-vote .votes-count-number").html()) - 1)
     DiscussionUtil.safeAjax
       $elem: @$(".discussion-vote")
       url: url

lms/static/sass/_discussion.scss

@@ -55,12 +55,12 @@
 @mixin discussion-wmd-preview {
   width: 100%;
   min-height: 40px;
-  padding: 10px;
+  padding: 25px 20px 10px 20px;
   box-sizing: border-box;
   border: 1px solid #aaa;
   border-top: none;
   border-radius: 0 0 3px 3px;
-  background: #eee;    
+  background: #eee;
   color: #333;
   box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15) inset;
 }
@@ -82,7 +82,7 @@
 
 .wmd-button-bar  {
   width: 100%;
-  background-color: Silver; 
+  background-color: Silver;
 }
 
 .wmd-input {
@@ -129,25 +129,25 @@
 }
 
 .wmd-button-row {
-  position: relative; 
+  position: relative;
   margin-left: 5px;
   margin-right: 5px;
   margin-bottom: 5px;
   margin-top: 10px;
-  padding: 0px;  
+  padding: 0px;
   height: 20px;
   overflow: hidden;
   @include transition(all, .2s, easeOut);
 }
 
 .wmd-spacer {
-  width: 1px; 
-  height: 20px; 
+  width: 1px;
+  height: 20px;
   margin-left: 14px;
-  
+
   position: absolute;
   background-color: Silver;
-  display: inline-block; 
+  display: inline-block;
   list-style: none;
 }
 
@@ -301,7 +301,8 @@ body.discussion {
           border-top: 1px solid #5f5f5f;
           font-size: 14px;
           font-weight: 700;
-          color: #eee;        
+          line-height: 18px;
+          color: #eee;
 
           &:hover {
             background-color: #666;
@@ -332,7 +333,7 @@ body.discussion {
         width: 100%;
         height: 30px;
         padding: 0 15px;
-        box-sizing: border-box;   
+        box-sizing: border-box;
         border-radius: 30px;
         border: 1px solid #333;
         box-shadow: 0 1px 3px rgba(0, 0, 0, .25) inset;
@@ -350,6 +351,14 @@ body.discussion {
       padding: 40px;
       box-sizing: border-box;
     }
+
+    .wmd-button {
+      background: none;
+    }
+
+    .wmd-button span {
+      background: url(../images/new-post-icons-full.png) no-repeat;
+    }
   }
 
   .new-post-form {
@@ -388,11 +397,11 @@ body.discussion {
       width: 100%;
       //height: 50px;
       margin-top: -1px;
-      padding: 10px;
+      padding: 25px 20px 10px 20px;
       box-sizing: border-box;
       border: 1px solid #333;
       border-radius: 0 0 3px 3px;
-      background: #e6e6e6;    
+      background: #e6e6e6;
       color: #333;
       box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) inset;
     }
@@ -400,10 +409,10 @@ body.discussion {
     .new-post-preview-label {
       position: absolute;
       top: 4px;
-      left: 4px;    
+      left: 4px;
       font-size: 11px;
       color: #aaa;
-      text-transform: uppercase;    
+      text-transform: uppercase;
     }
 
     .new-post-title,
@@ -468,7 +477,7 @@ body.discussion {
     color: #333;
     background: #c5eeff;
     border: 1px solid #90c4d7;
-    font-size: 13px;  
+    font-size: 13px;
   }
 
   .thread-title {
@@ -478,7 +487,7 @@ body.discussion {
     color: #333;
     font-weight: 700;
   }
-  
+
 
 
 
@@ -567,7 +576,7 @@ body.discussion {
     height: 60px;
     border-bottom: 1px solid #a3a3a3;
     border-radius: 3px 0 0 0;
-    
+
 
     .browse,
     .search {
@@ -716,18 +725,24 @@ body.discussion {
 
       a {
         display: block;
-        height: 50px;
         padding: 0 20px;
         border-top: 1px solid #5f5f5f;
         font-size: 14px;
         font-weight: 700;
-        line-height: 48px;
+        line-height: 22px;
         color: #fff;
+        @include clearfix;
 
         &:hover {
           background-color: #636363;
         }
 
+        .board-name {
+          float: left;
+          width: 80%;
+          margin: 13px 0;
+        }
+
         .unread {
           float: right;
           padding: 0 5px;
@@ -762,7 +777,7 @@ body.discussion {
       width: 100%;
       height: 30px;
       padding: 0 15px;
-      box-sizing: border-box;   
+      box-sizing: border-box;
       border-radius: 30px;
       border: 1px solid #333;
       box-shadow: 0 1px 3px rgba(0, 0, 0, .25) inset;
@@ -929,7 +944,7 @@ body.discussion {
         box-shadow: 0 1px 0 #4697c1, 0 -1px 0 #4697c1;
 
         .title {
-          color: #333;  
+          color: #333;
         }
 
         .votes-count,
@@ -1077,7 +1092,7 @@ body.discussion {
   .responses {
     list-style: none;
     margin-top: 40px;
-    padding: 0;    
+    padding: 0;
 
     > li {
       position: relative;
@@ -1230,8 +1245,8 @@ body.discussion {
       background: #009FE2;
       font-size: 9px;
       font-weight: 700;
-      font-style: normal;   
-      color: white;   
+      font-style: normal;
+      color: white;
       text-transform: uppercase;
     }
 
@@ -1386,7 +1401,7 @@ body.discussion {
   }
 
   #wmd-input {
-    @include discussion-wmd-input; 
+    @include discussion-wmd-input;
   }
 
   #wmd-preview {
@@ -1401,6 +1416,10 @@ body.discussion {
     @include blue-button;
     float: left;
   }
+
+  .wmd-button {
+    width: 15px;
+  }
 }
 
 
@@ -1418,7 +1437,53 @@ body.discussion {
 
 /* For some reason I have to do this to get the SCSS to compile, can't stick it under the above .discussion-module */
 .discussion-module {
+  section.discussion {
+    /* Course content p has a default margin-bottom of 1.416, this is just to reset that */
+
+    .discussion-thread {
+      padding: 0.5em;
+
+      p {
+        margin-bottom: 0em;
+      }
+      .discussion-article {
+        border: 1px solid;
+        border-radius: 3px;
+        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
+
+        .discussion-post {
+          header {
+            padding-bottom: 0.1em;
+            margin-bottom: 10px;
+
+          }
+          .post-body {
+            font-size: 14px;
+          }
+        }
+
+        .responses {
+          margin-top: 10px;
+
+          header {
+            padding-bottom: 0em;
+            margin-bottom: 5px;
+            .posted-by {
+              font-size: 0.8em;
+            }
+          }
+          .response-body {
+            margin-bottom: 0.2em;
+            font-size: 14px;
+          }
+
+        }
+      }
+    }
+  }
+
   .discussion-reply-new {
-    display:none
+    display:none;
   }
+
 }

lms/templates/discussion/_underscore_templates.html

@@ -3,7 +3,7 @@
         <a href="javascript:void(0)" class="dogear action-follow"></a>
         <div class="discussion-post">
             <header>
-                <a href="#" class="vote-btn discussion-vote discussion-vote-up"><span class="plus-icon">+</span> <span class='votes-count-number'>${'<%- votes["up_count"] %>'}</span></a>
+                <a href="#" class="vote-btn discussion-vote discussion-vote-up" data-role="discussion-vote"><span class="plus-icon">+</span> <span class='votes-count-number'>${'<%- votes["up_count"] %>'}</span></a>
                 <h1>${'<%- title %>'}</h1>
                 <p class="posted-details">
                     <span class="timeago" title="${'<%- created_at %>'}">${'<%- created_at %>'}</span> by

lms/templates/discussion/mustache/_inline_discussion.mustache

 <section class="discussion">
   {{#threads}}
-    <article class="discussion-article" data-id="{{id}}" id="thread_{{id}}">
+    <article class="discussion-thread" id="thread_{{id}}">
     </article>
   {{/threads}}
 </section>