mirror of
https://github.com/Terncode/pixel.horse.git
synced 2026-09-25 06:05:52 +02:00
Archive commit
This commit is contained in:
Erik McClure
@@ -0,0 +1,189 @@
|
||||
import { compareCanvases, loadSprites, loadImageAsCanvas, clearCompareResults } from '../lib';
|
||||
import * as path from 'path';
|
||||
import { SpriteBatch, MessageType, PaletteSpriteBatch } from '../../common/interfaces';
|
||||
import { rect } from '../../common/rect';
|
||||
import {
|
||||
drawBaloon, drawNamePlate, drawPixelText, drawOutline, drawBounds, createCommonPalettes, DrawNameFlags
|
||||
} from '../../graphics/graphicsUtils';
|
||||
import { drawCanvas } from '../../graphics/contextSpriteBatch';
|
||||
import { ORANGE } from '../../common/colors';
|
||||
import { entity } from '../mocks';
|
||||
import { pathTo } from '../../server/paths';
|
||||
import { paletteSpriteSheet } from '../../generated/sprites';
|
||||
import { mockPaletteManager } from '../../common/ponyInfo';
|
||||
|
||||
const baseFilePath = pathTo('src', 'tests', 'graphics');
|
||||
const palettes = createCommonPalettes(mockPaletteManager);
|
||||
const created = Date.now();
|
||||
|
||||
function test(file: string, draw: (batch: SpriteBatch & PaletteSpriteBatch) => void) {
|
||||
return () => {
|
||||
const filePath = path.join(baseFilePath, file);
|
||||
const expected = loadImageAsCanvas(filePath);
|
||||
const actual = drawCanvas(100, 50, paletteSpriteSheet, undefined, draw);
|
||||
compareCanvases(expected, actual, filePath, 'graphics');
|
||||
};
|
||||
}
|
||||
|
||||
describe('graphicsUtils', () => {
|
||||
before(loadSprites);
|
||||
before(() => clearCompareResults('graphics'));
|
||||
|
||||
describe('drawBaloon()', () => {
|
||||
it('draws regular text', test('hello.png', batch => {
|
||||
drawBaloon(batch, { message: 'hello', created }, 50, 25, rect(0, 0, 100, 100), palettes);
|
||||
}));
|
||||
|
||||
it('draws regular text with emoji', test('hello-apple.png', batch => {
|
||||
drawBaloon(batch, { message: 'hello 🍎', created }, 50, 25, rect(0, 0, 100, 100), palettes);
|
||||
}));
|
||||
|
||||
it('draws text with new lines', test('newline.png', batch => {
|
||||
drawBaloon(batch, { message: 'hello\nworld!', created }, 50, 25, rect(0, 0, 100, 100), palettes);
|
||||
}));
|
||||
|
||||
it('does not draw if outside bounds', test('outside.png', batch => {
|
||||
drawBaloon(batch, { message: 'cant see me', created }, 50, 25, rect(0, 0, 10, 10), palettes);
|
||||
}));
|
||||
|
||||
it('draws party message', test('party.png', batch => {
|
||||
drawBaloon(batch, { message: 'party', type: MessageType.Party, created }, 50, 25, rect(0, 0, 100, 100), palettes);
|
||||
}));
|
||||
|
||||
it('draws moderator message', test('mod.png', batch => {
|
||||
drawBaloon(batch, { message: 'moderator', type: MessageType.Mod, created }, 50, 25, rect(0, 0, 100, 100), palettes);
|
||||
}));
|
||||
|
||||
it('draws admin message', test('admin.png', batch => {
|
||||
drawBaloon(batch, { message: 'admin', type: MessageType.Admin, created }, 50, 25, rect(0, 0, 100, 100), palettes);
|
||||
}));
|
||||
|
||||
it('draws supporter1 message', test('sup1.png', batch => {
|
||||
drawBaloon(batch, { message: 'supporter 1', type: MessageType.Supporter1, created }, 50, 25, rect(0, 0, 100, 100), palettes);
|
||||
}));
|
||||
|
||||
it('draws supporter2 message', test('sup2.png', batch => {
|
||||
drawBaloon(batch, { message: 'supporter 2', type: MessageType.Supporter2, created }, 50, 25, rect(0, 0, 100, 100), palettes);
|
||||
}));
|
||||
|
||||
it('draws supporter3 message', test('sup3.png', batch => {
|
||||
drawBaloon(batch, { message: 'supporter 3', type: MessageType.Supporter3, created }, 50, 25, rect(0, 0, 100, 100), palettes);
|
||||
}));
|
||||
|
||||
it('draws announcement message', test('announcement.png', batch => {
|
||||
drawBaloon(
|
||||
batch, { message: 'announcement', type: MessageType.Announcement, created }, 50, 25, rect(0, 0, 100, 100), palettes);
|
||||
}));
|
||||
|
||||
it('draws party announcement message', test('party-announcement.png', batch => {
|
||||
drawBaloon(
|
||||
batch, { message: 'announcement', type: MessageType.PartyAnnouncement, created }, 50, 25, rect(0, 0, 100, 100), palettes);
|
||||
}));
|
||||
|
||||
it('draws system message', test('system.png', batch => {
|
||||
drawBaloon(batch, { message: 'system', type: MessageType.System, created }, 50, 25, rect(0, 0, 100, 100), palettes);
|
||||
}));
|
||||
|
||||
it('draws thinking bubble', test('thinking.png', batch => {
|
||||
drawBaloon(batch, { message: 'thinking...', type: MessageType.Thinking, created }, 50, 25, rect(0, 0, 100, 100), palettes);
|
||||
}));
|
||||
|
||||
it('draws party thinking bubble', test('party-thinking.png', batch => {
|
||||
drawBaloon(
|
||||
batch, { message: 'party thinking...', type: MessageType.PartyThinking, created }, 50, 25, rect(0, 0, 100, 100), palettes);
|
||||
}));
|
||||
|
||||
it('fades in text bubble (time: 10)', test('fade-in-0.png', batch => {
|
||||
drawBaloon(batch, { message: 'fade', timer: 10, total: 10, created }, 50, 25, rect(0, 0, 100, 100), palettes);
|
||||
}));
|
||||
|
||||
it('fades in text bubble (time: 9.95)', test('fade-in-1.png', batch => {
|
||||
drawBaloon(batch, { message: 'fade', timer: 9.95, total: 10, created }, 50, 25, rect(0, 0, 100, 100), palettes);
|
||||
}));
|
||||
|
||||
it('fades in text bubble (time: 9.7)', test('fade-in-2.png', batch => {
|
||||
drawBaloon(batch, { message: 'fade', timer: 9.7, total: 10, created }, 50, 25, rect(0, 0, 100, 100), palettes);
|
||||
}));
|
||||
|
||||
it('fades out text bubble (time: 0)', test('fade-out-0.png', batch => {
|
||||
drawBaloon(batch, { message: 'fade', timer: 0, total: 10, created }, 50, 25, rect(0, 0, 100, 100), palettes);
|
||||
}));
|
||||
|
||||
it('fades out text bubble (time: 0.05)', test('fade-out-1.png', batch => {
|
||||
drawBaloon(batch, { message: 'fade', timer: 0.05, total: 10, created }, 50, 25, rect(0, 0, 100, 100), palettes);
|
||||
}));
|
||||
|
||||
it('fades out text bubble (time: 0.3)', test('fade-out-2.png', batch => {
|
||||
drawBaloon(batch, { message: 'fade', timer: 0.3, total: 10, created }, 50, 25, rect(0, 0, 100, 100), palettes);
|
||||
}));
|
||||
|
||||
const chatTypes: [string, MessageType][] = [
|
||||
['chat', MessageType.Chat],
|
||||
['think', MessageType.Thinking],
|
||||
];
|
||||
|
||||
chatTypes.forEach(([name, type]) => {
|
||||
it(`breaks words on small screen (${name})`, test(`break-${name}.png`, batch => {
|
||||
drawBaloon(batch, { message: 'too long to fit in one line', type, created }, 50, 25, rect(0, 0, 100, 100), palettes);
|
||||
}));
|
||||
|
||||
it(`moves ballon right to fit on screen (${name})`, test(`move-right-${name}.png`, batch => {
|
||||
drawBaloon(batch, { message: 'too long to fit', type, created }, 25, 25, rect(0, 0, 100, 100), palettes);
|
||||
}));
|
||||
|
||||
it(`moves ballon left to fit on screen (${name})`, test(`move-left-${name}.png`, batch => {
|
||||
drawBaloon(batch, { message: 'too long to fit', type, created }, 75, 25, rect(0, 0, 100, 100), palettes);
|
||||
}));
|
||||
|
||||
it(`does not move baloon originating from outside bounds (${name})`, test(`outside-${name}.png`, batch => {
|
||||
drawBaloon(batch, { message: 'too long to fit', type, created }, -25, 25, rect(0, 0, 100, 100), palettes);
|
||||
}));
|
||||
|
||||
it(`adjusts nipple when moving baloon (${name})`, test(`move-right-nipple-${name}.png`, batch => {
|
||||
drawBaloon(batch, { message: 'too long to fit', type, created }, 1, 25, rect(0, 0, 100, 100), palettes);
|
||||
}));
|
||||
});
|
||||
});
|
||||
|
||||
describe('drawBounds()', () => {
|
||||
it('draws bounds', test('bounds.png', batch => {
|
||||
drawBounds(batch, entity(0, 0.1, 0.2), rect(5, 6, 25, 20), ORANGE);
|
||||
}));
|
||||
|
||||
it('draws nothing if rect is missing', test('bounds-none.png', batch => {
|
||||
drawBounds(batch, entity(0, 0.1, 0.2), undefined, ORANGE);
|
||||
}));
|
||||
});
|
||||
|
||||
describe('drawOutline()', () => {
|
||||
it('draws outline', test('outline.png', batch => {
|
||||
drawOutline(batch, ORANGE, 10, 15, 30, 20);
|
||||
}));
|
||||
});
|
||||
|
||||
describe('drawNamePlate()', () => {
|
||||
it('draws name', test('name.png', batch => {
|
||||
drawNamePlate(batch, 'name', 50, 25, DrawNameFlags.None, palettes, undefined);
|
||||
}));
|
||||
|
||||
it('draws name with emoji', test('name-apple.png', batch => {
|
||||
drawNamePlate(batch, 'name 🍎', 50, 25, DrawNameFlags.None, palettes, undefined);
|
||||
}));
|
||||
|
||||
it('draws party member name', test('name-party.png', batch => {
|
||||
drawNamePlate(batch, 'party', 50, 25, DrawNameFlags.Party, palettes, undefined);
|
||||
}));
|
||||
|
||||
const tags = ['mod', 'dev', 'sup1', 'sup2', 'sup3'];
|
||||
|
||||
tags.forEach(tag => it(`draws name with ${tag} tag`, test(`name-${tag}.png`, batch => {
|
||||
drawNamePlate(batch, `A ${tag}`, 50, 25, DrawNameFlags.None, palettes, tag);
|
||||
})));
|
||||
});
|
||||
|
||||
describe('drawPixelText()', () => {
|
||||
it('draws numbers', test('pixel-numbers.png', batch => {
|
||||
drawPixelText(batch, 20, 20, 0x20B2AAff, '0 123456789X');
|
||||
}));
|
||||
});
|
||||
});
|
||||
Reference in New Issue
Block a user