From aca5a560e4cae922d8756d29aff80931f1d4ba36 Mon Sep 17 00:00:00 2001 From: Harsh Rao Date: Tue, 11 Feb 2025 01:19:39 +0530 Subject: [PATCH 1/2] refactor: ts integration in restrictedElementDiv and add types.ts to types folder --- src/simulator/src/restrictedElementDiv.js | 44 ------------- src/simulator/src/restrictedElementDiv.ts | 66 +++++++++++++++++++ .../src/types/restrictedElementDiv.types.ts | 4 ++ 3 files changed, 70 insertions(+), 44 deletions(-) delete mode 100644 src/simulator/src/restrictedElementDiv.js create mode 100644 src/simulator/src/restrictedElementDiv.ts create mode 100644 src/simulator/src/types/restrictedElementDiv.types.ts diff --git a/src/simulator/src/restrictedElementDiv.js b/src/simulator/src/restrictedElementDiv.js deleted file mode 100644 index 74e1aad5..00000000 --- a/src/simulator/src/restrictedElementDiv.js +++ /dev/null @@ -1,44 +0,0 @@ -export function updateRestrictedElementsList() { - if (restrictedElements.length === 0) return - - const { restrictedCircuitElementsUsed } = globalScope - let restrictedStr = '' - - restrictedCircuitElementsUsed.forEach((element) => { - restrictedStr += `${element}, ` - }) - - if (restrictedStr === '') { - restrictedStr = 'None' - } else { - restrictedStr = restrictedStr.slice(0, -2) - } - - document.getElementById('restrictedElementsDiv--list').innerHTML = restrictedStr -} - -export function updateRestrictedElementsInScope(scope = globalScope) { - // Do nothing if no restricted elements - if (restrictedElements.length === 0) return - - const restrictedElementsUsed = [] - restrictedElements.forEach((element) => { - if (scope[element].length > 0) { - restrictedElementsUsed.push(element) - } - }) - - scope.restrictedCircuitElementsUsed = restrictedElementsUsed - updateRestrictedElementsList() -} - -export function showRestricted() { - document.getElementById('restrictedDiv').classList.remove('display--none') - // Show no help text for restricted elements - document.getElementById('Help').classList.remove('show') - document.getElementById('restrictedDiv').innerHTML = 'The element has been restricted by mentor. Usage might lead to deduction in marks' -} - -export function hideRestricted() { - document.getElementById('restrictedDiv').classList.add('display--none') -} diff --git a/src/simulator/src/restrictedElementDiv.ts b/src/simulator/src/restrictedElementDiv.ts new file mode 100644 index 00000000..d3e766f1 --- /dev/null +++ b/src/simulator/src/restrictedElementDiv.ts @@ -0,0 +1,66 @@ +import { Scope } from './types/restrictedElementDiv.types' + +let globalScope: Scope = { + restrictedCircuitElementsUsed: [] +}; +let restrictedElements: string[] = []; + +export function updateRestrictedElementsList(): void { + if (restrictedElements.length === 0) return; + + const { restrictedCircuitElementsUsed } = globalScope; + let restrictedStr = ''; + + restrictedCircuitElementsUsed.forEach((element: string) => { + restrictedStr += `${element}, `; + }); + + if (restrictedStr === '') { + restrictedStr = 'None'; + } else { + restrictedStr = restrictedStr.slice(0, -2); // Remove the trailing comma and space + } + + const restrictedElementsDiv = document.getElementById('restrictedElementsDiv--list'); + if (restrictedElementsDiv) { + restrictedElementsDiv.innerHTML = restrictedStr; + } +} + +export function updateRestrictedElementsInScope(scope: Scope = globalScope): void { + if (restrictedElements.length === 0) return; + + const restrictedElementsUsed: string[] = []; + restrictedElements.forEach((element: string) => { + if (scope[element] && scope[element].length > 0) { + restrictedElementsUsed.push(element); + } + }); + + scope.restrictedCircuitElementsUsed = restrictedElementsUsed; + updateRestrictedElementsList(); +} + +export function showRestricted(): void { + const restrictedDiv = document.getElementById('restrictedDiv'); + const helpDiv = document.getElementById('Help'); + + if (restrictedDiv) { + restrictedDiv.classList.remove('display--none'); + } + + if (helpDiv) { + helpDiv.classList.remove('show'); + } + + if (restrictedDiv) { + restrictedDiv.innerHTML = 'The element has been restricted by mentor. Usage might lead to deduction in marks'; + } +} + +export function hideRestricted(): void { + const restrictedDiv = document.getElementById('restrictedDiv'); + if (restrictedDiv) { + restrictedDiv.classList.add('display--none'); + } +} \ No newline at end of file diff --git a/src/simulator/src/types/restrictedElementDiv.types.ts b/src/simulator/src/types/restrictedElementDiv.types.ts new file mode 100644 index 00000000..cfa20528 --- /dev/null +++ b/src/simulator/src/types/restrictedElementDiv.types.ts @@ -0,0 +1,4 @@ +export interface Scope { + [key: string]: string[]; + restrictedCircuitElementsUsed: string[]; +} \ No newline at end of file From 6a1cbb1beebe74388490688e73bfb0fc6d6729c3 Mon Sep 17 00:00:00 2001 From: Harsh Rao Date: Tue, 11 Feb 2025 01:45:11 +0530 Subject: [PATCH 2/2] refactor:improve DOM, return logic --- src/simulator/src/restrictedElementDiv.ts | 42 ++++++++++------------- 1 file changed, 18 insertions(+), 24 deletions(-) diff --git a/src/simulator/src/restrictedElementDiv.ts b/src/simulator/src/restrictedElementDiv.ts index d3e766f1..35326553 100644 --- a/src/simulator/src/restrictedElementDiv.ts +++ b/src/simulator/src/restrictedElementDiv.ts @@ -1,29 +1,25 @@ import { Scope } from './types/restrictedElementDiv.types' -let globalScope: Scope = { +const globalScope: Scope = { restrictedCircuitElementsUsed: [] }; -let restrictedElements: string[] = []; +const restrictedElements: string[] = []; export function updateRestrictedElementsList(): void { - if (restrictedElements.length === 0) return; - - const { restrictedCircuitElementsUsed } = globalScope; - let restrictedStr = ''; - - restrictedCircuitElementsUsed.forEach((element: string) => { - restrictedStr += `${element}, `; - }); - - if (restrictedStr === '') { - restrictedStr = 'None'; - } else { - restrictedStr = restrictedStr.slice(0, -2); // Remove the trailing comma and space + if (globalScope.restrictedCircuitElementsUsed.length === 0) { + const restrictedElementsDiv = document.getElementById('restrictedElementsDiv--list'); + if (restrictedElementsDiv) { + restrictedElementsDiv.innerHTML = 'None'; + } + return; } - + const { restrictedCircuitElementsUsed } = globalScope; + const restrictedStr = restrictedCircuitElementsUsed.join(', '); const restrictedElementsDiv = document.getElementById('restrictedElementsDiv--list'); if (restrictedElementsDiv) { restrictedElementsDiv.innerHTML = restrictedStr; + } else { + console.error('Element restrictedElementsDiv--list not found'); } } @@ -41,21 +37,19 @@ export function updateRestrictedElementsInScope(scope: Scope = globalScope): voi updateRestrictedElementsList(); } +const RESTRICTED_MESSAGE = 'The element has been restricted by mentor. Usage might lead to deduction in marks'; export function showRestricted(): void { const restrictedDiv = document.getElementById('restrictedDiv'); const helpDiv = document.getElementById('Help'); - - if (restrictedDiv) { - restrictedDiv.classList.remove('display--none'); + if (!restrictedDiv) { + console.error('Element restrictedDiv not found'); + return; } - + restrictedDiv.classList.remove('display--none'); + restrictedDiv.innerHTML = RESTRICTED_MESSAGE; if (helpDiv) { helpDiv.classList.remove('show'); } - - if (restrictedDiv) { - restrictedDiv.innerHTML = 'The element has been restricted by mentor. Usage might lead to deduction in marks'; - } } export function hideRestricted(): void {