Merge pull request #400 from OBDDimal/issue-223-detecting-feature

Issue 223 detecting feature problems via the FeatureIDE Service

frontendVue3/src/classes/Commands/CommandManager.js

@@ -1,5 +1,7 @@
 import * as commandFactory from "@/classes/Commands/CommandFactory";
 import * as update from '@/services/FeatureModel/update.service.js';
+import { getColorsFromService } from '@/services/FeatureModel/colorsFromService.service';
+import { ReloadCommand } from '@/classes/Commands/ReloadCommand';
 
 export class CommandManager {
     constructor() {
@@ -12,6 +14,10 @@ export class CommandManager {
         this.d3Data = null;
     }
 
+    executeReload(){
+      this.fadeOut(this.d3Data, new ReloadCommand());
+    }
+
     execute(command, initiator = true) {
         if (initiator && this.collaborationManager) {
             this.collaborationManager.send(this.type, 'execute', command.createDTO());
@@ -111,12 +117,57 @@ export class CommandManager {
     }
 
     fadeOut(d3Data, command) {
-        // Rerender for edits and fade them out
-        if(this.d3Data){
+        if(command instanceof ReloadCommand){
+            if(d3Data.coloringIndex < 1) {
+                getColorsFromService(this.collaborationManager.featureModel.data, d3Data).then(
+                  value => {
+                    if (!value) {
+                      d3Data.coloringIndex = 0;
+                    } else {
+                      d3Data.coloringIndex = -1;
+                    }
+                  }
+                );
+            }
+            // Rerender for edits and fade them out
+            setTimeout(() => {
+                command.unmarkChanges();
+                update.updateSvg(d3Data);
+            }, 500);
+        } else if(this.type !== 'constraint') {
+            if(d3Data.coloringIndex < 1) {
+                getColorsFromService(this.collaborationManager.featureModel.data, d3Data).then(
+                  value => {
+                    if (!value) {
+                      d3Data.coloringIndex = 0;
+                    } else {
+                      d3Data.coloringIndex = -1;
+                    }
+                  }
+                );
+            }
+            // Rerender for edits and fade them out
             setTimeout(() => {
                 command.unmarkChanges();
                 update.updateSvg(d3Data);
-            }, 5000);
+            }, 3000);
+        } else {
+            if(this.collaborationManager.featureModelCommandManager.d3Data.coloringIndex < 1) {
+                getColorsFromService(this.collaborationManager.featureModel.data, this.collaborationManager.featureModelCommandManager.d3Data).then(
+                  value => {
+                    if (!value) {
+                      this.collaborationManager.featureModelCommandManager.d3Data.coloringIndex = 0;
+                    } else {
+                      this.collaborationManager.featureModelCommandManager.d3Data.coloringIndex = -1;
+                    }
+                  }
+                );
+            }
+            // Rerender for edits and fade them out
+            setTimeout(() => {
+                command.unmarkChanges();
+                update.updateSvg(this.collaborationManager.featureModelCommandManager.d3Data);
+            }, 500);
         }
     }
 }

frontendVue3/src/classes/Commands/ReloadCommand.js

@@ -0,0 +1,10 @@
+import { Command } from '@/classes/Commands/Command';
+
+export class ReloadCommand extends Command {
+
+    execute() {
+    }
+
+    undo() {
+    }
+}

frontendVue3/src/classes/FeatureNode.js

@@ -26,7 +26,7 @@ export class FeatureNode {
         }else{
             this.displayName= newName.slice(0, CONSTANTS.DISPLAY_NAME_RAW) + CONSTANTS.POINTS;
         }
-       
+
     }
     color() {
         if (this.markedAsEdited) {
@@ -86,6 +86,10 @@ export class FeatureNode {
         this.groupType = groupType;
     }
 
+    setColor(color) {
+        this.colorValue = color;
+    }
+
     uncollapse(toRoot = true) {
         if (this.isCollapsed && !this.isLeaf()) {
             this.d3Node.children = this.d3Node.collapsedChildren;

frontendVue3/src/classes/constants.js

@@ -48,6 +48,12 @@ export const NODE_COLOR = "rgb(204, 204, 255)";
 export const NODE_EDITED_COLOR = "rgb(197,196,120)";
 export const NODE_ABSTRACT_COLOR = "#ebebff";
 
+export const NODE_DEAD_COLOR = "rgb(255, 46, 46)";
+
+export const NODE_FALSEOP_COLOR = "rgb(255, 153, 51)";
+
+export const NODE_CORE_COLOR = "rgb(51, 51, 255)";
+
 export const DISPLAY_NAME_LENGTH = 8;
 export const DISPLAY_NAME_RAW= 5;
 export const POINTS = '...';

frontendVue3/src/components/FeatureModel/FeatureModelTree.vue

@@ -272,6 +272,7 @@ export default {
             this.rootNode,
             this.constraints
         );
+        this.commandManager.executeReload();
         update.updateSvg(this.d3Data);
     },
 
@@ -281,8 +282,9 @@ export default {
         },
 
         coloring(coloringIndex) {
-            this.d3Data.coloringIndex = coloringIndex;
-            update.updateSvg(this.d3Data);
+          this.d3Data.coloringIndex = coloringIndex;
+          this.commandManager.executeReload();
+          update.updateSvg(this.d3Data);
         },
 
         onChangeFoundNodeIndex(index) {

frontendVue3/src/components/FeatureModel/FeatureModelTreeToolbar.vue

@@ -116,7 +116,7 @@
                     <v-list-item-title>Redo</v-list-item-title>
                 </v-list-item>
 
-                <v-menu offset-y :close-on-content-click="false">
+                <v-menu offset-y :close-on-content-click="false" >
                     <template v-slot:activator="{ props }">
                         <v-list-item v-bind="props" prepend-icon="mdi-palette">
                             <v-list-item-title>Coloring</v-list-item-title>
@@ -126,7 +126,7 @@
                         <v-list-item
                             v-for="(item, i) in itemsColoring"
                             :key="i"
-                            @click="selectedColoring(item)"
+                            @click="selectedColoring(i)"
                         >
                                 <v-list-item-title
                                 >{{item}}</v-list-item-title>
@@ -347,13 +347,14 @@ export default {
         maxChildren: 3,
         spaceBetweenParentChild: 75,
         spaceBetweenSiblings: 20,
-        itemsColoring: ['Count', 'Direct Children', 'Total Children'],
+        itemsColoring: ['Standard', 'Direct Children', 'Total Children'],
         isShortName: false,
         semanticEditing: false,
         quickEdit: false,
         drawer: true,
         discardChangesConfirmDialog: false,
         saveDialog: false,
+        isColorMenuOpened: false,
     }),
 
     watch: {

frontendVue3/src/services/FeatureModel/colorsFromService.service.js

@@ -0,0 +1,42 @@
+import { jsonToXML } from '@/services/xmlTranspiler.service';
+import axios, { CancelToken } from 'axios';
+import { NODE_CORE_COLOR, NODE_DEAD_COLOR, NODE_FALSEOP_COLOR } from '@/classes/constants';
+import { useAppStore } from '@/store/app';
+
+export async function getColorsFromService(featureModel, d3Data) {
+    try {
+        const source = CancelToken.source();
+        const timeout = setTimeout(() => {
+          source.cancel();
+          // Timeout Logic
+        }, 450);
+        const content = new TextEncoder().encode(jsonToXML(featureModel));
+        let response = await axios.post(`${import.meta.env.VITE_APP_DOMAIN_FEATUREIDESERVICE}stats`, {
+          name: featureModel.id + ".xml",
+          content: Array.from(content)
+        }, {cancelToken: source.token});
+        clearTimeout(timeout);
+        let deadFeatures = response.data.deadFeatures;
+        let falseOptionalFeatures = response.data.falseOptionalFeatures;
+        let coreFeatures = response.data.coreFeatures;
+
+        if (coreFeatures.length > 0) {
+            d3Data.root.descendants().filter(node => coreFeatures.includes(node.data.name)).forEach(node => node.data.setColor(NODE_CORE_COLOR));
+        }
+        if (falseOptionalFeatures.length > 0) {
+            d3Data.root.descendants().filter(node => falseOptionalFeatures.includes(node.data.name)).forEach(node => node.data.setColor(NODE_FALSEOP_COLOR));
+        }
+        if (deadFeatures.length > 0) {
+            d3Data.root.descendants().filter(node => deadFeatures.includes(node.data.name)).forEach(node => node.data.setColor(NODE_DEAD_COLOR));
+        }
+        return true;
+    } catch (e) {
+        const appStore = useAppStore()
+        appStore.updateSnackbar(
+          'Could not detect any special cases, because Service is down.',
+          'error',
+          3000,
+          true)
+        return false;
+    }
+}

frontendVue3/src/services/FeatureModel/count.service.js

@@ -4,16 +4,17 @@ import * as CONSTANTS from '@/classes/constants'
 export function colorNodes(allNodes, coloringIndex) {
 	switch (coloringIndex) {
 		case 0:
-			coloring(allNodes, countNodes)
+			resetColorNodes(allNodes)
 			break
 		case 1:
+      resetColorNodes(allNodes)
 			coloring(allNodes, countDirectChildren)
 			break
 		case 2:
+      resetColorNodes(allNodes)
 			coloring(allNodes, countTotalChildren)
 			break
 		default:
-			resetColorNodes(allNodes)
 			break
 	}
 }
@@ -43,7 +44,7 @@ function coloring(allNodes, coloringFunction) {
 /**
  * Counts all nodes
  * @returns {max: number, count: {}}
- */
+
 function countNodes(allNodes) {
 	let count = {}
 	let max = 0
@@ -58,7 +59,7 @@ function countNodes(allNodes) {
 	}
 
 	return { count: count, max: max }
-}
+}*/
 
 function countDirectChildren(allNodes) {
 	let count = {}

frontendVue3/src/views/FeatureModel.vue

@@ -137,7 +137,6 @@ import { EXAMPLE_FEATURE_MODEL_XML } from '@/classes/constants';
 import TutorialMode from '@/components/TutorialMode';
 import { NewEmptyModelCommand } from '@/classes/Commands/FeatureModel/NewEmptyModelCommand';
 import { SliceCommand } from "@/classes/Commands/FeatureModel/SliceCommand";
-import { FeatureNode } from "@/classes/FeatureNode";
 import FeatureModelInformation from '@/components/FeatureModel/FeatureModelInformation';
 import { useAppStore } from '@/store/app';
 import axios from "axios";
@@ -299,12 +298,22 @@ export default {
                     this.featureModelCommandManager.execute(command);
                     this.updateFeatureModel();
                 } catch (e) {
-                  console.log(e);
                   this.loadingData = false;
+                  appStore.updateSnackbar(
+                'Could not slice the Feature, because an unknown error occurred.',
+                'error',
+                3000,
+                true
+                  )
                 }
             } else {
                 this.loadingData = false;
-                this.errorNew("FeatureIDE Service is not available to slice the feature.");
+                appStore.updateSnackbar(
+              'Could not slice the Feature, because Service is down.',
+              'error',
+              3000,
+              true
+                )
             }
             this.loadingData = false;
         },