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

@@ -169,7 +169,16 @@ export function htmlAssignVariableScheme () {
                             <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>" title="Excluir">X</a>
+                            <div class="row justify-content-end">
+                                <div class="col-1" style="margin-right: 4px;">
+                                    <a id="operation<operationId>Resume" href="javascript:void(0)" class="text-info" operation-id="<operationId>">
+                                        <i class="fas fa-eye"></i>
+                                    </a>
+                                </div>
+                                <div class="col-1">
+                                    <a id="operation<operationId>Delete" href="javascript:void(0)" class="text-danger" operation-id="<operationId>" title="Excluir">X</a>
+                                </div>
+                            </div>
                         </div>     
                     </div>
                 </form>

js/accessibleUI/modules/operations/operations.js

@@ -39,6 +39,7 @@ export function createOperation () {
     });
 
     addOperatorKind(operation.hash);
+    updateResume(operation.hash);
 
     // Changing focus to the variable type after creation for screen readers
     document.getElementById(`operation${operation.hash}AssignVariableSelect`).focus();
@@ -97,6 +98,8 @@ export function insertVariableAfterOperationKind (kindSelect, operation) {
         updateOperationOperator(ev.target.getAttribute('operation-id'), ev.target.getAttribute('operator-id'), ev.target.value)
     });
 
+    updateResume(operation.hash);
+
     // Changing focus to the variable select after select for screen readers
     document.getElementById(`operation${operation.hash}Operator${operator.hash}VariableSelect`).focus();
 }
@@ -121,11 +124,13 @@ export function insertValueAfterOperationKind (kindSelect, operation) {
         updateOperationOperator(ev.target.getAttribute('operation-id'), ev.target.getAttribute('operator-id'), ev.target.value)
     });
 
+    updateResume(operation.hash);
+
     // 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
+// Add final operation type end of the operation
 export function insertOperationTypeAtEndOfOperation (operation, afterOperator) {
     let operator = Object.assign({}, operatorScheme);
 
@@ -144,7 +149,6 @@ export function insertOperationTypeAtEndOfOperation (operation, afterOperator) {
         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)
     });
@@ -159,6 +163,8 @@ export function updateOperationAssignValue (operationHash, newVariable) {
     let variable = getVariableByHash(newVariable);
 
     operation.assignedVariable = variable;
+
+    updateResume(operation.hash);
 }
 
 export function updateOperationOperator (operationHash, operatorHash, newValue) {
@@ -203,6 +209,8 @@ export function updateOperationOperator (operationHash, operatorHash, newValue)
                 }
             break;
     }
+
+    updateResume(operation.hash);
 }
 
 // Here we remove all operation that include the variable received as parameter
@@ -259,6 +267,37 @@ export function deleteAllOperation () {
     operations.length = 0;
 }
 
+// ***********************************************************************
+// Updating variable resume
+// ***********************************************************************
+
+function updateResume (hash) {
+    document.getElementById(`operation${hash}Resume`).setAttribute('title', generateResume(hash));
+}
+
+function generateResume (hash) {
+    const operation = getOperationByHash(hash);
+
+    let resume = `${operation.assignedVariable.name} recebe `;
+
+    for (const i in operation.operators) {
+        console.log(operation.operators[i]);
+        switch (operation.operators[i].type.value) {
+            case Operators.OPERATOR:
+                resume += `${operation.operators[i].operator.friendlyName} `;
+                break;
+            case Operators.VALUE:
+                resume += `${operation.operators[i].value} `;
+                break;
+            case Operators.VARIABLE:
+                resume += `${operation.operators[i].variable.name} `;
+                break;
+        }
+    }
+
+    return resume;
+}
+
 // ***********************************************************************
 // Util
 // ***********************************************************************

js/accessibleUI/modules/variables/variables-schemes.js

@@ -103,7 +103,16 @@ export function htmlVariableScheme () {
                             <input type="${variableTypes[0].htmlType}" class="form-control" id ="variable<variableId>Value" title="Valor da variável" value="0" variable-id="<variableId>">
                         </div>
                         <div class="col my-auto" style="text-align: end;">
-                            <a id="variable<variableId>Delete" href="javascript:void(0)" class="text-danger" variable-id="<variableId>" title="Excluir">X</a>
+                            <div class="row justify-content-end">
+                                <div class="col-1">
+                                    <a id="variable<variableId>Resume" href="javascript:void(0)" class="text-info" variable-id="<variableId>">
+                                        <i class="fas fa-eye"></i>
+                                    </a>
+                                </div>
+                                <div class="col-1">
+                                    <a id="variable<variableId>Delete" href="javascript:void(0)" class="text-danger" variable-id="<variableId>" title="Excluir">X</a>
+                                </div>
+                            </div>
                         </div>
                     </div>
                 </form> 

js/accessibleUI/modules/variables/variables.js

@@ -51,6 +51,8 @@ export function createVariable () {
         deleteVariable(variableHash);
     });
 
+    updateResume(variable.hash);
+
     // Changing focus to the variable type after creation for screen readers
     document.getElementById(`variable${variable.hash}Type`).focus();
 }
@@ -83,6 +85,8 @@ function updateVariable (hash) {
     if (variable.value !== variableValue) {
         variable.value = variableValue;
     }
+
+    updateResume(hash);
 }
 
 // *********************************************************************************
@@ -106,6 +110,20 @@ export function deleteAllVariable () {
     variables.length = 0
 }
 
+// ***********************************************************************
+// Updating variable resume
+// ***********************************************************************
+
+function updateResume (hash) {
+    document.getElementById(`variable${hash}Resume`).setAttribute('title', generateResume(hash));
+}
+
+function generateResume (hash) {
+    const variable = getVariableByHash(hash);
+
+    return `${variable.type.name} ${variable.name} recebe ${variable.value}`;
+}
+
 // *********************************************************************************
 // Util
 // *********************************************************************************