So once again, I modified the source code to make it possible to resize my dialogs.
I strongly suspect that the developers are unable to see the problem because they work with Apple computers, with OSX probably processing events in a slightly different manner than Windows.
The current logic is as follows:
- when resizing is initialized, memorize initial values for pageX and pageY;
- for each motion of the mouse thereafter (so for each pixel),
- get the new pageX and pageY values,
- calculate a delta for both relative to the initial values;
- add the deltas to width and height, as long as they don't fall below the minimum value for each.
- replace the initial values of pageX and pageY with the current values just used.
This does not work. It works with horizontal motions, but not with vertical motions. To resize vertically, one has to move the mouse very fast, and the result is more or less random.
The logic should be as follows:
- when resizing is initialized, memorize initial values for pageX and pageY. These values are left unchanged thereafter. Also memorize initial width and height of dialog.
- then for each motion of the mouse thereafter:
- get new pageX and pageY values;
- calculate delta for both from initial values (not from more recent values stored later);
- add to original width and height of dialog, only if result is above minimum value for each.
I modify lines 168 and following of dialog.js as follows each time I update Primeng. I'd like to stop having to do this!!
Code: Select all
Dialog.prototype.initResize = function (event) {
if (this.resizable) {
this.resizing = true;
this.initPageX = event.pageX;
this.initPageY = event.pageY;
var container = this.el.nativeElement.children[0];
this.initWidth = this.domHandler.getOuterWidth(container);
this.initHeight = this.domHandler.getHeight(this.contentContainer);
}
};
Dialog.prototype.onResize = function (event) {
if (this.resizing) {
var container = this.el.nativeElement.children[0];
var deltaX = event.pageX - this.initPageX;
var deltaY = event.pageY - this.initPageY;
var newWidth = this.initWidth + deltaX;
var newHeight = this.initHeight + deltaY;
if (newWidth > this.minWidth)
container.style.width = newWidth + 'px';
if (newHeight > this.minHeight)
this.contentContainer.style.height = newHeight + 'px';
}
};