| | |
| | | const BlockEmbed = Quill.import('blots/block/embed'); |
| | | const Link = Quill.import('formats/link'); |
| | | |
| | | const ATTRIBUTES = ['height', 'width', 'controls', 'src', 'poster']; |
| | | const ATTRIBUTES = ['height', 'width', 'controls', 'src', ]; |
| | | |
| | | class VideoBlot extends BlockEmbed { |
| | | static create(value) { |
| | | const node = super.create(); |
| | | |
| | | // 设置基本属性 |
| | | node.setAttribute('controls', 'controls'); |
| | | node.setAttribute('controlsList', 'nodownload'); |
| | | node.setAttribute('preload', 'metadata'); |
| | | |
| | | // 支持对象形式的value |
| | | if (typeof value === 'object') { |
| | | node.setAttribute('src', this.sanitize(value.url)); |
| | | node.setAttribute('poster', value.poster || ''); |
| | | node.setAttribute('width', value.width || '100%'); |
| | | node.setAttribute('height', value.height || 'auto'); |
| | | node.setAttribute('controls', value.controls || 'controls'); |
| | | } else { |
| | | node.setAttribute('src', this.sanitize(value)); |
| | | } |
| | |
| | | static value(node) { |
| | | return { |
| | | url: node.getAttribute('src'), |
| | | poster: node.getAttribute('poster'), |
| | | width: node.getAttribute('width'), |
| | | height: node.getAttribute('height') |
| | | height: node.getAttribute('height'), |
| | | controls: node.getAttribute('controls'), |
| | | }; |
| | | } |
| | | |
| | |
| | | VideoBlot.className = 'ql-video'; |
| | | VideoBlot.tagName = 'video'; |
| | | |
| | | // 添加不会被 sanitize 的标记 |
| | | VideoBlot.sanitize = function(url) { |
| | | const sanitized = Link.sanitize(url); |
| | | return sanitized === Link.PROTOCOL_WHITELIST[0] ? 'about:blank' : sanitized; |
| | | }; |
| | | |
| | | export default VideoBlot; |