{{!
    This file is part of Moodle - http://moodle.org/

    Moodle is free software: you can redistribute it and/or modify
    it under the terms of the GNU General Public License as published by
    the Free Software Foundation, either version 3 of the License, or
    (at your option) any later version.

    Moodle is distributed in the hope that it will be useful,
    but WITHOUT ANY WARRANTY; without even the implied warranty of
    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
    GNU General Public License for more details.

    You should have received a copy of the GNU General Public License
    along with Moodle.  If not, see <http://www.gnu.org/licenses/>.
}}
{{!
    @template core_contentbank/bankcontent

    Example context (json):
    {
        "contents": [
            {
                "name": "Accordion.h5p",
                "title": "accordion.h5p",
                "timemodified": 1589792272,
                "size": "699.3KB",
                "bytes": 716126,
                "type": "Archive (H5P)",
                "author": "Admin user",
                "link": "http://something/contentbank/contenttype/h5p/view.php?url=http://something/pluginfile.php/1/contentbank/public/accordion.h5p",
                "icon" : "http://something/theme/image.php/boost/core/1581597850/f/h5p-64",
                "visibilityunlisted": true
            },
            {
                "name": "resume.pdf",
                "title": "resume",
                "timemodified": 1589792039,
                "size": "699.3KB",
                "uses": 3,
                "bytes": 716126,
                "type": "Archive (PDF)",
                "author": "Admin user",
                "icon": "http://something/theme/image.php/boost/core/1584597850/f/pdf-64",
                "visibilityunlisted": false
            }
        ],
        "tools": [
            {
                "name": "Add",
                "dropdown": true,
                "link": "http://something/contentbank/edit.php?contextid=1",
                "contenttypes": [
                    {
                        "name": "H5P Interactive Content",
                        "baseurl": "http://something/contentbank/edit.php?contextid=1&plugin=h5p",
                        "types": [
                            {
                                "typename": "H5P Interactive Content"
                            },
                            {
                                "typename": "Accordion",
                                "typeeditorparams": "library=Accordion-1.4",
                                "typeicon": "http://something/pluginfile.php/1/core_h5p/libraries/13/H5P.Accordion-1.4/icon.svg"
                            }
                        ]
                    }
                ]
            },
            {
                "name": "Upload",
                "link": "http://something/contentbank/contenttype/h5p/view.php?url=http://something/pluginfile.php/1/contentbank/public/accordion.h5p",
                "icon" : "i/upload"
            },
            {
                "icon": "i/export"
            }
        ],
        "allowedcontexts": [
            {
                "name": "contextid",
                "method": "get",
                "action": "http://localhost/stable_master/contentbank/index.php",
                "options": [
                    {
                        "value": "1",
                        "name": "System",
                        "selected": true,
                        "optgroup": false
                    },
                    {
                        "value": "32",
                        "name": "Category 1",
                        "selected": false,
                        "optgroup": false
                    }
                ]
            }
        ]
    }
}}

<div class="content-bank-container {{#viewlist}}view-list{{/viewlist}} {{^viewlist}}view-grid{{/viewlist}}"
data-region="contentbank">
    <div class="d-flex justify-content-between">
        <div class="cb-search-container mb-2 mr-2">
            {{>core_contentbank/bankcontent/search}}
        </div>
        <div class="cb-toolbar-container mb-2 d-flex">
            {{>core_contentbank/bankcontent/toolbar}}
        </div>
    </div>
    <div class="cb-navigation-container mb-2">
        {{>core_contentbank/bankcontent/navigation}}
    </div>
    <div class="pb-3 border">
        <div class="content-bank">
            <div class="cb-navbar bg-light p-2 border-bottom">
                <div class="cb-navbar-breadbrumb">
                    {{#pix}} i/folder {{/pix}}
                </div>
                <div class="cb-navbar-totalsearch d-none">
                </div>
            </div>
            {{#contents.0}}
                <div role="{{#viewlist}}table{{/viewlist}}{{^viewlist}}list{{/viewlist}}" aria-label="{{#str}} contentbank, contentbank {{/str}}"
                    class="cb-content-wrapper d-flex px-2" data-region="filearea">
                    <div {{#viewlist}}role="row"{{/viewlist}} class="cb-heading bg-white">
                        <div {{#viewlist}}role="columnheader"{{/viewlist}} aria-sort="none" class="cb-file cb-column d-flex">
                            <button class="btn btn-block cb-btnsort dir-none text-left" data-string="contentname" data-action="sortname"
                                title="{{#str}} sortbyx, core, {{#str}} contentname, contentbank {{/str}} {{/str}}">
                                <span class="title">{{#str}} contentname, contentbank {{/str}}</span>
                                <span class="default">{{#pix}} t/sort, core {{/pix}}</span>
                                <span class="desc">{{#pix}} t/sort_desc, core {{/pix}}</span>
                                <span class="asc">{{#pix}} t/sort_asc, core {{/pix}}</span>
                            </button>
                        </div>
                        <div {{#viewlist}}role="columnheader"{{/viewlist}} aria-sort="none" class="cb-uses cb-column d-flex">
                            <button class="btn btn-block cb-btnsort dir-none text-left" data-string="uses" data-action="sortuses"
                            title="{{#str}} sortbyx, core, {{#str}} uses, contentbank {{/str}} {{/str}}">
                                <span class="title">{{#str}} uses, contentbank {{/str}}</span>
                                <span class="default">{{#pix}} t/sort, core {{/pix}}</span>
                                <span class="desc">{{#pix}} t/sort_desc, core {{/pix}}</span>
                                <span class="asc">{{#pix}} t/sort_asc, core {{/pix}}</span>
                            </button>
                        </div>
                        <div {{#viewlist}}role="columnheader"{{/viewlist}} aria-sort="none" class="cb-date cb-column d-flex">
                            <button class="btn btn-block cb-btnsort dir-none text-left" data-string="lastmodified" data-action="sortdate"
                            title="{{#str}} sortbyx, core, {{#str}} lastmodified, contentbank {{/str}} {{/str}}">
                                <span class="title">{{#str}} lastmodified, contentbank {{/str}}</span>
                                <span class="default">{{#pix}} t/sort, core {{/pix}}</span>
                                <span class="desc">{{#pix}} t/sort_desc, core {{/pix}}</span>
                                <span class="asc">{{#pix}} t/sort_asc, core {{/pix}}</span>
                            </button>
                        </div>
                        <div {{#viewlist}}role="columnheader"{{/viewlist}} aria-sort="none" class="cb-size cb-column d-flex">
                            <button class="btn btn-block cb-btnsort dir-none text-left" data-string="size" data-action="sortsize"
                            title="{{#str}} sortbyx, core, {{#str}} size, contentbank {{/str}} {{/str}}">
                                <span class="title">{{#str}} size, contentbank {{/str}}</span>
                                <span class="default">{{#pix}} t/sort, core {{/pix}}</span>
                                <span class="desc">{{#pix}} t/sort_desc, core {{/pix}}</span>
                                <span class="asc">{{#pix}} t/sort_asc, core {{/pix}}</span>
                            </button>
                        </div>
                        <div {{#viewlist}}role="columnheader"{{/viewlist}} aria-sort="none" class="cb-type cb-column d-flex">
                            <button class="btn btn-block cb-btnsort dir-none text-left" data-string="type" data-action="sorttype"
                            title="{{#str}} sortbyx, core, {{#str}} type, contentbank {{/str}} {{/str}}">
                                <span class="title">{{#str}} type, contentbank {{/str}}</span>
                                <span class="default">{{#pix}} t/sort, core {{/pix}}</span>
                                <span class="desc">{{#pix}} t/sort_desc, core {{/pix}}</span>
                                <span class="asc">{{#pix}} t/sort_asc, core {{/pix}}</span>
                            </button>
                        </div>
                        <div {{#viewlist}}role="columnheader"{{/viewlist}} aria-sort="none" class="cb-author cb-column d-flex last">
                            <button class="btn btn-block cb-btnsort dir-none text-left" data-string="author" data-action="sortauthor"
                            title="{{#str}} sortbyx, core, {{#str}} author, contentbank {{/str}} {{/str}}">
                                <span class="title">{{#str}} author, contentbank {{/str}}</span>
                                <span class="default">{{#pix}} t/sort, core {{/pix}}</span>
                                <span class="desc">{{#pix}} t/sort_desc, core {{/pix}}</span>
                                <span class="asc">{{#pix}} t/sort_asc, core {{/pix}}</span>
                            </button>
                        </div>
                    </div>
                {{#contents}}
                    <div role="{{#viewlist}}row{{/viewlist}}{{^viewlist}}listitem{{/viewlist}}"
                        class="cb-listitem {{#visibilityunlisted}}cb-unlisted{{/visibilityunlisted}}"
                        data-file="{{ title }}"
                        data-name="{{ name }}"
                        data-bytes="{{ bytes }}"
                        data-uses="{{ uses }}"
                        data-timemodified="{{ timemodified }}"
                        data-type="{{ type }}"
                        data-author="{{ author }}">
                        <div {{#viewlist}}role="cell"{{/viewlist}} class="cb-file cb-column position-relative">
                            <div class="cb-thumbnail" style="background-image: url('{{{ icon }}}');">
                            </div>
                            <a href="{{{ link }}}" class="cb-link stretched-link">
                                <span class="cb-name word-break-all clamp-2" data-region="cb-content-name">
                                    {{{ name }}}
                                </span>
                            </a>
                        </div>
                        <div {{#viewlist}}role="cell"{{/viewlist}} class="cb-uses cb-column small">
                            {{ uses }}
                        </div>
                        <div {{#viewlist}}role="cell"{{/viewlist}} class="cb-date cb-column small">
                            {{#userdate}} {{ timemodified }}, {{#str}} strftimedatetimeshort, core_langconfig {{/str}} {{/userdate}}
                        </div>
                        <div {{#viewlist}}role="cell"{{/viewlist}} class="cb-size cb-column small">
                            {{ size }}
                        </div>
                        <div {{#viewlist}}role="cell"{{/viewlist}} class="cb-type cb-column small">
                            {{{ type }}}
                        </div>
                        <div {{#viewlist}}role="cell"{{/viewlist}} class="cb-type cb-column last small">
                            {{{ author }}}
                        </div>
                    </div>
                {{/contents}}
                </div>
            {{/contents.0}}
            {{^contents.0}}
                <div class="cb-content-wrapper d-flex flex-wrap p-2" data-region="filearea">
                    <div class="w-100 p-3 text-center text-muted">
                        {{#str}} nocontentavailable, core_contentbank {{/str}}
                    </div>
                </div>
            {{/contents.0}}
        </div>
    </div>
</div>