Wowser Format
Format classes to work with common data files used in World of Warcraft.
Usage
To install Wowser Format:
npm install @wowserhq/formatWowser Format has a single dependency: it uses @wowserhq/io to handle format IO like reads and
writes. There is no use of native modules. All format classes work with modern browsers and Node.js.
Format classes in Wowser Format align with major format types used in World of Warcraft:
| Format | Format Classes | Description |
|---|---|---|
| BLP |
Blp, BlpImage
|
Standard image format for textures, icons, and other image data |
Format classes aligned with other major format types will be landing in Wowser Format in the near future.
BLP
Wowser Format supports loading and converting image data contained in BLP files, and saving new BLP files. Specific BLP color format support is as follows:
| BLP Color Format | Loading / Converting | Saving |
|---|---|---|
| Palette | ✔ | ✗ |
| DXT | ✔ | ✗ |
| Raw | ✔ | ✔ |
| JPEG | ✗ | ✗ |
Rendering a BLP in a <canvas> element
import { Blp, BLP_IMAGE_FORMAT } from '@wowserhq/format';
const loadBlp = async (url) => {
const response = await fetch(url);
if (!response.ok) {
throw new Error(`Failed to fetch BLP: Error ${response.status}`);
}
const data = await response.arrayBuffer();
const blp = new Blp().load(data);
// <canvas> elements use image data stored in [r, g, b, a] byte order. Per standard naming
// conventions, the BLP_IMAGE_FORMAT enum references formats in highest-to-lowest order on
// little-endian systems. As a result, IMAGE_ABGR8888 is the appropriate image format for use
// with ImageData and <canvas> elements.
const image = blp.getImage(0, BLP_IMAGE_FORMAT.IMAGE_ABGR8888);
const imageData = new ImageData(new Uint8ClampedArray(image.data), image.width, image.height);
return imageData;
};
const imageData = await loadBlp('url-of-blp-here');
const canvas = document.createElement('canvas');
canvas.width = image.width;
canvas.height = image.height;
const context = canvas.getContext('2d');
context.putImageData(imageData, 0, 0);Saving a new BLP
import { Blp, BlpImage, BLP_COLOR_FORMAT, BLP_IMAGE_FORMAT } from '@wowserhq/format';
const canvas = document.getElementById('canvas');
const context = canvas.getContext('2d');
const imageData = context.getImageData(0, 0, canvas.width, canvas.height);
const blpImage = new BlpImage(
imageData.width,
imageData.height,
new Uint8Array(imageData.data),
BLP_IMAGE_FORMAT.IMAGE_ABGR8888
);
const blp = new Blp();
blp.setImage(blpImage, BLP_COLOR_FORMAT.COLOR_RAW, true);
blp.save('./new.blp');License
Except where otherwise noted, Wowser Format is copyright © 2023 Wowser Contributors. It is licensed
under the MIT license. See LICENSE for more information.