USER ĐANGKY ROOM QUYEN
8.2.2 Thiết kế bảng lưu thơng tin của lớp học :
KHOA CNTT –
ĐH KHTN
Thơng tin các trường :
STT Thuộc tính Kiểu Mơ tả
1 RoomID Integer Chỉ số của room 2 RoomName CString Tên của room
3 Owner CString Tên người tạo ra room 4 Content CString Nội dung tĩm tắt của room
Bảng 8-1: Danh sách các thuộc tính của bảng CRoomSet 8.2.3 Thiết kế bảng lưu thơng tin người sử dụng :
Ánh xạ từ lớp CUserDB sang lớp CusersSet :
Hình 8-3: Ánh xạ từ lớp entity CuserDB sang lớp CusersSet
Thơng tin các trường :
STT Thuộc tính Kiểu Mơ tả
1 Tên Cstring Tên đăng nhập 2 MatKhau CString Mật khẩu đăng nhập 3 Quyen Integer Quyền của người sử dụng
KHOA CNTT –
ĐH KHTN
8.3 Thiết kế giao diện :
8.3.1 Thiết kế màn hình chính :
Hình 8-4: Màn hình chính
Mơ tả các trường trên màn hình :
STT Mô tả
1 ComboBox đển gõ địa chỉ IP vào, cĩ thể chọn địa chỉ IP được lưu sẵn trong dữ
liệu của chương trình
2 Menu dùng để thực hiện kết nối như hình 3 Menu cho viện quản lý text chat trong lớp học 4 Menu hỗ trợ sinh viên phát biểu trong lớp học
5 Menu hỗ trợ giáo viên trong trong việc quản lý về hình ảnh 6 Hỗ trợ người sử dụng trong việc điều chỉnh độ lớn của âm thanh
7 Hỗ trợ người sử dụng trong việc điều chỉnh độ lớn của micro trong việc thu giọng nĩi
KHOA CNTT –
ĐH KHTN
8 Log của những lần chat bằng text
9 Vị trí để gõ text chat, dùng control_Enter để gửi text đi
10 Cho biết trạng thái hiện giờ của chương trình, theo như hình là đang lắng nghe chờ kết nối hoặc kết nối với server (adsbygoogle = window.adsbygoogle || []).push({});
11 Cho biết địa chỉ IP hiện thời của máy tính trong mạng
12 Cho xem hoặc khơng xem phần hình ảnh được gửi từ server và hình ảnh hiện tại lấy được từ webcam
13 Hiển thị danh sách của các thành viên hiện tại trong lớp học 14 Menu Setting : dùng để cấu hình này hệ thống.
Bảng 8-3: Các trường trên màn hình chính
Khi nhấn vào nút mang số 12 ta cĩ hình ảnh sau :
KHOA CNTT –
ĐH KHTN
Mơ tả các trường trên màn hình :
STT Mô tả
15 Hình ảnh thu được từ giáo viên, do server gửi về
16 Hình ảnh lấy được từ webcam của máy đang sử dụng
Bảng 8-4: Các trường trên màn hình thể hiện webcam
Khi nhấn vào nút mang số 13 ta cĩ hình :
Hình 8-6: Màn hình danh sách thành viên
Liệt kê theo thứ tự từ trên xuống, từ trái sang phải :
STT Mô tả
17 Phía trên là danh sách những thành viên hiện cĩ trong lớp 18 Nút thêm 1 thành viên để chat
19 Thêm tất cả thành viên để chat
KHOA CNTT –
ĐH KHTN
21 Xố tất cả thành viên ra khỏi nhĩm đang chat 22 Danh sách các thành viên đang chat
Bảng 8-5: Các trường trên màn hình danh sách thành viên
Hình 8-7: Menu call
Danh sách các chức năng được thể hiện trong menu :
STT Mô tả
23 Thực hiện chức năng tạo kết nối 24 Thực hiện chức năng ngắt kết nối
Bảng 8-6: Các trường trên menu call
Hình 8-8: Menu chat
Mơ tả các trường trên màn hình :
STT Mô tả (adsbygoogle = window.adsbygoogle || []).push({});
25 Cho phép sinh viên chat trong lớp học
26 Khơng cho phép sinh viên chat trong lớp học, duy chỉ cĩ giáo viên mới cĩ quyền chat khi bật chức năng này lên.
Bảng 8-7: Các trường trên menu chat
KHOA CNTT –
ĐH KHTN
Mơ tả các trường trên màn hình :
STT Mô tả
27 Sinh viên xin được phát biểu
28 Khi đang xin phát biểu thì cĩ thể khơng phát biểu nữa
Bảng 8-8: Các trường trên menu audio
Hình 8-10: Menu video
Mơ tả các trường trên màn hình :
STT Mô tả
29 Giáo viên Cho phép xem hình của giáo viên, hình ảnh thu được từ webcam 30 Giáo viên khơng cho phép xem hình ảnh của mình, ngưng việc cung cấp hình
ảnh
31 Giáo viên cho phép sinh viên xem màn hình, chức năng này dùng để hỗ trợ
giáo viên giảng những bài giảng được thực hiện trên desktop như giảng bàng slide
32 Giáo viên khơng cho phép xem màn hình của mình
KHOA CNTT –
ĐH KHTN
Khi thực hiện kết nối và đăng nhập thành cơng, ta được màn hình sau :
Hình 8-11: Màn hình sau khi kết nối
Do đăng nhập là quyền giáo viên, và cho thu webcam ta mới cĩ màn hình như vậy.
8.3.2 Thiết kế màn hình đăng nhập :
Màn hình này chỉ xuất hiện khi đã kết nối thành cơng với máy chủ.
KHOA CNTT –
ĐH KHTN
Mơ tả các trường trên màn hình :
STT Mô tả
1 Textbox dùng để gõ tên đăng nhập 2 Textbox dùng để gõ mật khẩu (adsbygoogle = window.adsbygoogle || []).push({});
3 Button Login dùng để thực hiện chức năng đăng nhập vào hệ thống (đối với những người dùng đã cĩ tài khoản đăng nhập)
4 Button Sign in dùng để thực hiện chức năng đăng ký làm thành viên mới 5 Button Cancel dùng để kết thúc việc đăng nhập, việc này đồng nghĩa với việc
ngắt khỏi server.
Bảng 8-10: Các trường trên màn hình đăng nhập 8.3.3 Thiết kế màn hình hiển thị danh sách lớp :
Màn hình này chỉ xuất hiện khi đã đăng nhập thành cơng vào trong hệ thống. Sau khi
đăng nhập thành cơng sẽ hiển thị danh sách của các lớp đang được mở trên hệ thống.
Đồng thời dựa vào bước đăng nhập ban đầu để xác định quyền của người sử dụng, và hiển thị các chức năng tương ứng. Hình dưới là thể hiện người đăng nhập cĩ quyền là giáo viên.
KHOA CNTT –
ĐH KHTN
Hình 8-13: Màn hình danh sách lớp
Mơ tả các trường trên màn hình :
STT Mô tả
1 ListCtrl hiển thị danh sách các lớp đang được mở, đồng thời hiển thị số lượng người đang cĩ trong lớp, giáo viên cĩ ở trong lớp khơng. Người dùng phải chọn một trong các lớp đang mở trước khi nhấn vào button Join in
2 Tên đăng nhập hiện tại, chương trình tựđộng lấy
3 Textbox để nhập mật khẩu vào trong lớp, nếu lớp đĩ cĩ bảo vệ bằng mật khẩu 4 Button Join thực hiện chức năng tham gia vào lớp học
5 Button Room : hiển thị các chức năng liên quan đến lớp học như tạo lớp học, xố lớp học, thay đổi mật khẩu của lớp học, thay đổi người chủ của lớp học 6 Button User : hiển thị các chức năng liên quan đến người sử dụng như thay
đổi mật khẩu, xố tài khoản, thay đổi quyền của người sử dụng (chức năng của người quản trị)
7 Button đĩng : ngắt kết nối với hệ thống server
KHOA CNTT –
ĐH KHTN
Hình 8-14: Menu lớp học
Mơ tả các trường trên màn hình :
STT Mô tả
1 Thực hiện chức năng tạo lớp học mới 2 Thực hiện chức năng xố lớp học
3 Thực hiện chức năng thay đổi mật khẩu lớp học
Bảng 8-12: Các trường trên menu lớp học
Hình 8-15: Menu người dùng
Mơ tả các trường trên màn hình :
STT Mô tả
1 Thực hiện chức năng thay đổi mật khẩu người sử dụng 2 Thực hiện chức năng xố người sử dụng (adsbygoogle = window.adsbygoogle || []).push({});
Bảng 8-13: Các trường trên menu người dùng 8.3.4 Thiết kế màn hình tạo lớp học mới :
Khi người dùng đăng nhập vào cĩ quyền là giáo viên hoặc người quản trị thì mới cĩ quyền thực hiện chức năng này :
KHOA CNTT –
ĐH KHTN
Hình 8-16: Màn hình tạo lớp học
Mơ tả các trường trên màn hình :
STT Mô tả
1 TextBox dùng để nhập tên lớp học
2 CheckBox dùng để xác nhận xem lớp học này cĩ cần mầt khẩu khơng 3 TextBox dùng để nhập mật khẩu của lớp
4 TextBox dùng để nhập lại mật khẩu trong trường hợp lớp cĩ dùng mật khẩu 5 Button CreateRoom : thực hiện chức năng tạo lớp học mới
6 Button Cancel : hủy bỏ việc tạo lớp học mới, quay trở về màn hình trước đĩ
Bảng 8-14: Các trường trên màn hình tạo lớp học 8.3.5 Thiết kế màn hình xố một lớp :
Màn hình này xuất hiện khi người dùng muốn tham gia vào lớp học :
KHOA CNTT –
ĐH KHTN
Mơ tả các trường trên màn hình :
STT Mô tả
1 TextBox hiển thị lớp muốn xố
2 TextBox dùng để nhập mật khẩu của lớp muốn xố 3 Button Remove thực hiện chức năng xố lớp 4 Button Cancel : hủy bỏ chức năng xố lớp
Bảng 8-15: Các trường trên màn hình xĩa lớp học 8.3.6 Thiết kế màn hình thay đổi mật khẩu :
Màn hình này được sử dụng khi người sử dụng thực hiện các chức năng thay đổi mật khẩu của lớp, thay đổi mật khẩu của người sử dụng
Hình 8-18: Màn hình thay đổi mật khẩu
Mơ tả các trường trên màn hình :
STT Mô tả
1 TextBox : dùng để nhập mật khẩu cũ
2 CheckBox dùng để xác nhận là cĩ cần mật khẩu khơng 3 TextBox : dùng để nhập mật khẩu mới
4 TextBox : gõ lại mật khẩu trong trường hợp cĩ sử dụng mật khẩu 5 Button Change : dùng để thực hiện chức năng thay đổi mật khậu
KHOA CNTT –
ĐH KHTN
6 Button Cancel : hủy bỏ việc thay đổi mật khẩu (adsbygoogle = window.adsbygoogle || []).push({});
Bảng 8-16: Các trường trên màn hình thay đổi mật khẩu 8.3.7 Thiết kế màn hình server :
Màn hình server được thiết kế để cho người quản trị cĩ thể kiểm sốat được cĩ bao nhiêu lớp đang được mở, các lớp này cĩ giáo viên đang dạy hay khơng.
Hình 8-19: Màn hình server
Mơ tả các trường trên màn hình :
STT Mô tả
1 ListCtrl thể hiện danh sách các lớp học đang được mở
2 Button Start : thực hiện chức năng khởi động server 3 Button Shutdown : thực hiện chức năng ngừng server 4 Button Exit : chấm dứt hoạt động của chương trình.
KHOA CNTT –
ĐH KHTN
8.4 Thiết kế xử lý :
8.4.1 Danh sách các xử lý :
STT Xử lý Mô tả Use Case tương ứng
1 XL1 Đăng ký làm thành viên mới DangKy 2 XL2 Kết nối client với server KetNoi
3 XL3 Đăng nhập vào hệ thống DangNhap 4 XL4 Thay đổi thơng tin cá nhân ThayDoiThongTinCaNhan 5 XL5 Thay đổi mật khẩu của lớp QuanLyLop
6 XL6 Xố lớp học QuanLyLop 7 XL7 Cho phép lớp học cĩ text chat QuanLyTextChat
8 XL8 Khơng cho phép lớp học cĩ text chat QuanLyTextChat 9 XL9 Cho phép xem hình ảnh của giáo viên QuanLyHinhAnh 10 XL10 Khong cho phép xem hình ảnh giáo
viên
QuanLyHinhAnh 11 XL11 Cho phép phát tiếng nĩi QuanLyAmThanh 12 XL12 Khơng cho phép phát tiếng nĩi QuanLyAmThanh
13 XL13 Yêu cầu phát biểu QuanLyThanhVien 14 XL14 Phát giọng nĩi của thành viên khác QuanLyThanhVien
15 XL15 Phát hình ảnh của thành viên khác QuanLyThanhVien
16 XL16 Thay đổi người chủ của lớp ThayDoiChuLop 17 XL17 Tạo một lớp học mới TaoLopHoc 18 XL18 Quản lý danh sách người dùng QuanLyDSNguoiDung
19 XL19 Thay đổi quyền đăng nhập của người dùng
ThayDoiQuyenNguoiDung
20 XL20 Quản lý hệ thống QuanLyHeThong 21 XL21 Quản lý danh sách lớp học QuanLyDSLopHoc
22 XL22 Chat bằng text trong lớp học ChatText 23 XL23 Truyền hình ảnh của thành viên trong TruyenHinhAnh
KHOA CNTT –
ĐH KHTN
lớp
24 XL24 Truyền tiếng nĩi của thành viên trong lớp
TruyềnHìnhAnh (adsbygoogle = window.adsbygoogle || []).push({});
Bảng 8-18: Danh sách các xử lý 8.4.2 Thiết kế các xử lý chính :
8.4.2.1 Thiết kế xử lý XL1 (Use case “DangKy”)
Lược đồ tuần tự (Sequence Diagram) :
KHOA CNTT – ĐH KHTN Biểu đồ cộng tác (Collaboration Diagram) Hình 8-21: Biểu đồ cộng tác của xử lý XL1 Danh sách các hành động : STT Hành động Ý nghĩa
1 YeuCauDangKy Ngừơi dùng cĩ yêu cầu đăng ký là thành viên của hệ thống
2 HienThiDangKy Hiển thị màn hình đăng ký
3 NhapTenMatKhau Người dùng nhập vào tên mật khẩu đăng nhập hệ thống
4 ThucHienDangKy Người dùng nhấn vào nút thực hiện việc đăng ký
5 GuiThongTinDangKy Thơng tin của người dùng được gửi đến cho server
KHOA CNTT –
ĐH KHTN
7 ThucHienDangKy Thực hiện việc đăng ký
8 LayThongTin Thực hiện lấy thơng tin trong cơ sở dữ liệu 9 XuLyDangKy Xử lý việc tạo thêm tài khoản mới
10 GuiThongBao Gửi thơng báo cho việc đăng ký
11 ThongBaoKetQua Server gửi thơng báo lại cho người dùng biết 12 HienThiDanhSachLop Đăng ký thành cơng thì hiển thị danh sách lớp
hiện cĩ trên hệ thống
13 XuLyPhanQuyen Dựa vào quyền của người mới đăng ký hiển thị các chức năng tương ứng.
14 ThongBaoKetQua Thơng báo lại kết qủa cho người sử dụng biết
Bảng 8-19: Danh sách các hành động của xử lý XL1 8.4.2.2 Thiết kế xử lý XL2 (Use case KetNoi):
Lược đồ tuần tự (Sequence Diagram) :
KHOA CNTT – ĐH KHTN Biều đồ cộng tác (Collaboration Diagram) Hình 8-23: Biểu đồ cộng tác của xử lý XL2 Danh sách các hành động : STT Hành động Ý nghĩa
1 ThucHienKetNoi Người dùng muốn kết nối với server 2 HienThiManHinhKetNoi Hiển thị màn hình kết nối
3 NhapDiaChiIP Nhập địa chỉ Ip vào
4 NhanKetNoi Người dùng thực hiện nhấn kết nối
5 ThucHienKetNoi Chương trình bắt đầu thực hiện việc kết nối 6 KetNoiServer Chương trình yêu cầu kết nối với server 7 XuLyKetNoi Xử lý kết nối trên server
KHOA CNTT –
ĐH KHTN
9 XuLyKetNoi Trên client sẽ xử lý kết nối với server thành cơng
10 ThơngBaoKetNoi Thơng báo lại cho người dùng biếtt 11 ThongBao Hiển thị thơng báo
Bảng 8-20: Danh sách các hành động của xử lý XL2 8.4.2.3 Thiết kế xử lý XL3 (Use case DangNhap ): (adsbygoogle = window.adsbygoogle || []).push({});
Lược đồ tuần tự (Sequence Diagram) :
KHOA CNTT – ĐH KHTN Biều đồ cộng tác (Collaboration Diagram) Hình 8-25: Biểu đồ cộng tác của xử lý XL3 Danh sách các hành động : STT Hành động Ý nghĩa
1 Yeu CauDangNhap Khi kết nối với server thành cơng, thì server yêu cầu đăng nhập
2 HienThiDangNhap Hiển thị màn hình đăng nhập
3 NhapMatKhau Người dùng cung cấp thơng tin về mật khầu, tên
đăng nhập
4 ThucHienDangNhap Người dùng thực hiện việc đăng nhập 5 GuiThongTinDangNhap Yêu cầu gửi thơng tin đăng nhập 6 DangNhap Xử lý thơng tin đăng nhập 7 KiemTraDangNhap Kiểm tra việc đăng nhập 8 LayThơng Tin Lấy thơng tin từ cơ sở dữ liệu
KHOA CNTT –
ĐH KHTN
9 XuLyDangNhap Xử lý viêc đăng nhập
10 ThongBaoKetQua Thơng báo kết quả của việc đăng nhập 11 GuiThongTinDangNhap Server yêu cầu gửi thơng tin đăng nhập cho
người sử dụng
12 PhanQuyen Dựa vào thơng tin do server gửi trả lại, client thực hiện việc phân quyền.
13 ThongBaoKetQua Thơng báo kết qủa lại cho người ử dụng biết
Bảng 8-21: Danh sách các hành động của xử lý XL3 8.4.2.4 Thiết kế xử lý XL5 (Use case QuanLyLop):
Lược đồ tuần tự (Sequence Diagram) :
KHOA CNTT – ĐH KHTN Biều đồ cộng tác (Collaboration Diagram) Hình 8-27: Biểu đồ cộng tác của xử lý XL5 Danh sách các hành động : STT Hành động Ý nghĩa
1 YeuCauhienThiDSLop Khi kết nối thành cơng, server sẽ yêu cầu hiển thị danh sách lớp
2 HienThi Hiển thị danh sách lớp 3 ChonLop Người dùng chọn 1 lớp
4 ThayDoiMatKhau Người dùng thực hiện chức năng thay đổi mật khẩu
KHOA CNTT –
ĐH KHTN
5 HienThi Hiển thị màn hình nhập mật khẩu
6 NhâpThongTin Nhập thơng tin mật khẩu của lớp cần đổi 7 TraThongTin Trả thơng tin lại cho màn hình trước đĩ 8 GuiThongTinMatKhau Yêu cầu gửi thơng tin mật khẩu về cho server 9 XuLyThongTin Server xử lý thơng tin nhận được
10 ThayDoiMatKhau Thực hiện việc thay đổi mật khẩu 11 KiemTraHopLe Kiểm tra xem thơng tin cĩ hợp lệ khơng 12 CapNhatThongTin Cập nhật lại thơng tin đã được thay đổi