show traders on items#show

app/controllers/closet_hangers_controller.rb

@@ -37,7 +37,7 @@ class ClosetHangersController < ApplicationController
       @unlisted_closet_hangers_by_owned = {}
     end
 
-    if @public_perspective
+    if @public_perspective && user_signed_in?
       items = []
       @closet_lists_by_owned.each do |owned, lists|
         lists.each do |list|

app/controllers/items_controller.rb

@@ -39,8 +39,14 @@ class ItemsController < ApplicationController
 
   def show
     @item = Item.find params[:id]
+
+    @trading_closet_hangers_by_owned = {
+      true => @item.closet_hangers.owned_trading.newest.includes(:user),
+      false => @item.closet_hangers.wanted_trading.newest.includes(:user)
+    }
+
     if user_signed_in?
-      @hangers = [true, false].map do |owned|
+      @current_user_hangers = [true, false].map do |owned|
         hanger = current_user.closet_hangers.find_or_initialize_by_item_id_and_owned(@item.id, owned)
         hanger.quantity ||= 1
         hanger

app/helpers/items_helper.rb

@@ -82,6 +82,12 @@ module ItemsHelper
     sprintf(NeoitemsURLFormat, CGI::escape(item.name))
   end
 
+  def render_trading_closet_hangers(owned)
+    @trading_closet_hangers_by_owned[owned].map do |hanger|
+      link_to hanger.user.name, user_closet_hangers_path(hanger.user)
+    end.to_sentence.html_safe
+  end
+
   def your_items_path
     user_signed_in? ? user_closet_hangers_path(current_user) : login_path
   end

app/models/closet_hanger.rb

@@ -12,9 +12,20 @@ class ClosetHanger < ActiveRecord::Base
   validate :list_belongs_to_user
 
   scope :alphabetical_by_item_name, joins(:item).order(Item.arel_table[:name])
+  scope :newest, order(arel_table[:created_at].desc)
   scope :owned_before_wanted, order(arel_table[:owned].desc)
   scope :unlisted, where(:list_id => nil)
 
+  {:owned => true, :wanted => false}.each do |name, owned|
+    scope "#{name}_trading", joins(:user).includes(:list).
+      where(:owned => owned).
+      where((
+        User.arel_table["#{name}_closet_hangers_visibility"].gteq(ClosetVisibility[:trading].id)
+        ).or(
+        ClosetList.arel_table[:visibility].gteq(ClosetVisibility[:trading].id)
+      ))
+  end
+
   before_validation :set_owned_by_list
 
   def verb(subject=:someone)

app/stylesheets/items/_show.sass

@@ -50,8 +50,51 @@ body.items-show
     font:
       family: $text-font
       size: 85%
-    p:first-child
+    margin-bottom: 1em
-      margin-bottom: .25em
+
+    p
+      display: inline
+
+      &:first-child
+        margin-right: 1em
+  #trade-hangers
+    font-size: 85%
+    text-align: left
+
+    p
+      position: relative
+
+      &:first-child
+        margin-bottom: .5em
+
+      &.overflows
+        .toggle
+          display: block
+
+      &.showing-more
+        .toggle
+          .less
+            display: block
+
+          .more
+            display: none
+
+    .toggle
+      background: white
+      bottom: 0
+      cursor: pointer
+      display: none
+      font-family: $main-font
+      padding: 0 1em
+      position: absolute
+      right: 0
+
+      &:hover
+        text-decoration: underline
+
+      .less
+        display: none
+
   #item-preview-header
     margin-top: 3em
     h3, a
@@ -67,6 +110,7 @@ body.items-show
     border: 1px solid $module-border-color
     float: right
     font-size: 85%
+    margin-left: 1em
     padding: 1em
     width: 21em
 
@@ -86,3 +130,12 @@ body.items-show
     input[type=number]
       width: 4em
 
+  &.js
+    #trade-hangers
+      p
+        max-height: 3em
+        overflow: hidden
+
+        &.showing-more
+          max-height: none
+

app/views/items/show.html.haml

@@ -11,12 +11,12 @@
         == Rarity: #{@item.rarity_index} (#{@item.rarity})
       = link_to 'NeoItems', neoitems_url_for(@item), :class => 'button'
 
-  - if @hangers
+  - if @current_user_hangers
     #closet-hangers
       %header
         Track this in
         = link_to 'Your Items', user_closet_hangers_path(current_user)
-      - @hangers.each do |hanger|
+      - @current_user_hangers.each do |hanger|
         = form_for(hanger, :url => user_item_closet_hanger_path(current_user, @item)) do |f|
           - if hanger.new_record?
             = f.hidden_field :quantity
@@ -43,6 +43,37 @@
       - else
         = list_zones @item.restricted_zones
 
+  #trade-hangers
+    - [true, false].each do |owned|
+      %p
+        - unless @trading_closet_hangers_by_owned[owned].empty?
+          %strong
+            = pluralize @trading_closet_hangers_by_owned[owned].size, 'user'
+            - if owned
+              - if @trading_closet_hangers_by_owned[owned].size == 1
+                has
+              - else
+                have
+              this item up for trade:
+            - else
+              - if @trading_closet_hangers_by_owned[owned].size == 1
+                wants
+              - else
+                want
+              this item:
+          = render_trading_closet_hangers(owned)
+        - else
+          %strong
+            We don't know anyone who
+            - if owned
+              has this item up for trade.
+            - else
+              wants this item.
+        %span.toggle
+          %span.more more
+          %span.less less
+
+
   #item-preview-header
     %h3 Preview
     %a#customize-more.button{:href => '/'} Customize more

public/javascripts/items/show.js

@@ -260,3 +260,23 @@ window.MainWardrobe = {View: {Outfit: {setFlashIsReady: previewSWFIsReady}}}
 
 var SWFLog = $.noop;
 
+
+/*
+
+  Trade hangers
+
+*/
+
+$(document.body).addClass('js');
+
+$('#trade-hangers p').wrapInner('<div/>').each(function () {
+  var el = $(this);
+  if(el.height() < el.children().height()) {
+    el.addClass('overflows');
+  }
+});
+
+$('#trade-hangers .toggle').click(function () {
+  $(this).closest('p').toggleClass('showing-more');
+});
+

public/stylesheets/compiled/screen.css

@@ -1568,16 +1568,65 @@ body.items-show #item-preview-swf {
 body.items-show #item-zones {
   font-family: "Droid Serif", Georgia, "Times New Roman", Times, serif;
   font-size: 85%;
-}
+  margin-bottom: 1em;
-/* line 53, ../../../app/stylesheets/items/_show.sass */
-body.items-show #item-zones p:first-child {
-  margin-bottom: 0.25em;
 }
 /* line 55, ../../../app/stylesheets/items/_show.sass */
+body.items-show #item-zones p {
+  display: inline;
+}
+/* line 58, ../../../app/stylesheets/items/_show.sass */
+body.items-show #item-zones p:first-child {
+  margin-right: 1em;
+}
+/* line 60, ../../../app/stylesheets/items/_show.sass */
+body.items-show #trade-hangers {
+  font-size: 85%;
+  text-align: left;
+}
+/* line 64, ../../../app/stylesheets/items/_show.sass */
+body.items-show #trade-hangers p {
+  position: relative;
+}
+/* line 67, ../../../app/stylesheets/items/_show.sass */
+body.items-show #trade-hangers p:first-child {
+  margin-bottom: 0.5em;
+}
+/* line 71, ../../../app/stylesheets/items/_show.sass */
+body.items-show #trade-hangers p.overflows .toggle {
+  display: block;
+}
+/* line 76, ../../../app/stylesheets/items/_show.sass */
+body.items-show #trade-hangers p.showing-more .toggle .less {
+  display: block;
+}
+/* line 79, ../../../app/stylesheets/items/_show.sass */
+body.items-show #trade-hangers p.showing-more .toggle .more {
+  display: none;
+}
+/* line 82, ../../../app/stylesheets/items/_show.sass */
+body.items-show #trade-hangers .toggle {
+  background: white;
+  bottom: 0;
+  cursor: pointer;
+  display: none;
+  font-family: "Droid Sans", Helvetica, Arial, Verdana, sans-serif;
+  padding: 0 1em;
+  position: absolute;
+  right: 0;
+}
+/* line 92, ../../../app/stylesheets/items/_show.sass */
+body.items-show #trade-hangers .toggle:hover {
+  text-decoration: underline;
+}
+/* line 95, ../../../app/stylesheets/items/_show.sass */
+body.items-show #trade-hangers .toggle .less {
+  display: none;
+}
+/* line 98, ../../../app/stylesheets/items/_show.sass */
 body.items-show #item-preview-header {
   margin-top: 3em;
 }
-/* line 57, ../../../app/stylesheets/items/_show.sass */
+/* line 100, ../../../app/stylesheets/items/_show.sass */
 body.items-show #item-preview-header h3, body.items-show #item-preview-header a {
   display: -moz-inline-box;
   -moz-box-orient: vertical;
@@ -1586,45 +1635,55 @@ body.items-show #item-preview-header h3, body.items-show #item-preview-header a
   *display: inline;
   *vertical-align: auto;
 }
-/* line 59, ../../../app/stylesheets/items/_show.sass */
+/* line 102, ../../../app/stylesheets/items/_show.sass */
 body.items-show #item-preview-header a {
   font-size: 85%;
   margin: -1.5em 0 0 1em;
 }
-/* line 62, ../../../app/stylesheets/items/_show.sass */
+/* line 105, ../../../app/stylesheets/items/_show.sass */
 body.items-show .nc-icon {
   height: 16px;
   width: 16px;
 }
-/* line 66, ../../../app/stylesheets/items/_show.sass */
+/* line 109, ../../../app/stylesheets/items/_show.sass */
 body.items-show #closet-hangers {
   border: 1px solid #006600;
   float: right;
   font-size: 85%;
+  margin-left: 1em;
   padding: 1em;
   width: 21em;
 }
-/* line 73, ../../../app/stylesheets/items/_show.sass */
+/* line 117, ../../../app/stylesheets/items/_show.sass */
 body.items-show #closet-hangers label, body.items-show #closet-hangers header {
   display: block;
   font-weight: bold;
 }
-/* line 77, ../../../app/stylesheets/items/_show.sass */
+/* line 121, ../../../app/stylesheets/items/_show.sass */
 body.items-show #closet-hangers header {
   font-size: 125%;
 }
-/* line 80, ../../../app/stylesheets/items/_show.sass */
+/* line 124, ../../../app/stylesheets/items/_show.sass */
 body.items-show #closet-hangers form {
   padding: 0.5em 0;
 }
-/* line 83, ../../../app/stylesheets/items/_show.sass */
+/* line 127, ../../../app/stylesheets/items/_show.sass */
 body.items-show #closet-hangers select {
   width: 9em;
 }
-/* line 86, ../../../app/stylesheets/items/_show.sass */
+/* line 130, ../../../app/stylesheets/items/_show.sass */
 body.items-show #closet-hangers input[type=number] {
   width: 4em;
 }
+/* line 135, ../../../app/stylesheets/items/_show.sass */
+body.items-show.js #trade-hangers p {
+  max-height: 3em;
+  overflow: hidden;
+}
+/* line 139, ../../../app/stylesheets/items/_show.sass */
+body.items-show.js #trade-hangers p.showing-more {
+  max-height: none;
+}
 
 @import url(../shared/jquery.jgrowl.css);
 /* line 113, ../../../app/stylesheets/outfits/_edit.sass */