From 388397fe6620aef70b7707f38acf5abc5122cf42 Mon Sep 17 00:00:00 2001 From: AlexStratov2 <109147486+AlexStratov2@users.noreply.github.com> Date: Thu, 7 Mar 2024 11:16:41 +0200 Subject: [PATCH 01/32] Clear theme elements for WAI1 - Update _writing-evaluation-form.scss --- .../components/_writing-evaluation-form.scss | 41 +++++++++++++++++++ 1 file changed, 41 insertions(+) diff --git a/public/assets/scss/components/_writing-evaluation-form.scss b/public/assets/scss/components/_writing-evaluation-form.scss index 710e7ee..b92c6a7 100644 --- a/public/assets/scss/components/_writing-evaluation-form.scss +++ b/public/assets/scss/components/_writing-evaluation-form.scss @@ -119,3 +119,44 @@ background: #f5f4f4; } } + +/*----------- clear theme elements for Writing AI evaluation -------------*/ + +.header-mainmenu, +.edu-breadcrumb-area, +.nav-tabs, +.edu-course-widget, +.edu-footer, +h3.heading-title{ + + display: none; +} + + +.col-lg-8{ + width: 100% +} + +.course-details-content{ + max-width: 900px; + margin: 0 auto; + border: 1px solid #eaeaea; + border-radius: 5px; + padding: 0 50px 50px 50px; + box-shadow: 0px 10px 50px rgba(0, 0, 0, 0.05); +} + +.waf-textarea textarea{ + border: 1px solid #eaeaea !important; + border-radius: 5px; + height: 300px; + background-color: #fff ; +} + +button{ + margin-top: 30px; +} + +label{ + padding-left: 25px; +} From 18d6dcafd0be829402f992f76538397cce9e44ef Mon Sep 17 00:00:00 2001 From: AlexStratov2 <109147486+AlexStratov2@users.noreply.github.com> Date: Thu, 7 Mar 2024 14:35:01 +0200 Subject: [PATCH 02/32] Disabling jquery.js for further updates --- src/utils/jquery.js | 41 +++++++++++++++++++++-------------------- 1 file changed, 21 insertions(+), 20 deletions(-) diff --git a/src/utils/jquery.js b/src/utils/jquery.js index cd40398..19f9379 100644 --- a/src/utils/jquery.js +++ b/src/utils/jquery.js @@ -1,32 +1,33 @@ -if (typeof window !== 'undefined') { +// if (typeof window !== 'undefined') { - window.$ = window.jQuery = require('jquery'); +// window.$ = window.jQuery = require('jquery'); - $(document).ready(function() { +// $(document).ready(function() { - setTimeout(function() { // Change the h1 text +// setTimeout(function() { + + // // Change the h5 text + // $('h5').text("TST Prep's Writing Evaluation Demo 1"); - $('h5').text("TST Prep's Writing Evaluation Demo 1"); + // // Change placeholder text for textarea elements + // $('textarea[name="task"]').attr('placeholder', 'Paste your TOEFL integrated writing task here').css('margin-bottom', '30px'); + // $('textarea[name="essay"]').attr('placeholder', 'Paste or write your essay here'); - // Change placeholder text for textarea elements - $('textarea[name="task"]').attr('placeholder', 'Paste your TOEFL integrated writing task here').css('margin-bottom', '30px'); - $('textarea[name="essay"]').attr('placeholder', 'Paste or write your essay here'); + // // Move the task textarea and its label before the essay textarea + // var taskTextArea = $('textarea[name="task"]'); + // var taskLabel = $('label[for="task"]'); + // var essayTextArea = $('textarea[name="essay"]'); + // var essayLabel = $('label[for="essay"]'); - // Move the task textarea and its label before the essay textarea - var taskTextArea = $('textarea[name="task"]'); - var taskLabel = $('label[for="task"]'); - var essayTextArea = $('textarea[name="essay"]'); - var essayLabel = $('label[for="essay"]'); + // // Reorder the textareas: Move the task textarea and label before the essay label + // essayLabel.before(taskTextArea); + // taskTextArea.before(taskLabel); - // Reorder the textareas: Move the task textarea and label before the essay label - essayLabel.before(taskTextArea); - taskTextArea.before(taskLabel); +// }, 700); +// }); - }, 700); - }); - -} +// } From 946b8add8430ebf60deef7d756a322db49c90381 Mon Sep 17 00:00:00 2001 From: AlexStratov2 <109147486+AlexStratov2@users.noreply.github.com> Date: Thu, 7 Mar 2024 15:57:23 +0200 Subject: [PATCH 03/32] Adding code for behavior after submission --- src/utils/jquery.js | 100 ++++++++++++++++++++++++++++++++++---------- 1 file changed, 79 insertions(+), 21 deletions(-) diff --git a/src/utils/jquery.js b/src/utils/jquery.js index 19f9379..b1f6f83 100644 --- a/src/utils/jquery.js +++ b/src/utils/jquery.js @@ -1,33 +1,91 @@ -// if (typeof window !== 'undefined') { +if (typeof window !== 'undefined') { -// window.$ = window.jQuery = require('jquery'); + window.$ = window.jQuery = require('jquery'); -// $(document).ready(function() { + $(document).ready(function() { -// setTimeout(function() { - - // // Change the h5 text - // $('h5').text("TST Prep's Writing Evaluation Demo 1"); + setTimeout(function() { - // // Change placeholder text for textarea elements - // $('textarea[name="task"]').attr('placeholder', 'Paste your TOEFL integrated writing task here').css('margin-bottom', '30px'); - // $('textarea[name="essay"]').attr('placeholder', 'Paste or write your essay here'); - // // Move the task textarea and its label before the essay textarea - // var taskTextArea = $('textarea[name="task"]'); - // var taskLabel = $('label[for="task"]'); - // var essayTextArea = $('textarea[name="essay"]'); - // var essayLabel = $('label[for="essay"]'); + // PART 1 - edits on form content + + // Change the h5 text + $('h5').text("TST Prep's Writing Evaluation Demo 1"); - // // Reorder the textareas: Move the task textarea and label before the essay label - // essayLabel.before(taskTextArea); - // taskTextArea.before(taskLabel); + // Change placeholder text for textarea elements + $('textarea[name="task"]').attr('placeholder', 'Paste your TOEFL integrated writing task here').css('margin-bottom', '30px'); + $('textarea[name="essay"]').attr('placeholder', 'Paste or write your essay here'); -// }, 700); -// }); + // Part 2 - Behavior after form submission -// } + var targetNode = document.querySelector('.course-details-content'); + var config = { childList: true, subtree: true, characterData: true, attributes: true }; + + // Timer functionality encapsulated within startTimer function + function startTimer() { + var seconds = 0; // Initialize seconds to 0 + // Update the timer every second + return setInterval(function() { + seconds++; + $('#timer').text(seconds + ' seconds'); // Dynamically update the text + }, 1000); // Set interval to 1 second + } + + var timerInterval = null; // Declare outside to make it accessible + + // Callback function to execute when mutations are observed + var callback = function(mutationsList, observer) { + mutationsList.forEach(function(mutation) { + if (mutation.type === 'childList') { + mutation.addedNodes.forEach(function(node) { + if (node.nodeType === 1 && $(node).find('#timer').length) { + // Timer exists, indicating form submission occurred and timer was set + if (timerInterval) clearInterval(timerInterval); + timerInterval = startTimer(); // Start or restart the timer + } + }); + + if (!$(mutation.target).closest('.course-details-content').find('.edu-btn').length) { + // If the submit button disappears, clear the timer and remove additional content + clearInterval(timerInterval); + $('#elapsedTime, #waitingTime').remove(); + } + } + }); + }; + + var observer = new MutationObserver(callback); + observer.observe(targetNode, config); + + // Handle form submission + $('.course-details-content form').on('submit', function(event) { + event.preventDefault(); // Prevent the actual form submission for demonstration; adjust as needed + + // Initialize or reset UI elements and timer upon form submission + $('textarea[name="task"], textarea[name="essay"]').prop('disabled', true).css({ + 'background-color': '#f0f0f0', + 'cursor': 'not-allowed' + }); + + var submitButton = $(this).find('.edu-btn').prop('disabled', true).text('Loading...') + .css({'pointer-events': 'none', 'filter': 'saturate(30%)'}); + + if (!$('#elapsedTime').length) { + $('

Elapsed time: 0 seconds

').insertBefore(submitButton); + $('

Depending on the length of your essay and the amount of mistakes,
the waiting time can vary between 15s and 120s

').insertBefore(submitButton); + } + + if (timerInterval) clearInterval(timerInterval); // Clear any existing timer + timerInterval = startTimer(); // Start the timer + }); + + + }, 700); + }); + + +} From d2851e46158c025804fba64af661c9d3b0190906 Mon Sep 17 00:00:00 2001 From: AlexStratov2 <109147486+AlexStratov2@users.noreply.github.com> Date: Thu, 7 Mar 2024 16:09:26 +0200 Subject: [PATCH 04/32] Update script with technical comments --- src/utils/jquery.js | 135 +++++++++++++++++++++----------------------- 1 file changed, 65 insertions(+), 70 deletions(-) diff --git a/src/utils/jquery.js b/src/utils/jquery.js index b1f6f83..d9c8de4 100644 --- a/src/utils/jquery.js +++ b/src/utils/jquery.js @@ -1,91 +1,86 @@ if (typeof window !== 'undefined') { - + // Ensure jQuery is available globally in the window object, a necessary step if jQuery is being used in a React project. window.$ = window.jQuery = require('jquery'); - $(document).ready(function() { - - setTimeout(function() { - - - // PART 1 - edits on form content - - // Change the h5 text + // PART 1 - Edits on form content + // Feature: Update the heading to provide a clear title for the demo. + // For React: This could be done by storing the title in a state variable and using it directly in the render method or JSX return statement. $('h5').text("TST Prep's Writing Evaluation Demo 1"); - // Change placeholder text for textarea elements + // Feature: Update placeholder text in textarea fields to guide the user on what to input. + // For React: Control the placeholder text using state or props, allowing dynamic updates based on user interaction or other conditions. $('textarea[name="task"]').attr('placeholder', 'Paste your TOEFL integrated writing task here').css('margin-bottom', '30px'); $('textarea[name="essay"]').attr('placeholder', 'Paste or write your essay here'); - - - // Part 2 - Behavior after form submission - + // PART 2 - Behavior after form submission + // Setup to observe changes in the form container, allowing dynamic response to form submission and other events. var targetNode = document.querySelector('.course-details-content'); - var config = { childList: true, subtree: true, characterData: true, attributes: true }; - - // Timer functionality encapsulated within startTimer function - function startTimer() { - var seconds = 0; // Initialize seconds to 0 - // Update the timer every second - return setInterval(function() { - seconds++; - $('#timer').text(seconds + ' seconds'); // Dynamically update the text - }, 1000); // Set interval to 1 second - } - - var timerInterval = null; // Declare outside to make it accessible + var config = { childList: true, subtree: true, characterData: true, attributes: true }; + + // Timer functionality to provide feedback to the user after form submission. + // For React: Use the useState hook for the seconds counter and useEffect for starting the interval. Ensure to clear the interval on component unmount. + function startTimer() { + var seconds = 0; // Initialize seconds to 0 + return setInterval(function() { + seconds++; + $('#timer').text(seconds + ' seconds'); // Dynamically update the text + }, 1000); // Set interval to 1 second + } - // Callback function to execute when mutations are observed - var callback = function(mutationsList, observer) { - mutationsList.forEach(function(mutation) { - if (mutation.type === 'childList') { - mutation.addedNodes.forEach(function(node) { - if (node.nodeType === 1 && $(node).find('#timer').length) { - // Timer exists, indicating form submission occurred and timer was set - if (timerInterval) clearInterval(timerInterval); - timerInterval = startTimer(); // Start or restart the timer + var timerInterval = null; // Declare outside to make it accessible + + // Observe DOM mutations to dynamically adjust UI based on form interaction. + var callback = function(mutationsList, observer) { + mutationsList.forEach(function(mutation) { + if (mutation.type === 'childList') { + mutation.addedNodes.forEach(function(node) { + // Response to form submission: If the timer element is found, clear any existing timer and start a new one. + if (node.nodeType === 1 && $(node).find('#timer').length) { + if (timerInterval) clearInterval(timerInterval); + timerInterval = startTimer(); // Start or restart the timer + } + }); + + // Cleanup upon form or page change: If the submit button is no longer present, stop the timer and remove added content. + if (!$(mutation.target).closest('.course-details-content').find('.edu-btn').length) { + clearInterval(timerInterval); + $('#elapsedTime, #waitingTime').remove(); + } } }); + }; - if (!$(mutation.target).closest('.course-details-content').find('.edu-btn').length) { - // If the submit button disappears, clear the timer and remove additional content - clearInterval(timerInterval); - $('#elapsedTime, #waitingTime').remove(); - } - } - }); - }; - - var observer = new MutationObserver(callback); - observer.observe(targetNode, config); - - // Handle form submission - $('.course-details-content form').on('submit', function(event) { - event.preventDefault(); // Prevent the actual form submission for demonstration; adjust as needed - - // Initialize or reset UI elements and timer upon form submission - $('textarea[name="task"], textarea[name="essay"]').prop('disabled', true).css({ - 'background-color': '#f0f0f0', - 'cursor': 'not-allowed' - }); - - var submitButton = $(this).find('.edu-btn').prop('disabled', true).text('Loading...') - .css({'pointer-events': 'none', 'filter': 'saturate(30%)'}); + var observer = new MutationObserver(callback); + observer.observe(targetNode, config); - if (!$('#elapsedTime').length) { - $('

Elapsed time: 0 seconds

').insertBefore(submitButton); - $('

Depending on the length of your essay and the amount of mistakes,
the waiting time can vary between 15s and 120s

').insertBefore(submitButton); - } + // Handle form submission to disable inputs, show a loading state, and start a timer. + // For React: Implement form submission handling using event handlers. Manage form and button states with useState, and show feedback using state-driven UI updates. + $('.course-details-content form').on('submit', function(event) { + event.preventDefault(); // Prevent the actual form submission for demonstration; adjust as needed - if (timerInterval) clearInterval(timerInterval); // Clear any existing timer - timerInterval = startTimer(); // Start the timer - }); + // Disable inputs and show a visual cue to the user that the form is processing. + $('textarea[name="task"], textarea[name="essay"]').prop('disabled', true).css({ + 'background-color': '#f0f0f0', + 'cursor': 'not-allowed' + }); + + // Change the button text to "Loading..." to indicate processing state. + var submitButton = $(this).find('.edu-btn').prop('disabled', true).text('Loading...') + .css({'pointer-events': 'none', 'filter': 'saturate(30%)'}); + + // Add visual feedback about the elapsed time since form submission and expected wait time. + if (!$('#elapsedTime').length) { + $('

Elapsed time: 0 seconds

').insertBefore(submitButton); + $('

Depending on the length of your essay and the amount of mistakes,
the waiting time can vary between 15s and 120s

').insertBefore(submitButton); + } + // Start or reset the timer to give live feedback to the user. + if (timerInterval) clearInterval(timerInterval); // Clear any existing timer + timerInterval = startTimer(); // Start the timer + }); - }, 700); + }, 700); // Delay to ensure jQuery manipulations occur after React component render. }); - - } From 1a6827f8e693ac604a5d3feff19e4ed8281b9ae7 Mon Sep 17 00:00:00 2001 From: AlexStratov2 <109147486+AlexStratov2@users.noreply.github.com> Date: Thu, 7 Mar 2024 17:46:56 +0200 Subject: [PATCH 05/32] Added Part 3 - display original essay after submission --- src/utils/jquery.js | 31 +++++++++++++++++++++++++++++++ 1 file changed, 31 insertions(+) diff --git a/src/utils/jquery.js b/src/utils/jquery.js index d9c8de4..0b80964 100644 --- a/src/utils/jquery.js +++ b/src/utils/jquery.js @@ -81,6 +81,37 @@ if (typeof window !== 'undefined') { timerInterval = startTimer(); // Start the timer }); + // PART 3 - display the original content after submission + // Attach an event handler to the form submission on Screen 1 + $('.course-details-content form').submit(function() { + var essayContent = $('textarea[name="essay"]').val(); + localStorage.setItem('essayContent', essayContent); + console.log("Step 1: Form submitted on Screen 1"); + // After form submission, immediately check and display essay content + checkAndDisplayEssayContent(); + }); + + // Function to check for Screen 2 and display the essay content + function checkAndDisplayEssayContent() { + console.log("Step 2: Inside checkAndDisplayEssayContent function"); + var screen2Detected = $('.course-details-content h5').text().includes("TST Prep's Writing Evaluation Demo 1"); + if (screen2Detected) { + var essayContent = localStorage.getItem('essayContent'); + if (essayContent) { + // Create a paragraph element with the essay content, add class and insert after h5 title + var $essayParagraph = $('

').text(essayContent).addClass('original-essay').css('margin-bottom', '0px'); + $essayParagraph.insertAfter('.course-details-content h5'); + + // Create a bolded title and insert before the paragraph + var $title = $('

').text('Original Essay').addClass('original-essay-title').css('font-size', '16px').css('font-weight', 'bold').css('margin-bottom', '0px'); + $title.insertBefore($essayParagraph); + + localStorage.removeItem('essayContent'); // Optional: Clear the localStorage + console.log("Step 3: Original essay content displayed"); + } + } + } + }, 700); // Delay to ensure jQuery manipulations occur after React component render. }); } From 69effa647c27283fa2448151cb6c21758cc23278 Mon Sep 17 00:00:00 2001 From: AlexStratov2 <109147486+AlexStratov2@users.noreply.github.com> Date: Thu, 7 Mar 2024 18:01:20 +0200 Subject: [PATCH 06/32] Attempt to add a script to check when an element appears --- src/utils/jquery.js | 19 +++++++++++++++++++ 1 file changed, 19 insertions(+) diff --git a/src/utils/jquery.js b/src/utils/jquery.js index 0b80964..dba03a8 100644 --- a/src/utils/jquery.js +++ b/src/utils/jquery.js @@ -112,6 +112,25 @@ if (typeof window !== 'undefined') { } } + // Define a function to check for the presence of .content-box.hovertextp + function checkForElement() { + console.log("Check for element loaded"); + // Check if the element exists + if ($('.content-box.hovertextp').length > 0) { + console.log('.content-box.hovertextp element detected!'); + clearInterval(intervalId); // Stop checking once the element is detected + + // Update CSS for .original-essay and .original-essay-title elements + $('.original-essay, .original-essay-title').css('display', 'inline-block'); + } + } + + // Set an interval to periodically check for the presence of .content-box.hovertextp + var intervalId = setInterval(checkForElement, 1000); // Check every second (1000 milliseconds) + + + // THE END + }, 700); // Delay to ensure jQuery manipulations occur after React component render. }); } From 6fee2e2c2bb9fa9d34f739549bc3a23eeabb0616 Mon Sep 17 00:00:00 2001 From: AlexStratov2 <109147486+AlexStratov2@users.noreply.github.com> Date: Thu, 7 Mar 2024 18:17:52 +0200 Subject: [PATCH 07/32] Add a dropdown for sample task selection --- src/utils/jquery.js | 54 +++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 54 insertions(+) diff --git a/src/utils/jquery.js b/src/utils/jquery.js index dba03a8..e34e6f3 100644 --- a/src/utils/jquery.js +++ b/src/utils/jquery.js @@ -129,6 +129,60 @@ if (typeof window !== 'undefined') { var intervalId = setInterval(checkForElement, 1000); // Check every second (1000 milliseconds) + // PART 4 - add a dropdown with options to select a sample task + + // Execute code when the DOM is fully loaded + $(document).ready(function() { + // Create a dropdown with options + var dropdown = '
'; + + // Insert the dropdown above the task label + $(dropdown).insertBefore('.course-overview form .form-group:nth-child(2)'); + + // Event listener for dropdown change + $('#task-sample').change(function() { + var selectedSample = $(this).val(); + var taskContent = ''; + + // Define task content based on selected sample + switch(selectedSample) { + case '1': + taskContent = "Sample task 1
content"; + break; + case '2': + taskContent = "Sample task 2
content"; + break; + case '3': + taskContent = "Sample task 3
content"; + break; + case '4': + taskContent = "Sample task 4
content"; + break; + case '5': + taskContent = "Sample task 5
content"; + break; + case '6': + taskContent = "Sample task 6
content"; + break; + case '7': + taskContent = "Sample task 7
content"; + break; + case '8': + taskContent = "Sample task 8
content"; + break; + default: + taskContent = ""; // Default empty content + } + + // Autofill the task textarea with the selected task content as HTML + $('textarea[name="task"]').html(taskContent); + }); + }); + // THE END }, 700); // Delay to ensure jQuery manipulations occur after React component render. From 9236fcf06b4fa6181de754957eb1cf1805b1680e Mon Sep 17 00:00:00 2001 From: AlexStratov2 <109147486+AlexStratov2@users.noreply.github.com> Date: Thu, 7 Mar 2024 18:24:06 +0200 Subject: [PATCH 08/32] 1.6 - start using versioning numbers --- src/utils/jquery.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/utils/jquery.js b/src/utils/jquery.js index e34e6f3..0ffcefc 100644 --- a/src/utils/jquery.js +++ b/src/utils/jquery.js @@ -7,7 +7,7 @@ if (typeof window !== 'undefined') { // PART 1 - Edits on form content // Feature: Update the heading to provide a clear title for the demo. // For React: This could be done by storing the title in a state variable and using it directly in the render method or JSX return statement. - $('h5').text("TST Prep's Writing Evaluation Demo 1"); + $('h5').text("TST Prep's Writing Evaluation Demo 1.6"); // Feature: Update placeholder text in textarea fields to guide the user on what to input. // For React: Control the placeholder text using state or props, allowing dynamic updates based on user interaction or other conditions. From bf30fd5fde3d280dd7e7701c4f75faf3ab618f16 Mon Sep 17 00:00:00 2001 From: AlexStratov2 <109147486+AlexStratov2@users.noreply.github.com> Date: Thu, 7 Mar 2024 19:47:24 +0200 Subject: [PATCH 09/32] v1.0.7 - updated version number scheme + testing an insertion in screen 2 --- src/utils/jquery.js | 42 +++++++++++++++++++++++++----------------- 1 file changed, 25 insertions(+), 17 deletions(-) diff --git a/src/utils/jquery.js b/src/utils/jquery.js index 0ffcefc..5635d2b 100644 --- a/src/utils/jquery.js +++ b/src/utils/jquery.js @@ -7,7 +7,7 @@ if (typeof window !== 'undefined') { // PART 1 - Edits on form content // Feature: Update the heading to provide a clear title for the demo. // For React: This could be done by storing the title in a state variable and using it directly in the render method or JSX return statement. - $('h5').text("TST Prep's Writing Evaluation Demo 1.6"); + $('h5').text("TST Prep's Writing Evaluation Demo v1.0.7"); // Feature: Update placeholder text in textarea fields to guide the user on what to input. // For React: Control the placeholder text using state or props, allowing dynamic updates based on user interaction or other conditions. @@ -93,24 +93,32 @@ if (typeof window !== 'undefined') { // Function to check for Screen 2 and display the essay content function checkAndDisplayEssayContent() { - console.log("Step 2: Inside checkAndDisplayEssayContent function"); - var screen2Detected = $('.course-details-content h5').text().includes("TST Prep's Writing Evaluation Demo 1"); - if (screen2Detected) { - var essayContent = localStorage.getItem('essayContent'); - if (essayContent) { - // Create a paragraph element with the essay content, add class and insert after h5 title - var $essayParagraph = $('

').text(essayContent).addClass('original-essay').css('margin-bottom', '0px'); - $essayParagraph.insertAfter('.course-details-content h5'); - - // Create a bolded title and insert before the paragraph - var $title = $('

').text('Original Essay').addClass('original-essay-title').css('font-size', '16px').css('font-weight', 'bold').css('margin-bottom', '0px'); - $title.insertBefore($essayParagraph); - - localStorage.removeItem('essayContent'); // Optional: Clear the localStorage - console.log("Step 3: Original essay content displayed"); - } + console.log("Step 2: Inside checkAndDisplayEssayContent function"); + var screen2Detected = $('.course-details-content h5').text().includes("TST Prep's Writing Evaluation Demo 1"); + if (screen2Detected) { + var essayContent = localStorage.getItem('essayContent'); + if (essayContent) { + // Create a paragraph element with the essay content, add class and insert after h5 title + var $essayParagraph = $('

').text(essayContent).addClass('original-essay').css('margin-bottom', '0px'); + $essayParagraph.insertAfter('.course-details-content h5'); + + // Create a bolded title and insert before the paragraph + var $title = $('

').text('Original Essay').addClass('original-essay-title').css('font-size', '16px').css('font-weight', 'bold').css('margin-bottom', '0px'); + $title.insertBefore($essayParagraph); + + localStorage.removeItem('essayContent'); // Optional: Clear the localStorage + console.log("Step 3: Original essay content displayed"); } } + console.log("Ready to insert buttons"); + insertButtons(); // Call the new function here + } + + // Define the new function somewhere else in the file + function insertButtons() { + console.log("Inserting buttons now..."); + // Your button insertion logic here + } // Define a function to check for the presence of .content-box.hovertextp function checkForElement() { From ac23779989641bcefc843aa5fc06bcacadd67733 Mon Sep 17 00:00:00 2001 From: AlexStratov2 <109147486+AlexStratov2@users.noreply.github.com> Date: Thu, 7 Mar 2024 20:03:49 +0200 Subject: [PATCH 10/32] v1.0.8 - Insert buttons for 3-way view in screen 2 --- src/utils/jquery.js | 73 +++++++++++++++++++++++++++------------------ 1 file changed, 44 insertions(+), 29 deletions(-) diff --git a/src/utils/jquery.js b/src/utils/jquery.js index 5635d2b..59a6d90 100644 --- a/src/utils/jquery.js +++ b/src/utils/jquery.js @@ -4,17 +4,17 @@ if (typeof window !== 'undefined') { $(document).ready(function() { setTimeout(function() { - // PART 1 - Edits on form content + // PART 1 - Edits on form content -------------------------------------------------------------------------------------------------------------------------------------------------------- // Feature: Update the heading to provide a clear title for the demo. // For React: This could be done by storing the title in a state variable and using it directly in the render method or JSX return statement. - $('h5').text("TST Prep's Writing Evaluation Demo v1.0.7"); + $('h5').text("TST Prep's Writing Evaluation Demo v1.0.8"); // Feature: Update placeholder text in textarea fields to guide the user on what to input. // For React: Control the placeholder text using state or props, allowing dynamic updates based on user interaction or other conditions. $('textarea[name="task"]').attr('placeholder', 'Paste your TOEFL integrated writing task here').css('margin-bottom', '30px'); $('textarea[name="essay"]').attr('placeholder', 'Paste or write your essay here'); - // PART 2 - Behavior after form submission + // PART 2 - Behavior after form submission -------------------------------------------------------------------------------------------------------------------------------------------------------- // Setup to observe changes in the form container, allowing dynamic response to form submission and other events. var targetNode = document.querySelector('.course-details-content'); var config = { childList: true, subtree: true, characterData: true, attributes: true }; @@ -81,7 +81,7 @@ if (typeof window !== 'undefined') { timerInterval = startTimer(); // Start the timer }); - // PART 3 - display the original content after submission + // PART 3 - display the original content after submission -------------------------------------------------------------------------------------------------------------------------------------------------------- // Attach an event handler to the form submission on Screen 1 $('.course-details-content form').submit(function() { var essayContent = $('textarea[name="essay"]').val(); @@ -93,32 +93,26 @@ if (typeof window !== 'undefined') { // Function to check for Screen 2 and display the essay content function checkAndDisplayEssayContent() { - console.log("Step 2: Inside checkAndDisplayEssayContent function"); - var screen2Detected = $('.course-details-content h5').text().includes("TST Prep's Writing Evaluation Demo 1"); - if (screen2Detected) { - var essayContent = localStorage.getItem('essayContent'); - if (essayContent) { - // Create a paragraph element with the essay content, add class and insert after h5 title - var $essayParagraph = $('

').text(essayContent).addClass('original-essay').css('margin-bottom', '0px'); - $essayParagraph.insertAfter('.course-details-content h5'); - - // Create a bolded title and insert before the paragraph - var $title = $('

').text('Original Essay').addClass('original-essay-title').css('font-size', '16px').css('font-weight', 'bold').css('margin-bottom', '0px'); - $title.insertBefore($essayParagraph); - - localStorage.removeItem('essayContent'); // Optional: Clear the localStorage - console.log("Step 3: Original essay content displayed"); + console.log("Step 2: Inside checkAndDisplayEssayContent function"); + var screen2Detected = $('.course-details-content h5').text().includes("TST Prep's Writing Evaluation Demo 1"); + if (screen2Detected) { + var essayContent = localStorage.getItem('essayContent'); + if (essayContent) { + // Create a paragraph element with the essay content, add class and insert after h5 title + var $essayParagraph = $('

').text(essayContent).addClass('original-essay').css('margin-bottom', '0px'); + $essayParagraph.insertAfter('.course-details-content h5'); + + // Create a bolded title and insert before the paragraph + var $title = $('

').text('Original Essay').addClass('original-essay-title').css('font-size', '16px').css('font-weight', 'bold').css('margin-bottom', '0px'); + $title.insertBefore($essayParagraph); + + localStorage.removeItem('essayContent'); // Optional: Clear the localStorage + console.log("Step 3: Original essay content displayed"); + } } + console.log("Ready to insert buttons"); + insertButtons(); // Call the new function here } - console.log("Ready to insert buttons"); - insertButtons(); // Call the new function here - } - - // Define the new function somewhere else in the file - function insertButtons() { - console.log("Inserting buttons now..."); - // Your button insertion logic here - } // Define a function to check for the presence of .content-box.hovertextp function checkForElement() { @@ -137,7 +131,7 @@ if (typeof window !== 'undefined') { var intervalId = setInterval(checkForElement, 1000); // Check every second (1000 milliseconds) - // PART 4 - add a dropdown with options to select a sample task + // PART 4 - add a dropdown with options to select a sample task -------------------------------------------------------------------------------------------------------------------------------------------------------- // Execute code when the DOM is fully loaded $(document).ready(function() { @@ -190,6 +184,27 @@ if (typeof window !== 'undefined') { $('textarea[name="task"]').html(taskContent); }); }); + + // PART 5 - 3-way view behavior -------------------------------------------------------------------------------------------------------------------------------------------------------- + + function insertButtons() { + console.log("Inserting buttons now..."); + // Create a div element and add the 'buttons-container' class to it + var $buttonsContainer = $('
').addClass('buttons-container'); + + // Create buttons with the specified labels + var $buttonOriginalEssay = $('').text('Original Essay').addClass('btn-original-essay'); + var $buttonInlineCorrections = $('').text('Inline Corrections').addClass('btn-inline-corrections'); + var $buttonCorrectedEssay = $('').text('Corrected Essay').addClass('btn-corrected-essay'); + + // Append the buttons to the buttons-container div + $buttonsContainer.append($buttonOriginalEssay, $buttonInlineCorrections, $buttonCorrectedEssay); + + // Find the .content-box.hovertextp element and insert the buttons container above it + $buttonsContainer.insertBefore('.content-box.hovertextp'); + + console.log("Buttons container and buttons inserted."); + } // THE END From f7529c7261597720531d86859262cad39b93cf8a Mon Sep 17 00:00:00 2001 From: AlexStratov2 <109147486+AlexStratov2@users.noreply.github.com> Date: Thu, 7 Mar 2024 20:10:54 +0200 Subject: [PATCH 11/32] v1.0.7b - fall back to v1.0.7 after v1.0.8 failed Same as v1.0.7 --- src/utils/jquery.js | 73 ++++++++++++++++++--------------------------- 1 file changed, 29 insertions(+), 44 deletions(-) diff --git a/src/utils/jquery.js b/src/utils/jquery.js index 59a6d90..f45b917 100644 --- a/src/utils/jquery.js +++ b/src/utils/jquery.js @@ -4,17 +4,17 @@ if (typeof window !== 'undefined') { $(document).ready(function() { setTimeout(function() { - // PART 1 - Edits on form content -------------------------------------------------------------------------------------------------------------------------------------------------------- + // PART 1 - Edits on form content // Feature: Update the heading to provide a clear title for the demo. // For React: This could be done by storing the title in a state variable and using it directly in the render method or JSX return statement. - $('h5').text("TST Prep's Writing Evaluation Demo v1.0.8"); + $('h5').text("TST Prep's Writing Evaluation Demo v1.0.7b"); // Feature: Update placeholder text in textarea fields to guide the user on what to input. // For React: Control the placeholder text using state or props, allowing dynamic updates based on user interaction or other conditions. $('textarea[name="task"]').attr('placeholder', 'Paste your TOEFL integrated writing task here').css('margin-bottom', '30px'); $('textarea[name="essay"]').attr('placeholder', 'Paste or write your essay here'); - // PART 2 - Behavior after form submission -------------------------------------------------------------------------------------------------------------------------------------------------------- + // PART 2 - Behavior after form submission // Setup to observe changes in the form container, allowing dynamic response to form submission and other events. var targetNode = document.querySelector('.course-details-content'); var config = { childList: true, subtree: true, characterData: true, attributes: true }; @@ -81,7 +81,7 @@ if (typeof window !== 'undefined') { timerInterval = startTimer(); // Start the timer }); - // PART 3 - display the original content after submission -------------------------------------------------------------------------------------------------------------------------------------------------------- + // PART 3 - display the original content after submission // Attach an event handler to the form submission on Screen 1 $('.course-details-content form').submit(function() { var essayContent = $('textarea[name="essay"]').val(); @@ -93,26 +93,32 @@ if (typeof window !== 'undefined') { // Function to check for Screen 2 and display the essay content function checkAndDisplayEssayContent() { - console.log("Step 2: Inside checkAndDisplayEssayContent function"); - var screen2Detected = $('.course-details-content h5').text().includes("TST Prep's Writing Evaluation Demo 1"); - if (screen2Detected) { - var essayContent = localStorage.getItem('essayContent'); - if (essayContent) { - // Create a paragraph element with the essay content, add class and insert after h5 title - var $essayParagraph = $('

').text(essayContent).addClass('original-essay').css('margin-bottom', '0px'); - $essayParagraph.insertAfter('.course-details-content h5'); - - // Create a bolded title and insert before the paragraph - var $title = $('

').text('Original Essay').addClass('original-essay-title').css('font-size', '16px').css('font-weight', 'bold').css('margin-bottom', '0px'); - $title.insertBefore($essayParagraph); - - localStorage.removeItem('essayContent'); // Optional: Clear the localStorage - console.log("Step 3: Original essay content displayed"); - } + console.log("Step 2: Inside checkAndDisplayEssayContent function"); + var screen2Detected = $('.course-details-content h5').text().includes("TST Prep's Writing Evaluation Demo 1"); + if (screen2Detected) { + var essayContent = localStorage.getItem('essayContent'); + if (essayContent) { + // Create a paragraph element with the essay content, add class and insert after h5 title + var $essayParagraph = $('

').text(essayContent).addClass('original-essay').css('margin-bottom', '0px'); + $essayParagraph.insertAfter('.course-details-content h5'); + + // Create a bolded title and insert before the paragraph + var $title = $('

').text('Original Essay').addClass('original-essay-title').css('font-size', '16px').css('font-weight', 'bold').css('margin-bottom', '0px'); + $title.insertBefore($essayParagraph); + + localStorage.removeItem('essayContent'); // Optional: Clear the localStorage + console.log("Step 3: Original essay content displayed"); } - console.log("Ready to insert buttons"); - insertButtons(); // Call the new function here } + console.log("Ready to insert buttons"); + insertButtons(); // Call the new function here + } + + // Define the new function somewhere else in the file + function insertButtons() { + console.log("Inserting buttons now..."); + // Your button insertion logic here + } // Define a function to check for the presence of .content-box.hovertextp function checkForElement() { @@ -131,7 +137,7 @@ if (typeof window !== 'undefined') { var intervalId = setInterval(checkForElement, 1000); // Check every second (1000 milliseconds) - // PART 4 - add a dropdown with options to select a sample task -------------------------------------------------------------------------------------------------------------------------------------------------------- + // PART 4 - add a dropdown with options to select a sample task // Execute code when the DOM is fully loaded $(document).ready(function() { @@ -184,27 +190,6 @@ if (typeof window !== 'undefined') { $('textarea[name="task"]').html(taskContent); }); }); - - // PART 5 - 3-way view behavior -------------------------------------------------------------------------------------------------------------------------------------------------------- - - function insertButtons() { - console.log("Inserting buttons now..."); - // Create a div element and add the 'buttons-container' class to it - var $buttonsContainer = $('
').addClass('buttons-container'); - - // Create buttons with the specified labels - var $buttonOriginalEssay = $('').text('Original Essay').addClass('btn-original-essay'); - var $buttonInlineCorrections = $('').text('Inline Corrections').addClass('btn-inline-corrections'); - var $buttonCorrectedEssay = $('').text('Corrected Essay').addClass('btn-corrected-essay'); - - // Append the buttons to the buttons-container div - $buttonsContainer.append($buttonOriginalEssay, $buttonInlineCorrections, $buttonCorrectedEssay); - - // Find the .content-box.hovertextp element and insert the buttons container above it - $buttonsContainer.insertBefore('.content-box.hovertextp'); - - console.log("Buttons container and buttons inserted."); - } // THE END From c69cee434aa3a37089be02f219af81c5c289f2d3 Mon Sep 17 00:00:00 2001 From: AlexStratov2 <109147486+AlexStratov2@users.noreply.github.com> Date: Thu, 7 Mar 2024 20:15:56 +0200 Subject: [PATCH 12/32] v1.0.6b - fall back to 1.0.6 after 1.0.7 failed --- src/utils/jquery.js | 42 +++++++++++++++++------------------------- 1 file changed, 17 insertions(+), 25 deletions(-) diff --git a/src/utils/jquery.js b/src/utils/jquery.js index f45b917..3da5581 100644 --- a/src/utils/jquery.js +++ b/src/utils/jquery.js @@ -7,7 +7,7 @@ if (typeof window !== 'undefined') { // PART 1 - Edits on form content // Feature: Update the heading to provide a clear title for the demo. // For React: This could be done by storing the title in a state variable and using it directly in the render method or JSX return statement. - $('h5').text("TST Prep's Writing Evaluation Demo v1.0.7b"); + $('h5').text("TST Prep's Writing Evaluation Demo v1.0.6b"); // Feature: Update placeholder text in textarea fields to guide the user on what to input. // For React: Control the placeholder text using state or props, allowing dynamic updates based on user interaction or other conditions. @@ -93,32 +93,24 @@ if (typeof window !== 'undefined') { // Function to check for Screen 2 and display the essay content function checkAndDisplayEssayContent() { - console.log("Step 2: Inside checkAndDisplayEssayContent function"); - var screen2Detected = $('.course-details-content h5').text().includes("TST Prep's Writing Evaluation Demo 1"); - if (screen2Detected) { - var essayContent = localStorage.getItem('essayContent'); - if (essayContent) { - // Create a paragraph element with the essay content, add class and insert after h5 title - var $essayParagraph = $('

').text(essayContent).addClass('original-essay').css('margin-bottom', '0px'); - $essayParagraph.insertAfter('.course-details-content h5'); - - // Create a bolded title and insert before the paragraph - var $title = $('

').text('Original Essay').addClass('original-essay-title').css('font-size', '16px').css('font-weight', 'bold').css('margin-bottom', '0px'); - $title.insertBefore($essayParagraph); - - localStorage.removeItem('essayContent'); // Optional: Clear the localStorage - console.log("Step 3: Original essay content displayed"); + console.log("Step 2: Inside checkAndDisplayEssayContent function"); + var screen2Detected = $('.course-details-content h5').text().includes("TST Prep's Writing Evaluation Demo 1"); + if (screen2Detected) { + var essayContent = localStorage.getItem('essayContent'); + if (essayContent) { + // Create a paragraph element with the essay content, add class and insert after h5 title + var $essayParagraph = $('

').text(essayContent).addClass('original-essay').css('margin-bottom', '0px'); + $essayParagraph.insertAfter('.course-details-content h5'); + + // Create a bolded title and insert before the paragraph + var $title = $('

').text('Original Essay').addClass('original-essay-title').css('font-size', '16px').css('font-weight', 'bold').css('margin-bottom', '0px'); + $title.insertBefore($essayParagraph); + + localStorage.removeItem('essayContent'); // Optional: Clear the localStorage + console.log("Step 3: Original essay content displayed"); + } } } - console.log("Ready to insert buttons"); - insertButtons(); // Call the new function here - } - - // Define the new function somewhere else in the file - function insertButtons() { - console.log("Inserting buttons now..."); - // Your button insertion logic here - } // Define a function to check for the presence of .content-box.hovertextp function checkForElement() { From f0ed4a12455515c00ff988ffbf3896ba04bde119 Mon Sep 17 00:00:00 2001 From: AlexStratov2 <109147486+AlexStratov2@users.noreply.github.com> Date: Tue, 12 Mar 2024 14:00:04 +0200 Subject: [PATCH 13/32] Update _writing-evaluation-form.scss --- public/assets/scss/components/_writing-evaluation-form.scss | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/public/assets/scss/components/_writing-evaluation-form.scss b/public/assets/scss/components/_writing-evaluation-form.scss index b92c6a7..e2e6de4 100644 --- a/public/assets/scss/components/_writing-evaluation-form.scss +++ b/public/assets/scss/components/_writing-evaluation-form.scss @@ -13,6 +13,12 @@ padding: 0 3px; } +.garbled{ + text-decoration-style: wavy; + text-decoration: underline; + color: #d5baba; +} + .corrected { border-bottom: 2px solid #9ec59e; padding-left: 3px; From e3d8093c556c1ebfe56c75871c1723fb6159cc1f Mon Sep 17 00:00:00 2001 From: AlexStratov2 <109147486+AlexStratov2@users.noreply.github.com> Date: Tue, 12 Mar 2024 17:06:43 +0200 Subject: [PATCH 14/32] Update _writing-evaluation-form.scss --- public/assets/scss/components/_writing-evaluation-form.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/public/assets/scss/components/_writing-evaluation-form.scss b/public/assets/scss/components/_writing-evaluation-form.scss index e2e6de4..419e533 100644 --- a/public/assets/scss/components/_writing-evaluation-form.scss +++ b/public/assets/scss/components/_writing-evaluation-form.scss @@ -14,8 +14,8 @@ } .garbled{ - text-decoration-style: wavy; text-decoration: underline; + text-decoration-style: wavy !important; color: #d5baba; } From d1663dc10ef36144a9a6b2495db08f3566fe8b42 Mon Sep 17 00:00:00 2001 From: AlexStratov2 <109147486+AlexStratov2@users.noreply.github.com> Date: Tue, 12 Mar 2024 17:09:36 +0200 Subject: [PATCH 15/32] Update _writing-evaluation-form.scss --- public/assets/scss/components/_writing-evaluation-form.scss | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/public/assets/scss/components/_writing-evaluation-form.scss b/public/assets/scss/components/_writing-evaluation-form.scss index 419e533..7889f9d 100644 --- a/public/assets/scss/components/_writing-evaluation-form.scss +++ b/public/assets/scss/components/_writing-evaluation-form.scss @@ -8,7 +8,7 @@ .incorrect, .delete { text-decoration: line-through; - border-bottom: 2px solid #c38181; + border-bottom: 1px solid #c38181; color: #d5bbbb !important; padding: 0 3px; } @@ -20,7 +20,7 @@ } .corrected { - border-bottom: 2px solid #9ec59e; + border-bottom: 1px solid #9ec59e; padding-left: 3px; font-weight: 600; } From 48915075299b0a452cfc5557842960765d46869c Mon Sep 17 00:00:00 2001 From: AlexStratov2 <109147486+AlexStratov2@users.noreply.github.com> Date: Tue, 12 Mar 2024 17:27:58 +0200 Subject: [PATCH 16/32] Update _writing-evaluation-form.scss --- public/assets/scss/components/_writing-evaluation-form.scss | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/public/assets/scss/components/_writing-evaluation-form.scss b/public/assets/scss/components/_writing-evaluation-form.scss index 7889f9d..bb3ccd9 100644 --- a/public/assets/scss/components/_writing-evaluation-form.scss +++ b/public/assets/scss/components/_writing-evaluation-form.scss @@ -14,8 +14,10 @@ } .garbled{ - text-decoration: underline; - text-decoration-style: wavy !important; + // text-decoration: underline; + // text-decoration-style: wavy !important; + // text-decoration-thickness: 1px; + text-decoration-line: grammar-error; color: #d5baba; } From c5b65dd5e341bf7cbf8044e8157d360ccf29a815 Mon Sep 17 00:00:00 2001 From: Valentin Ceaprazaru <6508597+valentinceaprazaru@users.noreply.github.com> Date: Mon, 25 Mar 2024 14:07:24 +0200 Subject: [PATCH 17/32] Own page for WAIs --- next.config.js | 2 +- src/pages/dev/wai-1.jsx | 22 +++++ src/utils/jquery.js | 182 ---------------------------------------- 3 files changed, 23 insertions(+), 183 deletions(-) create mode 100644 src/pages/dev/wai-1.jsx diff --git a/next.config.js b/next.config.js index 9785e4d..db64dce 100644 --- a/next.config.js +++ b/next.config.js @@ -7,7 +7,7 @@ const nextConfig = { * Added for GitHub Pages deployment. */ basePath: "/react-learndash", - output: "export", + ...(!process.env.DEPLOY_TO_GITHUB_PAGES ? {output: 'export'} : {}) } module.exports = nextConfig diff --git a/src/pages/dev/wai-1.jsx b/src/pages/dev/wai-1.jsx new file mode 100644 index 0000000..9d5e568 --- /dev/null +++ b/src/pages/dev/wai-1.jsx @@ -0,0 +1,22 @@ +import React from 'react'; +import {Wrapper} from "../../layout"; +import WritingEvaluationForm from "../../components/forms/writing-evaluation-form"; + + +const WaiOne = () => { + return ( + + +
+
+ + + +
+
+ + + ); +}; + +export default WaiOne; diff --git a/src/utils/jquery.js b/src/utils/jquery.js index 3da5581..4f0210a 100644 --- a/src/utils/jquery.js +++ b/src/utils/jquery.js @@ -3,188 +3,6 @@ if (typeof window !== 'undefined') { window.$ = window.jQuery = require('jquery'); $(document).ready(function() { - setTimeout(function() { - // PART 1 - Edits on form content - // Feature: Update the heading to provide a clear title for the demo. - // For React: This could be done by storing the title in a state variable and using it directly in the render method or JSX return statement. - $('h5').text("TST Prep's Writing Evaluation Demo v1.0.6b"); - // Feature: Update placeholder text in textarea fields to guide the user on what to input. - // For React: Control the placeholder text using state or props, allowing dynamic updates based on user interaction or other conditions. - $('textarea[name="task"]').attr('placeholder', 'Paste your TOEFL integrated writing task here').css('margin-bottom', '30px'); - $('textarea[name="essay"]').attr('placeholder', 'Paste or write your essay here'); - - // PART 2 - Behavior after form submission - // Setup to observe changes in the form container, allowing dynamic response to form submission and other events. - var targetNode = document.querySelector('.course-details-content'); - var config = { childList: true, subtree: true, characterData: true, attributes: true }; - - // Timer functionality to provide feedback to the user after form submission. - // For React: Use the useState hook for the seconds counter and useEffect for starting the interval. Ensure to clear the interval on component unmount. - function startTimer() { - var seconds = 0; // Initialize seconds to 0 - return setInterval(function() { - seconds++; - $('#timer').text(seconds + ' seconds'); // Dynamically update the text - }, 1000); // Set interval to 1 second - } - - var timerInterval = null; // Declare outside to make it accessible - - // Observe DOM mutations to dynamically adjust UI based on form interaction. - var callback = function(mutationsList, observer) { - mutationsList.forEach(function(mutation) { - if (mutation.type === 'childList') { - mutation.addedNodes.forEach(function(node) { - // Response to form submission: If the timer element is found, clear any existing timer and start a new one. - if (node.nodeType === 1 && $(node).find('#timer').length) { - if (timerInterval) clearInterval(timerInterval); - timerInterval = startTimer(); // Start or restart the timer - } - }); - - // Cleanup upon form or page change: If the submit button is no longer present, stop the timer and remove added content. - if (!$(mutation.target).closest('.course-details-content').find('.edu-btn').length) { - clearInterval(timerInterval); - $('#elapsedTime, #waitingTime').remove(); - } - } - }); - }; - - var observer = new MutationObserver(callback); - observer.observe(targetNode, config); - - // Handle form submission to disable inputs, show a loading state, and start a timer. - // For React: Implement form submission handling using event handlers. Manage form and button states with useState, and show feedback using state-driven UI updates. - $('.course-details-content form').on('submit', function(event) { - event.preventDefault(); // Prevent the actual form submission for demonstration; adjust as needed - - // Disable inputs and show a visual cue to the user that the form is processing. - $('textarea[name="task"], textarea[name="essay"]').prop('disabled', true).css({ - 'background-color': '#f0f0f0', - 'cursor': 'not-allowed' - }); - - // Change the button text to "Loading..." to indicate processing state. - var submitButton = $(this).find('.edu-btn').prop('disabled', true).text('Loading...') - .css({'pointer-events': 'none', 'filter': 'saturate(30%)'}); - - // Add visual feedback about the elapsed time since form submission and expected wait time. - if (!$('#elapsedTime').length) { - $('

Elapsed time: 0 seconds

').insertBefore(submitButton); - $('

Depending on the length of your essay and the amount of mistakes,
the waiting time can vary between 15s and 120s

').insertBefore(submitButton); - } - - // Start or reset the timer to give live feedback to the user. - if (timerInterval) clearInterval(timerInterval); // Clear any existing timer - timerInterval = startTimer(); // Start the timer - }); - - // PART 3 - display the original content after submission - // Attach an event handler to the form submission on Screen 1 - $('.course-details-content form').submit(function() { - var essayContent = $('textarea[name="essay"]').val(); - localStorage.setItem('essayContent', essayContent); - console.log("Step 1: Form submitted on Screen 1"); - // After form submission, immediately check and display essay content - checkAndDisplayEssayContent(); - }); - - // Function to check for Screen 2 and display the essay content - function checkAndDisplayEssayContent() { - console.log("Step 2: Inside checkAndDisplayEssayContent function"); - var screen2Detected = $('.course-details-content h5').text().includes("TST Prep's Writing Evaluation Demo 1"); - if (screen2Detected) { - var essayContent = localStorage.getItem('essayContent'); - if (essayContent) { - // Create a paragraph element with the essay content, add class and insert after h5 title - var $essayParagraph = $('

').text(essayContent).addClass('original-essay').css('margin-bottom', '0px'); - $essayParagraph.insertAfter('.course-details-content h5'); - - // Create a bolded title and insert before the paragraph - var $title = $('

').text('Original Essay').addClass('original-essay-title').css('font-size', '16px').css('font-weight', 'bold').css('margin-bottom', '0px'); - $title.insertBefore($essayParagraph); - - localStorage.removeItem('essayContent'); // Optional: Clear the localStorage - console.log("Step 3: Original essay content displayed"); - } - } - } - - // Define a function to check for the presence of .content-box.hovertextp - function checkForElement() { - console.log("Check for element loaded"); - // Check if the element exists - if ($('.content-box.hovertextp').length > 0) { - console.log('.content-box.hovertextp element detected!'); - clearInterval(intervalId); // Stop checking once the element is detected - - // Update CSS for .original-essay and .original-essay-title elements - $('.original-essay, .original-essay-title').css('display', 'inline-block'); - } - } - - // Set an interval to periodically check for the presence of .content-box.hovertextp - var intervalId = setInterval(checkForElement, 1000); // Check every second (1000 milliseconds) - - - // PART 4 - add a dropdown with options to select a sample task - - // Execute code when the DOM is fully loaded - $(document).ready(function() { - // Create a dropdown with options - var dropdown = '
'; - - // Insert the dropdown above the task label - $(dropdown).insertBefore('.course-overview form .form-group:nth-child(2)'); - - // Event listener for dropdown change - $('#task-sample').change(function() { - var selectedSample = $(this).val(); - var taskContent = ''; - - // Define task content based on selected sample - switch(selectedSample) { - case '1': - taskContent = "Sample task 1
content"; - break; - case '2': - taskContent = "Sample task 2
content"; - break; - case '3': - taskContent = "Sample task 3
content"; - break; - case '4': - taskContent = "Sample task 4
content"; - break; - case '5': - taskContent = "Sample task 5
content"; - break; - case '6': - taskContent = "Sample task 6
content"; - break; - case '7': - taskContent = "Sample task 7
content"; - break; - case '8': - taskContent = "Sample task 8
content"; - break; - default: - taskContent = ""; // Default empty content - } - - // Autofill the task textarea with the selected task content as HTML - $('textarea[name="task"]').html(taskContent); - }); - }); - - // THE END - - }, 700); // Delay to ensure jQuery manipulations occur after React component render. }); } From c2fd309c97c203bcb356196a6db2fceb87cdf41c Mon Sep 17 00:00:00 2001 From: Razvan Dumitrache Date: Tue, 26 Mar 2024 12:34:57 +0200 Subject: [PATCH 18/32] formatting --- .editorconfig | 12 + .prettierrc | 16 + src/components/abouts/about-1/about-area.jsx | 151 +- src/components/abouts/about-1/brand-area.jsx | 26 +- .../abouts/about-1/chose-box-item.jsx | 19 +- .../abouts/about-1/counter-area.jsx | 72 +- src/components/abouts/about-1/index.jsx | 24 +- src/components/abouts/about-1/why-chose.jsx | 114 +- .../abouts/about-2/counter-area.jsx | 97 +- src/components/abouts/about-2/index.jsx | 26 +- src/components/abouts/about-2/team-area.jsx | 53 +- src/components/abouts/about-2/why-chose.jsx | 92 +- .../abouts/about-3/about-us-area.jsx | 198 +- .../abouts/about-3/counter-area.jsx | 68 +- src/components/abouts/about-3/index.jsx | 20 +- src/components/abouts/about-3/team-area.jsx | 39 +- .../abouts/about-3/testimonial-area.jsx | 171 +- src/components/abouts/about-3/why-chose.jsx | 115 +- .../blog-details/blog-details-area.jsx | 238 +- src/components/blog-details/comment-area.jsx | 90 +- src/components/blog-details/index.jsx | 17 +- src/components/blog-list/index.jsx | 10 +- src/components/blog-list/list-area.jsx | 59 +- .../blog-masonry/blog-masonry-area.jsx | 140 +- src/components/blog-masonry/index.jsx | 14 +- src/components/blog-post/blog-post-one.jsx | 46 +- src/components/blog/blog-area.jsx | 253 +- src/components/blog/blog-sidebar.jsx | 173 +- src/components/blog/index.jsx | 14 +- src/components/breadcrumb/breadcrumb-2.jsx | 34 +- src/components/breadcrumb/breadcrumb-3.jsx | 79 +- src/components/breadcrumb/breadcrumb-4.jsx | 78 +- src/components/breadcrumb/breadcrumb-5.jsx | 106 +- src/components/breadcrumb/breadcrumb-6.jsx | 38 +- src/components/breadcrumb/breadcrumb.jsx | 38 +- src/components/cart/cart-area.jsx | 84 +- src/components/cart/cart-item.jsx | 65 +- src/components/cart/index.jsx | 12 +- src/components/cart/order-summery.jsx | 42 +- src/components/checkout/checkout-area.jsx | 170 +- src/components/checkout/index.jsx | 12 +- src/components/checkout/order-payment.jsx | 41 +- src/components/checkout/order-summery.jsx | 37 +- src/components/common/counter.jsx | 48 +- .../common/popup-modal/image-lightbox.jsx | 16 +- .../common/popup-modal/search-popup.jsx | 49 +- .../common/popup-modal/video-modal.jsx | 19 +- src/components/common/preloader.jsx | 14 +- .../common/sidebar/blog-sidebar-1.jsx | 106 +- .../common/sidebar/course-details-sidebar.jsx | 133 +- .../common/sidebar/course-sidebar-2.jsx | 267 +- .../common/sidebar/course-sidebar.jsx | 184 +- src/components/common/sidebar/off-canvas.jsx | 166 +- src/components/common/single-course-2.jsx | 221 +- src/components/common/single-instagram.jsx | 23 +- src/components/common/theme.jsx | 53 +- src/components/contact-me/contact-me-area.jsx | 105 +- .../contact-me/contact-me-form-area.jsx | 64 +- src/components/contact-me/index.jsx | 14 +- src/components/contact-us/contact-map.jsx | 21 +- src/components/contact-us/contact-us-area.jsx | 98 +- src/components/contact-us/index.jsx | 15 +- .../course-details-2/course-details-two.jsx | 452 +- src/components/course-details-2/index.jsx | 12 +- .../course-details-2/single-accordion.jsx | 56 +- .../course-details-3/course-details-three.jsx | 561 +- .../course-details-3/details-sidebar.jsx | 97 +- src/components/course-details-3/index.jsx | 12 +- .../course-details/course-details-area.jsx | 361 +- src/components/course-details/index.jsx | 10 +- .../course-details/single-comment.jsx | 32 +- .../course-details/single-progressbar.jsx | 28 +- src/components/course-filter/sorting-area.jsx | 66 +- .../course-style-1/course-1-area.jsx | 56 +- src/components/course-style-1/index.jsx | 12 +- .../course-style-2/course-2-area.jsx | 47 +- src/components/course-style-2/index.jsx | 12 +- .../course-style-3/course-3-area.jsx | 61 +- src/components/course-style-3/index.jsx | 12 +- .../course-style-4/course-4-area.jsx | 81 +- .../course-style-4/course-items.jsx | 29 +- src/components/course-style-4/index.jsx | 12 +- .../course-style-5/course-5-area.jsx | 81 +- .../course-style-5/course-items.jsx | 29 +- src/components/course-style-5/index.jsx | 12 +- src/components/course/course-type-eight.jsx | 189 +- src/components/course/course-type-five.jsx | 189 +- src/components/course/course-type-four.jsx | 188 +- src/components/course/course-type-one.jsx | 198 +- src/components/course/course-type-seven.jsx | 49 +- src/components/course/course-type-six.jsx | 86 +- src/components/course/course-type-three.jsx | 64 +- src/components/course/course-type-two.jsx | 43 +- .../event-details/event-details-area.jsx | 188 +- src/components/event-details/index.jsx | 19 +- src/components/event-grid/all-events.jsx | 25 +- src/components/event-grid/event-area.jsx | 14 +- src/components/event-grid/event-item.jsx | 50 +- src/components/event-grid/index.jsx | 13 +- src/components/event-list/event-list-area.jsx | 73 +- src/components/event-list/event-list-item.jsx | 47 +- src/components/event-list/event-sidebar.jsx | 122 +- src/components/event-list/index.jsx | 13 +- src/components/faq/faq-area.jsx | 300 +- src/components/faq/index.jsx | 18 +- src/components/faq/single-faq.jsx | 28 +- src/components/forms/blog-comment-form.jsx | 84 +- src/components/forms/comment-form-course.jsx | 85 +- src/components/forms/contact-me-form.jsx | 105 +- src/components/forms/contact-us-form.jsx | 111 +- src/components/forms/error-msg.jsx | 10 +- src/components/forms/login-form.jsx | 91 +- src/components/forms/product-comment-form.jsx | 62 +- src/components/forms/register-form.jsx | 94 +- .../forms/writing-evaluation-form.jsx | 143 +- src/components/gallery-grid/gallery-area.jsx | 97 +- src/components/gallery-grid/index.jsx | 14 +- .../gallery-masonry/gallery-area.jsx | 65 +- src/components/gallery-masonry/index.jsx | 14 +- .../home-distant-learning/about-area.jsx | 169 +- .../homes/home-distant-learning/blog-area.jsx | 49 +- .../home-distant-learning/brand-area.jsx | 72 +- .../home-distant-learning/category-area.jsx | 79 +- .../home-distant-learning/counter-area.jsx | 64 +- .../home-distant-learning/courses-area.jsx | 74 +- .../homes/home-distant-learning/faq-area.jsx | 285 +- .../homes/home-distant-learning/hero-area.jsx | 200 +- .../homes/home-distant-learning/index.jsx | 32 +- .../home-distant-learning/testimonial.jsx | 93 +- .../home-distant-learning/video-area.jsx | 83 +- .../homes/home-health-coach/about.jsx | 128 +- .../homes/home-health-coach/counter-area.jsx | 46 +- .../homes/home-health-coach/course.jsx | 52 +- .../homes/home-health-coach/cta.jsx | 43 +- .../homes/home-health-coach/event-area.jsx | 81 +- .../homes/home-health-coach/features.jsx | 169 +- .../homes/home-health-coach/index.jsx | 10 +- .../homes/home-health-coach/service.jsx | 55 +- .../homes/home-health-coach/slider.jsx | 70 +- .../homes/home-health-coach/testimonial.jsx | 179 +- .../homes/home-kindergarten/about-area.jsx | 136 +- .../homes/home-kindergarten/ad-banner.jsx | 78 +- .../homes/home-kindergarten/blog-area.jsx | 77 +- .../homes/home-kindergarten/category-area.jsx | 98 +- .../homes/home-kindergarten/courses-area.jsx | 119 +- .../homes/home-kindergarten/event-area.jsx | 99 +- .../homes/home-kindergarten/faq-area.jsx | 154 +- .../homes/home-kindergarten/hero-area.jsx | 213 +- .../homes/home-kindergarten/index.jsx | 28 +- .../homes/home-kitchen/about-area.jsx | 140 +- .../homes/home-kitchen/ad-banner.jsx | 107 +- .../homes/home-kitchen/blog-area.jsx | 81 +- .../homes/home-kitchen/brand-area.jsx | 23 +- .../homes/home-kitchen/category-area.jsx | 98 +- .../homes/home-kitchen/counter-area.jsx | 38 +- .../homes/home-kitchen/courses-area.jsx | 72 +- .../homes/home-kitchen/faq-area.jsx | 155 +- .../homes/home-kitchen/hero-area.jsx | 179 +- src/components/homes/home-kitchen/index.jsx | 37 +- .../homes/home-kitchen/instagrams.jsx | 27 +- .../homes/home-kitchen/team-area.jsx | 59 +- .../homes/home-kitchen/testimonial-area.jsx | 156 +- .../home-language-academy/about-area.jsx | 208 +- .../home-language-academy/counter-area.jsx | 38 +- .../homes/home-language-academy/faq-area.jsx | 163 +- .../homes/home-language-academy/features.jsx | 109 +- .../homes/home-language-academy/hero-area.jsx | 204 +- .../homes/home-language-academy/index.jsx | 15 +- .../home-language-academy/testimonial.jsx | 83 +- .../home-language-academy/video-area.jsx | 54 +- .../homes/home-modern-schooling/ad-banner.jsx | 110 +- .../homes/home-modern-schooling/blog-area.jsx | 65 +- .../home-modern-schooling/brand-area.jsx | 18 +- .../homes/home-modern-schooling/courses.jsx | 89 +- .../homes/home-modern-schooling/faq-area.jsx | 180 +- .../homes/home-modern-schooling/hero-area.jsx | 212 +- .../homes/home-modern-schooling/index.jsx | 30 +- .../testimonial-area.jsx | 106 +- .../home-modern-schooling/top-categories.jsx | 135 +- .../homes/home-online-academy/blog-area.jsx | 143 +- .../homes/home-online-academy/categories.jsx | 122 +- .../home-online-academy/counter-area.jsx | 42 +- .../homes/home-online-academy/courses.jsx | 78 +- .../homes/home-online-academy/cta-area.jsx | 80 +- .../homes/home-online-academy/faq-area.jsx | 204 +- .../homes/home-online-academy/hero-area.jsx | 192 +- .../homes/home-online-academy/index.jsx | 26 +- .../homes/home-online-academy/team-area.jsx | 46 +- .../homes/home-university/about-area.jsx | 234 +- .../homes/home-university/ad-banner.jsx | 85 +- .../homes/home-university/brand-area.jsx | 24 +- .../homes/home-university/category-area.jsx | 55 +- .../homes/home-university/college-champus.jsx | 175 +- .../homes/home-university/courses-area.jsx | 109 +- src/components/homes/home-university/cta.jsx | 36 +- .../homes/home-university/event-area.jsx | 85 +- .../homes/home-university/hero-slider.jsx | 146 +- .../homes/home-university/index.jsx | 30 +- .../homes/home-university/testimonial.jsx | 186 +- .../homes/home-university/video-area.jsx | 38 +- .../homes/home-yoga-instructor/about-area.jsx | 122 +- .../home-yoga-instructor/counter-area.jsx | 34 +- .../home-yoga-instructor/course-area.jsx | 56 +- .../homes/home-yoga-instructor/hero-area.jsx | 155 +- .../homes/home-yoga-instructor/index.jsx | 30 +- .../home-yoga-instructor/instagram-area.jsx | 27 +- .../homes/home-yoga-instructor/team-area.jsx | 81 +- .../home-yoga-instructor/testimonial-area.jsx | 116 +- .../homes/home-yoga-instructor/video-area.jsx | 61 +- .../homes/home-yoga-instructor/why-chose.jsx | 133 +- src/components/homes/home/about-area.jsx | 171 +- src/components/homes/home/ad-banner.jsx | 78 +- src/components/homes/home/blog-area.jsx | 78 +- src/components/homes/home/brand-area.jsx | 45 +- src/components/homes/home/category-area.jsx | 38 +- src/components/homes/home/counter-box.jsx | 66 +- src/components/homes/home/counter-up-area.jsx | 72 +- src/components/homes/home/course-area.jsx | 53 +- src/components/homes/home/cta-area.jsx | 80 +- src/components/homes/home/hero-area.jsx | 200 +- src/components/homes/home/index.jsx | 36 +- src/components/homes/home/team-area.jsx | 41 +- .../homes/home/testimonial-area.jsx | 153 +- src/components/homes/home/top-categories.jsx | 69 +- .../landing-demo/counter-up-area.jsx | 50 +- src/components/landing-demo/course-demo.jsx | 108 +- src/components/landing-demo/features.jsx | 288 +- src/components/landing-demo/footer.jsx | 106 +- src/components/landing-demo/header.jsx | 213 +- src/components/landing-demo/hero-area.jsx | 156 +- src/components/landing-demo/home-demos.jsx | 162 +- src/components/landing-demo/index.jsx | 6 +- .../landing-demo/inner-pages-demo.jsx | 80 +- src/components/landing-demo/online-course.jsx | 147 +- .../landing-demo/responsive-menu.jsx | 112 +- src/components/landing-demo/shop-support.jsx | 143 +- src/components/pricing-table/index.jsx | 12 +- src/components/pricing-table/pricing-area.jsx | 117 +- src/components/privacy-policy/index.jsx | 12 +- src/components/privacy-policy/policy-area.jsx | 120 +- src/components/product-details/index.jsx | 14 +- .../product-details/product-description.jsx | 139 +- .../product-details/product-details-area.jsx | 68 +- src/components/purchase-guide/index.jsx | 12 +- .../purchase-guide/purchase-area.jsx | 82 +- src/components/seo.jsx | 23 +- src/components/shop/index.jsx | 12 +- src/components/shop/shop-area.jsx | 123 +- src/components/sign-in/index.jsx | 12 +- src/components/sign-in/sign-in-area.jsx | 52 +- src/components/social-share/index.jsx | 18 +- src/components/team-member/team-five.jsx | 32 +- src/components/team-member/team-four.jsx | 32 +- src/components/team-member/team-one.jsx | 40 +- src/components/team-member/team-three.jsx | 32 +- src/components/team-member/team-two.jsx | 34 +- src/components/teams/team-1/index.jsx | 15 +- src/components/teams/team-1/team-area.jsx | 41 +- src/components/teams/team-2/index.jsx | 15 +- src/components/teams/team-2/team-area.jsx | 56 +- src/components/teams/team-3/index.jsx | 15 +- src/components/teams/team-3/team-area.jsx | 42 +- .../teams/team-details/course-area.jsx | 44 +- src/components/teams/team-details/index.jsx | 17 +- .../teams/team-details/team-area.jsx | 113 +- .../terms-condition/condition-area.jsx | 90 +- src/components/terms-condition/index.jsx | 13 +- src/components/wishlist/index.jsx | 13 +- src/components/wishlist/single-wishlist.jsx | 53 +- src/components/wishlist/wishlist-area.jsx | 50 +- src/contexts/mouse-move-context.jsx | 71 +- src/data-tstprep/blog-data.js | 842 +-- src/data-tstprep/course-data.js | 280 +- src/data-tstprep/event-data.js | 487 +- src/data-tstprep/index.js | 19 +- src/data-tstprep/instructors.js | 264 +- src/data-tstprep/shop-data.js | 316 +- src/data/blog-data.js | 842 +-- src/data/course-data.js | 5788 ++++++++++------- src/data/event-data.js | 487 +- src/data/index.js | 19 +- src/data/instructors.js | 264 +- src/data/shop-data.js | 316 +- src/firebase/firebase.config.js | 14 +- src/firebase/firebase.init.js | 6 +- src/hooks/use-cart-info.js | 37 +- src/hooks/use-firebase.js | 153 +- src/hooks/use-modal.js | 10 +- src/hooks/use-scroll-to-top.js | 8 +- src/hooks/use-sticky.js | 20 +- .../footers/component/footer-social.jsx | 55 +- src/layout/footers/footer-2.jsx | 205 +- src/layout/footers/footer-3.jsx | 131 +- src/layout/footers/footer-4.jsx | 188 +- src/layout/footers/footer.jsx | 190 +- src/layout/headers/component/cart.jsx | 71 +- .../headers/component/header-top-left.jsx | 10 +- .../headers/component/header-top-right.jsx | 39 +- src/layout/headers/component/main-menu.jsx | 35 +- src/layout/headers/header-2.jsx | 237 +- src/layout/headers/header-3.jsx | 183 +- src/layout/headers/header.jsx | 247 +- src/layout/headers/menu-data.js | 46 +- src/layout/index.jsx | 20 +- src/layout/wrapper.jsx | 2 +- src/pages/404.jsx | 95 +- src/pages/_app.jsx | 24 +- src/pages/about-1.jsx | 6 +- src/pages/about-2.jsx | 6 +- src/pages/about-3.jsx | 6 +- src/pages/api/event.js | 74 +- src/pages/api/hello.js | 2 +- src/pages/blog-details/[id].jsx | 32 +- src/pages/blog-details/index.jsx | 6 +- src/pages/blog-list.jsx | 6 +- src/pages/blog-masonry.jsx | 6 +- src/pages/blog-standard.jsx | 6 +- src/pages/cart.jsx | 6 +- src/pages/checkout.jsx | 6 +- src/pages/coming-soon.jsx | 101 +- src/pages/contact-me.jsx | 8 +- src/pages/contact-us.jsx | 6 +- src/pages/course-details-2.jsx | 8 +- src/pages/course-details-3.jsx | 6 +- src/pages/course-details/[id].jsx | 33 +- src/pages/course-details/index.jsx | 4 +- src/pages/course-style-1.jsx | 23 +- src/pages/course-style-2.jsx | 6 +- src/pages/course-style-3.jsx | 6 +- src/pages/course-style-4.jsx | 6 +- src/pages/course-style-5.jsx | 6 +- src/pages/dev/wai-1.jsx | 15 +- src/pages/event-details/[id].jsx | 32 +- src/pages/event-details/index.jsx | 8 +- src/pages/event-grid.jsx | 6 +- src/pages/event-list.jsx | 6 +- src/pages/faq.jsx | 2 +- src/pages/gallery-grid.jsx | 2 +- src/pages/gallery-masonry.jsx | 2 +- src/pages/home-distant-learning.jsx | 6 +- src/pages/home-health-coach.jsx | 6 +- src/pages/home-kindergarten.jsx | 6 +- src/pages/home-kitchen.jsx | 4 +- src/pages/home-language-academy.jsx | 6 +- src/pages/home-modern-schooling.jsx | 6 +- src/pages/home-online-academy.jsx | 4 +- src/pages/home-university.jsx | 6 +- src/pages/home-yoga-instructor.jsx | 6 +- src/pages/index.jsx | 4 +- src/pages/landing-demo.jsx | 6 +- src/pages/pricing-table.jsx | 4 +- src/pages/privacy-policy.jsx | 4 +- src/pages/purchase-guide.jsx | 4 +- src/pages/sign-in.jsx | 2 +- src/pages/team-1.jsx | 6 +- src/pages/team-2.jsx | 6 +- src/pages/team-3.jsx | 6 +- src/pages/team-details/[id].jsx | 32 +- src/pages/team-details/index.jsx | 8 +- src/pages/terms-condition.jsx | 4 +- src/pages/wishlist.jsx | 8 +- src/redux/features/auth-slice.js | 14 +- src/redux/features/cart-slice.js | 84 +- src/redux/features/course-slice.js | 16 +- src/redux/features/event-slice.js | 33 +- src/redux/features/filter-slice.js | 28 +- src/redux/features/wishlist-slice.js | 45 +- src/redux/store.js | 25 +- src/styles/index.scss | 2 +- src/svg/book-library.js | 55 +- src/svg/books.js | 30 +- src/svg/certificate-2.js | 59 +- src/svg/certificate.js | 60 +- src/svg/hybrid-distance-programs-2.js | 56 +- src/svg/hybrid-distance-programs.js | 56 +- src/svg/index.js | 36 +- src/svg/instructor.js | 54 +- src/svg/non-degree-program.js | 134 +- src/svg/off-canvas-programs.js | 85 +- src/svg/online-class.js | 68 +- src/svg/online-degree.js | 106 +- src/svg/scholarship-facility.js | 58 +- src/svg/skilled-lecturers-2.js | 86 +- src/svg/skilled-lecturers.js | 88 +- src/svg/user-2.js | 58 +- src/svg/user.js | 58 +- src/ui/paginatio-2.jsx | 40 +- src/ui/pagination.jsx | 28 +- src/ui/scroll-to-top.jsx | 31 +- src/utils/api.ts | 76 +- src/utils/constants.ts | 8 +- src/utils/jquery.js | 4 +- src/utils/localstorage.js | 6 +- src/utils/time.js | 20 +- src/utils/validation-schema.js | 36 +- 395 files changed, 23399 insertions(+), 13989 deletions(-) create mode 100644 .editorconfig create mode 100644 .prettierrc diff --git a/.editorconfig b/.editorconfig new file mode 100644 index 0000000..295096e --- /dev/null +++ b/.editorconfig @@ -0,0 +1,12 @@ +root = true + +[*] +charset = utf-8 +end_of_line = crlf +indent_size = 4 +indent_style = space +insert_final_newline = true +trim_trailing_whitespace = true + +[*.md] +trim_trailing_whitespace = false diff --git a/.prettierrc b/.prettierrc new file mode 100644 index 0000000..bc77754 --- /dev/null +++ b/.prettierrc @@ -0,0 +1,16 @@ +{ + "useTabs": false, + "printWidth": 90, + "singleQuote": true, + "jsxSingleQuote": true, + "bracketSpacing": true, + "bracketSameLine": false, + "quoteProps": "as-needed", + "arrowParens": "avoid", + "requirePragma": false, + "insertPragma": false, + "trailingComma": "es5", + "semi": true, + "braceStyle": "1tbs", + "editorconfig": true +} diff --git a/src/components/abouts/about-1/about-area.jsx b/src/components/abouts/about-1/about-area.jsx index 1981909..ebbf417 100644 --- a/src/components/abouts/about-1/about-area.jsx +++ b/src/components/abouts/about-1/about-area.jsx @@ -2,73 +2,136 @@ import React from 'react'; import { motion } from 'framer-motion'; import { useMouseMoveUI } from '../../../contexts/mouse-move-context'; -const lists = [ - 'Flexible Classes', - 'Offline Classe Mode', - 'Educator Support' -]; +const lists = ['Flexible Classes', 'Offline Classe Mode', 'Educator Support']; const AboutArea = () => { const { mouseDirection, mouseReverse } = useMouseMoveUI(); return ( -
-
-
-
-
-
- About Us -

We Providing The Best Quality Online Courses.

- -

Lorem ipsum dolor sit amet consectur adipiscing elit sed eiusmod ex tempor incididunt labore dolore magna aliquaenim ad minim.

+
+
+
+
+
+
+ About Us +

+ We Providing The{' '} + Best Quality{' '} + Online Courses. +

+ + + +

+ Lorem ipsum dolor sit amet consectur adipiscing elit + sed eiusmod ex tempor incididunt labore dolore magna + aliquaenim ad minim. +

-
    - {lists.map((l,i) =>
  • {l}
    • )} +
      + {lists.map((l, i) => ( +
    • {l}
      • + ))}
-
-
- About Image - About Image -
    - +
    + About Image + About Image +
      + - Shape + Shape - - Shape + Shape - - Shape + Shape -
    • - Shape +
    • + Shape
-
    -
  • +
      +
- ) -} + ); +}; -export default AboutArea; \ No newline at end of file +export default AboutArea; diff --git a/src/components/abouts/about-1/brand-area.jsx b/src/components/abouts/about-1/brand-area.jsx index 9cd317a..54df04e 100644 --- a/src/components/abouts/about-1/brand-area.jsx +++ b/src/components/abouts/about-1/brand-area.jsx @@ -6,23 +6,27 @@ const brands = [ '/assets/images/brand/brand-03.png', '/assets/images/brand/brand-04.png', '/assets/images/brand/brand-05.png', - '/assets/images/brand/brand-06.png' -] + '/assets/images/brand/brand-06.png', +]; -const BrandArea = ({about_p_2}) => { +const BrandArea = ({ about_p_2 }) => { return ( -
-
-
+
+
+
{brands.map((img, i) => ( -
- Brand Logo +
+ Brand Logo
))}
- ) -} + ); +}; -export default BrandArea; \ No newline at end of file +export default BrandArea; diff --git a/src/components/abouts/about-1/chose-box-item.jsx b/src/components/abouts/about-1/chose-box-item.jsx index 5fbdf1d..bd524a3 100644 --- a/src/components/abouts/about-1/chose-box-item.jsx +++ b/src/components/abouts/about-1/chose-box-item.jsx @@ -1,15 +1,20 @@ -export default function ChoseBox ({color,icon,title,subtitle}) { +export default function ChoseBox({ color, icon, title, subtitle }) { return ( -
+
-
+
-
-

{title}

+
+

{title}

{subtitle}

- ) -} \ No newline at end of file + ); +} diff --git a/src/components/abouts/about-1/counter-area.jsx b/src/components/abouts/about-1/counter-area.jsx index 528b068..42dfd63 100644 --- a/src/components/abouts/about-1/counter-area.jsx +++ b/src/components/abouts/about-1/counter-area.jsx @@ -8,7 +8,7 @@ const counter_data = [ icon: '48', text: 'K', title: 'Student Enrolled', - decimal: 1 + decimal: 1, }, { color: 'secondary-color', @@ -16,56 +16,80 @@ const counter_data = [ icon: '47', text: 'K', title: 'Class Completed', - decimal: 1 + decimal: 1, }, { color: 'extra08-color', count: 100, icon: '49', text: '%', - title: 'Satisfaction Rate' + title: 'Satisfaction Rate', }, { color: 'extra05-color', count: 354, icon: '50', text: '%', - title: 'Top Instructors' - } -] + title: 'Top Instructors', + }, +]; -const CounterArea = ({about_p_3}) => { +const CounterArea = ({ about_p_3 }) => { return ( -
-
-
+
+
+
{counter_data.map((c, i) => { - const { color, count, text, title,icon } = c; + const { color, count, text, title, icon } = c; return ( -
-
+
+
-

- - +

+ +

-
{title}
+
{title}

- ) + ); })}
-
    -
  • - Shape +
      +
    • + Shape
- ) -} + ); +}; -export default CounterArea; \ No newline at end of file +export default CounterArea; diff --git a/src/components/abouts/about-1/index.jsx b/src/components/abouts/about-1/index.jsx index eb77f16..5d85685 100644 --- a/src/components/abouts/about-1/index.jsx +++ b/src/components/abouts/about-1/index.jsx @@ -8,23 +8,25 @@ import BrandArea from './brand-area'; import CounterArea from './counter-area'; import WhyChose from './why-chose'; - const index = () => { return (
-
+
- - - - - - + + + + + +
- ) -} + ); +}; -export default index; \ No newline at end of file +export default index; diff --git a/src/components/abouts/about-1/why-chose.jsx b/src/components/abouts/about-1/why-chose.jsx index 374ddce..28e4440 100644 --- a/src/components/abouts/about-1/why-chose.jsx +++ b/src/components/abouts/about-1/why-chose.jsx @@ -6,62 +6,108 @@ import { useMouseMoveUI } from '../../../contexts/mouse-move-context'; const WhyChose = () => { const { mouseDirection, mouseReverse } = useMouseMoveUI(); return ( -
-
-
- Why choose edublink -

The Best Beneficial Side
of EduBlink

- +
+
+
+ Why choose edublink +

+ The Best Beneficial Side{' '} +
of EduBlink +

+ + +
-
- +
+ - + - +
-
    -
  • +
      +
-
    - + - - shape + shape - - - shape + shape
- ) -} + ); +}; -export default WhyChose; \ No newline at end of file +export default WhyChose; diff --git a/src/components/abouts/about-2/counter-area.jsx b/src/components/abouts/about-2/counter-area.jsx index cb28901..657a5da 100644 --- a/src/components/abouts/about-2/counter-area.jsx +++ b/src/components/abouts/about-2/counter-area.jsx @@ -6,49 +6,80 @@ import { useMouseMoveUI } from '../../../contexts/mouse-move-context'; const CounterArea = () => { const { mouseDirection, mouseReverse } = useMouseMoveUI(); return ( -
-
-
-
-
-
- Fun Facts -

The Large Number of Counting

- -

Lorem ipsum dolor sit amet consectur adipiscing elit sed eiusmod tempor incididunt labore dolore magna aliquaenim ad minim.

+
+
+
+
+
+
+ Fun Facts +

+ The Large{' '} + Number of + Counting +

+ + + +

+ Lorem ipsum dolor sit amet consectur adipiscing elit + sed eiusmod tempor incididunt labore dolore magna + aliquaenim ad minim. +

-
-
+
+
-
    - + - Shape + Shape -
  • - Shape +
  • + Shape
    • - - Shape + Shape - - Shape + Shape
@@ -56,7 +87,7 @@ const CounterArea = () => {
- ) -} + ); +}; -export default CounterArea; \ No newline at end of file +export default CounterArea; diff --git a/src/components/abouts/about-2/index.jsx b/src/components/abouts/about-2/index.jsx index 43706d1..6c6f6af 100644 --- a/src/components/abouts/about-2/index.jsx +++ b/src/components/abouts/about-2/index.jsx @@ -9,24 +9,26 @@ import BrandArea from '../about-1/brand-area'; import CounterArea from './counter-area'; import WhyChose from './why-chose'; - const index = () => { return (
-
+
- - - - - - + + + + + + - +
- ) -} + ); +}; -export default index; \ No newline at end of file +export default index; diff --git a/src/components/abouts/about-2/team-area.jsx b/src/components/abouts/about-2/team-area.jsx index 74e8e69..9b8d6ad 100644 --- a/src/components/abouts/about-2/team-area.jsx +++ b/src/components/abouts/about-2/team-area.jsx @@ -1,39 +1,52 @@ import React from 'react'; import { instructors_data } from '../../../data'; -import TeamFive from "../../team-member/team-five"; +import TeamFive from '../../team-member/team-five'; const TeamArea = () => { return ( -
-
-
- Instructors -

Course Instructors

- +
+
+
+ Instructors +

Course Instructors

+ + +
-
- {instructors_data.slice(0,3).map((instructor) => ( -
+
+ {instructors_data.slice(0, 3).map(instructor => ( +
))}
-
    -
  • - Shape +
      +
    • + Shape
      • -
    • - Shape +
    • + Shape
      • -
    • - Shape +
    • + Shape
- ) -} + ); +}; -export default TeamArea; \ No newline at end of file +export default TeamArea; diff --git a/src/components/abouts/about-2/why-chose.jsx b/src/components/abouts/about-2/why-chose.jsx index fb70744..b86756b 100644 --- a/src/components/abouts/about-2/why-chose.jsx +++ b/src/components/abouts/about-2/why-chose.jsx @@ -8,51 +8,87 @@ const WhyChose = () => { const { scrollYProgress } = useScroll(); const y = useTransform(scrollYProgress, [0, 1], [0, 1000]); return ( -
-
-
-
-
-

We Providing The
Best Quality Online Courses

- +
+
+
+
+
+

+ We Providing The
Best{' '} + Quality Online {' '} + Courses +

+ + +
-
-

Lorem ipsum dolor sit amet cons etur adipisicing elit sed do eiusm aut tempor incididunt labore dolore magna aliqua quis nostrud ex ertation lamcolab oris aliquip.

+
+

+ Lorem ipsum dolor sit amet cons etur adipisicing elit sed + do eiusm aut tempor incididunt labore dolore magna aliqua + quis nostrud ex ertation lamcolab oris aliquip. +

-
- +
+ - + - +
-
    - + - - shape + shape -
  • - +
  • +
- ) -} + ); +}; -export default WhyChose; \ No newline at end of file +export default WhyChose; diff --git a/src/components/abouts/about-3/about-us-area.jsx b/src/components/abouts/about-3/about-us-area.jsx index 4b4574c..c339b66 100644 --- a/src/components/abouts/about-3/about-us-area.jsx +++ b/src/components/abouts/about-3/about-us-area.jsx @@ -5,88 +5,178 @@ import { useMouseMoveUI } from '../../../contexts/mouse-move-context'; // MissionItem function MissionItem({ color, icon, title, text }) { return ( -
-
-
-

{title}

+
+
+ +
+
+

{title}

{text}

- ) + ); } const AboutUsArea = () => { const { mouseDirection, mouseReverse } = useMouseMoveUI(); return ( -
-
-
-
-
-
- About Us -

We Provide Best Education Services For You.

- -

Magna aliquaenim ad minim veniam quis nostrud exercitation ullamco laborisLorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eius tempor incididunt labore.

+
+
+
+
+
+
+ About Us +

+ We Provide Best{' '} + Education{' '} + Services For You. +

+ + + +

+ Magna aliquaenim ad minim veniam quis nostrud + exercitation ullamco laborisLorem ipsum dolor sit + amet, consectetur adipisicing elit, sed do eius tempor + incididunt labore. +

-
- - +
+ +
-
-
-