mirror of
https://github.com/moodle/moodle.git
synced 2025-08-06 01:16:44 +02:00
204 lines
10 KiB
Text
204 lines
10 KiB
Text
{{!
|
|
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 tiny_h5p/modal
|
|
|
|
Modal to manage an H5P activity within the Tiny Edigtor.
|
|
|
|
Classes required for JS:
|
|
* none
|
|
|
|
Data attributes required for JS:
|
|
* none
|
|
|
|
Context variables required for this template:
|
|
|
|
Example context (json):
|
|
{
|
|
"elementid": "exampleId"
|
|
}
|
|
}}
|
|
|
|
{{< core/modal }}
|
|
|
|
{{$title}}
|
|
{{#str}} modaltitle, tiny_h5p {{/str}}
|
|
{{/title}}
|
|
|
|
{{$body}}
|
|
<form class="mform">
|
|
|
|
{{# noh5pcontent }}
|
|
<div role="alert" class="alert alert-warning mb-1">
|
|
{{#str}} noh5pcontent, tiny_h5p{{/str}}
|
|
</div>
|
|
{{/ noh5pcontent }}
|
|
|
|
{{# invalidUrl }}
|
|
<div role="alert" class="alert alert-warning mb-1">
|
|
{{#str}} invalidh5purl, tiny_h5p{{/str}}
|
|
</div>
|
|
{{/ invalidUrl }}
|
|
|
|
{{#canUploadAndEmbed}}
|
|
<div class="mt-2 mb-4">{{#str}} instructions, tiny_h5p{{/str}}</div>
|
|
{{/canUploadAndEmbed}}
|
|
|
|
<div class="mb-4">
|
|
<label for="{{elementid}}-{{uniqid}}-filepath">
|
|
{{#canUploadAndEmbed}}
|
|
{{#str}} h5pfileorurl, tiny_h5p{{/str}}
|
|
{{/canUploadAndEmbed}}
|
|
{{^canUploadAndEmbed}}
|
|
{{#canUpload}}
|
|
{{#str}} h5pfile, tiny_h5p{{/str}}
|
|
{{/canUpload}}
|
|
{{#canEmbed}}
|
|
{{#str}} h5purl, tiny_h5p{{/str}}
|
|
{{/canEmbed}}
|
|
{{/canUploadAndEmbed}}
|
|
</label>
|
|
|
|
<div class="input-group input-append w-100">
|
|
<input name="url" class="form-control" type="url" value="{{fileURL}}"{{!
|
|
}} id="{{elementid}}-{{uniqid}}-filepath"{{!
|
|
}} size="32"{{!
|
|
}} />
|
|
{{#canUpload}}
|
|
<button class="btn btn-secondary" type="button" data-target="filepicker">
|
|
{{#str}} browserepositories, tiny_h5p{{/str}}</button>
|
|
{{/canUpload}}
|
|
</div>
|
|
|
|
{{#canUpload}}
|
|
<fieldset class="mt-2 collapsible" id="{{elementid}}-{{uniqid}}-options">
|
|
<legend class="d-flex align-items-center px-1">
|
|
<div class="position-relative d-flex ftoggler align-items-center position-relative me-1">
|
|
<a role="button" data-bs-toggle="collapse"{{!
|
|
}} href="#h5poptions"{{!
|
|
}} aria-expanded="{{#showOptions}}true{{/showOptions}}{{^showOptions}}false{{/showOptions}}"{{!
|
|
}} aria-controls="h5poptions"{{!
|
|
}} class="btn btn-icon me-1 icons-collapse-expand stretched-link fheader {{^showOptions}}collapsed{{/showOptions}}"{{!
|
|
}}>
|
|
<span class="expanded-icon icon-no-margin p-2"
|
|
title="{{#str}} collapse, moodle {{/str}}">
|
|
<i class="icon fa fa-chevron-down fa-fw " aria-hidden="true"></i>
|
|
</span>
|
|
<span class="collapsed-icon icon-no-margin p-2"
|
|
title="{{#str}} expand, moodle {{/str}}">
|
|
<span class="dir-rtl-hide">
|
|
<i class="icon fa fa-chevron-right fa-fw " aria-hidden="true"></i>
|
|
</span>
|
|
<span class="dir-ltr-hide">
|
|
<i class="icon fa fa-chevron-left fa-fw " aria-hidden="true"></i>
|
|
</span>
|
|
</span>
|
|
<span class="visually-hidden">{{#str}} h5poptions, tiny_h5p{{/str}}</span>
|
|
</a>
|
|
<h3 class="d-flex align-self-stretch align-items-center mb-0" aria-hidden="true">
|
|
{{#str}} h5poptions, tiny_h5p{{/str}}
|
|
</h3>
|
|
</div>
|
|
</legend>
|
|
<div id="h5poptions" class="fcontainer collapseable collapse px-1 {{#showOptions}}show{{/showOptions}}">
|
|
<div class="form-check">
|
|
<input type="checkbox" {{!
|
|
}} name="download"{{!
|
|
}} {{# download }}checked{{/ download }}{{!
|
|
}} class="form-check-input"{{!
|
|
}} id="{{elementid}}-{{uniqid}}_h5p-option-allow-download"{{!
|
|
}} />
|
|
<label class="form-check-label" for="{{elementid}}-{{uniqid}}_h5p-option-allow-download">
|
|
{{#str}} downloadbutton, tiny_h5p{{/str}}
|
|
</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input type="checkbox"{{!
|
|
}} name="embed"{{!
|
|
}} {{# embed }}checked{{/ embed }}{{!
|
|
}} class="form-check-input"{{!
|
|
}} id="{{elementid}}-{{uniqid}}_h5p-option-embed-button"{{!
|
|
}} />
|
|
<label class="form-check-label" for="{{elementid}}-{{uniqid}}_h5p-option-embed-button">
|
|
{{#str}} embedbutton, tiny_h5p{{/str}}
|
|
</label>
|
|
</div>
|
|
<div class="form-check mb-2">
|
|
<input type="checkbox"{{!
|
|
}} name="copyright"{{!
|
|
}} {{# copyright }}checked{{/ copyright }}{{!
|
|
}} class="form-check-input"{{!
|
|
}} id="{{elementid}}-{{uniqid}}_h5p-option-copyright-button" {{!
|
|
}}/>
|
|
<label class="form-check-label" for="{{elementid}}-{{uniqid}}_h5p-option-copyright-button">
|
|
{{#str}} copyrightbutton, tiny_h5p{{/str}}
|
|
</label>
|
|
</div>
|
|
</div>
|
|
</fieldset>
|
|
{{/canUpload}}
|
|
|
|
<fieldset class="mt-2 collapsible" id="{{elementid}}-{{uniqid}}-display-options">
|
|
<legend class="position-relative d-flex ftoggler align-items-center px-1">
|
|
<a role="button" data-bs-toggle="collapse"{{!
|
|
}} href="#displayoptions"{{!
|
|
}} aria-expanded="{{#showDisplayOptions}}true{{/showDisplayOptions}}{{^showDisplayOptions}}false{{/showDisplayOptions}}"{{!
|
|
}} aria-controls="displayoptions"{{!
|
|
}} class="btn btn-icon me-1 icons-collapse-expand stretched-link fheader {{^showDisplayOptions}}collapsed{{/showDisplayOptions}}"{{!
|
|
}}>
|
|
<span class="expanded-icon icon-no-margin p-2"
|
|
title="{{#str}} collapse, moodle {{/str}}">
|
|
<i class="icon fa fa-chevron-down fa-fw " aria-hidden="true"></i>
|
|
</span>
|
|
<span class="collapsed-icon icon-no-margin p-2"
|
|
title="{{#str}} expand, moodle {{/str}}">
|
|
<span class="dir-rtl-hide">
|
|
<i class="icon fa fa-chevron-right fa-fw " aria-hidden="true"></i>
|
|
</span>
|
|
<span class="dir-ltr-hide">
|
|
<i class="icon fa fa-chevron-left fa-fw " aria-hidden="true"></i>
|
|
</span>
|
|
</span>
|
|
<span class="visually-hidden">{{#str}} displayoptions, tiny_h5p {{/str}}</span>
|
|
</a>
|
|
<h3 class="d-flex align-self-stretch align-items-center mb-0" aria-hidden="true">
|
|
{{#str}} displayoptions, tiny_h5p {{/str}}
|
|
</h3>
|
|
</legend>
|
|
<div id="displayoptions" class="fcontainer collapseable collapse px-1 {{#showDisplayOptions}}show{{/showDisplayOptions}}">
|
|
<div class="form-check mb-2">
|
|
<input type="checkbox" {{!
|
|
}} name="mobileappautoplay"{{!
|
|
}} {{# mobileAppAutoPlay }}checked{{/ mobileAppAutoPlay }}{{!
|
|
}} class="form-check-input"{{!
|
|
}} id="{{elementid}}-{{uniqid}}_display-option-mobileapp-autoplay"{{!
|
|
}} />
|
|
<label class="form-check-label" for="{{elementid}}-{{uniqid}}_display-option-mobileapp-autoplay">
|
|
{{#str}} mobileappautoplay, tiny_h5p{{/str}}
|
|
</label>
|
|
</div>
|
|
</div>
|
|
</fieldset>
|
|
</div>
|
|
</form>
|
|
{{/body}}
|
|
|
|
{{$footer}}
|
|
<button type="button" class="btn btn-secondary" data-action="cancel">{{#str}} cancel, moodle {{/str}}</button>
|
|
<button type="button" class="btn btn-primary" data-action="save">{{#str}} insert, tiny_h5p{{/str}}</button>
|
|
{{/footer}}
|
|
{{/ core/modal }}
|