SvilenVelikov

Untitled

Oct 24th, 2021
1,005
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. window.addEventListener('load', solve);
  2.  
  3. function solve() {
  4.     const whereWeWriteNewSong = document.querySelector(".container-text form");
  5.     const buttonAdd = whereWeWriteNewSong.querySelector("button");
  6.     buttonAdd.addEventListener("click", addSong);
  7.     function addSong(ev) {
  8.         ev.preventDefault();
  9.         const inputFields = [];
  10.         const elements = Array.from(ev.target.parentElement.querySelectorAll("input"));
  11.         for (const el of elements) {
  12.             inputFields.push(el.value);
  13.         }
  14.  
  15.         let allFieldsFilledIn = true;
  16.         for (const el of inputFields) {
  17.             if (el == "") {
  18.                 allFieldsFilledIn = false;
  19.                 break;
  20.             }
  21.         }
  22.  
  23.         if (allFieldsFilledIn) {
  24.             addingSong(inputFields);
  25.             for (const el of elements) {
  26.                 el.value = "";
  27.             }
  28.  
  29.         }
  30.  
  31.     }
  32.  
  33.     function addingSong(inputArr) {
  34.         const whereWeAddTheSongs = document.querySelector(".all-hits-container");
  35.  
  36.         const divClassHitsInfo = document.createElement("div");
  37.         divClassHitsInfo.setAttribute("class", "hits-info");
  38.         whereWeAddTheSongs.appendChild(divClassHitsInfo);
  39.  
  40.         const imgElement = document.createElement("img");
  41.         imgElement.src = "./static/img/img.png";
  42.         divClassHitsInfo.appendChild(imgElement);
  43.  
  44.         const elH2Genre = document.createElement("h2");
  45.         elH2Genre.textContent = "Genre: " + inputArr[0];
  46.         divClassHitsInfo.appendChild(elH2Genre);
  47.  
  48.         const elH2Name = document.createElement("h2");
  49.         elH2Name.textContent = "Name: " + inputArr[1];
  50.         divClassHitsInfo.appendChild(elH2Name);
  51.  
  52.         const elH2Author = document.createElement("h2");
  53.         elH2Author.textContent = "Author: " + inputArr[2];
  54.         divClassHitsInfo.appendChild(elH2Author);
  55.  
  56.         const elH3Date = document.createElement("h3");
  57.         elH3Date.textContent = "Date: " + inputArr[3];
  58.         divClassHitsInfo.appendChild(elH3Date);
  59.  
  60.         const buttonLike = document.createElement("button");
  61.         buttonLike.setAttribute("class", "like-btn");
  62.         buttonLike.textContent = "Like song";
  63.         divClassHitsInfo.appendChild(buttonLike);
  64.         buttonLike.addEventListener("click", likeFunct);
  65.  
  66.         const buttonSave = document.createElement("button");
  67.         buttonSave.setAttribute("class", "save-btn");
  68.         buttonSave.textContent = "Save song";
  69.         divClassHitsInfo.appendChild(buttonSave);
  70.         buttonSave.addEventListener("click", saveFunct);
  71.        
  72.  
  73.         const buttonDelete = document.createElement("button");
  74.         buttonDelete.setAttribute("class", "delete-btn");
  75.         buttonDelete.textContent = "Delete";
  76.         divClassHitsInfo.appendChild(buttonDelete);
  77.         buttonDelete.addEventListener("click", deleteFunct);
  78.  
  79.     }
  80.  
  81.     function likeFunct(ev) {
  82.         ev.target.setAttribute('disabled', 'true');
  83.         const textTotalLikes = document.querySelector("div[class='likes']  p");
  84.         let [mainText, numberLikes] = textTotalLikes.textContent.split(": ");
  85.         numberLikes = Number(numberLikes);
  86.         numberLikes++;
  87.         textTotalLikes.textContent = mainText + ": "+ numberLikes;
  88.     }
  89.  
  90.     function saveFunct(ev) {
  91.         const elToMove = ev.target.parentElement;
  92.         elToMove.remove();
  93.         const childr = elToMove.children;
  94.         childr[5].remove();
  95.         childr[5].remove();
  96.  
  97.         const whereWeAddSavedSongs = document.querySelector(".saved-container");
  98.         whereWeAddSavedSongs.appendChild(elToMove);
  99.     }
  100.  
  101.     function deleteFunct(ev) {
  102.         const elToRemove = ev.target.parentElement;
  103.         elToRemove.remove();
  104.     }
  105. }
RAW Paste Data