matteobruni / GIF_decoder

GIF decoding and rendering with HTML5 canvas

GIF decoder

GIF decoding and rendering with HTML5 canvas

• Type documentation
  • GIF attributes
  • Frame attributes
  • DisposalMethod attributes (enum)
  • PlainTextData attributes
  • ApplicationExtension attributes
• Available URL parameters

Type documentation

The GIF object constructed has the following attributes.

GIF attributes

Click to toggle table

Attribute	JSDoc annotation	Description
width	number	the width of the image in pixels (logical screen size)
height	number	the height of the image in pixels (logical screen size)
totalTime	number	the total duration of the gif in milliseconds (all delays added together) - will be Infinity if there is a frame with the user input delay flag set and no timeout
colorRes	number	the color depth/resolution in bits per color (in the original) [1-8 bits]
pixelAspectRatio	number	if non zero the pixel aspect ratio will be from 4:1 to 1:4 in 1/64th increments
sortFlag	boolean	if the colors in the global color table are ordered after decreasing importance
globalColorTable	[number,number,number][]	the global color table for the GIF
backgroundImage	ImageData	an image filled with the background color (can be used as a background before the first frame) - if the global color table is not available this is transparent black
frames	Frame[]	each frame of the GIF (decoded into single images) - type information further below
comments	[number,string][]	comments in the file and on with frame they where found
applicationExtensions	ApplicationExtension[]	all application extensions found - type information further below

Frame attributes

Click to toggle table

Attribute	JSDoc annotation	Description
left	number	the position of the left edge of this frame, in pixels, within the gif (from the left edge)
top	number	the position of the top edge of this frame, in pixels, within the gif (from the top edge)
width	number	the width of this frame in pixels
height	number	the height of this frame in pixels
disposalMethod	DisposalMethod	the disposal method for this frame - type information further below
image	ImageData	this frames image data
plainTextData	PlainTextData|null	the text that will be displayed on screen with this frame (if not null) - type information further below
userInputDelayFlag	boolean	if set waits for user input before rendering the next frame (timeout after delay if that is non-zero)
delayTime	number	the delay of this frame in milliseconds
sortFlag	boolean	if the colors in the local color table are ordered after decreasing importance
localColorTable	[number,number,number][]	the local color table for this frame
reserved	number	_reserved for future use_ (from packed field in image descriptor block)
GCreserved	number	_reserved for future use_ (from packed field in graphics control extension block)

DisposalMethod attributes (enum)

Click to toggle table

Name	Internal value (number)	Description	Action
Replace	0	unspecified	replaces entire frame
Combine	1	do not dispose	combine with previous frame
RestoreBackground	2	restore to background	combine with background (first frame)
RestorePrevious	3	restore to previous	restore to previous undisposed frame state then combine
UndefinedA	4	undefined	fallback to Replace
UndefinedB	5	undefined	fallback to Replace
UndefinedC	6	undefined	fallback to Replace
UndefinedD	7	undefined	fallback to Replace

PlainTextData attributes

Click to toggle table

Attribute	JSDoc annotation	Description
left	number	the position of the left edge of text grid (in pixels) within the GIF (from the left edge)
top	number	the position of the top edge of text grid (in pixels) within the GIF (from the top edge)
width	number	the width of the text grid (in pixels)
height	number	the height of the text grid (in pixels)
charWidth	number	the width (in pixels) of each cell (character) in text grid
charHeight	number	the height (in pixels) of each cell (character) in text grid
foregroundColor	number	the index into the global color table for the foreground color of the text
backgroundColor	number	the index into the global color table for the background color of the text
text	string	the text to render on screen

ApplicationExtension attributes

Click to toggle table

Attribute	JSDoc annotation	Description
identifier	string	8 character string identifying the application
authenticationCode	string	3 bytes to authenticate the application identifier
data	Uint8Array	the (raw) data of this application extension

Available URL parameters

URL parameters can be in any order (starting with ? after the URL then parameters in format PARAMETER=VALUE with & between each parameter)

Click to toggle table

Parameter	Possible values	Description	Default value
gifURL	HTML image source (URL) (encoded URI component)	the GIF to decode and render	this GIF from Wikipedia
alertErrors	0 or 1	Errors while decoding will open an alert pop-up	1
forceClearLastFrame	0 or 1	Forces to clear the screen after the last frame, regardless of what the GIF file says	1