Merge pull request #1824 from rockandror/user-recomendations

User recomendations

app/assets/stylesheets/_settings.scss

@@ -411,7 +411,7 @@ $maincontent-shadow: 0 0 10px rgba($black, 0.5);
 
 $orbit-bullet-background: $medium-gray;
 $orbit-bullet-background-active: $dark-gray;
-$orbit-bullet-diameter: 1.2rem;
+$orbit-bullet-diameter: 0.8rem;
 $orbit-bullet-margin: 0.1rem;
 $orbit-bullet-margin-top: 0.8rem;
 $orbit-bullet-margin-bottom: 0.8rem;

app/assets/stylesheets/layout.scss

@@ -18,7 +18,8 @@
 // 16. Flags
 // 17. Activity
 // 18. Banners
-// 19. Documents
+// 19. Recommended Section Home
+// 20. Documents
 //
 
 // 01. Global styles
@@ -341,6 +342,14 @@ a {
   background: $brand;
 }
 
+.truncate-horizontal-text {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  -o-text-overflow: ellipsis;
+  -ms-text-overflow: ellipsis;
+}
+
 .align-top {
   vertical-align: top;
 }
@@ -612,7 +621,7 @@ header {
     text-align: left;
 
     @include breakpoint(medium) {
-      margin-right: $line-height * 1.5;
+      margin-right: rem-calc(24);
     }
 
     &:hover {
@@ -2161,6 +2170,142 @@ table {
   }
 }
 
+// 19. Recommended Section Home
+// -----------
+
+.home-page {
+  .push {
+    display: none;
+  }
+}
+
+.section-recommended {
+  padding: $line-height * 2 0;
+
+  h2 {
+    margin-bottom: $line-height * 2;
+  }
+
+  .debates,
+  .proposals,
+  .budget-investments {
+
+    @include breakpoint(medium) {
+      margin-bottom: 0;
+    }
+
+    @include breakpoint(small) {
+      margin-bottom: $line-height;
+    }
+
+    .button.hollow {
+      margin-top: rem-calc(15);
+    }
+  }
+
+  .card {
+
+    .card-section {
+      padding: $line-height 0;
+      max-width: 300px;
+      margin: 0 auto;
+
+      p {
+        font-size: rem-calc(15);
+        text-align: left;
+      }
+    }
+
+    .orbit {
+      height: 300px;
+
+      .orbit-wrapper {
+        max-height: 250px;
+        overflow: hidden;
+        position: relative;
+      }
+
+      .orbit-bullets {
+        @include orbit-bullets;
+        width: 100%;
+      }
+    }
+  }
+
+  .card .orbit .orbit-wrapper .truncate {
+    background: image-url('truncate.png');
+    background-repeat: repeat-x;
+    bottom: 0;
+    height: 20px;
+    position: absolute;
+    width: 100%;
+  }
+
+  .debates-inner {
+    border-top: 4px solid $debates;
+  }
+
+  .proposals-inner {
+    border-top: 4px solid $proposals;
+  }
+
+  .budget-investments-inner {
+    border-top: 4px solid $budget;
+  }
+
+  .debates-inner,
+  .proposals-inner,
+  .budget-investments-inner {
+    background: #fff;
+    max-height: 350px;
+
+    @include breakpoint(small) {
+      max-height: 400px;
+    }
+
+    h4 {
+      margin-top: $line-height;
+      margin-bottom: 0;
+      font-size: rem-calc(18);
+      min-height: 50px;
+    }
+
+    h5 {
+      font-size: rem-calc(14);
+      text-align: left;
+    }
+  }
+
+  .carousel-image {
+
+    .card .orbit {
+      height: 480px;
+
+      .orbit-wrapper {
+        max-height: 450px;
+      }
+    }
+
+    .debates-inner,
+    .proposals-inner,
+    .budget-investments-inner {
+      max-height: 500px;
+
+      @include breakpoint(small) {
+        max-height: 600px;
+      }
+    }
+  }
+
+  .carousel-image .orbit-wrapper img {
+    display: block;
+
+    @include breakpoint(small) {
+      margin: 0 auto;
+    }
+  }
+}
+
 // 19. Documents
 .documents-list {
 
@@ -2218,6 +2363,5 @@ table {
       }
 
     }
-
   }
 }

app/assets/stylesheets/mixins.scss

@@ -1,6 +1,7 @@
 // Table of Contents
 //
 // 01. Logo
+// 02. Orbit bullets
 //
 
 // 01. Logo
@@ -31,7 +32,35 @@
   }
 }
 
+// 02. Orbit bullet
+// ----------------
+@mixin orbit-bullets {
+  @include disable-mouse-outline;
+  position: relative;
+  margin-top: $orbit-bullet-margin-top;
+  margin-bottom: $orbit-bullet-margin-bottom;
+  text-align: center;
 
+  button {
+    width: $orbit-bullet-diameter;
+    height: $orbit-bullet-diameter;
+    margin: $orbit-bullet-margin;
+
+    border-radius: 50%;
+    background-color: $orbit-bullet-background;
+
+    &:hover {
+      background-color: $orbit-bullet-background-active;
+    }
+
+    &.is-active {
+      background-color: $orbit-bullet-background-active;
+    }
+  }
+}
+
+// 02. Direct uploads
+// ------------------
 @mixin direct-uploads {
 
   .cached-image {
@@ -96,4 +125,5 @@
   .loading-bar.no-transition {
     transition: none;
   }
+
 }

app/controllers/concerns/commentable_actions.rb

@@ -4,17 +4,22 @@ module CommentableActions
   include Search
 
   def index
-    @resources = @search_terms.present? ? resource_model.search(@search_terms) : resource_model.all
-    @resources = @advanced_search_terms.present? ? @resources.filter(@advanced_search_terms) : @resources
+    @resources = resource_model.all
 
+    @resources = @current_order == "recommendations" && current_user.present? ? @resources.recommendations(current_user) : @resources.for_render
+    @resources = @resources.search(@search_terms) if @search_terms.present?
+    @resources = @advanced_search_terms.present? ? @resources.filter(@advanced_search_terms) : @resources
     @resources = @resources.tagged_with(@tag_filter) if @tag_filter
-    @resources = @resources.page(params[:page]).for_render.send("sort_by_#{@current_order}")
+
+    @resources = @resources.page(params[:page]).send("sort_by_#{@current_order}")
+
     index_customization if index_customization.present?
 
     @tag_cloud = tag_cloud
     @banners = Banner.with_active
 
     set_resource_votes(@resources)
+
     set_resources_instance
   end
 

app/controllers/debates_controller.rb

@@ -10,7 +10,7 @@ class DebatesController < ApplicationController
 
   invisible_captcha only: [:create, :update], honeypot: :subtitle
 
-  has_orders %w{hot_score confidence_score created_at relevance}, only: :index
+  has_orders ->(c) { Debate.debates_orders(c.current_user) }, only: :index
   has_orders %w{most_voted newest oldest}, only: :show
 
   load_and_authorize_resource

app/controllers/notifications_controller.rb

@@ -11,7 +11,7 @@ class NotificationsController < ApplicationController
 
   def show
     @notification = current_user.notifications.find(params[:id])
-    redirect_to url_for(@notification.linkable_resource)
+    redirect_to linkable_resource_path(@notification)
   end
 
   def mark_all_as_read
@@ -25,4 +25,13 @@ class NotificationsController < ApplicationController
       @notification.mark_as_read
     end
 
+    def linkable_resource_path(notification)
+      case notification.linkable_resource.class.name
+      when "Budget::Investment"
+        budget_investment_path @notification.linkable_resource.budget, @notification.linkable_resource
+      else
+        url_for @notification.linkable_resource
+      end
+    end
+
 end

app/controllers/proposals_controller.rb

@@ -9,7 +9,7 @@ class ProposalsController < ApplicationController
 
   invisible_captcha only: [:create, :update], honeypot: :subtitle
 
-  has_orders %w{hot_score confidence_score created_at relevance archival_date}, only: :index
+  has_orders ->(c) { Proposal.proposals_orders(c.current_user) }, only: :index
   has_orders %w{most_voted newest oldest}, only: :show
 
   load_and_authorize_resource
@@ -113,7 +113,7 @@ class ProposalsController < ApplicationController
     end
 
     def load_featured
-      return unless !@advanced_search_terms && @search_terms.blank? && @tag_filter.blank? && params[:retired].blank?
+      return unless !@advanced_search_terms && @search_terms.blank? && @tag_filter.blank? && params[:retired].blank? && @current_order != "recommendations"
       @featured_proposals = Proposal.not_archived.sort_by_confidence_score.limit(3)
       if @featured_proposals.present?
         set_featured_proposal_votes(@featured_proposals)

app/controllers/welcome_controller.rb

@@ -1,12 +1,10 @@
 class WelcomeController < ApplicationController
   skip_authorization_check
+  before_action :set_user_recommendations, only: :index, if: :current_user
 
   layout "devise", only: [:welcome, :verification]
 
   def index
-    if current_user
-      redirect_to :proposals
-    end
   end
 
   def welcome
@@ -16,4 +14,11 @@ class WelcomeController < ApplicationController
     redirect_to verification_path if signed_in?
   end
 
+  private
+
+  def set_user_recommendations
+    @recommended_debates = Debate.recommendations(current_user).sort_by_recommendations.limit(3)
+    @recommended_proposals = Proposal.recommendations(current_user).sort_by_recommendations.limit(3)
+  end
+
 end

app/helpers/debates_helper.rb

@@ -4,4 +4,12 @@ module DebatesHelper
     Debate.all.featured.count > 0
   end
 
-end
+  def empty_recommended_debates_message_text(user)
+    if user.interests.any?
+      t('debates.index.recommendations.without_results')
+    else
+      t('debates.index.recommendations.without_interests')
+    end
+  end
+
+end

app/helpers/proposals_helper.rb

@@ -32,6 +32,14 @@ module ProposalsHelper
     Proposal::RETIRE_OPTIONS.collect { |option| [ t("proposals.retire_options.#{option}"), option ] }
   end
 
+  def empty_recommended_proposals_message_text(user)
+    if user.interests.any?
+      t('proposals.index.recommendations.without_results')
+    else
+      t('proposals.index.recommendations.without_interests')
+    end
+  end
+
   def author_of_proposal?(proposal)
     author_of?(proposal, current_user)
   end
@@ -40,4 +48,4 @@ module ProposalsHelper
     current_user && proposal.editable_by?(current_user)
   end
 
-end
+end

app/helpers/welcome_helper.rb

@@ -0,0 +1,62 @@
+module WelcomeHelper
+
+  def active_class(index)
+    "is-active is-in" if index == 0
+  end
+
+  def slide_display(index)
+    "display: none;" if index > 0
+  end
+
+  def recommended_path(recommended)
+    case recommended.class.name
+    when "Debate"
+      debate_path(recommended)
+    when "Proposal"
+      proposal_path(recommended)
+    else
+      '#'
+    end
+  end
+
+  def render_recommendation_image(recommended, image_default)
+    image_path = calculate_image_path(recommended, image_default)
+    image_tag(image_path) if image_path.present?
+  end
+
+  def calculate_image_path(recommended, image_default)
+    if recommended.try(:image) && recommended.image.present? && recommended.image.attachment.exists?
+      recommended.image.attachment.send("url", :medium)
+    elsif image_default.present?
+      image_default
+    end
+  end
+
+  def calculate_carousel_size(debates, proposals, apply_offset)
+    offset = calculate_offset(debates, proposals, apply_offset)
+    centered = calculate_centered(debates, proposals)
+    "#{offset if offset} #{centered if centered}"
+  end
+
+  def calculate_centered(debates, proposals)
+    if (debates.blank? && proposals.any?) ||
+       (debates.any? && proposals.blank?)
+      centered = "medium-centered large-centered"
+    end
+  end
+
+  def calculate_offset(debates, proposals, apply_offset)
+    if (debates.any? && proposals.any?)
+      if apply_offset
+        offset = "medium-offset-2 large-offset-2"
+      else
+        offset = "end"
+      end
+    end
+  end
+
+  def highlight_background
+    (feature?("user.recommendations") && current_user) ? "highlight" : ""
+  end
+
+end

app/models/concerns/followable.rb

@@ -4,6 +4,10 @@ module Followable
   included do
     has_many :follows, as: :followable, dependent: :destroy
     has_many :followers, through: :follows, source: :user
+
+    scope :followed_by_user, -> (user){
+      joins(:follows).where("follows.user_id = ?", user.id)
+    }
   end
 
   def followed_by?(user)

app/models/debate.rb

@@ -37,14 +37,21 @@ class Debate < ActiveRecord::Base
   scope :sort_by_random,           -> { reorder("RANDOM()") }
   scope :sort_by_relevance,        -> { all }
   scope :sort_by_flags,            -> { order(flags_count: :desc, updated_at: :desc) }
+  scope :sort_by_recommendations,  -> { order(cached_votes_total: :desc) }
   scope :last_week,                -> { where("created_at >= ?", 7.days.ago)}
   scope :featured,                 -> { where("featured_at is not null")}
   scope :public_for_api,           -> { all }
+
   # Ahoy setup
   visitable # Ahoy will automatically assign visit_id on create
 
   attr_accessor :link_required
 
+  def self.recommendations(user)
+    tagged_with(user.interests, any: true).
+    where("author_id != ?", user.id)
+  end
+
   def searchable_values
     { title              => 'A',
       author.username    => 'B',
@@ -135,4 +142,9 @@ class Debate < ActiveRecord::Base
     featured_at.present?
   end
 
+  def self.debates_orders(user)
+    orders = %w{hot_score confidence_score created_at relevance}
+    orders << "recommendations" if user.present?
+    orders
+  end
 end

app/models/proposal.rb

@@ -58,14 +58,27 @@ class Proposal < ActiveRecord::Base
   scope :sort_by_relevance,        -> { all }
   scope :sort_by_flags,            -> { order(flags_count: :desc, updated_at: :desc) }
   scope :sort_by_archival_date,    -> { archived.sort_by_confidence_score }
+  scope :sort_by_recommendations,  -> { order(cached_votes_up: :desc) }
   scope :archived,                 -> { where("proposals.created_at <= ?", Setting["months_to_archive_proposals"].to_i.months.ago) }
   scope :not_archived,             -> { where("proposals.created_at > ?", Setting["months_to_archive_proposals"].to_i.months.ago) }
   scope :last_week,                -> { where("proposals.created_at >= ?", 7.days.ago)}
   scope :retired,                  -> { where.not(retired_at: nil) }
   scope :not_retired,              -> { where(retired_at: nil) }
   scope :successful,               -> { where("cached_votes_up >= ?", Proposal.votes_needed_for_success) }
+  scope :unsuccessful,             -> { where("cached_votes_up < ?", Proposal.votes_needed_for_success) }
   scope :public_for_api,           -> { all }
 
+  def self.recommendations(user)
+    tagged_with(user.interests, any: true).
+    where("author_id != ?", user.id).
+    unsuccessful.
+    not_followed_by_user(user)
+  end
+
+  def self.not_followed_by_user(user)
+    where.not(id: followed_by_user(user).pluck(:id))
+  end
+
   def to_param
     "#{id}-#{title}".parameterize
   end
@@ -185,6 +198,12 @@ class Proposal < ActiveRecord::Base
     (voters + followers).uniq
   end
 
+  def self.proposals_orders(user)
+    orders = %w{hot_score confidence_score created_at relevance archival_date}
+    orders << "recommendations" if user.present?
+    orders
+  end
+
   protected
 
     def set_responsible_name

app/models/user.rb

@@ -88,12 +88,12 @@ class User < ActiveRecord::Base
   end
 
   def debate_votes(debates)
-    voted = votes.for_debates(debates)
+    voted = votes.for_debates(Array(debates).map(&:id))
     voted.each_with_object({}) { |v, h| h[v.votable_id] = v.value }
   end
 
   def proposal_votes(proposals)
-    voted = votes.for_proposals(proposals)
+    voted = votes.for_proposals(Array(proposals).map(&:id))
     voted.each_with_object({}) { |v, h| h[v.votable_id] = v.value }
   end
 

app/views/debates/index.html.erb

@@ -54,7 +54,11 @@
         <%= link_to t("debates.index.start_debate"), new_debate_path, class: 'button expanded' %>
       </div>
 
-      <%= render @debates %>
+      <% if @debates.any? || current_user.blank? %>
+        <%= render @debates %>
+      <% else %>
+        <%= empty_recommended_debates_message_text(current_user) %>
+      <% end %>
       <%= paginate @debates %>
 
       <% unless @search_terms || @advanced_search_terms || @tag_filter %>

app/views/layouts/application.html.erb

@@ -23,7 +23,7 @@
 
     <%= setting['per_page_code_head'].try(:html_safe) %>
   </head>
-  <body>
+  <body class="<%= yield (:body_class) %>">
     <%= setting['per_page_code_body'].try(:html_safe) %>
 
     <h1 class="show-for-sr"><%= setting['org_name'] %></h1>

app/views/proposals/index.html.erb

@@ -14,13 +14,13 @@
       <div class="row">
         <div class="small-12 column">
           <% if @search_terms || @advanced_search_terms %>
-          <h2><%= t("shared.search_results") %></h2>
-          <p>
-            <%= page_entries_info @proposals %>
-            <% if !@advanced_search_terms %>
-              <%= t("proposals.index.search_results_html", count: @proposals.size, search_term: @search_terms) %>
-            <% end %>
-          <p>
+            <h2><%= t("shared.search_results") %></h2>
+            <p>
+              <%= page_entries_info @proposals %>
+              <% if !@advanced_search_terms %>
+                <%= t("proposals.index.search_results_html", count: @proposals.size, search_term: @search_terms) %>
+              <% end %>
+            <p>
           <% elsif @tag_filter %>
             <h2><%= t("shared.search_results") %></h2>
             <p>
@@ -68,7 +68,11 @@
       <% end %>
 
       <div id="proposals-list">
-        <%= render partial: 'proposals/proposal', collection: @proposals %>
+        <% if @proposals.any? || current_user.blank? %>
+          <%= render partial: 'proposals/proposal', collection: @proposals %>
+        <% else %>
+          <%= empty_recommended_proposals_message_text(current_user) %>
+        <% end %>
         <%= paginate @proposals %>
 
         <% unless @search_terms || @advanced_search_terms || @tag_filter %>

app/views/welcome/_recommended.html.erb

@@ -0,0 +1,31 @@
+<div class="small-12 column section-recommended padding">
+  <div class="row">
+
+    <h2 class="text-center"><%= t("welcome.recommended.title") %></h2>
+    <div class="small-12 column carousel-image">
+      <% if recommended_debates.any? %>
+        <% carousel_size = calculate_carousel_size(recommended_debates, recommended_proposals, true) %>
+        <%= render "recommended_carousel", recommendeds: recommended_debates,
+                                           key: "debates",
+                                           image_field: nil,
+                                           image_version: nil,
+                                           image_default: nil,
+                                           carousel_size: carousel_size,
+                                           btn_text_link: t("welcome.recommended.debates.btn_text_link"),
+                                           btn_path_link: debates_path(order: "recommendations") %>
+      <% end %>
+
+      <% if recommended_proposals.any? %>
+        <% carousel_size = calculate_carousel_size(recommended_debates, recommended_proposals, false) %>
+        <%= render "recommended_carousel", recommendeds: recommended_proposals,
+                                           key: "proposals",
+                                           image_field: :attachment,
+                                           image_version: :thumb,
+                                           image_default: nil,
+                                           carousel_size: carousel_size,
+                                           btn_text_link: t("welcome.recommended.proposals.btn_text_link"),
+                                           btn_path_link: proposals_path(order: "recommendations")  %>
+      <% end %>
+    </div>
+  </div>
+</div>

app/views/welcome/_recommended_carousel.html.erb

@@ -0,0 +1,42 @@
+<div class="small-12 medium-4 large-4 <%= carousel_size %> column text-center <%= key %> ">
+  <div class="card small-centered <%= key %>-inner">
+
+    <h4><%= t("welcome.recommended.#{key.underscore}.title") %></h4>
+
+    <div class="orbit" role="region" data-orbit data-use-m-u-i="false">
+      <div class="orbit-wrapper">
+
+        <ul class="orbit-container no-bullet" tabindex="0" >
+          <% recommendeds.each_with_index do |recommended, index| %>
+
+            <li class="orbit-slide <%= active_class(index) %>" data-slide="<%= index %>" style="position: relative; <%= slide_display(index) %>" aria-live="polite">
+              <div class="card">
+                <%= render_recommendation_image(recommended, image_default) %>
+                <div class="card-section">
+                  <%= link_to recommended_path(recommended) do %>
+                    <h5 class="truncate-horizontal-text"><%= recommended.title %></h5>
+                  <% end %>
+                  <p><%= recommended.description %></p>
+                </div>
+              </div>
+            </li>
+
+          <% end %>
+        </ul>
+        <div class="truncate"></div>
+
+      </div>
+
+      <nav class="orbit-bullets">
+        <% recommendeds.each_with_index do |recommended, index| %>
+          <button data-slide="<%= index %>" class="<%= active_class(index) %>">
+            <span class="show-for-sr">Second slide details.</span>
+          </button>
+        <% end %>
+      </nav>
+
+    </div>
+
+  </div>
+  <%= link_to btn_text_link, btn_path_link, class: 'button hollow expanded' %>
+</div>

app/views/welcome/index.html.erb

@@ -1,3 +1,5 @@
+<% content_for :body_class, "home-page" %>
+
 <% content_for :canonical do %>
   <%= render "shared/canonical", href: root_url %>
 <% end %>
@@ -16,37 +18,35 @@
   </div>
 </div>
 
+<% if feature?("user.recommendations") && (@recommended_debates.present? || @recommended_proposals.present?) %>
+  <%= render "recommended",
+              recommended_debates: @recommended_debates,
+              recommended_proposals: @recommended_proposals %>
+<% end %>
+
 <% cache [locale_and_user_status, @featured_debates, @featured_proposals, 'featured'] do %>
   <main>
-    <div class="row">
-      <div class="small-12 medium-6 column">
-        <p>
-          <span class="lead"><strong><%= t("welcome.debates.title") %></strong></span><br>
-          <%= t("welcome.debates.description") %>
-        </p>
 
-      </div>
-      <div class="small-12 medium-6 column">
-        <p>
-          <span class="lead"><strong><%= t("welcome.proposal.title") %></strong></span><br>
-          <%= t("welcome.proposal.description") %>
-        </p>
+    <div class="small-12 column text-center <%= highlight_background %>">
+      <div class="row margin padding">
+        <div class="small-12 medium-3 column">
+          <h2><%= t("welcome.debates.title") %></h2>
+          <p><%= t("welcome.debates.description") %></p>
+        </div>
+        <div class="small-12 medium-3 column">
+          <h2><%= t("welcome.proposal.title") %></h2>
+          <p><%= t("welcome.proposal.description") %></p>
+        </div>
+        <div class="small-12 medium-3 column">
+          <h2><%= t("welcome.decide.title") %></h2>
+          <p><%= t("welcome.decide.description") %></p>
+        </div>
+        <div class="small-12 medium-3 column">
+          <h2><%= t("welcome.do.title") %></h2>
+          <p><%= t("welcome.do.description") %></p>
+        </div>
       </div>
     </div>
 
-    <div class="row margin-top">
-      <div class="small-12 medium-6 column">
-        <p>
-          <span class="lead"><strong><%= t("welcome.decide.title") %></strong></span><br>
-          <%= t("welcome.decide.description") %>
-        </p>
-      </div>
-      <div class="small-12 medium-6 column">
-        <p>
-          <span class="lead"><strong><%= t("welcome.do.title") %></strong></span><br>
-          <%= t("welcome.do.description") %>
-        </p>
-      </div>
-    </div>
   </main>
 <% end %>