@ezuikit/player-theme 1.0.0-beta.1 → 1.0.1-alpha.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +194 -41
- package/dist/index.mjs +194 -41
- package/dist/index.umd.js +2284 -1382
- package/dist/style.css +3 -3
- package/dist/style.js +2 -2
- package/dist/types/index.d.ts +76 -70
- package/package.json +7 -7
package/dist/style.css
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
:root{--ezplayer-default-color:#fff;--ezplayer-primary-color:#407aff;--ezplayer-active-color:var(--ezplayer-primary-color,#407aff);--ezplayer-disabled-color:#aaa;--ezplayer-font-size:14px;--ezplayer-icon-font-size:24px;--ezplayer-btn-height:var(--ezplayer-icon-font-size,24px);--ezplayer-border-radius:8px;--ezplayer-control-space:16px;--ezplayer-header-height:46px;--ezplayer-footer-height:80px;--ezplayer-fullscreen-control-space:26px;--ezplayer-panel-bg-color:rgba(0,0,0,.7);--ezplayer-mobile-control-space:16px;--ezplayer-mobile-header-height:45px;--ezplayer-mobile-footer-height:54px;--ezplayer-mobile-fullscreen-header-height:75px;--ezplayer-mobile-fullscreen-footer-height:110px;--ezplayer-mobile-fullscreen-control-space:26px;--ezplayer-mobile-extend-bg-color:#f5f7fa;--ezplayer-mobile-extend-default-color:#2c2c2c}
|
|
2
2
|
body.ezplayer-body-mobile-noscroll{background-color:#000!important;height:100vh;overflow:hidden;touch-action:none}.ezplayer,.ezplayer-mobile-extend{background-color:#000;box-sizing:border-box;color:var(--ezplayer-default-color,#fff);display:flex;flex-direction:column;font-size:14px;font-size:var(--ezplayer-font-size,14px);padding:0;position:relative;--webkit-tap-highlight-color:transparent;outline:none}.ezplayer *,.ezplayer-mobile-extend *{-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.ezplayer:-webkit-full-screen{height:100%!important;width:100%!important}.ezplayer *{box-sizing:border-box}.ezplayer li,.ezplayer ul{box-sizing:border-box;list-style:none;margin:0;padding:0}.ezplayer-control{align-items:center;cursor:pointer;display:inline-flex;justify-content:center}.ezplayer-control-block,.ezplayer-control-text{cursor:unset}.ezplayer-control-block{align-items:center;box-sizing:border-box;color:var(--ezplayer-default-color,#fff);display:flex;flex-direction:column;justify-content:center;margin:0;padding:0;-webkit-user-select:none;-moz-user-select:none;user-select:none}.ezplayer-btn,.ezplayer-icon,.ezplayer-text{display:inline-flex;transition:color .2s ease-in-out}.ezplayer-btn{cursor:pointer}.ezplayer-btn,.ezplayer-text{font-size:var(--ezplayer-font-size,14px)}.ezplayer-btn{align-items:center;border:1px solid var(--ezplayer-default-color,#fff);border-radius:12px;border-radius:calc(var(--ezplayer-btn-height, 24px)/2);display:inline-flex;height:var(--ezplayer-btn-height,26px);justify-content:center;padding:2px 10px;white-space:nowrap}.ezplayer-active{border-color:var(--ezplayer-active-color,#0099e5)!important;color:var(--ezplayer-active-color,#0099e5)!important}.ezplayer-disabled,.ezplayer-disabled .ezplayer-btn,.ezplayer-disabled .ezplayer-icon,.ezplayer-disabled .ezplayer-text{border-color:var(--ezplayer-disabled-color,#aaa)!important;color:var(--ezplayer-disabled-color)!important;cursor:not-allowed!important}.ezplayer-hide{display:none!important}.ezplayer-hide-transition{opacity:0!important;pointer-events:none!important}.ezplayer-overflow-hidden{overflow:hidden}.ezplayer-global-fullscreen .ezplayer-footer,.ezplayer-global-fullscreen .ezplayer-header,.ezplayer-global-fullscreen .ezplayer-rec-footer{display:none}.ezplayer-mobile .ezplayer-control-global-fullscreen{display:none!important}.ezplayer-mobile.ezplayer-fullscreen.ezplayer-angle-0,.ezplayer-mobile.ezplayer-fullscreen.ezplayer-angle-180{background-color:#000!important;bottom:0!important;height:100vw!important;height:var(--ezplayer-mobile-inner-width,100vw)!important;left:0!important;overflow:hidden;padding-right:env(safe-area-inset-bottom);position:fixed!important;right:0!important;top:0!important;transform:rotate(90.001deg) translateY(-100%)!important;-webkit-transform:rotate(90.001deg) translateY(-100%)!important;transform-origin:0 0!important;-webkit-transform-origin:0 0!important;width:100vh!important;width:var(--ezplayer-mobile-inner-height,100vh)!important;z-index:9999}.ezplayer-mobile.ezplayer-fullscreen.ezplayer-angle-270,.ezplayer-mobile.ezplayer-fullscreen.ezplayer-angle-90{background-color:#000!important;bottom:0!important;height:100vh!important;height:var(--ezplayer-mobile-inner-height,100vh)!important;left:0!important;overflow:hidden;position:fixed!important;right:0!important;top:0!important;transform:rotate(0deg) translateY(0)!important;-webkit-transform:rotate(0deg) translateY(0)!important;transform-origin:0 0!important;-webkit-transform-origin:0 0!important;width:100vw!important;width:var(--ezplayer-mobile-inner-width,100vw)!important;z-index:9999}
|
|
3
3
|
.ezplayer-footer,.ezplayer-header{align-items:center;box-sizing:border-box;color:var(--ezplayer-default-color,#fff);display:flex;flex-wrap:nowrap;font-size:24px;justify-content:space-between;left:0;opacity:1;position:absolute;right:0;transition:opacity .3s ease;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:100%;z-index:20}.ezplayer-footer-left,.ezplayer-footer-right,.ezplayer-header-left,.ezplayer-header-right{display:inline-flex;flex-direction:row;flex-wrap:nowrap}.ezplayer-footer-left,.ezplayer-header-left{padding-left:20px}.ezplayer-footer-left .ezplayer-control,.ezplayer-header-left .ezplayer-control{margin-right:16px}.ezplayer-footer-left .ezplayer-control:last-child,.ezplayer-header-left .ezplayer-control:last-child{margin-right:0!important}.ezplayer-footer-right,.ezplayer-header-right{padding-right:20px}.ezplayer-footer-right .ezplayer-control,.ezplayer-header-right .ezplayer-control{margin-left:16px}.ezplayer-footer-right .ezplayer-control:first-child,.ezplayer-header-right .ezplayer-control:first-child{margin-left:0!important}.ezplayer-footer .ezplayer-control,.ezplayer-header .ezplayer-control{padding:2px}.ezplayer-footer .ezplayer-control-text+.ezplayer-control-text,.ezplayer-header .ezplayer-control-text+.ezplayer-control-text{margin-left:8px}.ezplayer-footer-more,.ezplayer-header-more{align-items:center;display:flex;flex-direction:row}.ezplayer-header{background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAuCAMAAADeMYNYAAAAbFBMVEUAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAB0Iv+qAAAAJHRSTlOBdGtiTDoxGxIJy8bCvbm0sKyno56alZGMiHtbV1JFQSomIQDNbq/TAAAAPklEQVQI1xXBhQHAIAAEsau7uwv778iTkFNQUlHT0NLRMzAyMbOwsuHseOproAcnF6HePEQa68vHT6KpZmosd8UCpGNSKboAAAAASUVORK5CYII=");box-sizing:border-box;height:46px;margin:0;top:0}.ezplayer-header-left,.ezplayer-header-right{max-width:50%}.ezplayer-control-rec .ezplayer-icon:first-child{margin-left:0}.ezplayer-footer{background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAABQCAQAAAByztdQAAAAIGNIUk0AAHomAACAhAAA+gAAAIDoAAB1MAAA6mAAADqYAAAXcJy6UTwAAAACYktHRAD/h4/MvwAAAAd0SU1FB+kGBAsQDlySUqoAAAABb3JOVAHPoneaAAAAHElEQVQI12NgYGRiYGZiYGJiYEZiYJLECw5q9QCpgAFr/pGonwAAACV0RVh0ZGF0ZTpjcmVhdGUAMjAyNS0wNi0wNFQxMToxNTo1OCswMDowMBLJutIAAAAldEVYdGRhdGU6bW9kaWZ5ADIwMjUtMDYtMDRUMTE6MTU6NTgrMDA6MDBjlAJuAAAAKHRFWHRkYXRlOnRpbWVzdGFtcAAyMDI1LTA2LTA0VDExOjE2OjE0KzAwOjAwnFz8PAAAAABJRU5ErkJggg==");bottom:0;box-sizing:border-box;height:80px;margin:0;padding-top:20px}.ezplayer-mobile .ezplayer-footer,.ezplayer-mobile .ezplayer-header{font-size:24px}.ezplayer-mobile .ezplayer-footer-left .ezplayer-control,.ezplayer-mobile .ezplayer-footer-right .ezplayer-control,.ezplayer-mobile .ezplayer-header-left .ezplayer-control,.ezplayer-mobile .ezplayer-header-right .ezplayer-control{height:24px;padding:0}.ezplayer-mobile .ezplayer-footer-left,.ezplayer-mobile .ezplayer-header-left{padding-left:15px}.ezplayer-mobile .ezplayer-footer-left .ezplayer-control,.ezplayer-mobile .ezplayer-header-left .ezplayer-control{margin-right:15px}.ezplayer-mobile .ezplayer-footer-right,.ezplayer-mobile .ezplayer-header-right{padding-right:15px}.ezplayer-mobile .ezplayer-footer-right .ezplayer-control,.ezplayer-mobile .ezplayer-header-right .ezplayer-control{margin-left:15px}.ezplayer-mobile .ezplayer-footer .ezplayer-control,.ezplayer-mobile .ezplayer-header .ezplayer-control{height:24px;min-width:24px}.ezplayer-mobile .ezplayer-footer .ezplayer-control-text,.ezplayer-mobile .ezplayer-header .ezplayer-control-text{font-size:14px}.ezplayer-mobile .ezplayer-header{background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAAtCAMAAACzkkr1AAAAV1BMVEUAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAOl5NtAAAAHXRSTlOWj4JzaV9YUUQ9MywlGxQKioZ8eW9kTUk4IA8FAKPHi9EAAABMSURBVAjXJcKFDcAwAAOwjKHM+P+dUzTL+C0LWwvnsK7sPULAtnGM2HdOCcfB58nXxTmjFNw3Pw/XivdlIVhKbg1KsdbcO4zhMTDnB9pJBB0jNaXIAAAAAElFTkSuQmCC");background:linear-gradient(180deg,rgba(0,0,0,.6) 0,transparent);height:45px;margin:0;padding:0}.ezplayer-mobile .ezplayer-footer{background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAA2CAQAAABHVIAUAAAAIGNIUk0AAHomAACAhAAA+gAAAIDoAAB1MAAA6mAAADqYAAAXcJy6UTwAAAACYktHRAD/h4/MvwAAAAd0SU1FB+kHGQYOGOvM7YUAAAABb3JOVAHPoneaAAAAFUlEQVQY02NkYGRgYGFgxkUwjShZAMFnAW71uqvOAAAAJXRFWHRkYXRlOmNyZWF0ZQAyMDI1LTA3LTI1VDA2OjE0OjAwKzAwOjAwy873zwAAACV0RVh0ZGF0ZTptb2RpZnkAMjAyNS0wNy0yNVQwNjoxNDowMCswMDowMLqTT3MAAAAodEVYdGRhdGU6dGltZXN0YW1wADIwMjUtMDctMjVUMDY6MTQ6MjQrMDA6MDBb7E3CAAAAAElFTkSuQmCC");background:linear-gradient(180deg,transparent 0,rgba(0,0,0,.6));height:54px;padding-top:0}.ezplayer-mobile.ezplayer-fullscreen .ezplayer-header{background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAABLCAQAAADw6J4LAAAAIGNIUk0AAHomAACAhAAA+gAAAIDoAAB1MAAA6mAAADqYAAAXcJy6UTwAAAACYktHRAD/h4/MvwAAAAd0SU1FB+kHGQYYHh43/WcAAAABb3JOVAHPoneaAAAAKUlEQVQY02NkOM3AwMLwF5X4h5dLOyXD13JmBiaG/8wMjAz/GRkYGRgADI9KMQ6gLKQAAAAldEVYdGRhdGU6Y3JlYXRlADIwMjUtMDctMjVUMDY6MjQ6MTQrMDA6MDBqybVDAAAAJXRFWHRkYXRlOm1vZGlmeQAyMDI1LTA3LTI1VDA2OjI0OjE0KzAwOjAwG5QN/wAAACh0RVh0ZGF0ZTp0aW1lc3RhbXAAMjAyNS0wNy0yNVQwNjoyNDozMCswMDowMPrrD04AAAAASUVORK5CYII=");background:linear-gradient(180deg,rgba(0,0,0,.8) 0,transparent);height:75px}.ezplayer-mobile.ezplayer-fullscreen .ezplayer-footer{background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAABuCAMAAAA6XjI3AAAAaVBMVEUAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAnbPKNAAAAI3RSTlMAQrRXSTozKxUHxb+spqCNh4F1ZVAgDbqTenBqJRvKm5dgXO7N8BQAAABzSURBVBjThcRFDsQwFATRH2Z2mHP/Q447bmuWKT2VfJdIYg0DxTHt2g59T9sGUSQRDmFoBRJYjvPn+6SUKHNPPOt54L6h62hdYdEWaFuaZ2gaacxrqV9VJZX5JNPruuA8oSypKCjPyXVp1EbIMkpTOg7tB7gTDCt3nEtMAAAAAElFTkSuQmCC");background:linear-gradient(180deg,transparent 9%,rgba(0,0,0,.8));height:110px;padding-top:18px}.ezplayer-mobile.ezplayer-fullscreen .ezplayer-footer-left,.ezplayer-mobile.ezplayer-fullscreen .ezplayer-header-left{padding-left:50px}.ezplayer-mobile.ezplayer-fullscreen .ezplayer-footer-left .ezplayer-control,.ezplayer-mobile.ezplayer-fullscreen .ezplayer-header-left .ezplayer-control{margin-right:30px}.ezplayer-mobile.ezplayer-fullscreen .ezplayer-footer-right,.ezplayer-mobile.ezplayer-fullscreen .ezplayer-header-right{padding-right:50px}.ezplayer-mobile.ezplayer-fullscreen .ezplayer-footer-right .ezplayer-control,.ezplayer-mobile.ezplayer-fullscreen .ezplayer-header-right .ezplayer-control{margin-left:30px}.ezplayer-fullscreen:not(.ezplayer-mobile) .ezplayer-footer-left .ezplayer-control,.ezplayer-fullscreen:not(.ezplayer-mobile) .ezplayer-header-left .ezplayer-control{margin-right:26px}.ezplayer-fullscreen:not(.ezplayer-mobile) .ezplayer-footer-right .ezplayer-control,.ezplayer-fullscreen:not(.ezplayer-mobile) .ezplayer-header-right .ezplayer-control{margin-left:26px}
|
|
4
|
-
.ezplayer-content,.ezplayer-content-wrapper{box-sizing:border-box;display:flex;flex:1 1 auto;height:100%;margin:0;outline:none;overflow:hidden;padding:0;position:relative;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:100%;z-index:0}.ezplayer-content-wrapper{background-color:#000}
|
|
4
|
+
.ezplayer-content{align-items:center;justify-content:center}.ezplayer-content,.ezplayer-content-wrapper{box-sizing:border-box;display:flex;flex:1 1 auto;height:100%;margin:0;outline:none;overflow:hidden;padding:0;position:relative;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:100%;z-index:0}.ezplayer-content-wrapper{background-color:#000}.ezplayer-content-video{align-items:center;box-sizing:border-box;display:flex;flex:1 1 auto;height:100%;justify-content:center;margin:0;outline:none;padding:0;width:100%}
|
|
5
5
|
.ezplayer-mobile-extend{background-color:#639;background-color:var(--ezplayer-mobile-extend-bg-color,#f5f7fa);color:var(--ezplayer-mobile-extend-default-color,#2c2c2c);display:flex;flex-direction:column}.ezplayer-mobile-extend-controls{background-color:#639;display:flex;height:66px;justify-content:space-around}.ezplayer-mobile-extend-controls .ezplayer-control{width:75px}.ezplayer-mobile-extend-control-panel{align-items:center;display:flex;flex-direction:column;min-height:390px}.ezplayer-mobile-extend-control-top{align-items:center;display:flex;height:36px;justify-content:space-between;padding-top:10px}.ezplayer-mobile-extend-control-top-left{display:inline-flex;padding-left:15px}.ezplayer-mobile-extend-control-top-right{display:inline-flex;justify-content:flex-end;padding-right:15px}.ezplayer-mobile-extend-control-content{display:flex;flex:1 1 auto;flex-direction:column;width:100%}
|
|
6
6
|
.ezplayer-rec-footer{background-color:#000;box-sizing:border-box;display:block;height:36px;position:relative}.ezplayer-rec-footer-has-date-picker{padding-right:56px}.ezplayer-rec-footer-time-line{height:36px;overflow:hidden;width:100%}.ezplayer-rec-footer-date-picker{align-items:center;display:flex;height:36px;justify-content:flex-end;padding-right:20px;position:absolute;right:0;top:0;width:56px}.ezplayer-rec-footer-date-picker .ezplayer-icon-date{font-size:20px;margin-top:-5px}
|
|
7
|
-
.epicker-body-noscroll{overflow:hidden;touch-action:none}.epicker{box-shadow:0 9px 28px 8px #0000000d;
|
|
8
|
-
.epicker-body-noscroll{overflow:hidden;touch-action:none}.epicker{box-shadow:0 9px 28px 8px #0000000d;
|
|
7
|
+
.epicker-body-noscroll{overflow:hidden;touch-action:none}.epicker{box-shadow:0 9px 28px 8px #0000000d;display:none;margin:0;opacity:0;padding:0;position:absolute;transition:opacity .3s ease;vertical-align:top;z-index:1000}.epicker,.epicker-body{box-sizing:border-box;flex-direction:column}.epicker-body{display:flex}.epicker.epicker-mobile .epicker-mask{background-color:#0000004d;bottom:0;box-sizing:border-box;height:100%;left:0;position:fixed;right:0;top:0;width:100%;z-index:9998}.epicker.epicker-mobile .epicker-body{align-items:center;bottom:0;left:0;position:fixed;right:0;z-index:9999}
|
|
8
|
+
.drag-scroll{box-sizing:border-box;margin:0;padding:0}.drag-scroll-container{cursor:grab;height:450px;overflow:hidden;position:relative;-webkit-tap-highlight-color:transparent}.drag-scroll-container,.drag-scroll-content{box-sizing:border-box;display:flex;flex-direction:column;margin:0;padding:0;width:100%}.drag-scroll-content{gap:18px;height:auto;transform:translateZ(0);will-change:transform}.drag-scroll-scrollbar{background-color:#0000001a;border-radius:3px;bottom:0;box-sizing:border-box;opacity:0;position:absolute;right:0;top:0;transition:opacity .3s;width:6px}.drag-scroll-scrollbar.drag-scroll-show{opacity:1}.drag-scroll-scrollbar-thumb{background:linear-gradient(180deg,#4a90e2,#357abd);border-radius:3px;box-sizing:border-box;position:absolute;transition:height .2s;width:100%}.epicker-body-noscroll{overflow:hidden;touch-action:none}.epicker{box-shadow:0 9px 28px 8px #0000000d;display:none;margin:0;opacity:0;padding:0;position:absolute;transition:opacity .3s ease;vertical-align:top;z-index:1000}.epicker,.epicker-body{box-sizing:border-box;flex-direction:column}.epicker-body{display:flex}.epicker.epicker-mobile .epicker-mask{background-color:#0000004d;bottom:0;box-sizing:border-box;height:100%;left:0;position:fixed;right:0;top:0;width:100%;z-index:9998}.epicker.epicker-mobile .epicker-body{align-items:center;bottom:0;left:0;position:fixed;right:0;z-index:9999}.ez-time-line-container{box-sizing:border-box;display:block;height:300px;min-width:190px;overflow:hidden;padding-right:29%;position:relative;white-space:nowrap;width:52%}.ez-time-line-time-scale-area{border-bottom:none;border-right:12px solid #bdcdff;border-top:none;box-sizing:border-box;color:#666;font-size:12px;height:60px;margin:0;padding:0;position:relative}.ez-time-line-time-label{height:14px;left:45%;line-height:14px;position:relative;top:53px;-webkit-user-select:none;-moz-user-select:none;user-select:none}.ez-time-line-time-unavail{background-color:#ddd;box-sizing:border-box;left:100%;position:absolute;width:12px}.ez-time-line-current{box-sizing:border-box;height:29px;min-width:80px;padding-left:2.66666%;position:absolute;top:40px;width:23%;z-index:1}.ez-time-line-current-content{height:58px;position:relative;width:100%}.ez-time-line-current-tip{align-items:center;display:inline-flex;font-size:58px;position:absolute;width:58px;z-index:1}.ez-time-line-current-tip-line{background-color:#648ffc;border-radius:1px;height:1.5px;position:absolute;top:50%;transform:translateY(-50%);width:102%}.ez-time-line-current-value{color:#fff;font-size:12px;height:58px;line-height:58px;pointer-events:none;position:absolute;text-align:center;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:52px;z-index:1}.ez-time-line-time-cover-fold{align-items:flex-end;color:#fff;display:inline-flex;height:60px;position:absolute;right:-90px;transform:translate(22px);width:90px}.ez-time-line-time-cover-fold-img{border-radius:6px;height:50px;overflow:hidden;position:relative;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:90px}.ez-time-line-time-cover-fold-img img{height:50px;-o-object-fit:cover;object-fit:cover;width:90px}.ez-time-line-time-cover-fold-img:before{background-color:rgba(0,0,0,.3);content:"";height:50px;left:0;position:absolute;top:0;width:90px;z-index:1}.ez-time-line-time-cover-fold-len{font-size:12px;font-size:11px;left:2px;position:absolute;top:2px;z-index:2}.ez-time-line-time-cover-fold-time{font-size:12px;font-size:11px;position:absolute;right:2px;top:2px;z-index:2}.ez-time-line-time-cover-fold-pause{bottom:2px;color:#fff;display:inline-flex;font-size:20px;position:absolute;right:0;z-index:2}.ez-time-line-cover-fold-placeholder{display:flex;height:60px;justify-content:center;position:absolute;width:90px}.ez-time-line-cover-fold-placeholder:after,.ez-time-line-cover-fold-placeholder:before{border-radius:6px;content:"";position:absolute}.ez-time-line-cover-fold-placeholder:before{background-color:#ededed;height:30px;top:0;width:70px}.ez-time-line-cover-fold-placeholder:after{background-color:#ccc;height:40px;top:5px;width:80px}.ez-time-line-item-cover-placeholder{align-items:center;background:linear-gradient(180deg,#b7c3cf,#d4d1d1 100%);color:#fff;display:flex;font-size:20px;height:100%;justify-content:center;left:0;position:absolute;top:0;width:100%;z-index:1}.ez-time-line-op{position:absolute;right:10%;top:50%;transform:translateY(-50%);-webkit-user-select:none;-moz-user-select:none;user-select:none}.ez-time-line-op-wrapper{display:inline-flex;flex-direction:column}.ez-time-line-icon-plus{margin-bottom:40px}.ez-time-line-icon-minus:not(.ez-time-line-disabled),.ez-time-line-icon-plus:not(.ez-time-line-disabled){align-items:center;border:1px solid #999;border-radius:8px;box-sizing:border-box;cursor:pointer;display:inline-flex;font-size:16px;height:30px;justify-content:center;padding:7px;transition:color .3s ease,border-color .3s ease;width:30px}.ez-time-line-icon-minus:not(.ez-time-line-disabled):active,.ez-time-line-icon-plus:not(.ez-time-line-disabled):active{border-color:#369fff;color:#369fff}.ez-time-line-disabled{border-color:#dedede!important;cursor:not-allowed!important}.ez-time-line-picker.epicker.epicker-mobile .epicker-body{align-items:normal;background-color:#fff;height:550px;max-height:70%}.ez-time-line-picker-container{box-sizing:border-box;display:flex;flex:1 1 auto;flex-direction:column;overflow:hidden}.ez-time-line-picker-header{color:#2c2c2c;display:flex;font-size:18px;font-weight:500;height:65px;letter-spacing:0;line-height:45px;padding:10px 70px;-webkit-user-select:none;-moz-user-select:none;user-select:none}.ez-time-line-picker-close,.ez-time-line-picker-header{align-items:center;box-sizing:border-box;justify-content:center}.ez-time-line-picker-close{color:#20262c;cursor:pointer;display:inline-flex;font-size:24px;height:24px;left:15px;position:absolute;top:20px;transition:color .3s ease;width:24px}.ez-time-line-picker-close:active{color:#f05757}.ez-time-line-picker-content{box-sizing:border-box;flex:1 1 auto;overflow-x:hidden;overflow-y:auto}.ez-time-line-picker-item{margin-bottom:20px;padding-left:10px;padding-right:10px}.ez-time-line-picker-item-title{color:#666;font-size:14px;font-weight:400;letter-spacing:0;line-height:20px;margin-bottom:10px;padding-left:1.5%}.ez-time-line-picker-item-list{display:flex;flex-wrap:wrap}.ez-time-line-picker-item-content{background-color:#ddd;border-radius:8px;display:flex;margin:0 1.5% 10px;overflow:hidden;padding-top:18.769%;position:relative;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:30.333%}.ez-time-line-picker-item-content:before{background-color:rgba(0,0,0,.3);content:"";height:100%;left:0;position:absolute;top:0;width:100%}.ez-time-line-picker-item-time{left:5px}.ez-time-line-picker-item-duration,.ez-time-line-picker-item-time{color:#fff;font-size:12px;font-size:11px;font-weight:400;letter-spacing:0;line-height:13px;position:absolute;top:5px;-webkit-user-select:none;-moz-user-select:none;user-select:none;z-index:2}.ez-time-line-picker-item-duration{right:5px}.ez-time-line-picker-item-cover{height:100%;left:0;-o-object-fit:cover;object-fit:cover;position:absolute;top:0;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:100%;z-index:0}.ez-time-line-picker .ez-time-line-item-cover-placeholder{font-size:30px;z-index:1}
|
|
9
9
|
.ezplayer .ezplayer-progress{align-items:center;background-color:var(--ezplayer-panel-bg-color,rgba(0,0,0,.7));border-radius:var(--ezplayer-border-radius,8px);box-sizing:border-box;cursor:default;display:flex;flex-direction:column;justify-content:center;padding:36px 9px 11px;position:relative;width:38px}.ezplayer .ezplayer-progress,.ezplayer .ezplayer-progress-text{-webkit-user-select:none;-moz-user-select:none;user-select:none}.ezplayer .ezplayer-progress-text{font-size:12px;height:17px;left:0;line-height:17px;position:absolute;text-align:center;top:10px;width:100%}.ezplayer .ezplayer-progress-minus,.ezplayer .ezplayer-progress-plus{display:flex;height:25px;justify-content:center}.ezplayer .ezplayer-progress-minus .ezplayer-icon,.ezplayer .ezplayer-progress-plus .ezplayer-icon{color:#fff;cursor:pointer;display:inline-block;font-size:20px;height:20px;text-align:center;transition:color .3s ease,border-color .3s ease;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:20px}.ezplayer .ezplayer-progress-minus .ezplayer-icon:active,.ezplayer .ezplayer-progress-plus .ezplayer-icon:active{color:var(--ezplayer-primary-color,#407aff)}@media (hover:hover){.ezplayer .ezplayer-progress-minus .ezplayer-icon:hover,.ezplayer .ezplayer-progress-plus .ezplayer-icon:hover{color:var(--ezplayer-primary-color,#407aff)}}.ezplayer .ezplayer-progress-plus{padding-bottom:5px}.ezplayer .ezplayer-progress-minus{padding-top:5px}.ezplayer .ezplayer-progress-slider{background-color:hsla(0,0%,100%,.75);border-radius:2px;cursor:pointer;flex:1 1 auto;position:relative;width:4px}.ezplayer .ezplayer-progress-slider-fill{background-color:var(--ezplayer-primary-color,#407aff);border-radius:4px;bottom:0;height:0;left:0;position:absolute;width:100%}.ezplayer .ezplayer-progress-slider-handle{align-items:center;background-color:var(--ezplayer-primary-color,#407aff);border-radius:50%;cursor:pointer;display:inline-flex;height:12px;justify-content:center;left:50%;position:absolute;top:0;transform:translate(-50%,-50%);width:12px}.ezplayer .ezplayer-progress-slider-handle:hover{box-shadow:0 0 2px var(--ezplayer-primary-color,#407aff)}.ezplayer .ezplayer-progress-slider-handle:before{background-color:#fff;border-radius:50%;content:"";display:inline;height:6px;width:6px}
|
|
10
10
|
.ezplayer-icon{align-items:center;color:inherit;display:inline-flex;font-size:var(--ezplayer-icon-font-size,24px);font-style:normal;line-height:0;text-align:center;text-rendering:optimizeLegibility;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
|
|
11
11
|
.ezplayer-select-panel{background-color:var(--ezplayer-panel-bg-color,rgba(0,0,0,.7));border-radius:var(--ezplayer-border-radius,8px);color:var(--ezplayer-default-color,#fff);display:flex;flex-direction:column;overflow-x:hidden;overflow-y:auto;position:relative}.ezplayer-select-btn{width:50px}.ezplayer-select-btn span{display:inline-block;font-size:12px;font-size:calc(var(--ezplayer-font-size, 14px) - 2px);line-height:20px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ezplayer-select-list{align-items:center;display:flex;flex-direction:column;font-size:var(--ezplayer-font-size,14px);list-style:none;margin:0;padding:12px 0!important;width:100%}.ezplayer-select-option{box-sizing:border-box;cursor:pointer;display:inline-flex;height:28px;justify-content:center;line-height:18px;list-style:none;padding:5px 20px!important;transition:color .3s ease;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:100%}.ezplayer-select-option span{display:inline-block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ezplayer-select-option:hover{color:var(--ezplayer-active-color)}.ezplayer-select-cancel,.ezplayer-select-close{display:none}.ezplayer-select-cancel{font-size:var(--ezplayer-font-size,14px)}.ezplayer-mobile .epicker-mobile.ezplayer-select-picker .ezplayer-select-panel{background-color:transparent;max-width:400px;padding-bottom:calc(54px + env(safe-area-inset-bottom));width:90%}.ezplayer-mobile .epicker-mobile.ezplayer-select-picker .ezplayer-select-list{align-items:center;background-color:#fff;border-radius:var(--ezplayer-border-radius,8px);display:flex;flex-direction:column;font-size:var(--ezplayer-font-size,14px);max-height:70vh;max-height:calc(90vh - 108px);overflow-x:hidden;overflow-y:auto;padding:20px 0!important}.ezplayer-mobile .epicker-mobile.ezplayer-select-picker .ezplayer-select-cancel,.ezplayer-mobile .epicker-mobile.ezplayer-select-picker .ezplayer-select-option{align-items:center;box-sizing:border-box;color:#2c2c2c;display:inline-flex;height:36px;justify-content:center;line-height:26px;padding:5px 20px!important}.ezplayer-mobile .epicker-mobile.ezplayer-select-picker .ezplayer-select-option{--webkit-tap-highlight-color:transparent!important}.ezplayer-mobile .epicker-mobile.ezplayer-select-picker .ezplayer-select-option:hover{color:#2c2c2c}.ezplayer-mobile .epicker-mobile.ezplayer-select-picker .ezplayer-select-option:active{background-color:#f8f8f8}.ezplayer-mobile .epicker-mobile.ezplayer-select-picker .ezplayer-select-cancel{background-color:#fff;border-radius:var(--ezplayer-border-radius,8px);display:flex;height:54px;margin-top:8px}.ezplayer-mobile .epicker-mobile.ezplayer-select-picker .ezplayer-select-cancel:active{color:var(--ezplayer-active-color)}.ezplayer-mobile.ezplayer-fullscreen .epicker-mobile.ezplayer-select-picker .epicker-body{bottom:0;left:unset;right:0;top:0;width:240px}.ezplayer-mobile.ezplayer-fullscreen .epicker-mobile.ezplayer-select-picker .ezplayer-select-panel{align-items:center;background-color:var(--ezplayer-panel-bg-color,rgba(0,0,0,.7));border-bottom-right-radius:0;border-top-right-radius:0;height:100%;justify-content:center;padding-bottom:env(safe-area-inset-bottom);width:100%}.ezplayer-mobile.ezplayer-fullscreen .epicker-mobile.ezplayer-select-picker .ezplayer-select-list{background-color:transparent;border-radius:0;color:#fff;height:auto;margin:0;max-height:100%;width:100%}.ezplayer-mobile.ezplayer-fullscreen .epicker-mobile.ezplayer-select-picker .ezplayer-select-option,.ezplayer-mobile.ezplayer-fullscreen .epicker-mobile.ezplayer-select-picker .ezplayer-select-option:hover{color:#fff}.ezplayer-mobile.ezplayer-fullscreen .epicker-mobile.ezplayer-select-picker .ezplayer-select-option:active{background-color:transparent;color:var(--ezplayer-active-color)}.ezplayer-mobile.ezplayer-fullscreen .epicker-mobile.ezplayer-select-picker .ezplayer-select-cancel{display:none}.ezplayer-mobile.ezplayer-fullscreen .epicker-mobile.ezplayer-select-picker .ezplayer-select-close{display:inline-flex;left:10px;position:absolute;top:10px}.ezplayer-mobile.ezplayer-fullscreen .epicker-mobile.ezplayer-select-picker .ezplayer-select-close:active{color:var(--ezplayer-active-color)}
|
package/dist/style.js
CHANGED
package/dist/types/index.d.ts
CHANGED
|
@@ -4,8 +4,18 @@ import I18n, { I18nTranslation } from '@ezuikit/utils-i18n';
|
|
|
4
4
|
import { LoggerCls, LoggerOptions } from '@ezuikit/utils-logger';
|
|
5
5
|
import { BasePtzOptions } from '@ezuikit/control-ptz';
|
|
6
6
|
import Zoom from '@ezuikit/control-zoom';
|
|
7
|
+
import { ThemeOptions as ThemeOptions$1 } from '@/interface';
|
|
7
8
|
import { TimeLineTimeSection } from '@ezuikit/control-time-line';
|
|
8
9
|
|
|
10
|
+
/** 填充模式 */
|
|
11
|
+
declare const THEME_SCALE_MODE_TYPE: {
|
|
12
|
+
/** 画面完全填充canvas区域,画面会被拉伸 */
|
|
13
|
+
readonly full: 0;
|
|
14
|
+
/** 画面做等比缩放后,高或宽对齐canvas区域,画面不被拉伸,但有黑边 */
|
|
15
|
+
readonly auto: 1;
|
|
16
|
+
/** 视频画面做等比缩放后,完全填充canvas区域,画面不被拉伸,没有黑边,但画面显示不全 */
|
|
17
|
+
readonly fullAuto: 2;
|
|
18
|
+
};
|
|
9
19
|
declare const THEME_PROPS: readonly ["width", "height", "playing", "volume", "muted", "loading", "recType", "isCurrentFullscreen", "orientationAngle", "zooming", "zoom", "recording", "recordList", "speed", "urlInfo", "videoLevelList", "videoLevel"];
|
|
10
20
|
|
|
11
21
|
/**
|
|
@@ -987,10 +997,12 @@ declare class Pause extends Control {
|
|
|
987
997
|
}
|
|
988
998
|
|
|
989
999
|
/**
|
|
990
|
-
*
|
|
1000
|
+
* 内容区域配置项
|
|
991
1001
|
*/
|
|
992
1002
|
interface ContentOptions {
|
|
1003
|
+
/** 获取容器 */
|
|
993
1004
|
getContainer: () => HTMLElement;
|
|
1005
|
+
scaleMode: ThemeOptions$1['scaleMode'];
|
|
994
1006
|
}
|
|
995
1007
|
/**
|
|
996
1008
|
* 截图控件
|
|
@@ -1003,8 +1015,22 @@ declare class Content extends EventEmitter {
|
|
|
1003
1015
|
$wrapper: HTMLDivElement;
|
|
1004
1016
|
/** 渲染区域 */
|
|
1005
1017
|
$content: HTMLDivElement;
|
|
1018
|
+
/** 渲染区域 */
|
|
1019
|
+
$video: HTMLDivElement;
|
|
1020
|
+
/** 配置项 */
|
|
1006
1021
|
options: ContentOptions;
|
|
1022
|
+
private _scaleMode?;
|
|
1023
|
+
private _originWidth;
|
|
1024
|
+
private _originHeight;
|
|
1007
1025
|
constructor(options: ContentOptions);
|
|
1026
|
+
/**
|
|
1027
|
+
* 重新画面区域
|
|
1028
|
+
* @param {number} originWidth 画面宽度
|
|
1029
|
+
* @param {number} originHeight 画面高度
|
|
1030
|
+
* @returns {void}
|
|
1031
|
+
*/
|
|
1032
|
+
private _rerender;
|
|
1033
|
+
setScaleMode(scaleMode?: ThemeOptions$1['scaleMode']): void;
|
|
1008
1034
|
destroy(): void;
|
|
1009
1035
|
}
|
|
1010
1036
|
|
|
@@ -1168,7 +1194,7 @@ declare class Theme extends EventEmitter {
|
|
|
1168
1194
|
readonly zoomChange: "zoomChange";
|
|
1169
1195
|
readonly zoomingChange: "zoomingChange";
|
|
1170
1196
|
readonly zoomTranslateChange: "zoomTranslateChange";
|
|
1171
|
-
readonly audioInfo: "audioInfo";
|
|
1197
|
+
readonly audioInfo: "audioInfo"; /** 事件名称 @since 0.0.1 */
|
|
1172
1198
|
readonly videoInfo: "videoInfo";
|
|
1173
1199
|
readonly firstFrameDisplay: "firstFrameDisplay";
|
|
1174
1200
|
readonly fullscreen: "fullscreen";
|
|
@@ -1205,7 +1231,7 @@ declare class Theme extends EventEmitter {
|
|
|
1205
1231
|
readonly headerMoreShowControlsChange: "Control.headerMoreShowControlsChange";
|
|
1206
1232
|
readonly headerMorePanelOpenChange: "Control.headerMorePanelOpenChange";
|
|
1207
1233
|
readonly footerMoreShowControlsChange: "Control.footerMoreShowControlsChange";
|
|
1208
|
-
readonly footerMorePanelOpenChange: "Control.footerMorePanelOpenChange";
|
|
1234
|
+
readonly footerMorePanelOpenChange: "Control.footerMorePanelOpenChange"; /** 电子放大倍数 @private */
|
|
1209
1235
|
readonly deviceDestroy: "Control.deviceDestroy";
|
|
1210
1236
|
readonly recTypeChange: "Control.recTypeChange";
|
|
1211
1237
|
readonly recDestroy: "Control.recDestroy";
|
|
@@ -1216,7 +1242,7 @@ declare class Theme extends EventEmitter {
|
|
|
1216
1242
|
readonly speedChange: "Control.speedChange";
|
|
1217
1243
|
readonly speedPanelOpenChange: "Control.speedPanelOpenChange";
|
|
1218
1244
|
readonly speedDestroy: "Control.speedDestroy";
|
|
1219
|
-
readonly ptzPanelOpenChange: "Control.ptzPanelOpenChange";
|
|
1245
|
+
readonly ptzPanelOpenChange: "Control.ptzPanelOpenChange";
|
|
1220
1246
|
readonly ptzSpeedChange: "Control.ptzSpeedChange";
|
|
1221
1247
|
readonly ptzError: "Control.ptzError";
|
|
1222
1248
|
readonly ptzDestroy: "Control.ptzDestroy";
|
|
@@ -1234,6 +1260,7 @@ declare class Theme extends EventEmitter {
|
|
|
1234
1260
|
readonly dateChange: "Control.dateChange";
|
|
1235
1261
|
readonly dateDestroy: "Control.datePanelDestroy";
|
|
1236
1262
|
readonly timeLineChange: "Control.timeLineChange";
|
|
1263
|
+
readonly timeLinePanelOpenChange: "Control.timeLinePanelOpenChange";
|
|
1237
1264
|
readonly timeLineDestroy: "Control.timeLineDestroy";
|
|
1238
1265
|
readonly beforeMountControls: "Control.beforeMountControls";
|
|
1239
1266
|
readonly mountedControls: "Control.mountedControls";
|
|
@@ -1343,7 +1370,6 @@ declare class Theme extends EventEmitter {
|
|
|
1343
1370
|
396517: string;
|
|
1344
1371
|
396518: string;
|
|
1345
1372
|
396519: string;
|
|
1346
|
-
/** 移动端竖屏, 全屏情况下不展示扩张，放置在 footer 中 */
|
|
1347
1373
|
396520: string;
|
|
1348
1374
|
396700: string;
|
|
1349
1375
|
396701: string;
|
|
@@ -1382,17 +1408,16 @@ declare class Theme extends EventEmitter {
|
|
|
1382
1408
|
3860020: string;
|
|
1383
1409
|
BTN_RETRY: string;
|
|
1384
1410
|
BTN_RELOAD: string;
|
|
1385
|
-
/** 所有私有流的模板 @since 0.0.1 */
|
|
1386
1411
|
LOADING: string;
|
|
1387
1412
|
TIMEFORMAT_ERROR: string;
|
|
1388
1413
|
USE_MULTITHREADING_WARING: string;
|
|
1389
1414
|
OPEN_INSTRUCTIONS: string;
|
|
1390
1415
|
INIT_FINSHED: string;
|
|
1391
1416
|
INIT_SUCCESS: string;
|
|
1392
|
-
GET_PLAYURL_FAILED: string;
|
|
1417
|
+
GET_PLAYURL_FAILED: string;
|
|
1393
1418
|
VIDEO_LOADING: string;
|
|
1394
1419
|
DISCONNECT: string;
|
|
1395
|
-
DEVICE_ENCRYPTED: string;
|
|
1420
|
+
DEVICE_ENCRYPTED: string;
|
|
1396
1421
|
NO_RECORD: string;
|
|
1397
1422
|
PLAY_FAILED: string;
|
|
1398
1423
|
PLAY_SUCCESS: string;
|
|
@@ -1424,11 +1449,7 @@ declare class Theme extends EventEmitter {
|
|
|
1424
1449
|
PLEASE_INPUT_RIGHT_VIDEO_LEVEL: string;
|
|
1425
1450
|
VIDEO_LEVEL_NOT_SUPPORT: string;
|
|
1426
1451
|
VIDEO_LEVEL_AUTO: string;
|
|
1427
|
-
VIDEO_LEVEL_FLUENT: string;
|
|
1428
|
-
* 更多控件（footer more）
|
|
1429
|
-
* @since 0.0.1
|
|
1430
|
-
* @private
|
|
1431
|
-
*/
|
|
1452
|
+
VIDEO_LEVEL_FLUENT: string;
|
|
1432
1453
|
VIDEO_LEVEL_STANDARD: string;
|
|
1433
1454
|
VIDEO_LEVEL_HEIGH: string;
|
|
1434
1455
|
VIDEO_LEVEL_SUPER: string;
|
|
@@ -1439,18 +1460,20 @@ declare class Theme extends EventEmitter {
|
|
|
1439
1460
|
BTN_PLAY: string;
|
|
1440
1461
|
BTN_PAUSE: string;
|
|
1441
1462
|
BTN_VOLUME: string;
|
|
1442
|
-
/** 回放底部时间轴 @since 0.0.1 @private */
|
|
1443
1463
|
BTN_MUTED: string;
|
|
1444
1464
|
BTN_RECORDVIDEO: string;
|
|
1445
1465
|
BTN_CAPTURE: string;
|
|
1446
1466
|
BTN_TALK: string;
|
|
1447
1467
|
BTN_ZOOM: string;
|
|
1448
1468
|
BTN_3D_ZOOM: string;
|
|
1449
|
-
BTN_PTZ: string;
|
|
1469
|
+
BTN_PTZ: string; /**
|
|
1470
|
+
* 移动端扩展容器, 扩展的控件渲染在指定容器以外， 仅只用端适用， 为了可以放置大的控件和方便开发接入
|
|
1471
|
+
* @private
|
|
1472
|
+
*/
|
|
1450
1473
|
BTN_GLOBAL_FULLSCREEN: string;
|
|
1451
1474
|
BTN_EXIT_GLOBAL_FULLSCREEN: string;
|
|
1452
1475
|
BTN_FULLSCREEN: string;
|
|
1453
|
-
BTN_EXIR_FULLSCREEN: string;
|
|
1476
|
+
BTN_EXIR_FULLSCREEN: string; /** @since 0.0.1 @private */
|
|
1454
1477
|
BTN_HD: string;
|
|
1455
1478
|
BTN_SPEED: string;
|
|
1456
1479
|
BTN_CLOUDREC: string;
|
|
@@ -1459,7 +1482,6 @@ declare class Theme extends EventEmitter {
|
|
|
1459
1482
|
BTN_CALENDAR: string;
|
|
1460
1483
|
BTN_MORE: string;
|
|
1461
1484
|
DEVICE_NAME: string;
|
|
1462
|
-
/** 清除屏幕旋转 */
|
|
1463
1485
|
DEVICE_ID: string;
|
|
1464
1486
|
CAPTURE_SUCCESS: string;
|
|
1465
1487
|
CAPTURE_FAILED: string;
|
|
@@ -1468,7 +1490,7 @@ declare class Theme extends EventEmitter {
|
|
|
1468
1490
|
STOP_RECORD_SUCCESS: string;
|
|
1469
1491
|
STOP_RECORD_FAILED: string;
|
|
1470
1492
|
RECORD_TIPS: string;
|
|
1471
|
-
RECORDS: string;
|
|
1493
|
+
RECORDS: string;
|
|
1472
1494
|
OPEN_SOUND: string;
|
|
1473
1495
|
CLOSE_SOUND: string;
|
|
1474
1496
|
SOUND_OPENED: string;
|
|
@@ -1476,22 +1498,22 @@ declare class Theme extends EventEmitter {
|
|
|
1476
1498
|
START_ZOOM: string;
|
|
1477
1499
|
CLOSE_ZOOM: string;
|
|
1478
1500
|
ZOOM_ADD: string;
|
|
1479
|
-
ZOOM_SUB: string;
|
|
1501
|
+
ZOOM_SUB: string;
|
|
1480
1502
|
ZOOM_ADD_MAX: string;
|
|
1481
|
-
ZOOM_SUB_MIN: string;
|
|
1503
|
+
ZOOM_SUB_MIN: string;
|
|
1482
1504
|
ZOOM_LIMIT_MAX: string;
|
|
1483
1505
|
ZOOM_LIMIT_MIN: string;
|
|
1484
1506
|
ZOOM_NOT_ENABLED: string;
|
|
1485
1507
|
'3D_ZOOM': string;
|
|
1486
|
-
'3D_ZOOM_DISABLE': string;
|
|
1508
|
+
'3D_ZOOM_DISABLE': string; /** 音量 */
|
|
1487
1509
|
'3D_ZOOM_FAILED': string;
|
|
1488
1510
|
START_3D_ZOOM: string;
|
|
1489
1511
|
CLOSE_3D_ZOOM: string;
|
|
1490
1512
|
DEVICE_NOT_SUPPORT_3D_ZOOM: string;
|
|
1491
1513
|
'3D_ZOOM_ACTIVED': string;
|
|
1492
|
-
'3D_ZOOM_NOT_ACTIVED': string;
|
|
1493
|
-
'3D_ZOOM_CLOSED': string;
|
|
1494
|
-
CHANGE_ZOOM_TYPE: string;
|
|
1514
|
+
'3D_ZOOM_NOT_ACTIVED': string;
|
|
1515
|
+
'3D_ZOOM_CLOSED': string;
|
|
1516
|
+
CHANGE_ZOOM_TYPE: string; /** 倍速 @private */
|
|
1495
1517
|
FULLSCREEN: string;
|
|
1496
1518
|
FULLSCREEN_EXIT: string;
|
|
1497
1519
|
GET_WEB_FULLSCREEN_STATUS: string;
|
|
@@ -1562,40 +1584,6 @@ declare class Theme extends EventEmitter {
|
|
|
1562
1584
|
395503: string;
|
|
1563
1585
|
395504: string;
|
|
1564
1586
|
395505: string;
|
|
1565
|
-
/**
|
|
1566
|
-
* 播放器主题
|
|
1567
|
-
* @class Theme
|
|
1568
|
-
* @category Theme
|
|
1569
|
-
* @remarks
|
|
1570
|
-
* 萤石播放器主题，主要用于播放器的 UI 展示和交互，支持 flv, hls, mp4, ezopen 等流类型。
|
|
1571
|
-
* 提供了丰富的控件和配置选项，支持多语言和自定义样式。
|
|
1572
|
-
*
|
|
1573
|
-
* @example
|
|
1574
|
-
* ```ts
|
|
1575
|
-
* // import css file
|
|
1576
|
-
* import "@ezuikit/player-theme/dist/style.js"
|
|
1577
|
-
* import Theme from '@ezuikit/player-theme';
|
|
1578
|
-
*
|
|
1579
|
-
* // class Player extends Theme {}
|
|
1580
|
-
*
|
|
1581
|
-
* const theme = new Theme({
|
|
1582
|
-
* container: () => document.querySelector('.player'),
|
|
1583
|
-
* type: 'flv',
|
|
1584
|
-
* });
|
|
1585
|
-
* ```
|
|
1586
|
-
*
|
|
1587
|
-
* ```html
|
|
1588
|
-
* <!-- html script, static in `@ezuikit/player-theme/dist` -->
|
|
1589
|
-
* <link rel="stylesheet" href="./assets/@ezuikit/player-theme/dist/style.css" />
|
|
1590
|
-
* <script src="./assets/@ezuikit/player-theme/dist/index.umd.js"></script>
|
|
1591
|
-
* <script>
|
|
1592
|
-
* const theme = new Theme({
|
|
1593
|
-
* container: () => document.querySelector('.player'),
|
|
1594
|
-
* type: 'flv',
|
|
1595
|
-
* });
|
|
1596
|
-
* </script>
|
|
1597
|
-
* ```
|
|
1598
|
-
*/
|
|
1599
1587
|
395506: string;
|
|
1600
1588
|
395507: string;
|
|
1601
1589
|
395530: string;
|
|
@@ -1607,13 +1595,14 @@ declare class Theme extends EventEmitter {
|
|
|
1607
1595
|
395557: string;
|
|
1608
1596
|
395558: string;
|
|
1609
1597
|
395560: string;
|
|
1598
|
+
/** 语言包 @since 0.0.1 */
|
|
1610
1599
|
395561: string;
|
|
1611
1600
|
395562: string;
|
|
1612
1601
|
395563: string;
|
|
1613
1602
|
395564: string;
|
|
1614
1603
|
395566: string;
|
|
1615
1604
|
395567: string;
|
|
1616
|
-
395568: string;
|
|
1605
|
+
395568: string;
|
|
1617
1606
|
395569: string;
|
|
1618
1607
|
395600: string;
|
|
1619
1608
|
395601: string;
|
|
@@ -1634,16 +1623,14 @@ declare class Theme extends EventEmitter {
|
|
|
1634
1623
|
396107: string;
|
|
1635
1624
|
396108: string;
|
|
1636
1625
|
396109: string;
|
|
1637
|
-
396110: string;
|
|
1626
|
+
396110: string; /** 容器的高 */
|
|
1638
1627
|
396501: string;
|
|
1639
1628
|
396502: string;
|
|
1640
1629
|
396503: string;
|
|
1641
1630
|
396504: string;
|
|
1642
|
-
/** 电子放大倍数 @private */
|
|
1643
1631
|
396505: string;
|
|
1644
1632
|
396506: string;
|
|
1645
1633
|
396508: string;
|
|
1646
|
-
/** 自定清晰度 @private */
|
|
1647
1634
|
396509: string;
|
|
1648
1635
|
396510: string;
|
|
1649
1636
|
396511: string;
|
|
@@ -1706,7 +1693,13 @@ declare class Theme extends EventEmitter {
|
|
|
1706
1693
|
NO_RECORD: string;
|
|
1707
1694
|
PLAY_FAILED: string;
|
|
1708
1695
|
PLAY_SUCCESS: string;
|
|
1709
|
-
STOP_SUCCESS: string;
|
|
1696
|
+
STOP_SUCCESS: string; /**
|
|
1697
|
+
* 加载状态
|
|
1698
|
+
* ```ts
|
|
1699
|
+
* // 事件监听
|
|
1700
|
+
* theme.on(Theme.EVENTS.loading, (loading: boolean) => {})
|
|
1701
|
+
* ```
|
|
1702
|
+
*/
|
|
1710
1703
|
CHANGE_PLAYURL_SUCCESS: string;
|
|
1711
1704
|
CHANGE_PLAYURL_FAILED: string;
|
|
1712
1705
|
GET_OSD_TIME: string;
|
|
@@ -1728,10 +1721,7 @@ declare class Theme extends EventEmitter {
|
|
|
1728
1721
|
CALL_END: string;
|
|
1729
1722
|
USER_DO_NOT_OWN_DEVICE: string;
|
|
1730
1723
|
NO_CLOUD_RECORD: string;
|
|
1731
|
-
CHANGE_VIDEO_LEVEL: string;
|
|
1732
|
-
* 静音
|
|
1733
|
-
*
|
|
1734
|
-
*/
|
|
1724
|
+
CHANGE_VIDEO_LEVEL: string;
|
|
1735
1725
|
CHANGE_VIDEO_LEVEL_FAIL: string;
|
|
1736
1726
|
GET_VIDEO_LEVEL_LIST: string;
|
|
1737
1727
|
PLEASE_INPUT_RIGHT_VIDEO_LEVEL: string;
|
|
@@ -1770,6 +1760,16 @@ declare class Theme extends EventEmitter {
|
|
|
1770
1760
|
BTN_MORE: string;
|
|
1771
1761
|
DEVICE_NAME: string;
|
|
1772
1762
|
DEVICE_ID: string;
|
|
1763
|
+
/**
|
|
1764
|
+
* 电子放大倍数， 仅 ezopen 支持
|
|
1765
|
+
* @since 0.0.1
|
|
1766
|
+
* @example
|
|
1767
|
+
* ```ts
|
|
1768
|
+
* theme.zoom // 放大倍数
|
|
1769
|
+
* // 事件监听
|
|
1770
|
+
* theme.on(Theme.EVENTS.zoom, (zoom: number) => {})
|
|
1771
|
+
* ```
|
|
1772
|
+
*/
|
|
1773
1773
|
CAPTURE_SUCCESS: string;
|
|
1774
1774
|
CAPTURE_FAILED: string;
|
|
1775
1775
|
START_RECORD_SUCCESS: string;
|
|
@@ -1819,9 +1819,6 @@ declare class Theme extends EventEmitter {
|
|
|
1819
1819
|
PTZ_SPEED: string;
|
|
1820
1820
|
DEVICE_ZOOM: string;
|
|
1821
1821
|
DEVICE_FOCUS: string;
|
|
1822
|
-
/**
|
|
1823
|
-
* 清晰度自动
|
|
1824
|
-
*/
|
|
1825
1822
|
NOT_SUPPORT_DEVICE_ZOOM: string;
|
|
1826
1823
|
NOT_SUPPORT_FOCUS: string;
|
|
1827
1824
|
MIRROR: string;
|
|
@@ -1951,6 +1948,7 @@ declare class Theme extends EventEmitter {
|
|
|
1951
1948
|
destroyed: boolean;
|
|
1952
1949
|
/** 播放地址信息 */
|
|
1953
1950
|
urlInfo: any | null;
|
|
1951
|
+
scaleMode: ThemeOptions['scaleMode'];
|
|
1954
1952
|
constructor(options: ThemeOptions);
|
|
1955
1953
|
/**
|
|
1956
1954
|
* 容器的宽(单位 px)
|
|
@@ -2207,6 +2205,12 @@ declare class Theme extends EventEmitter {
|
|
|
2207
2205
|
* @param {LoggerOptions} options - 日志配置
|
|
2208
2206
|
*/
|
|
2209
2207
|
setLoggerOptions(options?: LoggerOptions): void;
|
|
2208
|
+
/**
|
|
2209
|
+
* 设置视频画面缩放模式
|
|
2210
|
+
* @since 1.0.1
|
|
2211
|
+
* @param {0 | 1 | 2} scaleMode - 缩放模式， 0: 窗口铺满， 1: 等比缩放大边铺满， 2: 等比缩放小边铺满
|
|
2212
|
+
*/
|
|
2213
|
+
setScaleMode(scaleMode: ThemeOptions['scaleMode']): void;
|
|
2210
2214
|
/**
|
|
2211
2215
|
* 销毁包括事件、控件 ...
|
|
2212
2216
|
*
|
|
@@ -2361,6 +2365,8 @@ interface ThemeOptions {
|
|
|
2361
2365
|
* @since 0.0.1
|
|
2362
2366
|
*/
|
|
2363
2367
|
locales?: Record<string, I18nTranslation>;
|
|
2368
|
+
/** 画面填充模式, 默认 0 */
|
|
2369
|
+
scaleMode: (typeof THEME_SCALE_MODE_TYPE)[keyof typeof THEME_SCALE_MODE_TYPE];
|
|
2364
2370
|
/** 日志配置 @since 0.0.1 */
|
|
2365
2371
|
loggerOptions?: LoggerOptions;
|
|
2366
2372
|
/** 双击全屏, 默认true, 仅 PC 支持 @since 0.0.1 */
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ezuikit/player-theme",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.1-alpha.0",
|
|
4
4
|
"description": "player theme",
|
|
5
5
|
"title": "theme",
|
|
6
6
|
"main": "dist/index.js",
|
|
@@ -24,13 +24,13 @@
|
|
|
24
24
|
"author": "Ezviz-OpenBiz",
|
|
25
25
|
"license": "MIT",
|
|
26
26
|
"dependencies": {
|
|
27
|
-
"@ezuikit/utils-i18n": "
|
|
28
|
-
"@ezuikit/utils-logger": "
|
|
29
|
-
"@ezuikit/utils-tools": "
|
|
30
|
-
"@ezuikit/control-time-line": "1.0.
|
|
27
|
+
"@ezuikit/utils-i18n": "2.0.0-beta.4",
|
|
28
|
+
"@ezuikit/utils-logger": "2.0.0-beta.1",
|
|
29
|
+
"@ezuikit/utils-tools": "2.0.0-beta.3",
|
|
30
|
+
"@ezuikit/control-time-line": "1.0.1-beta.14",
|
|
31
31
|
"@juggle/resize-observer": "^3.4.0",
|
|
32
|
-
"@skax/delegate": "
|
|
33
|
-
"@skax/picker": "1.
|
|
32
|
+
"@skax/delegate": "4.0.0",
|
|
33
|
+
"@skax/picker": "1.1.2",
|
|
34
34
|
"deepmerge": "^4.3.1",
|
|
35
35
|
"eventemitter3": "^5.0.1",
|
|
36
36
|
"screenfull": "5.2.0"
|