Skip to content
master
Go to file
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
lib
 
 
 
 
 
 

README.md

JS.13kGames

Lightweight libraries prepared for js13kGames JavaScript coding competition.

TweenFX.js - basic tweener for styles and transforms in 900 bytes

SoundFX.js - sound controller with 9 predefined sound effects in 750 bytes

TypeFX.js - pixel font with a full glyph set (10x5px size) in 1250 bytes

Visit the compo web page: http://js13kgames.com/ or follow these twitter tags: #js13k ; #js13kgames

For updates follow me on Twitter: @FoumartGames

Demos:

http://www.foumartgames.com/dev/js13kGames/js_libraries/

SoundFX Generator:

http://www.foumartgames.com/dev/js13kGames/js_libraries/SoundFXGenerator/


TweenFX

Basic DOM element style tweener.

Check TweenFX in action: http://www.foumartgames.com/dev/js13kGames/js_libraries/TweenFX/

Global Methods:

TweenFX.to(element, duration, object, callback, arguments)

Example:

TweenFX.to(element, 10, {x:100, y:100});

Callback Example:

TweenFX.to(element, 10, {x:100, y:100}, onComplete, element);

Example of performing two consecutive tweens with a callback:

TweenFX.to(element, 10, {x:100, y:100}, TweenFX.to, element, 10, {x:0, y:0});

TweenFX.pause

Toggle pause ON / OFF:

TweenFX.pause();

Set pause to ON:

TweenFX.pause(true);

Set pause to OFF (unpause):

TweenFX.pause(false);

Simply gets the pause value

TweenFX.pause(null);

TweenFX.stop

Stop the tweens of an element:

TweenFX.stop(element);

Stop all tweens currently in progress:

TweenFX.stop();

TweenFX.getValue

Extracts the "left" property floating number from an element's style:

TweenFX.getValue(element, "left");	

TweenFX.getTransform

Extracts the "rotate" property angle degrees from an element's transform:

TweenFX.getTransform(element, "rotate");

Get an object populated with scaleX, scaleY and rotate

TweenFX.getTransform(element);

Tweenable styles:

  • {opacity} - num - tweens style.opacity, also recognized as {alpha}
  • {left} - px - tweens style.left, also recognized as {x}
  • {top} - px - tweens style.top, also recognized as {y}
  • {right} - px - tweens style.right
  • {bottom} - px - tweens style.bottom
  • {width} - px - tweens style.width
  • {height} - px - tweens style.height

Tweenable transform properties:

  • {scale} - num - tweens style.transform(scaleX, scaleY);
  • {scaleX} - num - tweens style.transform(scaleX);
  • {scaleY} - num - tweens style.transform(scaleY);
  • {rotate} - deg - tweens style.transform(rotate), also recognized as {rotation}

SoundFX

Basic sound effect controller utilizing the Web Audio API (AudioContext's Oscillator and Gain)

Check SoundFX in action: http://www.foumartgames.com/dev/js13kGames/js_libraries/SoundFX/

JSFiddle: https://jsfiddle.net/Foumart/1bdk8ks2/

Global Methods:

SoundFX.playSound(startFrequency, frequencyChange, delay, repeat, volume, type)

type:

  • Square
  • Sawtooth
  • Triangle
  • Sine

built in sounds:

  • SoundFX.jump()
  • SoundFX.pew()
  • SoundFX.zap()
  • SoundFX.bounce()
  • SoundFX.stuck()
  • SoundFX.explosion()
  • SoundFX.blow()
  • SoundFX.shot()
  • SoundFX.coin()

SoundFX.setVolume(_volume:Number)

Set the master volume to the number provided (float:0-1)

SoundFX.getVolume()

Get the master volume

Web Audio API reference: https://www.w3.org/TR/webaudio/


TypeFX

Lightweight Font < 1.5kb - uses canvas to draw glyphs

Global Methods:

TypeFX.drawText(element, text, size, leading, color)

Example:

var text = "This is a test string\rWith line break.";
var element = document.createElement("div");
document.body.appendChild(element);
TypeFX.drawText(element, text, 5);

TypeFX.drawDiggit(element, charCode or a glyph string, size, color)

About

Lightweight libraries prepared for js13kGames game jam

Resources

License

Releases

No releases published

Packages

No packages published
You can’t perform that action at this time.