// Imports import {generateUUID, htmlOlCommandsOperations} from './../../main'; import { getOperationTypeByValue, getOperatorByHash, getOperatorTypeByValue, htmlAssignVariableScheme, htmlOperationKindScheme, htmlOperationTypeSelect, htmlOperatorValueInputScheme, htmlOperatorVariablesSelectScheme, operationScheme, 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); }); addOperatorKind(operation.hash); } // 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.insertAdjacentHTML('afterend', operatorVariableSelect); kindSelect.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) }); } // 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.insertAdjacentHTML('afterend', operatorValueInput); kindSelect.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) }); } // 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}']`).insertAdjacentHTML('afterend', operationTypeInput); } else if (afterOperator.type.value === 'VALUE') { document.querySelector(`input[operator-id='${afterOperator.hash}']`).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 !== ';') addOperatorKind(operation.hash); break; } } // *********************************************************************** // Util // *********************************************************************** export function getOperationByHash(hash) { for (let i = 0; i < operations.length; i++) { if (operations[i].hash === hash) return operations[i]; } return null; } // ***********************************************************************