mirror of
https://github.com/gosticks/DefinitelyTyped.git
synced 2026-08-12 21:10:23 +00:00
Merge pull request #5962 from bdrupieski/add-obeliskjs
add type file and tests for obelisk.js
This commit is contained in:
Masahiro Wakame
@@ -0,0 +1,148 @@
|
||||
/// <reference path="obelisk.js.d.ts"/>
|
||||
|
||||
function test_brick() {
|
||||
var canvas = <HTMLCanvasElement>document.getElementById('canvas-demo');
|
||||
|
||||
var point = new obelisk.Point(500, 20);
|
||||
var pixelView = new obelisk.PixelView(canvas, point);
|
||||
|
||||
var color = new obelisk.SideColor().getByInnerColor(obelisk.ColorPattern.PINK);
|
||||
var dimension = new obelisk.BrickDimension(300, 400);
|
||||
var brick = new obelisk.Brick(dimension, color);
|
||||
|
||||
pixelView.renderObject(brick);
|
||||
var p3D = new obelisk.Point3D(20, 20, 0);
|
||||
pixelView.renderObject(brick, p3D);
|
||||
}
|
||||
|
||||
function test_cube() {
|
||||
var canvas = <HTMLCanvasElement>document.getElementById('canvas-demo');
|
||||
|
||||
var point = new obelisk.Point(500, 240);
|
||||
var pixelView = new obelisk.PixelView(canvas, point);
|
||||
|
||||
var dimension = new obelisk.CubeDimension(120, 200, 60);
|
||||
var color = new obelisk.CubeColor().getByHorizontalColor(obelisk.ColorPattern.GRAY);
|
||||
var cube = new obelisk.Cube(dimension, color, false);
|
||||
pixelView.renderObject(cube);
|
||||
}
|
||||
|
||||
function test_pyramid() {
|
||||
var canvas = <HTMLCanvasElement>document.getElementById('canvas-demo');
|
||||
|
||||
var point = new obelisk.Point(500, 240);
|
||||
var pixelView = new obelisk.PixelView(canvas, point);
|
||||
|
||||
var dimension = new obelisk.PyramidDimension(120);
|
||||
var color = new obelisk.PyramidColor().getByRightColor(obelisk.ColorPattern.YELLOW);
|
||||
var pyramid = new obelisk.Pyramid(dimension, color);
|
||||
pixelView.renderObject(pyramid);
|
||||
}
|
||||
|
||||
function test_side() {
|
||||
var canvas = <HTMLCanvasElement>document.getElementById('canvas-demo');
|
||||
|
||||
var point = new obelisk.Point(500, 200);
|
||||
var pixelView = new obelisk.PixelView(canvas, point);
|
||||
|
||||
var colorX = new obelisk.SideColor().getByInnerColor(obelisk.ColorPattern.PINK);
|
||||
var colorY = new obelisk.SideColor().getByInnerColor(obelisk.ColorPattern.GRASS_GREEN);
|
||||
var dimensionX = new obelisk.SideXDimension(300, 100);
|
||||
var dimensionY = new obelisk.SideYDimension(300, 100);
|
||||
var sideX = new obelisk.SideX(dimensionX, colorX);
|
||||
var sideY = new obelisk.SideY(dimensionY, colorY);
|
||||
|
||||
pixelView.renderObject(sideX);
|
||||
|
||||
var p3DY = new obelisk.Point3D(0, 30, 0);
|
||||
pixelView.renderObject(sideY, p3DY);
|
||||
}
|
||||
|
||||
function test_slope() {
|
||||
var canvas = <HTMLCanvasElement>document.getElementById('canvas-demo');
|
||||
|
||||
var point = new obelisk.Point(550, 50);
|
||||
var pixelView = new obelisk.PixelView(canvas, point);
|
||||
|
||||
var colorBrick = new obelisk.SideColor().getByInnerColor(obelisk.ColorPattern.GRAY);
|
||||
var dimension = new obelisk.BrickDimension(150, 400);
|
||||
var brick = new obelisk.Brick(dimension, colorBrick);
|
||||
|
||||
pixelView.renderObject(brick);
|
||||
|
||||
var color = new obelisk.SlopeColor().getByHorizontalColor(obelisk.ColorPattern.GRAY);
|
||||
|
||||
var dimensionNorth = new obelisk.SlopeDimension(50, 40);
|
||||
var dimensionEast = new obelisk.SlopeDimension(40, 50);
|
||||
var dimensionSouth = new obelisk.SlopeDimension(50, 40);
|
||||
var dimensionWest = new obelisk.SlopeDimension(40, 50);
|
||||
|
||||
var slopeNorth = new obelisk.SlopeNorth(dimensionNorth, color, false);
|
||||
var slopeEast = new obelisk.SlopeEast(dimensionEast, color);
|
||||
var slopeSouth = new obelisk.SlopeSouth(dimensionSouth, color);
|
||||
var slopeWest = new obelisk.SlopeWest(dimensionWest, color);
|
||||
|
||||
var p3dNorth = new obelisk.Point3D(50, 50, 0);
|
||||
var p3dEast = new obelisk.Point3D(50, 200, 0);
|
||||
var p3dSouth = new obelisk.Point3D(50, 125, 0);
|
||||
var p3dWest = new obelisk.Point3D(50, 275, 0);
|
||||
|
||||
pixelView.renderObject(slopeNorth, p3dNorth);
|
||||
pixelView.renderObject(slopeSouth, p3dSouth);
|
||||
pixelView.renderObject(slopeEast, p3dEast);
|
||||
pixelView.renderObject(slopeWest, p3dWest);
|
||||
|
||||
pixelView.clear();
|
||||
}
|
||||
|
||||
function test_gif_rendering() {
|
||||
var WIDTH = 64;
|
||||
var HEIGHT = 28;
|
||||
|
||||
var img = <HTMLCanvasElement>document.getElementById('animation');
|
||||
var ctx = <CanvasRenderingContext2D>document.createElement('canvas').getContext("2d");
|
||||
var canvas = <HTMLCanvasElement>document.getElementById('canvas-uncle');
|
||||
|
||||
var stack: any[] = [];
|
||||
var size = 8;
|
||||
var point = new obelisk.Point(50, 120);
|
||||
var pixelView = new obelisk.PixelView(canvas, point);
|
||||
|
||||
function draw() {
|
||||
ctx.drawImage(img, 0, 0, WIDTH, HEIGHT);
|
||||
var imgData = ctx.getImageData(0, 0, WIDTH, HEIGHT);
|
||||
pixelView.clear();
|
||||
for (var y = HEIGHT - 1; y >= 0; y--) {
|
||||
for (var x = 0; x < WIDTH - 1; x++) {
|
||||
var pixelColor = obelisk.CanvasTool.getPixel(imgData, x, y);
|
||||
if (pixelColor !== 0xFFFFFF) {
|
||||
var cube: obelisk.Cube;
|
||||
var flag = false;
|
||||
for (var i in stack) {
|
||||
if (stack[i][1] === pixelColor) {
|
||||
cube = stack[i][0];
|
||||
flag = true;
|
||||
break;
|
||||
}
|
||||
}
|
||||
if (!flag) {
|
||||
var fixedColor = obelisk.ColorGeom.applyBrightness(pixelColor, 50);
|
||||
var color = new obelisk.CubeColor().getByHorizontalColor(fixedColor);
|
||||
var dimension = new obelisk.CubeDimension(size, size + 2, size);
|
||||
cube = new obelisk.Cube(dimension, color, false);
|
||||
stack.push([cube, pixelColor]);
|
||||
}
|
||||
var p3d = new obelisk.Point3D(x * (size - 2), 0, (HEIGHT - 1 - y) * (size));
|
||||
pixelView.renderObject(cube, p3d);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
window.setInterval(draw, 50);
|
||||
|
||||
var canvasFloor = <HTMLCanvasElement>document.getElementById('canvas-floor');
|
||||
var pixelViewFloor = new obelisk.PixelView(canvasFloor, point);
|
||||
var floorDimension = new obelisk.CubeDimension((size - 2) * (WIDTH + 2), (size - 2) * 9, size);
|
||||
var floor = new obelisk.Cube(floorDimension, new obelisk.CubeColor(), false);
|
||||
pixelViewFloor.renderObject(floor, new obelisk.Point3D(-20, -30, 0));
|
||||
}
|
||||
Vendored
+228
@@ -0,0 +1,228 @@
|
||||
// Type definitions for obelisk.js v1.1.0
|
||||
// Project: https://github.com/nosir/obelisk.js/
|
||||
// Definitions by: Brian Drupieski <https://github.com/bdrupieski/>
|
||||
// Definitions: https://github.com/borisyankov/DefinitelyTyped
|
||||
|
||||
declare module obelisk {
|
||||
|
||||
export var version: string;
|
||||
export var author: string;
|
||||
|
||||
export class Matrix {
|
||||
constructor(a?: number, b?: number, c?: number, d?: number, tx?: number, ty?: number);
|
||||
|
||||
a: number;
|
||||
b: number;
|
||||
c: number;
|
||||
d: number;
|
||||
tx: number;
|
||||
ty: number;
|
||||
}
|
||||
|
||||
export class Point {
|
||||
constructor(x?: number, y?: number);
|
||||
|
||||
x: number;
|
||||
y: number;
|
||||
}
|
||||
|
||||
export class Point3D {
|
||||
constructor(x?: number, y?: number, z?: number);
|
||||
|
||||
x: number;
|
||||
y: number;
|
||||
z: number;
|
||||
|
||||
toGlobalCoordinates(offset?: obelisk.Point): obelisk.Point;
|
||||
}
|
||||
|
||||
export class ColorGeom {
|
||||
static get32(color: number): number;
|
||||
static applyBrightness(color: number, brightness: number, highlight?: boolean): number;
|
||||
}
|
||||
|
||||
export class ColorPattern {
|
||||
static GRASS_GREEN: number;
|
||||
static YELLOW: number;
|
||||
static WINE_RED: number;
|
||||
static PINK: number;
|
||||
static PURPLE: number;
|
||||
static BLUE: number;
|
||||
static GRAY: number;
|
||||
static BLACK: number;
|
||||
static FINE_COLORS: number[];
|
||||
|
||||
static getRandomComfortableColor(): number;
|
||||
}
|
||||
|
||||
export class CanvasTool {
|
||||
static getPixel(imageData: ImageData, x: number, y: number): number;
|
||||
}
|
||||
|
||||
export class CanvasManager {
|
||||
static defaultCanvas: HTMLCanvasElement;
|
||||
|
||||
static getDefaultCanvas(): HTMLCanvasElement;
|
||||
static getNewCanvas(): HTMLCanvasElement;
|
||||
}
|
||||
|
||||
export class AbstractColor {
|
||||
constructor();
|
||||
|
||||
inner: number;
|
||||
border: number;
|
||||
borderHighlight: number;
|
||||
left: number;
|
||||
right: number;
|
||||
horizontal: number;
|
||||
leftSlope: number;
|
||||
rightSlope: number;
|
||||
}
|
||||
|
||||
export class CubeColor extends AbstractColor {
|
||||
constructor(border?: number, borderHighlight?: number, left?: number, right?: number, horizontal?: number);
|
||||
|
||||
BRIGHTNESS_GAIN: number;
|
||||
|
||||
getByHorizontalColor(horizontal: number): CubeColor;
|
||||
}
|
||||
|
||||
export class PyramidColor extends AbstractColor {
|
||||
constructor(border?: number, borderHighlight?: number, left?: number, right?: number);
|
||||
|
||||
BRIGHTNESS_GAIN: number;
|
||||
|
||||
getByRightColor(horizontal: number): PyramidColor;
|
||||
}
|
||||
|
||||
export class SideColor extends AbstractColor {
|
||||
constructor(border?: number, inner?: number);
|
||||
|
||||
BRIGHTNESS_GAIN: number;
|
||||
|
||||
getByInnerColor(inner: number): SideColor;
|
||||
}
|
||||
|
||||
export class SlopeColor extends AbstractColor {
|
||||
constructor(border?: number, borderHighlight?: number, left?: number, right?: number, leftSlope?: number, rightSlope?: number);
|
||||
|
||||
BRIGHTNESS_GAIN: number;
|
||||
|
||||
getByHorizontalColor(horizontal: number): SlopeColor;
|
||||
}
|
||||
|
||||
export class AbstractDimension {
|
||||
constructor();
|
||||
|
||||
xAxis: number;
|
||||
yAxis: number;
|
||||
zAxis: number;
|
||||
tall: boolean;
|
||||
}
|
||||
|
||||
export class BrickDimension extends AbstractDimension {
|
||||
constructor(xAxis?: number, yAxis?: number);
|
||||
}
|
||||
|
||||
export class CubeDimension extends AbstractDimension {
|
||||
constructor(xAxis?: number, yAxis?: number, zAxis?: number);
|
||||
}
|
||||
|
||||
export class PyramidDimension extends AbstractDimension {
|
||||
constructor(axis?: number, tall?: boolean);
|
||||
}
|
||||
|
||||
export class SideXDimension extends AbstractDimension {
|
||||
constructor(xAxis?: number, zAxis?: number);
|
||||
}
|
||||
|
||||
export class SideYDimension extends AbstractDimension {
|
||||
constructor(yAxis?: number, zAxis?: number);
|
||||
}
|
||||
|
||||
export class SlopeDimension extends AbstractDimension {
|
||||
constructor(xAxis?: number, yAxis?: number);
|
||||
}
|
||||
|
||||
export class BitmapData {
|
||||
constructor(w: number, h: number, useDefaultCanvas?: boolean);
|
||||
|
||||
imageData: ImageData;
|
||||
canvas: HTMLCanvasElement;
|
||||
context : CanvasRenderingContext2D;
|
||||
|
||||
setPixel(posX: number, posY: number, color: number): void;
|
||||
setPixelByIndex(index: number, color: number): void;
|
||||
checkPixelAvailable(x: number, y: number): boolean;
|
||||
floodFill(posX: number, posY: number, color: number): void;
|
||||
}
|
||||
|
||||
export class PixelObject {
|
||||
constructor(primitive: AbstractPrimitive, point3D?: Point3D);
|
||||
|
||||
x: number;
|
||||
y: number;
|
||||
canvas: HTMLCanvasElement;
|
||||
}
|
||||
|
||||
export class PixelView {
|
||||
constructor(canvas: HTMLCanvasElement, point?: Point);
|
||||
|
||||
canvas: HTMLCanvasElement;
|
||||
context: CanvasRenderingContext2D;
|
||||
point: Point;
|
||||
|
||||
renderObject(primitive: AbstractPrimitive, point3D?: Point3D): void;
|
||||
clear(): void;
|
||||
}
|
||||
|
||||
export class AbstractPrimitive {
|
||||
constructor();
|
||||
|
||||
canvas: HTMLCanvasElement;
|
||||
w: number;
|
||||
h: number;
|
||||
dimension: AbstractDimension;
|
||||
color: AbstractColor;
|
||||
border: boolean;
|
||||
bitmapData: BitmapData;
|
||||
useDefaultCanvas: boolean;
|
||||
matrix: Matrix;
|
||||
}
|
||||
|
||||
export class Brick extends AbstractPrimitive {
|
||||
constructor(dimension?: BrickDimension, color?: SideColor, border?: boolean, useDefaultCanvas?: boolean);
|
||||
}
|
||||
|
||||
export class Cube extends AbstractPrimitive {
|
||||
constructor(dimension?: CubeDimension, color?: CubeColor, border?: boolean, useDefaultCanvas?: boolean);
|
||||
}
|
||||
|
||||
export class Pyramid extends AbstractPrimitive {
|
||||
constructor(dimension?: PyramidDimension, color?: PyramidColor, border?: boolean, useDefaultCanvas?: boolean);
|
||||
}
|
||||
|
||||
export class SideX extends AbstractPrimitive {
|
||||
constructor(dimension?: SideXDimension, color?: SideColor, border?: boolean, useDefaultCanvas?: boolean);
|
||||
}
|
||||
|
||||
export class SideY extends AbstractPrimitive {
|
||||
constructor(dimension?: SideYDimension, color?: SideColor, border?: boolean, useDefaultCanvas?: boolean);
|
||||
}
|
||||
|
||||
export class SlopeEast extends AbstractPrimitive {
|
||||
constructor(dimension?: SlopeDimension, color?: SlopeColor, border?: boolean, useDefaultCanvas?: boolean);
|
||||
}
|
||||
|
||||
export class SlopeNorth extends AbstractPrimitive {
|
||||
constructor(dimension?: SlopeDimension, color?: SlopeColor, border?: boolean, useDefaultCanvas?: boolean);
|
||||
}
|
||||
|
||||
export class SlopeSouth extends AbstractPrimitive {
|
||||
constructor(dimension?: SlopeDimension, color?: SlopeColor, border?: boolean, useDefaultCanvas?: boolean);
|
||||
}
|
||||
|
||||
export class SlopeWest extends AbstractPrimitive {
|
||||
constructor(dimension?: SlopeDimension, color?: SlopeColor, border?: boolean, useDefaultCanvas?: boolean);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user