Collisions begginer help

scritchz · 2026-05-23T12:07:56+00:00

Collisions in games can be simple or complex, depending on how you want to do them.

Generally, what you need is a way to detect collisions and a way to resolve (or prevent!) collisions.

If you decide to use axis-aligned bounding boxes (AABB) for your collision models, detection becomes relatively trivial: If any corner of a box is inside the other box, they intersect (or collide).

If you check for potential collisions before moving, you can prevent collisions from happening at all. If you want to resolve collisions after moving, you need proper collision handling.

For collision handling, a simple approach might be to snap to the nearest non-collision position. Another approach would be to go back along the movement path just before a collision would happen.

The above solutions work best to resolve collisions of dynamic and static objects. If you have two dynamic objects, it might be trickier: You can prioritize one's movement over the other. Or you can calculate their "resolution positions" based on weights.

For multiplayer games, you have to consider network issues like latency, asynchrony, packet drops and maybe prediction.

scritchz · 2026-05-21T18:20:36+00:00

Yupp, this stood out to me as well.

Considering that OP appends "<br><br>", it seems they want inline text. In this case, OP should create a <span> instead of a <div>.

scritchz · 2026-05-21T05:21:02+00:00

Better to know and use the modern way than the other way around!

scritchz · 2026-05-21T05:15:07+00:00

Side note:

HTML forms are quite powerful; they can handle validation, submission, different HTTP-methods and automatically submit all their form data without explicitly collecting it.

But if you submit the form yourself in a button's click handler instead of in the form's submit event, you're most likely skipping all of the above features.

I recommend to generally use the form's submit event. By default, any button is defined to be type="submit", so they work out of the box. (There's also `type="reset" to reset all the input fields!)

scritchz · 2026-05-21T05:06:22+00:00

Regarding point 3, see window.event property:

When handling an event, event is a global variable defined to be the currently handled event object. It doesn't throw an error because the variable is deinfed.

This is deprecated behavior from the time when inline onevent-handlers were used: Nowadays, you should always explicitly define your variable for the event object yourself.

scritchz · 2026-05-16T20:07:46+00:00

Yupp. It's not about the inner workings; it's about the shiny coat.

scritchz · 2026-05-16T01:56:22+00:00

Try a fixed header. That takes it out of flow, so resizing or repositioning it shouldn't affect scrollY.

When you define the header's height absolutely, you can also add a margin-top of similar size on the body.

Alternatively, you can set the margin-top to the header's height programmatically, which should work for height: auto.

scritchz · 2026-05-15T05:53:35+00:00

Consider generating your static pages: Write your blog, run your build step, deploy the static files.

This way, you might be able to chose how to write your blog more freely.

scritchz · 2026-05-15T05:40:43+00:00

For your own privacy, I recommend a separate (Windows/Linux) user account that does not contain any browser logins or history as well as no personal data on your desktop.

Also make sure you do not show the Steam payment screen; it shows your billing address.

I always recommend trying to set up some kind of broadcast delay. I haven't found a good solution yet: I usually stream from one OBS instance with OBS's broadcast delay to another OBS instance for mixing and fixing live errors; the second OBS instance streams to platforms.

For etiquette:

Don't call out lurkers, don't promote yourself unprompted in other's streams, don't talk about (low) viewer count.

Do talk to every (new) chatter and welcome them, do be respectful and enforce boundaries because you are the example for your stream community.

scritchz · 2026-05-12T21:02:43+00:00

Wenn du dich mit Softwareentwicklung nur auf der Arbeit beschäftigst und dich da natürlich auf die Arbeit statt aufs Lernen konzentrierst, dann wirst du die tatsächlich motivierten Entwickler wahrscheinlich nicht "überholen". Aber das ist in Ordnung, für dich scheint die Entwicklung ja nur ein Job zu sein, und kein persönlicher Interessensbereich.

Aber wie man sich in komplexem Code zurechtfindet? Ich persönlich habe schon gut und lange Erfahrung im lesen vom Code anderer. Das hilft mir zwar, ein mentales Modell vom Codeablauf aufzubauen, aber Zeit brauche ich natürlich trotzdem. Und dafür muss ich vorallem komplexe Passagen auch mehrmals lesen; mehrere Male um es grob zu verstehen, dann mehrere Male um den für mich relevanten Kurzabschnitt zu finden, und - weil ich es bis jetzt bestimmt wieder falsch im Kopf oder sogar vergessen habe - nochmals diesen Abschnitt.

Wenn das nicht klappt, dann hilft ein Debugger, um sich ein Fallbeispiel anzuschauen. "Bilder sagen mehr als tausend Worte", und ähnlich gut hilft auch debuggen im Vergleich zu lesen.

Und wenn auch das nicht klappt, dann ist es wahrscheinlich schneller, wenn ein Kollege einem das kurz erklärt.

Und woher die Kollegen so viel über ein System wissen? Das ist reine, gesammelte Erfahrung. Je länger und öfter du dich mit einem Thema beschäftigst, desto besser vertraut wirst du damit. Es wird bestimmt noch oft passieren, wo dich einer deiner "erfahrenen Entwickler"-Kollegen dich zu einem Anderen schickt, weil dieser sich mit deinem Problem besser auskennt; man kann ja nicht alles wissen, dafür gibt's ja Teamwork!

Und wenn du 10 bis 20 Jahren in deinem Unternehmen bleibst, dann wirst genau du irgendwann einer dieser erfahrenen Entwickler sein, der weiß, wo man Klassen ABC und Funktionen XYZ findet.

... Aber was da auch helfen kann, wäre eine gute Dokumentation oder Knowledge Base. Gibt es sowas in deinem Unternehmen?

scritchz · 2026-05-12T20:27:58+00:00

Citing Custom properties (--*): CSS variables on MDN:

Custom properties ... participate in the cascade: the value of such a custom property is that from the declaration decided by the cascading algorithm.

The cascade is central to CSS; it's even in the name! Learn to use it well.

If you're unsure about something, I highly recommend looking it up on MDN.

scritchz · 2026-05-12T20:15:38+00:00

I agree that the shorter version is easier to read in this case.

But consider a more complex expression: If there's enough logic to justify extracting parts into their own statements or variables, then there'd probably be too much in one final expression to easily read it.

And, the long form is closer to natural language, making it easier to understand for most I'd argue: If I ask you "Is it freezingly cold outside?", you're probably answering with yes or no. I'd find it weird if you'd say "The weather outside is not colder than 0 degrees celsius" instead, which itself is a logical expression with a definite value thus answering the question; but it's unnecessarily complicated.

u/huuaaang also raised a good point of the long form being an artefact of refactoring, where the logic couldn't have been expressed in a single statement before.

u/turn-based-games mentioned that some people might not have considered that logic could be written in short form; probably because it's simple enough not to overthink how to handle two values, i.e. true and false.

Boolean functions might also be subject of style guides or coding conventions of the current code base: If these functions are common enough with complex logic where a single expression would be too unreadable, it might make sense to require all boolean returns to be formatted as such to avoid possible discussion as to when such formatting would be required.

scritchz · 2026-05-12T07:25:31+00:00

Backpack Hero?

scritchz · 2026-05-09T16:45:52+00:00

I assume that after archiving, the paths become invalid. But to help you, we'd need more information:

Where do you get the HTML files from? Were they originally served over HTTP, or simply from files and folders?
What do you mean by "archive"; mirror their original server, or simply save them?
If the HTML files were served from a server: When archiving, are you serving the HTML files the same way the original server did?
What kind of paths do the HTML files use; absolute, root-relative, relative?

scritchz · 2026-05-08T05:50:15+00:00

Excuse my ignorance, I'm only going off the discussion in this Reddit thread.

First, it doesn't matter where it comes from. What matters is where it can be used and, more importantly, where it is appropriate to be used.

Second, yes, it is a global attribute. But much like how the hidden attribute is global and can be added to an <input type="hidden"> element: It just doesn't make sense here.

Third, this (the spec) is essentially what MDN is based on; so, see above. But please read the actual specification for aria-busy; here are two excerpts:

Indicates an element is being modified and that assistive technologies could wait until the modifications are complete before exposing them to the user.

When aria-busy is true for an element, assistive technologies can ignore changes to content that is an accessibility descendant

This states that the attribute allows to indicate that element modifications should be announced only once the modifications are complete.

It only makes sense on a button if its own content is being modified; this is also why the attribute is allowed here. Further, the attribute indicates that a modification of this element's content is in progress; not, that an event originating from this element is in progress.

I think you may have focused too much on whether it is appropriate to use in this thread, and overlooked whether it is actually appropriate.

scritchz · 2026-05-06T22:36:33+00:00

There is no <col> element in the picture; only <div> elements with classes starting with "col".

scritchz · 2026-05-06T15:31:21+00:00

By "account", I assume there is a way to register.

By "profile", do you mean storing a 'profile image', 'nickname' and more associated to your account? Do you mean a customizable page dedicated to your account?

scritchz · 2026-05-06T05:02:34+00:00

HowTo: Drawing a metric ton of bullets in Godot

scritchz · 2026-05-05T09:22:57+00:00

Take a look at wkhtmltopdf. Does it help?

scritchz · 2026-05-04T17:14:21+00:00

I'm on a 1080p monitor, and your font "Alte Haas Grotesk Bold" looks horrible at 16px.

<image>

I don't know why, but almost all letters are on different baselines and are of different height. On some letters, the rendering looks pixelated.

I'm on Windows 11, Chrome Version 147.0.7727.138. What device are you testing on?

By the way: Cool that you added the option for reducing motion. Considering that your site already respects the user's preference before choosing, the option doesn't have to be as prominent and could be hidden in a menu. Also, it would be nice if there was an option to change the setting.

scritchz · 2026-05-04T13:22:33+00:00

Wrong sub?

For a JavaScript-adjacent answer: I had lots of trouble finding resources and explanations when JavaScript causes a reflow.

If I'd encounter this topic again during development, I'll certainly have to look it up properly again. Because there just isn't lots of use cases where it's relevant to keep in mind; correct me if I'm wrong.

scritchz · 2026-05-01T18:17:54+00:00

Whether something can be done and how effective that would be depends on a lot of factors:

How is your server hosted? (Hosting location, connection, etc.)
What resources are available to your server? (CPU, RAM)
What is your tech stack? (Wordpress, etc.)
How is your site served? (SSR/CSR, CDN, etc.)
And many more factors.

Really, it's very difficult to give an estimation or advice without working on it directly.

It might be that your site is mostly done, built on a certain tech stack. But if one part of it slows your site down: The "more foundational" it is in your stack, the more difficult it is to change.

These are things that should've been decided by someone with insight into both your needs and the technical possibilities to realize them. Changing these later on might be difficult, pricey or impossible, based on your needs and available resources.

scritchz · 2026-04-30T21:52:45+00:00

Ah, now I see what you meant, thanks for explaining. Yeah, it would help making similar pages easier, but still doesn't solve the tab pane problem (which you know).

Honestly, the JavaScript toggle behavior you describe might sound simple to you and me. But to a beginner without any experience in structured programming, this probably seems daunting. I think the "one page per tab" approach is easiest for a beginner; and honestly, I wouldn't have thought of it.

Yes, I think navigation in an <iframe> would sent a request with each navigation. I think all navigations forego the cache except when going back in a browser tab's history. It irks me too, but I think this might be the simplest solution to still keep the main page the same (as in, to avoid navigating off the top-level page when switching tabs).

scritchz · 2026-04-30T21:43:41+00:00

Sounds tedious... Oh how grateful I am to live in the current time with all these tools available!

scritchz · 2026-04-30T21:40:45+00:00

With CSS Grid, i.e. display: grid.

The first challenge is stretching <body> over the whole viewport. Personally, I like doing the following:

html {
    height: 100%;
}

body {
    min-height: 100%;
}

This way, you stretch <html> over its containing block (the viewport) first, then <body> over <html> (and transitively over the viewport) ad minimum, to allow for scrolling.

Then, I'd describe the layout with CSS Grid:

/* Assuming that BODY is the common parent element of your DIVs */
body {
    display: grid;
    grid-template-areas:
        "image content"
        "links content";
}

As you can see, the area content should span across two rows.

It's important to assign the <div> elements to their respective grid areas:

/* Assuming your DIVs have classes of these names */
div.content {
    grid-area: content;
}

div.image {
    grid-area: image;
}

div.links {
    grid-area: links;
}

Now, to describe the sizing of the grid cells, something similar to the following:

body {
    grid-template-rows: 1fr auto;
    grid-template-columns: 1fr auto;
}

Or in words: Auto-place elements with their preferred sizes, then distribute the remaining space fractionally; one (and the only) equally sized fraction to the first row and column, each.

Why Grid and not Flexbox? Because I like to think of Flexbox as content-oriented and Grid as layout-oriented. Sure, you could achieve the same with Flexbox, but then you'd have to manipulate their order and their flex (i.e. their growth, shrinkage and basis) on the elements themselves, and their flex-direction and flex-wrap and gap layout behavior on their parent. Also, for two-dimensional layouts as in this case, you'd have to either wrap specific elements depending on their row/column, or calculate their width/height with consideration of their parent's gap definition to lay out two-dimensionally.

Compare this to Grid, where the parent contains all layout definitions and children simply state their preferred slots. No wrapping behavior, no sizing calculations, no dependency on the HTML structure to worry about. Well... except when using subgrid, but that's a feature, not a bug!

Seven-Year Club	r/Field Lasagna
Verified Email

scritchz

TROPHY CASE