UNPKG

ng-cw-v12

Version:

Angular UI Component Library

100 lines 15.9 kB
import { Component, Input, ViewChild } from '@angular/core'; import * as i0 from "@angular/core"; export class VideoTextComponent { constructor() { /** 文本内容 */ this.ncText = ''; /** 视频源 */ this.ncSrc = ''; this.dimensions = { width: 0, height: 0 }; this.isReady = false; this.textStyle = {}; this.maskId = `aurora-mask-${Math.random().toString(36).substring(2, 11)}`; } ngOnChanges(changes) { if (changes['ncText'] && !changes['ncText'].firstChange) { this.start(); } } ngAfterViewInit() { this.start(); } start() { setTimeout(() => { this.computeTextStyles(); this.updateDimensions(); }); } computeTextStyles() { var _a; if ((_a = this.textContentRef) === null || _a === void 0 ? void 0 : _a.nativeElement) { const computedStyle = getComputedStyle(this.textContentRef.nativeElement); this.textStyle = this.extractTextStyles(computedStyle); } } updateDimensions() { var _a; if ((_a = this.svgTextRef) === null || _a === void 0 ? void 0 : _a.nativeElement) { try { const bbox = this.svgTextRef.nativeElement.getBBox(); this.dimensions = { width: Math.max(1, bbox.width), height: Math.max(1, bbox.height) }; this.isReady = true; } catch (e) { console.error('获取 SVG 元素尺寸时出错:', e); } } } getStyleString() { let styleStr = ''; for (const [key, value] of Object.entries(this.textStyle)) { if (value) { // 将驼峰命名转换为连字符命名 const cssKey = key.replace(/([A-Z])/g, '-$1').toLowerCase(); styleStr += `${cssKey}:${value};`; } } return styleStr; } // 提取文本相关样式的辅助方法 extractTextStyles(computedStyle) { return { fontSize: computedStyle.fontSize, fontFamily: computedStyle.fontFamily, fontWeight: computedStyle.fontWeight, fontStyle: computedStyle.fontStyle, letterSpacing: computedStyle.letterSpacing, lineHeight: computedStyle.lineHeight, textTransform: computedStyle.textTransform, fontVariant: computedStyle.fontVariant, fontStretch: computedStyle.fontStretch, fontFeatureSettings: computedStyle.fontFeatureSettings, textDecoration: computedStyle.textDecoration, textShadow: computedStyle.textShadow, }; } } VideoTextComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: VideoTextComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); VideoTextComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.5", type: VideoTextComponent, selector: "nc-video-text", inputs: { ncText: "ncText", ncSrc: "ncSrc" }, viewQueries: [{ propertyName: "textContentRef", first: true, predicate: ["textContent"], descendants: true }, { propertyName: "svgTextRef", first: true, predicate: ["svgText"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<span class=\"video-text relative inline-block align-middle\"\r\n [style.width]=\"dimensions.width ? dimensions.width + 'px' : 'auto'\"\r\n [style.height]=\"dimensions.height ? dimensions.height + 'px' : 'auto'\">\r\n\r\n <!-- \u9690\u85CF\u7684\u6587\u672C\u7528\u4E8ESEO -->\r\n <span class=\"sr-only\">\r\n {{ncText}}\r\n </span>\r\n\r\n <!-- \u89C6\u89C9\u5360\u4F4D\u7B26 -->\r\n <span #textContent style=\"opacity: 0;display: inline-block; white-space: nowrap;\"\r\n [style.position]=\"isReady ? 'absolute' : 'relative'\" aria-hidden=\"true\">\r\n {{ncText}}\r\n </span>\r\n\r\n <div class=\"absolute inset-0\" [style.opacity]=\"isReady ? 1 : 0\" style=\"transition: opacity 0.2s ease-in;\"\r\n aria-hidden=\"true\">\r\n\r\n <svg [attr.width]=\"dimensions.width\" [attr.height]=\"dimensions.height\" class=\"absolute inset-0\">\r\n <defs>\r\n <clipPath [attr.id]=\"maskId\">\r\n <text #svgText x=\"50%\" y=\"50%\" dominant-baseline=\"middle\" text-anchor=\"middle\"\r\n [attr.style]=\"getStyleString()\">{{ncText}}</text>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n\r\n <video class=\"w-full h-full object-cover\" preload=\"auto\" autoPlay muted loop [style.clip-path]=\"'url(#' + maskId + ')'\"\r\n [style.-webkit-clip-path]=\"'url(#' + maskId + ')'\">\r\n <source [src]=\"ncSrc\">\r\n \u60A8\u7684\u6D4F\u89C8\u5668\u4E0D\u652F\u6301\u89C6\u9891\u6807\u7B7E\u3002\r\n </video>\r\n </div>\r\n</span>", styles: [":host{display:inline-block}.relative{position:relative}.absolute{position:absolute}.inset-0{top:0;right:0;bottom:0;left:0}.inline-block{display:inline-block}.align-middle{vertical-align:middle}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.h-full{height:100%}.w-full{width:100%}.object-cover{object-fit:cover}\n"] }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: VideoTextComponent, decorators: [{ type: Component, args: [{ selector: 'nc-video-text', templateUrl: './video-text.component.html', styleUrls: ['./video-text.component.less'] }] }], ctorParameters: function () { return []; }, propDecorators: { ncText: [{ type: Input }], ncSrc: [{ type: Input }], textContentRef: [{ type: ViewChild, args: ['textContent'] }], svgTextRef: [{ type: ViewChild, args: ['svgText'] }] } }); //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidmlkZW8tdGV4dC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9wcm9qZWN0cy9jb21wb25lbnRzL3ZpZGVvLXRleHQvdmlkZW8tdGV4dC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi9wcm9qZWN0cy9jb21wb25lbnRzL3ZpZGVvLXRleHQvdmlkZW8tdGV4dC5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBYyxTQUFTLEVBQTJDLE1BQU0sZUFBZSxDQUFDOztBQU9qSCxNQUFNLE9BQU8sa0JBQWtCO0lBYzdCO1FBYkEsV0FBVztRQUNGLFdBQU0sR0FBVyxFQUFFLENBQUM7UUFDN0IsVUFBVTtRQUNELFVBQUssR0FBVyxFQUFFLENBQUM7UUFLNUIsZUFBVSxHQUFHLEVBQUUsS0FBSyxFQUFFLENBQUMsRUFBRSxNQUFNLEVBQUUsQ0FBQyxFQUFFLENBQUM7UUFDckMsWUFBTyxHQUFZLEtBQUssQ0FBQztRQUN6QixjQUFTLEdBQWlDLEVBQUUsQ0FBQztRQUM3QyxXQUFNLEdBQVcsZUFBZSxJQUFJLENBQUMsTUFBTSxFQUFFLENBQUMsUUFBUSxDQUFDLEVBQUUsQ0FBQyxDQUFDLFNBQVMsQ0FBQyxDQUFDLEVBQUUsRUFBRSxDQUFDLEVBQUUsQ0FBQztJQUU5RCxDQUFDO0lBRWpCLFdBQVcsQ0FBQyxPQUFzQjtRQUNoQyxJQUFJLE9BQU8sQ0FBQyxRQUFRLENBQUMsSUFBSSxDQUFDLE9BQU8sQ0FBQyxRQUFRLENBQUMsQ0FBQyxXQUFXLEVBQUU7WUFDdkQsSUFBSSxDQUFDLEtBQUssRUFBRSxDQUFDO1NBQ2Q7SUFDSCxDQUFDO0lBRUQsZUFBZTtRQUNiLElBQUksQ0FBQyxLQUFLLEVBQUUsQ0FBQztJQUNmLENBQUM7SUFFTyxLQUFLO1FBQ1gsVUFBVSxDQUFDLEdBQUcsRUFBRTtZQUNkLElBQUksQ0FBQyxpQkFBaUIsRUFBRSxDQUFD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Q29tcG9uZW50LCBJbnB1dCwgRWxlbWVudFJlZiwgVmlld0NoaWxkLCBTaW1wbGVDaGFuZ2VzLCBPbkNoYW5nZXMsIEFmdGVyVmlld0luaXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuXHJcbkBDb21wb25lbnQoe1xyXG4gIHNlbGVjdG9yOiAnbmMtdmlkZW8tdGV4dCcsXHJcbiAgdGVtcGxhdGVVcmw6ICcuL3ZpZGVvLXRleHQuY29tcG9uZW50Lmh0bWwnLFxyXG4gIHN0eWxlVXJsczogWycuL3ZpZGVvLXRleHQuY29tcG9uZW50Lmxlc3MnXVxyXG59KVxyXG5leHBvcnQgY2xhc3MgVmlkZW9UZXh0Q29tcG9uZW50IGltcGxlbWVudHMgT25DaGFuZ2VzLCBBZnRlclZpZXdJbml0IHtcclxuICAvKiog5paH5pys5YaF5a65ICovXHJcbiAgQElucHV0KCkgbmNUZXh0OiBzdHJpbmcgPSAnJztcclxuICAvKiog6KeG6aKR5rqQICovXHJcbiAgQElucHV0KCkgbmNTcmM6IHN0cmluZyA9ICcnO1xyXG5cclxuICBAVmlld0NoaWxkKCd0ZXh0Q29udGVudCcpIHRleHRDb250ZW50UmVmITogRWxlbWVudFJlZjxIVE1MU3BhbkVsZW1lbnQ+O1xyXG4gIEBWaWV3Q2hpbGQoJ3N2Z1RleHQnKSBzdmdUZXh0UmVmITogRWxlbWVudFJlZjxTVkdUZXh0RWxlbWVudD47XHJcblxyXG4gIGRpbWVuc2lvbnMgPSB7IHdpZHRoOiAwLCBoZWlnaHQ6IDAgfTtcclxuICBpc1JlYWR5OiBib29sZWFuID0gZmFsc2U7XHJcbiAgdGV4dFN0eWxlOiBQYXJ0aWFsPENTU1N0eWxlRGVjbGFyYXRpb24+ID0ge307XHJcbiAgbWFza0lkOiBzdHJpbmcgPSBgYXVyb3JhLW1hc2stJHtNYXRoLnJhbmRvbSgpLnRvU3RyaW5nKDM2KS5zdWJzdHJpbmcoMiwgMTEpfWA7XHJcblxyXG4gIGNvbnN0cnVjdG9yKCkgeyB9XHJcblxyXG4gIG5nT25DaGFuZ2VzKGNoYW5nZXM6IFNpbXBsZUNoYW5nZXMpOiB2b2lkIHtcclxuICAgIGlmIChjaGFuZ2VzWyduY1RleHQnXSAmJiAhY2hhbmdlc1snbmNUZXh0J10uZmlyc3RDaGFuZ2UpIHtcclxuICAgICAgdGhpcy5zdGFydCgpO1xyXG4gICAgfVxyXG4gIH1cclxuXHJcbiAgbmdBZnRlclZpZXdJbml0KCk6IHZvaWQge1xyXG4gICAgdGhpcy5zdGFydCgpO1xyXG4gIH1cclxuXHJcbiAgcHJpdmF0ZSBzdGFydCgpOiB2b2lkIHtcclxuICAgIHNldFRpbWVvdXQoKCkgPT4ge1xyXG4gICAgICB0aGlzLmNvbXB1dGVUZXh0U3R5bGVzKCk7XHJcbiAgICAgIHRoaXMudXBkYXRlRGltZW5zaW9ucygpO1xyXG4gICAgfSlcclxuICB9XHJcblxyXG5cclxuICBwcml2YXRlIGNvbXB1dGVUZXh0U3R5bGVzKCk6IHZvaWQge1xyXG4gICAgaWYgKHRoaXMudGV4dENvbnRlbnRSZWY/Lm5hdGl2ZUVsZW1lbnQpIHtcclxuICAgICAgY29uc3QgY29tcHV0ZWRTdHlsZSA9IGdldENvbXB1dGVkU3R5bGUodGhpcy50ZXh0Q29udGVudFJlZi5uYXRpdmVFbGVtZW50KTtcclxuICAgICAgdGhpcy50ZXh0U3R5bGUgPSB0aGlzLmV4dHJhY3RUZXh0U3R5bGVzKGNvbXB1dGVkU3R5bGUpO1xyXG4gICAgfVxyXG4gIH1cclxuXHJcbiAgcHJpdmF0ZSB1cGRhdGVEaW1lbnNpb25zKCk6IHZvaWQge1xyXG4gICAgaWYgKHRoaXMuc3ZnVGV4dFJlZj8ubmF0aXZlRWxlbWVudCkge1xyXG4gICAgICB0cnkge1xyXG4gICAgICAgIGNvbnN0IGJib3ggPSB0aGlzLnN2Z1RleHRSZWYubmF0aXZlRWxlbWVudC5nZXRCQm94KCk7XHJcbiAgICAgICAgdGhpcy5kaW1lbnNpb25zID0ge1xyXG4gICAgICAgICAgd2lkdGg6IE1hdGgubWF4KDEsIGJib3gud2lkdGgpLFxyXG4gICAgICAgICAgaGVpZ2h0OiBNYXRoLm1heCgxLCBiYm94LmhlaWdodClcclxuICAgICAgICB9O1xyXG4gICAgICAgIHRoaXMuaXNSZWFkeSA9IHRydWU7XHJcbiAgICAgIH0gY2F0Y2ggKGUpIHtcclxuICAgICAgICBjb25zb2xlLmVycm9yKCfojrflj5YgU1ZHIOWFg+e0oOWwuuWvuOaXtuWHuumUmTonLCBlKTtcclxuICAgICAgfVxyXG4gICAgfVxyXG4gIH1cclxuXHJcbiAgZ2V0U3R5bGVTdHJpbmcoKTogc3RyaW5nIHtcclxuICAgIGxldCBzdHlsZVN0ciA9ICcnO1xyXG4gICAgZm9yIChjb25zdCBba2V5LCB2YWx1ZV0gb2YgT2JqZWN0LmVudHJpZXModGhpcy50ZXh0U3R5bGUpKSB7XHJcbiAgICAgIGlmICh2YWx1ZSkge1xyXG4gICAgICAgIC8vIOWwhumpvOWzsOWRveWQjei9rOaNouS4uui/nuWtl+espuWRveWQjVxyXG4gICAgICAgIGNvbnN0IGNzc0tleSA9IGtleS5yZXBsYWNlKC8oW0EtWl0pL2csICctJDEnKS50b0xvd2VyQ2FzZSgpO1xyXG4gICAgICAgIHN0eWxlU3RyICs9IGAke2Nzc0tleX06JHt2YWx1ZX07YDtcclxuICAgICAgfVxyXG4gICAgfVxyXG4gICAgcmV0dXJuIHN0eWxlU3RyO1xyXG4gIH1cclxuXHJcbiAgLy8g5o+Q5Y+W5paH5pys55u45YWz5qC35byP55qE6L6F5Yqp5pa55rOVXHJcbiAgcHJpdmF0ZSBleHRyYWN0VGV4dFN0eWxlcyhjb21wdXRlZFN0eWxlOiBDU1NTdHlsZURlY2xhcmF0aW9uKTogUGFydGlhbDxDU1NTdHlsZURlY2xhcmF0aW9uPiB7XHJcbiAgICByZXR1cm4ge1xyXG4gICAgICBmb250U2l6ZTogY29tcHV0ZWRTdHlsZS5mb250U2l6ZSxcclxuICAgICAgZm9udEZhbWlseTogY29tcHV0ZWRTdHlsZS5mb250RmFtaWx5LFxyXG4gICAgICBmb250V2VpZ2h0OiBjb21wdXRlZFN0eWxlLmZvbnRXZWlnaHQsXHJcbiAgICAgIGZvbnRTdHlsZTogY29tcHV0ZWRTdHlsZS5mb250U3R5bGUsXHJcbiAgICAgIGxldHRlclNwYWNpbmc6IGNvbXB1dGVkU3R5bGUubGV0dGVyU3BhY2luZyxcclxuICAgICAgbGluZUhlaWdodDogY29tcHV0ZWRTdHlsZS5saW5lSGVpZ2h0LFxyXG4gICAgICB0ZXh0VHJhbnNmb3JtOiBjb21wdXRlZFN0eWxlLnRleHRUcmFuc2Zvcm0sXHJcbiAgICAgIGZvbnRWYXJpYW50OiBjb21wdXRlZFN0eWxlLmZvbnRWYXJpYW50LFxyXG4gICAgICBmb250U3RyZXRjaDogY29tcHV0ZWRTdHlsZS5mb250U3RyZXRjaCxcclxuICAgICAgZm9udEZlYXR1cmVTZXR0aW5nczogY29tcHV0ZWRTdHlsZS5mb250RmVhdHVyZVNldHRpbmdzLFxyXG4gICAgICB0ZXh0RGVjb3JhdGlvbjogY29tcHV0ZWRTdHlsZS50ZXh0RGVjb3JhdGlvbixcclxuICAgICAgdGV4dFNoYWRvdzogY29tcHV0ZWRTdHlsZS50ZXh0U2hhZG93LFxyXG4gICAgfTtcclxuICB9XHJcbn1cclxuIiwiPHNwYW4gY2xhc3M9XCJ2aWRlby10ZXh0IHJlbGF0aXZlIGlubGluZS1ibG9jayBhbGlnbi1taWRkbGVcIlxyXG4gIFtzdHlsZS53aWR0aF09XCJkaW1lbnNpb25zLndpZHRoID8gZGltZW5zaW9ucy53aWR0aCArICdweCcgOiAnYXV0bydcIlxyXG4gIFtzdHlsZS5oZWlnaHRdPVwiZGltZW5zaW9ucy5oZWlnaHQgPyBkaW1lbnNpb25zLmhlaWdodCArICdweCcgOiAnYXV0bydcIj5cclxuXHJcbiAgPCEtLSDpmpDol4/nmoTmlofmnKznlKjkuo5TRU8gLS0+XHJcbiAgPHNwYW4gY2xhc3M9XCJzci1vbmx5XCI+XHJcbiAgICB7e25jVGV4dH19XHJcbiAgPC9zcGFuPlxyXG5cclxuICA8IS0tIOinhuinieWNoOS9jeespiAtLT5cclxuICA8c3BhbiAjdGV4dENvbnRlbnQgc3R5bGU9XCJvcGFjaXR5OiAwO2Rpc3BsYXk6IGlubGluZS1ibG9jazsgd2hpdGUtc3BhY2U6IG5vd3JhcDtcIlxyXG4gICAgW3N0eWxlLnBvc2l0aW9uXT1cImlzUmVhZHkgPyAnYWJzb2x1dGUnIDogJ3JlbGF0aXZlJ1wiIGFyaWEtaGlkZGVuPVwidHJ1ZVwiPlxyXG4gICAge3tuY1RleHR9fVxyXG4gIDwvc3Bhbj5cclxuXHJcbiAgPGRpdiBjbGFzcz1cImFic29sdXRlIGluc2V0LTBcIiBbc3R5bGUub3BhY2l0eV09XCJpc1JlYWR5ID8gMSA6IDBcIiBzdHlsZT1cInRyYW5zaXRpb246IG9wYWNpdHkgMC4ycyBlYXNlLWluO1wiXHJcbiAgICBhcmlhLWhpZGRlbj1cInRydWVcIj5cclxuXHJcbiAgICA8c3ZnIFthdHRyLndpZHRoXT1cImRpbWVuc2lvbnMud2lkdGhcIiBbYXR0ci5oZWlnaHRdPVwiZGltZW5zaW9ucy5oZWlnaHRcIiBjbGFzcz1cImFic29sdXRlIGluc2V0LTBcIj5cclxuICAgICAgPGRlZnM+XHJcbiAgICAgICAgPGNsaXBQYXRoIFthdHRyLmlkXT1cIm1hc2tJZFwiPlxyXG4gICAgICAgICAgPHRleHQgI3N2Z1RleHQgeD1cIjUwJVwiIHk9XCI1MCVcIiBkb21pbmFudC1iYXNlbGluZT1cIm1pZGRsZVwiIHRleHQtYW5jaG9yPVwibWlkZGxlXCJcclxuICAgICAgICAgICAgW2F0dHIuc3R5bGVdPVwiZ2V0U3R5bGVTdHJpbmcoKVwiPnt7bmNUZXh0fX08L3RleHQ+XHJcbiAgICAgICAgPC9jbGlwUGF0aD5cclxuICAgICAgPC9kZWZzPlxyXG4gICAgPC9zdmc+XHJcblxyXG4gICAgPHZpZGVvIGNsYXNzPVwidy1mdWxsIGgtZnVsbCBvYmplY3QtY292ZXJcIiBwcmVsb2FkPVwiYXV0b1wiIGF1dG9QbGF5IG11dGVkIGxvb3AgW3N0eWxlLmNsaXAtcGF0aF09XCIndXJsKCMnICsgbWFza0lkICsgJyknXCJcclxuICAgICAgW3N0eWxlLi13ZWJraXQtY2xpcC1wYXRoXT1cIid1cmwoIycgKyBtYXNrSWQgKyAnKSdcIj5cclxuICAgICAgPHNvdXJjZSBbc3JjXT1cIm5jU3JjXCI+XHJcbiAgICAgIOaCqOeahOa1j+iniOWZqOS4jeaUr+aMgeinhumikeagh+etvuOAglxyXG4gICAgPC92aWRlbz5cclxuICA8L2Rpdj5cclxuPC9zcGFuPiJdfQ==