app/dangerous/templates/search.html.j2

   1 {% extends "base.html.j2" %}
   2 {% import 'macros.imp.j2' as macros %}
   3
   4 {% block title %}
   5 {% if rows is not none %}{{ query | e }} &mdash; Search results
   6 {% else %}Search Youtube Videos{% endif %}
   7 {% endblock %}
   8
   9 {% block content %}
  10         <style>
  11         #search {
  12           width:60em;
  13           max-width:100%;
  14           box-sizing:border-box;
  15           margin:1.5em auto;
  16         }
  17         #search #box::placeholder{
  18           color:#eee;
  19           opacity: .7;
  20         }
  21         #search #box,
  22         #search #go,
  23         #search #filters select {
  24           display:block;
  25           border:0;
  26           background:#666;
  27           color:#eee;
  28           padding:.2em
  29         }
  30         #search #go {
  31           padding: 0 1em;
  32           border-left: 1px solid #eee;
  33         }
  34         #search #box,
  35         #search #filters {
  36           font-size: 1em;
  37           flex: 1;
  38         }
  39         #search #main,
  40         #search #filters #container {
  41           display: flex;
  42         }
  43         #search #filters select {
  44           flex: 1;
  45         }
  46         </style>
  47         <form method=get action=/search id="search">
  48                 <div id="main">
  49                 <input id="box" name=q placeholder="Search" value="{{ query | e if query }}">
  50                 <input id="go" type=submit value="&#x1F50D;&#xFE0E;" title="search!">
  51                 </div>
  52                 <details id="filters"><summary>Filters</summary><div id="container">
  53                         <select name="sort">
  54                                 <option value="">sort by...</option>
  55                                 <option value="relevance">relevance</option>
  56                                 <option value="rating">rating</option>
  57                                 <option value="date">date</option>
  58                                 <option value="views">views</option>
  59                         </select>
  60                         <select name="date">
  61                                 <option value="">upload date...</option>
  62                                 <option value="hour">hour</option>
  63                                 <option value="day">day</option>
  64                                 <option value="week">week</option>
  65                                 <option value="month">month</option>
  66                                 <option value="year">year</option>
  67                         </select>
  68                         <select name="type">
  69                                 <option value="">type...</option>
  70                                 <option value="video">video</option>
  71                                 <option value="channel">channel</option>
  72                                 <option value="playlist">playlist</option>
  73                                 <option value="movie">movie</option>
  74                                 <option value="show">show</option>
  75                         </select>
  76                         <select name="len">
  77                                 <option value="">duration...</option>
  78                                 <option value="short">short</option>
  79                                 <option value="long">long</option>
  80                         </select>
  81                 </div></details>
  82         </form>
  83
  84 {% if rows is not none %}
  85         {{ super() }}
  86
  87 {# TODO: this is mostly copy-pasted (changed video infobar) from watch.j2's info/endcard section -- dedup! #}
  88 <!-- not implemented warning:--><div style="background:red">{%for x in rows|selectattr('content.error')%}{{x.content.error}}{%endfor%}</div>
  89         <div class="cards">
  90         {% for card in rows %}
  91         {{ macros.typed_card(card) }}
  92         {% endfor %}
  93         {{ macros.dummycard() }}
  94         </div>
  95
  96         <div class="pagination-container">
  97         {% if page > 1 %}
  98         {{ macros.pagination("previous", {'page':(-1,1)}, -1) }}
  99         {% endif %}
 100         {{ macros.pagination("next", {'page':(+1,1)}, +1) }}
 101         </div>
 102 {% else %}
 103         please type a search query.
 104 {% endif %}
 105 {% endblock %}
 106
 107 {% block footer %}
 108 <hr>
 109 {% endblock %}