add the id to container dom

This commit is contained in:
Harvey committed 2021-12-03 08:46:02 +08:00
1 parent 7584aeafe3
commit 44f3665a55
4 files changed
+11 -10

No files matched your search

+7 -7
View File
@@ -890,6 +890,7 @@
this.$miniClose = this.query('.art-mini-close');
this.$contextmenu = this.query('.art-contextmenus');
this.$player.style.setProperty('--theme', theme);
this.$container.dataset.artId = this.art.id;
if (backdrop) {
addClass(this.$settingInner, 'art-backdrop-filter');
@@ -920,7 +921,7 @@
}], [{
key: "html",
get: function get() {
return "\n <div class=\"art-video-player art-subtitle-show art-layer-show\">\n <video class=\"art-video\"></video>\n <div class=\"art-poster\"></div>\n <div class=\"art-subtitle\"></div>\n <div class=\"art-danmuku\"></div>\n <div class=\"art-layers\"></div>\n <div class=\"art-mask\">\n <div class=\"art-state\"></div>\n </div>\n <div class=\"art-bottom\">\n <div class=\"art-progress\"></div>\n <div class=\"art-controls\">\n <div class=\"art-controls-left\"></div>\n <div class=\"art-controls-right\"></div>\n </div>\n </div>\n <div class=\"art-loading\"></div>\n <div class=\"art-notice\">\n <div class=\"art-notice-inner\"></div>\n </div>\n <div class=\"art-settings\">\n <div class=\"art-setting-inner\">\n <div class=\"art-setting-body\"></div>\n </div>\n </div>\n <div class=\"art-info\">\n <div class=\"art-info-panel\">\n <div class=\"art-info-item\">\n <div class=\"art-info-title\">Player version:</div>\n <div class=\"art-info-content\">4.0.1</div>\n </div>\n <div class=\"art-info-item\">\n <div class=\"art-info-title\">Video url:</div>\n <div class=\"art-info-content\" data-video=\"src\"></div>\n </div>\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 <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 <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 <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 </div>\n <div class=\"art-info-close\">[x]</div>\n </div>\n <div class=\"art-mini-header\">\n <div class=\"art-mini-title\"></div>\n <div class=\"art-mini-close\">\xD7</div>\n </div>\n <div class=\"art-contextmenus\"></div>\n </div>\n ";
return "\n <div class=\"art-video-player art-subtitle-show art-layer-show\">\n <video class=\"art-video\"></video>\n <div class=\"art-poster\"></div>\n <div class=\"art-subtitle\"></div>\n <div class=\"art-danmuku\"></div>\n <div class=\"art-layers\"></div>\n <div class=\"art-mask\">\n <div class=\"art-state\"></div>\n </div>\n <div class=\"art-bottom\">\n <div class=\"art-progress\"></div>\n <div class=\"art-controls\">\n <div class=\"art-controls-left\"></div>\n <div class=\"art-controls-right\"></div>\n </div>\n </div>\n <div class=\"art-loading\"></div>\n <div class=\"art-notice\">\n <div class=\"art-notice-inner\"></div>\n </div>\n <div class=\"art-settings\">\n <div class=\"art-setting-inner\">\n <div class=\"art-setting-body\"></div>\n </div>\n </div>\n <div class=\"art-info\">\n <div class=\"art-info-panel\">\n <div class=\"art-info-item\">\n <div class=\"art-info-title\">Player version:</div>\n <div class=\"art-info-content\">4.0.2</div>\n </div>\n <div class=\"art-info-item\">\n <div class=\"art-info-title\">Video url:</div>\n <div class=\"art-info-content\" data-video=\"src\"></div>\n </div>\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 <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 <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 <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 </div>\n <div class=\"art-info-close\">[x]</div>\n </div>\n <div class=\"art-mini-header\">\n <div class=\"art-mini-title\"></div>\n <div class=\"art-mini-close\">\xD7</div>\n </div>\n <div class=\"art-contextmenus\"></div>\n </div>\n ";
}
}]);
@@ -3396,7 +3397,7 @@
function version(option) {
return _objectSpread$6(_objectSpread$6({}, option), {}, {
html: '<a href="https://artplayer.org" target="_blank">ArtPlayer 4.0.1</a>'
html: '<a href="https://artplayer.org" target="_blank">ArtPlayer 4.0.2</a>'
});
}
@@ -4782,6 +4783,7 @@
_classCallCheck(this, Artplayer);
_this = _super.call(this);
_this.id = ++id;
_this.option = validator(mergeDeep(Artplayer.option, option), scheme);
_this.isFocus = false;
_this.isDestroy = false;
@@ -4812,8 +4814,6 @@
_this.mobile = new Mobile(_assertThisInitialized(_this));
}
id += 1;
_this.id = id;
instances.push(_assertThisInitialized(_this));
return _this;
}
@@ -4836,7 +4836,7 @@
}, {
key: "version",
get: function get() {
return '4.0.1';
return '4.0.2';
}
}, {
key: "env",
@@ -4846,7 +4846,7 @@
}, {
key: "build",
get: function get() {
return '1638339306854';
return '1638492131424';
}
}, {
key: "config",
@@ -4951,7 +4951,7 @@
return Artplayer;
}(Emitter); // eslint-disable-next-line no-console
console.log('%c ArtPlayer %c 4.0.1 %c https://artplayer.org', 'color: #fff; background: #5f5f5f', 'color: #fff; background: #4bc729', '');
console.log('%c ArtPlayer %c 4.0.2 %c https://artplayer.org', 'color: #fff; background: #5f5f5f', 'color: #fff; background: #4bc729', '');
return Artplayer;