active lists are sorting right. explore url breaking doesn't happen. explore maps pages do nicer infinite scrolling, properly loading only 20 at a time

This commit is contained in:
Connor Turland 2015-01-31 12:39:48 -05:00
parent 4d7695a767
commit 531f09c6d3
6 changed files with 66 additions and 46 deletions

View file

@ -1,7 +1,7 @@
Metamaps.Backbone = {};
Metamaps.Backbone.Map = Backbone.Model.extend({
urlRoot: '/maps',
blacklist: ['created_at', 'updated_at', 'user_name', 'contributor_count', 'topic_count', 'synapse_count', 'topics', 'synapses', 'mappings', 'mappers'],
blacklist: ['created_at', 'updated_at', 'created_at_clean', 'updated_at_clean', 'user_name', 'contributor_count', 'topic_count', 'synapse_count', 'topics', 'synapses', 'mappings', 'mappers'],
toJSON: function (options) {
return _.omit(this.attributes, this.blacklist);
},
@ -169,10 +169,12 @@ Metamaps.Backbone.MapsCollection = Backbone.Collection.extend({
temp = a;
a = b;
b = temp;
a = (new Date(a)).getTime();
b = (new Date(b)).getTime();
}
return a > b ? 1 : a < b ? -1 : 0;
},
getMaps: function () {
getMaps: function (cb) {
var self = this;
@ -190,7 +192,7 @@ Metamaps.Backbone.MapsCollection = Backbone.Collection.extend({
self.page = "loadedAll";
}
else self.page += 1;
self.trigger('successOnFetch');
self.trigger('successOnFetch', cb);
},
error: function (collection, response, options) {
// you can pass additional options to the event you trigger here as well
@ -199,7 +201,7 @@ Metamaps.Backbone.MapsCollection = Backbone.Collection.extend({
});
}
else {
self.trigger('successOnFetch');
self.trigger('successOnFetch', cb);
}
}
});

View file

@ -22,6 +22,11 @@
var classes = Metamaps.Active.Mapper ? "homePage explorePage" : "homePage";
$('.wrapper').addClass(classes);
var navigate = function() {
Metamaps.routerTimeoutId = setTimeout(function() {
Metamaps.Router.navigate("");
}, 300);
};
// all this only for the logged in home page
if (Metamaps.Active.Mapper) {
@ -38,10 +43,10 @@
Metamaps.Views.exploreMaps.setCollection( Metamaps.Maps.Active );
if (Metamaps.Maps.Active.length === 0) {
Metamaps.Maps.Active.getMaps(); // this will trigger an explore maps render
Metamaps.Maps.Active.getMaps(navigate); // this will trigger an explore maps render
}
else {
Metamaps.Views.exploreMaps.render();
Metamaps.Views.exploreMaps.render(navigate);
}
}
// logged out home page
@ -55,10 +60,7 @@
Metamaps.GlobalUI.Search.close(0, true);
Metamaps.Famous.maps.hide();
clearTimeout(Metamaps.routerTimeoutId);
Metamaps.routerTimeoutId = setTimeout(function(){
Metamaps.Router.navigate("");
}, 500);
Metamaps.routerTimeoutId = setTimeout(navigate, 500);
}
Metamaps.Famous.viz.hide();
@ -110,18 +112,32 @@
}
Metamaps.Views.exploreMaps.setCollection( Metamaps.Maps[capitalize] );
var navigate = function(){
var path = "/explore/" + Metamaps.currentPage;
// alter url if for mapper profile page
if (Metamaps.currentPage == "mapper") {
path += "/" + Metamaps.Maps.Mapper.mapperId;
}
Metamaps.Router.navigate(path);
};
var navigateTimeout = function() {
Metamaps.routerTimeoutId = setTimeout(navigate, 300);
};
if (Metamaps.Maps[capitalize].length === 0) {
Metamaps.Loading.show();
setTimeout(function(){
Metamaps.Maps[capitalize].getMaps(); // this will trigger an explore maps render
Metamaps.Maps[capitalize].getMaps(navigate); // this will trigger an explore maps render
}, 300); // wait 300 milliseconds till the other animations are done to do the fetch
}
else {
if (id) {
Metamaps.Views.exploreMaps.fetchUserThenRender();
Metamaps.Views.exploreMaps.fetchUserThenRender(navigateTimeout);
}
else {
Metamaps.Views.exploreMaps.render();
Metamaps.Views.exploreMaps.render(navigateTimeout);
}
}

View file

@ -54,10 +54,15 @@ Metamaps.Views.init = function () {
this.listenTo(this.collection, 'successOnFetch', this.handleSuccess);
this.listenTo(this.collection, 'errorOnFetch', this.handleError);
},
render: function (mapperObj) {
render: function (mapperObj, cb) {
var that = this;
if (typeof mapperObj === "function") {
var cb = mapperObj;
mapperObj = null;
}
this.el.innerHTML = "";
// in case it is a page where we have to display the mapper card
@ -76,58 +81,47 @@ Metamaps.Views.init = function () {
this.$el.append('<div class="clearfloat"></div>');
var m = Metamaps.Famous.maps.surf;
m.setContent(this.el);
setTimeout(function(){
var updateHeight = function(){
var height = $(that.el).height() + 32 + 56;
m.setSize([undefined, height]);
}, 100);
Metamaps.Famous.maps.lock = false;
if (cb) cb();
};
if (!initialized) {
m.deploy(m._currTarget);
initialized = true;
setTimeout(function(){
var height = $(that.el).height() + 32 + 56;
m.setSize([undefined, height]);
}, 100);
setTimeout(updateHeight, 100);
} else {
setTimeout(updateHeight, 100);
}
Metamaps.Loading.hide();
Metamaps.Famous.maps.lock = false;
clearTimeout(Metamaps.routerTimeoutId);
Metamaps.routerTimeoutId = setTimeout((function(localCurrentPage){ return function(){
var path = (Metamaps.currentSection == "") ? "" : "/explore/" + localCurrentPage;
// alter url if for mapper profile page
if (that.collection && that.collection.mapperId) {
path += "/" + that.collection.mapperId;
}
Metamaps.Router.navigate(path);
}})(Metamaps.currentPage), 500);
},
handleSuccess: function () {
handleSuccess: function (cb) {
var that = this;
if (this.collection && this.collection.id === "mapper") {
this.fetchUserThenRender();
this.fetchUserThenRender(cb);
}
else {
this.render();
this.render(cb);
}
},
handleError: function () {
console.log('error loading maps!'); //TODO
},
fetchUserThenRender: function () {
fetchUserThenRender: function (cb) {
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);
that.render(response, cb);
},
error: function () {
that.render(cb);
}
});
}

View file

@ -4744,7 +4744,7 @@ Metamaps.Map.InfoBox = {
var map = Metamaps.Active.Map;
var obj = map.pick("permission","contributor_count","topic_count","synapse_count","created_at","updated_at");
var obj = map.pick("permission","contributor_count","topic_count","synapse_count");
var isCreator = map.authorizePermissionChange(Metamaps.Active.Mapper);
var canEdit = map.authorizeToEdit(Metamaps.Active.Mapper);
@ -4758,6 +4758,8 @@ Metamaps.Map.InfoBox = {
obj["contributor_image"] = Metamaps.Mappers.length > 0 ? Metamaps.Mappers.models[0].get("image") : "/assets/user.png";
obj["contributor_list"] = self.createContributorList();
obj["user_name"] = isCreator ? "You" : map.get("user_name");
obj["created_at"] = map.get("created_at_clean");
obj["updated_at"] = map.get("updated_at_clean");
var classes = isCreator ? "yourMap" : "";
classes += canEdit ? " canEdit" : "";

View file

@ -76,9 +76,9 @@ class Map < ActiveRecord::Base
end
def as_json(options={})
json = super(:methods =>[:user_name, :user_image, :topic_count, :synapse_count, :contributor_count, :screenshot_url], :except => [:screenshot_content_type, :screenshot_file_size, :screenshot_file_name, :screenshot_updated_at, :created_at, :updated_at])
json[:created_at] = self.created_at_str
json[:updated_at] = self.updated_at_str
json = super(:methods =>[:user_name, :user_image, :topic_count, :synapse_count, :contributor_count, :screenshot_url], :except => [:screenshot_content_type, :screenshot_file_size, :screenshot_file_name, :screenshot_updated_at])
json[:created_at_clean] = self.created_at_str
json[:updated_at_clean] = self.updated_at_str
json
end

View file

@ -207,9 +207,15 @@ Metamaps.Famous.build = function () {
};
var mapsScroll = new Scrollview();
f.maps.lock = false;
mapsScroll._scroller.on('edgeHit', function(data){
mapsScroll._eventInput.on('update', _.throttle(function(data) {
var bottom = f.maps.surf.getSize()[1], // how far down it goes
pos = mapsScroll.getPosition(), // how far down you are
containerSize = f.maps.mod.getSize()[1], // height of the viewable area
distanceToBottom = bottom - (pos + containerSize),
triggerDistance = 700;
if (!f.maps.lock &&
data.position > 0 &&
distanceToBottom < triggerDistance &&
Metamaps.Views &&
Metamaps.Views.exploreMaps &&
Metamaps.Views.exploreMaps.collection &&
@ -217,7 +223,7 @@ Metamaps.Famous.build = function () {
f.maps.lock = true;
Metamaps.Views.exploreMaps.collection.getMaps();
}
});
}, 500));
f.maps.resetScroll = function() {
// set the scrollView back to the top
mapsScroll._physicsEngine.detachAll();