// Imports import {generateUUID, htmlOlCommandsOperations} from './../../main'; import { getOperationTypeByValue, getOperatorByHash, getOperatorTypeByValue, htmlAssignVariableScheme, htmlOperationKindScheme, htmlOperationTypeSelect, htmlOperatorValueInputScheme, htmlOperatorVariablesSelectScheme, operationScheme, Operators, operatorScheme, operatorTypes } from "./operations-schemes"; import {getVariableByHash, variables} from "../variables/variables"; // Imports export const operations = []; // Creating operation export function createOperation () { let operation = Object.assign({}, operationScheme); operation.hash = generateUUID().replaceAll('-', ''); // TODO: Fix operation.assignedVariable = variables[0]; operation.operators = []; operations.push(operation); let htmlOperation = htmlAssignVariableScheme(); htmlOperation = htmlOperation.replaceAll('', operation.hash); htmlOlCommandsOperations.insertAdjacentHTML('beforeend', htmlOperation); document.getElementById(`operation${operation.hash}AssignVariableSelect`).addEventListener('change', ev => { updateOperationAssignValue(ev.target.getAttribute('operation-id'), ev.target.value); }); document.getElementById(`operation${operation.hash}Delete`).addEventListener('click', ev => { deleteOperation(ev.target.getAttribute('operation-id')); }); addOperatorKind(operation.hash); // Changing focus to the variable type after creation for screen readers document.getElementById(`operation${operation.hash}AssignVariableSelect`).focus(); } // Add operator kind to the operation export function addOperatorKind (hash) { let operation = getOperationByHash(hash); console.log(operation); let htmlOperationKind = htmlOperationKindScheme(operation); document.getElementById(`operation${operation.hash}OperatorsDiv`).insertAdjacentHTML('beforeend', htmlOperationKind); document.getElementById(`operation${operation.hash}KindSelect`).addEventListener('change', ev => { selectedOperationKind(ev.target.getAttribute('operation-id')); }); } // Function to be trigger when the operator kind is selected export function selectedOperationKind (operationHash) { let operation = getOperationByHash(operationHash); console.log(operation); let kindSelect = document.getElementById(`operation${operation.hash}KindSelect`); // TODO: think into an way to make this dynamic if (kindSelect.value === 'VARIABLE') { insertVariableAfterOperationKind(kindSelect, operation); } else if (kindSelect.value === 'VALUE') { insertValueAfterOperationKind(kindSelect, operation); } } // Insert variable after operator kind select export function insertVariableAfterOperationKind (kindSelect, operation) { let operator = Object.assign({}, operatorScheme); operator.hash = generateUUID().replaceAll('-', ''); // TODO: Fix ? operator.variable = variables[0]; operator.type = getOperatorTypeByValue('VARIABLE'); let operatorVariableSelect = htmlOperatorVariablesSelectScheme(operation, operator); operation.operators.push(operator); kindSelect.parentElement.parentElement.insertAdjacentHTML('beforeend', operatorVariableSelect); kindSelect.parentElement.remove(); insertOperationTypeAtEndOfOperation(operation, operator); document.getElementById(`operation${operation.hash}Operator${operator.hash}VariableSelect`).addEventListener('change', ev => { updateOperationOperator(ev.target.getAttribute('operation-id'), ev.target.getAttribute('operator-id'), ev.target.value) }); // Changing focus to the variable select after select for screen readers document.getElementById(`operation${operation.hash}Operator${operator.hash}VariableSelect`).focus(); } // Insert value after operator kind select export function insertValueAfterOperationKind (kindSelect, operation) { let operator = Object.assign({}, operatorScheme); operator.hash = generateUUID().replaceAll('-', ''); operator.type = getOperatorTypeByValue('VALUE'); let operatorValueInput = htmlOperatorValueInputScheme(operation, operator); operation.operators.push(operator); kindSelect.parentElement.parentElement.insertAdjacentHTML('beforeend', operatorValueInput); kindSelect.parentElement.remove(); insertOperationTypeAtEndOfOperation(operation, operator); document.getElementById(`operation${operation.hash}Operator${operator.hash}ValueInput`).addEventListener('change', ev => { updateOperationOperator(ev.target.getAttribute('operation-id'), ev.target.getAttribute('operator-id'), ev.target.value) }); // Changing focus to the input value after select for screen readers document.getElementById(`operation${operation.hash}Operator${operator.hash}ValueInput`).focus(); } // Add final operation typt end of the operation export function insertOperationTypeAtEndOfOperation (operation, afterOperator) { let operator = Object.assign({}, operatorScheme); operator.hash = generateUUID().replaceAll('-', ''); operator.type = getOperatorTypeByValue('OPERATOR'); operator.operator = getOperationTypeByValue('SEMICOLON'); let operationTypeInput = htmlOperationTypeSelect(operation, operator); operationTypeInput.replaceAll('', operator.hash); operation.operators.push(operator); if (afterOperator.type.value === 'VARIABLE') { document.querySelector(`select[operator-id='${afterOperator.hash}']`).parentElement.insertAdjacentHTML('afterend', operationTypeInput); } else if (afterOperator.type.value === 'VALUE') { document.querySelector(`input[operator-id='${afterOperator.hash}']`).parentElement.insertAdjacentHTML('afterend', operationTypeInput); } document.getElementById(`operation${operation.hash}Operator${operator.hash}OperationTypeSelect`).addEventListener('change', ev => { updateOperationOperator(ev.target.getAttribute('operation-id'), ev.target.getAttribute('operator-id'), ev.target.value) }); } // *********************************************************************** // Listeners // *********************************************************************** export function updateOperationAssignValue (operationHash, newVariable) { let operation = getOperationByHash(operationHash); let variable = getVariableByHash(newVariable); operation.assignedVariable = variable; } export function updateOperationOperator (operationHash, operatorHash, newValue) { let operation = getOperationByHash(operationHash); let operator = getOperatorByHash(operation, operatorHash); switch (operator.type.value) { case 'VARIABLE': let variable = getVariableByHash(newValue); operator.variable = variable; break; case 'VALUE': operator.value = newValue; break; case 'OPERATOR': operator.operator = getOperationTypeByValue(newValue); if (operator.operator.name !== ';' && (operation.operators.indexOf(operator) === (operation.operators.length - 1))) addOperatorKind(operation.hash); break; } } // Here we remove all operation that include the variable received as parameter export function deleteOperationByVariable (variable) { const operationsToRemove = []; for (const i in operations) { console.log(operations[i]); if (operations[i].assignedVariable.hash === variable.hash) { document.getElementById(`operation${operations[i].hash}Li`).remove(); operationsToRemove.push(operations[i]); continue; } for (const j in operations[i].operators) { console.log(j); console.log(operations[i].operators[j]); if (operations[i].operators[j].type.value === Operators.VARIABLE) { if (operations[i].operators[j].variable.hash === variable.hash) { document.getElementById(`operation${operations[i].hash}Li`).remove(); operationsToRemove.push(operations[i]); // if (operation.operators.length > 2) { // // } else { // // } } } } } for (const i in operationsToRemove) { operations.splice(operations.indexOf(operationsToRemove[i]), 1); } } // Here we remove all operation that include the variable received as parameter export function deleteOperation (hash) { const operation = getOperationByHash(hash); document.getElementById(`operation${hash}Li`).remove(); operations.splice(operations.indexOf(operation), 1); } // Here we remove all operation export function deleteAllOperation () { for (let i = 0; i < operations.length; i++) { document.getElementById(`operation${operations[i].hash}Li`).remove(); } operations.length = 0; } // *********************************************************************** // Util // *********************************************************************** export function getOperationByHash (hash) { for (let i = 0; i < operations.length; i++) { if (operations[i].hash === hash) return operations[i]; } return null; } // ***********************************************************************