glenux-contrib/metamaps--metamaps
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

changed user image settings. added mapper profile page

Browse source
This commit is contained in:
Connor Turland 2014-11-25 15:06:30 -05:00
parent e9114a309f
commit d08774d8bc
23 changed files with 294 additions and 49 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

BIN
app/assets/images/profile_card_sprite.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 1.9 KiB

11
app/assets/javascripts/src/Metamaps.Backbone.js
View file

@ -131,11 +131,20 @@ Metamaps.Backbone.MapsCollection = Backbone.Collection.extend({
this.id = options.id;
this.sortBy = options.sortBy;
if (options.mapperId) {
this.mapperId = options.mapperId;
}
// this.page represents the NEXT page to fetch
this.page = models.length > 0 ? (models.length < 20 ? "loadedAll" : 2) : 1;
},
url: function() {
return '/explore/' + this.id + '.json';
if (!this.mapperId) {
return '/explore/' + this.id + '.json';
}
else {
return '/explore/mapper/' + this.mapperId + '.json';
}
},
comparator: function (a, b) {
a = a.get(this.sortBy);

11
app/assets/javascripts/src/Metamaps.GlobalUI.js
View file

@ -90,9 +90,17 @@ Metamaps.GlobalUI = {
if (Metamaps.Active.Mapper) Metamaps.Active.Mapper = new Metamaps.Backbone.Mapper(Metamaps.Active.Mapper);
var myCollection = Metamaps.Maps.Mine ? Metamaps.Maps.Mine : [];
var mapperCollection = [];
var mapperOptionsObj = {id: 'mapper', sortBy: 'name' };
if (Metamaps.Maps.Mapper) {
mapperCollection = Metamaps.Maps.Mapper.models;
mapperOptionsObj.mapperId = Metamaps.Maps.Mapper.id;
}
var featuredCollection = Metamaps.Maps.Featured ? Metamaps.Maps.Featured : [];
var activeCollection = Metamaps.Maps.Active ? Metamaps.Maps.Active : [];
Metamaps.Maps.Mine = new Metamaps.Backbone.MapsCollection(myCollection, {id: 'mine', sortBy: 'name' });
// 'Mapper' refers to another mapper
Metamaps.Maps.Mapper = new Metamaps.Backbone.MapsCollection(mapperCollection, mapperOptionsObj);
Metamaps.Maps.Featured = new Metamaps.Backbone.MapsCollection(featuredCollection, {id: 'featured', sortBy: 'name' });
Metamaps.Maps.Active = new Metamaps.Backbone.MapsCollection(activeCollection, {id: 'active', sortBy: 'updated_at' });
},
@ -600,8 +608,7 @@ Metamaps.GlobalUI.Search = {
} else if (dataset == "maps") {
Metamaps.Router.maps(datum.id);
} else if (dataset == "mappers") {
win = window.open('/maps/mappers/' + datum.id, '_blank');
win.focus();
Metamaps.Router.explore("mapper", datum.id);
}
}
},

32
app/assets/javascripts/src/Metamaps.Router.js
View file

@ -6,6 +6,7 @@
routes: {
"": "home", // #home
"explore/:section": "explore", // #explore/active
"explore/:section/:id": "explore", // #explore/mapper/1234
"maps/:id": "maps" // #maps/7
},
home: function () {
@ -64,13 +65,18 @@
Metamaps.Active.Map = null;
Metamaps.Active.Topic = null;
},
explore: function (section) {
explore: function (section, id) {
// just capitalize the variable section
// either 'mine', 'featured', or 'active'
// either 'featured', 'mapper', or 'active'
var capitalize = section.charAt(0).toUpperCase() + section.slice(1);
document.title = 'Explore ' + capitalize + ' Maps | Metamaps';
if (capitalize === "featured" || capitalize === "active") {
document.title = 'Explore ' + capitalize + ' Maps | Metamaps';
}
else if (capitalize === "mapper") {
document.title = 'Explore Maps | Metamaps';
}
$('.wrapper').removeClass('homePage mapPage topicPage');
$('.wrapper').addClass('explorePage');
@ -78,6 +84,17 @@
Metamaps.currentSection = "explore";
Metamaps.currentPage = section;
// this will mean it's a mapper page being loaded
if (id) {
if (Metamaps.Maps.Mapper.mapperId !== id) {
// empty the collection if we are trying to load the maps
// collection of a different mapper than we had previously
Metamaps.Maps.Mapper.reset();
Metamaps.Maps.Mapper.page = 1;
}
Metamaps.Maps.Mapper.mapperId = id;
}
Metamaps.Views.exploreMaps.setCollection( Metamaps.Maps[capitalize] );
if (Metamaps.Maps[capitalize].length === 0) {
Metamaps.Loading.show();
@ -86,7 +103,12 @@
}, 300); // wait 300 milliseconds till the other animations are done to do the fetch
}
else {
Metamaps.Views.exploreMaps.render();
if (id) {
Metamaps.Views.exploreMaps.fetchUserThenRender();
}
else {
Metamaps.Views.exploreMaps.render();
}
}
Metamaps.GlobalUI.Search.open();
@ -96,7 +118,7 @@
Metamaps.Famous.maps.resetScroll(); // sets the scroll back to the top
Metamaps.Famous.maps.show();
Metamaps.Famous.explore.set(section);
Metamaps.Famous.explore.set(section, id);
Metamaps.Famous.explore.show();
Metamaps.Famous.viz.hide();

54
app/assets/javascripts/src/Metamaps.Views.js
View file

@ -5,6 +5,20 @@
Metamaps.Views.init = function () {
Metamaps.Views.MapperCard = Backbone.View.extend({
template: Hogan.compile( $('#mapperCardTemplate').html() ),
tagName: "div",
className: "mapper",
render: function () {
this.$el.html( this.template.render(this.model) );
return this;
}
});
Metamaps.Views.MapCard = Backbone.View.extend({
template: Hogan.compile( $('#mapCardTemplate').html() ),
@ -40,12 +54,20 @@ Metamaps.Views.init = function () {
this.listenTo(this.collection, 'successOnFetch', this.handleSuccess);
this.listenTo(this.collection, 'errorOnFetch', this.handleError);
},
render: function () {
render: function (mapperObj) {
var that = this;
this.el.innerHTML = "";
// in case it is a page where we have to display the mapper card
if (mapperObj) {
var view = new Metamaps.Views.MapperCard({ model: mapperObj });
that.el.appendChild( view.render().el );
}
this.collection.each(function (map) {
var view = new Metamaps.Views.MapCard({ model: map });
@ -70,15 +92,41 @@ Metamaps.Views.init = function () {
Metamaps.Loading.hide();
setTimeout(function(){
var path = Metamaps.currentSection == "" ? "" : "/explore/" + Metamaps.currentPage;
var path = Metamaps.currentSection == "" ? "" : "/explore/" + Metamaps.currentPage;
// alter url if for mapper profile page
if (that.collection && that.collection.mapperId) {
path += "/" + that.collection.mapperId;
}
Metamaps.Router.navigate(path);
}, 500);
},
handleSuccess: function () {
this.render();
var that = this;
if (this.collection && this.collection.id === "mapper") {
this.fetchUserThenRender();
}
else {
this.render();
}
},
handleError: function () {
console.log('error loading maps!'); //TODO
},
fetchUserThenRender: function () {
var that = this;
// first load the mapper object and then call the render function
$.ajax({
url: "/users/" + this.collection.mapperId + "/details.json",
success: function (response) {
that.render(response);
},
error: function () {
}
});
}
});

75
app/assets/stylesheets/base.css
View file

@ -937,4 +937,79 @@ font-family: 'din-regular', helvetica, sans-serif;
.sCountColor {
font-family: 'din-medium', sans-serif;
color: #DAB539;
}
/* mapper card */
.mapper {
float: left;
width:220px;
height:340px;
font-size: 12px;
text-align: left;
overflow: visible;
background: #E0E0E0;
border-radius:2px;
margin:16px 16px 16px 19px;
box-shadow: 0px 3px 3px rgba(0,0,0,0.23), 0 3px 3px rgba(0,0,0,0.16);
}
.mapperCard {
width:100%;
height:308px;
padding: 16px 0;
color:#424242;
}
.mapperImage {
margin: 16px auto 0;
width: 96px;
}
.mapperImage img {
border-radius: 48px;
box-shadow: 0px 3px 3px rgba(0,0,0,0.23);
}
.mapperName {
font-size: 24px;
text-align: center;
margin-top: 24px;
padding: 0 16px;
white-space: nowrap;
text-overflow: ellipsis;
width: 189px;
overflow: hidden;
}
.mapperInfo {
color: #DB5D5D;
text-align:center;
margin-top: 16px;
}
.mapperMetadata {
background: url(profile_card_sprite.png) no-repeat center 0;
height: 64px;
width: 160px;
margin: 16px auto 0;
}
.mapperMetadata .metadataSection {
width: 32%;
display: inline-block;
text-align: center;
}
.mapperMetadata .metadataSection div {
font-size: 16px;
color: #424242;
margin: 14px 0;
}
.mapperMetadata .metadataMaps {
color: #DB5D5D;
}
.mapperMetadata .metadataTopics {
color: #4FC059;
}
.mapperMetadata .metadataSynapses {
color: #DAB539;
}

17
app/assets/stylesheets/clean.css
View file

@ -1074,6 +1074,23 @@
border-bottom: 2px solid #00BCD4;
}
.exploreMapsButton.mapperButton {
height: 40px;
padding: 0;
}
.mapperButton img.exploreMapperImage {
float: left;
border-radius: 12px;
margin-top: 8px;
margin-right: 8px;
}
.exploreMapperName {
white-space: nowrap;
float: left;
margin-top: 12px;
}
.exploreMapsButton .exploreMapsIcon {
background-repeat: no-repeat;
width:32px;

21
app/controllers/maps_controller.rb
View file

@ -6,10 +6,9 @@ class MapsController < ApplicationController
autocomplete :map, :name, :full => true, :extra_data => [:user_id]
# GET /maps/recent
# GET /maps/featured
# GET /maps/new
# GET /maps/mappers/:id
# GET /explore/active
# GET /explore/featured
# GET /explore/mapper/:id
def index
if request.path == "/explore"
@ -19,6 +18,7 @@ class MapsController < ApplicationController
@current = current_user
@user = nil
@maps = []
@mapperId = nil
if !params[:page]
page = 1
@ -39,21 +39,12 @@ class MapsController < ApplicationController
redirect_to activemaps_url and return
end
# don't need to exclude private maps because they all belong to you
@maps = Map.where("maps.user_id = ?", @current.id).order("name ASC").page(page).per(20)
@request = "you"
elsif request.path.index('/explore/mappers/') != nil # looking for maps by a mapper
elsif request.path.index('/explore/mapper/') != nil # looking for maps by a mapper
@user = User.find(params[:id])
@maps = Map.where("maps.user_id = ? AND maps.permission != ?", @user.id, "private").order("name ASC").page(page).per(20)
@request = "other"
elsif request.path.index('/explore/topics/') != nil # looking for maps by a certain topic they include
@topic = Topic.find(params[:id]).authorize_to_show(@current)
if !@topic
redirect_to featuredmaps_url, notice: "Access denied." and return
end
@maps = @topic.maps.delete_if {|m| m.permission == "private" && (!authenticated? || (authenticated? && @current.id != m.user_id)) }
@request = "topic"
@request = "mapper"
end
respond_to do |format|

17
app/controllers/users_controller.rb
View file

@ -67,6 +67,23 @@ class UsersController < ApplicationController
end
end
# GET /users/:id/details [.json]
def details
@user = User.find(params[:id])
@details = Hash.new
@details['name'] = @user.name
@details['created_at'] = @user.created_at.strftime("%m/%d/%Y")
@details['image'] = @user.image.url(:ninetysix)
@details['generation'] = @user.generation
@details['numSynapses'] = @user.synapses.count
@details['numTopics'] = @user.topics.count
@details['numMaps'] = @user.maps.count
render json: @details
end
# PUT /user/updatemetacodes
def updatemetacodes
@user = current_user

4
app/helpers/maps_helper.rb
View file

@ -18,9 +18,9 @@ module MapsHelper
contributorTip = ''
firstContributorImage = '/assets/user.png'
if m.contributors.count > 0
firstContributorImage = m.contributors[0].image.url(:square)
firstContributorImage = m.contributors[0].image.url(:thirtytwo)
m.contributors.each_with_index do |c, index|
userImage = c.image.url(:square)
userImage = c.image.url(:thirtytwo)
name = c.name
contributorTip += '<li> <img class="tipUserImage" width="25" height="25" src=' + userImage + ' />' + '<span>' + name + '</span> </li>'
end

2
app/helpers/synapses_helper.rb
View file

@ -25,7 +25,7 @@ module SynapsesHelper
synapse['permission'] = s.permission
synapse['mapCount'] = s.maps.count
synapse['originator'] = s.user.name
synapse['originatorImage'] = s.user.image.url(:square)
synapse['originatorImage'] = s.user.image.url(:thirtytwo)
synapse['rtype'] = "synapse"
temp.push synapse

2
app/helpers/topics_helper.rb
View file

@ -15,7 +15,7 @@ module TopicsHelper
topic['mapCount'] = t.maps.count
topic['synapseCount'] = t.synapses.count
topic['originator'] = t.user.name
topic['originatorImage'] = t.user.image.url(:square)
topic['originatorImage'] = t.user.image.url(:thirtytwo)
topic['rtype'] = "topic"
temp.push topic

2
app/helpers/users_helper.rb
View file

@ -8,7 +8,7 @@ module UsersHelper
user['id'] = u.id
user['label'] = u.name
user['value'] = u.name
user['profile'] = u.image.url(:square)
user['profile'] = u.image.url(:sixtyfour)
user['mapCount'] = u.maps.count
user['generation'] = u.generation
user['created_at'] = u.created_at.strftime("%m/%d/%Y")

7
app/models/user.rb
View file

@ -32,7 +32,10 @@ class User < ActiveRecord::Base
# This method associates the attribute ":image" with a file attachment
has_attached_file :image, :styles => {
:square => ['84x84#', :png]
:thirtytwo => ['32x32#', :png],
:sixtyfour => ['64x64#', :png],
:ninetysix => ['96x96#', :png],
:onetwentyeight => ['128x128#', :png]
},
:default_url => "/assets/user.png"
@ -42,7 +45,7 @@ class User < ActiveRecord::Base
def as_json(options={})
{ :id => self.id,
:name => self.name,
:image => self.image.url(:square)
:image => self.image.url(:sixtyfour)
}
end

2
app/views/layouts/_account.html.erb
View file

@ -5,7 +5,7 @@
<% if authenticated? %>
<% account = current_user %>
<%= image_tag user.image.url(:square), :size => "48x48", :class => "sidebarAccountImage" %>
<%= image_tag user.image.url(:sixtyfour), :size => "48x48", :class => "sidebarAccountImage" %>
<h3 class="accountHeader"><%= account.name.split[0...1][0] %></h3>
<ul>
<li class="accountListItem accountSettings">

21
app/views/layouts/_templates.html.erb
View file

@ -72,6 +72,27 @@
</div>
</a>
</script>
<script type="text/template" id="mapperCardTemplate">
<div class="mapperCard">
<div class="mapperImage">
<img src="{{image}}" width="96" height="96" />
</div>
<div class="mapperName" title="{{name}}">
{{name}}
</div>
<div class="mapperInfo">
<div class="mapperCreatedAt">Mapper since: {{created_at}}</div>
<div class="mapperGeneration">Generation: {{generation}}</div>
</div>
<div class="mapperMetadata">
<div class="metadataSection metadataMaps"><div>{{numMaps}}</div>maps</div>
<div class="metadataSection metadataTopics"><div>{{numTopics}}</div>topics</div>
<div class="metadataSection metadataSynapses"><div>{{numSynapses}}</div>synapses</div>
<div class="clearfloat"></div>
</div>
</div>
</script>
<script type="text/template" id="topicSearchTemplate">
<div class="result{{rtype}}">

4
app/views/layouts/_upperelements.html.erb
View file

@ -31,7 +31,7 @@
<div class="realtimeMapperList">
<ul>
<li class="rtMapper littleRtOn rtMapperSelf">
<%= image_tag user.image.url(:square), :size => "24x24", :class => "rtUserImage" %>
<%= image_tag user.image.url(:thirtytwo), :size => "24x24", :class => "rtUserImage" %>
<%= user.name %> (me)
<div class="littleJuntoIcon"></div>
</li>
@ -70,7 +70,7 @@
<div class="sidebarAccount upperRightEl">
<div class="sidebarAccountIcon"><div class="tooltipsUnder">Account</div>
<% if user && user.image %>
<%= image_tag user.image.url(:square), :size => "32x32" %>
<%= image_tag user.image.url(:thirtytwo), :size => "32x32" %>
<% elsif !authenticated? %>
SIGN IN
<div class="accountInnerArrow"></div>

8
app/views/maps/_mapinfobox.html.erb
View file

@ -15,15 +15,15 @@
<% if @map.contributors.count == 0 %>
<img id="mapContribs" width="25" height="25" src="/assets/user.png" />
<% elsif @map.contributors.count == 1 %>
<img id="mapContribs" width="25" height="25" src="<%= @map.contributors[0].image.url(:square) %>" />
<img id="mapContribs" width="25" height="25" src="<%= @map.contributors[0].image.url(:thirtytwo) %>" />
<% elsif @map.contributors.count == 2 %>
<img id="mapContribs" width="25" height="25" src="<%= @map.contributors[0].image.url(:square) %>" class="multiple mTwo" />
<img id="mapContribs" width="25" height="25" src="<%= @map.contributors[0].image.url(:thirtytwo) %>" class="multiple mTwo" />
<% elsif @map.contributors.count > 2 %>
<img id="mapContribs" width="25" height="25" src="<%= @map.contributors[0].image.url(:square) %>" class="multiple" />
<img id="mapContribs" width="25" height="25" src="<%= @map.contributors[0].image.url(:thirtytwo) %>" class="multiple" />
<% end %>
<span><%= @map.contributors.count %></span>
<div class="tip"> <ul><% @map.contributors.each_with_index do |c, index| %>
<li > <img class="rtUserImage" width="25" height="25" src="<%= c.image.url(:square) %>" />
<li > <img class="rtUserImage" width="25" height="25" src="<%= c.image.url(:thirtytwo) %>" />
<%= c.name %>
</li>
<% end %></ul></div>

6
app/views/maps/index.html.erb
View file

@ -13,6 +13,12 @@
<% elsif @request == "featured" %>
Metamaps.Maps.Featured = <%= @maps.to_json.html_safe %>;
Metamaps.currentPage = "featured";
<% elsif @request == "mapper" %>
Metamaps.Maps.Mapper = {
models: <%= @maps.to_json.html_safe %>,
id: <%= params[:id] %>
};
Metamaps.currentPage = "mapper";
<% end %>
Metamaps.currentSection = "explore";
Metamaps.GlobalUI.Search.isOpen = true;

2
app/views/shared/_filterBox.html.erb
View file

@ -81,7 +81,7 @@
end
@mappers.each_with_index do |mapper, index|
@mapperlist += '<li data-id="' + mapper.id.to_s + '">'
@mapperlist += '<img src="' + mapper.image.url(:square) + '" data-id="' + mapper.id.to_s + '" alt="' + mapper.name + '" />'
@mapperlist += '<img src="' + mapper.image.url(:sixtyfour) + '" data-id="' + mapper.id.to_s + '" alt="' + mapper.name + '" />'
@mapperlist += '<p>' + mapper.name + '</p></li>'
end
end

2
app/views/users/edit.html.erb
View file

@ -10,7 +10,7 @@
<h3>Edit Account</h3>
<div class="userImage">
<div class="userImageDiv" onclick="Metamaps.Account.toggleChangePicture()">
<%= image_tag @user.image.url(:square), :size => "84x84" %>
<%= image_tag @user.image.url(:ninetysix), :size => "84x84" %>
<div class="editPhoto"></div>
</div>
<div class="userImageMenu">

4
config/routes.rb
View file

@ -23,8 +23,7 @@ Metamaps::Application.routes.draw do
match 'explore/active', to: 'maps#index', via: :get, as: :activemaps
match 'explore/featured', to: 'maps#index', via: :get, as: :featuredmaps
match 'explore/mine', to: 'maps#index', via: :get, as: :mymaps
match 'maps/mappers/:id', to: 'maps#index', via: :get, as: :usermaps
match 'maps/topics/:id', to: 'maps#index', via: :get, as: :topicmaps
match 'explore/mapper/:id', to: 'maps#index', via: :get, as: :usermaps
resources :maps, except: [:new, :edit]
match 'maps/:id/contains', to: 'maps#contains', via: :get, as: :contains
match 'maps/:id/upload_screenshot', to: 'maps#screenshot', via: :post, as: :screenshot
@ -38,6 +37,7 @@ Metamaps::Application.routes.draw do
get 'join' => 'devise/registrations#new', :as => :new_user_registration
end
match 'users/:id/details', to: 'users#details', via: :get, as: :details
match 'user/updatemetacodes', to: 'users#updatemetacodes', via: :post, as: :updatemetacodes
resources :users, except: [:index, :destroy]
end

39
public/famous/main.js
View file

@ -198,10 +198,15 @@ Metamaps.Famous.build = function () {
var capitalize = Metamaps.currentPage.charAt(0).toUpperCase() + Metamaps.currentPage.slice(1);
Metamaps.Views.exploreMaps.setCollection( Metamaps.Maps[capitalize] );
Metamaps.Views.exploreMaps.render();
if (Metamaps.currentPage === "mapper") {
Metamaps.Views.exploreMaps.fetchUserThenRender();
}
else {
Metamaps.Views.exploreMaps.render();
}
f.maps.show();
f.explore.set(Metamaps.currentPage);
f.explore.show();
f.explore.set(Metamaps.currentPage, Metamaps.Maps.Mapper.mapperId);
f.explore.show();
}
else if (Metamaps.currentSection === "") {
Metamaps.Loading.hide();
@ -247,9 +252,33 @@ Metamaps.Famous.build = function () {
{ duration: 300, curve: 'easeIn' }
);
};
f.explore.set = function (section) {
f.explore.set = function (section, mapperId) {
var loggedIn = Metamaps.Active.Mapper ? 'Auth' : '';
f.explore.surf.setContent(templates[section + loggedIn + 'Content']);
if (section === "mine" || section === "active" || section === "featured") {
f.explore.surf.setContent(templates[section + loggedIn + 'Content']);
}
else if (section === "mapper") {
var setMapper = function(mapperObj) {
var mapperContent;
mapperContent = "<div class='exploreMapsButton active mapperButton'><img class='exploreMapperImage' width='24' height='24' src='" + mapperObj.image + "' />";
mapperContent += "<div class='exploreMapperName'>" + mapperObj.name + "'s Maps</div><div class='clearfloat'></div></div>";
f.explore.surf.setContent(mapperContent);
};
$.ajax({
url: "/users/" + mapperId + ".json",
success: function (response) {
setMapper(response);
},
error: function () {
}
});
}
};
var exploreMod = f.mainContext.add(f.explore.mod);
exploreMod.add(new Modifier({