iVProg/js/accessibleUI/modules/operations/operations-schemes.js

// Imports
import {variables} from "../variables/variables";
import {eltP} from "codemirror/src/util/dom";
import {operations} from "./operations";
// Imports

// *********************************************************************************
// Scheme for the operations list
// *********************************************************************************

export const operationScheme = {
    hash: 'UUID for the operation',
    assignedVariable: 'Reference to the assigned variable',
    operators: []
}

// *********************************************************************************
// Scheme for the operators
// *********************************************************************************

export const operatorScheme = {
    hash: 'UUID for the operator',
    type: 'Operator type',
    value: 'Operator value',
    variable: 'Reference to the variable',
    operator: 'Reference to operator'
}

// *********************************************************************************
// Operator types
// *********************************************************************************

export const Operators = {
    VARIABLE: 'VARIABLE',
    VALUE: 'VALUE',
    OPERATOR: 'OPERATOR'
}

export const operatorTypes = [
    {
        name: 'Variável',
        value: Operators.VARIABLE
    },
    {
        name: 'Valor',
        value: Operators.VALUE
    },
    {
        name: 'Operator',
        value: Operators.OPERATOR
    }
]

// *********************************************************************************
// Operation types
// *********************************************************************************

export const operationTypes = [
    {
        name: ';',
        value: 'SEMICOLON'
    },
    {
        name: '+',
        value: 'PLUS'
    },
    {
        name: '-',
        value: 'MINUS'
    },
    {
        name: '*',
        value: 'MULTIPLICATION'
    },
    {
        name: '/',
        value: 'DIVISION'
    },
    {
        name: '(',
        value: 'OPEN_PARENTHESES'
    },
    {
        name: ')',
        value: 'CLOSE_PARENTHESES'
    },
]

// *********************************************************************************
// Operator kinds
// *********************************************************************************

export const operatorKinds = [
    {
        name: 'Variável',
        value: 'VARIABLE'
    },
    {
        name: 'Valor',
        value: 'VALUE'
    }
]

// *********************************************************************************
// Operation type html schemes
// *********************************************************************************

export function htmlOperationTypeScheme () {
    let operationTypesSelect = ``;

    for (let i = 0; i < operationTypes.length; i++) {
        operationTypesSelect += `<option value="${operationTypes[i].value}">${operationTypes[i].name}</option>`;
    }

    return `<div class="col-2">
                <select id="operation<operationKindId>Select" class="form-control" title="selecione o tipo da operação" >
                    <option > selecione</option>
                    ${operationTypesSelect}
                </select>
            </div>`;
}

// *********************************************************************************
// Assign variable operation kind html schemes
// *********************************************************************************

export function htmlOperationKindScheme (operation) {
    let operatorKindsSelect = ``;

    for (let i = 0; i < operatorKinds.length; i++) {
        operatorKindsSelect += `<option value="${operatorKinds[i].value}">${operatorKinds[i].name}</option>`;
    }

    return `<div class="col-3">
                <select id="operation${operation.hash}KindSelect" class="form-control" title="Selecione o tipo de atrabuição" operation-id="${operation.hash}">
                    <option >Selecione</option>
                    ${operatorKindsSelect}
                </select>
            </div>`;
}

// *********************************************************************************
// Assign variable html schemes
// *********************************************************************************

export function htmlAssignVariableScheme () {

    const variablesSelect = htmlVariablesSelectScheme();

    return `<li id="operation<operationId>Li">
                <form id="operation<operationId>Form">
                    <div class="row p-2 w-100 variable-item" style="background-color: aliceblue;">
                        <div class="col-2 my-auto">
                            <select title="selecione a variável" id="operation<operationId>AssignVariableSelect" class="form-control" name="variableSelect" operation-id="<operationId>"> 
                                ${variablesSelect}
                            </select>
                        </div> 
                        <div class="col-1 my-auto">
                            <label id="recebe" style="margin-bottom: 0px !important">recebe</label>
                        </div>
                        <div class="col">
                            <div class="row" id="operation<operationId>OperatorsDiv"></div>
                        </div>
                        <div class="col-1 my-auto" style="text-align: end;">
                            <a id="operation<operationId>Delete" href="javascript:void(0)" class="text-danger" operation-id="<operationId>">X</a>
                        </div>     
                    </div>
                </form>
            </li>`;
}

// *********************************************************************************
// Variable select html schemes
// *********************************************************************************

export function htmlVariablesSelectScheme () {
    let variablesSelect = variables.length === 0 ? `<option>N/A</option>` : ``;

    for (let i = 0; i < variables.length; i++) {
        variablesSelect += `<option value="${variables[i].hash}">${variables[i].name}</option>`
    }

    return variablesSelect;
}

// *********************************************************************************

// *********************************************************************************
// Operator variable select
// *********************************************************************************

export function htmlOperatorVariablesSelectScheme (operation, operator) {
    let variablesSelect = variables.length === 0 ? `<option>N/A</option>` : ``;

    for (let i = 0; i < variables.length; i++) {
        variablesSelect += `<option value="${variables[i].hash}">${variables[i].name}</option>`
    }

    return `<div class="col-2">
                <select id="operation${operation.hash}Operator${operator.hash}VariableSelect" class="form-control" name="variableSelect" title="selecione a variável" operation-id="${operation.hash}" operator-id="${operator.hash}">
                    ${variablesSelect}
                </select>
            </div>`;
}

// *********************************************************************************
// Operator value input
// *********************************************************************************

export function htmlOperatorValueInputScheme (operation, operator) {
    return `<div class="col-2">
                <input type="number" id="operation${operation.hash}Operator${operator.hash}ValueInput" class="form-control" name="" title="valor" operation-id="${operation.hash}" operator-id="${operator.hash}">
            </div>`;
}

// *********************************************************************************
// Operation type select
// *********************************************************************************

export function htmlOperationTypeSelect (operation, operator) {
    let operationTypesSelect = ``;

    for (let i = 0; i < operationTypes.length; i++) {
        operationTypesSelect += `<option value="${operationTypes[i].value}">${operationTypes[i].name}</option>`;
    }

    return `<div class="col-2">
                <select id="operation${operation.hash}Operator${operator.hash}OperationTypeSelect" class="form-control" title="selecione o tipo da operação" operation-id="${operation.hash}" operator-id="${operator.hash}">
                    ${operationTypesSelect}
                </select>
            </div>`;
}

// *********************************************************************************
// Util
// *********************************************************************************

export function getOperatorTypeByValue (value) {
    for (let i = 0; i < operatorTypes.length; i++) {
        if (operatorTypes[i].value === value)
            return operatorTypes[i];
    }

    return null;
}

// *********************************************************************************

export function getOperationTypeByValue (value) {
    for (let i = 0; i < operationTypes.length; i++) {
        if (operationTypes[i].value === value)
            return operationTypes[i];
    }

    return null;
}

// *********************************************************************************

export function getOperatorByHash (operation, operatorHash) {
    for (let i = 0; i < operation.operators.length; i++) {
        if (operation.operators[i].hash === operatorHash)
            return operation.operators[i];
    }

    return null;
}

// *********************************************************************************