Tuesday, April 16, 2019

Google Summer of Code - page behavior fix

Currently on https://summerofcode.withgoogle.com/organizations clicking one of the organization boxes makes a larger box with more information expand in the space below the organization box.  When that large box is dismissed, the user gets sent back to the top of the page.  I think the box should collapse, but position on the page should stay the same.

I tracked down the cause down to a line in the app.js.  As far as I could find, the original source was not publicly available, so I worked off of the minified version.  For clarity, I will prettify the code here:

OrganizationsListCtrl.prototype.deselectOrganization = function() {
    var orgList = this;
    orgList.selectedOrg = null,
    orgList.selectedOrgElement = null,
    orgList.selectedOrgIndex = -1,
    orgList.location_.hash(null)
}

Removing the highlighted line fixes the problem.

I am not really familiar with Angular, which is the framework the site uses, but from what I can tell, calling location_.hash() will cause an automatic scroll to an element marked with the provided value.  If that value is null, the automatic scroll is to the top of the page.

I will be attempting to pass this information on to someone involved with this page and see what happens.