{{define "body"}}
<h2 class="form-categories-heading">Categories</h2>
{{template "flashes" .}}
<div class="row">

{{range $category := .categories}}
            {{template "row-category" $category}}
{{end}}

</div>
{{end}}

{{define "row-category"}}
    {{if .Parent.Valid }}
        {{with .Depth}}
            <div class="col-xs-{{.}} child-depth"></div>
            <div class="col-xs-{{minus 12 .}} category-row">
        {{end}}
    {{else}}
        <div class="col-xs-12 category-row">
    {{end}}
    {{.Name}} <a href="/categories/delete?id={{.Id}}">delete</a>
    
    <select class="form-control category-change-parent" name="category-change-parent-{{.Id}}" >
        <option value="-1" {{if not .Parent.Valid}} selected="true"{{end}}>-- None --</option>
        {{range $category := .categories}}
            {{template "option-category" $category }}
        {{end}}
    </select>
    
    </div>
    
    {{range $child := .Children}}
        {{template "row-category" $child}}
     {{end}}    
{{end}}

{{define "option-category"}}
    <option value="{{.Id}}">{{.ToString}}</option>
    {{range $child := .Children}}
        {{template "option-category" $child}}
     {{end}}            
{{end}}