<form class="editable" onsubmit="event.preventDefault();" style="background:var(--fco-sheet-background-colour); color:var(--fco-sheet-text-colour); padding:10px">
    <div id = "header">
        Filter: <select id = "select_box" style="background-color:var(--fco-sheet-input-colour); color:var(--fco-sheet-text-colour); font-family:var(--fco-font-family)">
            <option selected disabled value="{{localize 'fate-core-official.ChooseACategory'}}">{{localize 'fate-core-official.ChooseACategory'}}</option>
            {{#each tracks_by_category}}
                {{#if (eq @key "Combat")}}
                        <option value="Combat" {{#if (eq ../cat @key)}} selected="selected"{{/if}}>{{localize 'fate-core-official.Combat'}}</option>
                    {{else}}
                        {{#if (eq @key "Other")}}
                                <option value="Other" {{#if (eq ../cat @key)}} selected="selected"{{/if}}>{{localize 'fate-core-official.Other'}}</option>
                            {{else}}
                                {{#if (eq @key "All")}}
                                    <option value="All" {{#if (eq ../cat @key)}} selected="selected"{{/if}}>{{localize 'fate-core-official.All'}}</option>
                                {{else}}
                                    <option {{#if (eq ../cat @key)}} selected="selected"{{/if}}>{{@key}}</option>
                                {{/if}}    
                    {{/if}}
                {{/if}}
            {{/each}}
            </select>
    <div id="edit_tracks_body" name = "tracks_body" style="overflow-y:auto; width:400px; height:250px; border:none"><!--Begin body-->
        <table style="background-color:transparent; border:none">
        {{#each tracks_by_category}}
            {{#each this}}
            {{#if (eq this.extra_id undefined)}}
            <tr style="background-color:transparent;">
                {{#if (eq ../../cat @../key)}}
                <td title ="{{this.description}}">
                    <input type ="checkbox" id="{{this.name}}"
                        title="{{this.description}}" 
                        {{checked this.present}}
                        {{checked this.toCopy}}
                            {{#if this.universal}}
                            {{/if}}></input></td>
                            <td title="{{localize 'fate-core-official.RightClickForDetails'}}" name="nameField" id="{{this.name}}_nameField" style="font-family:var(--fco-font-family)">{{this.name}}{{#if this.unique}}{{else}}{{#if (undefined this.parent)}}&nbsp&nbsp<input type="number" min="1" value="{{this.number}}" id="{{this.name}}_number" title="{{localize 'fate-core-official.NumberOfCopies'}}" style="background-color:var(--fco-sheet-input-colour); color:var(--fco-sheet-text-colour); border:1px solid var(--fco-foundry-interactable-color); font-family:var(--fco-font-family); width:40px;">{{else}}{{/if}}{{/if}}</td>
                            <td>
                                <button type="button" name = "{{../../cat}}_{{this.name}}" id="move_up" i icon class="fas fa-sort-up" style="width:25px; height:25px; border:2px groove var(--fco-foundry-interactable-color); background-color:var(--fco-sheet-input-colour); color:var(--fco-sheet-text-colour);"></button>
                                <button type="button" name = "{{../../cat}}_{{this.name}}"id="move_down" i icon class="fas fa-sort-down" style="width:25px; height:25px; border:2px groove var(--fco-foundry-interactable-color); background-color:var(--fco-sheet-input-colour); color:var(--fco-sheet-text-colour);"></button>
                                {{#if this.present}}<button type="button" name = "edit_entity_tracks" id="{{this.name}}" i icon class="fas fa-cogs" style="width:30px; height:25px; border:2px groove var(--fco-foundry-interactable-color); background-color:var(--fco-sheet-input-colour); color:var(--fco-sheet-text-colour);"></button>{{/if}}
                            </td>
                {{/if}}
                </tr>
                {{else}}{{/if}}
            {{/each}}
        {{/each}}
    </table>
    </div><!--End body-->
    <div id="buttons" style="width:400px">
        <button type="button" style="margin-bottom:5px; border:2px groove var(--fco-foundry-interactable-color); background-color:var(--fco-sheet-input-colour); color:var(--fco-sheet-text-colour);" id="save">{{localize 'fate-core-official.AddRemoveTracks'}}</button>
        {{#if GM}}<button style="border:2px groove var(--fco-foundry-interactable-color); background-color:var(--fco-sheet-input-colour); color:var(--fco-sheet-text-colour);" type="button" id="ad_hoc">{{localize 'fate-core-official.AddAdHocTrack'}}</button>{{/if}}
    </div><!--End buttons div-->
    </div><!--End of header DIV-->
    <div>
        {{select_box.value}}
    </div>
</form>
