UNPKG

ng-cw-v12

Version:

Angular UI Component Library

102 lines 18.7 kB
import { __awaiter } from "tslib"; import { Component, Input } from '@angular/core'; import * as i0 from "@angular/core"; export class ImgEnlargementComponent { constructor(eleRef) { this.eleRef = eleRef; /** 缩略图容器大小 */ this.ncSmallSize = 300; /** 预览容器大小 */ this.ncPreviewSize = 600; /** 缩略图地址 */ this.ncSmallUrl = ''; /** 预览图地址 */ this.ncPreviewUrl = ''; } ngOnInit() { let el_EnlargeContainer = this.eleRef.nativeElement.querySelector('#el_EnlargeContainer'); let el_SmallContainer = this.eleRef.nativeElement.querySelector('#el_SmallContainer'); let el_SmallImage = this.eleRef.nativeElement.querySelector('#el_SmallImage'); let el_maskEnarge = this.eleRef.nativeElement.querySelector('#el_maskEnarge'); let el_PreviewContainer = this.eleRef.nativeElement.querySelector('#el_PreviewContainer'); let el_PreviewImage = this.eleRef.nativeElement.querySelector('#el_PreviewImage'); let smallImgWidth = 0; let smallImgHeight = 0; el_SmallImage.src = this.ncSmallUrl; el_SmallImage.onload = () => { //计算缩放比 let { width, height } = el_SmallImage; const smallScale = Math.min(this.ncSmallSize / width, this.ncSmallSize / height, 1); //计算左侧区域宽高 smallImgWidth = width * smallScale; smallImgHeight = height * smallScale; //设置左侧区域宽高 el_EnlargeContainer.style.width = el_SmallContainer.style.width = el_SmallImage.style.width = smallImgWidth + 'px'; el_EnlargeContainer.style.height = el_SmallContainer.style.height = el_SmallImage.style.height = smallImgHeight + 'px'; }; el_SmallContainer.onmouseenter = () => __awaiter(this, void 0, void 0, function* () { // 加载预览大图原始图 if (this.ncPreviewUrl) { el_PreviewImage.src = this.ncPreviewUrl; } else { el_PreviewImage.src = this.ncSmallUrl; } el_PreviewImage.onload = () => { // 显示蒙层和预览大图区域 el_maskEnarge.style.display = 'block'; el_PreviewContainer.style.display = 'block'; //计算缩放比 let { width, height } = el_PreviewImage; const previewScale = Math.min(this.ncPreviewSize / width, this.ncPreviewSize / height, 1); //计算实际展示区域 el_PreviewContainer.style.width = width * previewScale + 'px'; el_PreviewContainer.style.height = height * previewScale + 'px'; el_PreviewContainer.style.left = (smallImgWidth + 10) + 'px'; //设置蒙层的大小,使用预览大图的缩放比,才能得到准确的蒙层内容用于在右侧放大区域呈现放大效果 el_maskEnarge.style.width = smallImgWidth * previewScale + 'px'; el_maskEnarge.style.height = smallImgHeight * previewScale + 'px'; }; }); el_SmallContainer.onmouseleave = () => { el_maskEnarge.style.display = 'none'; el_PreviewContainer.style.display = 'none'; }; el_SmallContainer.onmousemove = (event) => { //获取鼠标移动的位置信息 let x = event.pageX - el_EnlargeContainer.getBoundingClientRect().left - el_maskEnarge.offsetWidth / 2; let y = event.pageY - el_EnlargeContainer.getBoundingClientRect().top - el_maskEnarge.offsetHeight / 2; //限制蒙层移动的范围,不能超出缩略小图内容区域 const xMax = el_SmallContainer.offsetWidth - el_maskEnarge.offsetWidth; x = x < 0 ? 0 : (x > xMax ? xMax : x); const yMax = el_SmallContainer.offsetHeight - el_maskEnarge.offsetHeight; y = y < 0 ? 0 : (y > yMax ? yMax : y); //更新蒙层的位置信息,实时移动蒙层元素 el_maskEnarge.style.left = x + 'px'; el_maskEnarge.style.top = y + 'px'; //右侧的预览大图等比例移动 const rate = el_PreviewImage.offsetWidth / el_SmallContainer.offsetWidth; el_PreviewImage.style.marginTop = -(rate * y) + 'px'; el_PreviewImage.style.marginLeft = -(rate * x) + 'px'; }; } } ImgEnlargementComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: ImgEnlargementComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); ImgEnlargementComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.5", type: ImgEnlargementComponent, selector: "nc-img-enlargement", inputs: { ncSmallSize: "ncSmallSize", ncPreviewSize: "ncPreviewSize", ncSmallUrl: "ncSmallUrl", ncPreviewUrl: "ncPreviewUrl" }, ngImport: i0, template: "<div id=\"el_EnlargeContainer\" class=\"enlarge\">\r\n <!--\u539F\u59CB\u5C0F\u56FE\u533A\u57DF-->\r\n <div id=\"el_SmallContainer\" class=\"small\">\r\n <img id=\"el_SmallImage\" />\r\n <div id=\"el_maskEnarge\" class=\"mask\"></div>\r\n </div>\r\n <!--\u9884\u89C8\u5927\u56FE\u533A\u57DF-->\r\n <div id=\"el_PreviewContainer\" class=\"preview\">\r\n <img id=\"el_PreviewImage\" />\r\n </div>\r\n</div>", styles: [".enlarge,.small{position:relative}.mask{position:absolute;top:0;left:0;background:rgba(56,77,145,.3);cursor:move;display:none}.preview{position:absolute;top:0;left:150px;overflow:hidden;z-index:1001}\n"] }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: ImgEnlargementComponent, decorators: [{ type: Component, args: [{ selector: 'nc-img-enlargement', templateUrl: './img-enlargement.component.html', styleUrls: ['./img-enlargement.component.less'] }] }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { ncSmallSize: [{ type: Input }], ncPreviewSize: [{ type: Input }], ncSmallUrl: [{ type: Input }], ncPreviewUrl: [{ type: Input }] } }); //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW1nLWVubGFyZ2VtZW50LmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3Byb2plY3RzL2NvbXBvbmVudHMvaW1nLWVubGFyZ2VtZW50L2ltZy1lbmxhcmdlbWVudC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi9wcm9qZWN0cy9jb21wb25lbnRzL2ltZy1lbmxhcmdlbWVudC9pbWctZW5sYXJnZW1lbnQuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IjtBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQWMsS0FBSyxFQUFVLE1BQU0sZUFBZSxDQUFDOztBQU9yRSxNQUFNLE9BQU8sdUJBQXVCO0lBVWxDLFlBQW9CLE1BQWtCO1FBQWxCLFdBQU0sR0FBTixNQUFNLENBQVk7UUFUdEMsY0FBYztRQUNMLGdCQUFXLEdBQVcsR0FBRyxDQUFDO1FBQ25DLGFBQWE7UUFDSixrQkFBYSxHQUFXLEdBQUcsQ0FBQztRQUNyQyxZQUFZO1FBQ0gsZUFBVSxHQUFXLEVBQUUsQ0FBQztRQUNqQyxZQUFZO1FBQ0gsaUJBQVksR0FBVyxFQUFFLENBQUM7SUFFTyxDQUFDO0lBRTNDLFFBQVE7UUFDTixJQUFJLG1CQUFtQixHQUFHLElBQUksQ0FBQyxNQUFNLENBQUMsYUFBYSxDQUFDLGFBQWEsQ0FBQyxzQkFBc0IsQ0FBQyxDQUFDO1FBQzFGLElBQUksaUJBQWlCLEdBQUcsSUFBSSxDQUFDLE1BQU0sQ0FBQyxhQUFhLENBQUMsYUFBYSxDQUFDLG9CQUFvQixDQUFDLENBQUM7UUFDdEYsSUFBSSxhQUFhLEdBQUcsSUFBSSxDQUFDLE1BQU0sQ0FBQyxhQUFhLENBQUMsYUFBYSxDQUFDLGdCQUFnQixDQUFDLENBQUM7UUFDOUUsSUFBSSxhQUFhLEdBQUcsSUFBSSxDQUFDLE1BQU0sQ0FBQyxhQUFhLENBQUMsYUFBYSxDQUFDLGdCQUFnQixDQUFDLENBQUM7UUFDOUUsSUFBSSxtQkFBbUIsR0FBRyxJQUFJLENBQUMsTUFB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R0FBRyxlQUFlLENBQUMsV0FBVyxHQUFHLGlCQUFpQixDQUFDLFdBQVcsQ0FBQztZQUN6RSxlQUFlLENBQUMsS0FBSyxDQUFDLFNBQVMsR0FBRyxDQUFDLENBQUMsSUFBSSxHQUFHLENBQUMsQ0FBQyxHQUFHLElBQUksQ0FBQztZQUNyRCxlQUFlLENBQUMsS0FBSyxDQUFDLFVBQVUsR0FBRyxDQUFDLENBQUMsSUFBSSxHQUFHLENBQUMsQ0FBQyxHQUFHLElBQUksQ0FBQztRQUN4RCxDQUFDLENBQUE7SUFDSCxDQUFDOztvSEE1RlUsdUJBQXVCO3dHQUF2Qix1QkFBdUIsMExDUHBDLDZiQVVNOzJGREhPLHVCQUF1QjtrQkFMbkMsU0FBUzttQkFBQztvQkFDVCxRQUFRLEVBQUUsb0JBQW9CO29CQUM5QixXQUFXLEVBQUUsa0NBQWtDO29CQUMvQyxTQUFTLEVBQUUsQ0FBQyxrQ0FBa0MsQ0FBQztpQkFDaEQ7aUdBR1UsV0FBVztzQkFBbkIsS0FBSztnQkFFRyxhQUFhO3NCQUFyQixLQUFLO2dCQUVHLFVBQVU7c0JBQWxCLEtBQUs7Z0JBRUcsWUFBWTtzQkFBcEIsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgRWxlbWVudFJlZiwgSW5wdXQsIE9uSW5pdCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5cclxuQENvbXBvbmVudCh7XHJcbiAgc2VsZWN0b3I6ICduYy1pbWctZW5sYXJnZW1lbnQnLFxyXG4gIHRlbXBsYXRlVXJsOiAnLi9pbWctZW5sYXJnZW1lbnQuY29tcG9uZW50Lmh0bWwnLFxyXG4gIHN0eWxlVXJsczogWycuL2ltZy1lbmxhcmdlbWVudC5jb21wb25lbnQubGVzcyddXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBJbWdFbmxhcmdlbWVudENvbXBvbmVudCBpbXBsZW1lbnRzIE9uSW5pdCB7XHJcbiAgLyoqIOe8qeeVpeWbvuWuueWZqOWkp+WwjyAqL1xyXG4gIEBJbnB1dCgpIG5jU21hbGxTaXplOiBudW1iZXIgPSAzMDA7XHJcbiAgLyoqIOmihOiniOWuueWZqOWkp+WwjyAqL1xyXG4gIEBJbnB1dCgpIG5jUHJldmlld1NpemU6IG51bWJlciA9IDYwMDtcclxuICAvKiog57yp55Wl5Zu+5Zyw5Z2AICovXHJcbiAgQElucHV0KCkgbmNTbWFsbFVybDogc3RyaW5nID0gJyc7XHJcbiAgLyoqIOmihOiniOWbvuWcsOWdgCAqL1xyXG4gIEBJbnB1dCgpIG5jUHJldmlld1VybDogc3RyaW5nID0gJyc7XHJcblxyXG4gIGNvbnN0cnVjdG9yKHByaXZhdGUgZWxlUmVmOiBFbGVtZW50UmVmKSB7IH1cclxuXHJcbiAgbmdPbkluaXQoKTogdm9pZCB7XHJcbiAgICBsZXQgZWxfRW5sYXJnZUNvbnRhaW5lciA9IHRoaXMuZWxlUmVmLm5hdGl2ZUVsZW1lbnQucXVlcnlTZWxlY3RvcignI2VsX0VubGFyZ2VDb250YWluZXInKTtcclxuICAgIGxldCBlbF9TbWFsbENvbnRhaW5lciA9IHRoaXMuZWxlUmVmLm5hdGl2ZUVsZW1lbnQucXVlcnlTZWxlY3RvcignI2VsX1NtYWxsQ29udGFpbmVyJyk7XHJcbiAgICBsZXQgZWxfU21hbGxJbWFnZSA9IHRoaXMuZWxlUmVmLm5hdGl2ZUVsZW1lbnQucXVlcnlTZWxlY3RvcignI2VsX1NtYWxsSW1hZ2UnKTtcclxuICAgIGxldCBlbF9tYXNrRW5hcmdlID0gdGhpcy5lbGVSZWYubmF0aXZlRWxlbWVudC5xdWVyeVNlbGVjdG9yKCcjZWxfbWFza0VuYXJnZScpO1xyXG4gICAgbGV0IGVsX1ByZXZpZXdDb250YWluZXIgPSB0aGlzLmVsZVJlZi5uYXRpdmVFbGVtZW50LnF1ZXJ5U2VsZWN0b3IoJyNlbF9QcmV2aWV3Q29udGFpbmVyJyk7XHJcbiAgICBsZXQgZWxfUHJldmlld0ltYWdlID0gdGhpcy5lbGVSZWYubmF0aXZlRWxlbWVudC5xdWVyeVNlbGVjdG9yKCcjZWxfUHJldmlld0ltYWdlJyk7XHJcblxyXG4gICAgbGV0IHNtYWxsSW1nV2lkdGg6IG51bWJlciA9IDA7XHJcbiAgICBsZXQgc21hbGxJbWdIZWlnaHQ6IG51bWJlciA9IDA7XHJcblxyXG4gICAgZWxfU21hbGxJbWFnZS5zcmMgPSB0aGlzLm5jU21hbGxVcmw7XHJcbiAgICBlbF9TbWFsbEltYWdlLm9ubG9hZCA9ICgpID0+IHtcclxuICAgICAgLy/orqHnrpfnvKnmlL7mr5RcclxuICAgICAgbGV0IHsgd2lkdGgsIGhlaWdodCB9ID0gZWxfU21hbGxJbWFnZTtcclxuICAgICAgY29uc3Qgc21hbGxTY2FsZSA9IE1hdGgubWluKHRoaXMubmNTbWFsbFNpemUgLyB3aWR0aCwgdGhpcy5uY1NtYWxsU2l6ZSAvIGhlaWdodCwgMSk7XHJcblxyXG4gICAgICAvL+iuoeeul+W3puS+p+WMuuWfn+WuvemrmFxyXG4gICAgICBzbWFsbEltZ1dpZHRoID0gd2lkdGggKiBzbWFsbFNjYWxlO1xyXG4gICAgICBzbWFsbEltZ0hlaWdodCA9IGhlaWdodCAqIHNtYWxsU2NhbGU7XHJcblxyXG4gICAgICAvL+iuvue9ruW3puS+p+WMuuWfn+WuvemrmFxyXG4gICAgICBlbF9FbmxhcmdlQ29udGFpbmVyLnN0eWxlLndpZHRoID0gZWxfU21hbGxDb250YWluZXIuc3R5bGUud2lkdGggPSBlbF9TbWFsbEltYWdlLnN0eWxlLndpZHRoID0gc21hbGxJbWdXaWR0aCArICdweCc7XHJcbiAgICAgIGVsX0VubGFyZ2VDb250YWluZXIuc3R5bGUuaGVpZ2h0ID0gZWxfU21hbGxDb250YWluZXIuc3R5bGUuaGVpZ2h0ID0gZWxfU21hbGxJbWFnZS5zdHlsZS5oZWlnaHQgPSBzbWFsbEltZ0hlaWdodCArICdweCc7XHJcbiAgICB9XHJcblxyXG5cclxuICAgIGVsX1NtYWxsQ29udGFpbmVyLm9ubW91c2VlbnRlciA9IGFzeW5jICgpID0+IHtcclxuICAgICAgLy8g5Yqg6L296aKE6KeI5aSn5Zu+5Y6f5aeL5Zu+XHJcbiAgICAgIGlmICh0aGlzLm5jUHJldmlld1VybCkge1xyXG4gICAgICAgIGVsX1ByZXZpZXdJbWFnZS5zcmMgPSB0aGlzLm5jUHJldmlld1VybDtcclxuICAgICAgfSBlbHNlIHtcclxuICAgICAgICBlbF9QcmV2aWV3SW1hZ2Uuc3JjID0gdGhpcy5uY1NtYWxsVXJsO1xyXG4gICAgICB9XHJcblxyXG4gICAgICBlbF9QcmV2aWV3SW1hZ2Uub25sb2FkID0gKCkgPT4ge1xyXG4gICAgICAgIC8vIOaYvuekuuiSmeWxguWSjOmihOiniOWkp+WbvuWMuuWfn1xyXG4gICAgICAgIGVsX21hc2tFbmFyZ2Uuc3R5bGUuZGlzcGxheSA9ICdibG9jayc7XHJcbiAgICAgICAgZWxfUHJldmlld0NvbnRhaW5lci5zdHlsZS5kaXNwbGF5ID0gJ2Jsb2NrJztcclxuXHJcbiAgICAgICAgLy/orqHnrpfnvKnmlL7mr5RcclxuICAgICAgICBsZXQgeyB3aWR0aCwgaGVpZ2h0IH0gPSBlbF9QcmV2aWV3SW1hZ2U7XHJcbiAgICAgICAgY29uc3QgcHJldmlld1NjYWxlID0gTWF0aC5taW4odGhpcy5uY1ByZXZpZXdTaXplIC8gd2lkdGgsIHRoaXMubmNQcmV2aWV3U2l6ZSAvIGhlaWdodCwgMSk7XHJcblxyXG4gICAgICAgIC8v6K6h566X5a6e6ZmF5bGV56S65Yy65Z+fXHJcbiAgICAgICAgZWxfUHJldmlld0NvbnRhaW5lci5zdHlsZS53aWR0aCA9IHdpZHRoICogcHJldmlld1NjYWxlICsgJ3B4JztcclxuICAgICAgICBlbF9QcmV2aWV3Q29udGFpbmVyLnN0eWxlLmhlaWdodCA9IGhlaWdodCAqIHByZXZpZXdTY2FsZSArICdweCc7XHJcbiAgICAgICAgZWxfUHJldmlld0NvbnRhaW5lci5zdHlsZS5sZWZ0ID0gKHNtYWxsSW1nV2lkdGggKyAxMCkgKyAncHgnO1xyXG5cclxuICAgICAgICAvL+iuvue9ruiSmeWxgueahOWkp+Wwj++8jOS9v+eUqOmihOiniOWkp+WbvueahOe8qeaUvuavlO+8jOaJjeiDveW+l+WIsOWHhuehrueahOiSmeWxguWGheWuueeUqOS6juWcqOWPs+S+p+aUvuWkp+WMuuWfn+WRiOeOsOaUvuWkp+aViOaenFxyXG4gICAgICAgIGVsX21hc2tFbmFyZ2Uuc3R5bGUud2lkdGggPSBzbWFsbEltZ1dpZHRoICogcHJldmlld1NjYWxlICsgJ3B4JztcclxuICAgICAgICBlbF9tYXNrRW5hcmdlLnN0eWxlLmhlaWdodCA9IHNtYWxsSW1nSGVpZ2h0ICogcHJldmlld1NjYWxlICsgJ3B4JztcclxuICAgICAgfVxyXG4gICAgfVxyXG5cclxuICAgIGVsX1NtYWxsQ29udGFpbmVyLm9ubW91c2VsZWF2ZSA9ICgpID0+IHtcclxuICAgICAgZWxfbWFza0VuYXJnZS5zdHlsZS5kaXNwbGF5ID0gJ25vbmUnO1xyXG4gICAgICBlbF9QcmV2aWV3Q29udGFpbmVyLnN0eWxlLmRpc3BsYXkgPSAnbm9uZSc7XHJcbiAgICB9XHJcblxyXG4gICAgZWxfU21hbGxDb250YWluZXIub25tb3VzZW1vdmUgPSAoZXZlbnQ6IGFueSkgPT4ge1xyXG4gICAgICAvL+iOt+WPlum8oOagh+enu+WKqOeahOS9jee9ruS/oeaBr1xyXG4gICAgICBsZXQgeCA9IGV2ZW50LnBhZ2VYIC0gZWxfRW5sYXJnZUNvbnRhaW5lci5nZXRCb3VuZGluZ0NsaWVudFJlY3QoKS5sZWZ0IC0gZWxfbWFza0VuYXJnZS5vZmZzZXRXaWR0aCAvIDI7XHJcbiAgICAgIGxldCB5ID0gZXZlbnQucGFnZVkgLSBlbF9FbmxhcmdlQ29udGFpbmVyLmdldEJvdW5kaW5nQ2xpZW50UmVjdCgpLnRvcCAtIGVsX21hc2tFbmFyZ2Uub2Zmc2V0SGVpZ2h0IC8gMjtcclxuXHJcbiAgICAgIC8v6ZmQ5Yi26JKZ5bGC56e75Yqo55qE6IyD5Zu077yM5LiN6IO96LaF5Ye657yp55Wl5bCP5Zu+5YaF5a655Yy65Z+fXHJcbiAgICAgIGNvbnN0IHhNYXggPSBlbF9TbWFsbENvbnRhaW5lci5vZmZzZXRXaWR0aCAtIGVsX21hc2tFbmFyZ2Uub2Zmc2V0V2lkdGg7XHJcbiAgICAgIHggPSB4IDwgMCA/IDAgOiAoeCA+IHhNYXggPyB4TWF4IDogeCk7XHJcbiAgICAgIGNvbnN0IHlNYXggPSBlbF9TbWFsbENvbnRhaW5lci5vZmZzZXRIZWlnaHQgLSBlbF9tYXNrRW5hcmdlLm9mZnNldEhlaWdodDtcclxuICAgICAgeSA9IHkgPCAwID8gMCA6ICh5ID4geU1heCA/IHlNYXggOiB5KTtcclxuXHJcbiAgICAgIC8v5pu05paw6JKZ5bGC55qE5L2N572u5L+h5oGv77yM5a6e5pe256e75Yqo6JKZ5bGC5YWD57SgXHJcbiAgICAgIGVsX21hc2tFbmFyZ2Uuc3R5bGUubGVmdCA9IHggKyAncHgnO1xyXG4gICAgICBlbF9tYXNrRW5hcmdlLnN0eWxlLnRvcCA9IHkgKyAncHgnO1xyXG5cclxuICAgICAgLy/lj7PkvqfnmoTpooTop4jlpKflm77nrYnmr5Tkvovnp7vliqhcclxuICAgICAgY29uc3QgcmF0ZSA9IGVsX1ByZXZpZXdJbWFnZS5vZmZzZXRXaWR0aCAvIGVsX1NtYWxsQ29udGFpbmVyLm9mZnNldFdpZHRoO1xyXG4gICAgICBlbF9QcmV2aWV3SW1hZ2Uuc3R5bGUubWFyZ2luVG9wID0gLShyYXRlICogeSkgKyAncHgnO1xyXG4gICAgICBlbF9QcmV2aWV3SW1hZ2Uuc3R5bGUubWFyZ2luTGVmdCA9IC0ocmF0ZSAqIHgpICsgJ3B4JztcclxuICAgIH1cclxuICB9XHJcblxyXG59XHJcbiIsIjxkaXYgaWQ9XCJlbF9FbmxhcmdlQ29udGFpbmVyXCIgY2xhc3M9XCJlbmxhcmdlXCI+XHJcbiAgICA8IS0t5Y6f5aeL5bCP5Zu+5Yy65Z+fLS0+XHJcbiAgICA8ZGl2IGlkPVwiZWxfU21hbGxDb250YWluZXJcIiBjbGFzcz1cInNtYWxsXCI+XHJcbiAgICAgICAgPGltZyBpZD1cImVsX1NtYWxsSW1hZ2VcIiAvPlxyXG4gICAgICAgIDxkaXYgaWQ9XCJlbF9tYXNrRW5hcmdlXCIgY2xhc3M9XCJtYXNrXCI+PC9kaXY+XHJcbiAgICA8L2Rpdj5cclxuICAgIDwhLS3pooTop4jlpKflm77ljLrln58tLT5cclxuICAgIDxkaXYgaWQ9XCJlbF9QcmV2aWV3Q29udGFpbmVyXCIgY2xhc3M9XCJwcmV2aWV3XCI+XHJcbiAgICAgICAgPGltZyBpZD1cImVsX1ByZXZpZXdJbWFnZVwiIC8+XHJcbiAgICA8L2Rpdj5cclxuPC9kaXY+Il19