Coding Challenge #138: Angry Birds with Matter.js

Coding Challenge #138: Angry Birds with Matter.js

100 thoughts on “Coding Challenge #138: Angry Birds with Matter.js”

  1. You could just check the birds X if its a bit greater than the connection point of the sling (the bird is on the right) it should release. So that way it will only release if it actually moves to the right of the sling. Could also check the speed as well. Like if speed > X and x > slingshot.X + 5 fly()

  2. Could you do a video of depolying processing applications on Android? I couldn't get it to work that well unfortunately.

  3. I noticed the "rest length" really seems to be a "min length", because it pushes the object towards the length value. Obviously, that's not the desired behavior.
    It's especially noticeable at 27:01. All sorts of weird behavior because it's trying to keep the bird at least 100 units away from the pivot point.

    Was kinda surprised nobody in chat mentioned this.

  4. do you think you could make a simulation of clouds forming and raining and forming again if you know what i mean

  5. 29:49 Yeah I might, and it would be to compare the x positions of the bird and the point that spring is attached to. When bird.pos.x is higher than that attach point, it would be released. And this way bird will be faster cause you won't be wasting the energy that's left in the spring like you do with the timeout thing.

  6. I guess the proper way is to calculate the circle distance to start position and when it reaches 0 cut the line.

  7. IMO, a better approach would be to replace the setTimeout controlling the slingshot release with an if statement that checks if the bird has crossed the point on the x-axis where the slingshot is placed.

  8. Superb tutorial as always . thanks.
    The link to Matter.js was not working for me , so i used the generic URL "" .

  9. I think the best way for the bird to reach Max speed is to release after test if bird position has reached slingshot point position not just delaying it 100ms,
    PS: thx for matter.js explanation

  10. A solution to dettaching the slingshot would be comparing the circle's x (call it c) value to the slingshot's x (call it s) value. If c > s and mouseReleased, dettach the slingshot.

  11. Can you do a coding challenge where you create an interactive Rubik's cube? And possibly publish it to the Internet? Also, include a few buttons to make those moves (like an R button, L button etc.).

  12. To detach the bird at the right moment, you could also detect when the bird's x position is greater than the slingshot's x position and then when it is, trigger the detachment 🙂

  13. You should check after releasing mouse when the ball gets to its start position. In that way you will get the best results… 😀 At least i would do that…

  14. Maybe it would be better to release the bird when its distance to pointA is less than a certain number, that way the bird can get the full momentum before releasing and you don't have to time it.

  15. I just watched your particles tutorial and created a front page for my site

    my site is totally based on your teachings.
    Thanks for doing this, you're the best teacher, Love you always.

  16. what about checking the position: when the bird is on the right side of the constraint position, release the sling

  17. I got this idea and when development was finished of the angry birds game , I realised even @TheCodingTrain had the same idea a day later

  18. Mr Coding Train can you help me out here. Is there anyway possible that you can teach hacking on YouTube or does violate the terms of services or terms of use. Its for security purposes. Is it legal to teach how to hack in America? I really need to learn how to do this. If you cant teach it on YouTube then I totally understand that you can get in trouble for it.

  19. Hi! You know you can import variables like this:
    const { x, y, w, h } = this
    and then use
    rect(x, y, w, h)
    instead of having to type "this" all the time, right?
    It makes reading the code a bit easier, and it's a very handy thing to use.

    Check it out here:

  20. Hello Daniel, I have a question :
    I am 13 years old and I'm currently in 8th grade and I will be in 9th grade in April. I have opted for computer science because I love coding a lot and I want to become a software engineer when I grow up. I will be taught in school.
    So I decided to learn Java (Processing) and came across your channel. I saw that in your older videos, you taught processing but in the newer videos, you moved to p5.js and you began to do most of the Coding Challenges with p5.js.
    It made me think whether I should continue to learn Processing or move to p5.js and leave Processing.
    This is my question – Whether I continue learning Processing or turn to p5.js.
    Please answer this question as soon as possible.

  21. It's entertaining when he knew that he import the file in the wrong order and then fix it to get another error 😅

  22. Can you do the Tower of Hanoi, showing the algorithm's work every step. I would love to see this!! 🙂

  23. Sir, can you provide some ui and backed with firebase and ui with p5.js..
    suppose where menu screen need to click and go to game screen

  24. Hi Daniel. Love your videos! Thanks a lot! Right now trying to learn processing at the beginning level.
    Any chance to be teached how to make a book generator in processing like here but in 2d? I guess it should be very easy for you. I guess it's going involve some degree of math, vectors, trigonometry (soh, cah, toa, cos,sin, acos, all that stuff). ? Thanks in advance!
    Here is another example:

  25. 6:30 When he said that I imagined javascript reporting ''Error: Null Pointer Exception (I dunno what ur talkin about)"

  26. Coding challenge :

    Elastic collisions counting out PI. I tried to make this in p5, and I got it to work, but only up to 1,000,000X the mass (resulting in 3,141 collisions), but I had to make the velocity really slow,and it glitches out when there are lots of collisions. Going any higher and it just glitches so much that it misses collisions.I suspect it is because the collisions happen faster than the iteration rate of the draw function. I was wondering if you could come up with something that worked.

  27. I actually have an error. In around the minute 19:00 Dan writes code that is able to move the bird object around and toss it. This rarely works for me and it grabs the bird when the cursor isn't even on it! I think that this has to do with the scale but I can't think of anything else, if anybody who has also had this problem or have been able to do this challenge anyway, please help. Thanks

  28. i am a fan of yours you are inspired me now i teach every poor who can't afford paid course – check out my latest python course series-:Enjoy free full course of python –

  29. Hi, I really like your channel.
    It has a Brazilian youtuber that made great programming content and wanted you to see it, it also really like your channel.
    He did (and is teaching) programming bots that make video and sends it directly to YouTube. This project works by getting a word (which will be the theme of the video) and the bots go into action searching for text content and images on the internet, rendering the video with that content and sending it directly to YouTube with the tags.

    Here is the introductory video:

  30. If you attract a infinite mass with a (constant) gravitional force you get an infinite acceleration which is pretty much not what you've wanted for the 'ground' object xD

  31. 🌈🌈🌈🌈🌈🌈🌈🌈🌈🌈🌈🌈🌈🌈🌈🌈🌈🌈🌈🌈🌈🌈🌈🌈🌈🌈🌈🌈🌈

  32. 15:36 I don't know why but I had to write " this.body =, y, r/2); " dividing radius by 2. Is it possible that they updated the way matter.js works and made it the diameter input instead of radius?

  33. You are really a tallented person. Wow what a lovely youtube channel that I have ever seen. You are like a God. I respect you from the core of my heart. Keep up the Good works.

  34. help 19:00
    matter-js: MouseConstraint.create: options.mouse was undefined, options.element was undefined, may not function as expected
    i dont know why but when i type mouse: mouse it doesnt let me move the ball but i figured if i type Mouse: mouse it does but comes up with the warning above

  35. It is a very useful and entertaining video, I just missed the part where the teacher explains than you must run the code from a java server or the browser will not load the images Because the cors system. but it let me learn about Apache and tomcat, so a the end I'm thankful for that too

  36. this is why type="module" is useful, everyone is just tired over worrying over the order of scripts

  37. Hey yall, anyone know how I can prevent the user from clicking and interacting with the boxes? Awesome Tutorial Btw!

  38. My collision physics is off. things shoot out in the wrong direction with non realistic momentum.
    Has someone encountered this problem?

  39. Such a powerful editor that it can guess in advance what you're about to type as a filename because you just don't remember already adding that same file to your project a moment earlier. That made me smile. 🙂

Leave a Reply

Your email address will not be published. Required fields are marked *