ngx-extended-pdf-viewer/esm2020/lib/toolbar/pdf-zoom-toolbar/pdf-zoom-dropdown/pdf-zoom-dropdown.component.mjs

Embedding PDF files in your Angular application. Highly configurable viewer including the toolbar, sidebar, and all the features you're used to.

import { Component, Input, ViewChild } from '@angular/core';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
import * as i2 from "@angular/forms";
export class PdfZoomDropdownComponent {
    constructor(element) {
        this.element = element;
        this._zoomLevels = [];
    }
    set zoomLevels(levels) {
        this._zoomLevels = levels.map((l) => this.valueToZoomLevel(l));
    }
    valueToZoomLevel(value) {
        if (value.toString().endsWith('%')) {
            value = value.toString().replace('%', '');
            value = Number(value) / 100;
        }
        const numericalValue = Number(value);
        if (!numericalValue) {
            const v = String(value);
            return {
                id: this.snakeToCamel(value + 'Option'),
                value: v,
                dataL10nId: 'page_scale_' + v.replace('page-', ''),
                dataL10nArgs: undefined,
                displayValue: v,
            };
        }
        const percentage = Math.round(numericalValue * 100);
        return {
            id: `scale_${percentage}`,
            value: String(numericalValue),
            dataL10nId: 'page_scale_percent',
            dataL10nArgs: `{ "scale": ${percentage} }`,
            displayValue: String(percentage) + '%',
        };
    }
    snakeToCamel(str) {
        // idea found here: https://hisk.io/javascript-snake-to-camel/
        return str.replace(/([-_][a-z])/g, (group) => group.toUpperCase().replace('-', '').replace('_', ''));
    }
}
PdfZoomDropdownComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: PdfZoomDropdownComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
PdfZoomDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: PdfZoomDropdownComponent, selector: "pdf-zoom-dropdown", inputs: { zoomLevels: "zoomLevels" }, viewQueries: [{ propertyName: "sizeSelector", first: true, predicate: ["sizeSelector"], descendants: true }], ngImport: i0, template: "<span id=\"scaleSelectContainer\">\n  <select\n    id=\"scaleSelect\"\n    title=\"Zoom\"\n    data-l10n-id=\"zoom\"\n    #sizeSelector\n  >\n    <option *ngFor=\"let level of _zoomLevels\"\n      [id]=\"level.id\"\n      [attr.value]=\"level.value\"\n      [attr.data-l10n-id]=\"level.dataL10nId\"\n      [attr.data-l10n-args]=\"level.dataL10nArgs\">\n      {{level.displayValue}}\n    </option>\n    <option\n    id=\"customScaleOption\"\n    title=\"\"\n    value=\"custom\"\n    disabled=\"disabled\"\n    hidden=\"true\"\n  ></option>\n\n  </select>\n</span>\n", styles: ["select{font-size:12px;height:26px;cursor:pointer;border-radius:2px;border-width:1px;border-style:solid}#customScaleOption{display:none}\n"], directives: [{ type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: PdfZoomDropdownComponent, decorators: [{
            type: Component,
            args: [{ selector: 'pdf-zoom-dropdown', template: "<span id=\"scaleSelectContainer\">\n  <select\n    id=\"scaleSelect\"\n    title=\"Zoom\"\n    data-l10n-id=\"zoom\"\n    #sizeSelector\n  >\n    <option *ngFor=\"let level of _zoomLevels\"\n      [id]=\"level.id\"\n      [attr.value]=\"level.value\"\n      [attr.data-l10n-id]=\"level.dataL10nId\"\n      [attr.data-l10n-args]=\"level.dataL10nArgs\">\n      {{level.displayValue}}\n    </option>\n    <option\n    id=\"customScaleOption\"\n    title=\"\"\n    value=\"custom\"\n    disabled=\"disabled\"\n    hidden=\"true\"\n  ></option>\n\n  </select>\n</span>\n", styles: ["select{font-size:12px;height:26px;cursor:pointer;border-radius:2px;border-width:1px;border-style:solid}#customScaleOption{display:none}\n"] }]
        }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { zoomLevels: [{
                type: Input
            }], sizeSelector: [{
                type: ViewChild,
                args: ['sizeSelector']
            }] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGRmLXpvb20tZHJvcGRvd24uY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LWV4dGVuZGVkLXBkZi12aWV3ZXIvc3JjL2xpYi90b29sYmFyL3BkZi16b29tLXRvb2xiYXIvcGRmLXpvb20tZHJvcGRvd24vcGRmLXpvb20tZHJvcGRvd24uY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LWV4dGVuZGVkLXBkZi12aWV3ZXIvc3JjL2xpYi90b29sYmFyL3BkZi16b29tLXRvb2xiYXIvcGRmLXpvb20tZHJvcGRvd24vcGRmLXpvb20tZHJvcGRvd24uY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBYyxLQUFLLEVBQUUsU0FBUyxFQUFFLE1BQU0sZUFBZSxDQUFDOzs7O0FBY3hFLE1BQU0sT0FBTyx3QkFBd0I7SUFVbkMsWUFBb0IsT0FBbUI7UUFBbkIsWUFBTyxHQUFQLE9BQU8sQ0FBWTtRQVRoQyxnQkFBVyxHQUFxQixFQUFFLENBQUM7SUFTQSxDQUFDO0lBUDNDLElBQ1csVUFBVSxDQUFDLE1BQThCO1FBQ2xELElBQUksQ0FBQyxXQUFXLEdBQUcsTUFBTSxDQUFDLEdBQUcsQ0FBQyxDQUFDLENBQUMsRUFBRSxFQUFFLENBQUMsSUFBSSxDQUFDLGdCQUFnQixDQUFDLENBQUMsQ0FBQyxDQUFDLENBQUM7SUFDakUsQ0FBQztJQU1PLGdCQUFnQixDQUFDLEtBQXNCO1FBQzdDLElBQUksS0FBSyxDQUFDLFFBQVEsRUFBRSxDQUFDLFFBQVEsQ0FBQyxHQUFHLENBQUMsRUFBRTtZQUNsQyxLQUFLLEdBQUcsS0FBSyxDQUFDLFFBQVEsRUFBRSxDQUFDLE9BQU8sQ0FBQyxHQUFHLEVBQUUsRUFBRSxDQUFDLENBQUM7WUFDMUMsS0FBSyxHQUFHLE1BQU0sQ0FBQyxLQUFLLENBQUMsR0FBRyxHQUFHLENBQUM7U0FDN0I7UUFDRCxNQUFNLGNBQWMsR0FBRyxNQUFNLENBQUMsS0FBSyxDQUFDLENBQUM7UUFDckMsSUFBSSxDQUFDLGNBQWMsRUFBRTtZQUNuQixNQUFNLENBQUMsR0FBRyxNQUFNLENBQUMsS0FBSyxDQUFDLENBQUM7WUFDeEIsT0FBTztnQkFDTCxFQUFFLEVBQUUsSUFBSSxDQUFDLFlBQVksQ0FBQyxLQUFLLEdBQUcsUUFBUSxDQUFDO2dCQUN2QyxLQUFLLEVBQUUsQ0FBQztnQkFDUixVQUFVLEVBQUUsYUFBYSxHQUFHLENBQUMsQ0FBQyxPQUFPLENBQUMsT0FBTyxFQUFFLEVBQUUsQ0FBQztnQkFDbEQsWUFBWSxFQUFFLFNBQVM7Z0JBQ3ZCLFlBQVksRUFBRSxDQUFDO2FBQ2hCLENBQUM7U0FDSDtRQUNELE1BQU0sVUFBVSxHQUFHLElBQUksQ0FBQyxLQUFLLENBQUMsY0FBYyxHQUFHLEdBQUcsQ0FBQyxDQUFDO1FBQ3BELE9BQU87WUFDTCxFQUFFLEVBQUUsU0FBUyxVQUFVLEVBQUU7WUFDekIsS0FBSyxFQUFFLE1BQU0sQ0FBQyxjQUFjLENBQUM7WUFDN0IsVUFBVSxFQUFFLG9CQUFvQjtZQUNoQyxZQUFZLEVBQUUsY0FBYyxVQUFVLElBQUk7WUFDMUMsWUFBWSxFQUFFLE1BQU0sQ0FBQyxVQUFVLENBQUMsR0FBRyxHQUFHO1NBQ3ZDLENBQUM7SUFDSixDQUFDO0lBRU8sWUFBWSxDQUFDLEdBQVc7UUFDOUIsOERBQThEO1FBQzlELE9BQU8sR0FBRyxDQUFDLE9BQU8sQ0FBQyxjQUFjLEVBQUUsQ0FBQyxLQUFLLEVBQUUsRUFBRSxDQUFDLEtBQUssQ0FBQyxXQUFXLEVBQUUsQ0FBQyxPQUFPLENBQUMsR0FBRyxFQUFFLEVBQUUsQ0FBQyxDQUFDLE9BQU8sQ0FBQyxHQUFHLEVBQUUsRUFBRSxDQUFDLENBQUMsQ0FBQztJQUN2RyxDQUFDOztzSEF6Q1Usd0JBQXdCOzBHQUF4Qix3QkFBd0IsNk1DZHJDLHVqQkF3QkE7NEZEVmEsd0JBQXdCO2tCQUxwQyxTQUFTOytCQUNFLG1CQUFtQjtpR0FRbEIsVUFBVTtzQkFEcEIsS0FBSztnQkFLcUIsWUFBWTtzQkFBdEMsU0FBUzt1QkFBQyxjQUFjIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBFbGVtZW50UmVmLCBJbnB1dCwgVmlld0NoaWxkIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbmludGVyZmFjZSBab29tTGV2ZWwge1xuICBpZDogc3RyaW5nO1xuICBkYXRhTDEwbklkOiBzdHJpbmc7XG4gIGRhdGFMMTBuQXJnczogc3RyaW5nIHwgdW5kZWZpbmVkO1xuICB2YWx1ZTogc3RyaW5nO1xuICBkaXNwbGF5VmFsdWU6IHN0cmluZztcbn1cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ3BkZi16b29tLWRyb3Bkb3duJyxcbiAgdGVtcGxhdGVVcmw6ICcuL3BkZi16b29tLWRyb3Bkb3duLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vcGRmLXpvb20tZHJvcGRvd24uY29tcG9uZW50LmNzcyddLFxufSlcbmV4cG9ydCBjbGFzcyBQZGZab29tRHJvcGRvd25Db21wb25lbnQge1xuICBwdWJsaWMgX3pvb21MZXZlbHM6IEFycmF5PFpvb21MZXZlbD4gPSBbXTtcblxuICBASW5wdXQoKVxuICBwdWJsaWMgc2V0IHpvb21MZXZlbHMobGV2ZWxzOiBBcnJheTxzdHJpbmcgfCBudW1iZXI+KSB7XG4gICAgdGhpcy5fem9vbUxldmVscyA9IGxldmVscy5tYXAoKGwpID0+IHRoaXMudmFsdWVUb1pvb21MZXZlbChsKSk7XG4gIH1cblxuICBAVmlld0NoaWxkKCdzaXplU2VsZWN0b3InKSBzaXplU2VsZWN0b3I6IGFueTtcblxuICBjb25zdHJ1Y3Rvcihwcml2YXRlIGVsZW1lbnQ6IEVsZW1lbnRSZWYpIHt9XG5cbiAgcHJpdmF0ZSB2YWx1ZVRvWm9vbUxldmVsKHZhbHVlOiBzdHJpbmcgfCBudW1iZXIpOiBab29tTGV2ZWwge1xuICAgIGlmICh2YWx1ZS50b1N0cmluZygpLmVuZHNXaXRoKCclJykpIHtcbiAgICAgIHZhbHVlID0gdmFsdWUudG9TdHJpbmcoKS5yZXBsYWNlKCclJywgJycpO1xuICAgICAgdmFsdWUgPSBOdW1iZXIodmFsdWUpIC8gMTAwO1xuICAgIH1cbiAgICBjb25zdCBudW1lcmljYWxWYWx1ZSA9IE51bWJlcih2YWx1ZSk7XG4gICAgaWYgKCFudW1lcmljYWxWYWx1ZSkge1xuICAgICAgY29uc3QgdiA9IFN0cmluZyh2YWx1ZSk7XG4gICAgICByZXR1cm4ge1xuICAgICAgICBpZDogdGhpcy5zbmFrZVRvQ2FtZWwodmFsdWUgKyAnT3B0aW9uJyksXG4gICAgICAgIHZhbHVlOiB2LFxuICAgICAgICBkYXRhTDEwbklkOiAncGFnZV9zY2FsZV8nICsgdi5yZXBsYWNlKCdwYWdlLScsICcnKSxcbiAgICAgICAgZGF0YUwxMG5BcmdzOiB1bmRlZmluZWQsXG4gICAgICAgIGRpc3BsYXlWYWx1ZTogdixcbiAgICAgIH07XG4gICAgfVxuICAgIGNvbnN0IHBlcmNlbnRhZ2UgPSBNYXRoLnJvdW5kKG51bWVyaWNhbFZhbHVlICogMTAwKTtcbiAgICByZXR1cm4ge1xuICAgICAgaWQ6IGBzY2FsZV8ke3BlcmNlbnRhZ2V9YCxcbiAgICAgIHZhbHVlOiBTdHJpbmcobnVtZXJpY2FsVmFsdWUpLFxuICAgICAgZGF0YUwxMG5JZDogJ3BhZ2Vfc2NhbGVfcGVyY2VudCcsXG4gICAgICBkYXRhTDEwbkFyZ3M6IGB7IFwic2NhbGVcIjogJHtwZXJjZW50YWdlfSB9YCxcbiAgICAgIGRpc3BsYXlWYWx1ZTogU3RyaW5nKHBlcmNlbnRhZ2UpICsgJyUnLFxuICAgIH07XG4gIH1cblxuICBwcml2YXRlIHNuYWtlVG9DYW1lbChzdHI6IHN0cmluZykge1xuICAgIC8vIGlkZWEgZm91bmQgaGVyZTogaHR0cHM6Ly9oaXNrLmlvL2phdmFzY3JpcHQtc25ha2UtdG8tY2FtZWwvXG4gICAgcmV0dXJuIHN0ci5yZXBsYWNlKC8oWy1fXVthLXpdKS9nLCAoZ3JvdXApID0+IGdyb3VwLnRvVXBwZXJDYXNlKCkucmVwbGFjZSgnLScsICcnKS5yZXBsYWNlKCdfJywgJycpKTtcbiAgfVxufVxuIiwiPHNwYW4gaWQ9XCJzY2FsZVNlbGVjdENvbnRhaW5lclwiPlxuICA8c2VsZWN0XG4gICAgaWQ9XCJzY2FsZVNlbGVjdFwiXG4gICAgdGl0bGU9XCJab29tXCJcbiAgICBkYXRhLWwxMG4taWQ9XCJ6b29tXCJcbiAgICAjc2l6ZVNlbGVjdG9yXG4gID5cbiAgICA8b3B0aW9uICpuZ0Zvcj1cImxldCBsZXZlbCBvZiBfem9vbUxldmVsc1wiXG4gICAgICBbaWRdPVwibGV2ZWwuaWRcIlxuICAgICAgW2F0dHIudmFsdWVdPVwibGV2ZWwudmFsdWVcIlxuICAgICAgW2F0dHIuZGF0YS1sMTBuLWlkXT1cImxldmVsLmRhdGFMMTBuSWRcIlxuICAgICAgW2F0dHIuZGF0YS1sMTBuLWFyZ3NdPVwibGV2ZWwuZGF0YUwxMG5BcmdzXCI+XG4gICAgICB7e2xldmVsLmRpc3BsYXlWYWx1ZX19XG4gICAgPC9vcHRpb24+XG4gICAgPG9wdGlvblxuICAgIGlkPVwiY3VzdG9tU2NhbGVPcHRpb25cIlxuICAgIHRpdGxlPVwiXCJcbiAgICB2YWx1ZT1cImN1c3RvbVwiXG4gICAgZGlzYWJsZWQ9XCJkaXNhYmxlZFwiXG4gICAgaGlkZGVuPVwidHJ1ZVwiXG4gID48L29wdGlvbj5cblxuICA8L3NlbGVjdD5cbjwvc3Bhbj5cbiJdfQ==