{{!
    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 mod_zoom/mobile_view_page_ionic3

    Page to view a zoom meeting

    Classes required for JS:
    * none

    Data attributes required for JS:
    * none

    Example context (json):
    {
        "zoom": {
            "intro": "Introduction String",
            "password": "9836451",
            "recurring": 1,
            "webinar": 1,
            "option_host_video": 1,
            "option_jbh": 1,
            "option_participants_video": 1
        },
        "available": true,
        "status": "Finished",
        "start_time": "Tuesday, June 29, 2021, 1:30 PM",
        "duration": "1 hour",
        "option_audio": "Computer audio and Telephone",
        "cmid": 3,
        "courseid": 3
    }
}}
{{=<% %>=}}
<div>
    <core-course-module-description description="<% zoom.intro %>" component="mod_zoom" componentId="<% cmid %>"></core-course-module-description>

    <ion-list>
        <%#available%>
            <ion-item>
                <button ion-button block color="light" core-site-plugins-call-ws name="mod_zoom_grade_item_update" [params]="{zoomid: <% cmid %>}" [preSets]="{getFromCache: 0, saveToCache: 0}" (onSuccess)="loadMeeting($event)">
                    {{ 'plugin.mod_zoom.join_meeting' | translate }}
                </button>
            </ion-item>
        <%/available%>
        <%^available%>
            <ion-item>
                <p>{{ 'plugin.mod_zoom.unavailable' | translate }}</p>
            </ion-item>
        <%/available%>

        <%#zoom.recurring%>
            <ion-item>
                <p class="item-heading">{{ 'plugin.mod_zoom.recurringmeetinglong' | translate }}</p>
            </ion-item>
        <%/zoom.recurring%>
        <%^zoom.recurring%>
            <ion-item>
                <p class="item-heading">{{ 'plugin.mod_zoom.meeting_time' | translate }}</p>
                <p><% start_time %></p>
            </ion-item>
            <ion-item>
                <p class="item-heading">{{ 'plugin.mod_zoom.duration' | translate }}</p>
                <p><% duration %></p>
            </ion-item>
        <%/zoom.recurring%>

        <ion-item>
            <p class="item-heading">{{ 'plugin.mod_zoom.passwordprotected' | translate }}</p>
            <%#zoom.password%><p>{{ 'core.yes' | translate }}</p><%/zoom.password%>
            <%^zoom.password%><p>{{ 'core.no' | translate }}</p><%/zoom.password%>
        </ion-item>

        <%^zoom.webinar%>
            <ion-item>
                <p class="item-heading">{{ 'plugin.mod_zoom.joinbeforehost' | translate }}</p>
                <%#zoom.option_jbh%><p>{{ 'core.yes' | translate }}</p><%/zoom.option_jbh%>
                <%^zoom.option_jbh%><p>{{ 'core.no' | translate }}</p><%/zoom.option_jbh%>
            </ion-item>
            <ion-item>
                <p class="item-heading">{{ 'plugin.mod_zoom.starthostjoins' | translate }}</p>
                <%#zoom.option_host_video%><p>{{ 'core.yes' | translate }}</p><%/zoom.option_host_video%>
                <%^zoom.option_host_video%><p>{{ 'core.no' | translate }}</p><%/zoom.option_host_video%>
            </ion-item>
            <ion-item>
                <p class="item-heading">{{ 'plugin.mod_zoom.startpartjoins' | translate }}</p>
                <%#zoom.option_participants_video%><p>{{ 'core.yes' | translate }}</p><%/zoom.option_participants_video%>
                <%^zoom.option_participants_video%><p>{{ 'core.no' | translate }}</p><%/zoom.option_participants_video%>
            </ion-item>
        <%/zoom.webinar%>

        <ion-item>
            <p class="item-heading">{{ 'plugin.mod_zoom.option_audio' | translate }}</p>
            <p><% option_audio %></p>
        </ion-item>

        <%^zoom.recurring%>
            <ion-item>
                <p class="item-heading">{{ 'plugin.mod_zoom.status' | translate }}</p>
                <p><% status %></p>
            </ion-item>
        <%/zoom.recurring%>
    </ion-list>
</div>
