nezumi/javascript-training
1
0
Fork 0
mirror of https://github.com/Nezumi-2711/javascript-training.git synced 2026-09-23 04:09:58 +00:00
Code Issues Packages Projects Releases Wiki Activity

Init user model and common file

Browse Source
This commit is contained in:
nezumi
2023-08-29 12:04:16 +07:00
parent 2fc4e62349
commit 6feebb663d
6 changed files with 113 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files
javascript-practice/src/js/constants/constant.js
+15
View File
@@ -0,0 +1,15 @@
export const databaseURL =
'https://javascript-training-81f7a-default-rtdb.asia-southeast1.firebasedatabase.app';
export const regex =
/^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[@$!%*?&])[A-Za-z\d@$!%*?&]{8,}$/;
export const PASSWORD_NOT_MATCH = 'Password not match! Please try again!';
export const PASSWORD_NOT_STRONG =
'Password must at least one uppercase, one lowercase letter, one number and one special character!';
export const ERROR_MESSAGE_DEFAULT = 'Something went wrong!';
export const TIME_OUT_SEC = 3;
export const TIME_OUT_ERROR = {
status: 408,
message: 'Connection time out! Please try again!',
};
export const TYPE_FORM = { success: 'success', error: 'error' };
export const MARK_ICON = { success: 'check', error: 'error' };
javascript-practice/src/js/helpers/helpers.js
+29
View File
@@ -0,0 +1,29 @@
import { TIME_OUT_SEC, TIME_OUT_ERROR, regex } from '../constants/constant';
import FirebaseService from '../services/firebaseService';
export const validatePassword = (password) => {
return regex.test(password);
};
export const timeout = (s) => {
return new Promise((reject) => {
setTimeout(() => {
reject(TIME_OUT_ERROR);
}, s * 1000);
});
};
export const createIdUser = () => {
return new Date().getTime();
};
export const timeOutConnect = async (action) => {
const result = await Promise.race([action, timeout(TIME_OUT_SEC)]);
if (result && result.status === TIME_OUT_ERROR.status) {
FirebaseService.disconnect();
throw new Error(`${result.message}`);
}
return result;
};
javascript-practice/src/js/model.js
-1
View File
@@ -1 +0,0 @@
// TODO
javascript-practice/src/js/models/userModel.js
+7
View File
@@ -0,0 +1,7 @@
export default class User {
constructor({ email, password, walletName = '' }) {
this.email = email;
this.password = password;
this.walletName = walletName;
}
}
javascript-practice/src/js/services/firebaseService.js
+55
View File
@@ -0,0 +1,55 @@
import { initializeApp } from 'firebase/app';
import {
getDatabase,
ref,
set,
goOffline,
goOnline,
onValue,
} from 'firebase/database';
import { databaseURL } from '../constants/constant';
class FirebaseService {
constructor() {
const firebaseConfig = {
databaseURL,
};
this.app = initializeApp(firebaseConfig);
this.db = getDatabase(this.app);
}
save(data, path) {
return set(ref(this.db, path), data);
}
disconnect() {
goOffline(this.db);
}
reconnect() {
goOnline(this.db);
}
findKeyByPropery(path, property, value) {
return new Promise((resolve) => {
onValue(
ref(this.db, path),
(snapshot) => {
let result = false;
snapshot.forEach((childSnapshot) => {
const data = childSnapshot.val();
if (data[property] === value) {
result = true;
}
});
resolve(result);
},
{
onlyOnce: true,
},
);
});
}
}
export default new FirebaseService();
javascript-practice/src/pages/register.html
+7 -6
View File
@@ -7,20 +7,20 @@
<title>Register - Money Lover</title> <title>Register - Money Lover</title>
</head> </head>
<body> <body>
<!-- <div class="loader"></div> --> <!-- <div class="loader hidden"></div> -->
<div class="overlay"></div> <!-- <div class="overlay"></div>
<div class="modal-box"> <div class="modal-box success-form">
<div class="checkmark"></div> <div class="mark check"></div>
<h2 class="modal-box__title">Register success!</h2> <h2 class="modal-box__title">Register success!</h2>
<p class="modal-box__message">Please login to continue.</p> <p class="modal-box__message">Please login to continue.</p>
<button class="modal-box__redirect-btn">OK!</button> <button class="modal-box__redirect-btn">OK!</button>
</div> </div> -->
<div class="background"> <div class="background">
<div class="wrapper"> <div class="wrapper">
<img class="logo-web" src="../assets/images/logo.svg" alt="Logo web" /> <img class="logo-web" src="../assets/images/logo.svg" alt="Logo web" />
<!-- Register form --> <!-- Register form -->
<form action="#" class="form" method="post"> <form action="#" class="form" method="post" id="registerForm">
<div class="form__container"> <div class="form__container">
<h1 class="form__title">Register</h1> <h1 class="form__title">Register</h1>
<p class="form__description">Using Money Lover account</p> <p class="form__description">Using Money Lover account</p>
@@ -55,5 +55,6 @@
<!-- End form --> <!-- End form -->
</div> </div>
</div> </div>
<script type="module" src="../js/main.js"></script>
</body> </body>
</html> </html>