Adds featured debates

app/assets/stylesheets/participation.scss

@@ -4,7 +4,7 @@
 // 02. New participation
 // 03. Show participation
 // 04. List participation
-// 05. Featured proposals
+// 05. Featured
 //
 
 // 01. Votes and supports
@@ -827,12 +827,28 @@
   }
 }
 
-// 05. Featured proposals
+// 05. Featured
 // - - - - - - - - - - - - - - - - - - - - - - - - -
 
+.featured-debates-container {
+  background: $votes-bg;
+
+  @media (min-width: $medium-breakpoint) {
+    margin-left: 0 !important;
+    margin-right: 0 !important;
+  }
+
+  h2 {
+    color: white;
+  }
+
+  .debates-list {
+    margin-bottom: 0;
+  }
+}
+
 .featured-proposals-container {
   background: #FED900;
-  margin: 0 !important;
 
   @media (min-width: $medium-breakpoint) {
     margin-left: 0 !important;
@@ -841,14 +857,21 @@
 
   h2 {
     color: $text;
-    font-size: rem-calc(24);
-    margin: rem-calc(12) 0 0;
-    position: relative;
-    text-transform: uppercase;
 
     @media (min-width: $medium-breakpoint) {
       margin-bottom: rem-calc(27);
     }
+  }
+}
+
+.featured-debates-container, .featured-proposals-container {
+  margin: 0 !important;
+
+  h2 {
+    font-size: rem-calc(24);
+    margin: rem-calc(12) 0 0;
+    position: relative;
+    text-transform: uppercase;
 
     .icon-proposals {
       font-size: rem-calc(20);
@@ -858,34 +881,86 @@
     }
   }
 
+  .debates-list {
+
+    @media (min-width: $medium-breakpoint) {
+      border-left: 1px solid $votes-border;
+    }
+
+    &:after {
+
+      @media (min-width: $medium-breakpoint) {
+        content: none;
+      }
+    }
+  }
+
   .proposals-list {
-    margin: rem-calc(6) 0;
 
     @media (min-width: $medium-breakpoint) {
       border-left: 1px solid #D2B400;
     }
 
     &:after {
-      content: none;
-      position: absolute;
-      display: block;
-      border-style: solid;
       border-color: #C9AF00 transparent transparent transparent;
-      bottom: rem-calc(-20);
-      border-left-width: 0;
-      border-right-color: transparent;
-      right: rem-calc(1);
-      border-width: rem-calc(14) rem-calc(14) 0 0;
 
       @media (min-width: $medium-breakpoint) {
         content: " ";
       }
     }
   }
+
+  .debates-list, .proposals-list {
+    margin: rem-calc(6) 0;
+
+    &:after {
+      content: none;
+      position: absolute;
+      display: block;
+      border-style: solid;
+      bottom: rem-calc(-20);
+      border-left-width: 0;
+      border-right-color: transparent;
+      right: rem-calc(1);
+      border-width: rem-calc(14) rem-calc(14) 0 0;
+    }
+  }
+}
+
+.debate-featured {
+  background: $votes-bg;
+
+  .panel h3 a {
+    color: #0D3F54;
+  }
+
+  .info {
+    color: white !important;
+  }
+
+  .content {
+    height: auto;
+  }
 }
 
 .proposal-featured {
   background: #FED900;
+
+  .panel h3 a {
+    color: $text;
+  }
+
+  .info {
+    color: #806C00 !important;
+  }
+
+  .content {
+    height: rem-calc(60);
+  }
+}
+
+.debate-featured, .proposal-featured {
+
   margin-bottom: 0;
   margin-top: 0;
   padding-left: 0;
@@ -903,7 +978,6 @@
 
       a {
         clear: both;
-        color: $text;
         display: block;
         font-size: rem-calc(14);
         line-height: $line-height;
@@ -921,14 +995,9 @@
   }
 
   .content {
-    height: rem-calc(60);
     overflow: hidden;
   }
 
-  .info {
-    color: #806C00 !important;
-  }
-
   .supports {
     @include supports;
     background: none;

app/controllers/debates_controller.rb

@@ -12,11 +12,24 @@ class DebatesController < ApplicationController
   load_and_authorize_resource
   respond_to :html, :js
 
+  def index_customization
+    @featured_debates = Debate.all.sort_by_confidence_score.limit(3) if (@search_terms.blank? && @tag_filter.blank?)
+    if @featured_debates.present?
+      set_featured_debate_votes(@featured_debates)
+      @resources = @resources.where('debates.id NOT IN (?)', @featured_debates.map(&:id))
+    end
+  end
+
   def vote
     @debate.register_vote(current_user, params[:value])
     set_debate_votes(@debate)
   end
 
+  def vote_featured
+    @debate.register_vote(current_user, 'yes')
+    set_featured_debate_votes(@debate)
+  end
+
   private
 
     def debate_params
@@ -27,4 +40,7 @@ class DebatesController < ApplicationController
       Debate
     end
 
+    def set_featured_debate_votes(debates)
+      @featured_debates_votes = current_user ? current_user.debate_votes(debates) : {}
+    end
 end

app/views/debates/_featured_debate.html.erb

@@ -0,0 +1,18 @@
+<div id="<%= dom_id(debate) %>" class="debate-featured small-12 column">
+  <div class="panel">
+    <div class="content small-12 medium-9 left">
+      <h3><%= link_to debate.title, debate %></h3>
+      <div class="info">
+        <span class="author">
+          <% if debate.author.hidden? || debate.author.erased? %>
+            <%= t("debates.show.author_deleted") %>
+          <% else %>
+            <%= debate.author.name %>
+          <% end %>
+        </span>
+        <span>&nbsp;&bull;&nbsp;</span>
+        <%= t("debates.debate.votes", count: debate.total_votes) %>
+      </div>
+    </div>
+  </div>
+</div>

app/views/debates/index.html.erb

@@ -44,6 +44,24 @@
           <%= link_to t("debates.index.start_debate"), new_debate_path, class: 'button radius expand' %>
         </div>
 
+        <% if @featured_debates.present? %>
+          <div id="featured-debates" class="row featured-debates-container">
+            <div class="small-12 medium-3 column">
+              <h2>
+                <%= t("debates.index.featured_proposals_html") %>
+              </h2>
+              <span class="show-for-medium-up">
+                <%= image_tag("featured_debates.jpg", size: "210x135") %>
+              </span>
+            </div>
+            <div class="small-12 medium-9 column debates-list">
+              <% @featured_debates.each do |featured_debate| %>
+                <%= render "featured_debate", debate: featured_debate %>
+              <% end %>
+            </div>
+          </div>
+        <% end %>
+
         <%= render @debates %>
         <%= paginate @debates %>
       </div>

config/locales/en.yml

@@ -79,6 +79,7 @@ en:
   debates:
     index:
       title: "Debates"
+      featured_proposals_html: "Featured<br>debates"
       start_debate: "Start a debate"
       select_order: "Order by"
       select_order_long: "You are viewing debates according to:"

config/locales/es.yml

@@ -79,6 +79,7 @@ es:
   debates:
     index:
       title: "Debates"
+      featured_proposals_html: "Debates<br>destacados"
       start_debate: "Empieza un debate"
       select_order: "Ordenar por"
       select_order_long: "Estás viendo los debates"