diff --git a/app/assets/javascripts/modeling.js.jsx b/app/assets/javascripts/modeling.js.jsx index 38fff43f..a4b0029c 100644 --- a/app/assets/javascripts/modeling.js.jsx +++ b/app/assets/javascripts/modeling.js.jsx @@ -16,7 +16,7 @@ while (method = methods.pop()) con[method] = con[method] || dummy; })(window.console = window.console || {}); -(function() { +(function($) { var Neopia = { User: { get: function(id) { @@ -49,18 +49,35 @@ }; var Modeling = { - _modelForItemComponents: [], _customizationsByPetId: {}, + _customizations: [], + _items: [], _addCustomization: function(customization) { this._customizationsByPetId[customization.name] = customization; + this._customizations = this._buildCustomizations(); this._update(); }, - _getCustomizations: function() { + _buildCustomizations: function() { var modelCustomizationsByPetId = this._customizationsByPetId; return Object.keys(modelCustomizationsByPetId).map(function(petId) { return modelCustomizationsByPetId[petId]; }); }, + _createItems: function($) { + this._items = $('#newest-unmodeled-items li').map(function() { + var el = $(this); + return { + component: React.renderComponent(, + el.find('.models').get(0)), + el: el, + id: el.attr('data-item-id'), + missingBodyIdsPresenceMap: el.find('span[data-body-id]').toArray().reduce(function(map, node) { + map[$(node).attr('data-body-id')] = true; + return map; + }, {}) + }; + }).toArray(); + }, _loadPetCustomization: function(neopiaPetId) { return Neopia.Customization.get(neopiaPetId) .done(this._addCustomization.bind(this)); @@ -77,20 +94,20 @@ return neopiaUserIds.map(this._loadUserCustomizations.bind(this)); }, _update: function() { - var state = { - customizations: this._getCustomizations() - }; - this._modelForItemComponents.forEach(function(c) { - c.setState(state); + var customizations = this._customizations; + this._items.forEach(function(item) { + var filteredCustomizations = customizations.filter(function(c) { + return item.missingBodyIdsPresenceMap[c.body_id]; + }); + item.component.setState({customizations: filteredCustomizations}); }); }, - init: function() { + init: function($) { Neopia.init(); - this._modelForItemComponents = $('#newest-unmodeled-items li').map(function() { - return React.renderComponent(, - $(this).find('.models').get(0)); - }).toArray(); - var users = ["borovan", "donna"]; + this._createItems($); + // TODO: use user prefs, silly! + var search = document.location.search; + var users = search.indexOf('=') >= 0 ? search.split('=')[1].split(',') : ''; this._loadManyUsersCustomizations(users); } }; @@ -119,12 +136,14 @@ render: function() { var petName = this.props.customization.name; var imageSrc = "http://pets.neopets.com/cpn/" + petName + "/1/1.png"; - return
  • ; } }); - Modeling.init(); -})(); + Modeling.init($); +})(jQuery); diff --git a/app/views/outfits/new.html.haml b/app/views/outfits/new.html.haml index f706ca3a..7ed53a58 100644 --- a/app/views/outfits/new.html.haml +++ b/app/views/outfits/new.html.haml @@ -80,7 +80,7 @@ %ul#newest-unmodeled-items - @newest_unmodeled_items.each do |item| - localized_cache "items/#{item.id} modeling_progress updated_at=#{item.updated_at.to_i}" do - %li + %li{'data-item-id' => item.id} = link_to image_tag(item.thumbnail_url), item, :class => 'image-link' = link_to item, :class => 'header' do %h2= item.name