feat: login and signup handlers

assets/scripts/custom-signup.js

@@ -0,0 +1,13 @@
+import Typed from "typed.js";
+
+document.addEventListener('DOMContentLoaded', function () {
+	let options = {
+		strings: ['open textbook', 'scholarly monograph', 'world-changing manifesto', 'graduate thesis', 'reference guide', 'essay collection', 'student portfolio', 'novel', 'position paper', 'handbook', 'magnum opus', 'research report', 'daybook', 'collected works'],
+		typeSpeed: 80,
+		backSpeed: 40,
+		backDelay: 400,
+		loop: true,
+	};
+
+	new Typed('#typed', options);
+});

assets/styles/layouts/_page-register.scss

@@ -95,6 +95,7 @@ $body-font: 'Spectral', serif;
     text-decoration: none;
     text-align: left;
     text-transform: none;
+    cursor: pointer;
 
     svg {
       fill: $dark-blue;
@@ -172,6 +173,7 @@ $body-font: 'Spectral', serif;
       padding: .5rem 1.5rem;
       margin-bottom: .5rem;
       border-radius: .5rem;
+      cursor: pointer;
     }
 
     &--input-description {

dist/mix-manifest.json

@@ -1,19 +1,20 @@
 {
-    "/scripts/aldine.js": "/scripts/aldine.js?id=70343c46d6d5d2b5375d",
-    "/scripts/call-to-action.js": "/scripts/call-to-action.js?id=33370b66c7af12320fc0",
-    "/scripts/catalog-admin.js": "/scripts/catalog-admin.js?id=e8d84fb090536b8e49e9",
-    "/scripts/customizer.js": "/scripts/customizer.js?id=14dca3944228dd789c27",
-    "/scripts/customizer-toggle.js": "/scripts/customizer-toggle.js?id=c31594589675d7c5662a",
-    "/scripts/page-section.js": "/scripts/page-section.js?id=19d5c30146ea1a763bcf",
-    "/styles/aldine.css": "/styles/aldine.css?id=c245ec24d4b985c18980",
-    "/styles/editor.css": "/styles/editor.css?id=b7c2449babe566571767",
-    "/fonts/pressbooks-theme.woff": "/fonts/pressbooks-theme.woff?id=2a7aae81673f4707bbe7",
-    "/images/banner.jpg": "/images/banner.jpg?id=04a813e0b4f94ddfef19",
-    "/images/catalog-header.jpg": "/images/catalog-header.jpg?id=223b9f7a23985f2a72df",
-    "/images/header.jpg": "/images/header.jpg?id=c6712212b6aa749cf1cf",
-    "/images/left-arrow.svg": "/images/left-arrow.svg?id=91d479e2d001857a3ee4",
-    "/images/logo.svg": "/images/logo.svg?id=d71cb98d33ef823ffd27",
-    "/images/pb.svg": "/images/pb.svg?id=c08fb158c15a470648a7",
-    "/images/right-arrow.svg": "/images/right-arrow.svg?id=ee2d7230318ea54ae20b",
-    "/images/yt_icon_mono_dark.png": "/images/yt_icon_mono_dark.png?id=ee68b73409979a929440"
+    "/scripts/aldine.js": "/scripts/aldine.js",
+    "/scripts/call-to-action.js": "/scripts/call-to-action.js",
+    "/scripts/catalog-admin.js": "/scripts/catalog-admin.js",
+    "/scripts/customizer.js": "/scripts/customizer.js",
+    "/scripts/customizer-toggle.js": "/scripts/customizer-toggle.js",
+    "/scripts/page-section.js": "/scripts/page-section.js",
+    "/scripts/custom-signup.js": "/scripts/custom-signup.js",
+    "/styles/aldine.css": "/styles/aldine.css",
+    "/styles/editor.css": "/styles/editor.css",
+    "/fonts/pressbooks-theme.woff": "/fonts/pressbooks-theme.woff",
+    "/images/banner.jpg": "/images/banner.jpg",
+    "/images/catalog-header.jpg": "/images/catalog-header.jpg",
+    "/images/header.jpg": "/images/header.jpg",
+    "/images/left-arrow.svg": "/images/left-arrow.svg",
+    "/images/logo.svg": "/images/logo.svg",
+    "/images/pb.svg": "/images/pb.svg",
+    "/images/right-arrow.svg": "/images/right-arrow.svg",
+    "/images/yt_icon_mono_dark.png": "/images/yt_icon_mono_dark.png"
 }

dist/scripts/customizer-toggle.js

@@ -1 +1,32 @@
-document.addEventListener("DOMContentLoaded",(function(){var t=document.getElementById("_customize-input-pb_network_contact_form"),e=document.getElementById("customize-control-pb_network_contact_email"),s=document.getElementById("customize-control-pb_network_contact_link"),n=document.getElementById("customize-control-pb_network_contact_form_title");function c(){!1===t.checked?(e.classList.add("hidden"),e.style.cssText=null,n.classList.add("hidden"),n.style.cssText=null,s.classList.remove("hidden"),s.style.cssText="display: list-item;"):(e.classList.remove("hidden"),e.style.cssText="display: list-item;",n.classList.remove("hidden"),n.style.cssText="display: list-item;",s.classList.add("hidden"),s.style.cssText=null)}t.addEventListener("click",c),c()}));
+/*
+ * ATTENTION: An "eval-source-map" devtool has been used.
+ * This devtool is neither made for production nor for readable output files.
+ * It uses "eval()" calls to create a separate source file with attached SourceMaps in the browser devtools.
+ * If you are trying to read the output file, select a different devtool (https://webpack.js.org/configuration/devtool/)
+ * or disable the default devtool with "devtool: false".
+ * If you are looking for production-ready output files, see mode: "production" (https://webpack.js.org/configuration/mode/).
+ */
+/******/ (function() { // webpackBootstrap
+/******/ 	var __webpack_modules__ = ({
+
+/***/ "./assets/scripts/customizer-toggle.js":
+/*!*********************************************!*\
+  !*** ./assets/scripts/customizer-toggle.js ***!
+  \*********************************************/
+/***/ (function() {
+
+eval("document.addEventListener('DOMContentLoaded', function () {\n  var checkbox = document.getElementById('_customize-input-pb_network_contact_form');\n  var email = document.getElementById('customize-control-pb_network_contact_email');\n  var link = document.getElementById('customize-control-pb_network_contact_link');\n  var title = document.getElementById('customize-control-pb_network_contact_form_title');\n  checkbox.addEventListener('click', toggleReadOnly);\n  /**\n   *\n   */\n\n  function toggleReadOnly() {\n    if (checkbox.checked === false) {\n      email.classList.add('hidden');\n      email.style.cssText = null;\n      title.classList.add('hidden');\n      title.style.cssText = null;\n      link.classList.remove('hidden');\n      link.style.cssText = 'display: list-item;';\n    } else {\n      email.classList.remove('hidden');\n      email.style.cssText = 'display: list-item;';\n      title.classList.remove('hidden');\n      title.style.cssText = 'display: list-item;';\n      link.classList.add('hidden');\n      link.style.cssText = null;\n    }\n  }\n\n  toggleReadOnly();\n});//# sourceURL=[module]\n//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIndlYnBhY2s6Ly9AcHJlc3Nib29rcy9wcmVzc2Jvb2tzLWFsZGluZS8uL2Fzc2V0cy9zY3JpcHRzL2N1c3RvbWl6ZXItdG9nZ2xlLmpzP2U0Y2IiXSwibmFtZXMiOlsiZG9jdW1lbnQiLCJhZGRFdmVudExpc3RlbmVyIiwiY2hlY2tib3giLCJnZXRFbGVtZW50QnlJZCIsImVtYWlsIiwibGluayIsInRpdGxlIiwidG9nZ2xlUmVhZE9ubHkiLCJjaGVja2VkIiwiY2xhc3NMaXN0IiwiYWRkIiwic3R5bGUiLCJjc3NUZXh0IiwicmVtb3ZlIl0sIm1hcHBpbmdzIjoiQUFBQUEsUUFBUSxDQUFDQyxnQkFBVCxDQUEyQixrQkFBM0IsRUFBK0MsWUFBWTtBQUMxRCxNQUFJQyxRQUFRLEdBQUdGLFFBQVEsQ0FBQ0csY0FBVCxDQUF5QiwwQ0FBekIsQ0FBZjtBQUNBLE1BQUlDLEtBQUssR0FBR0osUUFBUSxDQUFDRyxjQUFULENBQXlCLDRDQUF6QixDQUFaO0FBQ0EsTUFBSUUsSUFBSSxHQUFHTCxRQUFRLENBQUNHLGNBQVQsQ0FBeUIsMkNBQXpCLENBQVg7QUFDQSxNQUFJRyxLQUFLLEdBQUdOLFFBQVEsQ0FBQ0csY0FBVCxDQUF5QixpREFBekIsQ0FBWjtBQUVBRCxFQUFBQSxRQUFRLENBQUNELGdCQUFULENBQTJCLE9BQTNCLEVBQW9DTSxjQUFwQztBQUVBO0FBQ0Q7QUFDQTs7QUFDQyxXQUFTQSxjQUFULEdBQTBCO0FBQ3pCLFFBQUtMLFFBQVEsQ0FBQ00sT0FBVCxLQUFxQixLQUExQixFQUFrQztBQUNqQ0osTUFBQUEsS0FBSyxDQUFDSyxTQUFOLENBQWdCQyxHQUFoQixDQUFxQixRQUFyQjtBQUNBTixNQUFBQSxLQUFLLENBQUNPLEtBQU4sQ0FBWUMsT0FBWixHQUFzQixJQUF0QjtBQUVBTixNQUFBQSxLQUFLLENBQUNHLFNBQU4sQ0FBZ0JDLEdBQWhCLENBQXFCLFFBQXJCO0FBQ0FKLE1BQUFBLEtBQUssQ0FBQ0ssS0FBTixDQUFZQyxPQUFaLEdBQXNCLElBQXRCO0FBRUFQLE1BQUFBLElBQUksQ0FBQ0ksU0FBTCxDQUFlSSxNQUFmLENBQXVCLFFBQXZCO0FBQ0FSLE1BQUFBLElBQUksQ0FBQ00sS0FBTCxDQUFXQyxPQUFYLEdBQXFCLHFCQUFyQjtBQUNBLEtBVEQsTUFTTztBQUNOUixNQUFBQSxLQUFLLENBQUNLLFNBQU4sQ0FBZ0JJLE1BQWhCLENBQXdCLFFBQXhCO0FBQ0FULE1BQUFBLEtBQUssQ0FBQ08sS0FBTixDQUFZQyxPQUFaLEdBQXNCLHFCQUF0QjtBQUVBTixNQUFBQSxLQUFLLENBQUNHLFNBQU4sQ0FBZ0JJLE1BQWhCLENBQXdCLFFBQXhCO0FBQ0FQLE1BQUFBLEtBQUssQ0FBQ0ssS0FBTixDQUFZQyxPQUFaLEdBQXNCLHFCQUF0QjtBQUVBUCxNQUFBQSxJQUFJLENBQUNJLFNBQUwsQ0FBZUMsR0FBZixDQUFvQixRQUFwQjtBQUNBTCxNQUFBQSxJQUFJLENBQUNNLEtBQUwsQ0FBV0MsT0FBWCxHQUFxQixJQUFyQjtBQUNBO0FBQ0Q7O0FBRURMLEVBQUFBLGNBQWM7QUFFZCxDQW5DRCIsInNvdXJjZXNDb250ZW50IjpbImRvY3VtZW50LmFkZEV2ZW50TGlzdGVuZXIoICdET01Db250ZW50TG9hZGVkJywgZnVuY3Rpb24gKCkge1xuXHRsZXQgY2hlY2tib3ggPSBkb2N1bWVudC5nZXRFbGVtZW50QnlJZCggJ19jdXN0b21pemUtaW5wdXQtcGJfbmV0d29ya19jb250YWN0X2Zvcm0nICk7XG5cdGxldCBlbWFpbCA9IGRvY3VtZW50LmdldEVsZW1lbnRCeUlkKCAnY3VzdG9taXplLWNvbnRyb2wtcGJfbmV0d29ya19jb250YWN0X2VtYWlsJyApO1xuXHRsZXQgbGluayA9IGRvY3VtZW50LmdldEVsZW1lbnRCeUlkKCAnY3VzdG9taXplLWNvbnRyb2wtcGJfbmV0d29ya19jb250YWN0X2xpbmsnICk7XG5cdGxldCB0aXRsZSA9IGRvY3VtZW50LmdldEVsZW1lbnRCeUlkKCAnY3VzdG9taXplLWNvbnRyb2wtcGJfbmV0d29ya19jb250YWN0X2Zvcm1fdGl0bGUnICk7XG5cblx0Y2hlY2tib3guYWRkRXZlbnRMaXN0ZW5lciggJ2NsaWNrJywgdG9nZ2xlUmVhZE9ubHkgKTtcblxuXHQvKipcblx0ICpcblx0ICovXG5cdGZ1bmN0aW9uIHRvZ2dsZVJlYWRPbmx5KCkge1xuXHRcdGlmICggY2hlY2tib3guY2hlY2tlZCA9PT0gZmFsc2UgKSB7XG5cdFx0XHRlbWFpbC5jbGFzc0xpc3QuYWRkKCAnaGlkZGVuJyApO1xuXHRcdFx0ZW1haWwuc3R5bGUuY3NzVGV4dCA9IG51bGw7XG5cblx0XHRcdHRpdGxlLmNsYXNzTGlzdC5hZGQoICdoaWRkZW4nICk7XG5cdFx0XHR0aXRsZS5zdHlsZS5jc3NUZXh0ID0gbnVsbDtcblxuXHRcdFx0bGluay5jbGFzc0xpc3QucmVtb3ZlKCAnaGlkZGVuJyApO1xuXHRcdFx0bGluay5zdHlsZS5jc3NUZXh0ID0gJ2Rpc3BsYXk6IGxpc3QtaXRlbTsnO1xuXHRcdH0gZWxzZSB7XG5cdFx0XHRlbWFpbC5jbGFzc0xpc3QucmVtb3ZlKCAnaGlkZGVuJyApO1xuXHRcdFx0ZW1haWwuc3R5bGUuY3NzVGV4dCA9ICdkaXNwbGF5OiBsaXN0LWl0ZW07JztcblxuXHRcdFx0dGl0bGUuY2xhc3NMaXN0LnJlbW92ZSggJ2hpZGRlbicgKTtcblx0XHRcdHRpdGxlLnN0eWxlLmNzc1RleHQgPSAnZGlzcGxheTogbGlzdC1pdGVtOyc7XG5cblx0XHRcdGxpbmsuY2xhc3NMaXN0LmFkZCggJ2hpZGRlbicgKTtcblx0XHRcdGxpbmsuc3R5bGUuY3NzVGV4dCA9IG51bGw7XG5cdFx0fVxuXHR9XG5cblx0dG9nZ2xlUmVhZE9ubHkoKTtcblxufSApO1xuIl0sImZpbGUiOiIuL2Fzc2V0cy9zY3JpcHRzL2N1c3RvbWl6ZXItdG9nZ2xlLmpzLmpzIiwic291cmNlUm9vdCI6IiJ9\n//# sourceURL=webpack-internal:///./assets/scripts/customizer-toggle.js\n");
+
+/***/ })
+
+/******/ 	});
+/************************************************************************/
+/******/ 	
+/******/ 	// startup
+/******/ 	// Load entry module and return exports
+/******/ 	// This entry module can't be inlined because the eval-source-map devtool is used.
+/******/ 	var __webpack_exports__ = {};
+/******/ 	__webpack_modules__["./assets/scripts/customizer-toggle.js"]();
+/******/ 	
+/******/ })()
+;

dist/scripts/customizer.js

@@ -1 +1,32 @@
-wp.customize("blogname",(function(t){t.bind((function(t){return document.querySelector(".home .entry-title").textContent=t}))})),wp.customize("blogdescription",(function(t){t.bind((function(t){return document.querySelector(".home .entry-description").textContent=t}))}));
+/*
+ * ATTENTION: An "eval-source-map" devtool has been used.
+ * This devtool is neither made for production nor for readable output files.
+ * It uses "eval()" calls to create a separate source file with attached SourceMaps in the browser devtools.
+ * If you are trying to read the output file, select a different devtool (https://webpack.js.org/configuration/devtool/)
+ * or disable the default devtool with "devtool: false".
+ * If you are looking for production-ready output files, see mode: "production" (https://webpack.js.org/configuration/mode/).
+ */
+/******/ (function() { // webpackBootstrap
+/******/ 	var __webpack_modules__ = ({
+
+/***/ "./assets/scripts/customizer.js":
+/*!**************************************!*\
+  !*** ./assets/scripts/customizer.js ***!
+  \**************************************/
+/***/ (function() {
+
+eval("wp.customize('blogname', function (value) {\n  value.bind(function (to) {\n    return document.querySelector('.home .entry-title').textContent = to;\n  });\n});\nwp.customize('blogdescription', function (value) {\n  value.bind(function (to) {\n    return document.querySelector('.home .entry-description').textContent = to;\n  });\n});//# sourceURL=[module]\n//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIndlYnBhY2s6Ly9AcHJlc3Nib29rcy9wcmVzc2Jvb2tzLWFsZGluZS8uL2Fzc2V0cy9zY3JpcHRzL2N1c3RvbWl6ZXIuanM/ZWIyMCJdLCJuYW1lcyI6WyJ3cCIsImN1c3RvbWl6ZSIsInZhbHVlIiwiYmluZCIsInRvIiwiZG9jdW1lbnQiLCJxdWVyeVNlbGVjdG9yIiwidGV4dENvbnRlbnQiXSwibWFwcGluZ3MiOiJBQUFBQSxFQUFFLENBQUNDLFNBQUgsQ0FBYyxVQUFkLEVBQTBCLFVBQUFDLEtBQUssRUFBSTtBQUNsQ0EsRUFBQUEsS0FBSyxDQUFDQyxJQUFOLENBQVksVUFBQUMsRUFBRTtBQUFBLFdBQUlDLFFBQVEsQ0FBQ0MsYUFBVCxDQUF3QixvQkFBeEIsRUFBK0NDLFdBQS9DLEdBQTZESCxFQUFqRTtBQUFBLEdBQWQ7QUFDQSxDQUZEO0FBSUFKLEVBQUUsQ0FBQ0MsU0FBSCxDQUFjLGlCQUFkLEVBQWlDLFVBQUFDLEtBQUssRUFBSTtBQUN6Q0EsRUFBQUEsS0FBSyxDQUFDQyxJQUFOLENBQVksVUFBQUMsRUFBRTtBQUFBLFdBQUlDLFFBQVEsQ0FBQ0MsYUFBVCxDQUF3QiwwQkFBeEIsRUFBcURDLFdBQXJELEdBQW1FSCxFQUF2RTtBQUFBLEdBQWQ7QUFDQSxDQUZEIiwic291cmNlc0NvbnRlbnQiOlsid3AuY3VzdG9taXplKCAnYmxvZ25hbWUnLCB2YWx1ZSA9PiB7XG5cdHZhbHVlLmJpbmQoIHRvID0+IGRvY3VtZW50LnF1ZXJ5U2VsZWN0b3IoICcuaG9tZSAuZW50cnktdGl0bGUnICkudGV4dENvbnRlbnQgPSB0byApO1xufSApO1xuXG53cC5jdXN0b21pemUoICdibG9nZGVzY3JpcHRpb24nLCB2YWx1ZSA9PiB7XG5cdHZhbHVlLmJpbmQoIHRvID0+IGRvY3VtZW50LnF1ZXJ5U2VsZWN0b3IoICcuaG9tZSAuZW50cnktZGVzY3JpcHRpb24nICkudGV4dENvbnRlbnQgPSB0byApO1xufSApO1xuIl0sImZpbGUiOiIuL2Fzc2V0cy9zY3JpcHRzL2N1c3RvbWl6ZXIuanMuanMiLCJzb3VyY2VSb290IjoiIn0=\n//# sourceURL=webpack-internal:///./assets/scripts/customizer.js\n");
+
+/***/ })
+
+/******/ 	});
+/************************************************************************/
+/******/ 	
+/******/ 	// startup
+/******/ 	// Load entry module and return exports
+/******/ 	// This entry module can't be inlined because the eval-source-map devtool is used.
+/******/ 	var __webpack_exports__ = {};
+/******/ 	__webpack_modules__["./assets/scripts/customizer.js"]();
+/******/ 	
+/******/ })()
+;

inc/actions/namespace.php

@@ -351,10 +351,25 @@ function remove_widgets() {
  * Override signup page if PB_CUSTOM_SIGNUP is set.
  */
 function override_signup_page() {
+
+	if ( getenv( 'PB_CUSTOM_SIGNUP' ) && ! is_user_logged_in() ) {
+
 		global $pagenow;
-	if ( getenv( 'PB_CUSTOM_SIGNUP' ) && ! is_user_logged_in() && $pagenow === 'wp-signup.php' ) {
-		wp_redirect( network_home_url( '/auth' ) );
+
+		$action = $_REQUEST['action'] ?? '';
+
+		$actions_to_override = [ 'login', '' ]; // only redirect on main login page we don't want to override lost password and other actions.
+
+		if ( $pagenow === 'wp-signup.php' || $action === 'register' ) {
+			wp_redirect( network_home_url( '/auth/?action=signup' ) );
 			exit();
 		}
+
+		if ( $pagenow === 'wp-login.php' && in_array( $action, $actions_to_override, true ) ) {
+			wp_redirect( network_home_url( '/auth/?action=login' ) );
+			exit();
+		}
+	}
+
 }
 

page-auth.php

@@ -9,29 +9,40 @@
  * @package Aldine
  */
 
+use PressbooksMix\Assets;
+
 add_filter( 'wp_robots', 'wp_robots_no_robots' );
 nocache_headers();
+$assets = new Assets( 'pressbooks-aldine', 'theme' );
+$assets->setSrcDirectory( 'assets' )->setDistDirectory( 'dist' );
+wp_enqueue_script( 'custom-signup', $assets->getPath( 'scripts/custom-signup.js' ) );
 
-$action = $_GET['action'] ?? 'register';
+$action = $_GET['action'] ?? 'signup';
 
-if( $action === 'register' ) {
+if ( $action === 'signup' ) {
 	$main_title = __( 'Create a new account', 'pressbooks-aldine' );
 	$title = __( 'Sign up with your email and a password', 'pressbooks-aldine' );
-	$url = home_url().'/register/action=register';
+	$url = home_url() . '/auth/?action=signup';
 	$button_cta = __( 'Create Your Account', 'pressbooks-aldine' );
 	$invite_cta = __( 'Already have an account?', 'pressbooks-aldine' );
-	$invite_cta_link = home_url().'/auth/?action=login';
+	$invite_cta_link = home_url() . '/auth/?action=login';
 	$invite_cta_link_text = __( 'Log in', 'pressbooks-aldine' );
+	$sign_action = __( 'Or sign up with one of the following', 'pressbooks-aldine' );
 } else {
 	$main_title = __( 'Welcome back!', 'pressbooks-aldine' );
 	$title = __( 'Log in to your existing account', 'pressbooks-aldine' );
-	$url = home_url().'/register/action=login';
+	$url = home_url() . '/auth/?action=login';
 	$button_cta = __( 'Login', 'pressbooks-aldine' );
 	$invite_cta = __( 'Don\'t have an account?', 'pressbooks-aldine' );
-	$invite_cta_link = home_url().'/auth/?action=register';
+	$invite_cta_link = home_url() . '/auth/?action=signup';
 	$invite_cta_link_text = __( 'Register here', 'pressbooks-aldine' );
+	$sign_action = __( 'Or sign in with one of the following', 'pressbooks-aldine' );
 }
-do_action( 'pb_custom_signup_form_handler' )
+
+// Implement this hook to process the form.
+do_action( 'pb_custom_signup_form_handler' );
+
+$errors = apply_filters( 'pb_custom_signup_errors', [] );
 
 ?>
 <!doctype html>
@@ -40,12 +51,10 @@ do_action( 'pb_custom_signup_form_handler' )
 	<meta charset="<?php bloginfo( 'charset' ); ?>">
 	<meta http-equiv="x-ua-compatible" content="ie=edge">
 	<meta name="viewport" content="width=device-width, initial-scale=1">
-	<title>Create a new account</title>
-	<link rel="stylesheet" type="text/css" href="<?php bloginfo( 'template_directory' ); ?>/dist/styles/aldine.css" />
-	<script src="https://cdn.jsdelivr.net/npm/typed.js@2.0.12"></script>
+	<title><?php echo esc_html( $title ); ?></title>
 	<?php
+	wp_head();
 	do_action( 'pb_custom_signup_header' );
-	// TODO: figure out how to customize/replace wp_head(); in this template.
 	?>
 </head>
 
@@ -98,35 +107,55 @@ do_action( 'pb_custom_signup_form_handler' )
 	</div>
 </header>
 <p class="signup--tagline"><?php _e( 'Start creating your <span id="typed"></span><span class="typed-cursor"></span> today', 'pressbooks-aldine' ); ?></p>
-<h1 class="signup--page-title"><?php echo $main_title; ?></h1>
+<h1 class="signup--page-title"><?php echo esc_html( $main_title ); ?></h1>
 <?php do_action( 'pb_custom_signup_before_wrapper' ); ?>
 <div class="signup--wrapper">
 	<section class="signup--section">
-		<h2 class="signup--header-title"><?php echo $title; ?></h2>
-		<form class="form" action="<?php echo $url; ?>" method="post">
+		<h2 class="signup--header-title"><?php echo esc_html( $title ); ?></h2>
+		<form class="form" action="<?php echo esc_html( $url ); ?>" method="post">
 		<div class="form--input-wrapper">
+			<?php if ( $action === 'signup' ) : ?>
 			<input id="email" type="email" autocomplete="email" placeholder=" " name="user_email" required/>
+			<?php else : ?>
+			<input id="login" type="text" placeholder=" " name="user_login" required/>
+			<?php endif; ?>
 			<label for="email"><?php _e( 'Email address', 'pressbooks-aldine' ); ?></label>
 		</div>
-		<?php if($action === 'register') : ?>
+		<?php if ( $action === 'signup' ) : ?>
 			<p class="form--input-description"><?php _e( 'Will be used to send your registration details', 'pressbooks-aldine' ); ?></p>
 		<?php endif; ?>
+			<?php if ( isset( $errors['user_email'] ) ) : ?>
+				<p class="form--input-description error"><?php echo wp_kses( $errors['user_email'][0], true ); ?></p>
+			<?php endif; ?>
+			<?php if ( isset( $errors['invalid_username'] ) ) : ?>
+				<p class="form--input-description error"><?php echo wp_kses( $errors['invalid_username'][0], true ); ?></p>
+			<?php endif; ?>
 		<div class="form--input-wrapper">
 			<input id="password" type="text" autocomplete="new-password" placeholder=" "  name="user_pwd" required/>
 			<label for="password"><?php _e( 'Password', 'pressbooks-aldine' ); ?></label>
 		</div>
-			<?php if($action === 'register') : ?>
+			<?php if ( $action === 'signup' ) : ?>
 		<p class="form--input-description"><?php _e( 'At least 12 characters, with at least one upper case letter and one number', 'pressbooks-aldine' ); ?></p>
 			<?php endif; ?>
+			<?php if ( isset( $errors['password_validation_error'] ) ) : ?>
+				<p class="form--input-description error"><?php echo wp_kses( $errors['password_validation_error'][0], true ); ?></p>
+			<?php endif; ?>
+			<?php if ( isset( $errors['incorrect_password'] ) ) : ?>
+				<p class="form--input-description error"><?php echo wp_kses( $errors['incorrect_password'][0], true ); ?></p>
+			<?php endif; ?>
 		<?php do_action( 'pb_custom_signup_extra_fields' ); ?>
-		<button type="submit"><?php echo $button_cta; ?></button>
+		<button type="submit"><?php echo esc_html( $button_cta ); ?></button>
+			<?php if ( $action === 'signup' ) : ?>
 				<p class="form--input-description"><?php _e( 'By signing up for Pressbooks. you agree to our privacy policy and terms of service.', 'pressbooks-aldine' ); ?></p>
+			<?php else : ?>
+				<p class="form--input-description"><a href="<?php echo wp_lostpassword_url(); ?>"><?php _e( 'Lost your password?', 'pressbooks-aldine' ); ?></a></p>
+			<?php endif; ?>
 		<?php wp_nonce_field( 'pb_nonce_signup', 'pb_nonce_signup' ); ?>
 		</form>
-		<h2 class="signup--header-title"><?php echo $invite_cta; ?> <a href="<?php echo $invite_cta_link; ?>"><?php echo $invite_cta_link_text; ?></a></h2>
+		<h2 class="signup--header-title"><?php echo esc_html( $invite_cta ); ?> <a href="<?php echo esc_html( $invite_cta_link ); ?>"><?php echo esc_html( $invite_cta_link_text ); ?></a></h2>
 	</section>
 	<section class="signup--section">
-		<h2 class="signup--header-title"><?php _e( 'Or sign up with one of the following', 'pressbooks-aldine' ); ?></h2>
+		<h2 class="signup--header-title"><?php echo esc_html( $sign_action ); ?></h2>
 		<div class="signup--social-buttons">
 			<button class="signup--social-button google"><svg class="logo-google"><use xlink:href="#logo-google" /></svg>Google</button>
 			<button class="signup--social-button twitter"><svg class="logo-twitter"><use xlink:href="#logo-twitter" /></svg>Twitter</button>
@@ -136,16 +165,5 @@ do_action( 'pb_custom_signup_form_handler' )
 	</section>
 </div>
 <?php do_action( 'pb_custom_signup_after_wrapper' ); ?>
-<script>
-	var options = {
-		strings: ['open textbook', 'scholarly monograph', 'world-changing manifesto', 'graduate thesis', 'reference guide', 'essay collection', 'student portfolio', 'novel', 'position paper', 'handbook', 'magnum opus', 'research report', 'daybook', 'collected works' ],
-		typeSpeed: 80,
-		backSpeed: 40,
-		backDelay: 400,
-		loop: true,
-	};
-
-	var typed = new Typed('#typed', options);
-</script>
 </body>
 </html>

webpack.mix.js

@@ -46,7 +46,8 @@ mix
 	.js( `${assets}/scripts/catalog-admin.js`, `${dist}/scripts` )
 	.js( `${assets}/scripts/customizer.js`, `${dist}/scripts` )
 	.js( `${assets}/scripts/customizer-toggle.js`, `${dist}/scripts` )
-	.js( `${assets}/scripts/page-section.js`, `${dist}/scripts` );
+	.js( `${assets}/scripts/page-section.js`, `${dist}/scripts` )
+	.js( `${assets}/scripts/custom-signup.js`, `${dist}/scripts` );
 
 // Assets
 mix