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

screen-buffer

v0.4.0

Published

A simple screen buffer component

Downloads

31

Readme

ScreenBuffer ok, travis

A ScreenBuffer represents a visible portion of a terminal in a screen. A ScreenBuffer contains a lot of cells. Each cell contains a character and attributes, such as color and boldness. It also keeps track of cursor position.

Usage in Node.js

var ScreenBuffer = require('screen-buffer')

Usage in Browser

<script src="path/to/screen-buffer.js"></script>
<script src="path/to/diff.js"></script><!-- if you need .diff -->
<script src="path/to/patch.js"></script><!-- if you need .patch -->

Cell Attributes

Currently the attributes is a 21-bit integer. From MSB:

  • 1 bit - inverse video flag
  • 1 bit - underline flag
  • 1 bit - bold flag
  • 9 bits - foreground color (according to xterm-256)
  • 9 bits - background color (according to xterm-256)

There are two special values for colors:

  • 257 - default foreground color
  • 256 - default background color

API

ScreenBuffer.EMPTY_CELL

An empty cell: default background and foreground with space character.

ondirty : function(row) { }

Override this function to be notified when changes are made to the buffer.

cursorX : Number

The X position of the cursor (0 = leftmost)

cursorY : Number

The Y position of the cursor (0 = topmost)

update(y, [ [attr, char], [attr, char], ... ])

Set one line of data in the ScreenBuffer. y is the row in the screen and data array looks like this: [ [attribute, character], ... ]

toString()

Returns the string in the display buffer.

setCursor(x, y)

Sets the cursor position.

cursorX

The X position of the cursor.

cursorY

The Y position of the cursor.

getRows()

Returns the number of rows in the buffer.

getCols(row)

Returns the number of characters in this row.

setRows(rows)

Resizes the number of rows.

setCols(row, cols)

Resizes the number of columns in the specified row.

getCell(row, col)

Returns the cell at (row, col). Returned value is in form of [ attributes, ch ].

setCell(row, col, cell)

Sets the cell at (row, col). A cell is in form of [ attributes, ch ].

resize(rows, cols)

Resizes the screen buffer.

clone()

Returns a clone of the screen buffer.

getRow(row)

Returns a row data array. Don't modify it!

ScreenBuffer Diff and Patch

Sometimes, you may want to stream the content of a screen buffer over the network.

You can use ScreenBuffer.diff and ScreenBuffer.patch for this.

Suppose that you have two ScreenBuffer objects, a and b,

var operations = ScreenBuffer.diff(b, a)

This will compute the operations that needs to be done on b to make its contents equal to a. The returned result is an array of operations, which can be sent over the wire to another user.

At the other side, when they received the operations, they can apply it to their own buffer like this:

ScreenBuffer.patch(b, operations)

ScreenBuffer.diff(source, destination)

Computes the list of operation to be applied on the source to make it match the target.

A returned result will have this structure:

[OPERATION, ...]

An OPERATION represents an operation:

  • ROWS (resize number of rows)
  • [X, Y] (set cursor position)
  • [row, 0, COLUMNS] (resize column)
  • [row, 1, SOURCE ROW INDEX] (copy)
  • [row, column, "TEXT", "COMPRESSED ATTRIBUTE,..."] (draw text)

A COMPRESSED ATTRIBUTE has the form:

  • VALUE
  • VALUE*MULTIPLICITY

ScreenBuffer.patch(screenbuffer, operations)

Applies the operations from the diff array onto the screenbuffer.