@catull/igniteui-angular
Version:
Ignite UI for Angular is a dependency-free Angular toolkit for building modern web apps
60 lines • 11.9 kB
JavaScript
import { __extends } from "tslib";
import { BaseFitPositionStrategy } from './base-fit-position-strategy';
import { HorizontalAlignment, VerticalAlignment } from '../utilities';
/**
* Positions the element as in **Connected** positioning strategy and resize the element
* to fit in the view port in case the element is partially getting out of view
*/
var ElasticPositionStrategy = /** @class */ (function (_super) {
__extends(ElasticPositionStrategy, _super);
function ElasticPositionStrategy() {
return _super !== null && _super.apply(this, arguments) || this;
}
/** @inheritdoc */
ElasticPositionStrategy.prototype.fitInViewport = function (element, connectedFit) {
element.classList.add('igx-overlay__content--elastic');
var transformString = [];
if (connectedFit.fitHorizontal.back < 0 || connectedFit.fitHorizontal.forward < 0) {
var maxReduction = Math.max(0, connectedFit.contentElementRect.width - this.settings.minSize.width);
var leftExtend = Math.max(0, -connectedFit.fitHorizontal.back);
var rightExtend = Math.max(0, -connectedFit.fitHorizontal.forward);
var reduction = Math.min(maxReduction, leftExtend + rightExtend);
element.style.width = connectedFit.contentElementRect.width - reduction + "px";
// if direction is center and element goes off the screen in left direction we should push the
// element to the right. Prevents left still going out of view when normally positioned
if (this.settings.horizontalDirection === HorizontalAlignment.Center) {
// the amount of translation depends on whether element goes off the screen to the left,
// to the right or in both directions, as well as how much it goes of the screen and finally
// on the minSize. The translation should be proportional between left and right extend
// taken from the reduction
var translation = leftExtend * reduction / (leftExtend + rightExtend);
if (translation > 0) {
transformString.push("translateX(" + translation + "px)");
}
}
}
if (connectedFit.fitVertical.back < 0 || connectedFit.fitVertical.forward < 0) {
var maxReduction = Math.max(0, connectedFit.contentElementRect.height - this.settings.minSize.height);
var topExtend = Math.max(0, -connectedFit.fitVertical.back);
var bottomExtend = Math.max(0, -connectedFit.fitVertical.forward);
var reduction = Math.min(maxReduction, topExtend + bottomExtend);
element.style.height = connectedFit.contentElementRect.height - reduction + "px";
// if direction is middle and element goes off the screen in top direction we should push the
// element to the bottom. Prevents top still going out of view when normally positioned
if (this.settings.verticalDirection === VerticalAlignment.Middle) {
// the amount of translation depends on whether element goes off the screen to the top,
// to the bottom or in both directions, as well as how much it goes of the screen and finally
// on the minSize. The translation should be proportional between top and bottom extend
// taken from the reduction
var translation = topExtend * reduction / (topExtend + bottomExtend);
if (translation > 0) {
transformString.push("translateY(" + translation + "px)");
}
}
}
element.style.transform = transformString.join(' ').trim();
};
return ElasticPositionStrategy;
}(BaseFitPositionStrategy));
export { ElasticPositionStrategy };
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZWxhc3RpYy1wb3NpdGlvbi1zdHJhdGVneS5qcyIsInNvdXJjZVJvb3QiOiJuZzovL2lnbml0ZXVpLWFuZ3VsYXIvIiwic291cmNlcyI6WyJsaWIvc2VydmljZXMvb3ZlcmxheS9wb3NpdGlvbi9lbGFzdGljLXBvc2l0aW9uLXN0cmF0ZWd5LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsTUFBTSw4QkFBOEIsQ0FBQztBQUN2RSxPQUFPLEVBQUUsbUJBQW1CLEVBQUUsaUJBQWlCLEVBQWdCLE1BQU0sY0FBYyxDQUFDO0FBRXBGOzs7R0FHRztBQUNIO0lBQTZDLDJDQUF1QjtJQUFwRTs7SUFnREEsQ0FBQztJQS9DRyxrQkFBa0I7SUFDUiwrQ0FBYSxHQUF2QixVQUF3QixPQUFvQixFQUFFLFlBQTBCO1FBQ3BFLE9BQU8sQ0FBQyxTQUFTLENBQUMsR0FBRyxDQUFDLCtCQUErQixDQUFDLENBQUM7UUFDdkQsSUFBTSxlQUFlLEdBQWEsRUFBRSxDQUFDO1FBQ3JDLElBQUksWUFBWSxDQUFDLGFBQWEsQ0FBQyxJQUFJLEdBQUcsQ0FBQyxJQUFJLFlBQVksQ0FBQyxhQUFhLENBQUMsT0FBTyxHQUFHLENBQUMsRUFBRTtZQUMvRSxJQUFNLFlBQVksR0FBRyxJQUFJLENBQUMsR0FBRyxDQUFDLENBQUMsRUFBRSxZQUFZLENBQUMsa0JBQWtCLENBQUMsS0FBSyxHQUFHLElBQUksQ0FBQyxRQUFRLENBQUMsT0FBTyxDQUFDLEtBQUssQ0FBQyxDQUFDO1lBQ3RHLElBQU0sVUFBVSxHQUFHLElBQUksQ0FBQyxHQUFHLENBQUMsQ0FBQyxFQUFFLENBQUMsWUFBWSxDQUFDLGFBQWEsQ0FBQyxJQUFJLENBQUMsQ0FBQztZQUNqRSxJQUFNLFdBQVcsR0FBRyxJQUFJLENBQUMsR0FBRyxDQUFDLENBQUMsRUFBRSxDQUFDLFlBQVksQ0FBQyxhQUFhLENBQUMsT0FBTyxDQUFDLENBQUM7WUFDckUsSUFBTSxTQUFTLEdBQUcsSUFBSSxDQUFDLEdBQUcsQ0FBQyxZQUFZLEVBQUUsVUFBVSxHQUFHLFdBQVcsQ0FBQyxDQUFDO1lBQ25FLE9BQU8sQ0FBQyxLQUFLLENBQUMsS0FBSyxHQUFNLFlBQVksQ0FBQyxrQkFBa0IsQ0FBQyxLQUFLLEdBQUcsU0FBUyxPQUFJLENBQUM7WUFFL0UsK0ZBQStGO1lBQy9GLHdGQUF3RjtZQUN4RixJQUFJLElBQUksQ0FBQyxRQUFRLENBQUMsbUJBQW1CLEtBQUssbUJBQW1CLENBQUMsTUFBTSxFQUFFO2dCQUNsRSx5RkFBeUY7Z0JBQ3pGLDZGQUE2RjtnQkFDN0Ysd0ZBQXdGO2dCQUN4Riw0QkFBNEI7Z0JBQzVCLElBQU0sV0FBVyxHQUFHLFVBQVUsR0FBRyxTQUFTLEdBQUcsQ0FBQyxVQUFVLEdBQUcsV0FBVyxDQUFDLENBQUM7Z0JBQ3hFLElBQUksV0FBVyxHQUFHLENBQUMsRUFBRTtvQkFDakIsZUFBZSxDQUFDLElBQUksQ0FBQyxnQkFBYyxXQUFXLFFBQUssQ0FBQyxDQUFDO2lCQUN4RDthQUNKO1NBQ0o7UUFFRCxJQUFJLFlBQVksQ0FBQyxXQUFXLENBQUMsSUFBSSxHQUFHLENBQUMsSUFBSSxZQUFZLENBQUMsV0FBVyxDQUFDLE9BQU8sR0FBRyxDQUFDLEVBQUU7WUFDM0UsSUFBTSxZQUFZLEdBQUcsSUFBSSxDQUFDLEdBQUcsQ0FBQyxDQUFDLEVBQUUsWUFBWSxDQUFDLGtCQUFrQixDQUFDLE1BQU0sR0FBRyxJQUFJLENBQUMsUUFBUSxDQUFDLE9BQU8sQ0FBQyxNQUFNLENBQUMsQ0FBQztZQUN4RyxJQUFNLFNBQVMsR0FBRyxJQUFJLENBQUMsR0FBRyxDQUFDLENBQUMsRUFBRSxDQUFDLFlBQVksQ0FBQyxXQUFXLENBQUMsSUFBSSxDQUFDLENBQUM7WUFDOUQsSUFBTSxZQUFZLEdBQUcsSUFBSSxDQUFDLEdBQUcsQ0FBQyxDQUFDLEVBQUUsQ0FBQyxZQUFZLENBQUMsV0FBVyxDQUFDLE9BQU8sQ0FBQyxDQUFDO1lBQ3BFLElBQU0sU0FBUyxHQUFHLElBQUksQ0FBQyxHQUFHLENBQUMsWUFBWSxFQUFFLFNBQVMsR0FBRyxZQUFZLENBQUMsQ0FBQztZQUNuRSxPQUFPLENBQUMsS0FBSyxDQUFDLE1BQU0sR0FBTSxZQUFZLENBQUMsa0JBQWtCLENBQUMsTUFBTSxHQUFHLFNBQVMsT0FBSSxDQUFDO1lBRWpGLDhGQUE4RjtZQUM5Rix3RkFBd0Y7WUFDeEYsSUFBSSxJQUFJLENBQUMsUUFBUSxDQUFDLGlCQUFpQixLQUFLLGlCQUFpQixDQUFDLE1BQU0sRUFBRTtnQkFDOUQsd0ZBQXdGO2dCQUN4Riw4RkFBOEY7Z0JBQzlGLHdGQUF3RjtnQkFDeEYsNEJBQTRCO2dCQUM1QixJQUFNLFdBQVcsR0FBRyxTQUFTLEdBQUcsU0FBUyxHQUFHLENBQUMsU0FBUyxHQUFHLFlBQVksQ0FBQyxDQUFDO2dCQUN2RSxJQUFJLFdBQVcsR0FBRyxDQUFDLEVBQUU7b0JBQ2pCLGVBQWUsQ0FBQyxJQUFJLENBQUMsZ0JBQWMsV0FBVyxRQUFLLENBQUMsQ0FBQztpQkFDeEQ7YUFDSjtTQUNKO1FBQ0QsT0FBTyxDQUFDLEtBQUssQ0FBQyxTQUFTLEdBQUcsZUFBZSxDQUFDLElBQUksQ0FBQyxHQUFHLENBQUMsQ0FBQyxJQUFJLEVBQUUsQ0FBQztJQUMvRCxDQUFDO0lBQ0wsOEJBQUM7QUFBRCxDQUFDLEFBaERELENBQTZDLHVCQUF1QixHQWdEbkUiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBCYXNlRml0UG9zaXRpb25TdHJhdGVneSB9IGZyb20gJy4vYmFzZS1maXQtcG9zaXRpb24tc3RyYXRlZ3knO1xuaW1wb3J0IHsgSG9yaXpvbnRhbEFsaWdubWVudCwgVmVydGljYWxBbGlnbm1lbnQsIENvbm5lY3RlZEZpdCB9IGZyb20gJy4uL3V0aWxpdGllcyc7XG5cbi8qKlxuICogUG9zaXRpb25zIHRoZSBlbGVtZW50IGFzIGluICoqQ29ubmVjdGVkKiogcG9zaXRpb25pbmcgc3RyYXRlZ3kgYW5kIHJlc2l6ZSB0aGUgZWxlbWVudFxuICogdG8gZml0IGluIHRoZSB2aWV3IHBvcnQgaW4gY2FzZSB0aGUgZWxlbWVudCBpcyBwYXJ0aWFsbHkgZ2V0dGluZyBvdXQgb2Ygdmlld1xuICovXG5leHBvcnQgY2xhc3MgRWxhc3RpY1Bvc2l0aW9uU3RyYXRlZ3kgZXh0ZW5kcyBCYXNlRml0UG9zaXRpb25TdHJhdGVneSB7XG4gICAgLyoqIEBpbmhlcml0ZG9jICovXG4gICAgcHJvdGVjdGVkIGZpdEluVmlld3BvcnQoZWxlbWVudDogSFRNTEVsZW1lbnQsIGNvbm5lY3RlZEZpdDogQ29ubmVjdGVkRml0KSB7XG4gICAgICAgIGVsZW1lbnQuY2xhc3NMaXN0LmFkZCgnaWd4LW92ZXJsYXlfX2NvbnRlbnQtLWVsYXN0aWMnKTtcbiAgICAgICAgY29uc3QgdHJhbnNmb3JtU3RyaW5nOiBzdHJpbmdbXSA9IFtdO1xuICAgICAgICBpZiAoY29ubmVjdGVkRml0LmZpdEhvcml6b250YWwuYmFjayA8IDAgfHwgY29ubmVjdGVkRml0LmZpdEhvcml6b250YWwuZm9yd2FyZCA8IDApIHtcbiAgICAgICAgICAgIGNvbnN0IG1heFJlZHVjdGlvbiA9IE1hdGgubWF4KDAsIGNvbm5lY3RlZEZpdC5jb250ZW50RWxlbWVudFJlY3Qud2lkdGggLSB0aGlzLnNldHRpbmdzLm1pblNpemUud2lkdGgpO1xuICAgICAgICAgICAgY29uc3QgbGVmdEV4dGVuZCA9IE1hdGgubWF4KDAsIC1jb25uZWN0ZWRGaXQuZml0SG9yaXpvbnRhbC5iYWNrKTtcbiAgICAgICAgICAgIGNvbnN0IHJpZ2h0RXh0ZW5kID0gTWF0aC5tYXgoMCwgLWNvbm5lY3RlZEZpdC5maXRIb3Jpem9udGFsLmZvcndhcmQpO1xuICAgICAgICAgICAgY29uc3QgcmVkdWN0aW9uID0gTWF0aC5taW4obWF4UmVkdWN0aW9uLCBsZWZ0RXh0ZW5kICsgcmlnaHRFeHRlbmQpO1xuICAgICAgICAgICAgZWxlbWVudC5zdHlsZS53aWR0aCA9IGAke2Nvbm5lY3RlZEZpdC5jb250ZW50RWxlbWVudFJlY3Qud2lkdGggLSByZWR1Y3Rpb259cHhgO1xuXG4gICAgICAgICAgICAvLyAgaWYgZGlyZWN0aW9uIGlzIGNlbnRlciBhbmQgZWxlbWVudCBnb2VzIG9mZiB0aGUgc2NyZWVuIGluIGxlZnQgZGlyZWN0aW9uIHdlIHNob3VsZCBwdXNoIHRoZVxuICAgICAgICAgICAgLy8gIGVsZW1lbnQgdG8gdGhlIHJpZ2h0LiBQcmV2ZW50cyBsZWZ0IHN0aWxsIGdvaW5nIG91dCBvZiB2aWV3IHdoZW4gbm9ybWFsbHkgcG9zaXRpb25lZFxuICAgICAgICAgICAgaWYgKHRoaXMuc2V0dGluZ3MuaG9yaXpvbnRhbERpcmVjdGlvbiA9PT0gSG9yaXpvbnRhbEFsaWdubWVudC5DZW50ZXIpIHtcbiAgICAgICAgICAgICAgICAvLyAgdGhlIGFtb3VudCBvZiB0cmFuc2xhdGlvbiBkZXBlbmRzIG9uIHdoZXRoZXIgZWxlbWVudCBnb2VzIG9mZiB0aGUgc2NyZWVuIHRvIHRoZSBsZWZ0LFxuICAgICAgICAgICAgICAgIC8vICB0byB0aGUgcmlnaHQgb3IgaW4gYm90aCBkaXJlY3Rpb25zLCBhcyB3ZWxsIGFzIGhvdyBtdWNoIGl0IGdvZXMgb2YgdGhlIHNjcmVlbiBhbmQgZmluYWxseVxuICAgICAgICAgICAgICAgIC8vICBvbiB0aGUgbWluU2l6ZS4gVGhlIHRyYW5zbGF0aW9uIHNob3VsZCBiZSBwcm9wb3J0aW9uYWwgYmV0d2VlbiBsZWZ0IGFuZCByaWdodCBleHRlbmRcbiAgICAgICAgICAgICAgICAvLyAgdGFrZW4gZnJvbSB0aGUgcmVkdWN0aW9uXG4gICAgICAgICAgICAgICAgY29uc3QgdHJhbnNsYXRpb24gPSBsZWZ0RXh0ZW5kICogcmVkdWN0aW9uIC8gKGxlZnRFeHRlbmQgKyByaWdodEV4dGVuZCk7XG4gICAgICAgICAgICAgICAgaWYgKHRyYW5zbGF0aW9uID4gMCkge1xuICAgICAgICAgICAgICAgICAgICB0cmFuc2Zvcm1TdHJpbmcucHVzaChgdHJhbnNsYXRlWCgke3RyYW5zbGF0aW9ufXB4KWApO1xuICAgICAgICAgICAgICAgIH1cbiAgICAgICAgICAgIH1cbiAgICAgICAgfVxuXG4gICAgICAgIGlmIChjb25uZWN0ZWRGaXQuZml0VmVydGljYWwuYmFjayA8IDAgfHwgY29ubmVjdGVkRml0LmZpdFZlcnRpY2FsLmZvcndhcmQgPCAwKSB7XG4gICAgICAgICAgICBjb25zdCBtYXhSZWR1Y3Rpb24gPSBNYXRoLm1heCgwLCBjb25uZWN0ZWRGaXQuY29udGVudEVsZW1lbnRSZWN0LmhlaWdodCAtIHRoaXMuc2V0dGluZ3MubWluU2l6ZS5oZWlnaHQpO1xuICAgICAgICAgICAgY29uc3QgdG9wRXh0ZW5kID0gTWF0aC5tYXgoMCwgLWNvbm5lY3RlZEZpdC5maXRWZXJ0aWNhbC5iYWNrKTtcbiAgICAgICAgICAgIGNvbnN0IGJvdHRvbUV4dGVuZCA9IE1hdGgubWF4KDAsIC1jb25uZWN0ZWRGaXQuZml0VmVydGljYWwuZm9yd2FyZCk7XG4gICAgICAgICAgICBjb25zdCByZWR1Y3Rpb24gPSBNYXRoLm1pbihtYXhSZWR1Y3Rpb24sIHRvcEV4dGVuZCArIGJvdHRvbUV4dGVuZCk7XG4gICAgICAgICAgICBlbGVtZW50LnN0eWxlLmhlaWdodCA9IGAke2Nvbm5lY3RlZEZpdC5jb250ZW50RWxlbWVudFJlY3QuaGVpZ2h0IC0gcmVkdWN0aW9ufXB4YDtcblxuICAgICAgICAgICAgLy8gIGlmIGRpcmVjdGlvbiBpcyBtaWRkbGUgYW5kIGVsZW1lbnQgZ29lcyBvZmYgdGhlIHNjcmVlbiBpbiB0b3AgZGlyZWN0aW9uIHdlIHNob3VsZCBwdXNoIHRoZVxuICAgICAgICAgICAgLy8gIGVsZW1lbnQgdG8gdGhlIGJvdHRvbS4gUHJldmVudHMgdG9wIHN0aWxsIGdvaW5nIG91dCBvZiB2aWV3IHdoZW4gbm9ybWFsbHkgcG9zaXRpb25lZFxuICAgICAgICAgICAgaWYgKHRoaXMuc2V0dGluZ3MudmVydGljYWxEaXJlY3Rpb24gPT09IFZlcnRpY2FsQWxpZ25tZW50Lk1pZGRsZSkge1xuICAgICAgICAgICAgICAgIC8vICB0aGUgYW1vdW50IG9mIHRyYW5zbGF0aW9uIGRlcGVuZHMgb24gd2hldGhlciBlbGVtZW50IGdvZXMgb2ZmIHRoZSBzY3JlZW4gdG8gdGhlIHRvcCxcbiAgICAgICAgICAgICAgICAvLyAgdG8gdGhlIGJvdHRvbSBvciBpbiBib3RoIGRpcmVjdGlvbnMsIGFzIHdlbGwgYXMgaG93IG11Y2ggaXQgZ29lcyBvZiB0aGUgc2NyZWVuIGFuZCBmaW5hbGx5XG4gICAgICAgICAgICAgICAgLy8gIG9uIHRoZSBtaW5TaXplLiBUaGUgdHJhbnNsYXRpb24gc2hvdWxkIGJlIHByb3BvcnRpb25hbCBiZXR3ZWVuIHRvcCBhbmQgYm90dG9tIGV4dGVuZFxuICAgICAgICAgICAgICAgIC8vICB0YWtlbiBmcm9tIHRoZSByZWR1Y3Rpb25cbiAgICAgICAgICAgICAgICBjb25zdCB0cmFuc2xhdGlvbiA9IHRvcEV4dGVuZCAqIHJlZHVjdGlvbiAvICh0b3BFeHRlbmQgKyBib3R0b21FeHRlbmQpO1xuICAgICAgICAgICAgICAgIGlmICh0cmFuc2xhdGlvbiA+IDApIHtcbiAgICAgICAgICAgICAgICAgICAgdHJhbnNmb3JtU3RyaW5nLnB1c2goYHRyYW5zbGF0ZVkoJHt0cmFuc2xhdGlvbn1weClgKTtcbiAgICAgICAgICAgICAgICB9XG4gICAgICAgICAgICB9XG4gICAgICAgIH1cbiAgICAgICAgZWxlbWVudC5zdHlsZS50cmFuc2Zvcm0gPSB0cmFuc2Zvcm1TdHJpbmcuam9pbignICcpLnRyaW0oKTtcbiAgICB9XG59XG4iXX0=