npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

ansi-graphics

v1.2.1

Published

An ANSI graphics parser.

Downloads

7

Readme

node-ansi

ANSI graphics parser for node.js. Output to plain text, HTML, binary, animated GIF, PNG, video, or whatever you want.

####Installation

npm install ansi-graphics

GIF, PNG, and video output functionality uses gifencoder and node-canvas, which in turn rely on Cairo. Ensure that Cairo and its dependencies are installed before proceeding. On Ubuntu I've also needed to install libjpeg-dev and libgif-dev in order to install these modules.

ffmpeg is not required for installation, however you'll need a recent build of ffmpeg in your PATH in order to use the output-to-video functionality.

####Usage

var ANSI = require('ansi-graphics'),
	fs = require('fs');

// Create a new ANSI object
var a = new ANSI();

// Load an ANSI graphic from a file
a.fromFile("./gnome.ans");

// Write the plain-text version of the graphic to a file
fs.writeFileSync("gnome.txt", a.plainText, { 'encoding' : 'binary' });

// Write the HTML version of the graphic to a file
fs.writeFileSync(
	"gnome.html",
	"<html><body>" + a.HTML + "</body></html>",
	{ 'encoding' : 'binary' }
);

// Write the binary version of the graphic to a file
fs.writeFileSync("gnome.bin", a.binary);

// Save the looping, animated GIF version of the graphic to a file
fs.writeFileSync("gnome.gif", a.toGIF({ 'loop' : true }));

// Save the PNG version of the graphic to a file
fs.writeFileSync("gnome.png", a.toPNG());

// Save an MP4 video of the scrolling graphic to a file
a.toVideo(
	{ speed : .13 },
	function(video) {
		fs.writeFileSync("gnome.mp4", video);
	}
);

The ANSI object

#####Methods

  • fromFile("/path/to/file.ans")
    • Loads and parses an ANSI graphic from a file
  • fromString(ansiString)
    • Loads and parses an ANSI graphic from a string
  • toGIF(options) (Buffer)
    • Converts the loaded ANSI graphic to an animated GIF
    • options is an optional object with the following properties:
      • loop (boolean) (default: false)
        • Whether or not the GIF should loop infinitely
      • delay (number) (default: 40)
        • Time between frames, in milliseconds
      • charactersPerFrame (number) (default: 20)
        • How many new characters appear in each frame of the GIF
          • If you set this to 1, the GIF will show the ANSI being drawn one character at a time, which is nice, however ...
          • If you set this to 1, it will take a long time to generate the GIF
          • Adjusting this number has a noticeable impact on filesize
          • You'll probably want to adjust delay along with this value
      • quality (number) (default: 20)
        • The image quality, on a scale of 1 to 20, where 1 is best and 20 is worst
          • I haven't noticed a visible difference between 1 and 20
          • GIFs generate a lot faster when the quality is set to the lowest (yet highest-numbered) value
      • scale (number) (default: 1)
        • Scale the image to this many times its actual size (.25 would be 25%, 2 would be 200%, etc.)
    • Returns a Buffer object
  • toPNG(options) (Buffer)
    • Converts the loaded ANSI graphic to a PNG
    • options is an optional object with the following properties:
      • quality (number) (default: 5)
        • The image quality, on a scale of 1 - 5, where 1 is best and 5 is worst
      • scale (number) (default: 1)
        • Scale the image to this many times its actual size (.25 would be 25%, 2 would be 200%, etc.)
    • Returns a Buffer object
  • toVideo(options, callback)
    • Converts the loaded ANSI graphic to a video
    • options is an optional object with the following properties:
      • format (string) (default: matroska)
        • See ffmpeg's documentation re: output formats for possibilities
      • speed (number) (default: 1)
        • Adjust the playback speed of the video
          • 0.25 would cause the video to play back four times faster
          • 2.5 would cause the video to play back two and a half times more slowly
      • charactersPerFrame (number) (default: 20)
        • As in toGIF() above, how many new characters appear in each frame of the video
        • Ultimately this is another way to adjust the "speed" of the video
        • Adjusting this value instead of 'speed' usually results in videos being generated more quickly
      • scale (number) (default: 1)
        • Scale the video to this many times the size of the original image (.25 would be 25%, 2 would be 200%, etc.)
    • callback is a required function that will be called with one argument, a Buffer object containing the video

#####Properties

  • width (Number)

    • The width of the graphic, in characters
  • height (Number)

    • The height of the graphic, in characters
  • pixelWidth (Number)

    • The width of the graphic, in pixels, when output as PNG/GIF/Video
  • pixelHeight (Number)

    • The height of the graphic, in pixels, when output as PNG/GIF/Video
  • data (Array)

    • An array of objects representing each explicitly drawn character in the graphic
    • Elements in this array appear in the sequence that they were parsed from the file
      • The parser handles cursor-positioning sequences
      • The parser handles clear-screen and clear-to-EOL sequences
      • Characters will not necessarily be in left-to-right, top-to-bottom sequence
        • This is useful for handling animated ANSIs
    • The elements in this array are objects of the following format:
{	cursor : {
		x : *number*,			// X-coordinate of character
		y : *number*			// Y-coordinate of character
	},
	graphics : {
		bright : *boolean*,		// Bold/bright foreground colour
		blink : *boolean*,		// Blinking
		foreground : *number*,	// Foreground colour (30 - 47)
		background : *number*	// Background colour (40 - 47)
	},
	chr : *string*				// The character itself
}
  • matrix (Object)
    • An object representing every character-cell in the graphic, from top to bottom, left to right
    • The object takes the following format:
{	0 : { 		// Line 0 of the graphic
		0 : {	// Column 1 of line 0
			graphics : {
				bright : *boolean*,
				blink : *boolean*,
				foreground : *number*,
				background : *number*
			},
			chr : *string*
		}
		...
	}
	...
}
  • plainText (String)

    • A string representation of the graphic with all colour/bright/blink attributes removed, with line-endings in place
      • (ie. the ANSI graphic converted to boring text.)
  • binary (Buffer)

    • A buffer of [ chr, attr, chr, attr, ... ] uint8s
  • HTML (String)

    • An HTML <pre> block containing the graphic, with colorized regions in styled <span> elements, and characters encoded as HTML entities as required
      • Opening and closing <html> <head> and <body> tags are not included in this string