tags.html 2.5 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788
  1. <!DOCTYPE HTML>
  2. {% extends "base.html" %}
  3. {% block head %}
  4. {{ super() }}
  5. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  6. <script>
  7. (function ($) {
  8. // custom css expression for a case-insensitive contains()
  9. jQuery.expr[':'].Contains = function(a,i,m){
  10. return (a.textContent || a.innerText || "").toUpperCase().indexOf(m[3].toUpperCase())>=0;
  11. };
  12. function listFilter() {
  13. $('.filterinput')
  14. .change( function () {
  15. var filter = $(this).val();
  16. if(filter) {
  17. // this finds all links in a list that contain the input,
  18. // and hide the ones not containing the input while showing the ones that do
  19. $('.list-of-tags').find("a:not(:Contains(" + filter + "))").parent().hide();
  20. $('.list-of-tags').find("a:Contains(" + filter + ")").parent().show();
  21. } else {
  22. $('.list-of-tags').find("li").show();
  23. }
  24. return false;
  25. })
  26. .keyup( function () {
  27. // fire the above change event after every letter
  28. $(this).change();
  29. });
  30. }
  31. //ondomready
  32. $(function () {
  33. listFilter($());
  34. });
  35. }(jQuery));
  36. </script>
  37. {% endblock head %}
  38. {% block title %}
  39. All Tags - {{ super() }}
  40. {% endblock title %}
  41. {% block content %}
  42. <div class="row-fluid">
  43. <header class="page_header span10 offset2">
  44. <h1><a href="/tags.html">All Tags</a></h1>
  45. </header>
  46. </div>
  47. <div class="row-fluid">
  48. <div class="span8 offset2">
  49. <form class="form-search">
  50. <input type="text" class="input-medium search-query filterinput" placeholder="Find a tag">
  51. </form>
  52. <ul class="list-of-tags">
  53. {% for tag, articles in tags %}
  54. <li>
  55. {% set num = articles|count %}
  56. <a href="/tags.html#{{ tag|replace(' ', '-')|e }}-ref">{{ tag }}<span>{{ num }}</span></a>
  57. </li>
  58. {% endfor %}
  59. </ul>
  60. </div>
  61. </div>
  62. <div class="row-fluid">
  63. <div class="span8 offset2">
  64. {% for tag, articles in tags %}
  65. <h2 id="{{ tag|replace(' ', '-')|e }}-ref" class="tag-title">{{ tag }}</h2>
  66. <ul>
  67. {% for article in articles %}
  68. <li><a href="{{ article.url }}">{{ article.title }}</a></li>
  69. {% endfor %}
  70. </ul>
  71. {% endfor %}
  72. </div>
  73. </div>
  74. {% endblock content %}