2

I am trying to figure out how to make it so that my game can detect if an object is visible or not to decide if it should be able to do stuff.

I have following actions:

  • space: a trajectory line comes up that you can move up and down to set your firing path
  • alt: removes this line from the canvas

Up until this point I have just been manually coding in that if the ball lands on the ground/a platform the trajectory line is no longer present because the ball has already been fired. This has lead to many bugs, and I'd much rather just have a function that just constantly checks if there is a trajectory line object present or not to see if the ball can be fired or not.

The below code is just my attempt to test out another stack overflow answer and see if it would work for me. It didn't work, it just returns

"Uncaught TypeError: Cannot read property 'display' of undefined".

I've also seen answers that only work for "jQuery". I tested those and they didn't work. I'm not sure what "jQuery" means, but I'm pretty sure its not the type of JS I'm using.

If it helps, I'm coding this in the JS sandbox on CodeHS. Any help would be appreciated, this is my first project in JS and I'm really unfamiliar with any advanced terms.

var ball;
ball = new Circle(8);
ball.setPosition(8, 292);
ball.setColor(Color.blue);
add(ball);
if (ball.style['display'] != 'none') {
  println("visible");
} else {
  println("invisible");
}

Edit:This shows the implementation of the Circle class in codeHS https://static.codehs.com/gulp/228d7cf3bdc1b07af7f855a33227666022ce8d4b/jsdoc/chs-js-lib/graphics_circle.js.html

  • 1
    First off, I think you are mixing multiple languages in your question or you are using something other then vanilla Javascript but you didn't specify. Second, if you look at https://stackoverflow.com/questions/9279368/how-to-get-all-css-classes-of-an-element it has answers that are both jQuery and vanilla Javascript. You can use getElementById and className to get a list of classes of a given element (just a pointer in the right direction). Good luck – SteveB Feb 28 '19 at 05:04
  • Hi, thank you for responding. I'm not sure what I'd be using other than JS, when I go to create a program in the sandbox I choose JS and then "graphics". Also, I am not sure how getting the class(es) of an element would help. I thought that JS didn't use classes. Also, by a google search of what getElementById does, it seems that it only returns null if an element doesn't exist at all. My ball will still be a object that exists, it's just not visible. Also, is an element the same as an object? I tried to look that up, but nothing came up that helped. Sorry, I'm asking a lot of questions. – Armaan Banwait Feb 28 '19 at 05:25
  • Lets take it step by step: 1. `jQuery` is a library build in Javascript to ease DOM manipulation and other tasks.2. What is `Circle`? I assume its a custom class. It would help us if we can see its implementation. 3. When you say *ball is not visible*, I assume you mean its not on screen. That means, element is visible but is not in viewport. Correct me if I'm wrong. 4. You have referred other posts. It would be nice to add them to question so that we know what's not working and accordingly suggest approach/solution – Rajesh Feb 28 '19 at 06:31
  • Something to refer for point 3 in previous comment: https://stackoverflow.com/questions/123999/how-to-tell-if-a-dom-element-is-visible-in-the-current-viewport – Rajesh Feb 28 '19 at 06:32
  • @Amaan Banwait, for further help, you need to add more code. You call "new Circle" but we don't know what library it is from. Are you using Canvas, Google Maps API,... what are you add ball too when you call "add(ball)". If you don't know what jQuery means, your new to javascript so I understand you probably don't know the different libraries. Look for any ".js" files in the header of your html page, those are going to be 1) your javascript files you wrote and 2) the libraries you are using. Without more information, it is impossible to help since all we can do is guess. Good luck. – SteveB Feb 28 '19 at 14:24
  • Please include all relevant code here on Stack Overflow, not just a link to the code somewhere else. We want questions to have [mcve]s so that others don't have to hunt around other sites just to answer your question. – Heretic Monkey Feb 28 '19 at 18:31
  • My mistake, it is my first time posting here. I think I will delete that comment because it won't let me edit it. I have added it to my question. – Armaan Banwait Feb 28 '19 at 20:18

0 Answers0