@hmcts/annotation-ui-lib
Version:
PDF Viewer and ability to highlight text with and comment tracking
81 lines • 6.23 kB
JavaScript
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
import { Component, Input, Renderer2, ViewChild, ElementRef } from '@angular/core';
import { EmLoggerService } from '../../logging/em-logger.service';
export class ImageViewerComponent {
/**
* @param {?} renderer
* @param {?} log
*/
constructor(renderer, log) {
this.renderer = renderer;
this.log = log;
this.log.setClass('ImageViewerComponent');
}
/**
* @return {?}
*/
ngOnInit() {
this.rotation = 0;
}
/**
* @return {?}
*/
onRotateClockwise() {
this.rotation = this.rotation + 90;
this.rotateImage();
}
/**
* @return {?}
*/
rotateImage() {
this.log.info('rotating to-' + this.rotation + 'degrees');
/** @type {?} */
const styles = ['transform', '-ms-transform', '-o-transform', '-moz-transform', '-webkit-transform'];
for (const style of styles) {
this.renderer.setStyle(this.img.nativeElement, style, `rotate(${this.rotation}deg)`);
}
}
}
ImageViewerComponent.decorators = [
{ type: Component, args: [{
selector: 'app-image-viewer',
template: "\n <div id=\"viewer-wrapper\">\n <button\n *ngIf=\"rotate\"\n class=\"govuk-button hmcts hmcts-button--secondary rotate\"\n title=\"Clockwise\"\n role=\"button\"\n (click)=\"onRotateClockwise()\">Rotate</button>\n\n <img #img *ngIf=\"url\" data-hook=\"dm.viewer.img\" [src]=\"url\" />\n </div>",
styles: ["#viewer-wrapper{position:relative;width:100%}.rotate{z-index:1;position:absolute;right:0;background-repeat:no-repeat;background-size:14px 14px;background-position:3px 50%;padding-left:25px;background-image:url(/assets/images/viewer-rotate.svg)}.anti{right:24px;-webkit-transform:scaleX(-1);transform:scaleX(-1)}img{width:100%}"]
}] }
];
ImageViewerComponent.ctorParameters = () => [
{ type: Renderer2 },
{ type: EmLoggerService }
];
ImageViewerComponent.propDecorators = {
url: [{ type: Input }],
originalUrl: [{ type: Input }],
rotate: [{ type: Input }],
img: [{ type: ViewChild, args: ['img',] }]
};
if (false) {
/** @type {?} */
ImageViewerComponent.prototype.url;
/** @type {?} */
ImageViewerComponent.prototype.originalUrl;
/** @type {?} */
ImageViewerComponent.prototype.rotate;
/** @type {?} */
ImageViewerComponent.prototype.img;
/** @type {?} */
ImageViewerComponent.prototype.rotation;
/**
* @type {?}
* @private
*/
ImageViewerComponent.prototype.renderer;
/**
* @type {?}
* @private
*/
ImageViewerComponent.prototype.log;
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW1hZ2Utdmlld2VyLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiJuZzovL0BobWN0cy9hbm5vdGF0aW9uLXVpLWxpYi8iLCJzb3VyY2VzIjpbImxpYi92aWV3ZXJzL2ltYWdlLXZpZXdlci9pbWFnZS12aWV3ZXIuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7QUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBVSxTQUFTLEVBQUUsU0FBUyxFQUFFLFVBQVUsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUMzRixPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0saUNBQWlDLENBQUM7QUFPbEUsTUFBTTs7Ozs7SUFTRixZQUFvQixRQUFtQixFQUNuQixHQUFvQjtRQURwQixhQUFRLEdBQVIsUUFBUSxDQUFXO1FBQ25CLFFBQUcsR0FBSCxHQUFHLENBQWlCO1FBQ3BDLElBQUksQ0FBQyxHQUFHLENBQUMsUUFBUSxDQUFDLHNCQUFzQixDQUFDLENBQUM7SUFDOUMsQ0FBQzs7OztJQUVELFFBQVE7UUFDSixJQUFJLENBQUMsUUFBUSxHQUFHLENBQUMsQ0FBQztJQUN0QixDQUFDOzs7O0lBRUQsaUJBQWlCO1FBQ2IsSUFBSSxDQUFDLFFBQVEsR0FBRyxJQUFJLENBQUMsUUFBUSxHQUFHLEVBQUUsQ0FBQztRQUNuQyxJQUFJLENBQUMsV0FBVyxFQUFFLENBQUM7SUFDdkIsQ0FBQzs7OztJQUVELFdBQVc7UUFDUCxJQUFJLENBQUMsR0FBRyxDQUFDLElBQUksQ0FBQyxjQUFjLEdBQUcsSUFBSSxDQUFDLFFBQVEsR0FBRyxTQUFTLENBQUMsQ0FBQzs7Y0FDcEQsTUFBTSxHQUFHLENBQUMsV0FBVyxFQUFFLGVBQWUsRUFBRSxjQUFjLEVBQUUsZ0JBQWdCLEVBQUUsbUJBQW1CLENBQUM7UUFDcEcsR0FBRyxDQUFDLENBQUMsTUFBTSxLQUFLLElBQUksTUFBTSxDQUFDLENBQUMsQ0FBQztZQUN6QixJQUFJLENBQUMsUUFBUSxDQUFDLFFBQVEsQ0FBQyxJQUFJLENBQUMsR0FBRyxDQUFDLGFBQWEsRUFBRSxLQUFLLEVBQUUsVUFBVSxJQUFJLENBQUMsUUFBUSxNQUFNLENBQUMsQ0FBQztRQUN6RixDQUFDO0lBQ0wsQ0FBQzs7O1lBbENKLFNBQVMsU0FBQztnQkFDUCxRQUFRLEVBQUUsa0JBQWtCO2dCQUM1QixtWEFBNEM7O2FBRS9DOzs7WUFQa0MsU0FBUztZQUNuQyxlQUFlOzs7a0JBU25CLEtBQUs7MEJBQ0wsS0FBSztxQkFDTCxLQUFLO2tCQUVMLFNBQVMsU0FBQyxLQUFLOzs7O0lBSmhCLG1DQUFxQjs7SUFDckIsMkNBQTZCOztJQUM3QixzQ0FBeUI7O0lBRXpCLG1DQUFrQzs7SUFDbEMsd0NBQWlCOzs7OztJQUVMLHdDQUEyQjs7Ozs7SUFDM0IsbUNBQTRCIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBJbnB1dCwgT25Jbml0LCBSZW5kZXJlcjIsIFZpZXdDaGlsZCwgRWxlbWVudFJlZiB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgRW1Mb2dnZXJTZXJ2aWNlIH0gZnJvbSAnLi4vLi4vbG9nZ2luZy9lbS1sb2dnZXIuc2VydmljZSc7XG5cbkBDb21wb25lbnQoe1xuICAgIHNlbGVjdG9yOiAnYXBwLWltYWdlLXZpZXdlcicsXG4gICAgdGVtcGxhdGVVcmw6ICcuL2ltYWdlLXZpZXdlci5jb21wb25lbnQuaHRtbCcsXG4gICAgc3R5bGVVcmxzOiBbJy4vaW1hZ2Utdmlld2VyLmNvbXBvbmVudC5zY3NzJ10sXG59KVxuZXhwb3J0IGNsYXNzIEltYWdlVmlld2VyQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0IHtcbiAgICBcbiAgICBASW5wdXQoKSB1cmw6IHN0cmluZztcbiAgICBASW5wdXQoKSBvcmlnaW5hbFVybDogc3RyaW5nO1xuICAgIEBJbnB1dCgpIHJvdGF0ZTogYm9vbGVhbjtcblxuICAgIEBWaWV3Q2hpbGQoJ2ltZycpIGltZzogRWxlbWVudFJlZjtcbiAgICByb3RhdGlvbjogbnVtYmVyO1xuXG4gICAgY29uc3RydWN0b3IocHJpdmF0ZSByZW5kZXJlcjogUmVuZGVyZXIyLFxuICAgICAgICAgICAgICAgIHByaXZhdGUgbG9nOiBFbUxvZ2dlclNlcnZpY2UpIHtcbiAgICAgICAgdGhpcy5sb2cuc2V0Q2xhc3MoJ0ltYWdlVmlld2VyQ29tcG9uZW50Jyk7XG4gICAgfVxuXG4gICAgbmdPbkluaXQoKSB7XG4gICAgICAgIHRoaXMucm90YXRpb24gPSAwO1xuICAgIH1cblxuICAgIG9uUm90YXRlQ2xvY2t3aXNlKCkge1xuICAgICAgICB0aGlzLnJvdGF0aW9uID0gdGhpcy5yb3RhdGlvbiArIDkwO1xuICAgICAgICB0aGlzLnJvdGF0ZUltYWdlKCk7XG4gICAgfVxuXG4gICAgcm90YXRlSW1hZ2UoKSB7XG4gICAgICAgIHRoaXMubG9nLmluZm8oJ3JvdGF0aW5nIHRvLScgKyB0aGlzLnJvdGF0aW9uICsgJ2RlZ3JlZXMnKTtcbiAgICAgICAgY29uc3Qgc3R5bGVzID0gWyd0cmFuc2Zvcm0nLCAnLW1zLXRyYW5zZm9ybScsICctby10cmFuc2Zvcm0nLCAnLW1vei10cmFuc2Zvcm0nLCAnLXdlYmtpdC10cmFuc2Zvcm0nXTtcbiAgICAgICAgZm9yIChjb25zdCBzdHlsZSBvZiBzdHlsZXMpIHtcbiAgICAgICAgICAgIHRoaXMucmVuZGVyZXIuc2V0U3R5bGUodGhpcy5pbWcubmF0aXZlRWxlbWVudCwgc3R5bGUsIGByb3RhdGUoJHt0aGlzLnJvdGF0aW9ufWRlZylgKTtcbiAgICAgICAgfVxuICAgIH1cbn1cbiJdfQ==