dys 🐙 Comments - Answer Overflow

Once dead is true, it's only getting called once in any case. super.jump() never gets called in the child when the call returns negative in the parent. The only alternative I could see would be to throw an error since you want execution to essentially halt if dead. That, or use guard clauses like:

class Parent {
  jump() {
    if(this.dead) return
    this.lastActivityTime = Date.now()
  }

  get dead() {…}
}

class Child extends Parent {
  jump() {
    if(this.dead) return
    super.jump()
    this.speedY = 30
  }
}

class Parent {
  jump() {
    if(this.dead) return
    this.lastActivityTime = Date.now()
  }

  get dead() {…}
}

class Child extends Parent {
  jump() {
    if(this.dead) return
    super.jump()
    this.speedY = 30
  }
}

Those are just to reduce the amount of nesting though, not to reduce the number of calls.

36 replies

KPCKevin Powell - Community

•Created by snxxwyy on 12/8/2024 in #front-end

display contents use cases

I've used it when I've got my content in a <ul> for semantic reasons, and want to ignore the <li>s & display the contents in a table-like layout. It could likely be handled with subgrid now, but that's a relatively recent addition.

19 replies

KPCKevin Powell - Community

•Created by Zach on 11/23/2024 in #resources

SVG Favicon Generator

Recraft is an AI that outputs SVGs, & can be instructed to do simple logos.

2 replies

KPCKevin Powell - Community

•Created by snxxwyy on 11/13/2024 in #front-end

@media | print, screen & only

I did a reasonably complex print stylesheet for my online résume that let me generate a pretty enough PDF that I could send it to potential clients replete with hyperlinks back to more detail on items on my site.

60 replies

KPCKevin Powell - Community

•Created by fatihinn on 11/6/2024 in #front-end

Routes Route and render={(props) => ()} using

This is react-router? You might look at Tanstack Router for a more recent offering.

2 replies

KPCKevin Powell - Community

•Created by Dev_HK on 11/5/2024 in #front-end

issues with svg being resized based on their parent flexbox

If it's a site built using Vite, you can add the ?raw suffix, like import Image from '$assets/image.svg?raw, and you can insert it into the page without having to edit it.

20 replies

KPCKevin Powell - Community

•Created by Faker on 11/4/2024 in #front-end

Understanding the "this" keyword for objects in JavaScript

Yeah, anything that is within scope, local or global, is in the current context.

10 replies

KPCKevin Powell - Community

•Created by Faker on 11/4/2024 in #front-end

Understanding the "this" keyword for objects in JavaScript

The "context" is the variables that are in scope at any point in time.

10 replies

KPCKevin Powell - Community

•Created by Rio200 on 11/5/2024 in #front-end

Huge table excel into html

Maybe dump them to CSV, & use a component that converts CSV to a table?

10 replies

KPCKevin Powell - Community

•Created by empty on 11/5/2024 in #front-end

how to select the last div that has class 'visible' in a container using CSS selector?

.visible:last-of-type.

9 replies

KPCKevin Powell - Community

•Created by Faker on 11/4/2024 in #front-end

Understanding the "this" keyword for objects in JavaScript

If you just wrote name[0], it would look for name in the current context, which doesn't include the other members of the object, so name would be undefined. Why doesn't the current context include the other members of an object? Well, one situation that comes to mind is initialization:

class Testing {
  varA = 'test'

  constructor(varA, varB) {
    this.varA = varA
    this.varB = varB
  }
}

class Testing {
  varA = 'test'

  constructor(varA, varB) {
    this.varA = varA
    this.varB = varB
  }
}

If the varA member were visible in the constructor scope, it would be "shadowed" (i.e. overwritten) by the varA argument to the constructor. Just in general, if all the members of an object were inserted into the namespace of the methods in that object you'd run the risk of altering the behavior of a method unexpectedly when you define a new property. Using this makes it explicit. You could also write person.name[0] in this situation. Also, as a point of syntax, you would usually write member functions as bio() {…} rather than bio: function() {…}.

10 replies

KPCKevin Powell - Community

•Created by vince on 10/21/2024 in #back-end

How to build this db model

Well, probably /count since slash commands are listed by the system & autocomplete.

17 replies

KPCKevin Powell - Community

•Created by Justine on 10/29/2024 in #front-end

api is not working on live site

You see on the second line where you're setting the CORS origins? Add your Render server there.

13 replies

KPCKevin Powell - Community

•Created by Justine on 10/29/2024 in #front-end

api is not working on live site

ngrok will allow you to tunnel a port on localhost out to the public Internet. It's not hard for an experienced dev to operate, but it sounds like you might be less experienced. In the long term you need your API server to be running on a machine outside of your LAN. If you're using Next.js for your API server, it will be running on whatever hostname Vercel gives you. Connect to that host rather than localhost. Without knowing more about your architecture, it's difficult to diagnose this & give suggestions.

13 replies

KPCKevin Powell - Community

•Created by dys 🐙 on 10/30/2024 in #front-end

How to link to an external CSS style in SVG?

The @import works.

7 replies

KPCKevin Powell - Community

•Created by dys 🐙 on 10/30/2024 in #front-end

How to link to an external CSS style in SVG?

Where? I tried it in the <link/> as xmlns & in the <svg/> as xmlns:html.

7 replies

KPCKevin Powell - Community

•Created by Abulkalam on 10/24/2024 in #front-end

Animate SVG

If I were doing this, I'd put your shape in the <defs> section then <use/> it twice, once in white, and once in blue. Then, I'd create a <clipPath> using a <circle> with the r attribute animated on hover with a SMIL <animate/> tag and filter one of the <use/>s with it like:

<circle cx="0" cy="100%" r="0">
  <animate
    attributeName="r"
    from="0"
    to="100%"
    dur="3s"
    fill="freeze"
    begin="mouseover"
    end="mouseout"
    repeatCount="1"
  />
</circle>

<circle cx="0" cy="100%" r="0">
  <animate
    attributeName="r"
    from="0"
    to="100%"
    dur="3s"
    fill="freeze"
    begin="mouseover"
    end="mouseout"
    repeatCount="1"
  />
</circle>

Bear in mind that mouse interactions only work when the <svg> is inline or included using the <object/> tag. When <img/> is used, no mouse interactions are processed.

7 replies

Gaming

Programming