{{!
    This file is part of Moodle - https://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 format_ludilearn/filename

    Example context (json):
    {}
}}

<div class="avatar-inventory">
    <div class="tabs">
        {{# inventory}}
            <button id="tab-slot-{{ slot }}" class="tab-inventory" data-tab="{{ slot }}" role="tab" aria-controls="tab-content-slot-{{ slot }}" aria-selected="false">
                {{ slotname }}
            </button>
        {{/inventory}}
    </div>
    {{# inventory}}
    <div id="tab-content-slot-{{ slot }}" class="tab-content-inventory" role="tabpanel" aria-labelledby="tab-content-slot-{{ slot }}">
        <h4>{{ slotname }}</h4>
        <div class="avatar-slot" role="list">
            {{# items}}
                <div class="avatar-item
                {{#equiped}} avatar-item-equiped {{/equiped}}
                {{#owned}} avatar-item-owned {{/owned}}
                avatar-slot-{{ slot }}"
                role="listitem" tabindex="0"
                data-slot="{{ slot }}" data-theme="{{ theme }}">
                    {{#owned}}
                        <div class="alert alert-info alert-equiped" role="alert">
                            {{#str}} equiped, format_ludilearn {{/str}}
                        </div>
                        <img class="avatar-item-img" src="{{config.wwwroot}}/course/format/ludilearn/pix/{{ world }}/avatar/items/icons/icon-0{{slot}}-{{theme}}.svg" alt="Image item {{slot}}">
                        <button class="equip-button" data-slot="{{ slot }}" data-theme="{{ theme }}">
                            {{#str}} equip, format_ludilearn {{/str}}
                        </button>
                    {{/owned}}
                    {{^owned}}
                        <img class="avatar-item-img" src="{{config.wwwroot}}/course/format/ludilearn/pix/{{ world }}/avatar/item_icon_default.svg" alt="Image item {{slot}}">
                    {{/owned}}
                </div>
            {{/items}}
        </div>
    </div>
    {{/inventory}}
</div>