Require full registration

js/src/api.js

@@ -151,7 +151,7 @@ const attachmentAddDoboard = async (fileData) => {
     // @ToDo need to handle result?
 };
 
-const registerUserDoboard = async (projectToken, accountId, email, nickname, pageURL) => {
+const registerUserDoboard = async (projectToken, accountId, email, nickname) => {
     let data = {
         project_token: projectToken,
         account_id: accountId,
@@ -367,6 +367,17 @@ const userUpdateDoboard = async (projectToken, accountId, sessionId, userId, tim
     };
 };
 
+const getProjectDoboard = async (projectToken, accountId) => {
+    const sessionId = localStorage.getItem('spotfix_session_id');
+    const data = {
+        project_token: projectToken,
+    };
+    if (sessionId) {
+        data.session_id = sessionId;
+    }
+    return await spotfixApiCall(data, 'project_get', accountId);
+};
+
 const getReleaseVersion = async () => {
     try {
         const res = await fetch('https://api.github.com/repos/CleanTalk/SpotFix/tags');

js/src/loaders/SpotFixTemplatesLoader.js

@@ -157,12 +157,12 @@ class SpotFixTemplatesLoader {
             <label class="spotfix_placeholder_title" for="doboard_task_widget-title">Report about</label>
         </div>
 
-        <div class="doboard_task_widget-input-container doboard_task_widget-input-container-textarea" style="flex-grow: 1; min-height: 200px">
+        <div id="doboard_task_widget-description-container" class="doboard_task_widget-input-container doboard_task_widget-input-container-textarea" style="flex-grow: 1; min-height: 200px">
             <textarea id="doboard_task_widget-description" class="doboard_task_widget-field" name="description" placeholder=" " required></textarea>
             <label for="doboard_task_widget-description" class="doboard_task_widget-field-textarea-label" >Description</label>
         </div>
 
-        <div class="doboard_task_widget-login" style="margin-top: 12px; margin-bottom: 4px">
+        <div class="doboard_task_widget-login">
 
             <span  class="doboard_task_widget-login-icon" >Sign up here to receive notifications.</span>
 
@@ -178,11 +178,13 @@ class SpotFixTemplatesLoader {
                             <input id="doboard_task_widget-user_email" class="doboard_task_widget-field" type="email" name="user_email">
                             <label for="doboard_task_widget-user_email">Email</label>
                         </div>
-        
+
                         <div class="doboard_task_widget-input-container hidden">
                             <input id="doboard_task_widget-user_password" class="doboard_task_widget-field" type="password" name="user_password">
                             <label for="doboard_task_widget-user_password">Password</label>
                         </div>
+
+                        <button id="doboard_task_widget-register_only_button" class="doboard_task_widget-submit_button doboard_task_widget-hidden" style="margin-top: 8px; width: 100%;">Sign up</button>
 
                         <i>Note about DoBoard register and accepting email notifications about tasks have to be here.</i>
                         </br>

js/src/main.js

@@ -16,6 +16,21 @@ function spotFixInit() {
     new SpotFixSourcesLoader();
     new CleanTalkWidgetDoboard({}, 'wrap');
     loadBotDetector();
+
+    const projectToken = localStorage.getItem('spotfix_project_token');
+    const accountId = localStorage.getItem('spotfix_company_id');
+    if (projectToken && accountId) {
+        getProjectDoboard(projectToken, accountId)
+            .then(result => {
+                if (result && result?.projects && result?.projects[0]) {
+                    const project = result?.projects[0];
+                    if (project?.require_full_registration !== undefined) {
+                        localStorage.setItem('spotfix_require_full_registration', project?.require_full_registration);
+                    }
+                }
+            })
+            .catch(err => console.error('project_get error:', err));
+    }
 }
 
 function loadBotDetector() {
@@ -190,7 +205,7 @@ function getTaskFullDetails(tasksDetails, taskId) {
                 const commentAttachments = attachments
                     .filter(att => String(att.commentId) === String(comment.commentId))
                     .sort((a, b) => (a.attachmentOrder || 0) - (b.attachmentOrder || 0));
-                
+
                 return {
                     commentAuthorAvatarSrc: getAvatarSrc(author),
                     commentAuthorName: getAuthorName(author),

js/src/widget.js

@@ -468,6 +468,8 @@ class CleanTalkWidgetDoboard {
                             submitButton.closest('.doboard_task_widget-field').classList.remove('doboard_task_widget-hidden');
                         }
 
+                        await this.createWidgetElement('create_issue');
+
                 } catch (error) {
                     document.querySelector('.doboard_task_widget-login-is-invalid').classList.remove('doboard_task_widget-hidden');
                 }
@@ -519,6 +521,86 @@ class CleanTalkWidgetDoboard {
                 }
             })
         }
+
+        const registerOnlyButton = document.getElementById('doboard_task_widget-register_only_button');
+        if (registerOnlyButton) {
+            registerOnlyButton.addEventListener('click', async () => {
+                const userNameElement = document.getElementById('doboard_task_widget-user_name');
+                const userEmailElement = document.getElementById('doboard_task_widget-user_email');
+
+                const userName = userNameElement?.value?.trim();
+                const userEmail = userEmailElement?.value?.trim();
+                const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
+
+                if (!userName) {
+                    userNameElement.style.borderColor = 'red';
+                    userNameElement.focus();
+                    userNameElement.addEventListener('input', function() {
+                        this.style.borderColor = '';
+                    });
+                    return;
+                }
+
+                // Validate email
+                if (!userEmail) {
+                    userEmailElement.style.borderColor = 'red';
+                    userEmailElement.focus();
+                    userEmailElement.addEventListener('input', function() {
+                        this.style.borderColor = '';
+                    });
+                    return;
+                } else if (!emailRegex.test(userEmail)) {
+                    userEmailElement.style.borderColor = 'red';
+                    userEmailElement.focus();
+                    userEmailElement.addEventListener('input', function() {
+                        this.style.borderColor = '';
+                    });
+                    return;
+                }
+
+                registerOnlyButton.disabled = true;
+                registerOnlyButton.innerText = 'Signing up...';
+
+                try {
+                    const taskDetails = {
+                        userName: userName,
+                        userEmail: userEmail,
+                        projectToken: this.params.projectToken,
+                        accountId: this.params.accountId,
+                    };
+
+                    const response = await registerUser(taskDetails)(this.registrationShowMessage);
+
+                    if (response && response.accountExists) {
+                        const loginContainer = document.getElementById('doboard_task_widget-input-container-login');
+                        const phantomContainer = document.querySelector('.doboard_task_widget-input-container-phantom');
+                        const loginEmailElement = document.getElementById('doboard_task_widget-login_email');
+
+                        if (phantomContainer) {
+                            phantomContainer.classList.add('doboard_task_widget-hidden');
+                        }
+                        if (loginContainer) {
+                            loginContainer.classList.remove('doboard_task_widget-hidden');
+                        }
+                        if (loginEmailElement && userEmail) {
+                            loginEmailElement.value = userEmail;
+                            loginEmailElement.classList.add('has-value');
+                        }
+                        registerOnlyButton.classList.add('doboard_task_widget-hidden');
+
+                        this.registrationShowMessage('Account already exists. Please login with your password.', 'notice');
+                    } else if (localStorage.getItem('spotfix_session_id')) {
+                        // Redraw widget after successful registration
+                        await this.createWidgetElement('create_issue');
+                    }
+                } catch (error) {
+                    this.registrationShowMessage(error.message, 'error');
+                }
+
+                registerOnlyButton.disabled = false;
+                registerOnlyButton.innerText = 'Sign up';
+            });
+        }
     }
 
     /**
@@ -675,6 +757,41 @@ class CleanTalkWidgetDoboard {
                     document.querySelector('.doboard_task_widget-login').classList.add('hidden');
                 }
 
+                const requireFullRegistration = localStorage.getItem('spotfix_require_full_registration') === '1';
+                const titleContainer = document.getElementById('doboard_task_widget-title')?.closest('.doboard_task_widget-input-container');
+                const descriptionContainer = document.getElementById('doboard_task_widget-description-container');
+                const requireFullRegistrationMessage = document.getElementById('doboard_task_widget-require_full_registration');
+                const submitButtonContainer = document.getElementById('doboard_task_widget-submit_button')?.closest('.doboard_task_widget-field');
+                const visibilityToggle = document.querySelector('.doboard_task_widget-visibility-toggle');
+
+                const registerOnlyButton = document.getElementById('doboard_task_widget-register_only_button');
+
+                if (requireFullRegistration && !sessionIdExists) {
+                    if (titleContainer) titleContainer.style.display = '';
+                    if (descriptionContainer) descriptionContainer.style.display = '';
+                    if (submitButtonContainer) submitButtonContainer.style.display = 'none';
+                    if (visibilityToggle) visibilityToggle.style.display = 'none';
+                    if (requireFullRegistrationMessage) requireFullRegistrationMessage.classList.remove('doboard_task_widget-hidden');
+                    const loginSection = document.querySelector('.doboard_task_widget-login');
+                    if (loginSection) loginSection.classList.add('active');
+                    // Hide login accordion icon when require_full_registration
+                    const loginIcon = document.querySelector('.doboard_task_widget-login-icon');
+                    if (loginIcon) loginIcon.classList.add('doboard_task_widget-login-icon-hidden');
+                    // Show register only button
+                    if (registerOnlyButton) registerOnlyButton.classList.remove('doboard_task_widget-hidden');
+                } else {
+                    if (titleContainer) titleContainer.style.display = '';
+                    if (descriptionContainer) descriptionContainer.style.display = '';
+                    if (submitButtonContainer) submitButtonContainer.style.display = '';
+                    if (visibilityToggle) visibilityToggle.style.display = '';
+                    if (requireFullRegistrationMessage) requireFullRegistrationMessage.classList.add('doboard_task_widget-hidden');
+                    // Show login accordion icon when not require_full_registration
+                    const loginIcon = document.querySelector('.doboard_task_widget-login-icon');
+                    if (loginIcon) loginIcon.classList.remove('doboard_task_widget-login-icon-hidden');
+                    // Hide register only button
+                    if (registerOnlyButton) registerOnlyButton.classList.add('doboard_task_widget-hidden');
+                }
+
                 if (
                     selection.type === 'Range'
                 ) {
@@ -1614,7 +1731,16 @@ class CleanTalkWidgetDoboard {
         if ( accordionController ) {
             const context = this;
             accordionController.addEventListener('click', function() {
-                this.closest('.doboard_task_widget-login').classList.toggle('active');
+                const loginSection = this.closest('.doboard_task_widget-login');
+                const requireFullRegistration = localStorage.getItem('spotfix_require_full_registration') === '1';
+                const sessionIdExists = !!localStorage.getItem('spotfix_session_id');
+
+                if (requireFullRegistration && !sessionIdExists) {
+                    loginSection.classList.add('active');
+                } else {
+                    loginSection.classList.toggle('active');
+                }
+
                 // Scroll
                 context.positionWidgetContainer();
                 setTimeout(() => {