closet hangers index uses neopets connections dropdown

app/assets/javascripts/closet_hangers/index.js

@@ -455,24 +455,15 @@
   */
 
   var contactEl = $('#closet-hangers-contact');
-  var editContactLink = $('.edit-contact-link');
   var contactForm = contactEl.children('form');
-  var cancelContactLink = $('#cancel-contact-link');
+  var contactField = contactForm.children('select');
-  var contactFormUsername = contactForm.children('input[type=text]');
-  var editContactLinkUsername = $('#contact-link-has-value span');
 
-  function closeContactForm() {
+  var contactAddOption = $('<option/>',
-    contactEl.removeClass('editing');
+    {text: contactField.attr('data-new-text'), value: -1});
-  }
+  contactAddOption.appendTo(contactField);
+  var currentUserId = $('meta[name=current-user-id').attr('content');
 
-  editContactLink.click(function () {
+  function submitContactForm() {
-    contactEl.addClass('editing');
-    contactFormUsername.focus();
-  });
-
-  cancelContactLink.click(closeContactForm);
-
-  contactForm.submit(function (e) {
     var data = contactForm.serialize();
     contactForm.disableForms();
     $.ajax({
@@ -483,21 +474,33 @@
       complete: function () {
         contactForm.enableForms();
       },
-      success: function () {
-        var newName = contactFormUsername.val();
-        if(newName.length > 0) {
-          editContactLink.addClass('has-value');
-          editContactLinkUsername.text(newName);
-        } else {
-          editContactLink.removeClass('has-value');
-        }
-        closeContactForm();
-      },
       error: function (xhr) {
         handleSaveError(xhr, 'saving Neopets username');
       }
     });
-    e.preventDefault();
+  }
+
+  contactField.change(function(e) {
+    if (contactField.val() < 0) {
+      var newUsername = $.trim(prompt(contactField.attr('data-new-prompt'), ''));
+      if (newUsername) {
+        $.ajax({
+          url: '/user/' + currentUserId + '/neopets-connections',
+          type: 'POST',
+          data: {neopets_connection: {neopets_username: newUsername}},
+          dataType: 'json',
+          success: function(connection) {
+            var newOption = $('<option/>', {text: newUsername,
+              value: connection.id})
+            newOption.insertBefore(contactAddOption);
+            contactField.val(connection.id);
+            submitContactForm();
+          }
+        });
+      }
+    } else {
+      submitContactForm();
+    }
   });
 
   /*

app/assets/javascripts/modeling.js.jsx

@@ -73,7 +73,7 @@
         },
         removeNeopetsUsername: function(username) {
           return $.ajax({
-            url: '/user/' + currentUserId + '/neopets-connections/' + username,
+            url: '/user/' + currentUserId + '/neopets-connections/' + encodeURIComponent(username),
             type: 'POST',
             data: {_method: 'DELETE'}
           });

app/assets/stylesheets/closet_hangers/_index.sass

@@ -30,21 +30,18 @@ body.closet_hangers-index
     margin-left: 2em
     min-height: image-height("neomail.png")
 
-    a, > span
+    a
       +hover-link
+      color: inherit
+
+    a, > form
       background:
         image: image-url("neomail.png")
         position: left center
         repeat: no-repeat
-      color: inherit
-      float: left
-      height: 100%
       padding-left: image-width("neomail.png") + 4px
 
-    > span
+    select
-      background-image: image-url("neomail_edit.png")
-
-    input[type=text]
       width: 10em
 
     label
@@ -53,34 +50,6 @@ body.closet_hangers-index
 
       &:after
         content: ":"
-
-  #edit-contact-link-to-replace-form, #cancel-contact-link
-    display: none
-
-  .edit-contact-link, #cancel-contact-link
-    cursor: pointer
-    text-decoration: underline
-
-    &:hover
-      text-decoration: none
-
-  #edit-contact-link-to-replace-form
-    #contact-link-has-value
-      display: none
-
-    #contact-link-no-value
-      display: inline
-
-    &.has-value
-      #contact-link-has-value
-        display: inline
-
-      #contact-link-no-value
-        display: none
-
-  #cancel-contact-link
-    margin-left: 1em
-
   #toggle-help, #toggle-compare
     +awesome-button
     cursor: pointer
@@ -361,19 +330,9 @@ body.closet_hangers-index
               content: "…"
 
       #closet-hangers-contact
-        form
+        input[type=submit]
           display: none
 
-        .edit-contact-link, #cancel-contact-link
-          display: inline
-
-        &.editing
-          form
-            display: block
-
-          .edit-contact-link
-            display: none
-
       .closet-hangers-group
         header
           .show, .hide

app/controllers/neopets_connections_controller.rb

@@ -3,9 +3,9 @@ class NeopetsConnectionsController < ApplicationController
     connection = authorized_user.neopets_connections.build
     connection.neopets_username = params[:neopets_connection][:neopets_username]
     if connection.save
-      render text: 'success'
+      render json: connection
     else
-      render text: 'failure'
+      render json: {error: 'failure'}, status: :internal_server_error
     end
   end
 
@@ -13,12 +13,12 @@ class NeopetsConnectionsController < ApplicationController
     connection = authorized_user.neopets_connections.find_by_neopets_username(params[:id])
     if connection
       if connection.destroy
-        render text: 'success'
+        render json: connection
       else
-        render text: 'failure'
+        render json: {error: 'failure'}, status: :internal_server_error
       end
     else
-      render text: 'not found'
+      render json: {error: 'not found'}, status: :not_found
     end
   end
 

app/helpers/closet_hangers_helper.rb

@@ -12,8 +12,8 @@ module ClosetHangersHelper
     end
   end
 
-  def send_neomail_url(user)
+  def send_neomail_url(neopets_username)
-    "http://www.neopets.com/neomessages.phtml?type=send&recipient=#{CGI.escape @user.neopets_username}"
+    "http://www.neopets.com/neomessages.phtml?type=send&recipient=#{CGI.escape neopets_username}"
   end
 
   def hangers_group_visibility_field_name(owned)

app/models/user.rb

@@ -11,12 +11,14 @@ class User < ActiveRecord::Base
   has_many :neopets_connections
   has_many :outfits
 
+  belongs_to :contact_neopets_connection, class_name: 'NeopetsConnection'
+
   scope :top_contributors, order('points DESC').where('points > 0')
 
   devise :rememberable
 
-  attr_accessible :neopets_username, :owned_closet_hangers_visibility,
+  attr_accessible :owned_closet_hangers_visibility,
-    :wanted_closet_hangers_visibility
+    :wanted_closet_hangers_visibility, :contact_neopets_connection_id
 
   def admin?
     name == 'matchu' # you know that's right.
@@ -94,6 +96,14 @@ class User < ActiveRecord::Base
     neopets_connections.map(&:neopets_username)
   end
 
+  def contact_neopets_username?
+    contact_neopets_connection.present?
+  end
+
+  def contact_neopets_username
+    contact_neopets_connection.neopets_username
+  end
+
   def self.find_or_create_from_remote_auth_data(user_data)
     user = find_or_initialize_by_remote_id_and_auth_server_id(
       user_data['id'],

app/views/closet_hangers/index.html.haml

@@ -16,20 +16,14 @@
 - content_for :before_flashes do
   #closet-hangers-contact
     - if public_perspective?
-      - if @user.neopets_username?
+      - if @user.contact_neopets_username?
-        = link_to t('.send_neomail', :neopets_username => @user.neopets_username),
+        = link_to t('.send_neomail', neopets_username: @user.contact_neopets_username),
-                  send_neomail_url(@user)
+                  send_neomail_url(@user.contact_neopets_username)
     - else
-      %span#edit-contact-link-to-replace-form.edit-contact-link{:class => @user.neopets_username? ? 'has-value' : nil}
-        %span#contact-link-no-value= t '.neopets_username.add'
-        %span#contact-link-has-value
-          = t '.neopets_username.edit',
-              :neopets_username => @user.neopets_username
       = form_for @user do |f|
-        = f.label :neopets_username
+        = f.label :contact_neopets_connection_id
-        = f.text_field :neopets_username
+        = f.collection_select :contact_neopets_connection_id, @user.neopets_connections, :id, :neopets_username, {include_blank: true}, 'data-new-text' => t('.neopets_username.new'), 'data-new-prompt' => t('.neopets_username.prompt')
         = f.submit t('.neopets_username.submit')
-        %span#cancel-contact-link= t('.neopets_username.cancel')
 
 - unless public_perspective?
   %noscript

config/locales/en-MEEP.yml

@@ -13,7 +13,7 @@ en-MEEP:
         description: Descreeption
       
       user:
-        neopets_username: Neopets usermeep
+        contact_neopets_connection_id: Meep Neomail to
   
   layouts:
     application:

config/locales/en.yml

@@ -13,7 +13,7 @@ en:
         description: Description
       
       user:
-        neopets_username: Neopets username
+        contact_neopets_connection_id: Send Neomail to
   
   layouts:
     application:
@@ -105,10 +105,9 @@ en:
       item_search_submit: Search
       send_neomail: Neomail %{neopets_username}
       neopets_username:
-        add: Add your Neopets username
+        new: 'Add username…'
-        edit: Edit "Neomail %{neopets_username}"
+        prompt: 'What Neopets username should we add?'
         submit: Save
-        cancel: Cancel
       public_url_label: "Public URL:"
       import_from:
         closet: Import from closet

config/locales/es.yml

@@ -10,8 +10,6 @@ es:
       closet_list:
         name: Nombre
         description: Descripción
-      user:
-        neopets_username: Nombre en Neopets
   layouts:
     application:
       title_tagline: Previsualiza neopets personalizados y ropa Apta Para Usar
@@ -75,10 +73,7 @@ es:
       item_search_submit: Buscar
       send_neomail: Neomail %{neopets_username}
       neopets_username:
-        add: Añade tu nombre de usuario en Neopets
-        edit: Editar "Neomail %{neopets_username}"
         submit: Guardar
-        cancel: Cancelar
       public_url_label: "URL pública:"
       import_from:
         closet: Importar desde el ropero

config/locales/pt.yml

@@ -10,8 +10,6 @@ pt:
       closet_list:
         name: Nome
         description: Descrição
-      user:
-        neopets_username: Nome de Usuário Neopets
   layouts:
     application:
       title_tagline: Pré-visualização de artigos aplicáveis
@@ -75,10 +73,7 @@ pt:
       item_search_submit: Vai!
       send_neomail: Neomail %{neopets_username}
       neopets_username:
-        add: Adicionar seu Nome de Usuário do Neopets
-        edit: Editar "Neomail %{neopets_username}"
         submit: Salvar
-        cancel: Cancelar
       public_url_label: "URL Pública"
       import_from:
         closet: Importar do Armário

db/migrate/20140119040646_add_contact_neopets_connection_id_to_users.rb

@@ -0,0 +1,12 @@
+class AddContactNeopetsConnectionIdToUsers < ActiveRecord::Migration
+  def change
+    add_column :users, :contact_neopets_connection_id, :integer
+
+    # As it happens, this migration ran immediately after the previous one, so
+    # each user with a Neopets connection only had one: their contact.
+    NeopetsConnection.includes(:user).find_each do |connection|
+      connection.user.contact_neopets_connection = connection
+      connection.user.save!
+    end
+  end
+end

db/schema.rb

@@ -11,7 +11,7 @@
 #
 # It's strongly recommended to check this file into your version control system.
 
-ActiveRecord::Schema.define(:version => 20140117171729) do
+ActiveRecord::Schema.define(:version => 20140119040646) do
 
   create_table "auth_servers", :force => true do |t|
     t.string "short_name", :limit => 10,       :null => false
@@ -328,6 +328,7 @@ ActiveRecord::Schema.define(:version => 20140117171729) do
     t.text     "closet_description",                                                :null => false
     t.integer  "owned_closet_hangers_visibility",                :default => 1,     :null => false
     t.integer  "wanted_closet_hangers_visibility",               :default => 1,     :null => false
+    t.integer  "contact_neopets_connection_id"
   end
 
   create_table "zone_translations", :force => true do |t|