diff options
Diffstat (limited to 'web')
-rw-r--r-- | web/react/components/login.jsx | 101 | ||||
-rw-r--r-- | web/react/components/signup_user_complete.jsx | 28 | ||||
-rw-r--r-- | web/react/components/signup_user_oauth.jsx | 5 | ||||
-rw-r--r-- | web/react/pages/channel.jsx | 9 | ||||
-rw-r--r-- | web/react/stores/user_store.jsx | 14 | ||||
-rw-r--r-- | web/react/utils/async_client.jsx | 2 | ||||
-rw-r--r-- | web/react/utils/client.jsx | 15 | ||||
-rw-r--r-- | web/react/utils/constants.jsx | 2 | ||||
-rw-r--r-- | web/sass-files/sass/partials/_signup.scss | 17 | ||||
-rw-r--r-- | web/static/images/googleLogo.png | bin | 0 -> 3519 bytes | |||
-rw-r--r-- | web/web.go | 57 |
11 files changed, 149 insertions, 101 deletions
diff --git a/web/react/components/login.jsx b/web/react/components/login.jsx index eba4f06f4..f9eacf094 100644 --- a/web/react/components/login.jsx +++ b/web/react/components/login.jsx @@ -4,64 +4,62 @@ var utils = require('../utils/utils.jsx'); var client = require('../utils/client.jsx'); var UserStore = require('../stores/user_store.jsx'); -var TeamStore = require('../stores/team_store.jsx'); var BrowserStore = require('../stores/browser_store.jsx'); var Constants = require('../utils/constants.jsx'); module.exports = React.createClass({ handleSubmit: function(e) { e.preventDefault(); - var state = { } + var state = {}; - var name = this.props.teamName + var name = this.props.teamName; if (!name) { - state.server_error = "Bad team name" + state.serverError = 'Bad team name'; this.setState(state); return; } var email = this.refs.email.getDOMNode().value.trim(); if (!email) { - state.server_error = "An email is required" + state.serverError = 'An email is required'; this.setState(state); return; } var password = this.refs.password.getDOMNode().value.trim(); if (!password) { - state.server_error = "A password is required" + state.serverError = 'A password is required'; this.setState(state); return; } if (!BrowserStore.isLocalStorageSupported()) { - state.server_error = "This service requires local storage to be enabled. Please enable it or exit private browsing."; + state.serverError = 'This service requires local storage to be enabled. Please enable it or exit private browsing.'; this.setState(state); return; } - state.server_error = ""; + state.serverError = ''; this.setState(state); client.loginByEmail(name, email, password, - function(data) { + function loggedIn(data) { UserStore.setCurrentUser(data); UserStore.setLastEmail(email); - var redirect = utils.getUrlParameter("redirect"); + var redirect = utils.getUrlParameter('redirect'); if (redirect) { window.location.pathname = decodeURIComponent(redirect); } else { window.location.pathname = '/' + name + '/channels/town-square'; } - - }.bind(this), - function(err) { - if (err.message == "Login failed because email address has not been verified") { + }, + function loginFailed(err) { + if (err.message === 'Login failed because email address has not been verified') { window.location.href = '/verify_email?name=' + encodeURIComponent(name) + '&email=' + encodeURIComponent(email); return; } - state.server_error = err.message; + state.serverError = err.message; this.valid = false; this.setState(state); }.bind(this) @@ -71,10 +69,13 @@ module.exports = React.createClass({ return { }; }, render: function() { - var server_error = this.state.server_error ? <label className="control-label">{this.state.server_error}</label> : null; - var priorEmail = UserStore.getLastEmail() !== "undefined" ? UserStore.getLastEmail() : "" + var serverError; + if (this.state.serverError) { + serverError = <label className='control-label'>{this.state.serverError}</label>; + } + var priorEmail = UserStore.getLastEmail(); - var emailParam = utils.getUrlParameter("email"); + var emailParam = utils.getUrlParameter('email'); if (emailParam) { priorEmail = decodeURIComponent(emailParam); } @@ -84,50 +85,62 @@ module.exports = React.createClass({ var focusEmail = false; var focusPassword = false; - if (priorEmail != "") { + if (priorEmail !== '') { focusPassword = true; } else { focusEmail = true; } - var auth_services = JSON.parse(this.props.authServices); + var authServices = JSON.parse(this.props.authServices); - var login_message; - if (auth_services.indexOf("gitlab") >= 0) { - login_message = ( - <div className="form-group form-group--small"> - <span><a href={"/"+teamName+"/login/gitlab"}>{"Log in with GitLab"}</a></span> + var loginMessage = []; + if (authServices.indexOf(Constants.GITLAB_SERVICE) >= 0) { + loginMessage.push( + <div className='form-group form-group--small'> + <span><a href={'/' + teamName + '/login/gitlab'}>{'Log in with GitLab'}</a></span> </div> ); } + if (authServices.indexOf(Constants.GOOGLE_SERVICE) >= 0) { + loginMessage.push( + <div className='form-group form-group--small'> + <span><a href={'/' + teamName + '/login/google'}>{'Log in with Google'}</a></span> + </div> + ); + } + + var errorClass = ''; + if (serverError) { + errorClass = ' has-error'; + } return ( - <div className="signup-team__container"> - <h5 className="margin--less">Sign in to:</h5> - <h2 className="signup-team__name">{ teamDisplayName }</h2> - <h2 className="signup-team__subdomain">on { config.SiteName }</h2> + <div className='signup-team__container'> + <h5 className='margin--less'>Sign in to:</h5> + <h2 className='signup-team__name'>{teamDisplayName}</h2> + <h2 className='signup-team__subdomain'>on {config.SiteName}</h2> <form onSubmit={this.handleSubmit}> - <div className={server_error ? 'form-group has-error' : 'form-group'}> - { server_error } + <div className={'form-group' + errorClass}> + {serverError} </div> - <div className={server_error ? 'form-group has-error' : 'form-group'}> - <input autoFocus={focusEmail} type="email" className="form-control" name="email" defaultValue={priorEmail} ref="email" placeholder="Email" /> + <div className={'form-group' + errorClass}> + <input autoFocus={focusEmail} type='email' className='form-control' name='email' defaultValue={priorEmail} ref='email' placeholder='Email' /> </div> - <div className={server_error ? 'form-group has-error' : 'form-group'}> - <input autoFocus={focusPassword} type="password" className="form-control" name="password" ref="password" placeholder="Password" /> + <div className={'form-group' + errorClass}> + <input autoFocus={focusPassword} type='password' className='form-control' name='password' ref='password' placeholder='Password' /> </div> - <div className="form-group"> - <button type="submit" className="btn btn-primary">Sign in</button> + <div className='form-group'> + <button type='submit' className='btn btn-primary'>Sign in</button> </div> - { login_message } - <div className="form-group margin--extra form-group--small"> - <span><a href="/find_team">{"Find other " + strings.TeamPlural}</a></span> + {loginMessage} + <div className='form-group margin--extra form-group--small'> + <span><a href='/find_team'>{'Find other ' + strings.TeamPlural}</a></span> </div> - <div className="form-group"> - <a href={"/" + teamName + "/reset_password"}>I forgot my password</a> + <div className='form-group'> + <a href={'/' + teamName + '/reset_password'}>I forgot my password</a> </div> - <div className="margin--extra"> - <span>{"Want to create your own " + strings.Team + "?"} <a href="/" className="signup-team-login">Sign up now</a></span> + <div className='margin--extra'> + <span>{'Want to create your own ' + strings.Team + '?'} <a href='/' className='signup-team-login'>Sign up now</a></span> </div> </form> </div> diff --git a/web/react/components/signup_user_complete.jsx b/web/react/components/signup_user_complete.jsx index b21553d8a..0393e0413 100644 --- a/web/react/components/signup_user_complete.jsx +++ b/web/react/components/signup_user_complete.jsx @@ -5,6 +5,7 @@ var utils = require('../utils/utils.jsx'); var client = require('../utils/client.jsx'); var UserStore = require('../stores/user_store.jsx'); var BrowserStore = require('../stores/browser_store.jsx'); +var Constants = require('../utils/constants.jsx'); module.exports = React.createClass({ handleSubmit: function(e) { @@ -151,19 +152,34 @@ module.exports = React.createClass({ // add options to log in using another service var authServices = JSON.parse(this.props.authServices); - var signupMessage = null; - if (authServices.indexOf('gitlab') >= 0) { - signupMessage = ( - <div> + var signupMessage = []; + if (authServices.indexOf(Constants.GITLAB_SERVICE) >= 0) { + signupMessage.push( <a className='btn btn-custom-login gitlab' href={'/' + this.props.teamName + '/signup/gitlab' + window.location.search}> <span className='icon' /> <span>with GitLab</span> </a> + ); + } + + if (authServices.indexOf(Constants.GOOGLE_SERVICE) >= 0) { + signupMessage.push( + <a className='btn btn-custom-login google' href={'/' + this.props.teamName + '/signup/google' + window.location.search}> + <span className='icon' /> + <span>with Google</span> + </a> + ); + } + + if (signupMessage.length > 0) { + signupMessage = ( + <div> + {signupMessage} <div className='or__container'> <span>or</span> </div> - </div> - ); + </div> + ); } var termsDisclaimer = null; diff --git a/web/react/components/signup_user_oauth.jsx b/web/react/components/signup_user_oauth.jsx index 6322aedee..8b2800bde 100644 --- a/web/react/components/signup_user_oauth.jsx +++ b/web/react/components/signup_user_oauth.jsx @@ -33,7 +33,10 @@ module.exports = React.createClass({ client.createUser(user, "", "", function(data) { client.track('signup', 'signup_user_oauth_02'); - window.location.href = '/' + this.props.teamName + '/login/'+user.auth_service; + UserStore.setCurrentUser(data); + UserStore.setLastEmail(data.email); + + window.location.href = '/' + this.props.teamName + '/login/' + user.auth_service + '?login_hint=' + user.email; }.bind(this), function(err) { this.state.server_error = err.message; diff --git a/web/react/pages/channel.jsx b/web/react/pages/channel.jsx index 6e4baa582..0eeb5fb65 100644 --- a/web/react/pages/channel.jsx +++ b/web/react/pages/channel.jsx @@ -55,14 +55,15 @@ global.window.setup_channel_page = function(team_name, team_type, team_id, chann id: team_id }); + // ChannelLoader must be rendered first React.render( - <ErrorBar/>, - document.getElementById('error_bar') + <ChannelLoader/>, + document.getElementById('channel_loader') ); React.render( - <ChannelLoader/>, - document.getElementById('channel_loader') + <ErrorBar/>, + document.getElementById('error_bar') ); React.render( diff --git a/web/react/stores/user_store.jsx b/web/react/stores/user_store.jsx index f8616c6ab..248495dac 100644 --- a/web/react/stores/user_store.jsx +++ b/web/react/stores/user_store.jsx @@ -4,6 +4,7 @@ var AppDispatcher = require('../dispatcher/app_dispatcher.jsx'); var EventEmitter = require('events').EventEmitter; var assign = require('object-assign'); +var client = require('../utils/client.jsx'); var Constants = require('../utils/constants.jsx'); var ActionTypes = Constants.ActionTypes; @@ -72,7 +73,7 @@ var UserStore = assign({}, EventEmitter.prototype, { BrowserStore.setGlobalItem('current_user_id', id); } }, - getCurrentId: function() { + getCurrentId: function(skipFetch) { var currentId = this.gCurrentId; if (currentId == null) { @@ -80,6 +81,17 @@ var UserStore = assign({}, EventEmitter.prototype, { this.gCurrentId = currentId; } + // this is a special case to force fetch the + // current user if it's missing + // it's synchronous to block rendering + if (currentId == null && !skipFetch) { + var me = client.getMeSynchronous(); + if (me != null) { + this.setCurrentUser(me); + currentId = me.id; + } + } + return currentId; }, getCurrentUser: function() { diff --git a/web/react/utils/async_client.jsx b/web/react/utils/async_client.jsx index 0b87bbd7b..8b6d821d6 100644 --- a/web/react/utils/async_client.jsx +++ b/web/react/utils/async_client.jsx @@ -396,7 +396,7 @@ function getMe() { } callTracker.getMe = utils.getTimestamp(); - client.getMe( + client.getMeSynchronous( function(data, textStatus, xhr) { callTracker.getMe = 0; diff --git a/web/react/utils/client.jsx b/web/react/utils/client.jsx index 5aab80d01..ce044457a 100644 --- a/web/react/utils/client.jsx +++ b/web/react/utils/client.jsx @@ -279,24 +279,33 @@ module.exports.getAudits = function(userId, success, error) { }); }; -module.exports.getMe = function(success, error) { +module.exports.getMeSynchronous = function(success, error) { + var currentUser = null; $.ajax({ + async: false, url: "/api/v1/users/me", dataType: 'json', contentType: 'application/json', type: 'GET', - success: success, + success: function gotUser(data, textStatus, xhr) { + currentUser = data; + if (success) { + success(data, textStatus, xhr); + } + }, error: function(xhr, status, err) { var ieChecker = window.navigator.userAgent; // This and the condition below is used to check specifically for browsers IE10 & 11 to suppress a 200 'OK' error from appearing on login if (xhr.status != 200 || !(ieChecker.indexOf("Trident/7.0") > 0 || ieChecker.indexOf("Trident/6.0") > 0)) { if (error) { - e = handleError("getMe", xhr, status, err); + e = handleError('getMeSynchronous', xhr, status, err); error(e); }; }; } }); + + return currentUser; }; module.exports.inviteMembers = function(data, success, error) { diff --git a/web/react/utils/constants.jsx b/web/react/utils/constants.jsx index 508de9185..1fe0faccf 100644 --- a/web/react/utils/constants.jsx +++ b/web/react/utils/constants.jsx @@ -58,6 +58,8 @@ module.exports = { THUMBNAIL_HEIGHT: 100, DEFAULT_CHANNEL: 'town-square', OFFTOPIC_CHANNEL: 'off-topic', + GITLAB_SERVICE: 'gitlab', + GOOGLE_SERVICE: 'google', POST_CHUNK_SIZE: 60, MAX_POST_CHUNKS: 3, RESERVED_TEAM_NAMES: [ diff --git a/web/sass-files/sass/partials/_signup.scss b/web/sass-files/sass/partials/_signup.scss index 3a6f73316..ddf2aab88 100644 --- a/web/sass-files/sass/partials/_signup.scss +++ b/web/sass-files/sass/partials/_signup.scss @@ -186,6 +186,23 @@ display: inline-block; } } + &.google { + background: #dd4b39; + &:hover { + background: darken(#dd4b39, 10%); + } + span { + vertical-align: middle; + } + .icon { + background: url("../images/googleLogo.png"); + width: 18px; + height: 18px; + margin-right: 8px; + @include background-size(100% 100%); + display: inline-block; + } + } } &.btn-default { color: #444; diff --git a/web/static/images/googleLogo.png b/web/static/images/googleLogo.png Binary files differnew file mode 100644 index 000000000..932d755db --- /dev/null +++ b/web/static/images/googleLogo.png diff --git a/web/web.go b/web/web.go index 8b329c149..d6f8d553b 100644 --- a/web/web.go +++ b/web/web.go @@ -53,13 +53,13 @@ func InitWeb() { mainrouter.Handle("/{team:[A-Za-z0-9-]+(__)?[A-Za-z0-9-]+}/", api.AppHandler(login)).Methods("GET") mainrouter.Handle("/{team:[A-Za-z0-9-]+(__)?[A-Za-z0-9-]+}/login", api.AppHandler(login)).Methods("GET") - // Bug in gorilla.mux pervents us from using regex here. + // Bug in gorilla.mux prevents us from using regex here. mainrouter.Handle("/{team}/login/{service}", api.AppHandler(loginWithOAuth)).Methods("GET") mainrouter.Handle("/login/{service:[A-Za-z]+}/complete", api.AppHandlerIndependent(loginCompleteOAuth)).Methods("GET") mainrouter.Handle("/{team:[A-Za-z0-9-]+(__)?[A-Za-z0-9-]+}/logout", api.AppHandler(logout)).Methods("GET") mainrouter.Handle("/{team:[A-Za-z0-9-]+(__)?[A-Za-z0-9-]+}/reset_password", api.AppHandler(resetPassword)).Methods("GET") - // Bug in gorilla.mux pervents us from using regex here. + // Bug in gorilla.mux prevents us from using regex here. mainrouter.Handle("/{team}/channels/{channelname}", api.UserRequired(getChannel)).Methods("GET") // Anything added here must have an _ in it so it does not conflict with team names @@ -67,7 +67,7 @@ func InitWeb() { mainrouter.Handle("/signup_user_complete/", api.AppHandlerIndependent(signupUserComplete)).Methods("GET") mainrouter.Handle("/signup_team_confirm/", api.AppHandlerIndependent(signupTeamConfirm)).Methods("GET") - // Bug in gorilla.mux pervents us from using regex here. + // Bug in gorilla.mux prevents us from using regex here. mainrouter.Handle("/{team}/signup/{service}", api.AppHandler(signupWithOAuth)).Methods("GET") mainrouter.Handle("/signup/{service:[A-Za-z]+}/complete", api.AppHandlerIndependent(signupCompleteOAuth)).Methods("GET") @@ -496,7 +496,7 @@ func signupWithOAuth(c *api.Context, w http.ResponseWriter, r *http.Request) { redirectUri := c.GetSiteURL() + "/signup/" + service + "/complete" - api.GetAuthorizationCode(c, w, r, teamName, service, redirectUri) + api.GetAuthorizationCode(c, w, r, teamName, service, redirectUri, "") } func signupCompleteOAuth(c *api.Context, w http.ResponseWriter, r *http.Request) { @@ -505,26 +505,10 @@ func signupCompleteOAuth(c *api.Context, w http.ResponseWriter, r *http.Request) code := r.URL.Query().Get("code") state := r.URL.Query().Get("state") - teamName := r.FormValue("team") - uri := c.GetSiteURL() + "/signup/" + service + "/complete?team=" + teamName + uri := c.GetSiteURL() + "/signup/" + service + "/complete" - if len(teamName) == 0 { - c.Err = model.NewAppError("signupCompleteOAuth", "Invalid team name", "team_name="+teamName) - c.Err.StatusCode = http.StatusBadRequest - return - } - - // Make sure team exists - var team *model.Team - if result := <-api.Srv.Store.Team().GetByName(teamName); result.Err != nil { - c.Err = result.Err - return - } else { - team = result.Data.(*model.Team) - } - - if body, err := api.AuthorizeOAuthUser(service, code, state, uri); err != nil { + if body, team, err := api.AuthorizeOAuthUser(service, code, state, uri); err != nil { c.Err = err return } else { @@ -532,6 +516,9 @@ func signupCompleteOAuth(c *api.Context, w http.ResponseWriter, r *http.Request) if service == model.USER_AUTH_SERVICE_GITLAB { glu := model.GitLabUserFromJson(body) user = model.UserFromGitLabUser(glu) + } else if service == model.USER_AUTH_SERVICE_GOOGLE { + gu := model.GoogleUserFromJson(body) + user = model.UserFromGoogleUser(gu) } if user == nil { @@ -563,6 +550,7 @@ func loginWithOAuth(c *api.Context, w http.ResponseWriter, r *http.Request) { params := mux.Vars(r) service := params["service"] teamName := params["team"] + loginHint := r.URL.Query().Get("login_hint") if len(teamName) == 0 { c.Err = model.NewAppError("loginWithOAuth", "Invalid team name", "team_name="+teamName) @@ -578,7 +566,7 @@ func loginWithOAuth(c *api.Context, w http.ResponseWriter, r *http.Request) { redirectUri := c.GetSiteURL() + "/login/" + service + "/complete" - api.GetAuthorizationCode(c, w, r, teamName, service, redirectUri) + api.GetAuthorizationCode(c, w, r, teamName, service, redirectUri, loginHint) } func loginCompleteOAuth(c *api.Context, w http.ResponseWriter, r *http.Request) { @@ -587,26 +575,10 @@ func loginCompleteOAuth(c *api.Context, w http.ResponseWriter, r *http.Request) code := r.URL.Query().Get("code") state := r.URL.Query().Get("state") - teamName := r.FormValue("team") - uri := c.GetSiteURL() + "/login/" + service + "/complete?team=" + teamName - - if len(teamName) == 0 { - c.Err = model.NewAppError("loginCompleteOAuth", "Invalid team name", "team_name="+teamName) - c.Err.StatusCode = http.StatusBadRequest - return - } - - // Make sure team exists - var team *model.Team - if result := <-api.Srv.Store.Team().GetByName(teamName); result.Err != nil { - c.Err = result.Err - return - } else { - team = result.Data.(*model.Team) - } + uri := c.GetSiteURL() + "/login/" + service + "/complete" - if body, err := api.AuthorizeOAuthUser(service, code, state, uri); err != nil { + if body, team, err := api.AuthorizeOAuthUser(service, code, state, uri); err != nil { c.Err = err return } else { @@ -614,6 +586,9 @@ func loginCompleteOAuth(c *api.Context, w http.ResponseWriter, r *http.Request) if service == model.USER_AUTH_SERVICE_GITLAB { glu := model.GitLabUserFromJson(body) authData = glu.GetAuthData() + } else if service == model.USER_AUTH_SERVICE_GOOGLE { + gu := model.GoogleUserFromJson(body) + authData = gu.GetAuthData() } if len(authData) == 0 { |