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

<%#
  # @file
  # This shows a topic view. It is used.
  # The first commented out section used to be a card at the top showing all
  # info. Now we're moving towards most screens looking the same. The
  # consequence of accessing data from this view is that you can't remove
  # the topic that corresponds to the page you're on. Originally, accessing this
  # page showed the topic with its neighbours arrayed around. Now it shows the
  # same, but there's no cues to say which topic's page you're on. So when the
  # map recenters on a new topic, it's like you're on that topic's page.
  # Nice, but the URL and being unable to remove the root node still hamper that
  # experience.
  # URL: /topics/<topicid>
  #
  #%>

<% content_for :title, @topic.name + " | Metamaps" %>  
  
<% if authenticated? %>
<div class="sidebarWand topicView">
  <div class="sidebarWandIcon"></div>
  <div class="sidebarWandBox">
    <ul>
      <li class="wandIcon wandForkMap">Save As Map</li>
      <li class="wandIcon wandChangeMetacodes">Switch Metacode Set</li>
    </ul>
  </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"></div>
  <span><img width="35" height="35" src="/assets/<%= @topic.metacode.icon %>"></span>
  <span class="mapName"><%= @topic.name %></span>
  <span class="mapInfo"></span>
  <div class="clearfloat"></div>
</div>

<div class="relatives" id="container">
  <div id="center-container">
    <div id="infovis"></div>    
  </div>
  <div class="showcard" id="showcard"></div>
</div>
<div class="clearfloat"></div>

<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','rgba(0,0,0,0.7)');
              $('.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','rgba(0,0,0,0.7)');
            $('.sidebarAccountIcon').css('background-color','rgba(0,0,0,0.7)');
            
            $('.sidebarWandIcon').css('background-color','rgba(0,0,0,0.9)');
            $('.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','rgba(0,0,0,0.7)');
              $('.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','rgba(0,0,0,0.7)');
            $('.sidebarWandIcon').css('background-color','rgba(0,0,0,0.7)');
            
            $('.sidebarFilterIcon').css('background-color','rgba(0,0,0,0.9)');
            $('.sidebarFilterBox').fadeIn(200, function() {
                 sliding1 = false;
                 filterIsOpen = true;
            });
        }
      }
        // bind the hover events
        $(".sidebarFilter").hover(openFilter, closeFilter);
        
   } // end bindFilterHover
   bindWandHover();
   bindFilterHover();
   
   $('.showcard').draggable({ handle: ".icon" });
   $('#showcard').resizable({
     maxHeight: 500,
     maxWidth: 500,
     minHeight: 320,
     minWidth: 226
   }).css({
     display: 'none',
     top: '300px',
     left: '100px'
   });
   
  });
  
  
  json = <%= @relatives %>;
	$(window).load(function() {
		initialize("centered");
	});
</script>

<% if authenticated? %>
  <%= render :partial => 'topics/new' %>
  <%= render :partial => 'synapses/new' %>
  <%= render :partial => 'maps/fork' %>
<% end %>