Merge pull request #10807 from mrclay/10805_login

chore(js): improves ajax login workflow

actions/login.php

@@ -85,4 +85,9 @@
 	'forward' => $forward_url,
 ];
 
+if (elgg_is_xhr()) {
+	// Hold the system messages until the client refreshes the page.
+	set_input('elgg_fetch_messages', 0);
+}
+
 return elgg_ok_response($output, $message, $forward_url);

engine/classes/Elgg/Ajax/Service.php

@@ -63,15 +63,8 @@ public function __construct(PluginHooksService $hooks, SystemMessagesService $ms
 		$this->input = $input;
 		$this->amd_config = $amdConfig;
 
-		if ($this->input->get('elgg_fetch_messages', true)) {
-			$message_filter = [$this, 'appendMessages'];
-			$this->hooks->registerHandler(AjaxResponse::RESPONSE_HOOK, 'all', $message_filter, 999);
-		}
-
-		if ($this->input->get('elgg_fetch_deps', true)) {
-			$deps_filter = [$this, 'appendDeps'];
-			$this->hooks->registerHandler(AjaxResponse::RESPONSE_HOOK, 'all', $deps_filter, 999);
-		}
+		$message_filter = [$this, 'prepareResponse'];
+		$this->hooks->registerHandler(AjaxResponse::RESPONSE_HOOK, 'all', $message_filter, 999);
 	}
 
 	/**
@@ -228,7 +221,7 @@ private function buildHttpResponse(AjaxResponse $api_response, $allow_removing_h
 	}
 
 	/**
-	 * Send system messages back with the response
+	 * Prepare the response with additional metadata, like system messages and required AMD modules
 	 *
 	 * @param string       $hook     "ajax_response"
 	 * @param string       $type     "all"
@@ -239,31 +232,19 @@ private function buildHttpResponse(AjaxResponse $api_response, $allow_removing_h
 	 * @access private
 	 * @internal
 	 */
-	public function appendMessages($hook, $type, $response, $params) {
+	public function prepareResponse($hook, $type, $response, $params) {
 		if (!$response instanceof AjaxResponse) {
 			return;
 		}
-		$response->getData()->_elgg_msgs = (object)$this->msgs->dumpRegister();
-		return $response;
-	}
 
-	/**
-	 * Send required AMD modules list back with the response
-	 *
-	 * @param string       $hook     "ajax_response"
-	 * @param string       $type     "all"
-	 * @param AjaxResponse $response Ajax response
-	 * @param array        $params   Hook params
-	 *
-	 * @return AjaxResponse
-	 * @access private
-	 * @internal
-	 */
-	public function appendDeps($hook, $type, $response, $params) {
-		if (!$response instanceof AjaxResponse) {
-			return;
+		if ($this->input->get('elgg_fetch_messages', true)) {
+			$response->getData()->_elgg_msgs = (object)$this->msgs->dumpRegister();
+		}
+
+		if ($this->input->get('elgg_fetch_deps', true)) {
+			$response->getData()->_elgg_deps = (array) $this->amd_config->getDependencies();
 		}
-		$response->getData()->_elgg_deps = (array) $this->amd_config->getDependencies();
+
 		return $response;
 	}
 

views/default/forms/login.js

@@ -1,23 +1,32 @@
-define(['jquery', 'elgg', 'elgg/Ajax'], function($, elgg, Ajax) {
-	var ajax = new Ajax();
-
+define(function(require) {
+	var $ = require('jquery');
+	var elgg = require('elgg');
+	var Ajax = require('elgg/Ajax');
+	var spinner = require('elgg/spinner');
+
+	// manage Spinner manually
+	var ajax = new Ajax(false);
+
 	$(document).on('submit', '.elgg-form-login', function(e) {
 		var $form = $(this);
 
+		spinner.start();
 		ajax.action($form.prop('action'), {
 			data: ajax.objectify($form)
-		}).success(function(json, status, xhr) {
-			if (typeof json.forward !== 'undefined') {
+		}).done(function(json, status, jqXHR) {
+			if (jqXHR.AjaxData.status == -1) {
+				$('input[name=password]', $form).val('').focus();
+				spinner.stop();
+				return;
+			}
+
+			if (json && (typeof json.forward === 'string')) {
 				elgg.forward(json.forward);
-			} else if (json === '') {
-				// BC fallback if action did not return a forward url
-				// elgg_ok_response will have the forward url
-				// elgg_error_response will have the error text
-				// everything else is unknown, so forward
-				elgg.forward();				
+			} else {
+				elgg.forward();
 			}
 		});
-		
+
 		e.preventDefault();
 	});
 });