metamaps--metamaps/app/views/maps/show.html.erb
2014-02-10 02:03:06 -05:00

299 lines
No EOL
8.8 KiB
Text

<%#
# @file
# Code to display a map
# /maps/:id
#%>
<% content_for :title, @map.name + " | Metamaps" %>
<% if authenticated? %>
<% if @map.permission == "commons" || @map.user == user %>
<div class="sidebarSave">
<div class="sidebarSaveIcon"></div>
<div class="sidebarSaveBox"></div>
</div>
<% end %>
<div class="sidebarFork">
<div class="sidebarForkIcon"></div>
<div class="sidebarForkBox"></div>
</div>
<div class="sidebarCollaborate">
<div class="sidebarCollaborateIcon"></div>
<div class="sidebarCollaborateBox">
</div>
</div>
<% end %>
<div class="sidebarFilter <%= authenticated? ? 'loggedin' : 'loggedout' %>">
<div class="sidebarFilterIcon"></div>
<div class="sidebarFilterBox">
<h3 class="filterByMetacode">Filter By Metacode</h3><span class="showAll">all</span><span class="hideAll">none</span>
<div class="clearfloat"></div>
<%= render :partial => 'main/filterbymetacode' %>
</div>
</div>
<div class="index">
<div class="openCheatsheet openLightbox" data-open="cheatsheet"></div>
<span><img width="35" height="35" src="/assets/map.png"></span>
<span class="mapName"><%= @map.name %></span>
<span class="mapInfo"></span>
<div class="clearfloat"></div>
<%= render :partial => 'maps/mapinfobox' %>
</div>
<div class="maps onMap" id="container">
<div id="center-container">
<div id="infovis"></div>
</div>
<div class="showcard" id="showcard"></div>
</div>
<div class="clearfloat"></div>
<% if authenticated? %>
<%= render :partial => 'newtopic' %>
<%= render :partial => 'newsynapse' %>
<%= render :partial => 'main/metacodeoptions' %>
<% # for saving layouts %>
<% if @map.permission == "commons" || @map.user == user %>
<%= form_for @map, :url => savelayout_path(@map), :html => { :class => "saveMapLayout", :id => "saveMapLayout"}, remote: true do |form| %>
<%= form.hidden_field "coordinates", :value => "" %>
<% end %>
<% end %>
<% end %>
<script>
$(document).ready(function() {
function bindWandHover() {
var wandIsOpen = false
// controls the sliding hover of the bottom left menu
var sliding1 = false;
var lT;
var closeWand = function() {
lT = setTimeout(function() {
if (! sliding1) {
sliding1 = true;
$('.sidebarWandIcon').css('background-color','#0F1519');
$('.sidebarWandBox').fadeOut(200, function() {
sliding1 = false;
wandIsOpen = false;
});
}
},300);
}
var openWand = function() {
clearTimeout(lT);
if (! sliding1) {
sliding1 = true;
// hide the other two
$('.sidebarAccountBox').hide();
$('.sidebarFilterBox').hide();
$('.sidebarFilterIcon').css('background-color','#0F1519');
$('.sidebarAccountIcon').css('background-color','#0F1519');
$('.sidebarWandIcon').css('background-color','#000');
$('.sidebarWandBox').fadeIn(200, function() {
sliding1 = false;
wandIsOpen = true;
});
}
}
// bind the hover events
$(".sidebarWand").hover(openWand, closeWand);
// attach events for clicking on wand actions
$('li.wandSaveLayout').click(function() {
saveLayoutAll();
});
$('li.wandForkMap').click(function() {
saveToMap();
closeWand();
});
$('li.wandFilter').click(function() {
return;
});
} // end bindWandHover
function bindFilterHover() {
var filterIsOpen = false
// controls the sliding hover of the bottom left menu
var sliding1 = false;
var lT;
var closeFilter = function() {
lT = setTimeout(function() {
if (! sliding1) {
sliding1 = true;
$('.sidebarFilterIcon').css('background-color','#0F1519');
$('.sidebarFilterBox').fadeOut(200, function() {
sliding1 = false;
filterIsOpen = false;
});
}
},300);
}
var openFilter = function() {
clearTimeout(lT);
if (! sliding1) {
sliding1 = true;
// hide the other two
$('.sidebarAccountBox').hide();
$('.sidebarWandBox').hide();
$('.sidebarAccountIcon').css('background-color','#0F1519');
$('.sidebarWandIcon').css('background-color','#0F1519');
$('.sidebarFilterIcon').css('background-color','#000');
$('.sidebarFilterBox').fadeIn(200, function() {
sliding1 = false;
filterIsOpen = true;
});
}
}
// bind the hover events
$(".sidebarFilter").hover(openFilter, closeFilter);
} // end bindFilterHover
function bindInfoHover() {
var infoIsOpen = false
// controls the sliding hover of the bottom left menu
var sliding1 = false;
var lT;
var closeInfo = function() {
lT = setTimeout(function() {
if (! sliding1) {
sliding1 = true;
$('.mapInfoBox').fadeOut(200, function() {
sliding1 = false;
infoIsOpen = false;
});
}
},300);
}
var openInfo = function(event) {
clearTimeout(lT);
if (! sliding1 && event.target.className != "openCheatsheet openLightbox") {
sliding1 = true;
$('.mapInfoBox').fadeIn(200, function() {
sliding1 = false;
infoIsOpen = true;
});
}
}
// bind the hover events
$("div.index").hover(openInfo, closeInfo);
} // end bindWandHover
bindWandHover();
bindFilterHover();
bindInfoHover();
$(".sidebarCollaborateIcon").click(function(event) {
goRealtime = !goRealtime;
$(".sidebarCollaborateIcon").toggleClass("blue");
});
// initialize best_in_place editing
$('.authenticated div.permission.canEdit .best_in_place').best_in_place();
$('.showcard').draggable({ handle: ".metacodeImage" });
$('#showcard').resizable({
maxHeight: 500,
maxWidth: 500,
minHeight: 320,
minWidth: 226
}).css({
display: 'none',
top: '300px',
left: '100px'
});
});
var dragged = 0;
mapid = <%= @map.id %>;
<% if (@map.permission == "commons" && authenticated?) || @map.user == user %>
mapperm = true;
<% end %>
viewMode = "graph";
json = <%= @mapjson %>;
if (json.length > 0) {
$(window).load(function() {
<% if (@map.arranged) %>
initialize("arranged");
<% else %>
initialize("chaotic");
<% end %>
});
}
else {
$(window).load(function() {
initialize("chaotic", true);
});
}
//window.realtime.socket = io.connect('http://gentle-savannah-1303.herokuapp.com');
window.realtime.socket = io.connect('http://metamaps.cc:5001');
window.realtime.socket.on('connect', function() {
subscribeToRooms();
console.log('socket connected');
});
function subscribeToRooms() {
window.realtime.socket.on('maps-' + mapid, function(data) {
//as long as you weren't the origin of the changes, update your map
if (data.origin != userid && goRealtime) {
if (data.resource == 'Topic') {
topic = $.parseJSON(data.obj);
if (data.action == 'create') {
window.realtime.addTopicToMap(topic);
}
else if (data.action == 'update' && Mconsole.graph.getNode(topic.id) != 'undefined') {
window.realtime.updateTopicOnMap(topic);
}
else if (data.action == 'destroy' && Mconsole.graph.getNode(topic.id) != 'undefined') {
hideNode(topic.id)
}
return;
}
else if (data.resource == 'Synapse') {
synapse = $.parseJSON(data.obj);
if (data.action == 'create') {
window.realtime.addSynapseToMap(synapse);
}
else if (data.action == 'update' &&
Mconsole.graph.getAdjacence(synapse.data.$direction['0'], synapse.data.$direction['1']) != 'undefined') {
window.realtime.updateSynapseOnMap(synapse);
}
else if (data.action == 'destroy' &&
Mconsole.graph.getAdjacence(synapse.data.$direction['0'], synapse.data.$direction['1']) != 'undefined') {
var edge = Mconsole.graph.getAdjacence(synapse.data.$direction['0'], synapse.data.$direction['1']);
hideEdge(edge);
}
return;
}
}
});
}
</script>