{{!
    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 format_remuiformat/card_section_summary


    Example context (json):
    {
        "editing: "1/0",
        "defaultview: "1/0",
        "expanded: "1/0",
        "collapsed: "1/0",
        "user_id: "1",
        "courseid: "1",
        "generalsection": [
         {
            "sections": [
                {
                    "index": "1",
                    "title": "Section Title",
                    "singlepageurl": "Single Page URL",
                    "hiddenmessage": "Hidden message",
                    "hidden": "1/0",
                    "summary": "Summary",
                    "activityinfostring": "2 Files, 2 Quizzes"
                    "sectionactivities" [
                        {
                        }
                    ]
                }
            ]
         }
        ],
    }
}}

{{#addsection}}
<li id="{{divid}}" class=" col-lg-4 col-md-6 col-sm-6 section main clearfix">
    <div class="single-card d-flex align-items-center">
        {{#numsections}}
        <a href="{{{addurl}}}" class="{{addurlclass}}">{{{addicon}}} {{{straddsection}}}</a>

        {{#strremovesection}}
        <a href="{{{removeurl}}}" class="{{removeurlclass}}">{{{removeicon}}} {{{strremovesection}}}</a>
        {{/strremovesection}}
        {{/numsections}}

        {{^numsections}}
        <a href="{{{url}}}" data-add-sections="{{{straddsections}}}">{{{icon}}} {{{straddsections}}}</a>
        {{/numsections}}
    </div>
</li>
{{/addsection}}

{{^addsection}}
<li id="section-{{{index}}}" class="section main clearfix {{#isdelegatedsection}}delegated-section {{/isdelegatedsection}}" aria-labelledby="section-{{{index}}} .content .sectionname  {{#isdelegatedsection}}delegated-section {{/isdelegatedsection}}"
    data-sectionid="{{id}}" data-sectionreturnid="{{sectionreturnid}}" data-for="section" data-number="{{num}}">
    <div class="single-card d-flex flex-column justify-content-between {{{remuinewthemecolor}}} {{#sectionfirstimage}}sectionfirstimage{{/sectionfirstimage}}"
        {{#sectionfirstimage}}style="background: linear-gradient({{remuidefaultsectionoverlay}}),url({{sectionfirstimage}});
                background-repeat: no-repeat;
                background-size: cover;" {{/sectionfirstimage}}>
        {{#highlighted}}
        <div class="highlight text-primary"></div>
        {{/highlighted}}
        <div class="content ">
            <div class="summary d-none"></div>
            {{#addnewsection}}
            <h2 class="sectionname m-0 text-clamp text-clamp-3" style="-webkit-box-orient: vertical;">{{{ title }}}</h2>
            {{/addnewsection}}
            {{^addnewsection}}
            <div class="section-header d-flex flex-column">
                {{^hidden}}
                <a href="{{{ singlepageurl }}}" class="align-middle">
                    {{/hidden}}
                    <h2 class="sectionname m-0 d-inline bg-transparent text-clamp text-clamp-3" style="-webkit-box-orient: vertical;">{{{ title }}}</h2>

                    {{^hidden}}
                </a>
                {{/hidden}}
                <div data-region="sectionbadges" class="sectionbadges d-inline">
                    {{!> core_courseformat/local/content/section/badges }}
                    {{>format_remuiformat/edwbadges}}
                </div>
            </div>
            {{/addnewsection}}
            {{#summary }}
            <div class="wdm-section-summary {{#hidden}}summary-muted{{/hidden}}">
                {{{ summary }}}
            </div>
            {{/summary }}

            {{#editsectionurl}}
            <a class="text-muted" href="{{ editsectionurl }}"><span><i class="fa fa-cog font-size-20 "
                        aria-hidden="true"></i></span></a>
            {{/editsectionurl}}
            {{#hiddenmessage}}
                {{{hiddenmessage}}}
            {{/hiddenmessage}}
        </div>
        {{#progressinfo}}
            <div class="section-action-container  progress-bar-warpper card-bottom d-flex {{^hidden}}text-primary{{/hidden}}{{#hidden}}text-muted{{/hidden}}">

                {{#percentage}}
                <div class="progress progress-xs bg-grey-300 w-100">
                    <div class="progress-bar bg-green-600"
                        style="width: {{#progressinfo}}{{{percentage}}}{{/progressinfo}}{{^progressinfo}}0{{/progressinfo}}%;"
                        role="progressbar">
                    </div>
                </div>
                <div class=" progress-text w-100">
                    {{! progress }}
                    <span>{{#progressinfo}}{{{percentage}}}{{/progressinfo}}{{^progressinfo}}0{{/progressinfo}}% {{#str}} Complete, format_remuiformat {{/str}}
                    </span>
                </div>
                {{/percentage}}
                {{^percentage}}
                    {{{progress}}}
                {{/percentage}}

            </div>
        {{/progressinfo}}
    </div>
</li>
{{/addsection}}
