提交 8d0a9234 编写于 作者: fxy060608's avatar fxy060608

feat: createVideoContext

上级 9c3954ea
......@@ -34,7 +34,7 @@ declare var __UNI_FEATURE_NAVIGATIONBAR_TRANSPARENT__: boolean
// TODO
declare var __uniRoutes: UniApp.UniRoutes
declare var __uniConfig: UniApp.UniConfig
declare var UniViewJSBridge: any
declare var UniViewJSBridge: UniApp.UniViewJSBridge
declare var UniServiceJSBridge: UniApp.UniServiceJSBridge
declare const getCurrentPages: <T extends AnyObject = {}>(
......
......@@ -244,4 +244,62 @@ declare namespace UniApp {
*/
subscribeHandler(event: string, args: unknown, pageId: number): void
}
interface UniViewJSBridge {
/**
* 监听 View 的自定义事件。事件由 emit 触发,回调函数会接收所有传入事件触发函数的额外参数。
* @param event
* @param callback
*/
on(event: string | string[], callback: Function): void
/**
* 监听 View 的自定义事件。仅触发一次,在第一次触发之后移除监听器。
* @param event
* @param callback
*/
once(event: string, callback: Function): void
/**
* 移除 View 的自定义事件监听器。
* 如果没有提供参数,则移除所有的事件监听器;
* 如果只提供了事件,则移除该事件所有的监听器;
* 如果同时提供了事件与回调,则只移除这个回调的监听器。
* @param event
* @param callback
*/
off(event?: string | string[], callback?: Function): void
/**
* 触发 View 的事件。附加参数都会传给监听器回调。
* @param event
* @param args
*/
emit(event: string, ...args: any[]): void
/**
* 订阅 Service 的自定义事件,回调函数会接收所有传入事件触发函数的额外参数。
* @param event
* @param callback
*/
subscribe(event: string, callback: Function): void
/**
* 取消订阅 Service 的自定义事件
* 如果没有提供参数,则移除所有的事件监听器;
* 如果只提供了事件,则移除该事件所有的监听器;
* 如果同时提供了事件与回调,则只移除这个回调的监听器。
* @param event
* @param callback
*/
unsubscribe(event: string, callback?: Function): void
/**
* 接收 Service 层事件(通常由 Service 层调用,并暴露至全局 UniViewJSBridge 对象中)
* @param event
* @param args
* @param pageId
*/
subscribeHandler(event: string, args: unknown, pageId: number): void
/**
* 向 Service 层发送事件
* @param event
* @param args
* @param pageId
*/
publishHandler(event: string, args: unknown, pageId?: number): void
}
}
......@@ -2,6 +2,8 @@ export * from './service/base/base64'
export * from './service/base/upx2px'
export * from './service/base/interceptor'
export * from './service/context/createVideoContext'
export * from './service/ui/createIntersectionObserver'
export * from './service/ui/createSelectorQuery'
......
import { defineComponent } from 'vue'
// TODO
// import { hover, emitter, listeners } from '../../mixins'
export default defineComponent({
name: 'Button',
// mixins: [hover, emitter, listeners],
props: {
hoverClass: {
type: String,
default: 'button-hover',
},
disabled: {
type: [Boolean, String],
default: false,
},
id: {
type: String,
default: '',
},
hoverStopPropagation: {
type: Boolean,
default: false,
},
hoverStartTime: {
type: [Number, String],
default: 20,
},
hoverStayTime: {
type: [Number, String],
default: 70,
},
formType: {
type: String,
default: '',
validator(value: string) {
// 只有这几个可取值,其它都是非法的。
return !!~['', 'submit', 'reset'].indexOf(value)
},
},
openType: {
type: String,
default: '',
},
},
data() {
return {
clickFunction: null,
}
},
setup(props, { slots }) {
// TODO
return () => <uni-button>{slots.default && slots.default()}</uni-button>
},
methods: {
// _onClick($event: unknown, isLabelClick: boolean) {
// if (this.disabled) {
// return
// }
// if (isLabelClick) {
// this.$el.click()
// }
// // TODO 通知父表单执行相应的行为
// if (this.formType) {
// this.$dispatch(
// 'Form',
// this.formType === 'submit' ? 'uni-form-submit' : 'uni-form-reset',
// {
// type: this.formType,
// }
// )
// return
// }
// if (this.openType === 'feedback') {
// const feedback = plus.webview.create(
// 'https://service.dcloud.net.cn/uniapp/feedback.html',
// 'feedback',
// {
// titleNView: {
// titleText: '问题反馈',
// autoBackButton: true,
// backgroundColor: '#F7F7F7',
// titleColor: '#007aff',
// buttons: [
// {
// text: '发送',
// color: '#007aff',
// fontSize: '16px',
// fontWeight: 'bold',
// onclick: function (e) {
// feedback.evalJS(
// 'mui&&mui.trigger(document.getElementById("submit"),"tap")'
// )
// },
// },
// ],
// },
// }
// )
// feedback.show('slide-in-right')
// }
// },
// _bindObjectListeners(data, value) {
// if (value) {
// for (const key in value) {
// const existing = data.on[key]
// const ours = value[key]
// data.on[key] = existing ? [].concat(existing, ours) : ours
// }
// }
// return data
// },
},
// render(createElement) {
// const $listeners = Object.create(null)
// if (this.$listeners) {
// Object.keys(this.$listeners).forEach((e) => {
// if (this.disabled && (e === 'click' || e === 'tap')) {
// return
// }
// $listeners[e] = this.$listeners[e]
// })
// }
// if (this.hoverClass && this.hoverClass !== 'none') {
// return createElement(
// 'uni-button',
// this._bindObjectListeners(
// {
// class: [this.hovering ? this.hoverClass : ''],
// attrs: {
// disabled: this.disabled,
// },
// on: {
// touchstart: this._hoverTouchStart,
// touchend: this._hoverTouchEnd,
// touchcancel: this._hoverTouchCancel,
// click: this._onClick,
// },
// },
// $listeners
// ),
// this.$slots.default
// )
// } else {
// return createElement(
// 'uni-button',
// this._bindObjectListeners(
// {
// class: [this.hovering ? this.hoverClass : ''],
// attrs: {
// disabled: this.disabled,
// },
// on: {
// click: this._onClick,
// },
// },
// $listeners
// ),
// this.$slots.default
// )
// }
// },
listeners: {
'label-click': '_onClick',
'@label-click': '_onClick',
},
})
<script>
import { hover, emitter, listeners } from '../../mixins'
export default {
name: 'Button',
mixins: [hover, emitter, listeners],
props: {
hoverClass: {
type: String,
default: 'button-hover'
},
disabled: {
type: [Boolean, String],
default: false
},
id: {
type: String,
default: ''
},
hoverStopPropagation: {
type: Boolean,
default: false
},
hoverStartTime: {
type: [Number, String],
default: 20
},
hoverStayTime: {
type: [Number, String],
default: 70
},
formType: {
type: String,
default: '',
validator (value) {
// 只有这几个可取值,其它都是非法的。
return ~['', 'submit', 'reset'].indexOf(value)
}
},
openType: {
type: String,
default: ''
}
},
data () {
return {
clickFunction: null
}
},
methods: {
_onClick ($event, isLabelClick) {
if (this.disabled) {
return
}
if (isLabelClick) {
this.$el.click()
}
// TODO 通知父表单执行相应的行为
if (this.formType) {
this.$dispatch(
'Form',
this.formType === 'submit' ? 'uni-form-submit' : 'uni-form-reset',
{
type: this.formType
}
)
return
}
if (this.openType === 'feedback') {
const feedback = plus.webview.create(
'https://service.dcloud.net.cn/uniapp/feedback.html',
'feedback',
{
titleNView: {
titleText: '问题反馈',
autoBackButton: true,
backgroundColor: '#F7F7F7',
titleColor: '#007aff',
buttons: [{
text: '发送',
color: '#007aff',
fontSize: '16px',
fontWeight: 'bold',
onclick: function (e) {
feedback.evalJS(
'mui&&mui.trigger(document.getElementById("submit"),"tap")'
)
}
}]
}
}
)
feedback.show('slide-in-right')
}
},
_bindObjectListeners (data, value) {
if (value) {
for (const key in value) {
const existing = data.on[key]
const ours = value[key]
data.on[key] = existing ? [].concat(existing, ours) : ours
}
}
return data
}
},
render (createElement) {
const $listeners = Object.create(null)
if (this.$listeners) {
Object.keys(this.$listeners).forEach(e => {
if (this.disabled && (e === 'click' || e === 'tap')) {
return
}
$listeners[e] = this.$listeners[e]
})
}
if (this.hoverClass && this.hoverClass !== 'none') {
return createElement(
'uni-button',
this._bindObjectListeners(
{
class: [this.hovering ? this.hoverClass : ''],
attrs: {
disabled: this.disabled
},
on: {
touchstart: this._hoverTouchStart,
touchend: this._hoverTouchEnd,
touchcancel: this._hoverTouchCancel,
click: this._onClick
}
},
$listeners
),
this.$slots.default
)
} else {
return createElement(
'uni-button',
this._bindObjectListeners(
{
class: [this.hovering ? this.hoverClass : ''],
attrs: {
disabled: this.disabled
},
on: {
click: this._onClick
}
},
$listeners
),
this.$slots.default
)
}
},
listeners: {
'label-click': '_onClick',
'@label-click': '_onClick'
}
}
</script>
\ No newline at end of file
import Audio from './audio/index.vue'
// import Button from './button/index.vue'
import Button from './button/index'
import Canvas from './canvas/index.vue'
import Checkbox from './checkbox/index.vue'
import CheckboxGroup from './checkbox-group/index.vue'
......@@ -29,7 +29,7 @@ import Textarea from './textarea/index.vue'
import View from './view/index.vue'
export {
Audio,
// Button,
Button,
Canvas,
Checkbox,
CheckboxGroup,
......
import {
watch,
onMounted,
onBeforeMount,
getCurrentInstance,
ComponentPublicInstance,
} from 'vue'
function normalizeEvent(componentId: string, vm: ComponentPublicInstance) {
return (
vm.$page.id +
'-' +
vm.$options.name!.replace(/VUni([A-Z])/, '$1').toLowerCase() +
'-' +
componentId
)
}
function addSubscribe(
componentId: string,
vm: ComponentPublicInstance,
callback: Function
) {
UniViewJSBridge.subscribe(
normalizeEvent(componentId, vm),
({ type, data }: { type: string; data: unknown }) => {
callback(type, data)
}
)
}
function removeSubscribe(componentId: string, vm: ComponentPublicInstance) {
UniViewJSBridge.unsubscribe(normalizeEvent(componentId, vm))
}
export function useSubscribe(callback: (type: string, data: unknown) => void) {
const instance = getCurrentInstance()!.proxy!
onMounted(() => {
addSubscribe((instance as any).id, instance, callback)
watch(
() => (instance as any).id,
(value, oldValue) => {
addSubscribe(value, instance, callback)
removeSubscribe(oldValue, instance)
}
)
})
onBeforeMount(() => {
removeSubscribe((instance as any).id, instance)
})
}
export * from './components'
export { useSubscribe } from './helpers/useSubscribe'
......@@ -16,12 +16,11 @@ const messages = {
const fallbackLocale = 'en'
const i18n = initVueI18n(
const i18n = /*#__PURE__*/ initVueI18n(
__PLATFORM__ === 'app-plus' || __PLATFORM__ === 'h5' ? messages : {},
fallbackLocale
)
export const t = i18n.t
export const i18nMixin = i18n.mixin
export const setLocale = i18n.setLocale
export const getLocale = i18n.getLocale
export function useI18n() {
return i18n
}
export * from './util'
export * from './icon'
export * from './i18n'
export * from './getRealRoute'
export * from './getWindowOffset'
uni-canvas {
width: 300px;
height: 150px;
display: block;
position: relative;
}
uni-canvas > canvas {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
uni-checkbox-group[hidden] {
display: none;
}
.ql-container {
display: block;
position: relative;
box-sizing: border-box;
-webkit-user-select: text;
user-select: text;
outline: none;
overflow: hidden;
width: 100%;
height: 200px;
min-height: 200px;
}
.ql-container[hidden] {
display: none;
}
.ql-container .ql-editor {
position: relative;
font-size: inherit;
line-height: inherit;
font-family: inherit;
min-height: inherit;
width: 100%;
height: 100%;
padding: 0;
overflow-x: hidden;
overflow-y: auto;
-webkit-tap-highlight-color: transparent;
-webkit-touch-callout: none;
-webkit-overflow-scrolling: touch;
}
.ql-container .ql-editor::-webkit-scrollbar {
width: 0 !important;
}
.ql-container .ql-editor.scroll-disabled {
overflow: hidden;
}
.ql-container .ql-image-overlay {
display: flex;
position: absolute;
box-sizing: border-box;
border: 1px dashed #ccc;
justify-content: center;
align-items: center;
-webkit-user-select: none;
user-select: none;
}
.ql-container .ql-image-overlay .ql-image-size {
position: absolute;
padding: 4px 8px;
text-align: center;
background-color: #fff;
color: #888;
border: 1px solid #ccc;
box-sizing: border-box;
opacity: 0.8;
right: 4px;
top: 4px;
font-size: 12px;
display: inline-block;
width: auto;
}
.ql-container .ql-image-overlay .ql-image-toolbar {
position: relative;
text-align: center;
box-sizing: border-box;
background: #000;
border-radius: 5px;
color: #fff;
font-size: 0;
min-height: 24px;
z-index: 100;
}
.ql-container .ql-image-overlay .ql-image-toolbar span {
display: inline-block;
cursor: pointer;
padding: 5px;
font-size: 12px;
border-right: 1px solid #fff;
}
.ql-container .ql-image-overlay .ql-image-toolbar span:last-child {
border-right: 0;
}
.ql-container .ql-image-overlay .ql-image-toolbar span.triangle-up {
padding: 0;
position: absolute;
top: -12px;
left: 50%;
transform: translatex(-50%);
width: 0;
height: 0;
border-width: 6px;
border-style: solid;
border-color: transparent transparent black transparent;
}
.ql-container .ql-image-overlay .ql-image-handle {
position: absolute;
height: 12px;
width: 12px;
border-radius: 50%;
border: 1px solid #ccc;
box-sizing: border-box;
background: #fff;
}
.ql-container img {
display: inline-block;
max-width: 100%;
}
.ql-clipboard p {
margin: 0;
padding: 0;
}
.ql-editor {
box-sizing: border-box;
height: 100%;
outline: none;
overflow-y: auto;
tab-size: 4;
-moz-tab-size: 4;
text-align: left;
white-space: pre-wrap;
word-wrap: break-word;
}
.ql-editor > * {
cursor: text;
}
.ql-editor p,
.ql-editor ol,
.ql-editor ul,
.ql-editor pre,
.ql-editor blockquote,
.ql-editor h1,
.ql-editor h2,
.ql-editor h3,
.ql-editor h4,
.ql-editor h5,
.ql-editor h6 {
margin: 0;
padding: 0;
counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol > li,
.ql-editor ul > li {
list-style-type: none;
}
.ql-editor ul > li::before {
content: '\2022';
}
.ql-editor ul[data-checked=true],
.ql-editor ul[data-checked=false] {
pointer-events: none;
}
.ql-editor ul[data-checked=true] > li *,
.ql-editor ul[data-checked=false] > li * {
pointer-events: all;
}
.ql-editor ul[data-checked=true] > li::before,
.ql-editor ul[data-checked=false] > li::before {
color: #777;
cursor: pointer;
pointer-events: all;
}
.ql-editor ul[data-checked=true] > li::before {
content: '\2611';
}
.ql-editor ul[data-checked=false] > li::before {
content: '\2610';
}
.ql-editor li::before {
display: inline-block;
white-space: nowrap;
width: 2em;
}
.ql-editor ol li {
counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
counter-increment: list-0;
}
.ql-editor ol li:before {
content: counter(list-0, decimal) '. ';
}
.ql-editor ol li.ql-indent-1 {
counter-increment: list-1;
}
.ql-editor ol li.ql-indent-1:before {
content: counter(list-1, lower-alpha) '. ';
}
.ql-editor ol li.ql-indent-1 {
counter-reset: list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-2 {
counter-increment: list-2;
}
.ql-editor ol li.ql-indent-2:before {
content: counter(list-2, lower-roman) '. ';
}
.ql-editor ol li.ql-indent-2 {
counter-reset: list-3 list-4 list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-3 {
counter-increment: list-3;
}
.ql-editor ol li.ql-indent-3:before {
content: counter(list-3, decimal) '. ';
}
.ql-editor ol li.ql-indent-3 {
counter-reset: list-4 list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-4 {
counter-increment: list-4;
}
.ql-editor ol li.ql-indent-4:before {
content: counter(list-4, lower-alpha) '. ';
}
.ql-editor ol li.ql-indent-4 {
counter-reset: list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-5 {
counter-increment: list-5;
}
.ql-editor ol li.ql-indent-5:before {
content: counter(list-5, lower-roman) '. ';
}
.ql-editor ol li.ql-indent-5 {
counter-reset: list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-6 {
counter-increment: list-6;
}
.ql-editor ol li.ql-indent-6:before {
content: counter(list-6, decimal) '. ';
}
.ql-editor ol li.ql-indent-6 {
counter-reset: list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-7 {
counter-increment: list-7;
}
.ql-editor ol li.ql-indent-7:before {
content: counter(list-7, lower-alpha) '. ';
}
.ql-editor ol li.ql-indent-7 {
counter-reset: list-8 list-9;
}
.ql-editor ol li.ql-indent-8 {
counter-increment: list-8;
}
.ql-editor ol li.ql-indent-8:before {
content: counter(list-8, lower-roman) '. ';
}
.ql-editor ol li.ql-indent-8 {
counter-reset: list-9;
}
.ql-editor ol li.ql-indent-9 {
counter-increment: list-9;
}
.ql-editor ol li.ql-indent-9:before {
content: counter(list-9, decimal) '. ';
}
.ql-editor .ql-indent-1:not(.ql-direction-rtl) {
padding-left: 2em;
}
.ql-editor li.ql-indent-1:not(.ql-direction-rtl) {
padding-left: 2em;
}
.ql-editor .ql-indent-1.ql-direction-rtl.ql-align-right {
padding-right: 2em;
}
.ql-editor li.ql-indent-1.ql-direction-rtl.ql-align-right {
padding-right: 2em;
}
.ql-editor .ql-indent-2:not(.ql-direction-rtl) {
padding-left: 4em;
}
.ql-editor li.ql-indent-2:not(.ql-direction-rtl) {
padding-left: 4em;
}
.ql-editor .ql-indent-2.ql-direction-rtl.ql-align-right {
padding-right: 4em;
}
.ql-editor li.ql-indent-2.ql-direction-rtl.ql-align-right {
padding-right: 4em;
}
.ql-editor .ql-indent-3:not(.ql-direction-rtl) {
padding-left: 6em;
}
.ql-editor li.ql-indent-3:not(.ql-direction-rtl) {
padding-left: 6em;
}
.ql-editor .ql-indent-3.ql-direction-rtl.ql-align-right {
padding-right: 6em;
}
.ql-editor li.ql-indent-3.ql-direction-rtl.ql-align-right {
padding-right: 6em;
}
.ql-editor .ql-indent-4:not(.ql-direction-rtl) {
padding-left: 8em;
}
.ql-editor li.ql-indent-4:not(.ql-direction-rtl) {
padding-left: 8em;
}
.ql-editor .ql-indent-4.ql-direction-rtl.ql-align-right {
padding-right: 8em;
}
.ql-editor li.ql-indent-4.ql-direction-rtl.ql-align-right {
padding-right: 8em;
}
.ql-editor .ql-indent-5:not(.ql-direction-rtl) {
padding-left: 10em;
}
.ql-editor li.ql-indent-5:not(.ql-direction-rtl) {
padding-left: 10em;
}
.ql-editor .ql-indent-5.ql-direction-rtl.ql-align-right {
padding-right: 10em;
}
.ql-editor li.ql-indent-5.ql-direction-rtl.ql-align-right {
padding-right: 10em;
}
.ql-editor .ql-indent-6:not(.ql-direction-rtl) {
padding-left: 12em;
}
.ql-editor li.ql-indent-6:not(.ql-direction-rtl) {
padding-left: 12em;
}
.ql-editor .ql-indent-6.ql-direction-rtl.ql-align-right {
padding-right: 12em;
}
.ql-editor li.ql-indent-6.ql-direction-rtl.ql-align-right {
padding-right: 12em;
}
.ql-editor .ql-indent-7:not(.ql-direction-rtl) {
padding-left: 14em;
}
.ql-editor li.ql-indent-7:not(.ql-direction-rtl) {
padding-left: 14em;
}
.ql-editor .ql-indent-7.ql-direction-rtl.ql-align-right {
padding-right: 14em;
}
.ql-editor li.ql-indent-7.ql-direction-rtl.ql-align-right {
padding-right: 14em;
}
.ql-editor .ql-indent-8:not(.ql-direction-rtl) {
padding-left: 16em;
}
.ql-editor li.ql-indent-8:not(.ql-direction-rtl) {
padding-left: 16em;
}
.ql-editor .ql-indent-8.ql-direction-rtl.ql-align-right {
padding-right: 16em;
}
.ql-editor li.ql-indent-8.ql-direction-rtl.ql-align-right {
padding-right: 16em;
}
.ql-editor .ql-indent-9:not(.ql-direction-rtl) {
padding-left: 18em;
}
.ql-editor li.ql-indent-9:not(.ql-direction-rtl) {
padding-left: 18em;
}
.ql-editor .ql-indent-9.ql-direction-rtl.ql-align-right {
padding-right: 18em;
}
.ql-editor li.ql-indent-9.ql-direction-rtl.ql-align-right {
padding-right: 18em;
}
.ql-editor .ql-direction-rtl {
direction: rtl;
text-align: inherit;
}
.ql-editor .ql-align-center {
text-align: center;
}
.ql-editor .ql-align-justify {
text-align: justify;
}
.ql-editor .ql-align-right {
text-align: right;
}
.ql-editor.ql-blank::before {
color: rgba(0, 0, 0, 0.6);
content: attr(data-placeholder);
font-style: italic;
pointer-events: none;
position: absolute;
}
.ql-container.ql-disabled .ql-editor ul[data-checked] > li::before {
pointer-events: none;
}
.ql-clipboard {
left: -100000px;
height: 1px;
overflow-y: hidden;
position: absolute;
top: 50%;
}
@keyframes once-show {
from {
top: 0;
}
}
uni-resize-sensor,
uni-resize-sensor > div {
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
overflow: hidden;
}
uni-resize-sensor {
display: block;
z-index: -1;
visibility: hidden;
animation: once-show 1ms;
}
uni-resize-sensor > div > div {
position: absolute;
left: 0;
top: 0;
}
uni-resize-sensor > div:first-child > div {
width: 100000px;
height: 100000px;
}
uni-resize-sensor > div:last-child > div {
width: 200%;
height: 200%;
}
.uni-label-pointer {
cursor: pointer;
}
uni-movable-view {
display: inline-block;
width: 10px;
height: 10px;
top: 0px;
left: 0px;
position: absolute;
cursor: grab;
}
uni-movable-view[hidden] {
display: none;
}
uni-radio {
-webkit-tap-highlight-color: transparent;
display: inline-block;
cursor: pointer;
}
uni-radio[hidden] {
display: none;
}
uni-radio[disabled] {
cursor: not-allowed;
}
uni-radio .uni-radio-wrapper {
display: -webkit-inline-flex;
display: inline-flex;
-webkit-align-items: center;
align-items: center;
vertical-align: middle;
}
uni-radio .uni-radio-input {
-webkit-appearance: none;
appearance: none;
margin-right: 5px;
outline: 0;
border: 1px solid #D1D1D1;
background-color: #ffffff;
border-radius: 50%;
width: 22px;
height: 22px;
position: relative;
}
uni-radio:not([disabled]) .uni-radio-input:hover {
border-color: #007aff;
}
uni-radio .uni-radio-input.uni-radio-input-checked:before {
font: normal normal normal 14px/1 "uni";
content: "\EA08";
color: #ffffff;
font-size: 18px;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -48%) scale(0.73);
-webkit-transform: translate(-50%, -48%) scale(0.73);
}
uni-radio .uni-radio-input.uni-radio-input-disabled {
background-color: #E1E1E1;
border-color: #D1D1D1;
}
uni-radio .uni-radio-input.uni-radio-input-disabled:before {
color: #ADADAD;
}
uni-radio-group {
display: block;
}
uni-radio-group[hidden] {
display: none;
}
uni-swiper-item {
display: block;
overflow: hidden;
will-change: transform;
position: absolute;
width: 100%;
height: 100%;
cursor: grab;
}
uni-swiper-item[hidden] {
display: none;
}
uni-switch {
-webkit-tap-highlight-color: transparent;
display: inline-block;
cursor: pointer;
}
uni-switch[hidden] {
display: none;
}
uni-switch[disabled] {
cursor: not-allowed;
}
uni-switch .uni-switch-wrapper {
display: -webkit-inline-flex;
display: inline-flex;
-webkit-align-items: center;
align-items: center;
vertical-align: middle;
}
uni-switch .uni-switch-input {
-webkit-appearance: none;
appearance: none;
position: relative;
width: 52px;
height: 32px;
margin-right: 5px;
border: 1px solid #DFDFDF;
outline: 0;
border-radius: 16px;
box-sizing: border-box;
background-color: #DFDFDF;
transition: background-color 0.1s, border 0.1s;
}
uni-switch[disabled] .uni-switch-input {
opacity: .7;
}
uni-switch .uni-switch-input:before {
content: " ";
position: absolute;
top: 0;
left: 0;
width: 50px;
height: 30px;
border-radius: 15px;
background-color: #FDFDFD;
transition: -webkit-transform 0.3s;
transition: transform 0.3s;
transition: transform 0.3s, -webkit-transform 0.3s;
}
uni-switch .uni-switch-input:after {
content: " ";
position: absolute;
top: 0;
left: 0;
width: 30px;
height: 30px;
border-radius: 15px;
background-color: #FFFFFF;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
transition: -webkit-transform 0.3s;
transition: transform 0.3s;
transition: transform 0.3s, -webkit-transform 0.3s;
}
uni-switch .uni-switch-input.uni-switch-input-checked {
border-color: #007aff;
background-color: #007aff;
}
uni-switch .uni-switch-input.uni-switch-input-checked:before {
-webkit-transform: scale(0);
transform: scale(0);
}
uni-switch .uni-switch-input.uni-switch-input-checked:after {
-webkit-transform: translateX(20px);
transform: translateX(20px);
}
uni-switch .uni-checkbox-input {
margin-right: 5px;
-webkit-appearance: none;
appearance: none;
outline: 0;
border: 1px solid #D1D1D1;
background-color: #FFFFFF;
border-radius: 3px;
width: 22px;
height: 22px;
position: relative;
color: #007aff;
}
uni-switch:not([disabled]) .uni-checkbox-input:hover {
border-color: #007aff;
}
uni-switch .uni-checkbox-input.uni-checkbox-input-checked:before {
font: normal normal normal 14px/1 "uni";
content: "\EA08";
color: inherit;
font-size: 22px;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -48%) scale(0.73);
-webkit-transform: translate(-50%, -48%) scale(0.73);
}
uni-switch .uni-checkbox-input.uni-checkbox-input-disabled {
background-color: #E1E1E1;
}
uni-switch .uni-checkbox-input.uni-checkbox-input-disabled:before {
color: #ADADAD;
}
uni-textarea {
width: 300px;
height: 150px;
display: block;
position: relative;
font-size: 16px;
line-height: normal;
white-space: pre-wrap;
word-break: break-all;
}
uni-textarea[hidden] {
display: none;
}
.uni-textarea-wrapper,
.uni-textarea-placeholder,
.uni-textarea-line,
.uni-textarea-compute,
.uni-textarea-textarea {
outline: none;
border: none;
padding: 0;
margin: 0;
text-decoration: inherit;
}
.uni-textarea-wrapper {
display: block;
position: relative;
width: 100%;
height: 100%;
}
.uni-textarea-placeholder,
.uni-textarea-line,
.uni-textarea-compute,
.uni-textarea-textarea {
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
white-space: inherit;
word-break: inherit;
}
.uni-textarea-placeholder {
color: grey;
overflow: hidden;
}
.uni-textarea-line,
.uni-textarea-compute {
visibility: hidden;
height: auto;
}
.uni-textarea-line {
width: 1em;
}
.uni-textarea-textarea {
resize: none;
background: none;
color: inherit;
opacity: 1;
-webkit-text-fill-color: currentcolor;
font: inherit;
line-height: inherit;
letter-spacing: inherit;
text-align: inherit;
text-indent: inherit;
text-transform: inherit;
text-shadow: inherit;
}
/* 用于解决 iOS textarea 内部默认边距 */
.uni-textarea-textarea-fix-margin {
width: auto;
right: 0;
margin: 0 -3px;
}
.uni-async-error {
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
color: #999;
padding: 100px 10px;
text-align: center;
}
.uni-async-loading {
box-sizing: border-box;
width: 100%;
padding: 50px;
text-align: center;
}
.uni-async-loading .uni-loading {
width: 30px;
height: 30px;
}
此差异已折叠。
此差异已折叠。
<template>
<div
class="uni-async-error"
@click="_onClick"
>
{{ $$t("uni.async.error") }}
</div>
<div class="uni-async-error" @click="reload">{{ $$t("uni.async.error") }}</div>
</template>
<style>
.uni-async-error {
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
color: #999;
padding: 100px 10px;
text-align: center;
}
.uni-async-error {
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
color: #999;
padding: 100px 10px;
text-align: center;
}
</style>
<script>
import {
i18nMixin
} from '@dcloudio/uni-core/helpers/i18n'
useI18n
} from '@dcloudio/uni-core'
export default {
name: 'AsyncError',
mixins: [i18nMixin],
methods: {
_onClick () {
// TODO 临时采用 reload
window.location.reload()
setup() {
const { t } = useI18n()
return {
$$t: t,
reload() {
window.location.reload()
}
}
}
}
......
......@@ -14,6 +14,11 @@ export function initMixin(app: App) {
this.$callHook('onLoad', {})
this.__isVisible = true
this.$callHook('onShow')
} else {
// TODO 待优化
if (this.$parent) {
this.$page = this.$parent.$page
}
}
},
mounted() {
......
......@@ -65,6 +65,7 @@ function initPublicPage(route: RouteLocationNormalizedLoaded) {
export function initPage(vm: ComponentPublicInstance) {
const route = vm.$route
;(vm as any).$vm = vm
;(vm as any).$page = initPublicPage(route)
currentPagesMap.set(vm.$page.id, (vm as unknown) as Page.PageInstance)
}
......
......@@ -12,6 +12,7 @@ import plugin from './framework/plugin'
export { plugin }
export * from '@dcloudio/uni-components'
export * from './view/components'
export * from './view/bridge'
......
......@@ -26,4 +26,5 @@ export {
base64ToArrayBuffer,
createIntersectionObserver,
createSelectorQuery,
createVideoContext,
} from '@dcloudio/uni-api'
import Video from './video/index.vue'
export { Video }
......@@ -72,7 +72,12 @@
@click.stop="triggerFullscreen(!fullscreen)"
/>
</div>
<div v-show="start && enableDanmuSync" ref="danmu" style="z-index: 0;" class="uni-video-danmu" />
<div
v-show="start && enableDanmuSync"
ref="danmu"
style="z-index: 0;"
class="uni-video-danmu"
/>
<div v-if="centerPlayBtnShow" class="uni-video-cover" @click.stop>
<div class="uni-video-cover-play-button" @click.stop="play" />
<p class="uni-video-cover-duration">{{ (duration || durationTime) | time }}</p>
......@@ -103,7 +108,10 @@
</div>
</div>
</div>
<div :class="{ 'uni-video-toast-progress': gestureType == 'progress' }" class="uni-video-toast">
<div
:class="{ 'uni-video-toast-progress': gestureType == 'progress' }"
class="uni-video-toast"
>
<div class="uni-video-toast-title">{{ currentTimeNew | time }} / {{ durationTime | time }}</div>
</div>
<div class="uni-video-slots">
......@@ -113,17 +121,11 @@
</uni-video>
</template>
<script>
import {
passive
} from '@dcloudio/uni-shared'
import {
subscriber,
interact
} from 'uni-mixins'
import {
i18nMixin
} from 'uni-core/helpers/i18n'
import { getCurrentInstance } from 'vue'
import { passive } from '@dcloudio/uni-shared'
import { useI18n } from '@dcloudio/uni-core'
import { getRealPath } from '@dcloudio/uni-platform'
import { useSubscribe } from '@dcloudio/uni-components'
const passiveOptions = passive(false)
......@@ -152,7 +154,6 @@ export default {
return str
}
},
mixins: [i18nMixin, subscriber, interact],
props: {
id: {
type: String,
......@@ -273,7 +274,7 @@ export default {
return this.controlsShow && this.playing && !this.controlsTouching
},
srcSync() {
return this.$getRealPath(this.src)
return getRealPath(this.src)
}
},
watch: {
......@@ -305,6 +306,31 @@ export default {
}
}
},
setup() {
const { t } = useI18n()
const vm = getCurrentInstance().proxy
useSubscribe((type, data) => {
const methods = ['play', 'pause', 'seek', 'sendDanmu', 'playbackRate', 'requestFullScreen', 'exitFullScreen']
let options
switch (type) {
case 'seek':
options = data.position
break
case 'sendDanmu':
options = data
break
case 'playbackRate':
options = data.rate
break
}
if (methods.indexOf(type) >= 0) {
vm[type](options)
}
})
return {
$$t: t,
}
},
created() {
this.otherData = {
danmuList: [],
......@@ -378,27 +404,6 @@ export default {
clearTimeout(this.otherData.hideTiming)
},
methods: {
_handleSubscribe({
type,
data = {}
}) {
const methods = ['play', 'pause', 'seek', 'sendDanmu', 'playbackRate', 'requestFullScreen', 'exitFullScreen']
let options
switch (type) {
case 'seek':
options = data.position
break
case 'sendDanmu':
options = data
break
case 'playbackRate':
options = data.rate
break
}
if (methods.indexOf(type) >= 0) {
this[type](options)
}
},
trigger() {
if (this.playing) {
this.$refs.video.pause()
......@@ -712,320 +717,3 @@ export default {
}
</script>
<style>
uni-video {
width: 300px;
height: 225px;
display: inline-block;
line-height: 0;
overflow: hidden;
position: relative;
}
uni-video[hidden] {
display: none;
}
.uni-video-container {
width: 100%;
height: 100%;
background-color: black;
display: inline-block;
position: absolute;
top: 0;
left: 0;
overflow: hidden;
object-position: inherit;
}
.uni-video-container.uni-video-type-fullscreen {
position: fixed;
z-index: 999;
}
.uni-video-video {
width: 100%;
height: 100%;
object-position: inherit;
}
.uni-video-cover {
position: absolute;
top: 0;
left: 0;
bottom: 0;
width: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
background-color: rgba(1, 1, 1, 0.5);
z-index: 1;
}
.uni-video-slots {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
overflow: hidden;
pointer-events: none;
}
.uni-video-cover-play-button {
width: 40px;
height: 40px;
background-size: 50%;
background-repeat: no-repeat;
background-position: 50% 50%;
cursor: pointer;
}
.uni-video-cover-duration {
color: #fff;
font-size: 16px;
line-height: 1;
margin-top: 10px;
}
.uni-video-bar {
height: 44px;
background-color: rgba(0, 0, 0, 0.5);
overflow: hidden;
position: absolute;
bottom: 0;
right: 0;
display: flex;
display: flex;
align-items: center;
align-items: center;
padding: 0 10px;
z-index: 0;
/* 解决全屏后被 video 遮挡的问题 */
transform: translate3d(0, 0, 0);
}
.uni-video-bar.uni-video-bar-full {
left: 0;
}
.uni-video-controls {
display: flex;
display: flex;
flex-grow: 1;
flex-grow: 1;
margin: 0 8.5px;
}
.uni-video-control-button {
width: 13px;
height: 15px;
padding: 14.5px 12.5px 14.5px 12.5px;
margin-left: -8.5px;
box-sizing: content-box;
cursor: pointer;
}
.uni-video-control-button::after {
content: "";
display: block;
width: 100%;
height: 100%;
background-size: 100%;
background-position: 50% 50%;
background-repeat: no-repeat;
}
.uni-video-control-button.uni-video-control-button-play::after,
.uni-video-cover-play-button {
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAeCAYAAAAy2w7YAAAAAXNSR0IArs4c6QAAAWhJREFUSA1j+P///0cgBoHjQGzCQCsAtgJB/AMy5wCxGNXtQ9iBwvoA5BUCMQvVLEQxHpNzDSjkRhXLMM3GKrIeKKpEkYVYjcUu+AMo3ALE3GRZiN1MvKKPgbIRJFuG10j8koeA0gZEW4jfLIKyf4EqpgOxMEELCRpFnIJ3QGU5QMyM00LizCFa1SWgSkeslhFtBGkKVwGVy6FYSJp+klR/A6quB2JOkIWMIK0oNlOf8xBoZDE9LAI7nYn6HsBq4l96WHQEaLUpAyiOaASeAM2NgvuPBpaACt82IEYtfKls0UagecpwXyAzqGTRdaA57sjmYrAptAjUsCkGYlYMg9EFyLQI1IiZB8Ti6Obh5JNh0QmgHlOcBuKSIMGi50C18UDMiMssvOJEWPQLqKYbiHnxGkRIkoBF24DyaoTMIEoeh0W3geI+RBlArCI0iz4D+RVAzEasfqLVAQ19AcSg5LoYiKWI1kiiQgCMBLnEEcfDSgAAAABJRU5ErkJggg==");
}
.uni-video-control-button.uni-video-control-button-pause::after {
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAgCAYAAAAffCjxAAAAAXNSR0IArs4c6QAAAFlJREFUSA3tksEKACAIQ7X//5zq98wOgQayum8QaGweHhMzG/6OujzKAymn+0LMqivu1XznWmX8/echTIyMyAgTwA72iIwwAexgj8gIE8CO3aMRbDPMaEy5BRGaKcZv8YxRAAAAAElFTkSuQmCC");
}
.uni-video-current-time,
.uni-video-duration {
height: 14.5px;
line-height: 14.5px;
margin-top: 15px;
margin-bottom: 14.5px;
font-size: 12px;
color: #cbcbcb;
}
.uni-video-progress-container {
flex-grow: 2;
flex-grow: 2;
position: relative;
}
.uni-video-progress {
height: 2px;
margin: 21px 12px;
background-color: rgba(255, 255, 255, 0.4);
position: relative;
cursor: pointer;
}
.uni-video-progress-buffered {
position: absolute;
left: 0;
top: 0;
width: 0;
height: 100%;
transition: width 0.1s;
background-color: rgba(255, 255, 255, 0.8);
}
.uni-video-ball {
width: 16px;
height: 16px;
padding: 14px;
position: absolute;
top: -21px;
box-sizing: content-box;
left: 0%;
margin-left: -22px;
}
.uni-video-inner {
width: 100%;
height: 100%;
background-color: #ffffff;
border-radius: 50%;
}
.uni-video-danmu-button {
white-space: nowrap;
line-height: 1;
padding: 2px 10px;
border: 1px solid #fff;
border-radius: 5px;
font-size: 13px;
color: #fff;
margin: 0 8.5px;
cursor: pointer;
}
.uni-video-danmu-button.uni-video-danmu-button-active {
border-color: #48c23d;
color: #48c23d;
}
.uni-video-fullscreen {
width: 17px;
height: 17px;
padding: 8.5px;
box-sizing: content-box;
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACIAAAAiCAYAAAA6RwvCAAAAAXNSR0IArs4c6QAAAQRJREFUWAnt1d0NwiAQB/CmS7hHX5zFxLF0Ah2hE/lg7BT4PyMJUj6Oyt299BIioZT7ARYG59wLpTXmoXOMGO/QecxtwyWW4o42AupGALkFdX1MkHxE3Q7jIbQPqNthQogpJoZkMLRlsn/gFMQEk4OoY0oQVUwNoobhQFQwgMxUKFkt0C8+Zy61d8SeR5iHWCLOwF/MCb8Tp//ex3QFsE1HlCfKFUX2OijNFMnPKD7k76YcBoL402Zh8B77+MjlXrVvwfglXA32b0MrRgxCE2nBiEJaMOIQLkYFwsGoQWoYVUgJow4pYD4Weq4ayBqfwDYQmnUK0301kITujuawu65/l2B5A4z3Qe+Ut7EBAAAAAElFTkSuQmCC");
background-size: 50%;
background-position: 50% 50%;
background-repeat: no-repeat;
cursor: pointer;
}
.uni-video-fullscreen.uni-video-type-fullscreen {
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACIAAAAiCAYAAAA6RwvCAAABBElEQVRYhcXWwQ3CMAwF0O+qOzAKQzAAl0pMxQQwQhmGKwcERxbgc4lEVdHUbm3zJR8qJemTo6YByS3JO8kjyQbGkHQpkOz4zcmK8YQ0BWDCkOxL+UDKombMYKwfZAkmDGLFhEIsmHCIFpMC0WDSIHOYVEgNkw6pYPIhE5j/QCoYF0g7eEkPYGej+cX82x/l6aIAIOb9CcrajrjFE/IAQGP1IgIRcYVsVs32+vx+nC9nWq6dAZDhOaPHBEDGh54O4w0pa9oxEZBFmCjIBGb6Qh4JMWGiIWpMBkSFyYLMYjIhNUw7N9GQi2aQiLxJHspjV+rl1hFrRp25uV2MRGQRBsAewPUD/HhJVOOuCzwAAAAASUVORK5CYII=");
}
.uni-video-danmu {
position: absolute;
top: 0;
left: 0;
bottom: 0;
width: 100%;
margin-top: 14px;
margin-bottom: 44px;
font-size: 14px;
line-height: 14px;
overflow: visible;
}
.uni-video-danmu-item {
line-height: 1;
position: absolute;
color: #ffffff;
white-space: nowrap;
left: 100%;
transform: translatex(0);
transition-property: left, transform;
transition-duration: 3s;
transition-timing-function: linear;
}
.uni-video-toast {
pointer-events: none;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
border-radius: 5px;
background-color: rgba(255, 255, 255, 0.8);
color: #000000;
display: none;
}
.uni-video-toast.uni-video-toast-volume {
width: 100px;
height: 100px;
display: block;
}
.uni-video-toast-volume .uni-video-toast-title {
width: 100%;
font-size: 12px;
line-height: 16px;
text-align: center;
margin-top: 10px;
display: block;
}
.uni-video-toast-volume .uni-video-toast-icon {
fill: #000000;
width: 50%;
height: 50%;
margin-left: 25%;
display: block;
}
.uni-video-toast-volume .uni-video-toast-value {
width: 80px;
height: 5px;
margin-top: 5px;
margin-left: 10px;
}
.uni-video-toast-volume
.uni-video-toast-value
> .uni-video-toast-value-content {
overflow: hidden;
}
.uni-video-toast-volume-grids {
width: 80px;
height: 5px;
}
.uni-video-toast-volume-grids-item {
float: left;
width: 7.1px;
height: 5px;
background-color: #000000;
}
.uni-video-toast-volume-grids-item:not(:first-child) {
margin-left: 1px;
}
.uni-video-toast.uni-video-toast-progress {
display: block;
background-color: rgba(0, 0, 0, 0.8);
color: white;
font-size: 14px;
line-height: 18px;
padding: 6px;
}
</style>
uni-video {
width: 300px;
height: 225px;
display: inline-block;
line-height: 0;
overflow: hidden;
position: relative;
}
uni-video[hidden] {
display: none;
}
.uni-video-container {
width: 100%;
height: 100%;
background-color: black;
display: inline-block;
position: absolute;
top: 0;
left: 0;
overflow: hidden;
object-position: inherit;
}
.uni-video-container.uni-video-type-fullscreen {
position: fixed;
z-index: 999;
}
.uni-video-video {
width: 100%;
height: 100%;
object-position: inherit;
}
.uni-video-cover {
position: absolute;
top: 0;
left: 0;
bottom: 0;
width: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
background-color: rgba(1, 1, 1, 0.5);
z-index: 1;
}
.uni-video-slots {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
overflow: hidden;
pointer-events: none;
}
.uni-video-cover-play-button {
width: 40px;
height: 40px;
background-size: 50%;
background-repeat: no-repeat;
background-position: 50% 50%;
cursor: pointer;
}
.uni-video-cover-duration {
color: #fff;
font-size: 16px;
line-height: 1;
margin-top: 10px;
}
.uni-video-bar {
height: 44px;
background-color: rgba(0, 0, 0, 0.5);
overflow: hidden;
position: absolute;
bottom: 0;
right: 0;
display: flex;
display: flex;
align-items: center;
align-items: center;
padding: 0 10px;
z-index: 0;
/* 解决全屏后被 video 遮挡的问题 */
transform: translate3d(0, 0, 0);
}
.uni-video-bar.uni-video-bar-full {
left: 0;
}
.uni-video-controls {
display: flex;
display: flex;
flex-grow: 1;
flex-grow: 1;
margin: 0 8.5px;
}
.uni-video-control-button {
width: 13px;
height: 15px;
padding: 14.5px 12.5px 14.5px 12.5px;
margin-left: -8.5px;
box-sizing: content-box;
cursor: pointer;
}
.uni-video-control-button::after {
content: "";
display: block;
width: 100%;
height: 100%;
background-size: 100%;
background-position: 50% 50%;
background-repeat: no-repeat;
}
.uni-video-control-button.uni-video-control-button-play::after,
.uni-video-cover-play-button {
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAeCAYAAAAy2w7YAAAAAXNSR0IArs4c6QAAAWhJREFUSA1j+P///0cgBoHjQGzCQCsAtgJB/AMy5wCxGNXtQ9iBwvoA5BUCMQvVLEQxHpNzDSjkRhXLMM3GKrIeKKpEkYVYjcUu+AMo3ALE3GRZiN1MvKKPgbIRJFuG10j8koeA0gZEW4jfLIKyf4EqpgOxMEELCRpFnIJ3QGU5QMyM00LizCFa1SWgSkeslhFtBGkKVwGVy6FYSJp+klR/A6quB2JOkIWMIK0oNlOf8xBoZDE9LAI7nYn6HsBq4l96WHQEaLUpAyiOaASeAM2NgvuPBpaACt82IEYtfKls0UagecpwXyAzqGTRdaA57sjmYrAptAjUsCkGYlYMg9EFyLQI1IiZB8Ti6Obh5JNh0QmgHlOcBuKSIMGi50C18UDMiMssvOJEWPQLqKYbiHnxGkRIkoBF24DyaoTMIEoeh0W3geI+RBlArCI0iz4D+RVAzEasfqLVAQ19AcSg5LoYiKWI1kiiQgCMBLnEEcfDSgAAAABJRU5ErkJggg==");
}
.uni-video-control-button.uni-video-control-button-pause::after {
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAgCAYAAAAffCjxAAAAAXNSR0IArs4c6QAAAFlJREFUSA3tksEKACAIQ7X//5zq98wOgQayum8QaGweHhMzG/6OujzKAymn+0LMqivu1XznWmX8/echTIyMyAgTwA72iIwwAexgj8gIE8CO3aMRbDPMaEy5BRGaKcZv8YxRAAAAAElFTkSuQmCC");
}
.uni-video-current-time,
.uni-video-duration {
height: 14.5px;
line-height: 14.5px;
margin-top: 15px;
margin-bottom: 14.5px;
font-size: 12px;
color: #cbcbcb;
}
.uni-video-progress-container {
flex-grow: 2;
flex-grow: 2;
position: relative;
}
.uni-video-progress {
height: 2px;
margin: 21px 12px;
background-color: rgba(255, 255, 255, 0.4);
position: relative;
cursor: pointer;
}
.uni-video-progress-buffered {
position: absolute;
left: 0;
top: 0;
width: 0;
height: 100%;
transition: width 0.1s;
background-color: rgba(255, 255, 255, 0.8);
}
.uni-video-ball {
width: 16px;
height: 16px;
padding: 14px;
position: absolute;
top: -21px;
box-sizing: content-box;
left: 0%;
margin-left: -22px;
}
.uni-video-inner {
width: 100%;
height: 100%;
background-color: #ffffff;
border-radius: 50%;
}
.uni-video-danmu-button {
white-space: nowrap;
line-height: 1;
padding: 2px 10px;
border: 1px solid #fff;
border-radius: 5px;
font-size: 13px;
color: #fff;
margin: 0 8.5px;
cursor: pointer;
}
.uni-video-danmu-button.uni-video-danmu-button-active {
border-color: #48c23d;
color: #48c23d;
}
.uni-video-fullscreen {
width: 17px;
height: 17px;
padding: 8.5px;
box-sizing: content-box;
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACIAAAAiCAYAAAA6RwvCAAAAAXNSR0IArs4c6QAAAQRJREFUWAnt1d0NwiAQB/CmS7hHX5zFxLF0Ah2hE/lg7BT4PyMJUj6Oyt299BIioZT7ARYG59wLpTXmoXOMGO/QecxtwyWW4o42AupGALkFdX1MkHxE3Q7jIbQPqNthQogpJoZkMLRlsn/gFMQEk4OoY0oQVUwNoobhQFQwgMxUKFkt0C8+Zy61d8SeR5iHWCLOwF/MCb8Tp//ex3QFsE1HlCfKFUX2OijNFMnPKD7k76YcBoL402Zh8B77+MjlXrVvwfglXA32b0MrRgxCE2nBiEJaMOIQLkYFwsGoQWoYVUgJow4pYD4Weq4ayBqfwDYQmnUK0301kITujuawu65/l2B5A4z3Qe+Ut7EBAAAAAElFTkSuQmCC");
background-size: 50%;
background-position: 50% 50%;
background-repeat: no-repeat;
cursor: pointer;
}
.uni-video-fullscreen.uni-video-type-fullscreen {
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACIAAAAiCAYAAAA6RwvCAAABBElEQVRYhcXWwQ3CMAwF0O+qOzAKQzAAl0pMxQQwQhmGKwcERxbgc4lEVdHUbm3zJR8qJemTo6YByS3JO8kjyQbGkHQpkOz4zcmK8YQ0BWDCkOxL+UDKombMYKwfZAkmDGLFhEIsmHCIFpMC0WDSIHOYVEgNkw6pYPIhE5j/QCoYF0g7eEkPYGej+cX82x/l6aIAIOb9CcrajrjFE/IAQGP1IgIRcYVsVs32+vx+nC9nWq6dAZDhOaPHBEDGh54O4w0pa9oxEZBFmCjIBGb6Qh4JMWGiIWpMBkSFyYLMYjIhNUw7N9GQi2aQiLxJHspjV+rl1hFrRp25uV2MRGQRBsAewPUD/HhJVOOuCzwAAAAASUVORK5CYII=");
}
.uni-video-danmu {
position: absolute;
top: 0;
left: 0;
bottom: 0;
width: 100%;
margin-top: 14px;
margin-bottom: 44px;
font-size: 14px;
line-height: 14px;
overflow: visible;
}
.uni-video-danmu-item {
line-height: 1;
position: absolute;
color: #ffffff;
white-space: nowrap;
left: 100%;
transform: translatex(0);
transition-property: left, transform;
transition-duration: 3s;
transition-timing-function: linear;
}
.uni-video-toast {
pointer-events: none;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
border-radius: 5px;
background-color: rgba(255, 255, 255, 0.8);
color: #000000;
display: none;
}
.uni-video-toast.uni-video-toast-volume {
width: 100px;
height: 100px;
display: block;
}
.uni-video-toast-volume .uni-video-toast-title {
width: 100%;
font-size: 12px;
line-height: 16px;
text-align: center;
margin-top: 10px;
display: block;
}
.uni-video-toast-volume .uni-video-toast-icon {
fill: #000000;
width: 50%;
height: 50%;
margin-left: 25%;
display: block;
}
.uni-video-toast-volume .uni-video-toast-value {
width: 80px;
height: 5px;
margin-top: 5px;
margin-left: 10px;
}
.uni-video-toast-volume
.uni-video-toast-value
> .uni-video-toast-value-content {
overflow: hidden;
}
.uni-video-toast-volume-grids {
width: 80px;
height: 5px;
}
.uni-video-toast-volume-grids-item {
float: left;
width: 7.1px;
height: 5px;
background-color: #000000;
}
.uni-video-toast-volume-grids-item:not(:first-child) {
margin-left: 1px;
}
.uni-video-toast.uni-video-toast-progress {
display: block;
background-color: rgba(0, 0, 0, 0.8);
color: white;
font-size: 14px;
line-height: 18px;
padding: 6px;
}
\ No newline at end of file
......@@ -256,6 +256,7 @@ function initVueI18n(messages, fallbackLocale = 'en', locale) {
return t(key, values);
};
return {
i18n,
t(key, values) {
return t(key, values);
},
......
......@@ -30,6 +30,7 @@ export declare interface I18nOptions {
}
export declare function initVueI18n(messages: LocaleMessages, fallbackLocale?: BuiltInLocale, locale?: BuiltInLocale): {
i18n: I18n;
t(key: string, values?: Record<string, unknown> | unknown[] | undefined): string;
getLocale(): BuiltInLocale;
setLocale(newLocale: BuiltInLocale): void;
......
......@@ -252,6 +252,7 @@ function initVueI18n(messages, fallbackLocale = 'en', locale) {
return t(key, values);
};
return {
i18n,
t(key, values) {
return t(key, values);
},
......
......@@ -75,6 +75,7 @@ export function initVueI18n(
return t(key, values)
}
return {
i18n,
t(key: string, values?: Record<string, unknown> | Array<unknown>) {
return t(key, values)
},
......
export {
getRealPath,
addIntersectionObserver,
removeIntersectionObserver,
} from '@dcloudio/uni-mp-platform'
export * from '@dcloudio/uni-mp-platform'
export function getBaseSystemInfo() {
return my.getSystemInfoSync()
}
export {
getRealPath,
addIntersectionObserver,
removeIntersectionObserver,
} from '@dcloudio/uni-mp-platform'
export * from '@dcloudio/uni-mp-platform'
export function getBaseSystemInfo() {
return swan.getSystemInfoSync()
}
export function getRealPath() {}
export function operateVideoPlayer() {}
export function addIntersectionObserver() {}
export function removeIntersectionObserver() {}
export {
getRealPath,
addIntersectionObserver,
removeIntersectionObserver,
} from '@dcloudio/uni-mp-platform'
export * from '@dcloudio/uni-mp-platform'
export function getBaseSystemInfo() {
return qq.getSystemInfoSync()
}
export {
getRealPath,
addIntersectionObserver,
removeIntersectionObserver,
} from '@dcloudio/uni-mp-platform'
export * from '@dcloudio/uni-mp-platform'
export function getBaseSystemInfo() {
return tt.getSystemInfoSync()
}
export {
getRealPath,
addIntersectionObserver,
removeIntersectionObserver,
} from '@dcloudio/uni-mp-platform'
export * from '@dcloudio/uni-mp-platform'
export function getBaseSystemInfo() {
return wx.getSystemInfoSync()
}
export {
getRealPath,
addIntersectionObserver,
removeIntersectionObserver,
} from '@dcloudio/uni-mp-platform'
export * from '@dcloudio/uni-mp-platform'
export function getBaseSystemInfo() {
return qa.getSystemInfoSync()
}
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册