Skip to content

Revamp of users package

Miloš Stanić edited this page Jan 23, 2015 · 2 revisions

In developing my project I have encountered a need to override default mean.io login and register screens because they have been customized with Ninja logo, and also, because I need the login and register to comply with my application design. Furthermore, my application design needs to display login and register forms in popup modals. I am sure almost all developers need login and register forms customized to their apps' design.

Putting a login form into a modal has proven to be impossible, due to the fact, that on unsuccessful login, mean.io users package changes state to auth.login which displays the default mean.io login form beneath my popup modal.

After discussing with Andrija Petrovic about best practices in AngularJS I have decided to move login(), register(), and other functions into the MeanUser service which can be reused by my own app. Also, I needed a way to stop mean.io from changing state to auth.loginon failed logins, and yet be able to display errors in my login popup modal. That's why I introduced $rootScope events being emitted on login fail and register error. Also, the users package was using window global variable, and I changed that to $window as recommended by AngularJS.

One other bug that popped up during the redesign of users package was the fact that AngularJS does not send req.get('referer') with HTTP requests, but only with HTTPS requests, and what's more, it is impossible to change the request header on $http to manually inject the referrer into the request header.

Why has this behavior remained unnoticed so far? The intended behavior of login() is to redirect users back to referring URL after successful login. But since the default installation of mean.io has no URLs available other than '/', it has slipped under the radar.

I have tested the redesigned users package with the 0.4.3, and it works both in default mean.io setting, and in my app as I need it.

However, the users package login() method is full of hacks due to the need of the mean-admin package to reload page in order to display admin menu. It is my strong suggestion to the authors of mean-admin package to reconsider having the admin menu displayed as a vertical bar which is superimposed over the default view. I would suggest mean-admin package to simply add another menu item into the default view header, just as other packages do. One more reason for this change is that if the application developer should decide to use something else instead of Twitter Bootstrap, the admin menu looks really ugly. Also, the admin menu really interferes with the layout of any app whether it is using Twitter Bootstrap or not.

Thanks for your attention.

Clone this wiki locally