v0.2

src/components/Graph.vue

@@ -141,19 +141,9 @@ export default {
       },${y}`;
     };
 
-    const hasntIntersections = (node) => {
-      return nodes.value.every((current) => {
-        return (
-          (RADIUS * 2) ** 2 <
-          (node.x - current.x) ** 2 + (node.y - current.y) ** 2
-        );
-      });
-    };
-
     const checkGraph = () => {
       if (loop !== null) {
         deactivateAll();
-
         if (!linker.sourceEmpty()) activateNodes([linker.getSource()]);
       }
 
@@ -192,10 +182,8 @@ export default {
         selected: 0,
       };
 
-      if (hasntIntersections(newNode)) {
-        nodes.value.push(newNode);
-        emit("hasVertices", nodes.value.length);
-      }
+      nodes.value.push(newNode);
+      emit("hasVertices", nodes.value.length);
     };
 
     const removeNode = (id) => {

src/views/View.vue

@@ -15,9 +15,9 @@
   </popup>
   <div class="addition-cont menu">
     <div class="menu-cont">
-      <div class="menu-icon matrix-icon">
+      <!-- <div class="menu-icon matrix-icon">
         <div class="menu-prompt">Матрица смежности</div>
-      </div>
+      </div> -->
       <div class="menu-icon help-icon" @click="showGuide = true">
         <div class="menu-prompt">Обучение управлению</div>
       </div>
@@ -91,12 +91,21 @@
     </div>
   </div>
   <div class="addition-cont">
-    <!-- <div class="step-cont">
-      <div class="step active-step">2</div>
-      <div class="step active-step last-active-step">3</div>
-      <div class="step">1</div>
-      <div class="step">4</div>
-    </div> -->
+    <div v-if="stepExists" class="step-cont">
+      <div
+        class="step"
+        v-for="(step, i) in steps"
+        :key="i"
+        :class="{
+          'active-step': i === currentStepNumber || i === currentStepNumber + 1,
+          'dynamic-active-step': played && i < currentStepNumber,
+          'last-active-step': i === currentStepNumber + 1,
+        }"
+        @click="currentStepNumber = i"
+      >
+        {{ step.source }}
+      </div>
+    </div>
   </div>
 </template>