0ecc79e01d1d66dca102212f5d9a6c69.json 14.7 KB
Newer Older
1
{"ast":null,"code":"var _jsxFileName = \"C:\\\\Users\\\\Bruger\\\\Desktop\\\\Web-projects\\\\pipit\\\\client\\\\src\\\\pages\\\\login\\\\signUp\\\\SignUp.jsx\",\n    _s = $RefreshSig$();\n\nimport React, { useState, useEffect, useRef } from 'react';\nimport { jsxDEV as _jsxDEV } from \"react/jsx-dev-runtime\";\n\nconst SignUp = () => {\n  _s();\n\n  const [signUpFormVisibilityState, showSignUpForm] = useState(false);\n  const signUpFormRef = useRef(null);\n  const [firstname, setfirstname] = useState('');\n  const [lastname, setlastname] = useState('');\n  const [username, setUsername] = useState('');\n  const [password, setPassword] = useState('');\n  const [confirmPassword, setConfirmPassword] = useState('');\n\n  const handlefirstnameChange = e => {\n    setfirstname(e.target.value);\n  };\n\n  const handlelastnameChange = e => {\n    setlastname(e.target.value);\n  };\n\n  const handleUsernameChange = e => {\n    setUsername(e.target.value);\n  };\n\n  const handlePasswordChange = e => {\n    setPassword(e.target.value);\n  };\n\n  const handleConfirmPasswordChange = e => {\n    setConfirmPassword(e.target.value);\n  };\n\n  const toggleSignInFormVisible = () => showSignUpForm(!signUpFormVisibilityState);\n\n  useEffect(() => {\n    const pageClickEvent = e => {\n      console.log(\"Click\");\n\n      if (signUpFormRef.current !== null && !signUpFormRef.current.contains(e.target)) {\n        toggleSignInFormVisible();\n      }\n    }; // If the item is active (ie open) then listen for clicks\n\n\n    if (signUpFormVisibilityState) {\n      window.addEventListener('click', pageClickEvent);\n    }\n\n    return () => {\n      window.removeEventListener('click', pageClickEvent);\n    };\n  }, [signUpFormVisibilityState]);\n  const userInputData = JSON.stringify({\n    firstname: `${firstname}`,\n    lastname: `${lastname}`,\n    email: `${username}`,\n    password: `${password}`\n  });\n  const loginRequestOptions = {\n    method: 'POST',\n    body: userInputData\n  };\n  return /*#__PURE__*/_jsxDEV(\"div\", {\n    className: `modal ${signUpFormVisibilityState ? \"active\" : \"inactive\"}`,\n    children: /*#__PURE__*/_jsxDEV(\"div\", {\n      ref: signUpFormRef,\n      className: \"modal-content\",\n      children: /*#__PURE__*/_jsxDEV(\"div\", {\n        className: \"signUpForm\",\n        children: [/*#__PURE__*/_jsxDEV(\"h2\", {\n          children: \"Sign Up\"\n        }, void 0, false, {\n          fileName: _jsxFileName,\n          lineNumber: 70,\n          columnNumber: 11\n        }, this), /*#__PURE__*/_jsxDEV(\"form\", {\n          onSubmit: handleSignUpFormSubmit,\n          children: [/*#__PURE__*/_jsxDEV(\"label\", {\n            children: [\"First name:\", /*#__PURE__*/_jsxDEV(\"input\", {\n              id: \"firstname\",\n              type: \"text\",\n              value: firstname,\n              onChange: handlefirstnameChange\n            }, void 0, false, {\n              fileName: _jsxFileName,\n              lineNumber: 74,\n              columnNumber: 15\n            }, this)]\n          }, void 0, true, {\n            fileName: _jsxFileName,\n            lineNumber: 72,\n            columnNumber: 13\n          }, this), /*#__PURE__*/_jsxDEV(\"label\", {\n            children: [\"Last Name:\", /*#__PURE__*/_jsxDEV(\"input\", {\n              id: \"lastname\",\n              type: \"text\",\n              value: lastname,\n              onChange: handlelastnameChange\n            }, void 0, false, {\n              fileName: _jsxFileName,\n              lineNumber: 81,\n              columnNumber: 15\n            }, this)]\n          }, void 0, true, {\n            fileName: _jsxFileName,\n            lineNumber: 79,\n            columnNumber: 13\n          }, this), /*#__PURE__*/_jsxDEV(\"label\", {\n            children: [\"Email:\", /*#__PURE__*/_jsxDEV(\"input\", {\n              id: \"email\",\n              type: \"text\",\n              value: username,\n              onChange: handleUsernameChange\n            }, void 0, false, {\n              fileName: _jsxFileName,\n              lineNumber: 88,\n              columnNumber: 15\n            }, this)]\n          }, void 0, true, {\n            fileName: _jsxFileName,\n            lineNumber: 86,\n            columnNumber: 13\n          }, this), /*#__PURE__*/_jsxDEV(\"label\", {\n            children: [\"Password:\", /*#__PURE__*/_jsxDEV(\"input\", {\n              id: \"password\",\n              type: \"password\",\n              value: password,\n              onChange: handlePasswordChange\n            }, void 0, false, {\n              fileName: _jsxFileName,\n              lineNumber: 95,\n              columnNumber: 15\n            }, this)]\n          }, void 0, true, {\n            fileName: _jsxFileName,\n            lineNumber: 93,\n            columnNumber: 13\n          }, this), /*#__PURE__*/_jsxDEV(\"label\", {\n            children: [\"Confirm Password:\", /*#__PURE__*/_jsxDEV(\"input\", {\n              id: \"password\",\n              type: \"password\",\n              value: confirmPassword,\n              onChange: handleConfirmPasswordChange\n            }, void 0, false, {\n              fileName: _jsxFileName,\n              lineNumber: 102,\n              columnNumber: 15\n            }, this)]\n          }, void 0, true, {\n            fileName: _jsxFileName,\n            lineNumber: 100,\n            columnNumber: 13\n          }, this), /*#__PURE__*/_jsxDEV(\"label\", {\n            className: \"password-requirements\",\n            children: \"Requirements: At least 8 characters, no parts of your username\"\n          }, void 0, false, {\n            fileName: _jsxFileName,\n            lineNumber: 107,\n            columnNumber: 13\n          }, this), /*#__PURE__*/_jsxDEV(\"button\", {\n            className: \"formSubmitButton\",\n            type: \"submit\",\n            children: [\"Sign Up\\xA0\\xA0\", /*#__PURE__*/_jsxDEV(FontAwesomeIcon, {\n              icon: \"user-plus\"\n            }, void 0, false, {\n              fileName: _jsxFileName,\n              lineNumber: 112,\n              columnNumber: 15\n            }, this)]\n          }, void 0, true, {\n            fileName: _jsxFileName,\n            lineNumber: 110,\n            columnNumber: 13\n          }, this)]\n        }, void 0, true, {\n          fileName: _jsxFileName,\n          lineNumber: 71,\n          columnNumber: 11\n        }, this)]\n      }, void 0, true, {\n        fileName: _jsxFileName,\n        lineNumber: 69,\n        columnNumber: 9\n      }, this)\n    }, void 0, false, {\n      fileName: _jsxFileName,\n      lineNumber: 68,\n      columnNumber: 7\n    }, this)\n  }, void 0, false, {\n    fileName: _jsxFileName,\n    lineNumber: 66,\n    columnNumber: 5\n  }, this);\n};\n\n_s(SignUp, \"MG/tvUlIVD3u0ENCBSYdvOCrtb8=\");\n\n_c = SignUp;\nexport default SignUp;\n\nvar _c;\n\n$RefreshReg$(_c, \"SignUp\");","map":{"version":3,"sources":["C:/Users/Bruger/Desktop/Web-projects/pipit/client/src/pages/login/signUp/SignUp.jsx"],"names":["React","useState","useEffect","useRef","SignUp","signUpFormVisibilityState","showSignUpForm","signUpFormRef","firstname","setfirstname","lastname","setlastname","username","setUsername","password","setPassword","confirmPassword","setConfirmPassword","handlefirstnameChange","e","target","value","handlelastnameChange","handleUsernameChange","handlePasswordChange","handleConfirmPasswordChange","toggleSignInFormVisible","pageClickEvent","console","log","current","contains","window","addEventListener","removeEventListener","userInputData","JSON","stringify","email","loginRequestOptions","method","body","handleSignUpFormSubmit"],"mappings":"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","sourcesContent":["import React, { useState, useEffect, useRef } from 'react'\r\n\r\nconst SignUp = () => {\r\n  const [signUpFormVisibilityState, showSignUpForm] = useState(false)\r\n  const signUpFormRef = useRef(null);\r\n\r\n  const [firstname, setfirstname] = useState('')\r\n  const [lastname, setlastname] = useState('')\r\n  const [username, setUsername] = useState('');\r\n  const [password, setPassword] = useState('');\r\n  const [confirmPassword, setConfirmPassword] = useState('');\r\n\r\n  const handlefirstnameChange = (e) => {\r\n    setfirstname(e.target.value)\r\n  }\r\n\r\n  const handlelastnameChange = (e) => {\r\n    setlastname(e.target.value)\r\n  }\r\n\r\n  const handleUsernameChange = (e) => {\r\n    setUsername(e.target.value);\r\n  };\r\n\r\n  const handlePasswordChange = (e) => {\r\n    setPassword(e.target.value)\r\n  }\r\n\r\n  const handleConfirmPasswordChange = (e) => {\r\n    setConfirmPassword(e.target.value)\r\n  }\r\n\r\n  const toggleSignInFormVisible = () => showSignUpForm(!signUpFormVisibilityState)\r\n  useEffect(() => {\r\n    const pageClickEvent = (e) => {\r\n      console.log(\"Click\")\r\n      if (signUpFormRef.current !== null && !signUpFormRef.current.contains(e.target)) {\r\n        toggleSignInFormVisible()\r\n      }\r\n    };\r\n\r\n    // If the item is active (ie open) then listen for clicks\r\n    if (signUpFormVisibilityState) {\r\n      window.addEventListener('click', pageClickEvent);\r\n    }\r\n\r\n    return () => {\r\n      window.removeEventListener('click', pageClickEvent);\r\n    }\r\n\r\n  }, [signUpFormVisibilityState]);\r\n\r\n  const userInputData = JSON.stringify({\r\n    firstname: `${firstname}`,\r\n    lastname: `${lastname}`,\r\n    email: `${username}`,\r\n    password: `${password}`\r\n  })\r\n\r\n  const loginRequestOptions = {\r\n    method: 'POST',\r\n    body: userInputData\r\n  };\r\n\r\n  return (\r\n    < div className={`modal ${signUpFormVisibilityState ? \"active\" : \"inactive\"}`\r\n    }>\r\n      <div ref={signUpFormRef} className=\"modal-content\">\r\n        <div className=\"signUpForm\">\r\n          <h2>Sign Up</h2>\r\n          <form onSubmit={handleSignUpFormSubmit}>\r\n            <label>\r\n              First name:\r\n              <input\r\n                id=\"firstname\" type=\"text\"\r\n                value={firstname}\r\n                onChange={handlefirstnameChange} />\r\n            </label>\r\n            <label>\r\n              Last Name:\r\n              <input\r\n                id=\"lastname\" type=\"text\"\r\n                value={lastname}\r\n                onChange={handlelastnameChange} />\r\n            </label>\r\n            <label>\r\n              Email:\r\n              <input\r\n                id=\"email\" type=\"text\"\r\n                value={username}\r\n                onChange={handleUsernameChange} />\r\n            </label>\r\n            <label>\r\n              Password:\r\n              <input\r\n                id=\"password\" type=\"password\"\r\n                value={password}\r\n                onChange={handlePasswordChange} />\r\n            </label>\r\n            <label>\r\n              Confirm Password:\r\n              <input\r\n                id=\"password\" type=\"password\"\r\n                value={confirmPassword}\r\n                onChange={handleConfirmPasswordChange} />\r\n            </label>\r\n            <label className=\"password-requirements\">\r\n              Requirements: At least 8 characters, no parts of your username\r\n            </label>\r\n            <button className=\"formSubmitButton\" type=\"submit\">\r\n              Sign Up&nbsp;&nbsp;\r\n              <FontAwesomeIcon icon=\"user-plus\"></FontAwesomeIcon>\r\n            </button>\r\n          </form>\r\n        </div>\r\n      </div>\r\n    </div >\r\n  )\r\n}\r\n\r\nexport default SignUp\r\n"]},"metadata":{},"sourceType":"module"}