# 110062172 Software Studio 2023 Spring Midterm Project

### Scoring

| **Basic components** | **Score** | **Check** |
| :----------------------------------------------- | :-------: | :-------: |
| Membership Mechanism | 15% | Y |
| Firebase page | 5% | Y |
| Database read/write | 15% | Y |
| RWD | 15% | Y |
| Chatroom | 20% | Y |

| **Advanced tools** | **Score** | **Check** |
| :----------------------------------------------- | :-------: | :-------: |
| Using React | 10% | Y |
| Third-Party Sign In | 1% | Y |
| Notification | 5% | Y |
| CSS Animation | 2% | Y |
| Security | 2% | Y |

| **Other useful functions** | **Score** | **Check** |
| :----------------------------------------------- | :-------: | :-------: |
| Block User |2% | Y |

---

### How to use
1. sign up/log in page

To access the chatroom, you need to select one of the following options: sign up, log in, or Google sign-in.

If you choose to sign up, your chosen name will appear in the top left corner of the chatroom. Alternatively, if you opt for Google sign-in, your Google account name will be displayed.
2. chatroom page
To enter a chatroom, you must select it by clicking on it. Once you are in the chatroom, you can view all of the past messages that have been sent. From there, you can also send your own messages in the chatroom.

To send a message in the chatroom, you have two options: you can click on the "Send Message" button located on the right of the text input field, or you can simply press the "Enter" key on your keyboard.

(1)新增 button:
To create a new chatroom, click on the "新增" button and enter the desired name for the chatroom. Once the name has been entered, the new chatroom will be added to the list of available chatrooms.
(2)登出 button:
By clicking on this button, you will be signed out and redirected back to the sign-up/log-in page.
(3)加入 button:
To add a user to the chatroom you are currently in, click on the "加入" button and enter the username of the user you wish to add. Once the username has been entered, the user will be added to the chatroom.
### Function description
1.Block user(禁言):
To block a user from all chatrooms, click on the "禁言" button and enter the username of the user you wish to block. Once you have entered the username, you will no longer see any messages from that user in any of the chatrooms you are in.

### Firebase page link

https://sf-lab07.web.app/

<style>
table th{
width: 100%;
}
</style>