Sundsvallskommun / OpenEMap-WebUserInterface

Open eMap user interface for the main map client
GNU Affero General Public License v3.0
4 stars 5 forks source link

GeoExt.window.Popup - change anchor positioning calculation #125

Closed anderserla closed 9 years ago

anderserla commented 9 years ago

Change anchor positioning for GeoExt.window.Popup to take border-size into account. Changes made in Popup.js - row 328-344

            if (ancPos.indexOf("bottom") > -1 || locationPx.y > mapBox.height / 2) {
                // bottom
                this.anc.removeCls("top");
                // position the anchor
                var popupHeight = this.getHeight();
                if (isNaN(popupHeight) === false) {
                    this.anc.setTop((popupHeight-1-this.getBorderPadding().afterX) + "px");
                }
                top -= elSize.height + ancSize.height;

            } else {
                // top
                this.anc.removeCls("top");
                // remove eventually set top property (bottom-case)
                this.anc.setTop(-ancSize.height-1-this.getBorderPadding().beforeX + "px");
                top += ancSize.height; // ok
            }
anderserla commented 9 years ago

I've added a function for creating a "popupLayer" that is used to overlay objects on top of the map and making them clickable. The click opens a popup window.

The anchor of the popup window does not take into account the border width when calculating its position.

I've made a change in the GeoExt.window.Popup, to take this into account. Could @sweco-sebhar please check my code changes and post them as a pull request to the GeoExt community?

There is a sample in the develop fork under examples/popupLayer.html

ghost commented 9 years ago

https://github.com/geoext/geoext2/pull/293

ghost commented 9 years ago

getBorderPadding is an undocumented method in Ext JS 4 / 5 which makes the code unlikely to be accepted.

anderserla commented 9 years ago

Is there another way to accomplish it?

ghost commented 9 years ago

Not sure. They want more information (screenshots visualizing the problem/solution) and if we can motivate a fix perhaps we can find an acceptable solution but that will require at least a few hours of work. How much time can I spend on this issue?

anderserla commented 9 years ago

Put 2 hours to start with. See my example

anderserla commented 9 years ago

Aslo has to change calculation of left postition:

            if (ancPos.indexOf("right") > -1 || locationPx.x > mapBox.width / 2) {
                // right
                this.anc.addCls("right");
                var ancRight = this.el.getX(true) + elSize.width -
                               this.anc.getX(true) - ancSize.width;
                left -= elSize.width - ancRight - ancSize.width / 2;
            } else {
                // left
                this.anc.removeCls("right");
                var ancLeft = this.anc.getLeft(true);
                left -= ancLeft + this.getBorderPadding().beforeY + ancSize.width / 2;
            }

            if (ancPos.indexOf("bottom") > -1 || locationPx.y > mapBox.height / 2) {
                // bottom
                this.anc.removeCls("top");
                // position the anchor
                var popupHeight = this.getHeight();
                if (isNaN(popupHeight) === false) {
                    this.anc.setTop((popupHeight-1-this.getBorderPadding().afterX) + "px");
                }
                top -= elSize.height + ancSize.height;

            } else {
                // top
                this.anc.removeCls("top");
                // remove eventually set top property (bottom-case)
                this.anc.setTop(-ancSize.height-1-this.getBorderPadding().beforeX + "px");
                top += ancSize.height; // ok
            }
anderserla commented 9 years ago

Resolved it by forking GeoExt2 repo and building it.