modeling i18n

app/assets/javascripts/modeling.js.jsx

@@ -1,6 +1,6 @@
 /** @jsx React.DOM */
 
-(function($) {
+(function($, I18n) {
   // Console-polyfill. MIT license.
   // https://github.com/paulmillr/console-polyfill
   // Make it safe to do console.log() always.
@@ -120,11 +120,10 @@
         var equippedClosetId = equippedByZone[zoneId].closet_obj_id;
         var equippedObjectId = closetItems[equippedClosetId].obj_info_id;
         if (itemsById.hasOwnProperty(equippedObjectId)) {
-          // TODO: i18n title
           customization.statusByItemId[equippedObjectId] = "success";
           itemsById[equippedObjectId].el.find("span[data-body-id=" +
             customization.custom_pet.body_id + "]").addClass("modeled")
-            .attr("title", "You just finished modeling this—thanks so much!");
+            .attr("title", I18n.modeledBodyTitle);
         }
       });
       this._customizationsByPetId[customization.custom_pet.name] = customization;
@@ -294,18 +293,10 @@
       }
       var itemName = this.props.item.name;
       var imageSrc = "http://pets.neopets.com/cpn/" + petName + "/1/1.png";
-      // TODO: i18n
-      var title = "Submit " + petName + " as a model, especially if they're " +
-                  "wearing the " + itemName + "!";
-      if (status === "success") {
-        var statusMessage = "Thanks! <3";
-      } else if (status === "unworn") {
-        var statusMessage = "Not wearing this item.";
-      } else if (status === "error") {
-        var statusMessage = "Couldn't load. Try again?";
-      } else {
-        var statusMessage ="";
-      }
+      var title = I18n.pet.title
+        .replace(/%{pet}/g, petName)
+        .replace(/%{item}/g, itemName);
+      var statusMessage = I18n.pet.status[status] || "";
       return <li data-status={status}><button onClick={this.handleClick} title={title} disabled={disabled}>
         <img src={imageSrc} />
         <div>
@@ -330,10 +321,10 @@
       return <div>
         <ul>{this.state.usernames.slice(0).sort().map(buildUsernameItem)}</ul>
           <form onSubmit={this.handleSubmit}>
-            <input type="text" placeholder="neopets username"
+            <input type="text" placeholder={I18n.neopetsUsernamesForm.label}
                    onChange={this.handleChange}
                    value={this.state.newUsername} />
-            <button type="submit">add</button></form></div>;
+            <button type="submit">{I18n.neopetsUsernamesForm.submit}</button></form></div>;
     },
     handleChange: function(e) {
       this.setState({newUsername: e.target.value});
@@ -358,4 +349,4 @@
   });
 
   Modeling.init($);
-})(jQuery);
+})(jQuery, ModelingI18n);

app/helpers/outfits_helper.rb

@@ -114,5 +114,16 @@ module OutfitsHelper
     options = {:spellcheck => false, :id => nil}.merge(options)
     text_field_tag 'name', nil, options
   end
+
+  def modeling_i18n_tag
+    localized_cache('modeling_i18n') do
+      modeling_i18n = {
+        modeledBodyTitle: t('.newest_items.modeled.body_title'),
+        pet: t('.newest_items.modeled.pet'),
+        neopetsUsernamesForm: t('.newest_items.modeled.neopets_usernames_form')
+      }
+      haml_concat javascript_tag("var ModelingI18n = #{modeling_i18n.to_json};")
+    end
+  end
 end
 

app/views/outfits/new.html.haml

@@ -117,4 +117,5 @@
 
 - content_for :javascripts do
   = include_javascript_libraries :jquery20, :jquery_tmpl
+  = modeling_i18n_tag
   = javascript_include_tag 'ajax_auth', 'react', 'jquery.timeago', 'pet_query', 'outfits/new', 'modeling'

config/locales/en-MEEP.yml

@@ -658,6 +658,16 @@ en-MEEP:
               last_word_connector: '! meep '
         modeled:
           header: These items have already been meeped—meep for your help!
+          body_title: You just finished meeping this—meep so much!
+          neopets_usernames_form:
+            label: meepits username
+            submit: meep
+          pet:
+            status:
+              success: Meep! <3
+              unworn: Not meeping this item.
+              error: Couldn't load. Meep again?
+            title: Meep %{pet} as a model, especially if they're meeping the %{item}!
       pet_query:
         notice_html:
           Thanks for meeping us <strong>%{pet_name}</strong>.

config/locales/en.yml

@@ -713,6 +713,16 @@ en:
               last_word_connector: ', or '
         modeled:
           header: These items have already been modeled—thanks for your help!
+          body_title: You just finished modeling this—thanks so much!
+          neopets_usernames_form:
+            label: neopets username
+            submit: add
+          pet:
+            status:
+              success: Thanks! <3
+              unworn: Not wearing this item.
+              error: Couldn't load. Try again?
+            title: Submit %{pet} as a model, especially if they're wearing the %{item}!
       pet_query:
         notice_html:
           Thanks for showing us <strong>%{pet_name}</strong>.