[mirotalksfu] - update whiteboard

README.md

@@ -31,7 +31,7 @@ Open the app with the following **supported browsers** & many more...
 -   Screen Sharing to present documents, slides, and more ...
 -   File Sharing, share any files to your participants in the room
 -   Chat with Emoji Picker to show you feeling and possibility to Save the conversations
--   Collaborative whiteboard for the teachers
+-   Advance collaborative whiteboard for the teachers
 -   Select Microphone - Speaker and Video source
 -   Recording your Screen, Audio or Video
 -   Share any YouTube video in real time to your participants

public/js/Room.js

@@ -686,7 +686,7 @@ function handleButtons() {
         whiteboardIsEraser(true);
     };
     whiteboardCleanBtn.onclick = () => {
-        whiteboardAction(getWhiteboardAction('clear'));
+        confirmClearBoard();
     };
     whiteboardCloseBtn.onclick = () => {
         whiteboardAction(getWhiteboardAction('close'));
@@ -732,6 +732,7 @@ function handleSelects() {
     };
     wbDrawingColorEl.onchange = () => {
         wbCanvas.freeDrawingBrush.color = wbDrawingColorEl.value;
+        whiteboardIsDrawingMode(true);
     };
     wbBackgroundColorEl.onchange = () => {
         let data = {
@@ -937,6 +938,7 @@ function isImageURL(url) {
 // ####################################################
 
 function toggleWhiteboard() {
+    if (!wbIsOpen) rc.sound('open');
     toggleWhiteboardSettings();
     let whiteboard = rc.getId('whiteboard');
     whiteboard.classList.toggle('show');
@@ -1229,6 +1231,29 @@ function getWhiteboardAction(action) {
     };
 }
 
+function confirmClearBoard() {
+    Swal.fire({
+        background: swalBackground,
+        imageUrl: image.delete,
+        position: 'center',
+        title: 'Clean the board',
+        text: 'Are you sure you want to clean the board?',
+        showDenyButton: true,
+        confirmButtonText: `Yes`,
+        denyButtonText: `No`,
+        showClass: {
+            popup: 'animate__animated animate__fadeInDown',
+        },
+        hideClass: {
+            popup: 'animate__animated animate__fadeOutUp',
+        },
+    }).then((result) => {
+        if (result.isConfirmed) {
+            whiteboardAction(getWhiteboardAction('clear'));
+        }
+    });
+}
+
 function whiteboardAction(data, emit = true) {
     if (emit) {
         if (rc.thereIsParticipants()) {