introduced the metamaps.router
This commit is contained in:
Connor Turland
parent
3476d0126c
commit
e08c702494
|
|
@ -17,4 +17,5 @@
|
|||
//= require ./orderedLibraries/backbone
|
||||
//= require_directory ./librariesForAllPages
|
||||
//= require ./metamaps/Metamaps.GlobalUI
|
||||
//= require ./metamaps/Metamaps.Router
|
||||
//= require ./metamaps/Metamaps.Backbone
|
||||
|
|
@ -3083,7 +3083,7 @@ var Canvas;
|
|||
ctx.fillStyle = Metamaps.Settings.colors.background;
|
||||
var xPoint = (-(canvas.width/scale)/2) - (base.translateOffsetX/scale),
|
||||
yPoint = (-(canvas.height/scale)/2) - (base.translateOffsetY/scale);
|
||||
ctx.fillRect(xPoint,yPoint,canvas.width/scale,canvas.height/scale);
|
||||
//ctx.fillRect(xPoint,yPoint,canvas.width/scale,canvas.height/scale);
|
||||
}
|
||||
});
|
||||
// END METAMAPS CODE
|
||||
|
|
@ -6302,13 +6302,15 @@ var EdgeHelper = {
|
|||
maxPosX = max(posFrom.x, posTo.x),
|
||||
minPosY = min(posFrom.y, posTo.y),
|
||||
maxPosY = max(posFrom.y, posTo.y);
|
||||
|
||||
|
||||
if(pos.x >= minPosX && pos.x <= maxPosX
|
||||
&& pos.y >= minPosY && pos.y <= maxPosY) {
|
||||
if(Math.abs(posTo.x - posFrom.x) <= epsilon) {
|
||||
|
||||
return true;
|
||||
}
|
||||
var dist = (posTo.y - posFrom.y) / (posTo.x - posFrom.x) * (pos.x - posFrom.x) + posFrom.y;
|
||||
|
||||
return Math.abs(dist - pos.y) <= epsilon;
|
||||
}
|
||||
return false;
|
||||
|
|
|
|||
|
|
@ -413,9 +413,14 @@ Metamaps.JIT = {
|
|||
Metamaps.JIT.edgeRender(adj, canvas)
|
||||
},
|
||||
'contains': function (adj, pos) {
|
||||
var from = adj.nodeFrom.pos.getc(true),
|
||||
to = adj.nodeTo.pos.getc(true);
|
||||
|
||||
var from = adj.nodeFrom.pos.getc(),
|
||||
to = adj.nodeTo.pos.getc();
|
||||
|
||||
// this fixes an issue where when edges are perfectly horizontal or perfectly vertical
|
||||
// it becomes incredibly difficult to hover over them
|
||||
if (-1 < pos.x && pos.x < 1) pos.x = 0;
|
||||
if (-1 < pos.y && pos.y < 1) pos.y = 0;
|
||||
|
||||
return $jit.Graph.Plot.edgeHelper.line.contains(from, to, pos, adj.Edge.epsilon);
|
||||
}
|
||||
}
|
||||
|
|
@ -808,12 +813,14 @@ Metamaps.JIT = {
|
|||
tempInit = false;
|
||||
} else if (!tempInit && node && !node.nodeFrom) {
|
||||
// this means you dragged an existing node, autosave that to the database
|
||||
mapping = node.getData('mapping');
|
||||
mapping.set({
|
||||
xloc: node.getPos().x,
|
||||
yloc: node.getPos().y
|
||||
});
|
||||
mapping.save();
|
||||
if (Metamaps.Active.Map) {
|
||||
mapping = node.getData('mapping');
|
||||
mapping.set({
|
||||
xloc: node.getPos().x,
|
||||
yloc: node.getPos().y
|
||||
});
|
||||
mapping.save();
|
||||
}
|
||||
}
|
||||
}, //onDragEndTopicHandler
|
||||
canvasClickHandler: function (canvasLoc, e) {
|
||||
|
|
|
|||
35
app/assets/javascripts/metamaps/Metamaps.Router.js
Normal file
35
app/assets/javascripts/metamaps/Metamaps.Router.js
Normal file
|
|
@ -0,0 +1,35 @@
|
|||
(function () {
|
||||
var Router = Backbone.Router.extend({
|
||||
routes: {
|
||||
"": "home", // #home
|
||||
"explore/:section": "explore", // #explore/active
|
||||
"maps/:id": "maps" // #maps/7
|
||||
},
|
||||
explore: function (section) {
|
||||
console.log(section);
|
||||
},
|
||||
maps: function (id) {
|
||||
console.log(id);
|
||||
}
|
||||
});
|
||||
Metamaps.Router = new Router();
|
||||
Metamaps.Router.init = function () {
|
||||
Backbone.history.start({
|
||||
pushState: true,
|
||||
root: ''
|
||||
});
|
||||
console.log('router started');
|
||||
$(document).on("click", "a:not([data-bypass])", function (evt) {
|
||||
var href = {
|
||||
prop: $(this).prop("href"),
|
||||
attr: $(this).attr("href")
|
||||
};
|
||||
var root = location.protocol + "//" + location.host + Backbone.history.options.root;
|
||||
|
||||
if (href.prop && href.prop.slice(0, root.length) === root) {
|
||||
evt.preventDefault();
|
||||
Backbone.history.navigate(href.attr, true);
|
||||
}
|
||||
});
|
||||
}
|
||||
})();
|
||||
|
|
@ -88,7 +88,6 @@ body,
|
|||
.wrapper,
|
||||
#container {
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
.unauthenticated .wrapper.homePage {
|
||||
overflow: auto;
|
||||
|
|
@ -96,6 +95,9 @@ body,
|
|||
.wrapper.homePage {
|
||||
background: url('mm-homepage-bg-image.png') no-repeat center -249px;
|
||||
}
|
||||
body.mapBody {
|
||||
overflow: hidden;
|
||||
}
|
||||
/* scrollbar override */
|
||||
|
||||
.maps > div > div.mCS_no_scrollbar {
|
||||
|
|
@ -111,7 +113,7 @@ body,
|
|||
width: auto;
|
||||
}
|
||||
html {} body {
|
||||
background: url(background2-for-repeating.jpg);
|
||||
background: #E5E5E5;
|
||||
font-family: 'LatoLight', helvetica, sans-serif;
|
||||
color: #FFF;
|
||||
}
|
||||
|
|
@ -196,6 +198,7 @@ input[type="submit"]:hover {
|
|||
/*#barometer_tab {
|
||||
display: none;
|
||||
}*/
|
||||
|
||||
#saveMapLayout {
|
||||
display: none;
|
||||
}
|
||||
|
|
@ -557,7 +560,7 @@ label[for="user_remember_me"] {
|
|||
/* account */
|
||||
|
||||
.sidebarAccount {
|
||||
position: absolute;
|
||||
position: fixed;
|
||||
top: 10px;
|
||||
right: 10px;
|
||||
z-index: 200;
|
||||
|
|
@ -683,7 +686,7 @@ li.accountInvite span {
|
|||
/* Save To New Map */
|
||||
|
||||
.sidebarFork {
|
||||
position: absolute;
|
||||
position: fixed;
|
||||
top: 10px;
|
||||
right: 120px;
|
||||
z-index: 200;
|
||||
|
|
@ -869,7 +872,7 @@ h3.filterByMetacode {
|
|||
/* collaborate */
|
||||
|
||||
.sidebarCollaborate {
|
||||
position: absolute;
|
||||
position: fixed;
|
||||
top: 10px;
|
||||
right: 200px;
|
||||
z-index: 200;
|
||||
|
|
@ -949,17 +952,36 @@ h3.realtimeBoxTitle {
|
|||
|
||||
/* search */
|
||||
|
||||
.sidebarSearch {
|
||||
position: absolute;
|
||||
.homeButton {
|
||||
position: fixed;
|
||||
top: 10px;
|
||||
left: 10px;
|
||||
width: 35px;
|
||||
height: 35px;
|
||||
z-index: 200;
|
||||
background: white;
|
||||
border-top-left-radius: 2px;
|
||||
border-bottom-left-radius: 2px;
|
||||
}
|
||||
|
||||
.homeButton a {
|
||||
display:block;
|
||||
width: 35px;
|
||||
height: 35px;
|
||||
}
|
||||
|
||||
.sidebarSearch {
|
||||
position: fixed;
|
||||
top: 10px;
|
||||
left: 45px;
|
||||
height: 35px;
|
||||
z-index: 200;
|
||||
}
|
||||
.sidebarSearchIcon {
|
||||
float: left;
|
||||
width: 80px;
|
||||
border-radius: 2px;
|
||||
border-top-right-radius: 2px;
|
||||
border-bottom-right-radius: 2px;
|
||||
height: 35px;
|
||||
background: #00BCD4 url('search_icon_32x32.png') no-repeat center center;
|
||||
background-size: 25px 25px;
|
||||
|
|
@ -1269,7 +1291,7 @@ h3.realtimeBoxTitle {
|
|||
}
|
||||
#cards {
|
||||
height: 100%;
|
||||
width: 805px;
|
||||
width: 90%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
#cards p.empty {
|
||||
|
|
@ -2236,8 +2258,6 @@ div.mapInfoStat {
|
|||
height: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
|
||||
.addMap {
|
||||
display: block;
|
||||
position: fixed;
|
||||
|
|
@ -2257,12 +2277,12 @@ div.mapInfoStat {
|
|||
display: block;
|
||||
position: fixed;
|
||||
bottom: 10px;
|
||||
left:50%;
|
||||
margin-left:-55px;
|
||||
left: 50%;
|
||||
margin-left: -55px;
|
||||
z-index: 15000;
|
||||
}
|
||||
#logo a {
|
||||
color: #FFF;
|
||||
#logo {
|
||||
color: #6B6B6B;
|
||||
font-family: "vinyl", sans-serif;
|
||||
font-style: italic;
|
||||
text-transform: uppercase;
|
||||
|
|
|
|||
|
|
@ -14,7 +14,8 @@ class MainController < ApplicationController
|
|||
@maps = Map.find_all_by_featured(true).shuffle!
|
||||
@maps = @maps.slice(0,3)
|
||||
elsif authenticated?
|
||||
@maps = Map.order("updated_at DESC").where("permission != ?", "private").limit(3)
|
||||
#@maps = Map.order("updated_at DESC").where("permission != ?", "private").limit(3)
|
||||
@maps = Map.order("name ASC").find_all_by_user_id(@current.id)
|
||||
end
|
||||
|
||||
respond_with(@maps, @current)
|
||||
|
|
|
|||
|
|
@ -7,7 +7,6 @@
|
|||
<% account = current_user %>
|
||||
<h3 class="accountHeader">Hello <%= account.name.split[0...1][0] %>!</h3>
|
||||
<ul>
|
||||
<li class="accountIcon accountMaps"><a href="/maps/mappers/<%= account.id %>">My Maps</a></li>
|
||||
<li class="accountIcon accountSettings"><%= link_to "Account", edit_user_url(account) %></li>
|
||||
<% if account.admin %>
|
||||
<li class="accountIcon accountAdmin"><%= link_to "Admin", metacodes_path %></li>
|
||||
|
|
|
|||
|
|
@ -34,7 +34,11 @@
|
|||
<%= content_tag :div, class: authenticated? ? "main authenticated" : "main unauthenticated" do %>
|
||||
|
||||
<div class="wrapper <%= controller_name == "main" && action_name == "home" ? "homePage" : "" %>" id="wrapper">
|
||||
|
||||
|
||||
<div class="homeButton">
|
||||
<a href="/"></a>
|
||||
</div>
|
||||
|
||||
<div class="sidebarSearch">
|
||||
<div class="sidebarSearchIcon"></div>
|
||||
<input type="text" class="sidebarSearchField"></input>
|
||||
|
|
@ -58,7 +62,7 @@
|
|||
</div>
|
||||
|
||||
<div class="footer">
|
||||
<div id="logo"><%= link_to "metamaps", root_url %></div>
|
||||
<div id="logo">METAMAPS</div>
|
||||
</div>
|
||||
|
||||
<% end %>
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@
|
|||
|
||||
<% content_for :title, "Home | Metamaps" %>
|
||||
|
||||
|
||||
<% if !authenticated? %>
|
||||
<div id="preloaded-images">
|
||||
<img src="/assets/metacodes75ms300x300.gif" width="128 height="128" alt="Image 01" />
|
||||
</div>
|
||||
|
|
@ -16,15 +16,10 @@
|
|||
<div class="home_content">
|
||||
<div class="home_desc">
|
||||
<div class="welcomeTo">
|
||||
<% if !authenticated? %>
|
||||
Welcome to Metamaps
|
||||
<% elsif authenticated? %>
|
||||
Welcome back, <%= @current.name.split[0...1][0] %>!
|
||||
<% end %>
|
||||
</div>
|
||||
<img id="homeMapImage" src="/assets/metamap128x128.png" width="128" height="128" />
|
||||
|
||||
<% if !authenticated? %>
|
||||
<div class="metamapsIs">
|
||||
a home on the web for <span class="swapWord">
|
||||
<ul class="texts">
|
||||
|
|
@ -41,21 +36,14 @@
|
|||
</ul>
|
||||
</span>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
<div class="clearfloat"></div>
|
||||
|
||||
<p class="contact">
|
||||
<% if !authenticated? %>
|
||||
<a href="/request" class="request button">Request Invite</a>
|
||||
<a href="#" class="learnmore button openLightbox" data-open="about">Learn More</a>
|
||||
<% end %>
|
||||
<div class="featuredMaps">
|
||||
<% if !authenticated? %>
|
||||
explore featured maps from our community
|
||||
<% elsif authenticated? %>
|
||||
explore recently active maps
|
||||
<% end %>
|
||||
</div>
|
||||
</p>
|
||||
|
||||
|
|
@ -80,8 +68,7 @@
|
|||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<script>
|
||||
|
||||
$(document).ready(function() {
|
||||
|
|
@ -108,4 +95,50 @@ $(document).ready(function() {
|
|||
});
|
||||
|
||||
|
||||
</script>
|
||||
</script>
|
||||
|
||||
<% elsif authenticated? %>
|
||||
<div class="mapOrder">
|
||||
<span class="displaying">Displaying:</span>
|
||||
<div class="whichMaps">
|
||||
|
||||
<a href="/explore/active">Recently Active</a> /
|
||||
<a href="/explore/featured">Featured</a> /
|
||||
<a href="/explore/new">Newest First</a>
|
||||
/ <a href="/maps/mappers/<%= @current.id %>" class="active">Yours</a>
|
||||
</div>
|
||||
<div class="clearfloat"></div>
|
||||
</div>
|
||||
|
||||
<div class="mapsWrapper">
|
||||
<div class="maps" id="cards">
|
||||
<% @maps.each do |map| %>
|
||||
<%= render map %>
|
||||
<% end %>
|
||||
<div class="clearfloat"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
$(document).ready(function() {
|
||||
$('.authenticated div.permission.canEdit .best_in_place').best_in_place();
|
||||
|
||||
$('.scroll').each(function(index) {
|
||||
$(this).height( $(this).height() ).mCustomScrollbar();
|
||||
});
|
||||
|
||||
// when you change the title, make sure that the description doesn't overflow
|
||||
$('.best_in_place_name').bind('ajax:success', function() {
|
||||
var p = $(this).parents('.mapCard').find('.scroll');
|
||||
p.height( p.height() ).mCustomScrollbar('update');
|
||||
});
|
||||
|
||||
// when you change the description, update the scroll box field
|
||||
$('.best_in_place_desc').bind('ajax:success', function() {
|
||||
var s = $(this).parents('.scroll');
|
||||
s.height( s.height() ).mCustomScrollbar('update');
|
||||
});
|
||||
});
|
||||
</script>
|
||||
<% end %>
|
||||
|
||||
|
|
@ -8,10 +8,6 @@
|
|||
|
||||
<iframe class="requestInvite" src="https://docs.google.com/forms/d/1lWoKPFHErsDfV5l7-SvcHxwX3vDi9nNNVW0rFMgJwgg/viewform?embedded=true" width="700" frameborder="0" marginheight="0" marginwidth="0">Loading...</iframe>
|
||||
|
||||
<h1 class="index">
|
||||
Request Invite
|
||||
</h1>
|
||||
|
||||
<script>
|
||||
$(document).ready(function() {
|
||||
$('.requestInvite').height( (parseInt($('body').height()) - 40) );
|
||||
|
|
|
|||
|
|
@ -20,7 +20,7 @@
|
|||
<div class="linkItem topicCount"><%= map.topics.count %></div>
|
||||
<div class="linkItem synapseCount"><%= map.synapses.count %></div>
|
||||
<div class="linkItem mapPerm <%= map.mk_permission %>"></div>
|
||||
<a href="/maps/<%= map.id %>" class="linkItem topicPopout" title="Open Map in New Tab" target="_blank"></a>
|
||||
<a href="/maps/<%= map.id %>" class="linkItem topicPopout"></a>
|
||||
<div class="clearfloat"></div>
|
||||
</div>
|
||||
<div class="scroll">
|
||||
|
|
|
|||
|
|
@ -56,9 +56,5 @@ $(document).ready(function() {
|
|||
var s = $(this).parents('.scroll');
|
||||
s.height( s.height() ).mCustomScrollbar('update');
|
||||
});
|
||||
|
||||
$('.mapsWrapper').height( (parseInt($('body').height()) - 39) );
|
||||
var s = $('.maps');
|
||||
s.height( s.height() ).mCustomScrollbar();
|
||||
});
|
||||
</script>
|
||||
|
|
|
|||
Loading…
Reference in a new issue