@microsoft/windows-admin-center-sdk
Version:
Microsoft - Windows Admin Center Shell
79 lines • 11.2 kB
JavaScript
export class PxConverter {
constructor() {
this.preCalculated = false;
this.conversionMap = {
mm2px: 1 / 25.4,
cm2px: 1 / 2.54,
pt2px: 1 / 72,
pc2px: 1 / 6,
px2px: 1,
in2px: 96
};
}
// Converts a value to pixel equivalent
// 'width' is used as default, but you can supply others
convertToPx(value, property = 'width') {
const testElement = document.createElement('toTestNode');
return this.convert(testElement, value, property);
}
convert(testElement, value, property = 'width') {
// We first recalculate the conversionMap to work with the dimensions of the current display
if (!this.preCalculated) {
this.preCalculated = true;
this.preCalculate();
}
const convertValue = value;
const unit = convertValue.match(/^(-?[\d+\.\-]+)([a-z]+|%)$/)[2];
let result;
// Currently we only support absolute units we have maps for, or font units
if (this.conversionMap[`${unit}2px`] || /r?em/i.test(unit)) {
let ratio = this.conversionMap[`${unit}2px`];
// calculate known conversions immediately
// find the correct element for absolute units or rem or fontSize + em or em
testElement = ratio
? testElement
: unit === 'rem' || unit === 'em'
? document.documentElement
: property === 'fontSize'
? testElement.parentNode || testElement
: testElement;
// use the pre-calculated
// conversion or fontSize of the element for rem and em
ratio = ratio || this.computeFromFont(testElement);
// multiply the value by the conversion
result = parseFloat(value) * ratio;
}
return result;
}
preCalculate() {
let testElement = document.createElement('test');
// create a test element
const documentElement = document.documentElement;
// add the test element to the dom
documentElement.appendChild(testElement);
// pre-calculate absolute unit conversions
[
'pc2px',
'pt2px',
'cm2px',
'mm2px'
].forEach((conversion) => {
this.conversionMap[conversion] = this.conversionMap[conversion]
? this.conversionMap[conversion] * this.conversionMap.in2px
: this.convert(testElement, `_${conversion}`);
});
// remove the test element from the DOM and delete it
documentElement.removeChild(testElement);
testElement = undefined;
}
// return the computed value of a CSS property
computeFromFont(element) {
let computedValue;
if (document.defaultView && document.defaultView.getComputedStyle) {
// FireFox, Chrome/Safari/Edge, Opera and IE9+
computedValue = parseFloat(document.defaultView.getComputedStyle(element)['fontSize']);
}
return computedValue;
}
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHgtY29udmVydGVyLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vYW5ndWxhci9zcmMvY29udHJvbHMvZGF0YS10YWJsZS9oZWxwZXJzL3B4LWNvbnZlcnRlci50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxNQUFNLE9BQU8sV0FBVztJQUF4QjtRQUNZLGtCQUFhLEdBQUcsS0FBSyxDQUFDO1FBRXRCLGtCQUFhLEdBQUc7WUFDcEIsS0FBSyxFQUFFLENBQUMsR0FBRyxJQUFJO1lBQ2YsS0FBSyxFQUFFLENBQUMsR0FBRyxJQUFJO1lBQ2YsS0FBSyxFQUFFLENBQUMsR0FBRyxFQUFFO1lBQ2IsS0FBSyxFQUFFLENBQUMsR0FBRyxDQUFDO1lBQ1osS0FBSyxFQUFFLENBQUM7WUFDUixLQUFLLEVBQUUsRUFBRTtTQUNaLENBQUM7SUFtRk4sQ0FBQztJQWpGRyx1Q0FBdUM7SUFDdkMsd0RBQXdEO0lBQ2pELFdBQVcsQ0FBQyxLQUFhLEVBQUUsUUFBUSxHQUFHLE9BQU87UUFDaEQsTUFBTSxXQUFXLEdBQWdCLFFBQVEsQ0FBQyxhQUFhLENBQUMsWUFBWSxDQUFDLENBQUM7UUFFdEUsT0FBTyxJQUFJLENBQUMsT0FBTyxDQUFDLFdBQVcsRUFBRSxLQUFLLEVBQUUsUUFBUSxDQUFDLENBQUM7SUFDdEQsQ0FBQztJQUVPLE9BQU8sQ0FBQyxXQUErQixFQUFFLEtBQWEsRUFBRSxRQUFRLEdBQUcsT0FBTztRQUM5RSw0RkFBNEY7UUFDNUYsSUFBSSxDQUFDLElBQUksQ0FBQyxhQUFhLEVBQUU7WUFDckIsSUFBSSxDQUFDLGFBQWEsR0FBRyxJQUFJLENBQUM7WUFDMUIsSUFBSSxDQUFDLFlBQVksRUFBRSxDQUFDO1NBQ3ZCO1FBRUQsTUFBTSxZQUFZLEdBQUcsS0FBSyxDQUFDO1FBQzNCLE1BQU0sSUFBSSxHQUFHLFlBQVksQ0FBQyxLQUFLLENBQUMsNEJBQTRCLENBQUMsQ0FBQyxDQUFDLENBQUMsQ0FBQztRQUVqRSxJQUFJLE1BQU0sQ0FBQztRQUVYLDJFQUEyRTtRQUMzRSxJQUFJLElBQUksQ0FBQyxhQUFhLENBQUMsR0FBRyxJQUFJLEtBQUssQ0FBQyxJQUFJLE9BQU8sQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLEVBQUU7WUFDeEQsSUFBSSxLQUFLLEdBQUcsSUFBSSxDQUFDLGFBQWEsQ0FBQyxHQUFHLElBQUksS0FBSyxDQUFDLENBQUM7WUFDN0MsMENBQTBDO1lBQzFDLDRFQUE0RTtZQUM1RSxXQUFXLEdBQUcsS0FBSztnQkFDZixDQUFDLENBQUMsV0FBVztnQkFDYixDQUFDLENBQUMsSUFBSSxLQUFLLEtBQUssSUFBSSxJQUFJLEtBQUssSUFBSTtvQkFDN0IsQ0FBQyxDQUFDLFFBQVEsQ0FBQyxlQUFlO29CQUMxQixDQUFDLENBQUMsUUFBUSxLQUFLLFVBQVU7d0JBQ3JCLENBQUMsQ0FBQyxXQUFXLENBQUMsVUFBVSxJQUFJLFdBQVc7d0JBQ3ZDLENBQUMsQ0FBQyxXQUFXLENBQUM7WUFFMUIseUJBQXlCO1lBQ3pCLHVEQUF1RDtZQUN2RCxLQUFLLEdBQUcsS0FBSyxJQUFJLElBQUksQ0FBQyxlQUFlLENBQWMsV0FBVyxDQUFDLENBQUM7WUFFaEUsdUNBQXVDO1lBQ3ZDLE1BQU0sR0FBRyxVQUFVLENBQUMsS0FBSyxDQUFDLEdBQUcsS0FBSyxDQUFDO1NBQ3RDO1FBRUQsT0FBTyxNQUFNLENBQUM7SUFDbEIsQ0FBQztJQUVPLFlBQVk7UUFDaEIsSUFBSSxXQUFXLEdBQUcsUUFBUSxDQUFDLGFBQWEsQ0FBQyxNQUFNLENBQUMsQ0FBQztRQUNqRCx3QkFBd0I7UUFDeEIsTUFBTSxlQUFlLEdBQUcsUUFBUSxDQUFDLGVBQWUsQ0FBQztRQUVqRCxrQ0FBa0M7UUFDbEMsZUFBZSxDQUFDLFdBQVcsQ0FBQyxXQUFXLENBQUMsQ0FBQztRQUV6QywwQ0FBMEM7UUFDMUM7WUFDSSxPQUFPO1lBQ1AsT0FBTztZQUNQLE9BQU87WUFDUCxPQUFPO1NBQ1YsQ0FBQyxPQUFPLENBQUMsQ0FBQyxVQUFVLEVBQUUsRUFBRTtZQUNyQixJQUFJLENBQUMsYUFBYSxDQUFDLFVBQVUsQ0FBQyxHQUFHLElBQUksQ0FBQyxhQUFhLENBQUMsVUFBVSxDQUFDO2dCQUMzRCxDQUFDLENBQUMsSUFBSSxDQUFDLGFBQWEsQ0FBQyxVQUFVLENBQUMsR0FBRyxJQUFJLENBQUMsYUFBYSxDQUFDLEtBQUs7Z0JBQzNELENBQUMsQ0FBQyxJQUFJLENBQUMsT0FBTyxDQUFDLFdBQVcsRUFBRSxJQUFJLFVBQVUsRUFBRSxDQUFDLENBQUM7UUFDdEQsQ0FBQyxDQUFDLENBQUM7UUFFSCxxREFBcUQ7UUFDckQsZUFBZSxDQUFDLFdBQVcsQ0FBQyxXQUFXLENBQUMsQ0FBQztRQUN6QyxXQUFXLEdBQUcsU0FBUyxDQUFDO0lBQzVCLENBQUM7SUFFRCw4Q0FBOEM7SUFDdEMsZUFBZSxDQUFDLE9BQW9CO1FBQ3hDLElBQUksYUFBYSxDQUFDO1FBRWxCLElBQUksUUFBUSxDQUFDLFdBQVcsSUFBSSxRQUFRLENBQUMsV0FBVyxDQUFDLGdCQUFnQixFQUFFO1lBQy9ELDhDQUE4QztZQUM5QyxhQUFhLEdBQUcsVUFBVSxDQUFDLFFBQVEsQ0FBQyxXQUFXLENBQUMsZ0JBQWdCLENBQUMsT0FBTyxDQUFDLENBQUMsVUFBVSxDQUFDLENBQUMsQ0FBQztTQUMxRjtRQUVELE9BQU8sYUFBYSxDQUFDO0lBQ3pCLENBQUM7Q0FFSiIsInNvdXJjZXNDb250ZW50IjpbImV4cG9ydCBjbGFzcyBQeENvbnZlcnRlciB7XHJcbiAgICBwcml2YXRlIHByZUNhbGN1bGF0ZWQgPSBmYWxzZTtcclxuXHJcbiAgICBwcml2YXRlIGNvbnZlcnNpb25NYXAgPSB7XHJcbiAgICAgICAgbW0ycHg6IDEgLyAyNS40LFxyXG4gICAgICAgIGNtMnB4OiAxIC8gMi41NCxcclxuICAgICAgICBwdDJweDogMSAvIDcyLFxyXG4gICAgICAgIHBjMnB4OiAxIC8gNixcclxuICAgICAgICBweDJweDogMSxcclxuICAgICAgICBpbjJweDogOTZcclxuICAgIH07XHJcblxyXG4gICAgLy8gQ29udmVydHMgYSB2YWx1ZSB0byBwaXhlbCBlcXVpdmFsZW50XHJcbiAgICAvLyAnd2lkdGgnIGlzIHVzZWQgYXMgZGVmYXVsdCwgYnV0IHlvdSBjYW4gc3VwcGx5IG90aGVyc1xyXG4gICAgcHVibGljIGNvbnZlcnRUb1B4KHZhbHVlOiBzdHJpbmcsIHByb3BlcnR5ID0gJ3dpZHRoJyk6IG51bWJlciB7XHJcbiAgICAgICAgY29uc3QgdGVzdEVsZW1lbnQ6IEhUTUxFbGVtZW50ID0gZG9jdW1lbnQuY3JlYXRlRWxlbWVudCgndG9UZXN0Tm9kZScpO1xyXG5cclxuICAgICAgICByZXR1cm4gdGhpcy5jb252ZXJ0KHRlc3RFbGVtZW50LCB2YWx1ZSwgcHJvcGVydHkpO1xyXG4gICAgfVxyXG5cclxuICAgIHByaXZhdGUgY29udmVydCh0ZXN0RWxlbWVudDogSFRNTEVsZW1lbnQgfCBOb2RlLCB2YWx1ZTogc3RyaW5nLCBwcm9wZXJ0eSA9ICd3aWR0aCcpOiBudW1iZXIge1xyXG4gICAgICAgIC8vIFdlIGZpcnN0IHJlY2FsY3VsYXRlIHRoZSBjb252ZXJzaW9uTWFwIHRvIHdvcmsgd2l0aCB0aGUgZGltZW5zaW9ucyBvZiB0aGUgY3VycmVudCBkaXNwbGF5XHJcbiAgICAgICAgaWYgKCF0aGlzLnByZUNhbGN1bGF0ZWQpIHtcclxuICAgICAgICAgICAgdGhpcy5wcmVDYWxjdWxhdGVkID0gdHJ1ZTtcclxuICAgICAgICAgICAgdGhpcy5wcmVDYWxjdWxhdGUoKTtcclxuICAgICAgICB9XHJcblxyXG4gICAgICAgIGNvbnN0IGNvbnZlcnRWYWx1ZSA9IHZhbHVlO1xyXG4gICAgICAgIGNvbnN0IHVuaXQgPSBjb252ZXJ0VmFsdWUubWF0Y2goL14oLT9bXFxkK1xcLlxcLV0rKShbYS16XSt8JSkkLylbMl07XHJcblxyXG4gICAgICAgIGxldCByZXN1bHQ7XHJcblxyXG4gICAgICAgIC8vIEN1cnJlbnRseSB3ZSBvbmx5IHN1cHBvcnQgYWJzb2x1dGUgdW5pdHMgd2UgaGF2ZSBtYXBzIGZvciwgb3IgZm9udCB1bml0c1xyXG4gICAgICAgIGlmICh0aGlzLmNvbnZlcnNpb25NYXBbYCR7dW5pdH0ycHhgXSB8fCAvcj9lbS9pLnRlc3QodW5pdCkpIHtcclxuICAgICAgICAgICAgbGV0IHJhdGlvID0gdGhpcy5jb252ZXJzaW9uTWFwW2Ake3VuaXR9MnB4YF07XHJcbiAgICAgICAgICAgIC8vIGNhbGN1bGF0ZSBrbm93biBjb252ZXJzaW9ucyBpbW1lZGlhdGVseVxyXG4gICAgICAgICAgICAvLyBmaW5kIHRoZSBjb3JyZWN0IGVsZW1lbnQgZm9yIGFic29sdXRlIHVuaXRzIG9yIHJlbSBvciBmb250U2l6ZSArIGVtIG9yIGVtXHJcbiAgICAgICAgICAgIHRlc3RFbGVtZW50ID0gcmF0aW9cclxuICAgICAgICAgICAgICAgID8gdGVzdEVsZW1lbnRcclxuICAgICAgICAgICAgICAgIDogdW5pdCA9PT0gJ3JlbScgfHwgdW5pdCA9PT0gJ2VtJ1xyXG4gICAgICAgICAgICAgICAgICAgID8gZG9jdW1lbnQuZG9jdW1lbnRFbGVtZW50XHJcbiAgICAgICAgICAgICAgICAgICAgOiBwcm9wZXJ0eSA9PT0gJ2ZvbnRTaXplJ1xyXG4gICAgICAgICAgICAgICAgICAgICAgICA/IHRlc3RFbGVtZW50LnBhcmVudE5vZGUgfHwgdGVzdEVsZW1lbnRcclxuICAgICAgICAgICAgICAgICAgICAgICAgOiB0ZXN0RWxlbWVudDtcclxuXHJcbiAgICAgICAgICAgIC8vIHVzZSB0aGUgcHJlLWNhbGN1bGF0ZWRcclxuICAgICAgICAgICAgLy8gY29udmVyc2lvbiBvciBmb250U2l6ZSBvZiB0aGUgZWxlbWVudCBmb3IgcmVtIGFuZCBlbVxyXG4gICAgICAgICAgICByYXRpbyA9IHJhdGlvIHx8IHRoaXMuY29tcHV0ZUZyb21Gb250KDxIVE1MRWxlbWVudD50ZXN0RWxlbWVudCk7XHJcblxyXG4gICAgICAgICAgICAvLyBtdWx0aXBseSB0aGUgdmFsdWUgYnkgdGhlIGNvbnZlcnNpb25cclxuICAgICAgICAgICAgcmVzdWx0ID0gcGFyc2VGbG9hdCh2YWx1ZSkgKiByYXRpbztcclxuICAgICAgICB9XHJcblxyXG4gICAgICAgIHJldHVybiByZXN1bHQ7XHJcbiAgICB9XHJcblxyXG4gICAgcHJpdmF0ZSBwcmVDYWxjdWxhdGUoKTogdm9pZCB7XHJcbiAgICAgICAgbGV0IHRlc3RFbGVtZW50ID0gZG9jdW1lbnQuY3JlYXRlRWxlbWVudCgndGVzdCcpO1xyXG4gICAgICAgIC8vIGNyZWF0ZSBhIHRlc3QgZWxlbWVudFxyXG4gICAgICAgIGNvbnN0IGRvY3VtZW50RWxlbWVudCA9IGRvY3VtZW50LmRvY3VtZW50RWxlbWVudDtcclxuXHJcbiAgICAgICAgLy8gYWRkIHRoZSB0ZXN0IGVsZW1lbnQgdG8gdGhlIGRvbVxyXG4gICAgICAgIGRvY3VtZW50RWxlbWVudC5hcHBlbmRDaGlsZCh0ZXN0RWxlbWVudCk7XHJcblxyXG4gICAgICAgIC8vIHByZS1jYWxjdWxhdGUgYWJzb2x1dGUgdW5pdCBjb252ZXJzaW9uc1xyXG4gICAgICAgIFtcclxuICAgICAgICAgICAgJ3BjMnB4JyxcclxuICAgICAgICAgICAgJ3B0MnB4JyxcclxuICAgICAgICAgICAgJ2NtMnB4JyxcclxuICAgICAgICAgICAgJ21tMnB4J1xyXG4gICAgICAgIF0uZm9yRWFjaCgoY29udmVyc2lvbikgPT4ge1xyXG4gICAgICAgICAgICB0aGlzLmNvbnZlcnNpb25NYXBbY29udmVyc2lvbl0gPSB0aGlzLmNvbnZlcnNpb25NYXBbY29udmVyc2lvbl1cclxuICAgICAgICAgICAgICAgID8gdGhpcy5jb252ZXJzaW9uTWFwW2NvbnZlcnNpb25dICogdGhpcy5jb252ZXJzaW9uTWFwLmluMnB4XHJcbiAgICAgICAgICAgICAgICA6IHRoaXMuY29udmVydCh0ZXN0RWxlbWVudCwgYF8ke2NvbnZlcnNpb259YCk7XHJcbiAgICAgICAgfSk7XHJcblxyXG4gICAgICAgIC8vIHJlbW92ZSB0aGUgdGVzdCBlbGVtZW50IGZyb20gdGhlIERPTSBhbmQgZGVsZXRlIGl0XHJcbiAgICAgICAgZG9jdW1lbnRFbGVtZW50LnJlbW92ZUNoaWxkKHRlc3RFbGVtZW50KTtcclxuICAgICAgICB0ZXN0RWxlbWVudCA9IHVuZGVmaW5lZDtcclxuICAgIH1cclxuXHJcbiAgICAvLyByZXR1cm4gdGhlIGNvbXB1dGVkIHZhbHVlIG9mIGEgQ1NTIHByb3BlcnR5XHJcbiAgICBwcml2YXRlIGNvbXB1dGVGcm9tRm9udChlbGVtZW50OiBIVE1MRWxlbWVudCk6IG51bWJlciB7XHJcbiAgICAgICAgbGV0IGNvbXB1dGVkVmFsdWU7XHJcblxyXG4gICAgICAgIGlmIChkb2N1bWVudC5kZWZhdWx0VmlldyAmJiBkb2N1bWVudC5kZWZhdWx0Vmlldy5nZXRDb21wdXRlZFN0eWxlKSB7XHJcbiAgICAgICAgICAgIC8vIEZpcmVGb3gsIENocm9tZS9TYWZhcmkvRWRnZSwgT3BlcmEgYW5kIElFOStcclxuICAgICAgICAgICAgY29tcHV0ZWRWYWx1ZSA9IHBhcnNlRmxvYXQoZG9jdW1lbnQuZGVmYXVsdFZpZXcuZ2V0Q29tcHV0ZWRTdHlsZShlbGVtZW50KVsnZm9udFNpemUnXSk7XHJcbiAgICAgICAgfVxyXG5cclxuICAgICAgICByZXR1cm4gY29tcHV0ZWRWYWx1ZTtcclxuICAgIH1cclxuXHJcbn1cclxuIl19