{% extends "nlayout.html" %}
{% load i18n %}
{% load libextras %}
{% block html_head %}
<link rel="stylesheet" type="text/css" href="{{ MEDIA_URL }}css/searchbar.css" />
<script type="text/javascript" src="{{ MEDIA_URL }}js/anchor_nav.js"></script>
<script type="text/javascript" src="{{ MEDIA_URL }}js/ProgressBar.js"></script>
<script type="text/javascript" src="{{ MEDIA_URL }}js/email_listing.js"></script>
{% block css %}{% endblock %}
<script type="text/javascript">
var current_anchor = new AnchorNavigation("{{ deflocation }}", {
  spin_target: "page"
});

function viewmail(event) {
  event.stop();
  if (event.target.parentNode.id) {
    var url = event.target.parentNode.id;
    event.target.parentNode.setStyle("background", "#ffffcc");
    {% if reset_wm_url %} 
    current_anchor.baseurl(url).update();
    {% else %}
    current_anchor.addbaseurl(url).update();
    {% endif %}
  }
}

function init_sortable_columns() {
  $$("th[class*=sortable]").addEvent("click", function(evt) {
    var tmp = "?";
    var order = (navparams.has("order")) ? navparams.get("order") : "";

    if (order == "") {
      order = current_anchor.getparam("order");
    }
    if (order.substring(1) == evt.target.id) {
      var sign = (order.charAt(0) == '+') ? '-' : '+';
      order = sign + evt.target.id;
    } else {
      order = "-" + evt.target.id;
    }
    navparams.set("order", order);
    current_anchor.setparams(navparams).update();
  });
}

function update_sortable_column() {
  if (!navparams.has("order")) {
    return;
  }
  var src = navparams.get("order").charAt(0) == "-" ? "down_arrow.png" : "up_arrow.png";
  var th = $$("th[id=" + navparams.get("order").substring(1) + "]");

  th.getElement("img").set("src", static_url("pics/" + src));
  th.getElement("img").setStyle("display", "block");
  th.addClass("selected");    
}

window.addEvent("domready", function() {
  navparams = new Hash({
    {% if navparams %}{% join navparams %}{% endif %}
  }); 
  {% block js %}{% endblock %}
  current_anchor.set_default_callback({{ defcallback }});
});
</script>
{% endblock %}
{% block content %}
{% block leftcol %}{% endblock %}
<div id="listing">{{ listing }}</div>
<div class="spacer"></div>
{% endblock %}
{% block footer %}
<div id="navbar">{{ navbar }}</div>
{% endblock %}