anchor.diff:        </div>
     </div><!-- /leftpanel1 -->
   
  +<script>
  +var eventsJson = null
  +$.ajax({
  +  method: "get",
  +  url: "/events/all",
  +  dataType: "json",
  +  success: function(data) {
  +    eventsJson = data;
  +    refresh();
  +  }
  +})
  +
  +
  +var footballVal = 'on', campVal = 'on', recreationalVal = 'on', gymnasticsVal = "on", basketballVal = "on", tennisVal = "on", aquaticVal = "on", fitnessVal = "on", otherVal = "on", filteredIds = [];
  +
  +var eventsType = ['Football', 'Camp', 'Recreational', 'Basketball', 'Gymnastics', 'Tennis', 'Aquatic', 'Fitness', 'Other'];
  +var filteredEvents = [];
  +setTimeout(refresh, 1000);
  +setTimeout(refresh, 3000);
  +setTimeout(refresh, 2000);
  +setTimeout(refresh, 2000);
  +
  +// refresh()
  +// var fixedJson = JSON.parse(originalJson);
  +// var eventsJson = originalJson.events;
  +
  +//football
  +$('#football').change(function(){
  +  if(footballVal==('on')) {
  +    for(var i = 0; i < eventsType.length; i++){
  +      if (eventsType[i] === "Football") {
  +        eventsType.splice(i, 1);
  +      }
  +    }
  +    footballVal = 'off'
  +  } else {
  +    eventsType.push("Football");
  +    footballVal = 'on'
  +  }
  +  refresh();
  +});
  +
  +//camp
  +$('#camp').change(function(){
  +  if(campVal==('on')) {
  +    for(var i = 0; i < eventsType.length; i++){
  +      if (eventsType[i] === "Camp") {
  +        eventsType.splice(i, 1);
  +      }
  +    }
  +    campVal = 'off'
  +  } else {
  +    eventsType.push("Camp");
  +    campVal = 'on'
  +  }
  +  refresh();
  +});
  +
  +//recreational
  +$('#recreational').change(function(){
  +  if(recreationalVal==('on')) {
  +    for(var i = 0; i < eventsType.length; i++){
  +      if (eventsType[i] === "Recreational") {
  +        eventsType.splice(i, 1);
  +      }
  +    }
  +    recreationalVal = 'off'
  +  } else {
  +    eventsType.push("Recreational");
  +    recreationalVal = 'on'
  +  }
  +  refresh();
  +});
  +
  +//basketball
  +$('#basketball').change(function(){
  +  if(basketballVal==('on')) {
  +    for(var i = 0; i < eventsType.length; i++){
  +      if (eventsType[i] === "Basketball") {
  +        eventsType.splice(i, 1);
  +      }
  +    }
  +    basketballVal = 'off'
  +  } else {
  +    eventsType.push("Basketball");
  +    basketballVal = 'on'
  +  }
  +  refresh();
  +});
  +
  +//tennis
  +$('#tennis').change(function(){
  +  if(tennisVal==('on')) {
  +    for(var i = 0; i < eventsType.length; i++){
  +      if (eventsType[i] === "Tennis") {
  +        eventsType.splice(i, 1);
  +      }
  +    }
  +    tennisVal = 'off'
  +  } else {
  +    eventsType.push("Tennis");
  +    tennisVal = 'on'
  +  }
  +  refresh();
  +});
  +
  +//aquatic
  +$('#aquatic').change(function(){
  +  if(aquaticVal==('on')) {
  +    for(var i = 0; i < eventsType.length; i++){
  +      if (eventsType[i] === "Aquatic") {
  +        eventsType.splice(i, 1);
  +      }
  +    }
  +    aquaticVal = 'off'
  +  } else {
  +    eventsType.push("Aquatic");
  +    aquaticVal = 'on'
  +  }
  +  refresh();
  +});
  +
  +//gymnastics
  +$('#gymnastics').change(function(){
  +  if(gymnasticsVal==('on')) {
  +    for(var i = 0; i < eventsType.length; i++){
  +      if (eventsType[i] === "Gymnastics") {
  +        eventsType.splice(i, 1);
  +      }
  +    }
  +    gymnasticsVal = 'off'
  +  } else {
  +    eventsType.push("Gymnastics");
  +    gymnasticsVal = 'on'
  +  }
  +  refresh();
  +});
  +
  +//fitness
  +$('#fitness').change(function(){
  +  if(fitnessVal==('on')) {
  +    for(var i = 0; i < eventsType.length; i++){
  +      if (eventsType[i] === "Fitness") {
  +        eventsType.splice(i, 1);
  +      }
  +    }
  +    fitnessVal = 'off'
  +  } else {
  +    eventsType.push("Fitness");
  +    fitnessVal = 'on'
  +  }
  +  refresh();
  +});
  +
  +//other
  +$('#other').change(function(){
  +  if(otherVal==('on')) {
  +    for(var i = 0; i < eventsType.length; i++){
  +      if (eventsType[i] === "Other") {
  +        eventsType.splice(i, 1);
  +      }
  +    }
  +    otherVal = 'off'
  +  } else {
  +    eventsType.push("Other");
  +    otherVal = 'on'
  +  }
  +  refresh();
  +});
  +
  +function refresh() {
  +  filteredEvents = [];
  +  for (var i = 0; i < eventsType.length; i++)
  +    {
  +      for (var j = 0; j < eventsJson.length; j++)
  +      {
  +        if (eventsType[i] === eventsJson[j].event_type)
  +        {
  +          filteredEvents.push(eventsJson[j].name);
  +          filteredIds.push(eventsJson[j].id);
  +        }
  +      }
  +    }
  +
  +    filteredEvents.sort();
  +
  +    var output = '';
  +    $.each(filteredEvents, function (index, value) {
  +      output += '<li><a href="events/' + filteredIds[index] + '">' + value + '</a></li>';
  +    });
  +    $('#event-list').html(output).listview("refresh");
  +}
  +</script>
  +
   </div><!-- /page -->
  -
  -<script>
  -  var eventsJson = null
  -  $.ajax({
  -    method: "get",
  -    url: "/events/all",
  -    dataType: "json",
  -    success: function(data) {
  -      eventsJson = data;
  -      refresh();
  -      debugger;
  -    }
  -  })
  -
  -
  -  var footballVal = 'on', campVal = 'on', recreationalVal = 'on', gymnasticsVal = "on", basketballVal = "on", tennisVal = "on", aquaticVal = "on", fitnessVal = "on", otherVal = "on", filteredIds = [];
  -
  -  var eventsType = ['Football', 'Camp', 'Recreational', 'Basketball', 'Gymnastics', 'Tennis', 'Aquatic', 'Fitness', 'Other'];
  -  var filteredEvents = [];
  -  setTimeout(refresh, 1000);
  -  setTimeout(refresh, 3000);
  -  setTimeout(refresh, 2000);
  -  setTimeout(refresh, 2000);
  -
  -  // refresh()
  -  // var fixedJson = JSON.parse(originalJson);
  -  // var eventsJson = originalJson.events;
  -
  -  //football
  -  $('#football').change(function(){
  -    if(footballVal==('on')) {
  -      for(var i = 0; i < eventsType.length; i++){
  -        if (eventsType[i] === "Football") {
  -          eventsType.splice(i, 1);
  -        }
  -      }
  -      footballVal = 'off'
  -    } else {
  -      eventsType.push("Football");
  -      footballVal = 'on'
  -    }
  -    refresh();
  -    console.log(footballVal);
  -    console.log(eventsType);
  -  });
  -
  -  //camp
  -  $('#camp').change(function(){
  -    if(campVal==('on')) {
  -      for(var i = 0; i < eventsType.length; i++){
  -        if (eventsType[i] === "Camp") {
  -          eventsType.splice(i, 1);
  -        }
  -      }
  -      campVal = 'off'
  -    } else {
  -      eventsType.push("Camp");
  -      campVal = 'on'
  -    }
  -    refresh();
  -    console.log(campVal);
  -    console.log(eventsType);
  -  });
  -
  -  //recreational
  -  $('#recreational').change(function(){
  -    if(recreationalVal==('on')) {
  -      for(var i = 0; i < eventsType.length; i++){
  -        if (eventsType[i] === "Recreational") {
  -          eventsType.splice(i, 1);
  -        }
  -      }
  -      recreationalVal = 'off'
  -    } else {
  -      eventsType.push("Recreational");
  -      recreationalVal = 'on'
  -    }
  -    refresh();
  -    console.log(recreationalVal);
  -    console.log(eventsType);
  -  });
  -
  -  //basketball
  -  $('#basketball').change(function(){
  -    if(basketballVal==('on')) {
  -      for(var i = 0; i < eventsType.length; i++){
  -        if (eventsType[i] === "Basketball") {
  -          eventsType.splice(i, 1);
  -        }
  -      }
  -      basketballVal = 'off'
  -    } else {
  -      eventsType.push("Basketball");
  -      basketballVal = 'on'
  -    }
  -    refresh();
  -    console.log(basketballVal);
  -    console.log(eventsType);
  -  });
  -
  -  //tennis
  -  $('#tennis').change(function(){
  -    if(tennisVal==('on')) {
  -      for(var i = 0; i < eventsType.length; i++){
  -        if (eventsType[i] === "Tennis") {
  -          eventsType.splice(i, 1);
  -        }
  -      }
  -      tennisVal = 'off'
  -    } else {
  -      eventsType.push("Tennis");
  -      tennisVal = 'on'
  -    }
  -    refresh();
  -    console.log(tennisVal);
  -    console.log(eventsType);
  -  });
  -
  -  //aquatic
  -  $('#aquatic').change(function(){
  -    if(aquaticVal==('on')) {
  -      for(var i = 0; i < eventsType.length; i++){
  -        if (eventsType[i] === "Aquatic") {
  -          eventsType.splice(i, 1);
  -        }
  -      }
  -      aquaticVal = 'off'
  -    } else {
  -      eventsType.push("Aquatic");
  -      aquaticVal = 'on'
  -    }
  -    refresh();
  -    console.log(aquaticVal);
  -    console.log(eventsType);
  -  });
  -
  -  //gymnastics
  -  $('#gymnastics').change(function(){
  -    if(gymnasticsVal==('on')) {
  -      for(var i = 0; i < eventsType.length; i++){
  -        if (eventsType[i] === "Gymnastics") {
  -          eventsType.splice(i, 1);
  -        }
  -      }
  -      gymnasticsVal = 'off'
  -    } else {
  -      eventsType.push("Gymnastics");
  -      gymnasticsVal = 'on'
  -    }
  -    refresh();
  -    console.log(gymnasticsVal);
  -    console.log(eventsType);
  -  });
  -
  -  //fitness
  -  $('#fitness').change(function(){
  -    if(fitnessVal==('on')) {
  -      for(var i = 0; i < eventsType.length; i++){
  -        if (eventsType[i] === "Fitness") {
  -          eventsType.splice(i, 1);
  -        }
  -      }
  -      fitnessVal = 'off'
  -    } else {
  -      eventsType.push("Fitness");
  -      fitnessVal = 'on'
  -    }
  -    refresh();
  -    console.log(fitnessVal);
  -    console.log(eventsType);
  -  });
  -
  -  //other
  -  $('#other').change(function(){
  -    if(otherVal==('on')) {
  -      for(var i = 0; i < eventsType.length; i++){
  -        if (eventsType[i] === "Other") {
  -          eventsType.splice(i, 1);
  -        }
  -      }
  -      otherVal = 'off'
  -    } else {
  -      eventsType.push("Other");
  -      otherVal = 'on'
  -    }
  -    refresh();
  -    console.log(otherVal);
  -    console.log(eventsType);
  -  });
  -
  -  function refresh() {
  -    console.log("freshing");
  -    filteredEvents = [];
  -    for (var i = 0; i < eventsType.length; i++)
  -      {
  -        for (var j = 0; j < eventsJson.length; j++)
  -        {
  -          if (eventsType[i] === eventsJson[j].event_type)
  -          {
  -            filteredEvents.push(eventsJson[j].name);
  -            filteredIds.push(eventsJson[j].id);
  -          }
  -        }
  -      }
  -      var output = '';
  -      $.each(filteredEvents, function (index, value) {
  -        output += '<li><a href="events/' + filteredIds[index] + '">' + value + '</a></li>';
  -      });
  -      $('#event-list').html(output).listview("refresh");
  -      console.log(filteredEvents);
  -    }
  -
  -
  -
  -</script>
   
   </body>
   
  
positive.code:       <h4>Find Events</h4>
          <ul data-role="listview">
            <li><a href="#topicList", data-ajax="false">Today</a></li>
            <li><a href="", data-ajax="false">Tomorrow</a></li>
            <li><a href="", data-ajax="false">This Week</a></li>
        </ul>
      </div>
    </div>
  
negative.code:     <div data-role="collapsible" data-collapsed="false">
        <h4>My Events</h4>
          <ul data-role="listview">
            <li><a href="#topicList"><%=Event.find(4).name%></a></li>
            <li><a href="#topicList"><%=Event.find(5).name%></a></li>
            <li><a href="#topicList"><%=Event.find(6).name%></a></li>
            <li><a href="#topicList"><%=Event.find(7).name%></a></li>
        </ul>
      </div>
  
      <div data-role="collapsible" data-collapsed="false">
        <h4>Trending</h4>
          <ul data-role="listview">
            <li><a href="#topicList"><%=Event.find(1).name%></a></li>
            <li><a href="#topicList"><%=Event.find(2).name%></a></li>
            <li><a href="#topicList"><%=Event.find(3).name%></a></li>
        </ul>
      </div>
  
  