spells.html

---
layout: "default"
---
<div class="panel panel-default">
   <div class="panel-heading">Filter Spells</div>
   <div class="panel-body">
      <fieldset class='search-form' data-target="#spell-list">
         <div class='row'>

            <div class="form-group col-md-5">
               <label for="search-name">Name</label>
               <input type="text" class="form-control" id="search-name" placeholder="Name" autofocus
                  data-provide="typeahead"
                  data-target-col='1'
                  data-match-type='contains'
                  data-source='{{site.spells | map: "name" | jsonify | replace: "'", "&apos;" }}'><!--"-->
            </div>

            <div class="form-group col-md-3">
               <label for="search-class">Class</label>
               <select class="form-control" data-target-col='3' data-match-type='contains'>
                  <option value="">-- Select --</option>
                  {% for class in site.data.classes | where: 'spellcaster', true %}
                     <option value='{{class.value}}'>{{class.name}}</option>
                  {% endfor %}
               </select>
            </div>

            <div class="form-group col-md-3">
               <label for="search-class">Level</label>
               <select class="form-control" data-target-col='2'>
                  <option value="">-- Select --</option>
                  {% for level in (0..9) %}
                     <option value='{{level}}'>{{level}}</option>
                  {% endfor %}
               </select>
            </div>
         </div>
      </fieldset>
   </div>
</div>

<table id="spell-list" class="table table-striped table-bordered nowrap datatable" cellspacing="0" width="100%"
   data-paging='false' data-responsive='{"details": { "type": false } }' data-order='[[1, "asc"]]' data-column-defs='[{"targets":[3],"visible":false}]'>
     <thead>
         <tr>
            <th></th>
            <th data-priority='1'>Name</th>
            <th data-priority='2'>Level</th>
            <th data-priority='100'>Classes</th>
            <th data-prioroty='100'>Ritual</th>
            <th data-priority='100'>Casting Time</th>
            <th data-priority='100'>Range</th>
            <th data-priority='100'>Components</th>
            <th data-priority='100'>Duration</th>
         </tr>
      </thead>
      <tbody>
         {% for spell in site.spells %}
            <tr data-child-href="{{site.baseurl}}/spells/{{spell.name | slugify}}.html">
               <td><button class='btn btn-default'><i class='fa fa-plus'></i></button></td>
               <td><a href="{{site.baseurl}}/spells/{{spell.name | slugify}}.html">{{spell.name}}</a></td>
               <td>{{spell.level}}</td>
               <td>{{spell.classes | join: ', '}}</td>
               <td>{{spell.ritual}}</td>
               <td>{{spell.castingTime}}</td>
               <td>{{spell.range}}</td>
               <td>{{spell.components}}</td>
               <td>{%if spell.concentration%}Concentration, {%endif%}{{spell.duration}}</td>
            </tr>
         {% endfor %}
      </tbody>
</table>