AutorÃa | Ultima modificación | Ver Log |
{{!
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_media/embed_media_modal_video
Embed media video modal template.
Example context (json):
{
}
}}
{{#video.sources}}
<div class="tiny_media_source tiny_media_media_source">
<div class="mb-1">
<label for="video-video-url-input">
{{#str}} videosourcelabel, tiny_media {{/str}}
</label>
<div class="input-group input-append w-100">
<input id="video-video-url-input" class="form-control tiny_media_url_entry" type="url" size="32" value="{{.}}"/>
{{#showfilepicker}}
<span class="input-group-append">
<button class="btn btn-secondary openmediabrowser" type="button">{{#str}} browserepositories, tiny_media {{/str}}</button>
</span>
{{/showfilepicker}}
</div>
</div>
<div class="addcomponent-wrapper">
<a href="#" class="addcomponent">
{{#str}} addsource, tiny_media {{/str}}
</a>
{{#addsourcehelpicon}}
{{> core/help_icon }}
{{/addsourcehelpicon}}
</div>
<div class="removecomponent-wrapper hidden">
<a href="#" class="removecomponent">
{{#str}} remove, tiny_media {{/str}}
</a>
</div>
</div>
{{/video.sources}}
{{^video}}
<div class="tiny_media_source tiny_media_media_source">
<div class="mb-1">
<label for="video-video-url-input">
{{#str}} videosourcelabel, tiny_media {{/str}}
</label>
<div class="input-group input-append w-100">
<input id="video-video-url-input" class="form-control tiny_media_url_entry" type="url" size="32"/>
{{#showfilepicker}}
<span class="input-group-append">
<button class="btn btn-secondary openmediabrowser" type="button">{{#str}} browserepositories, tiny_media {{/str}}</button>
</span>
{{/showfilepicker}}
</div>
</div>
<div class="addcomponent-wrapper">
<a href="#" class="addcomponent">
{{#str}} addsource, tiny_media {{/str}}
</a>
{{#addsourcehelpicon}}
{{> core/help_icon }}
{{/addsourcehelpicon}}
</div>
<div class="removecomponent-wrapper hidden">
<a href="#" class="removecomponent">
{{#str}} remove, tiny_media {{/str}}
</a>
</div>
</div>
{{/video}}
<fieldset class="collapsible collapsed" id="{{elementid}}_video-display-options">
<input name="mform_isexpanded_{{elementid}}_video-display-options" type="hidden">
<legend class="d-flex align-items-center px-1">
<div class="position-relative d-flex ftoggler align-items-center position-relative mr-1">
<a role="button" data-toggle="collapse" href="#vdisplayoptions" aria-expanded="false"
aria-controls="vdisplayoptions"
class="btn btn-icon mr-1 icons-collapse-expand stretched-link fheader collapsed">
<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="sr-only">{{#str}} displayoptions, tiny_media {{/str}}</span>
</a>
<h3 class="d-flex align-self-stretch align-items-center mb-0" aria-hidden="true">
{{#str}} displayoptions, tiny_media {{/str}}
</h3>
</div>
</legend>
<div id="vdisplayoptions" class="fcontainer collapseable collapse px-1">
<div class="tiny_media_display_options">
<div class="mb-1">
<label for="vdisplayoptions_media-title-entry">{{#str}} entertitle, tiny_media {{/str}}</label>
<input class="form-control fullwidth tiny_media_title_entry" type="text" id="vdisplayoptions_media-title-entry"
size="32" value="{{video.title}}"/>
</div>
<div class="clearfix"></div>
<div class="mb-1">
<label>{{#str}} size, tiny_media {{/str}}</label>
<div class="d-flex flex-wrap align-items-center tiny_media_poster_size">
<label for="vdisplayoptions_media-width-entry" class="accesshide">{{#str}} videowidth, tiny_media {{/str}}</label>
<input id="vdisplayoptions_media-width-entry" type="text" class="form-control w-auto mr-1 tiny_media_width_entry input-mini"
size="4" value="{{video.width}}"/>
x
<label for="vdisplayoptions_media-height-entry" class="accesshide">{{#str}} videoheight, tiny_media {{/str}}</label>
<input id="vdisplayoptions_media-height-entry" type="text" class="form-control w-auto ml-1 tiny_media_height_entry input-mini"
size="4" value="{{video.height}}"/>
</div>
</div>
<div class="clearfix"></div>
<div class="tiny_media_source tiny_media_poster_source">
<div class="mb-1">
<label for="display-video-url-input">
{{#str}} entersource, tiny_media {{/str}}
</label>
<div class="input-group input-append w-100">
<input id="display-video-url-input" class="form-control tiny_media_url_entry" type="url" size="32" value="{{video.poster}}"/>
{{#showfilepickerposter}}
<span class="input-group-append">
<button class="btn btn-secondary openmediabrowser" type="button">{{#str}} browserepositories, tiny_media {{/str}}</button>
</span>
{{/showfilepickerposter}}
</div>
</div>
</div>
</div>
</div>
</fieldset>
<fieldset class="collapsible collapsed" id="{{elementid}}_video-advanced-settings">
<input name="mform_isexpanded_{{elementid}}_video-advanced-settings" type="hidden">
{{renderPartial "form_components.section" context=this id="vadvancedsettings" name="advancedsettings"}}
<legend class="d-flex align-items-center px-1">
<div class="position-relative d-flex ftoggler align-items-center position-relative mr-1">
<a role="button" data-toggle="collapse" href="#vadvancedsettings" aria-expanded="false"
aria-controls="vadvancedsettings"
class="btn btn-icon mr-1 icons-collapse-expand stretched-link fheader collapsed">
<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="sr-only">{{#str}} advancedsettings, tiny_media {{/str}}</span>
</a>
<h3 class="d-flex align-self-stretch align-items-center mb-0" aria-hidden="true">
{{#str}} advancedsettings, tiny_media {{/str}}
</h3>
</div>
</legend>
<div id="vadvancedsettings" class="fcontainer collapseable collapse px-1">
<div class="tiny_media_advancedsettings">
<div class="form-check">
<input type="checkbox" checked="true" class="form-check-input tiny_media_controls"
id="vadvancedsettings_media-controls-toggle" {{# video.controls }}checked{{/ video.controls }}/>
<label class="form-check-label" for="vadvancedsettings_media-controls-toggle">
{{#str}} controls, tiny_media {{/str}}
</label>
</div>
<div class="form-check">
<input type="checkbox" class="form-check-input tiny_media_autoplay"
id="vadvancedsettings_media-autoplay-toggle" {{# video.autoplay }}checked{{/ video.autoplay }}/>
<label class="form-check-label" for="vadvancedsettings_media-autoplay-toggle">
{{#str}} autoplay, tiny_media {{/str}}
</label>
</div>
<div class="form-check">
<input type="checkbox" class="form-check-input tiny_media_mute"
id="vadvancedsettings_media-mute-toggle" {{# video.muted }}checked{{/ video.muted }}/>
<label class="form-check-label" for="vadvancedsettings_media-mute-toggle">
{{#str}} mute, tiny_media {{/str}}
</label>
</div>
<div class="form-check">
<input type="checkbox" class="form-check-input tiny_media_loop"
id="vadvancedsettings_media-loop-toggle" {{# video.loop }}checked{{/ video.loop }}/>
<label class="form-check-label" for="vadvancedsettings_media-loop-toggle">
{{#str}} loop, tiny_media {{/str}}
</label>
</div>
</div>
</div>
</fieldset>
<fieldset class="collapsible collapsed" id="{{elementid}}_video-tracks">
<input name="mform_isexpanded_{{elementid}}_video-tracks" type="hidden">
<legend class="d-flex align-items-center px-1">
<div class="position-relative d-flex ftoggler align-items-center position-relative mr-1">
<a role="button" data-toggle="collapse" href="#vtracks" aria-expanded="false"
aria-controls="vtracks"
class="btn btn-icon mr-1 icons-collapse-expand stretched-link fheader collapsed">
<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="sr-only">{{#str}} tracks, tiny_media {{/str}}</span>
</a>
<h3 class="d-flex align-self-stretch align-items-center mb-0" aria-hidden="true">
{{#str}} tracks, tiny_media {{/str}}
</h3>
</div>
{{#trackshelpicon}}
{{> core/help_icon }}
{{/trackshelpicon}}
</legend>
<div id="vtracks" class="fcontainer collapseable collapse px-1">
<ul class="nav nav-tabs mb-3">
<li data-track-kind="subtitles" class="nav-item">
<a class="nav-link active" href="#{{elementid}}_vtracks_subtitles"
role="tab" data-toggle="tab">
{{#str}} subtitles, tiny_media {{/str}}
</a>
</li>
<li data-track-kind="captions" class="nav-item">
<a class="nav-link" href="#{{elementid}}_vtracks_captions" role="tab" data-toggle="tab">
{{#str}} captions, tiny_media {{/str}}
</a>
</li>
<li data-track-kind="descriptions" class="nav-item">
<a class="nav-link" href="#{{elementid}}_vtracks_descriptions"
role="tab" data-toggle="tab">
{{#str}} descriptions, tiny_media {{/str}}
</a>
</li>
<li data-track-kind="chapters" class="nav-item">
<a class="nav-link" href="#{{elementid}}_vtracks_chapters" role="tab" data-toggle="tab">
{{#str}} chapters, tiny_media {{/str}}
</a>
</li>
<li data-track-kind="metadata" class="nav-item">
<a class="nav-link" href="#{{elementid}}_vtracks_metadata" role="tab" data-toggle="tab">
{{#str}} metadata, tiny_media {{/str}}
</a>
</li>
</ul>
<div class="tab-content">
<div data-track-kind="subtitles" class="tab-pane active"
id="{{elementid}}_vtracks_subtitles">
<div class="trackhelp">
{{#subtitleshelpicon}}
{{> core/help_icon }}
{{/subtitleshelpicon}}
</div>
{{#video.tracks.subtitles}}
<div class="mb-1 tiny_media_track">
<div class="tiny_media_source tiny_media_track_source">
<div class="mb-1">
<label for="subtitle-video-url-input">
{{#str}} subtitlessourcelabel, tiny_media {{/str}}
</label>
<div class="input-group input-append w-100">
<input id="subtitle-video-url-input" class="form-control tiny_media_url_entry" type="url" size="32" value="{{src}}"/>
{{#showfilepickertrack}}
<span class="input-group-append">
<button class="btn btn-secondary openmediabrowser" type="button">{{#str}} browserepositories, tiny_media {{/str}}</button>
</span>
{{/showfilepickertrack}}
</div>
</div>
</div>
<div class="mb-3">
<label class="w-100" for="subtitle-video-lang-input">{{#str}} srclang, tiny_media {{/str}}</label>
<select id="subtitle-video-lang-input" class="custom-select tiny_media_track_lang_entry" data-value="{{srclang}}">
<optgroup label="{{#str}} languagesinstalled, tiny_media {{/str}}">
{{#langsinstalled}}
<option value="{{code}}" {{#default}}selected="selected"{{/default}}>{{lang}}</option>
{{/langsinstalled}}
</optgroup>
<optgroup label="{{#str}} languagesavailable, tiny_media {{/str}} ">
{{#langsavailable}}
<option value="{{code}}">{{lang}}</option>
{{/langsavailable}}
</optgroup>
</select>
</div>
<div class="mb-3">
<label class="w-100" for="subtitle-video-track-input">{{#str}} label, tiny_media {{/str}}</label>
<input id="subtitle-video-track-input" class="form-control tiny_media_track_label_entry" type="text" value="{{label}}"/>
</div>
<div class="form-check">
<input type="checkbox" class="form-check-input tiny_media_track_default" {{# defaultTrack }}checked{{/ defaultTrack }}/>
<label class="form-check-label">{{#str}} default, tiny_media {{/str}}</label>
</div>
<div class="addcomponent-wrapper">
<a href="#" class="addcomponent">
{{#str}} addsubtitlestrack, tiny_media {{/str}}
</a>
</div>
<div class="removecomponent-wrapper hidden">
<a href="#" class="removecomponent">
{{#str}} remove, tiny_media {{/str}}
</a>
</div>
</div>
{{/video.tracks.subtitles}}
{{^video.tracks.subtitles}}
<div class="mb-1 tiny_media_track">
<div class="tiny_media_source tiny_media_track_source">
<div class="mb-1">
<label for="subtitle-video-url-input">
{{#str}} subtitlessourcelabel, tiny_media {{/str}}
</label>
<div class="input-group input-append w-100">
<input id="subtitle-video-url-input" class="form-control tiny_media_url_entry" type="url" size="32"/>
{{#showfilepickertrack}}
<span class="input-group-append">
<button class="btn btn-secondary openmediabrowser" type="button">{{#str}} browserepositories, tiny_media {{/str}}</button>
</span>
{{/showfilepickertrack}}
</div>
</div>
</div>
<div class="mb-3">
<label class="w-100" for="subtitle-video-lang-input">{{#str}} srclang, tiny_media {{/str}}</label>
<select id="subtitle-video-lang-input" class="custom-select tiny_media_track_lang_entry">
<optgroup label="{{#str}} languagesinstalled, tiny_media {{/str}}">
{{#langsinstalled}}
<option value="{{code}}" {{#default}}selected="selected"{{/default}}>{{lang}}</option>
{{/langsinstalled}}
</optgroup>
<optgroup label="{{#str}} languagesavailable, tiny_media {{/str}} ">
{{#langsavailable}}
<option value="{{code}}">{{lang}}</option>
{{/langsavailable}}
</optgroup>
</select>
</div>
<div class="mb-3">
<label class="w-100" for="subtitle-video-track-input">{{#str}} label, tiny_media {{/str}}</label>
<input id="subtitle-video-track-input" class="form-control tiny_media_track_label_entry" type="text"/>
</div>
<div class="form-check">
<input type="checkbox" class="form-check-input tiny_media_track_default"/>
<label class="form-check-label">{{#str}} default, tiny_media {{/str}}</label>
</div>
<div class="addcomponent-wrapper">
<a href="#" class="addcomponent">
{{#str}} addsubtitlestrack, tiny_media {{/str}}
</a>
</div>
<div class="removecomponent-wrapper hidden">
<a href="#" class="removecomponent">
{{#str}} remove, tiny_media {{/str}}
</a>
</div>
</div>
{{/video.tracks.subtitles}}
</div>
<div data-track-kind="captions" class="tab-pane"
id="{{elementid}}_vtracks_captions">
<div class="trackhelp">
{{#captionshelpicon}}
{{> core/help_icon }}
{{/captionshelpicon}}
</div>
{{#video.tracks.captions}}
<div class="mb-1 tiny_media_track">
<div class="tiny_media_source tiny_media_track_source">
<div class="mb-1">
<label for="caption-video-url-input">
{{#str}} captionssourcelabel, tiny_media {{/str}}
</label>
<div class="input-group input-append w-100">
<input id="caption-video-url-input" class="form-control tiny_media_url_entry" type="url" size="32" value="{{src}}"/>
{{#showfilepickertrack}}
<span class="input-group-append">
<button class="btn btn-secondary openmediabrowser" type="button">{{#str}} browserepositories, tiny_media {{/str}}</button>
</span>
{{/showfilepickertrack}}
</div>
</div>
</div>
<div class="mb-3">
<label class="w-100" for="caption-video-lang-input">{{#str}} srclang, tiny_media {{/str}}</label>
<select id="caption-video-lang-input" class="custom-select tiny_media_track_lang_entry" data-value="{{srclang}}">
<optgroup label="{{#str}} languagesinstalled, tiny_media {{/str}}">
{{#langsinstalled}}
<option value="{{code}}" {{#default}}selected="selected"{{/default}}>{{lang}}</option>
{{/langsinstalled}}
</optgroup>
<optgroup label="{{#str}} languagesavailable, tiny_media {{/str}} ">
{{#langsavailable}}
<option value="{{code}}">{{lang}}</option>
{{/langsavailable}}
</optgroup>
</select>
</div>
<div class="mb-3">
<label class="w-100" for="caption-video-track-input">{{#str}} label, tiny_media {{/str}}</label>
<input id="caption-video-track-input" class="form-control tiny_media_track_label_entry" type="text" value="{{label}}"/>
</div>
<div class="form-check">
<input type="checkbox" class="form-check-input tiny_media_track_default" {{# defaultTrack }}checked{{/ defaultTrack }}/>
<label class="form-check-label">{{#str}} default, tiny_media {{/str}}</label>
</div>
<div class="addcomponent-wrapper">
<a href="#" class="addcomponent">
{{#str}} addcaptionstrack, tiny_media {{/str}}
</a>
</div>
<div class="removecomponent-wrapper hidden">
<a href="#" class="removecomponent">
{{#str}} remove, tiny_media {{/str}}
</a>
</div>
</div>
{{/video.tracks.captions}}
{{^video.tracks.captions}}
<div class="mb-1 tiny_media_track">
<div class="tiny_media_source tiny_media_track_source">
<div class="mb-1">
<label for="caption-video-url-input">
{{#str}} captionssourcelabel, tiny_media {{/str}}
</label>
<div class="input-group input-append w-100">
<input id="caption-video-url-input" class="form-control tiny_media_url_entry" type="url" size="32"/>
{{#showfilepickertrack}}
<span class="input-group-append">
<button class="btn btn-secondary openmediabrowser" type="button">{{#str}} browserepositories, tiny_media {{/str}}</button>
</span>
{{/showfilepickertrack}}
</div>
</div>
</div>
<div class="mb-3">
<label class="w-100" for="caption-video-lang-input">{{#str}} srclang, tiny_media {{/str}}</label>
<select id="caption-video-lang-input" class="custom-select tiny_media_track_lang_entry">
<optgroup label="{{#str}} languagesinstalled, tiny_media {{/str}}">
{{#langsinstalled}}
<option value="{{code}}" {{#default}}selected="selected"{{/default}}>{{lang}}</option>
{{/langsinstalled}}
</optgroup>
<optgroup label="{{#str}} languagesavailable, tiny_media {{/str}} ">
{{#langsavailable}}
<option value="{{code}}">{{lang}}</option>
{{/langsavailable}}
</optgroup>
</select>
</div>
<div class="mb-3">
<label class="w-100" for="caption-video-track-input">{{#str}} label, tiny_media {{/str}}</label>
<input id="caption-video-track-input" class="form-control tiny_media_track_label_entry" type="text"/>
</div>
<div class="form-check">
<input type="checkbox" class="form-check-input tiny_media_track_default"/>
<label class="form-check-label">{{#str}} default, tiny_media {{/str}}</label>
</div>
<div class="addcomponent-wrapper">
<a href="#" class="addcomponent">
{{#str}} addcaptionstrack, tiny_media {{/str}}
</a>
</div>
<div class="removecomponent-wrapper hidden">
<a href="#" class="removecomponent">
{{#str}} remove, tiny_media {{/str}}
</a>
</div>
</div>
{{/video.tracks.captions}}
</div>
<div data-track-kind="descriptions" class="tab-pane"
id="{{elementid}}_vtracks_descriptions">
<div class="trackhelp">
{{#descriptionshelpicon}}
{{> core/help_icon }}
{{/descriptionshelpicon}}
</div>
{{#video.tracks.descriptions}}
<div class="mb-1 tiny_media_track">
<div class="tiny_media_source tiny_media_track_source">
<div class="mb-1">
<label for="description-video-url-input">
{{#str}} descriptionssourcelabel, tiny_media {{/str}}
</label>
<div class="input-group input-append w-100">
<input id="description-video-url-input" class="form-control tiny_media_url_entry" type="url" size="32" value="{{src}}"/>
{{#showfilepickertrack}}
<span class="input-group-append">
<button class="btn btn-secondary openmediabrowser" type="button">{{#str}} browserepositories, tiny_media {{/str}}</button>
</span>
{{/showfilepickertrack}}
</div>
</div>
</div>
<div class="mb-3">
<label class="w-100" for="description-video-lang-input">{{#str}} srclang, tiny_media {{/str}}</label>
<select id="description-video-ang-input" class="custom-select tiny_media_track_lang_entry" data-value="{{srclang}}">
<optgroup label="{{#str}} languagesinstalled, tiny_media {{/str}}">
{{#langsinstalled}}
<option value="{{code}}" {{#default}}selected="selected"{{/default}}>{{lang}}</option>
{{/langsinstalled}}
</optgroup>
<optgroup label="{{#str}} languagesavailable, tiny_media {{/str}} ">
{{#langsavailable}}
<option value="{{code}}">{{lang}}</option>
{{/langsavailable}}
</optgroup>
</select>
</div>
<div class="mb-3">
<label class="w-100" for="description-video-track-input">{{#str}} label, tiny_media {{/str}}</label>
<input id="description-video-track-input" class="form-control tiny_media_track_label_entry" type="text" value="{{label}}"/>
</div>
<div class="form-check">
<input type="checkbox" class="form-check-input tiny_media_track_default" {{# defaultTrack }}checked{{/ defaultTrack }}/>
<label class="form-check-label">{{#str}} default, tiny_media {{/str}}</label>
</div>
<div class="addcomponent-wrapper">
<a href="#" class="addcomponent">
{{#str}} adddescriptionstrack, tiny_media {{/str}}
</a>
</div>
<div class="removecomponent-wrapper hidden">
<a href="#" class="removecomponent">
{{#str}} remove, tiny_media {{/str}}
</a>
</div>
</div>
{{/video.tracks.descriptions}}
{{^video.tracks.descriptions}}
<div class="mb-1 tiny_media_track">
<div class="tiny_media_source tiny_media_track_source">
<div class="mb-1">
<label for="description-video-url-input">
{{#str}} descriptionssourcelabel, tiny_media {{/str}}
</label>
<div class="input-group input-append w-100">
<input id="description-video-url-input" class="form-control tiny_media_url_entry" type="url" size="32"/>
{{#showfilepickertrack}}
<span class="input-group-append">
<button class="btn btn-secondary openmediabrowser" type="button">{{#str}} browserepositories, tiny_media {{/str}}</button>
</span>
{{/showfilepickertrack}}
</div>
</div>
</div>
<div class="mb-3">
<label class="w-100" for="description-video-lang-input">{{#str}} srclang, tiny_media {{/str}}</label>
<select id="description-video-lang-input" class="custom-select tiny_media_track_lang_entry">
<optgroup label="{{#str}} languagesinstalled, tiny_media {{/str}}">
{{#langsinstalled}}
<option value="{{code}}" {{#default}}selected="selected"{{/default}}>{{lang}}</option>
{{/langsinstalled}}
</optgroup>
<optgroup label="{{#str}} languagesavailable, tiny_media {{/str}} ">
{{#langsavailable}}
<option value="{{code}}">{{lang}}</option>
{{/langsavailable}}
</optgroup>
</select>
</div>
<div class="mb-3">
<label class="w-100" for="description-video-track-input">{{#str}} label, tiny_media {{/str}}</label>
<input id="description-video-track-input" class="form-control tiny_media_track_label_entry" type="text"/>
</div>
<div class="form-check">
<input type="checkbox" class="form-check-input tiny_media_track_default"/>
<label class="form-check-label">{{#str}} default, tiny_media {{/str}}</label>
</div>
<div class="addcomponent-wrapper">
<a href="#" class="addcomponent">
{{#str}} adddescriptionstrack, tiny_media {{/str}}
</a>
</div>
<div class="removecomponent-wrapper hidden">
<a href="#" class="removecomponent">
{{#str}} remove, tiny_media {{/str}}
</a>
</div>
</div>
{{/video.tracks.descriptions}}
</div>
<div data-track-kind="chapters" class="tab-pane"
id="{{elementid}}_vtracks_chapters">
<div class="trackhelp">
{{#chaptershelpicon}}
{{> core/help_icon }}
{{/chaptershelpicon}}
</div>
{{#video.tracks.chapters}}
<div class="mb-1 tiny_media_track">
<div class="tiny_media_source tiny_media_track_source">
<div class="mb-1">
<label for="chapter-video-url-input">
{{#str}} chapterssourcelabel, tiny_media {{/str}}
</label>
<div class="input-group input-append w-100">
<input id="chapter-video-url-input" class="form-control tiny_media_url_entry" type="url" size="32" value="{{src}}"/>
{{#showfilepickertrack}}
<span class="input-group-append">
<button class="btn btn-secondary openmediabrowser" type="button">{{#str}} browserepositories, tiny_media {{/str}}</button>
</span>
{{/showfilepickertrack}}
</div>
</div>
</div>
<div class="mb-3">
<label class="w-100" for="chapter-video-lang-input">{{#str}} srclang, tiny_media {{/str}}</label>
<select id="chapter-video-lang-input" class="custom-select tiny_media_track_lang_entry" data-value="{{srclang}}">
<optgroup label="{{#str}} languagesinstalled, tiny_media {{/str}}">
{{#langsinstalled}}
<option value="{{code}}" {{#default}}selected="selected"{{/default}}>{{lang}}</option>
{{/langsinstalled}}
</optgroup>
<optgroup label="{{#str}} languagesavailable, tiny_media {{/str}} ">
{{#langsavailable}}
<option value="{{code}}">{{lang}}</option>
{{/langsavailable}}
</optgroup>
</select>
</div>
<div class="mb-3">
<label class="w-100" for="chapter-video-track-input">{{#str}} label, tiny_media {{/str}}</label>
<input id="chapter-video-track-input" class="form-control tiny_media_track_label_entry" type="text" value="{{label}}"/>
</div>
<div class="form-check">
<input type="checkbox" class="form-check-input tiny_media_track_default" {{# defaultTrack }}checked{{/ defaultTrack }}/>
<label class="form-check-label">{{#str}} default, tiny_media {{/str}}</label>
</div>
<div class="addcomponent-wrapper">
<a href="#" class="addcomponent">
{{#str}} addchapterstrack, tiny_media {{/str}}
</a>
</div>
<div class="removecomponent-wrapper hidden">
<a href="#" class="removecomponent">
{{#str}} remove, tiny_media {{/str}}
</a>
</div>
</div>
{{/video.tracks.chapters}}
{{^video.tracks.chapters}}
<div class="mb-1 tiny_media_track">
<div class="tiny_media_source tiny_media_track_source">
<div class="mb-1">
<label for="chapter-video-url-input">
{{#str}} chapterssourcelabel, tiny_media {{/str}}
</label>
<div class="input-group input-append w-100">
<input id="chapter-video-url-input" class="form-control tiny_media_url_entry" type="url" size="32"/>
{{#showfilepickertrack}}
<span class="input-group-append">
<button class="btn btn-secondary openmediabrowser" type="button">{{#str}} browserepositories, tiny_media {{/str}}</button>
</span>
{{/showfilepickertrack}}
</div>
</div>
</div>
<div class="mb-3">
<label class="w-100" for="chapter-video-lang-input">{{#str}} srclang, tiny_media {{/str}}</label>
<select id="chapter-video-lang-input" class="custom-select tiny_media_track_lang_entry">
<optgroup label="{{#str}} languagesinstalled, tiny_media {{/str}}">
{{#langsinstalled}}
<option value="{{code}}" {{#default}}selected="selected"{{/default}}>{{lang}}</option>
{{/langsinstalled}}
</optgroup>
<optgroup label="{{#str}} languagesavailable, tiny_media {{/str}} ">
{{#langsavailable}}
<option value="{{code}}">{{lang}}</option>
{{/langsavailable}}
</optgroup>
</select>
</div>
<div class="mb-3">
<label class="w-100" for="chapter-video-track-input">{{#str}} label, tiny_media {{/str}}</label>
<input id="chapter-video-track-input" class="form-control tiny_media_track_label_entry" type="text"/>
</div>
<div class="form-check">
<input type="checkbox" class="form-check-input tiny_media_track_default"/>
<label class="form-check-label">{{#str}} default, tiny_media {{/str}}</label>
</div>
<div class="addcomponent-wrapper">
<a href="#" class="addcomponent">
{{#str}} addchapterstrack, tiny_media {{/str}}
</a>
</div>
<div class="removecomponent-wrapper hidden">
<a href="#" class="removecomponent">
{{#str}} remove, tiny_media {{/str}}
</a>
</div>
</div>
{{/video.tracks.chapters}}
</div>
<div data-track-kind="metadata" class="tab-pane"
id="{{elementid}}_vtracks_metadata">
<div class="trackhelp">{{{helpStrings.metadata}}}</div>
<div class="trackhelp">
{{#metadatahelpicon}}
{{> core/help_icon }}
{{/metadatahelpicon}}
</div>
{{#video.tracks.metadata}}
<div class="mb-1 tiny_media_track">
<div class="tiny_media_source tiny_media_track_source">
<div class="mb-1">
<label for="metadata-video-url-input">
{{#str}} metadatasourcelabel, tiny_media {{/str}}
</label>
<div class="input-group input-append w-100">
<input id="metadata-video-url-input" class="form-control tiny_media_url_entry" type="url" size="32" value="{{src}}"/>
{{#showfilepickertrack}}
<span class="input-group-append">
<button class="btn btn-secondary openmediabrowser" type="button">{{#str}} browserepositories, tiny_media {{/str}}</button>
</span>
{{/showfilepickertrack}}
</div>
</div>
</div>
<div class="mb-3">
<label class="w-100" for="metadata-video-lang-input">{{#str}} srclang, tiny_media {{/str}}</label>
<select id="metadata-video-lang-input" class="custom-select tiny_media_track_lang_entry" data-value="{{srclang}}">
<optgroup label="{{#str}} languagesinstalled, tiny_media {{/str}}">
{{#langsinstalled}}
<option value="{{code}}" {{#default}}selected="selected"{{/default}}>{{lang}}</option>
{{/langsinstalled}}
</optgroup>
<optgroup label="{{#str}} languagesavailable, tiny_media {{/str}} ">
{{#langsavailable}}
<option value="{{code}}">{{lang}}</option>
{{/langsavailable}}
</optgroup>
</select>
</div>
<div class="mb-3">
<label class="w-100" for="metadata-video-track-input">{{#str}} label, tiny_media {{/str}}</label>
<input id="metadata-video-track-input" class="form-control tiny_media_track_label_entry" type="text" value="{{label}}"/>
</div>
<div class="form-check">
<input type="checkbox" class="form-check-input tiny_media_track_default" {{# defaultTrack }}checked{{/ defaultTrack }}/>
<label class="form-check-label">{{#str}} default, tiny_media {{/str}}</label>
</div>
<div class="addcomponent-wrapper">
<a href="#" class="addcomponent">
{{#str}} addmetadatatrack, tiny_media {{/str}}
</a>
</div>
<div class="removecomponent-wrapper hidden">
<a href="#" class="removecomponent">
{{#str}} remove, tiny_media {{/str}}
</a>
</div>
</div>
{{/video.tracks.metadata}}
{{^video.tracks.metadata}}
<div class="mb-1 tiny_media_track">
<div class="tiny_media_source tiny_media_track_source">
<div class="mb-1">
<label for="metadata-video-url-input">
{{#str}} metadatasourcelabel, tiny_media {{/str}}
</label>
<div class="input-group input-append w-100">
<input id="metadata-video-url-input" class="form-control tiny_media_url_entry" type="url" size="32"/>
{{#showfilepickertrack}}
<span class="input-group-append">
<button class="btn btn-secondary openmediabrowser" type="button">{{#str}} browserepositories, tiny_media {{/str}}</button>
</span>
{{/showfilepickertrack}}
</div>
</div>
</div>
<div class="mb-3">
<label class="w-100" for="metadata-video-lang-input">{{#str}} srclang, tiny_media {{/str}}</label>
<select id="metadata-video-lang-input" class="custom-select tiny_media_track_lang_entry">
<optgroup label="{{#str}} languagesinstalled, tiny_media {{/str}}">
{{#langsinstalled}}
<option value="{{code}}" {{#default}}selected="selected"{{/default}}>{{lang}}</option>
{{/langsinstalled}}
</optgroup>
<optgroup label="{{#str}} languagesavailable, tiny_media {{/str}} ">
{{#langsavailable}}
<option value="{{code}}">{{lang}}</option>
{{/langsavailable}}
</optgroup>
</select>
</div>
<div class="mb-3">
<label class="w-100" for="metadata-video-track-input">{{#str}} label, tiny_media {{/str}}</label>
<input id="metadata-video-track-input" class="form-control tiny_media_track_label_entry" type="text"/>
</div>
<div class="form-check">
<input type="checkbox" class="form-check-input tiny_media_track_default"/>
<label class="form-check-label">{{#str}} default, tiny_media {{/str}}</label>
</div>
<div class="addcomponent-wrapper">
<a href="#" class="addcomponent">
{{#str}} addmetadatatrack, tiny_media {{/str}}
</a>
</div>
<div class="removecomponent-wrapper hidden">
<a href="#" class="removecomponent">
{{#str}} remove, tiny_media {{/str}}
</a>
</div>
</div>
{{/video.tracks.metadata}}
</div>
</div>
</div>
</fieldset>