src/scripts/components/TouristAttractions.js

@@ -28,7 +28,7 @@ export class TouristAttractions {
         this.events();
         this.carrossel();
         this.renderListItems();
-        this.removeSlick();
+        this.slickAdd();
     }
 
     selectors () {
@@ -71,6 +71,25 @@ export class TouristAttractions {
         }
     };
 
+    addProperty (e) {
+    e.preventDefault();
+
+    const spotImg = this.spanInput.children[0].src
+        const spotTitle = e.target['input-title'].value
+        const spotDescription = e.target['input-description'].value
+
+        if (spotImg != '' && spotTitle != '' && spotDescription != '') {
+
+            const spot = {
+                image: spotImg,
+                titulo: spotTitle,
+                description: spotDescription,
+            };
+            this.list.push(spot);
+            this.renderListItems();
+            this.resetInputs();
+        }
+    };
 
     renderListItems () {
         let spotStructure = '';
@@ -111,26 +130,14 @@ export class TouristAttractions {
         }
     };
 
-
+    slickAdd () {
-    addProperty (e) {
+        const ulListSlick = this.ulList;
-    e.preventDefault();
+        if (ulListSlick.classList.value === 'slick-initialized') {
-
+            this.carrossel();
-    const spotImg = this.spanInput.children[0].src
+        }else {
-        const spotTitle = e.target['input-title'].value
+            this.removeSlick();
-        const spotDescription = e.target['input-description'].value
-
-        if (spotImg != '' && spotTitle != '' && spotDescription != '') {
-
-            const spot = {
-                image: spotImg,
-                titulo: spotTitle,
-                description: spotDescription,
-            };
-            this.list.push(spot);
-            this.renderListItems();
-            this.resetInputs();
         }
-    };
+    }
 
     resetInputs () {
         this.inputTitle.value = '';