metamaps--metamaps/app/views/maps/show.html.erb

<%#
  # @file
  # Code to display a map
  # /maps/:id
  #%>
  
<% content_for :title, @map.name + " | Metamaps" %>

<!-- <div class="headertop">
    <div class="tab"></div>
    <button class="hidelabels" onclick="hideLabels();">Hide Labels</button>
    <button onclick="if (!goRealtime) { this.innerHTML = 'Stop Realtime'; } else if (goRealtime) { this.innerHTML = 'Start Realtime'; } goRealtime = !goRealtime;">Start Realtime</button>
    <% if authenticated? %>
      <% if (@map.permission == "commons" && authenticated?) || @map.user == user %>
			  <%= form_for @map, :url => savelayout_path(@map), :html => { :class => "saveMapLayout", :id => "saveMapLayout"}, remote: true do |form| %>
				  <%= form.hidden_field "coordinates", :value => "" %>
				  <%= form.submit "Save Layout", class: "saveLayout", id: "saveLayout" %>
			  <% end %>
		  <% end %>
      <button onclick="saveToMap();">Save to New Map</button>
    <% end %>
    <button onclick='clearCanvas();'>Clear Canvas</button>
</div>
<div class="clearfloat"></div> -->

<div class="index">
  <div class="openCheatsheet"></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>
</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 => 'maps/new' %>
<% end %>
  
<script>
  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);
		});
	}
  
  function subscribeToRooms() {
    window.app.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.app.addTopicToMap(topic);
          }
          else if (data.action == 'update' && Mconsole.graph.getNode(topic.id) != 'undefined') {
            window.app.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.app.addSynapseToMap(synapse);
          }
          else if (data.action == 'update' && 
                   Mconsole.graph.getAdjacence(synapse.data.$direction['0'], synapse.data.$direction['1']) != 'undefined') {
            window.app.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>