rasterjs demos - underwater

Field

Palette

rgb map

Tileset

Colorspace

Screen Splits

Dip Switches

Info

Grid:
Pixel (x,y):
Tile (x,y):
TileID:
Field Value:
Cell (x,y):
Cspace Piece:
Palette Index:
Color:
Scroll X:
Scroll Y:
Split Number:

Pixel art by PixelFrog, used in accordance with Creative-Commons. See attribution here


const ra = require('raster');
ra.setZoom(2);

let img = ra.loadImage('/img/Pirate.png', {sortColors: 'usingHSV'});
ra.then(function() {
  ra.paste(img);

  function whitePalette() {
    ra.palette.fill(0);
  }

  function waterPalette() {
    ra.palette.fill(17);
    ra.palette.assign({19: 22, 22: 16, 20: 15});
  }

  function shimmerEffect(val) {
    return ra.oscil({period:28, max:6, tick:(val + ra.tick/8)});
  }

  let interrupts = ra.useInterrupts([
    {scanline:   0, irq:()=>{ ra.setScrollX(3), ra.palette.reset(); }},
    {scanline: 130, irq:()=>{ whitePalette(); }},
    {scanline: 131, irq:()=>{ waterPalette(); }},
    {scanline: [132,159], irq:(ln)=>{ ra.setScrollX(shimmerEffect(ln)); }},
  ]);

  function draw() {
    let waterHeight = Math.floor(ra.oscil({period: 250, max: 20}) + 130);
    interrupts.shiftDown(waterHeight, {startIndex: 1});
  }

  ra.run(draw);
});