0
У меня возникла проблема с видеоконтролем. Я должен упустить какой-то шаг в процессе установки. Думаю, мне нужно включить шрифт некоторых символов, но не знаю, где его найти и как его включить.Элементы управления шрифтом/символами отсутствуют - videogular
Элементы управления, как представляется, не имеют изображений/символов/шрифтов - вместо этого я получаю пустые прямоугольники (здесь не хватает репутации, чтобы опубликовать скриншот). Вот Включаемые файлы:
"/js/Vendors/videogular/videogular.min.js",
"/js/Vendors/videogular/vg-controls.min.js",
"/js/Vendors/videogular/vg-poster.min.js",
"/js/Vendors/videogular/vg-buffering.min.js",
"/js/Vendors/videogular/vg-overlay-play.min.js",
Вот что передается в модуль:
"ngSanitize",
"com.2fdevs.videogular",
"com.2fdevs.videogular.plugins.controls",
"com.2fdevs.videogular.plugins.overlayplay",
"com.2fdevs.videogular.plugins.poster"
И код контроллера:
App.controller('Player',
["$sce", function ($sce) {
var controller = this;
controller.API = null;
controller.onPlayerReady = function(API) {
controller.API = API;
};
controller.fscreen=function(){
controller.API.toggleFullScreen();
};
this.config = {
sources: [
{src: $sce.trustAsResourceUrl('http://'+document.domain+"/data/video/trailer.mp4"), type: "video/mp4"},
{src: $sce.trustAsResourceUrl('http://'+document.domain+"/data/video/trailer.webm"), type: "video/webm"}
],
width: 1920,
height: 1080,
responsive: true,
theme: {
url:"http://www.videogular.com/styles/themes/default/latest/videogular.css",
playIcon: "",
pauseIcon: "",
volumeLevel3Icon: "",
volumeLevel2Icon: "",
volumeLevel1Icon: "",
volumeLevel0Icon: "",
muteIcon: "",
enterFullScreenIcon: "",
exitFullScreenIcon: ""
},
};
}]
);
HTML (Прут) Код:
{% extends "base.html.twig" %}
{% block content %}
<controller-wrapper data-ng-controller="Transit as T">
<controller-wrapper ng-controller="Player as controller">
<videogular vg-player-ready="controller.onPlayerReady($API)" vg-theme="controller.config.theme">
<div id="wrapper">
{% include '/commons/header.html.twig' %}
<main >
<div id="play" data-ng-click="T.transit=!T.transit;" data-ng-hide="T.transit">
<h1>Watch trailer</h1>
<p>(video pitch)</p>
</div>
<div class="videogular-container" data-ng-show="T.transit" >
<vg-media vg-src="controller.config.sources">
</vg-media>
<vg-controls>
<vg-play-pause-button></vg-play-pause-button>
<vg-time-display>{{'{{ currentTime | date:"mm:ss" }}'}}</vg-time-display>
<vg-scrub-bar>
<vg-scrub-bar-current-time></vg-scrub-bar-current-time>
</vg-scrub-bar>
<vg-time-display>{{'{{ timeLeft | date:"mm:ss" }}'}}</vg-time-display>
<vg-volume>
<vg-mute-button></vg-mute-button>
<vg-volume-bar></vg-volume-bar>
</vg-volume>
<vg-fullscreen-button></vg-fullscreen-button>
</vg-controls>
</div>
</main>
<div id="push-footer"></div>
</div>
{% include '/commons/footer.html.twig' %}
</videogular>
</controller-wrapper>
</controller-wrapper>
{% endblock %}
Вы видите ошибки в консоли? Возможно, вы используете старую версию Videogular, и вы должны обновить ее до последней версии. Смотрите: http://www.videogular.com/tutorials/migration-guide-to-videogular-1-0-0/ – elecash
Версия 1.2.1 В консоли нет ошибок. И воспроизведение работает - и вы можете играть/приостанавливать его, это просто изображения \ символы на отсутствующих кнопках –
Не могли бы вы разместить свой HTML? Возможно, вы неправильно настроили атрибут vg-theme в теге видеогуля. – elecash