forked from OpenNeo/impress
basic modeling buttons
no behavior yet, nor are they filtered
This commit is contained in:
parent
99b2acd419
commit
fd106d7dba
11 changed files with 188 additions and 6 deletions
2
Gemfile
2
Gemfile
|
@ -64,6 +64,8 @@ gem "rails-i18n"
|
|||
|
||||
gem 'rack-attack', '~> 2.2.0'
|
||||
|
||||
gem 'react-rails', '~> 0.8.0.0'
|
||||
|
||||
# Needed for the new asset pipeline
|
||||
group :assets do
|
||||
|
||||
|
|
|
@ -222,6 +222,11 @@ GEM
|
|||
rdiscount (1.6.8)
|
||||
rdoc (3.12.2)
|
||||
json (~> 1.4)
|
||||
react-rails (0.8.0.0)
|
||||
execjs
|
||||
rails (>= 3.1)
|
||||
react-source (= 0.8.0)
|
||||
react-source (0.8.0)
|
||||
redis (3.0.3)
|
||||
redis-namespace (1.2.1)
|
||||
redis (~> 3.0.0)
|
||||
|
@ -333,6 +338,7 @@ DEPENDENCIES
|
|||
rails (= 3.2.16)
|
||||
rails-i18n
|
||||
rdiscount (~> 1.6.5)
|
||||
react-rails (~> 0.8.0.0)
|
||||
resque (~> 1.23.0)
|
||||
resque-retry (~> 0.1.0)
|
||||
resque-scheduler (~> 2.0.0.d)
|
||||
|
|
130
app/assets/javascripts/modeling.js.jsx
Normal file
130
app/assets/javascripts/modeling.js.jsx
Normal file
|
@ -0,0 +1,130 @@
|
|||
/** @jsx React.DOM */
|
||||
|
||||
// Console-polyfill. MIT license.
|
||||
// https://github.com/paulmillr/console-polyfill
|
||||
// Make it safe to do console.log() always.
|
||||
(function (con) {
|
||||
'use strict';
|
||||
var prop, method;
|
||||
var empty = {};
|
||||
var dummy = function() {};
|
||||
var properties = 'memory'.split(',');
|
||||
var methods = ('assert,count,debug,dir,dirxml,error,exception,group,' +
|
||||
'groupCollapsed,groupEnd,info,log,markTimeline,profile,profileEnd,' +
|
||||
'time,timeEnd,trace,warn').split(',');
|
||||
while (prop = properties.pop()) con[prop] = con[prop] || empty;
|
||||
while (method = methods.pop()) con[method] = con[method] || dummy;
|
||||
})(window.console = window.console || {});
|
||||
|
||||
(function() {
|
||||
var Neopia = {
|
||||
User: {
|
||||
get: function(id) {
|
||||
return Neopia.getJSON("/users/" + id).then(function(response) {
|
||||
return response.users[0];
|
||||
});
|
||||
}
|
||||
},
|
||||
Customization: {
|
||||
get: function(petId) {
|
||||
return Neopia.getJSON("/pets/" + petId + "/customization").then(function(response) {
|
||||
return response.custom_pet;
|
||||
});
|
||||
}
|
||||
},
|
||||
getJSON: function(path) {
|
||||
return $.getJSON(Neopia.API_URL + path);
|
||||
},
|
||||
init: function() {
|
||||
var hostEl = $('meta[name=neopia-host]');
|
||||
if (!hostEl.length) {
|
||||
throw "missing neopia-host meta tag";
|
||||
}
|
||||
var host = hostEl.attr('content');
|
||||
if (!host) {
|
||||
throw "neopia-host meta tag exists, but is empty";
|
||||
}
|
||||
Neopia.API_URL = "http://" + host + "/api/1";
|
||||
}
|
||||
};
|
||||
|
||||
var Modeling = {
|
||||
_modelForItemComponents: [],
|
||||
_customizationsByPetId: {},
|
||||
_addCustomization: function(customization) {
|
||||
this._customizationsByPetId[customization.name] = customization;
|
||||
this._update();
|
||||
},
|
||||
_getCustomizations: function() {
|
||||
var modelCustomizationsByPetId = this._customizationsByPetId;
|
||||
return Object.keys(modelCustomizationsByPetId).map(function(petId) {
|
||||
return modelCustomizationsByPetId[petId];
|
||||
});
|
||||
},
|
||||
_loadPetCustomization: function(neopiaPetId) {
|
||||
return Neopia.Customization.get(neopiaPetId)
|
||||
.done(this._addCustomization.bind(this));
|
||||
},
|
||||
_loadManyPetsCustomizations: function(neopiaPetIds) {
|
||||
return neopiaPetIds.map(this._loadPetCustomization.bind(this));
|
||||
},
|
||||
_loadUserCustomizations: function(neopiaUserId) {
|
||||
return Neopia.User.get(neopiaUserId).then(function(neopiaUser) {
|
||||
return neopiaUser.links.pets;
|
||||
}).then(this._loadManyPetsCustomizations.bind(this));
|
||||
},
|
||||
_loadManyUsersCustomizations: function(neopiaUserIds) {
|
||||
return neopiaUserIds.map(this._loadUserCustomizations.bind(this));
|
||||
},
|
||||
_update: function() {
|
||||
var state = {
|
||||
customizations: this._getCustomizations()
|
||||
};
|
||||
this._modelForItemComponents.forEach(function(c) {
|
||||
c.setState(state);
|
||||
});
|
||||
},
|
||||
init: function() {
|
||||
Neopia.init();
|
||||
this._modelForItemComponents = $('#newest-unmodeled-items li').map(function() {
|
||||
return React.renderComponent(<ModelForItem />,
|
||||
$(this).find('.models').get(0));
|
||||
}).toArray();
|
||||
var users = ["borovan", "donna"];
|
||||
this._loadManyUsersCustomizations(users);
|
||||
}
|
||||
};
|
||||
|
||||
var ModelForItem = React.createClass({
|
||||
getInitialState: function() {
|
||||
return {customizations: []};
|
||||
},
|
||||
render: function() {
|
||||
function createModelPet(customization) {
|
||||
return <ModelPet customization={customization}
|
||||
key={customization.name} />;
|
||||
}
|
||||
var sortedCustomizations = this.state.customizations.sort(function(a, b) {
|
||||
var aName = a.name.toLowerCase();
|
||||
var bName = b.name.toLowerCase();
|
||||
if (aName < bName) return -1;
|
||||
if (aName > bName) return 1;
|
||||
return 0;
|
||||
});
|
||||
return <ul>{sortedCustomizations.map(createModelPet)}</ul>;
|
||||
}
|
||||
});
|
||||
|
||||
var ModelPet = React.createClass({
|
||||
render: function() {
|
||||
var petName = this.props.customization.name;
|
||||
var imageSrc = "http://pets.neopets.com/cpn/" + petName + "/1/1.png";
|
||||
return <li><button>
|
||||
<img src={imageSrc} />
|
||||
<span>{petName}</span>
|
||||
</button></li>;
|
||||
}
|
||||
});
|
||||
|
||||
Modeling.init();
|
||||
})();
|
|
@ -164,7 +164,7 @@ body.outfits-new
|
|||
#newest-unmodeled-items
|
||||
list-style: none
|
||||
|
||||
li
|
||||
> li
|
||||
+clearfix
|
||||
margin: .5em 0
|
||||
|
||||
|
@ -208,13 +208,44 @@ body.outfits-new
|
|||
height: 80px
|
||||
width: 80px
|
||||
|
||||
.missing-bodies, .models
|
||||
margin-left: 82px
|
||||
padding-left: 8px
|
||||
padding-right: 8px
|
||||
|
||||
.missing-bodies
|
||||
font-size: 85%
|
||||
margin-left: 82px
|
||||
padding: .5em 8px
|
||||
padding-bottom: .5em
|
||||
padding-top: .5em
|
||||
p
|
||||
font-family: $main-font
|
||||
margin-bottom: .5em
|
||||
|
||||
.models
|
||||
font-size: 85%
|
||||
|
||||
li
|
||||
display: inline-block
|
||||
margin-bottom: 2px
|
||||
margin-right: 2px
|
||||
|
||||
button
|
||||
+reset-awesome-button
|
||||
+border-radius(4px)
|
||||
+box-shadow(0 1px 3px rgba(0, 0, 0, .5))
|
||||
background: $module-bg-color
|
||||
border: 1px solid $module-border-color
|
||||
padding-right: 8px
|
||||
|
||||
&:active
|
||||
position: relative
|
||||
top: 1px
|
||||
|
||||
img
|
||||
height: 40px
|
||||
margin-right: 8px
|
||||
vertical-align: middle
|
||||
width: 40px
|
||||
|
||||
#latest-contribution
|
||||
+subtle-banner
|
||||
|
|
|
@ -87,6 +87,7 @@ module ApplicationHelper
|
|||
:bitly => 'http://bit.ly/javascript-api.js?version=latest&login=openneo&apiKey=R_4d0438829b7a99860de1d3edf55d8dc8',
|
||||
:html5 => 'http://html5shim.googlecode.com/svn/trunk/html5.js',
|
||||
:jquery => 'http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js',
|
||||
:jquery20 => 'http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js',
|
||||
:jquery_tmpl => 'http://ajax.microsoft.com/ajax/jquery.templates/beta1/jquery.tmpl.min.js',
|
||||
:swfobject => 'http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js'
|
||||
}
|
||||
|
|
|
@ -50,8 +50,12 @@ module OutfitsHelper
|
|||
content_tag(:dd, search_query_description(base, filter_key))
|
||||
end
|
||||
|
||||
def neopia_host
|
||||
Rails.configuration.neopia_host
|
||||
end
|
||||
|
||||
def remote_load_pet_path
|
||||
"http://#{Rails.configuration.neopia_host}/api/1/pet/customization"
|
||||
"http://#{neopia_host}/api/1/pet/customization"
|
||||
end
|
||||
|
||||
def render_predicted_missing_species_by_color(species_by_color)
|
||||
|
|
|
@ -87,6 +87,7 @@
|
|||
%span.meter{style: "width: #{@newest_unmodeled_items_predicted_modeled_ratio[item]*100}%"}
|
||||
.missing-bodies
|
||||
= render_predicted_missing_species_by_color(@newest_unmodeled_items_predicted_missing_species_by_color[item])
|
||||
.models
|
||||
- if @newest_modeled_items.present?
|
||||
%h3= t '.newest_items.modeled.header'
|
||||
%ul#newest-modeled-items
|
||||
|
@ -110,6 +111,9 @@
|
|||
%script#preview-pet-not-found-template{:type => 'text/x-jquery-tmpl'}
|
||||
= t '.preview.pet_not_found'
|
||||
|
||||
- content_for :meta do
|
||||
%meta{name: 'neopia-host', content: neopia_host}
|
||||
|
||||
- content_for :javascripts do
|
||||
= include_javascript_libraries :jquery, :jquery_tmpl
|
||||
= javascript_include_tag 'jquery.timeago', 'pet_query', 'outfits/new'
|
||||
= include_javascript_libraries :jquery20, :jquery_tmpl
|
||||
= javascript_include_tag 'react', 'jquery.timeago', 'pet_query', 'outfits/new', 'modeling'
|
|
@ -30,6 +30,8 @@ OpenneoImpressItems::Application.configure do
|
|||
|
||||
# Expands the lines which load the assets
|
||||
config.assets.debug = true
|
||||
|
||||
config.react.variant = :development
|
||||
end
|
||||
|
||||
LocalImpressHost = 'betanewimpress.openneo.net'
|
||||
|
|
|
@ -59,6 +59,8 @@ OpenneoImpressItems::Application.configure do
|
|||
|
||||
# Force all access to the app over SSL, use Strict-Transport-Security, and use secure cookies.
|
||||
# config.force_ssl = true
|
||||
|
||||
config.react.variant = :production
|
||||
end
|
||||
|
||||
LocalImpressHost = 'newimpress.openneo.net'
|
||||
|
|
BIN
vendor/cache/react-rails-0.8.0.0.gem
vendored
Normal file
BIN
vendor/cache/react-rails-0.8.0.0.gem
vendored
Normal file
Binary file not shown.
BIN
vendor/cache/react-source-0.8.0.gem
vendored
Normal file
BIN
vendor/cache/react-source-0.8.0.gem
vendored
Normal file
Binary file not shown.
Loading…
Reference in a new issue