.eslintcache

[{"C:\\Users\\porse\\OneDrive\\Skrivbord\\projekt13\\src\\Views\\AllMyPlaylists.js":"1","C:\\Users\\porse\\OneDrive\\Skrivbord\\projekt13\\src\\Views\\Playlisten.js":"2","C:\\Users\\porse\\OneDrive\\Skrivbord\\projekt13\\src\\App.js":"3","C:\\Users\\porse\\OneDrive\\Skrivbord\\projekt13\\src\\Views\\reviews.js":"4","C:\\Users\\porse\\OneDrive\\Skrivbord\\projekt13\\src\\Views\\homepage.js":"5","C:\\Users\\porse\\OneDrive\\Skrivbord\\projekt13\\src\\Views\\searchView.js":"6","C:\\Users\\porse\\OneDrive\\Skrivbord\\projekt13\\src\\Views\\homepageLogin.js":"7","C:\\Users\\porse\\OneDrive\\Skrivbord\\projekt13\\src\\atunesModel.js":"8","C:\\Users\\porse\\OneDrive\\Skrivbord\\projekt13\\src\\index.js":"9","C:\\Users\\porse\\OneDrive\\Skrivbord\\projekt13\\src\\show.js":"10"},{"size":2041,"mtime":1608425313530,"results":"11","hashOfConfig":"12"},{"size":9437,"mtime":1608425620942,"results":"13","hashOfConfig":"12"},{"size":7261,"mtime":1608486498544,"results":"14","hashOfConfig":"12"},{"size":2298,"mtime":1608424063603,"results":"15","hashOfConfig":"12"},{"size":1788,"mtime":1608424670768,"results":"16","hashOfConfig":"12"},{"size":3437,"mtime":1608424684639,"results":"17","hashOfConfig":"12"},{"size":1926,"mtime":1608424772541,"results":"18","hashOfConfig":"12"},{"size":6355,"mtime":1608484034908,"results":"19","hashOfConfig":"12"},{"size":146,"mtime":1606833778000,"results":"20","hashOfConfig":"12"},{"size":449,"mtime":1607975296260,"results":"21","hashOfConfig":"12"},{"filePath":"22","messages":"23","errorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":0,"source":"24"},"1c76izv",{"filePath":"25","messages":"26","errorCount":0,"warningCount":4,"fixableErrorCount":0,"fixableWarningCount":0,"source":"27"},{"filePath":"28","messages":"29","errorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":0,"source":"30"},{"filePath":"31","messages":"32","errorCount":0,"warningCount":3,"fixableErrorCount":0,"fixableWarningCount":0,"source":"33"},{"filePath":"34","messages":"35","errorCount":0,"warningCount":3,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"36","messages":"37","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"38","messages":"39","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"40","messages":"41","errorCount":0,"warningCount":5,"fixableErrorCount":0,"fixableWarningCount":0,"source":"42"},{"filePath":"43","messages":"44","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"45","messages":"46","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},"C:\\Users\\porse\\OneDrive\\Skrivbord\\projekt13\\src\\Views\\AllMyPlaylists.js",["47","48"],"import React, { useState } from \"react\";\r\nimport fire from \"../services/firebase\";\r\n\r\nfunction getUserData() {\r\n  let user = fire.auth().currentUser;\r\n  return fire\r\n    .database()\r\n    .ref(\"/users/\" + user.uid)\r\n    .once(\"value\")\r\n    .then((snapshot) => {\r\n      return (snapshot.val() && snapshot.val().boughtPlaylists) || [];\r\n    });\r\n}\r\n\r\nfunction MyPlaylist({ atunesModel }) {\r\n  const [, setPlaylist] = React.useState([]);\r\n  React.useEffect(async () => {\r\n    async function fetchData() {\r\n      atunesModel.manyPlaylists = await getUserData();\r\n      setPlaylist(atunesModel.manyPlaylists);\r\n    }\r\n    fetchData();\r\n  }, []);\r\n\r\n  function updateWebsite() {\r\n    updatera2(updateras - 1);\r\n  }\r\n\r\n  function gåNer(element, index, updateras) {\r\n    //console.log(\"Sortera\")\r\n    //console.log(element)\r\n    //console.log(index)\r\n    atunesModel.sortPlayLists(element, index, updateras);\r\n    updateWebsite();\r\n  }\r\n\r\n  const [updateras, updatera2] = useState(4);\r\n\r\n  let allNames = atunesModel.manyPlaylists.map((element, index) => {\r\n    return (\r\n      <div className=\"boxsquare\">\r\n        {\" \"}\r\n        <h4>Playlist {index + 1}</h4>\r\n        {element.map((list, index) => (\r\n          <div>\r\n            {\" \"}\r\n            <h6>{index + 1}.</h6>\r\n              {list.trackName}\r\n            </div>\r\n        ))}\r\n        <br></br>\r\n        <hr></hr>\r\n        <br></br>\r\n        <center>\r\n          <button\r\n            style={{ fontSize: \"15px\" }}\r\n            className=\"waves-effect waves-light btn\"\r\n            onClick={() => gåNer(element, index, updateras)}\r\n          >\r\n            Sort playlist by name\r\n          </button>\r\n        </center>\r\n        <br></br>\r\n      </div>\r\n    );\r\n  });\r\n\r\n  /*\r\nlet TEST =  items.map((element, index)  => \r\n{return <div className = \"boxsquare\"> <h4>Playlist: {index+1}</h4>{element.map((list, index) => \r\n<div> <h6>{index+1}</h6>\r\n<div className = \"boxsquaresmall\">{list}\r\n\r\n</div>\r\n</div> )}\r\n\r\n</div>})\r\n*/\r\n  return <div>{allNames}</div>;\r\n}\r\n\r\nexport default MyPlaylist;\r\n","C:\\Users\\porse\\OneDrive\\Skrivbord\\projekt13\\src\\Views\\Playlisten.js",["49","50","51","52"],"import React, { useState } from \"react\";\r\nimport \"../App.css\";\r\nimport song from \"../songs/backgroundsong.mp3\";\r\nimport payNow from \"../Images/payNow.png\";\r\nimport arrowDown from \"../Images/arrowDown.png\";\r\nimport arrowUp from \"../Images/arrowUp.png\";\r\nimport addMore from \"../Images/addMoreMoney.png\";\r\nimport fire from \"../services/firebase\";\r\n\r\nlet songnamn = new Audio(song);\r\n\r\nfunction pausa() {\r\n  songnamn.pause();\r\n  songnamn.currentTime = 0;\r\n}\r\n\r\nfunction playSong() {\r\n  songnamn.play();\r\n}\r\n\r\nfunction halfVolume() {\r\n  songnamn.volume = 0.2;\r\n}\r\n\r\nfunction fullVolume() {\r\n  songnamn.volume = 1.0;\r\n}\r\n\r\nfunction millisToMinutesAndSeconds(millis) {\r\n  var minutes = Math.floor(millis / 60000);\r\n  var seconds = ((millis % 60000) / 1000).toFixed(0);\r\n  return minutes + \":\" + (seconds < 10 ? \"0\" : \"\") + seconds;\r\n}\r\n\r\nfunction getUserData() {\r\n  let user = fire.auth().currentUser;\r\n  return fire\r\n    .database()\r\n    .ref(\"/users/\" + user.uid)\r\n    .once(\"value\")\r\n    .then((snapshot) => {\r\n      return (snapshot.val() && snapshot.val().playlist) || [];\r\n    });\r\n}\r\n\r\nfunction getUserBankAccount() {\r\n  let user = fire.auth().currentUser;\r\n  return fire\r\n    .database()\r\n    .ref(\"/users/\" + user.uid)\r\n    .once(\"value\")\r\n    .then((snapshot) => {\r\n      return (snapshot.val() && snapshot.val().bankAccount) || [];\r\n    });\r\n}\r\n\r\nfunction Playlisten({ atunesModel }) {\r\n  const [, setPlaylist] = React.useState([]);\r\n  const [, setBankaccount] = React.useState([]);\r\n  React.useEffect(async () => {\r\n    async function fetchData() {\r\n      atunesModel.playlist = await getUserData();\r\n      atunesModel.bankAccount = await getUserBankAccount();\r\n      setPlaylist(atunesModel.playlist);\r\n      setBankaccount(atunesModel.bankAccount);\r\n    }\r\n    fetchData();\r\n  }, []);\r\n\r\n  function nyLista() {\r\n    atunesModel.newList();\r\n    updateWebsite();\r\n  }\r\n\r\n  function updateWebsite() {\r\n    updatera1(updatera - 1);\r\n  }\r\n\r\n  function pay() {\r\n    let finns = true;\r\n    for (let i = 0; i < atunesModel.playlist.length - 1; i++) {\r\n      //   6\r\n      for (\r\n        let j = i + 1;\r\n        j < atunesModel.playlist.length;\r\n        j++ //\r\n      )\r\n        if (\r\n          atunesModel.playlist[i].trackId === atunesModel.playlist[j].trackId\r\n        ) {\r\n          finns = false;\r\n          let namn = atunesModel.playlist[i].trackName;\r\n          alert(\"Remove duplicate of song \" + \"'\" + namn + \"'\");\r\n          break;\r\n        }\r\n      break;\r\n    }\r\n\r\n    if (finns === true) {\r\n      atunesModel.totalcostsPlaylist(atunesModel.bankAccount);\r\n\r\n      atunesModel.disablefnc(sum);\r\n\r\n      atunesModel.buyPlaylist(atunesModel.playlist);\r\n      updateWebsite();\r\n    }\r\n  }\r\n\r\n  //FIXA (tänk på parse innan du checkar om det är en number då prompt tar in strings)\r\n  function addMoreMoney() {\r\n    let val = prompt(\"enter värde\");\r\n    let vali = parseFloat(val);\r\n\r\n    let inputVal = atunesModel.bankAccount;\r\n    let inputVali = parseFloat(inputVal);\r\n    let summan = inputVali + vali;\r\n\r\n    atunesModel.bankMoney(summan.toFixed(2), sum);\r\n\r\n    updateWebsite();\r\n  }\r\n\r\n  const [updatera, updatera1] = useState(4);\r\n\r\n  let prisen;\r\n  let rest;\r\n\r\n  if (atunesModel.bankAccount === null) {\r\n    //console.log(\"TESTRARR\");\r\n    atunesModel.bankAccount = 10;\r\n    updateWebsite();\r\n  }\r\n\r\n  if (atunesModel.disabled === true) {\r\n    rest = (\r\n      <h5 style={{ color: \"red\" }}>You are missing {atunesModel.dif} $</h5>\r\n    );\r\n  } else if (atunesModel.skillnad === \"+\") {\r\n    prisen = (\r\n      <h5 style={{ color: \"green\" }}>\r\n        You have {atunesModel.bankAccount} $ left in your bank\r\n      </h5>\r\n    );\r\n  }\r\n\r\n  let summan = atunesModel.playlist.map((element) => element.trackPrice);\r\n  let sum = 0;\r\n  for (let i = 0; i < summan.length; i++) {\r\n    sum += summan[i];\r\n  }\r\n\r\n  let playtime = atunesModel.playlist.map((element) => element.trackTimeMillis);\r\n\r\n  let playMin = 0;\r\n  let playSek = 0;\r\n  let time = 0;\r\n\r\n  for (let i = 0; i < playtime.length; i++) {\r\n    playMin += playtime[i];\r\n  }\r\n  playMin = playMin / 1000 / 60;\r\n  playSek = playMin;\r\n  playMin = Math.floor(playMin);\r\n  playSek = playSek - playMin;\r\n  playSek *= 60;\r\n  playSek = playSek.toFixed(0);\r\n\r\n  time = (\r\n    <span>\r\n      {playMin}:{playSek}\r\n    </span>\r\n  );\r\n\r\n  let cirkel = <div className=\"water\"></div>;\r\n\r\n  function taBort(song) {\r\n    atunesModel.removeSong(song);\r\n\r\n    updateWebsite();\r\n  }\r\n\r\n  function gåUpp(song) {\r\n    atunesModel.gåUppListan(song);\r\n    updateWebsite();\r\n  }\r\n\r\n  function gåNer(song) {\r\n    atunesModel.gåNerListan(song);\r\n    updateWebsite();\r\n  }\r\n\r\n  /*\r\nfunction myPlaylists(){\r\n\r\n  updateWebsite()\r\n\r\n} */\r\n\r\n  let t = atunesModel.playlist.map((element) => (\r\n    <tbody className=\"highlight black\">\r\n      <tr>\r\n        <td>\r\n          <h6 className=\"fontColorPlaylist\">{element.artistName}</h6>\r\n        </td>\r\n        <td>\r\n          <h6 className=\"fontColorPlaylist\">{element.trackName}</h6>\r\n        </td>\r\n        <td>\r\n          <h6 className=\"fontColorPlaylist\">{element.trackPrice}$</h6>{\" \"}\r\n        </td>\r\n        <td>\r\n          <h6 className=\"fontColorPlaylist\">\r\n            {millisToMinutesAndSeconds(element.trackTimeMillis)}\r\n          </h6>\r\n        </td>\r\n        <td>\r\n          <embed\r\n            src={element.previewUrl}\r\n            width=\"145\"\r\n            height=\"100\"\r\n            autoPlay={false}\r\n            autostart=\"false\"\r\n          ></embed>\r\n        </td>\r\n        <td>\r\n          <img\r\n            src={element.artworkUrl100}\r\n            width=\"100\"\r\n            alt=\"\"\r\n            height=\"100\"\r\n            border=\"0\"\r\n          />\r\n        </td>\r\n        <td>\r\n          {\" \"}\r\n          <button\r\n            className=\"myButton2\"\r\n            onClick={() => taBort(element.trackName)}\r\n          >\r\n            X\r\n          </button>{\" \"}\r\n        </td>\r\n        <td>\r\n          {\" \"}\r\n          <button style={{ fontSize: \"10px\" }} onClick={() => gåUpp(element)}>\r\n            <img src={arrowUp} width=\"40\" alt=\"\" height=\"40\"></img>\r\n          </button>\r\n        </td>\r\n        <td>\r\n          {\" \"}\r\n          <button style={{ fontSize: \"10px\" }} onClick={() => gåNer(element)}>\r\n            <img src={arrowDown} width=\"40\" alt=\"\" height=\"40\"></img>\r\n          </button>\r\n        </td>\r\n      </tr>\r\n    </tbody>\r\n  ));\r\n\r\n  let tabell;\r\n\r\n  if (t.length === 0) {\r\n    cirkel = <div className=\"water\"></div>;\r\n\r\n    tabell = \"\";\r\n  } else {\r\n    cirkel = \"\";\r\n    {\r\n    }\r\n    // cirkel = <div className=\"water\"></div>;\r\n    tabell = (\r\n      <div className=\"card-panel black\">\r\n        <table className=\"highlight\">\r\n          <thead>\r\n            <tr>\r\n              <th className=\"fontColorPlaylist\">Artist name</th>\r\n              <th className=\"fontColorPlaylist\">Song</th>\r\n              <th className=\"fontColorPlaylist\">Price</th>\r\n              <th className=\"fontColorPlaylist\">Length</th>\r\n              <th className=\"fontColorPlaylist\">Click to listen!</th>\r\n            </tr>\r\n          </thead>\r\n          {t}\r\n        </table>\r\n        <div className=\"card-panel black\">\r\n          <h6 className=\"fontColorPlaylist\">\r\n            Total cost of your playlist: {sum.toFixed(2)} ${\" \"}\r\n          </h6>\r\n          <h6 className=\"fontColorPlaylist\">\r\n            Total length of your playlist: {time}{\" \"}\r\n          </h6>{\" \"}\r\n        </div>\r\n        <hr></hr>\r\n        <br></br>\r\n\r\n        <i className=\"large material-icons\" style={{ color: \"white\" }}>\r\n          add_shopping_cart\r\n        </i>\r\n        <h6 className=\"fontColorPlaylist\">Current balance: </h6>\r\n        <h6 className=\"fontColorPlaylist\"> {atunesModel.bankAccount}</h6>\r\n        <button onClick={() => pay()} disabled={atunesModel.disabled}>\r\n          <img src={payNow} alt=\"\"></img>\r\n        </button>\r\n        <button onClick={() => addMoreMoney()}>\r\n          {\" \"}\r\n          Press to insert more money{\" \"}\r\n          <img src={addMore} alt=\"\" height=\"183\"></img>\r\n        </button>\r\n\r\n        {prisen}\r\n        {rest}\r\n      </div>\r\n    );\r\n  }\r\n  return (\r\n    <div className=\"black\">\r\n      <hr className=\"hrBlack\"></hr>\r\n      <button\r\n        className=\"btn-large red darken-2 waves-effect waves-red\"\r\n        onClick={() => nyLista()}\r\n      >\r\n        <span>Delete basket</span>{\" \"}\r\n        <i className=\"material-icons right\">remove_circle_outline</i>\r\n      </button>\r\n      <hr className=\"hrBlack\"></hr>\r\n      <hr className=\"hrGrey\"></hr>\r\n      {tabell}\r\n      <br></br>\r\n      {cirkel}\r\n\r\n      <div>\r\n        <br></br>\r\n        <br></br>\r\n        <input\r\n          type=\"button\"\r\n          value=\"Play background song\"\r\n          className=\"waves-effect waves-light btn-small\"\r\n          onClick={() => playSong()}\r\n        />\r\n        <input\r\n          type=\"button\"\r\n          value=\"Mute background song\"\r\n          className=\"waves-effect waves-light btn-small\"\r\n          onClick={() => pausa()}\r\n        />\r\n        <input\r\n          type=\"button\"\r\n          value=\"lower the volume\"\r\n          className=\"waves-effect waves-light btn-small\"\r\n          onClick={() => halfVolume()}\r\n        />\r\n        <input\r\n          type=\"button\"\r\n          value=\"Higher the volume\"\r\n          className=\"waves-effect waves-light btn-small\"\r\n          onClick={() => fullVolume()}\r\n        />\r\n\r\n        <br></br>\r\n        <br></br>\r\n        <hr></hr>\r\n      </div>\r\n    </div>\r\n  );\r\n}\r\n\r\nexport default Playlisten;\r\n","C:\\Users\\porse\\OneDrive\\Skrivbord\\projekt13\\src\\App.js",["53","54"],"import React from \"react\";\nimport \"./App.css\";\nimport Search from \"./Components/search\";\nimport Playlisten from \"./Views/Playlisten\";\nimport Show from \"./show\";\nimport atunesModel from \"./atunesModel\";\nimport Homepage from \"./Views/homepage\";\nimport fire from \"./services/firebase\";\nimport AboutUs from \"./Views/homepageLogin\";\nimport Reviews from \"./Views/reviews\"\nimport AllMyPlayLists from \"./Views/AllMyPlaylists\"\n\nfunction App() {\n  const model = new atunesModel();\n\n  const [user, setUser] = React.useState(\"\");\n  const [email, setEmail] = React.useState(\"\");\n  const [password, setPassword] = React.useState(\"\");\n  const [emailError, setEmailError] = React.useState(\"\");\n  const [passwordError, setPasswordError] = React.useState(\"\");\n  const [hasAccount, setHasAccount] = React.useState(false);\n\n  const clearInputs = () => {\n    setEmail(\"\");\n    setPassword(\"\");\n  };\n\n  const clearErrors = () => {\n    setEmailError(\"\");\n    setPasswordError(\"\");\n  };\n\n  const handleLogin = () => {\n    clearErrors();\n\n    fire\n      .auth()\n      .signInWithEmailAndPassword(email, password)\n      .catch((err) => {\n        switch (err.code) {\n          case \"auth/invalid-email\":\n          case \"auth/user-disabled\":\n          case \"auth/user-not-found\":\n            setEmailError(err.message);\n            break;\n          case \"autth/wrong-password\":\n            setPasswordError(err.message);\n            break;\n          default:\n            //do nothing\n        }\n      });\n  };\n\n  const handleSignup = () => {\n    clearErrors();\n    fire\n      .auth()\n      .createUserWithEmailAndPassword(email, password)\n      .catch((err) => {\n        switch (err.code) {\n          case \"auth/email-already-in-use\":\n          case \"auth/invalid-email\":\n            setEmailError(err.message);\n            break;\n          case \"auth/weak-password\":\n            setPasswordError(err.message);\n            break;\n          default:\n          //do nothing\n        }\n      });\n  };\n\n  const handleLogout = () => {\n    fire.auth().signOut();\n  };\n\n  function testing(user) {\n    if (user) {\n      clearInputs();\n      setUser(user);\n      //model.setUser(user.uid);\n      // model.setUser(\"aaa\");\n      //console.log(\"I app js\");\n      //console.log(model.userID);\n    } else {\n      setUser(\"\");\n    }\n  }\n\n  const authListener = () => {\n    fire.auth().onAuthStateChanged((user) => testing(user));\n  };\n\n  /*\nconst authListener = () => {\n\tfire.auth().onAuthStateChanged((user) => {\n\tif (user) {\n    console.log(user)\n    clearInputs();\n    setUser(user);\n    //model.setUser(user.uid);\n    model.setUser(\"aaa\");\n    console.log(\"I app js\");\n    console.log(model.userID);\n    console.log(user)\n\t} else {\n\t\tsetUser(\"\");\n\t}\n\t});\n}; */\n\n  React.useEffect(() => {\n    authListener();\n  }, []);\n\n  return (\n    <div className=\"App\">\n      {user ? (\n        <div>\n          {alert(\"Welcome you are now logged in!\")}\n          <nav>\n            <div className=\"nav-wrapper grey darken-3\">\n              <center>\n                <a href=\"#homepage\" className=\"brand-logo\">\n                  MeloTunes\n                </a>\n              </center>\n              <ul id=\"nav-mobile\" className=\"right hide-on-med-and-down\">\n                <li>\n                  <a href=\"#homepage\" onClick={() => handleLogout()}>\n                    Logout\n                  </a>\n                </li>\n                <li>\n                  <a href=\"#search\">Search</a>\n                </li>\n                <li>\n                  <a href=\"#playlist\">Shop</a>\n                </li>\n                <li>\n                  <a href=\"#myPlaylists\">My Playlists</a>\n                </li>\n                <li>\n                <a href=\"#reviews\">Reviews</a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n          <div> \n          <Show hash=\"#homepage\">\n            <AboutUs />\n          </Show>\n          </div>\n          <div>\n            <Show hash=\"#search\">\n              <Search atunesModel={model} />{\" \"}\n            </Show>\n          </div>\n          <div>\n            <Show hash=\"#playlist\">\n              <Playlisten atunesModel={model} />{\" \"}\n            </Show>\n          </div>\n          <div>\n            <Show hash=\"#myPlaylists\">\n              <AllMyPlayLists atunesModel={model} />{\" \"}\n            </Show>\n          </div>\n          <div>\n          <Show hash=\"#reviews\">\n              <Reviews />\n            </Show>\n          </div>\n<footer className=\"page-footer\" className=\"page-footer grey\">\n          <div className=\"container\">\n            <div className=\"row\">\n              <div className=\"col l6 s12\">\n                <h5 className=\"white-text\">MeloTunes</h5>\n                <br></br>\n                <p className=\"grey-text text-lighten-4\"> Providing Tunes 4 u </p>\n                \n             <div></div>\n              </div>\n              <div className=\"col l4 offset-l2 s12\">\n                <ul>\n                  <li><a className=\"grey-text text-lighten-3\" href=\"#search\">Search</a></li>\n                  <li><a className=\"grey-text text-lighten-3\" href=\"#playlist\">Basket</a></li>\n                  <li><a className=\"grey-text text-lighten-3\" href=\"#myPlaylists\">My Playlists</a></li>\n                  <li><a className=\"grey-text text-lighten-3\" href=\"#homepage\">Learn more about us</a></li>\n                  <li><a className=\"grey-text text-lighten-3\" href=\"#reviews\">Customer reviews</a></li>\n                </ul>\n              </div>\n            </div>\n          </div>\n          <div className=\"footer-copyright\">\n            <div className=\"container\">\n            © 2020 Copyright MeloTunes\n            </div>\n          </div>\n        </footer>\n        </div>\n      ) : (\n        <div>\n          <nav>\n            <div className=\"nav-wrapper grey darken-3\">\n              <center>\n                <a href=\"#homepage\" className=\"brand-logo\">\n                  MeloTunes\n                </a>\n              </center>\n              <ul id=\"nav-mobile\" className=\"right hide-on-med-and-down\">\n                <li>\n                  <a href=\"#homepage\">Homepage</a>\n                </li>\n                <li className=\"disabled\">\n                  <a href=\"#search\">Search</a>\n                </li>\n                <li className=\"disabled\">\n                  <a href=\"#playlist\">Shop</a>\n                </li>\n                <li className=\"disabled\">\n                  <a href=\"#myPlaylists\">My Playlists</a>\n                </li>\n                <li>\n                <a href=\"#reviews\">Reviews</a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n          <Show hash=\"#homepage\">\n            <Homepage\n              email={email}\n              setEmail={setEmail}\n              password={password}\n              setPassword={setPassword}\n              handleLogin={handleLogin}\n              handleSignup={handleSignup}\n              hasAccount={hasAccount}\n              setHasAccount={setHasAccount}\n              emailError={emailError}\n              passwordError={passwordError}\n            />{\" \"}\n          </Show>\n          <div>\n          <Show hash=\"#reviews\">\n              <Reviews />\n            </Show>\n          </div>\n        </div>\n      )}\n    </div>\n  );\n}\n\nexport default App;\n","C:\\Users\\porse\\OneDrive\\Skrivbord\\projekt13\\src\\Views\\reviews.js",["55","56","57"],"function Reviews (){\r\n\r\n    return (<div>\r\n\r\n\r\n\r\n       <center><h2 className=\"reviewsHeader\">Customer Testimonies</h2></center> \r\n<div>\r\n        \r\n<div className=\"center\">\r\n  <div className=\"property-card\">\r\n    <a href=\"#\">\r\n      <div className=\"property-image\">\r\n      </div>\r\n      </a>\r\n    <div className=\"property-description\">\r\n      <h5> Joe </h5>\r\n      <i className=\"medium material-icons\">account_circle</i>\r\n      <p>\"Melotunes is a great app for people wanting to find all kinds of music. It's very convenient. I hope they can make a page that shows all playlists that you have bought.\"</p>\r\n      <i className=\"small material-icons\">star</i>\r\n      <i className=\"small material-icons\">star</i>\r\n      <i className=\"small material-icons\">star</i>\r\n      <i className=\"small material-icons\">star</i>\r\n    </div>\r\n  </div>\r\n</div>\r\n\r\n\r\n        \r\n<div className=\"center\">\r\n  <div className=\"property-card\">\r\n    <a href=\"#\">\r\n      <div className=\"property-image\">\r\n      </div></a>\r\n    <div className=\"property-description\">\r\n      <h5> Michael </h5>\r\n      <i className=\"medium material-icons\">account_circle</i>\r\n      <p>\" Absolutely love this App it allows me to enjoy my favourite music with Family and friends and gives them the opportunity to download the app and create their own playlists aswell.\"</p>\r\n      <i className=\"small material-icons\">star</i>\r\n      <i className=\"small material-icons\">star</i>\r\n      <i className=\"small material-icons\">star</i>\r\n    </div>\r\n  </div>\r\n</div>\r\n\r\n<div>\r\n        \r\n<div className=\"center\">\r\n  <div className=\"property-card\">\r\n    <a href=\"#\">\r\n      <div className=\"property-image\">\r\n      </div></a>\r\n    <div className=\"property-description\">\r\n      <h5> Mark </h5>\r\n      <i className=\"medium material-icons\">account_circle</i>\r\n      <p>\"Great app would definetily recommend it. Hope they develop a 2.0 Version soon with more responsive and informative messages/popups.\"</p>\r\n      <i className=\"small material-icons\">star</i>\r\n      <i className=\"small material-icons\">star</i>\r\n      <i className=\"small material-icons\">star</i>\r\n      <i className=\"small material-icons\">star</i>\r\n      <i className=\"small material-icons\">star</i>\r\n    </div>\r\n  </div>\r\n</div>\r\n\r\n</div>\r\n\r\n</div>\r\n\r\n    </div>)\r\n}\r\n\r\nexport default Reviews","C:\\Users\\porse\\OneDrive\\Skrivbord\\projekt13\\src\\Views\\homepage.js",["58","59","60"],"C:\\Users\\porse\\OneDrive\\Skrivbord\\projekt13\\src\\Views\\searchView.js",[],"C:\\Users\\porse\\OneDrive\\Skrivbord\\projekt13\\src\\Views\\homepageLogin.js",[],"C:\\Users\\porse\\OneDrive\\Skrivbord\\projekt13\\src\\atunesModel.js",["61","62","63","64","65"],"import React, { Component } from \"react\";\r\nimport fire from \"./services/firebase\";\r\n\r\nclass atunesModel {\r\n  constructor(\r\n    manyPlaylists = [],\r\n    playlist = [],\r\n    songs = [],\r\n    convertedTime = 0,\r\n    totalPlaytime = 0,\r\n    totalOfSongs = 0,\r\n    currentSongUrl,\r\n    bankAccount = 10,\r\n    skillnad,\r\n    dif,\r\n    disabled\r\n  ) {\r\n    this.songs = songs;\r\n    this.totalPlaytime = totalPlaytime;\r\n    this.convertedTime = convertedTime;\r\n    this.totalOfSongs = totalOfSongs;\r\n    this.currentSongUrl = currentSongUrl;\r\n    this.bankAccount = bankAccount;\r\n    this.skillnad = skillnad;\r\n    this.dif = dif;\r\n    this.manyPlaylists = manyPlaylists;\r\n    this.disabled = disabled;\r\n    this.playlist = playlist;\r\n  }\r\n\r\n  /*\r\n     setUser(user) {\r\n         console.log(\"setuserid\")\r\n         console.log(user)\r\n         this.userID = user\r\n         console.log(this.userID)\r\n         //this.writeUserData(user.uid, user.email)\r\n     }\r\n      */\r\n\r\n  writeUserData(user) {\r\n    //console.log(user);\r\n    fire\r\n      .database()\r\n      .ref(\"users/\" + user)\r\n      .set({\r\n        playlist: this.playlist,\r\n        boughtPlaylists: this.manyPlaylists,\r\n        bankAccount: this.bankAccount,\r\n      });\r\n  }\r\n\r\n  disablefnc(sum) {\r\n    if (sum > this.bankAccount) {\r\n      this.dif = sum - this.bankAccount;\r\n      this.dif = this.dif.toFixed(2);\r\n      this.disabled = true;\r\n    } else {\r\n      this.disabled = false;\r\n    }\r\n  }\r\n\r\n  buyPlaylist(playlist) {\r\n    let user = fire.auth().currentUser;\r\n    this.manyPlaylists.push(playlist);\r\n    this.playlist = [];\r\n    this.writeUserData(user.uid);\r\n    alert(\"You bought a playlist!\");\r\n  }\r\n\r\n  removeSong(song) {\r\n    let user = fire.auth().currentUser;\r\n    this.playlist = this.playlist.filter(\r\n      (element) => element.trackName != song\r\n    );\r\n    this.writeUserData(user.uid);\r\n    //console.log(this.playlist)\r\n    //console.log(song)\r\n  }\r\n\r\n  setCurrentSongUrl(songUrl) {\r\n    //console.log(\"SET LÅT UNDER\")\r\n    this.currentSongUrl = songUrl;\r\n    //console.log(this.currentSongUrl)\r\n  }\r\n\r\n  getCurrentSongUrl() {\r\n    // console.log(\"GET LÅT UNDER\")\r\n    //console.log(this.currentSongUrl)\r\n    return this.currentSongUrl;\r\n  }\r\n\r\n  bankMoney(money, sum) {\r\n    let user = fire.auth().currentUser;\r\n\r\n    this.bankAccount = money;\r\n    this.writeUserData(user.uid);\r\n    // console.log(this.bankAccount)\r\n\r\n    if (money > sum) {\r\n      this.disabled = false;\r\n    }\r\n    this.dif = sum - money;\r\n    this.dif = this.dif.toFixed(2);\r\n  }\r\n\r\n  totalcostsPlaylist(money) {\r\n    let user = fire.auth().currentUser;\r\n\r\n    if (money == \"\") {\r\n      alert(\"Please enter your current balance\");\r\n      money = 0;\r\n      this.bankAccount = money;\r\n    } else {\r\n      this.bankAccount = money;\r\n\r\n      let summan = this.playlist.map((element) => element.trackPrice);\r\n      //console.log(summan)\r\n      let sum = 0;\r\n      //console.log(summan)\r\n      for (let i = 0; i < summan.length; i++) {\r\n        sum += summan[i];\r\n      }\r\n\r\n      //console.log(sum)\r\n\r\n      if (this.bankAccount < sum) {\r\n        this.bankAccount = this.bankAccount - sum;\r\n\r\n        this.skillnad = \"-\";\r\n      } else {\r\n        this.bankAccount = this.bankAccount - sum;\r\n        this.bankAccount = this.bankAccount.toFixed(2);\r\n        this.skillnad = \"+\";\r\n      }\r\n    }\r\n    this.writeUserData(user.uid);\r\n  }\r\n\r\n  getMoney() {\r\n    return this.bankAccount;\r\n  }\r\n\r\n  gåNerListan(song) {\r\n    let user = fire.auth().currentUser;\r\n    let temp;\r\n\r\n    for (let i = 0; i < this.playlist.length; i++) {\r\n      if (this.playlist[i] == song) {\r\n        temp = i;\r\n      }\r\n    }\r\n\r\n    if (temp == this.playlist.length - 1) {\r\n      alert(\"CANT GO DOWN\");\r\n    } else {\r\n      let tempVärde = this.playlist[temp];\r\n      this.playlist[temp] = this.playlist[temp + 1];\r\n      this.playlist[temp + 1] = tempVärde;\r\n    }\r\n\r\n    this.writeUserData(user.uid);\r\n  }\r\n\r\n  gåUppListan(song) {\r\n    let user = fire.auth().currentUser;\r\n\r\n    let temp;\r\n    for (let i = 0; i < this.playlist.length; i++) {\r\n      if (this.playlist[i] === song) {\r\n        temp = i;\r\n      }\r\n    }\r\n\r\n    if (temp === 0) {\r\n      alert(\"CANT GO UP\");\r\n    } else {\r\n      let tempVärde = this.playlist[temp];\r\n      this.playlist[temp] = this.playlist[temp - 1];\r\n      this.playlist[temp - 1] = tempVärde;\r\n    }\r\n    this.writeUserData(user.uid);\r\n  }\r\n\r\n  addSongToPlaylist(song) {\r\n    let user = fire.auth().currentUser;\r\n\r\n    //console.log(this.playlist)\r\n\r\n    if (!this.playlist.includes(song)) {\r\n      this.playlist.push(song);\r\n      //console.log(\"den här\");\r\n      //console.log(user.uid);\r\n      this.writeUserData(user.uid);\r\n      this.calculateTotalPlaytime(song);\r\n    } else {\r\n      alert(\"Cant add!  \" + song.trackName + \" already in playlist\");\r\n    }\r\n\r\n    //console.log(this.song)\r\n    //console.log(this.playlist)\r\n    //console.log(this.totalPlaytime)\r\n  }\r\n\r\n  newList() {\r\n    let user = fire.auth().currentUser;\r\n    let value = prompt(\r\n      \"Are you sure you want to reset current playlist and make a new one Press yes, else no\"\r\n    );\r\n    if (value === \"yes\") {\r\n      this.playlist = [];\r\n      this.writeUserData(user.uid);\r\n    }\r\n  }\r\n\r\n  totalSongs() {\r\n    this.totalOfSongs = this.playlist.length;\r\n    return this.totalOfSongs;\r\n  }\r\n\r\n  calculateTotalPlaytime(song) {\r\n    this.totalPlaytime += song.trackTimeMillis;\r\n\r\n    this.convertedTime = this.timeConverter(this.totalPlaytime);\r\n  }\r\n\r\n  sortPlayLists(element, index, updateras) {\r\n    let sortera = element.map((songName) => songName.trackName);\r\n    let sort;\r\n\r\n    if (updateras % 2 === 0) {\r\n      sort = sortera.sort();\r\n    } else {\r\n      sort = this.reverseSortPlaylist(sortera);\r\n    }\r\n\r\n    for (let i = 0; i < sort.length; i++) {\r\n      this.manyPlaylists[index][i].trackName = sort[i];\r\n    }\r\n\r\n    //console.log(\"KLART\");\r\n    //console.log(this.manyPlaylists[index][0].trackName);\r\n  }\r\n\r\n  reverseSortPlaylist(sortera) {\r\n    for (let i = 0; i < sortera.length / 2; i++) {\r\n      let temp = sortera[i];\r\n      sortera[i] = sortera[sortera.length - 1 - i];\r\n      sortera[sortera.length - i - 1] = temp;\r\n    }\r\n    return sortera;\r\n  }\r\n\r\n  timeConverter(time) {\r\n    return (time / 1000 / 60).toFixed(2);\r\n  }\r\n  render() {\r\n    return <div>HEJSAN</div>;\r\n  }\r\n}\r\n\r\nexport default atunesModel;\r\n","C:\\Users\\porse\\OneDrive\\Skrivbord\\projekt13\\src\\index.js",[],"C:\\Users\\porse\\OneDrive\\Skrivbord\\projekt13\\src\\show.js",["66"],{"ruleId":"67","severity":1,"message":"68","line":17,"column":19,"nodeType":"69","endLine":23,"endColumn":4},{"ruleId":"67","severity":1,"message":"70","line":23,"column":6,"nodeType":"71","endLine":23,"endColumn":8,"suggestions":"72"},{"ruleId":"67","severity":1,"message":"68","line":60,"column":19,"nodeType":"69","endLine":68,"endColumn":4},{"ruleId":"67","severity":1,"message":"70","line":68,"column":6,"nodeType":"71","endLine":68,"endColumn":8,"suggestions":"73"},{"ruleId":"74","severity":1,"message":"75","line":93,"column":45,"nodeType":"76","messageId":"77","endLine":93,"endColumn":46},{"ruleId":"78","severity":1,"message":"79","line":267,"column":5,"nodeType":"80","messageId":"81","endLine":268,"endColumn":6},{"ruleId":"67","severity":1,"message":"82","line":116,"column":6,"nodeType":"71","endLine":116,"endColumn":8,"suggestions":"83"},{"ruleId":"84","severity":1,"message":"85","line":176,"column":33,"nodeType":"86","endLine":176,"endColumn":61},{"ruleId":"87","severity":1,"message":"88","line":12,"column":5,"nodeType":"89","endLine":12,"endColumn":17},{"ruleId":"87","severity":1,"message":"88","line":32,"column":5,"nodeType":"89","endLine":32,"endColumn":17},{"ruleId":"87","severity":1,"message":"88","line":50,"column":5,"nodeType":"89","endLine":50,"endColumn":17},{"ruleId":"90","severity":1,"message":"91","line":2,"column":8,"nodeType":"92","messageId":"93","endLine":2,"endColumn":12},{"ruleId":"90","severity":1,"message":"94","line":24,"column":5,"nodeType":"92","messageId":"93","endLine":24,"endColumn":15},{"ruleId":"90","severity":1,"message":"95","line":25,"column":5,"nodeType":"92","messageId":"93","endLine":25,"endColumn":18},{"ruleId":"90","severity":1,"message":"96","line":1,"column":17,"nodeType":"92","messageId":"93","endLine":1,"endColumn":26},{"ruleId":"97","severity":1,"message":"98","line":74,"column":38,"nodeType":"76","messageId":"99","endLine":74,"endColumn":40},{"ruleId":"97","severity":1,"message":"100","line":110,"column":15,"nodeType":"76","messageId":"99","endLine":110,"endColumn":17},{"ruleId":"97","severity":1,"message":"100","line":149,"column":28,"nodeType":"76","messageId":"99","endLine":149,"endColumn":30},{"ruleId":"97","severity":1,"message":"100","line":154,"column":14,"nodeType":"76","messageId":"99","endLine":154,"endColumn":16},{"ruleId":"90","severity":1,"message":"101","line":4,"column":10,"nodeType":"92","messageId":"93","endLine":4,"endColumn":15},"react-hooks/exhaustive-deps","Effect callbacks are synchronous to prevent race conditions. Put the async function inside:\n\nuseEffect(() => {\n  async function fetchData() {\n    // You can await here\n    const response = await MyAPI.getData(someId);\n    // ...\n  }\n  fetchData();\n}, [someId]); // Or [] if effect doesn't need props or state\n\nLearn more about data fetching with Hooks: https://reactjs.org/link/hooks-data-fetching","ArrowFunctionExpression","React Hook React.useEffect has a missing dependency: 'atunesModel'. Either include it or remove the dependency array.","ArrayExpression",["102"],["103"],"no-useless-concat","Unexpected string concatenation of literals.","BinaryExpression","unexpectedConcat","no-lone-blocks","Nested block is redundant.","BlockStatement","redundantNestedBlock","React Hook React.useEffect has a missing dependency: 'authListener'. Either include it or remove the dependency array.",["104"],"react/jsx-no-duplicate-props","No duplicate props allowed","JSXAttribute","jsx-a11y/anchor-is-valid","The href attribute requires a valid value to be accessible. Provide a valid, navigable address as the href value. If you cannot provide a valid href, but still need the element to resemble a link, use a button and change it with appropriate styles. Learn more: https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/anchor-is-valid.md","JSXOpeningElement","no-unused-vars","'fire' is defined but never used.","Identifier","unusedVar","'hasAccount' is assigned a value but never used.","'setHasAccount' is assigned a value but never used.","'Component' is defined but never used.","eqeqeq","Expected '!==' and instead saw '!='.","unexpected","Expected '===' and instead saw '=='.","'route' is assigned a value but never used.",{"desc":"105","fix":"106"},{"desc":"105","fix":"107"},{"desc":"108","fix":"109"},"Update the dependencies array to be: [atunesModel]",{"range":"110","text":"111"},{"range":"112","text":"111"},"Update the dependencies array to be: [authListener]",{"range":"113","text":"114"},[635,637],"[atunesModel]",[1788,1790],[2772,2774],"[authListener]"]