Need Feedback for Personal Project

Code Feedback
1

Give project feedback for this post –

2

looks okay but the rain goes really to fast and is to static. it really doesn’t go well with the sound

3

Ya, I’m looking forward to make some changes in animation.
Do you have any suggestions for improving the animations?

4

yes slower rain and more random rain makee it looks more realistic. they had a game using the effects in the earliest of 2000 you might wanna look like into that.

5

coding train on youtube made a decent video that could get you started, it would definitely need more editing for you to use a style like that. It’s a start though, if you don’t know where to begin on animations for rain.

6

I agree with slowing the rain effect. It will give a better sensation of calmness.

7

Thanks for your valuable time.

8

Thanks a lot dear, this video may help.

9

Looks great!

One thing I would note is that by setting the background image to be:

width: 100%;
height: 100vh;

The image will be stretched on many different devices and aspect ratios. A better solution IMO would be to use a background-image on the section div. Something like:

    background-image: url(img/back.jpg);
    background-size: cover;
    background-position: center;

Also a very minor point in your JS:

      var audio, playbtn, seek_bar;
      function intitialaudioplayer() {
        audio = new Audio();
        audio.src =
          "https://firebasestorage.googleapis.com/v0/b/jovial-pen.appspot.com/o/0.mp4?alt=media&token=c56806cf-3fdb-433c-8287-8080d255209d";
        audio.loop = true;
        playbtn = document.getElementById("playpausebtn");
        // event handling
        playbtn.addEventListener("click", playPause);
        function playPause() {
          if (audio.paused) {
            audio.play();
            document.getElementById("playpausebtn").src = "img/pause.png";
          } else {
            audio.pause();
            document.getElementById("playpausebtn").src = "img/play.png";
          }
        }
      }
      window.addEventListener("load", intitialaudioplayer);

You define a variable playBtn as document.getElementById("playpausebtn")

but then in proceeding lines use document.getElementById("playpausebtn").src = "img/pause.png" and document.getElementById("playpausebtn").src = "img/play.png";

Why not use playBtn.src = "img/pause.png" and playBtn.src = "img/play.png"

1 Like
10

Hi There!
Thanks a lot for all your suggestions, I’ll apply them. I’m learning something new everyday thanks to be part of that.