mirror of
https://github.com/zhw2590582/ArtPlayer.git
synced 2026-10-20 12:11:20 -08:00
add more info
This commit is contained in:
1 parent
582cd688b1
commit
7688e770cd
5 files changed
+71
-18
No files matched your search
+29
-7
@@ -1496,6 +1496,7 @@
|
||||
|
||||
if (!$infoPanel.innerHTML) {
|
||||
append($infoPanel, this.creatInfo());
|
||||
this.getHeader();
|
||||
}
|
||||
|
||||
clearTimeout(this.timer);
|
||||
@@ -1507,13 +1508,34 @@
|
||||
value: function creatInfo() {
|
||||
var infoHtml = [];
|
||||
infoHtml.push("\n <div class=\"art-info-item \">\n <div class=\"art-info-title\">Player version:</div>\n <div class=\"art-info-content\">1.0.0</div>\n </div>\n ");
|
||||
infoHtml.push("\n <div class=\"art-info-item\">\n <div class=\"art-info-title\">Video url:</div>\n <div class=\"art-info-content\" data-type=\"currentSrc\"></div>\n </div>\n ");
|
||||
infoHtml.push("\n <div class=\"art-info-item\">\n <div class=\"art-info-title\">Video volume:</div>\n <div class=\"art-info-content\" data-type=\"volume\"></div>\n </div>\n ");
|
||||
infoHtml.push("\n <div class=\"art-info-item\">\n <div class=\"art-info-title\">Video time:</div>\n <div class=\"art-info-content\" data-type=\"currentTime\"></div>\n </div>\n ");
|
||||
infoHtml.push("\n <div class=\"art-info-item\">\n <div class=\"art-info-title\">Video duration:</div>\n <div class=\"art-info-content\" data-type=\"duration\"></div>\n </div>\n ");
|
||||
infoHtml.push("\n <div class=\"art-info-item\">\n <div class=\"art-info-title\">Video resolution:</div>\n <div class=\"art-info-content\">\n <span data-type=\"videoWidth\"></span> x <span data-type=\"videoHeight\"></span>\n </div>\n </div>\n ");
|
||||
infoHtml.push("\n <div class=\"art-info-item\">\n <div class=\"art-info-title\">Video url:</div>\n <div class=\"art-info-content\" data-video=\"currentSrc\"></div>\n </div>\n ");
|
||||
infoHtml.push("\n <div class=\"art-info-item\">\n <div class=\"art-info-title\">Video type:</div>\n <div class=\"art-info-content\" data-head=\"Content-Type\"></div>\n </div>\n ");
|
||||
infoHtml.push("\n <div class=\"art-info-item\">\n <div class=\"art-info-title\">Video size:</div>\n <div class=\"art-info-content\" data-head=\"Content-length\"></div>\n </div>\n ");
|
||||
infoHtml.push("\n <div class=\"art-info-item\">\n <div class=\"art-info-title\">Video volume:</div>\n <div class=\"art-info-content\" data-video=\"volume\"></div>\n </div>\n ");
|
||||
infoHtml.push("\n <div class=\"art-info-item\">\n <div class=\"art-info-title\">Video time:</div>\n <div class=\"art-info-content\" data-video=\"currentTime\"></div>\n </div>\n ");
|
||||
infoHtml.push("\n <div class=\"art-info-item\">\n <div class=\"art-info-title\">Video duration:</div>\n <div class=\"art-info-content\" data-video=\"duration\"></div>\n </div>\n ");
|
||||
infoHtml.push("\n <div class=\"art-info-item\">\n <div class=\"art-info-title\">Video resolution:</div>\n <div class=\"art-info-content\">\n <span data-video=\"videoWidth\"></span> x <span data-video=\"videoHeight\"></span>\n </div>\n </div>\n ");
|
||||
return infoHtml.join('');
|
||||
}
|
||||
}, {
|
||||
key: "getHeader",
|
||||
value: function getHeader() {
|
||||
var _this$art2 = this.art,
|
||||
url = _this$art2.option.url,
|
||||
$infoPanel = _this$art2.refs.$infoPanel;
|
||||
var types = Array.from($infoPanel.querySelectorAll('[data-head]'));
|
||||
fetch(url, {
|
||||
method: 'HEAD'
|
||||
}).then(function (data) {
|
||||
types.forEach(function (item) {
|
||||
item.innerHTML = data.headers.get(item.dataset.head) || 'unknown';
|
||||
});
|
||||
}).catch(function () {
|
||||
types.forEach(function (item) {
|
||||
item.innerHTML = 'unknown';
|
||||
});
|
||||
});
|
||||
}
|
||||
}, {
|
||||
key: "loop",
|
||||
value: function loop() {
|
||||
@@ -1523,9 +1545,9 @@
|
||||
$infoPanel = _this$art$refs2.$infoPanel,
|
||||
$video = _this$art$refs2.$video;
|
||||
this.timer = setTimeout(function () {
|
||||
var types = Array.from($infoPanel.querySelectorAll('[data-type]'));
|
||||
var types = Array.from($infoPanel.querySelectorAll('[data-video]'));
|
||||
types.forEach(function (item) {
|
||||
item.innerHTML = $video[item.dataset.type];
|
||||
item.innerHTML = $video[item.dataset.video] || 'unknown';
|
||||
});
|
||||
|
||||
_this2.loop();
|
||||
|
||||
Reference in new issue
Block a user