metamaps--metamaps/app/views/main/home.html.erb

<%#
  # @file
  # Located at /
  # Shows 3 most recently created topics, synapses, and maps.
  #%>
  
<% content_for :title, "Home | Metamaps" %>   
  
<% if !authenticated? %>
<div id="preloaded-images">
   <img src="/assets/metacodes75ms300x300.gif" width="128 height="128" alt="Image 01" />
</div>  
  
<div class="home_bg">

<div class="home_content">
<div class="home_desc">
  <div class="welcomeTo">
      Welcome to Metamaps
  </div>
  <img id="homeMapImage" src="/assets/metamap128x128.png" width="128" height="128" />
  
    <div class="metamapsIs">
      a home on the web for <span class="swapWord">
        <ul class="texts">
        <li>building shared knowledge</li>
        <li>learning</li>
        <li>visioning</li>
        <li>conversing</li>
        <li>collaborating</li>
        <li>sensemaking</li>
        <li>innovating</li>
        <li>designing</li>
        <li>playing</li>
        <li>exploring</li>
        </ul>
      </span>
    </div>
</div>
<div class="clearfloat"></div>

<p class="contact">
    <a href="/request" class="request button">Request Invite</a>
    <a href="#" class="learnmore button openLightbox" data-open="about">Learn More</a>
  <div class="featuredMaps">
      explore featured maps from our community
  </div>
</p>

<div class="centeredProfile">
  <div id="homeMap">
    <figure id="homeFigure">
    <% @maps.each_with_index do |map, index| %>
      <% first = index == 0 ? true : false %>
      <%= render :partial => 'main/homemap', :locals => { :map => map, :first => first } %>
    <% end %>
    </figure>
  </div>
</div>
</div>
<div class="clearfloat"></div>

<div class="socialIcons">
  <a class="twitter" href="https://twitter.com/metamapps" target="_blank"></a>
  <a class="google" href="https://plus.google.com/u/0/communities/115060009262157699234" target="_blank"></a>
  <a class="wordpress" href="http://blog.metamaps.cc" target="_blank"></a>
  <div class="clearfloat"></div>
</div>

</div>
                         
<script>

$(document).ready(function() {
  // flip through these words on the homepage
  $('.swapWord').textillate({ 
       in: { effect: 'fadeIn', delay: 20 },
       out: { effect: 'fadeOut', sync: true }, 
       loop: true,
       minDisplayTime: 2000
  });
  
  $('#homeMapImage').hover(function() {
    $(this).attr('src','/assets/metacodes75ms300x300.gif');
  }, function() {
    $(this).attr('src','/assets/metamap128x128.png');
  });
                         
  $('#homeMap .desc').each(function() {
    $(this).height($(this).height()).mCustomScrollbar({
      mouseWheelPixels: 200
    });
  });

});


</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 %>