mascully/improcket
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Render planets in higher quality when zoomed in

Browse source
This commit is contained in:
asraelite 2024-05-13 19:34:23 +02:00 • committed by Markus Scully
parent bf696695ee
commit 43a6ae8d60
4 changed files with 40 additions and 17 deletions
Download patch file Download diff file Expand all files Collapse all files

3
src/consts.ts
View file

@ -39,4 +39,5 @@ export const ENTITY_SPAWN_RATE = 8;
export const MIN_CELESTIAL_SPACING = 15;
export const FUEL_CAN_AMOUNT = 10000;
export const PLANET_IMAGE_SIZE = 250;
export const PLANET_IMAGE_SIZE_SMALL = 256;
export const PLANET_IMAGE_SIZE_LARGE = 1024;

9
src/graphics/world.ts
View file

@ -3,6 +3,7 @@ import * as graphics from './index';
import { images as assets } from '../assets';
import * as world from '../world/index';
import { state } from '../game/index';
import Celestial from '../world/celestial';
export function render() {
for (const particle of world.particles) renderParticle(particle);
@ -78,9 +79,11 @@ const celestialImages = {
green: Object.values(assets.celestials.green)
};
function renderCelestial(cel) {
context.drawImage(cel.image, cel.x, cel.y,
cel.diameter, cel.diameter);
function renderCelestial(celestial: Celestial) {
const isClose = graphics.perspective.currentZoom > 5;
const image = isClose ? celestial.imageLarge : celestial.imageSmall;
context.drawImage(image, celestial.x, celestial.y,
celestial.diameter, celestial.diameter);
}
function renderTracer(tracer) {

9
src/world/body.ts
View file

@ -1,6 +1,15 @@
import {GRAVITATIONAL_CONSTANT as G, TAU} from '../consts';
export default class Body {
x: number;
y: number;
r: number;
xvel: number;
yvel: number;
rvel: number;
rfriction: number;
mass: number;
constructor(x, y, mass) {
this.x = x;
this.y = y;

36
src/world/celestial.ts
View file

@ -1,9 +1,14 @@
import {tempCanvas, tempContext} from '../graphics/index';
import {images as assets} from '../assets';
import { tempCanvas, tempContext } from '../graphics/index';
import { images as assets } from '../assets';
import Body from './body';
import { PLANET_IMAGE_SIZE } from '../consts';
import { PLANET_IMAGE_SIZE_SMALL, PLANET_IMAGE_SIZE_LARGE } from '../consts';
export default class Celestial extends Body {
radius: number;
imageSmall: CanvasImageSource;
imageLarge: CanvasImageSource;
type: string;
constructor(x, y, radius, {
density = 1,
type = 'rock'
@ -15,12 +20,21 @@ export default class Celestial extends Body {
this.type = type;
const imageArr = Object.values(assets.celestials[this.type]);
const svgImage = imageArr[Math.random() * imageArr.length | 0];
tempCanvas.width = PLANET_IMAGE_SIZE;
tempCanvas.height = PLANET_IMAGE_SIZE;
tempContext.clearRect(0, 0, PLANET_IMAGE_SIZE, PLANET_IMAGE_SIZE);
tempContext.drawImage(svgImage, 0, 0, PLANET_IMAGE_SIZE, PLANET_IMAGE_SIZE);
this.image = new Image();
this.image.src = tempCanvas.toDataURL();
tempCanvas.width = PLANET_IMAGE_SIZE_SMALL;
tempCanvas.height = PLANET_IMAGE_SIZE_SMALL;
tempContext.clearRect(0, 0, PLANET_IMAGE_SIZE_SMALL, PLANET_IMAGE_SIZE_SMALL);
tempContext.drawImage(svgImage, 0, 0, PLANET_IMAGE_SIZE_SMALL, PLANET_IMAGE_SIZE_SMALL);
this.imageSmall = new Image();
this.imageSmall.src = tempCanvas.toDataURL();
tempCanvas.width = PLANET_IMAGE_SIZE_LARGE;
tempCanvas.height = PLANET_IMAGE_SIZE_LARGE;
tempContext.clearRect(0, 0, PLANET_IMAGE_SIZE_LARGE, PLANET_IMAGE_SIZE_LARGE);
tempContext.drawImage(svgImage, 0, 0, PLANET_IMAGE_SIZE_LARGE, PLANET_IMAGE_SIZE_LARGE);
this.imageLarge = new Image();
this.imageLarge.src = tempCanvas.toDataURL();
// this.image = tempContext.getImageData(0, 0, PLANET_IMAGE_SIZE, PLANET_IMAGE_SIZE);
}
@ -28,10 +42,6 @@ export default class Celestial extends Body {
return [this.x + this.radius, this.y + this.radius];
}
get escapeVelocity() {
}
tick(delta: number) {
}