got maps wrapper working

This commit is contained in:
Connor Turland 2014-08-12 19:20:46 -04:00
parent 6422b54dc0
commit 46380a17e0
7 changed files with 82 additions and 92 deletions

View file

@ -28,7 +28,7 @@
Metamaps.Famous.explore.set('mine');
Metamaps.Famous.explore.show();
$('.mapsWrapper').fadeIn(300);
Metamaps.Famous.maps.show();
Metamaps.GlobalUI.Search.open();
Metamaps.GlobalUI.Search.lock();
@ -51,7 +51,7 @@
Metamaps.GlobalUI.Search.unlock();
Metamaps.GlobalUI.Search.close(0, true);
$('.mapsWrapper').fadeOut(300);
Metamaps.Famous.maps.hide();
setTimeout(function(){
Metamaps.Router.navigate("");
}, 500);
@ -88,9 +88,8 @@
Metamaps.GlobalUI.Search.lock();
Metamaps.Famous.yield.hide();
$('.mapsWrapper').fadeIn(300);
Metamaps.Famous.maps.show();
Metamaps.Famous.explore.set(section);
Metamaps.Famous.explore.show();
@ -109,7 +108,7 @@
$('.wrapper').addClass('mapPage');
Metamaps.Famous.yield.hide();
$('.mapsWrapper').fadeOut(300);
Metamaps.Famous.maps.hide();
Metamaps.Famous.explore.hide();
// clear the visualization, if there was one, before showing its div again
@ -137,7 +136,7 @@
$('.wrapper').addClass('mapPage');
Metamaps.Famous.yield.hide();
$('.mapsWrapper').fadeOut(300);
Metamaps.Famous.maps.hide();
Metamaps.Famous.explore.hide();
// clear the visualization, if there was one, before showing its div again

View file

@ -34,8 +34,6 @@ Metamaps.Views.init = function () {
var mapsWrapper = Backbone.View.extend({
el: '.mapsWrapper',
initialize: function (opts) {
},
@ -48,13 +46,20 @@ Metamaps.Views.init = function () {
render: function () {
var that = this;
this.$el.empty();
this.el.innerHTML = "";
this.collection.each(function (map) {
var view = new Metamaps.Views.MapCard({ model: map });
that.$el.append( view.render().el );
that.el.appendChild( view.render().el );
});
var m = Metamaps.Famous.maps.surf;
m.setContent(this.el);
if (!Metamaps.initialized) {
m.deploy(m._currTarget);
Metamaps.initialized = true;
}
Metamaps.Loading.loader.hide();
setTimeout(function(){

View file

@ -682,12 +682,7 @@
}
.mapsWrapper {
margin: 100px 60px 0 60px;
display: none;
z-index: 1;
}
.explorePage .mapsWrapper {
display:block;
overflow-y: scroll;
}
/* end explore maps */

View file

@ -1,22 +0,0 @@
<!--<div class="exploreMapsBar exploreElement animations">
<div class="exploreMapsMenu">
<div class="exploreMapsCenter">
<% if authenticated? %>
<a href="/" class="active">My Maps</a>
<% end %>
<a href="/explore/active">Recently Active</a>
<a href="/explore/featured">Featured</a>
<a href="/explore/new">New</a>
<div class="clearfloat"></div>
</div> <!-- end exploreMapsCenter
</div> <!-- end exploreMapsMenu
</div> <!-- end exploreMapsBar -->
<div class="mapsWrapper exploreElement">
<% if @maps %>
<% @maps.each do |map| %>
<%= render map %>
<% end %>
<% end %>
<div class="clearfloat"></div>
</div>

View file

@ -56,11 +56,9 @@
<div class="wrapper <%= classes %>" id="wrapper">
<%= render :partial => 'layouts/upperelements' %>
<%= render :partial => 'layouts/exploremaps' %>
<%= yield %>
<!--<div class="mapElement" id="infovis"></div> <!-- where map visualizations get rendered -->
<div class="showcard mapElement mapElementHidden" id="showcard"></div> <!-- the topic card -->
<% if authenticated? %>
<% # for creating and pulling in topics and synapses %>
@ -71,14 +69,10 @@
<% end %>
<%= render :partial => 'layouts/lowermapelements' %>
<div id="loading"></div>
<div id="famousOverlay"></div>
<div id="loading"></div>
</div>
<!--<div class="footer">
<div id="logo">METAMAPS</div>
</div>-->
<% end %>
<%= render :partial => 'layouts/lightboxes' %>

View file

@ -1,34 +0,0 @@
<%#
# @file
# Shows a map as a card.
# Any list of maps uses this rendering.
#%>
<%= div_for map do %>
<a href="/maps/<%= map.id %>">
<div class="permission <%= map.authorize_to_edit(user) ? "canEdit" : "cannotEdit" %>">
<div class="mapCard">
<span class="title">
<%= best_in_place map, :name, :type => :textarea, :classes => 'best_in_place_name' %>
</span>
<div class="links">
<div class="linkItem contributor hoverForTip">
<div class="tip">Created by <%= map.user.name %> on <%= map.created_at.strftime("%m/%d/%Y") %></div>
</div>
<div class="linkItem topicCount"><%= map.topics.count %></div>
<div class="linkItem synapseCount"><%= map.synapses.count %></div>
<div class="linkItem mapPerm <%= map.mk_permission %>"></div>
<div class="clearfloat"></div>
</div>
<div class="scroll">
<div class="desc">
<%= best_in_place map, :desc, :type => :textarea, :nil => "Click to add description.", :classes => 'best_in_place_desc' %>
<div class="clearfloat"></div>
</div>
</div>
<div class="clearfloat"></div>
</div>
</div>
</a>
<% end %>

View file

@ -107,6 +107,72 @@ define(function(require, exports, module) {
f.yield.show();
}
};
// CONTENT / OTHER PAGES
f.maps = {};
f.maps.surf = new Surface({
classes: ['mapsWrapper'],
properties: {
display: 'none'
}
});
var loadMaps = function () {
f.loadMaps();
f.maps.surf.removeListener('deploy',loadMaps);
};
if (Metamaps.currentSection === "explore" ||
(Metamaps.currentSection === "" && Metamaps.Active.Mapper)) {
f.maps.surf.on('deploy', loadMaps);
}
f.maps.mod = new Modifier({
origin: [0.5, 1],
opacity: 0
});
f.maps.mod.sizeFrom(function(){
return [window.innerWidth, window.innerHeight - 94];
});
f.maps.show = function () {
f.maps.surf.setProperties({ "display":"block" });
f.maps.mod.setOpacity(
1,
{ duration: 300 }
);
};
f.maps.hide = function () {
f.maps.mod.setOpacity(
0,
{ duration: 300 },
function() {
f.maps.surf.setProperties({"display": "none"});
}
);
};
f.mainContext.add(f.maps.mod).add(f.maps.surf);
f.loadMaps = function () {
if (Metamaps.currentSection === "explore") {
var capitalize = Metamaps.currentPage.charAt(0).toUpperCase() + Metamaps.currentPage.slice(1);
Metamaps.Views.exploreMaps.setCollection( Metamaps.Maps[capitalize] );
Metamaps.Views.exploreMaps.render();
f.maps.show();
f.explore.set(Metamaps.currentPage);
f.explore.show();
}
else if (Metamaps.currentSection === "") {
Metamaps.Loading.loader.hide();
if (Metamaps.Active.Mapper) {
Metamaps.Views.exploreMaps.setCollection( Metamaps.Maps.Mine );
Metamaps.Views.exploreMaps.render();
f.maps.show();
f.explore.set('mine');
f.explore.show();
}
else f.explore.set('featured');
}
};
// EXPLORE MAPS BAR
@ -214,17 +280,4 @@ define(function(require, exports, module) {
f.mainContext.add(f.toast.mod).add(f.toast.surf);
f.logo.show();
if (Metamaps.currentSection === "explore") {
Metamaps.Loading.loader.hide();
f.explore.set(Metamaps.currentPage);
f.explore.show();
}
else if (Metamaps.currentSection === "") {
Metamaps.Loading.loader.hide();
if (Metamaps.Active.Mapper) {
f.explore.set('mine');
f.explore.show();
}
else f.explore.set('featured');
}
});