Created: 2013-06-18 11:01
Updated: 2019-02-10 15:10

Simple State Manager 4

Build Status Code Climate

Simple State Manager (SSM for short) is a javascript state manager for responsive websites. It is built to be light weight, has no dependencies (except javascript of course) and aims to be really easy to simply drop into your project ready to use.

As a state manager, SSM allows you to target different javascript towards different states of your site. It allows you to define as many states as your site requires and allows you to have independent Enter, Leave and Resize events for each of the states.

##Getting started

To get started with SSM the first step is to include it in your project, you can do this in two ways

  • Download and add the ssm.js (or ssm.min.js) file to your site
  • Use Bower to add to your project using bower install SimpleStateManager

##Documentation Documentation can be found at

##Browser Support Version 4.x of SimpleStateManager is built in ES6 so for the majority of browsers will require being transpiled to work accross different browsers. In its transpiled form SimpleStateManager supports:

  • Internet Explorer 10+ (Internet Explorer 9 should work if you use a matchMedia polyfill)
  • Google Chrome
  • Mozilla Firefox
  • Opera
  • Apple Safari

The library is tested across browser prior to each release and every commit is validated using TravisCI and BrowserStack.

If you need to support Internet Explorer 8 or below their are two options available:

  • Use a matchMedia polyfill and a bind polfill
  • Use SimpleStateManager 2.X.X branch

##Release Log

4.0.0 - 10th December 2017

In SimpleStateManager 4 the library is completely rewritten into ES6. I also updated the API so that there is less duplication.

  • Updated whole codebase to ES6
  • Seperated out the utils into a seperate file
  • Seperated out state into a seperate file
  • Use requestAnimationFrame for debounce [Issue #41]

###3.2.0 - August 24th, 2016

  • Add method to enable developers to attach multiple callbacks to a state

###3.1.2 - June 17th, 2016

  • Fixed a bug where IE11 would reject a media expression that is an empty string, switched to provide a media expersion that is always true as the default.

###3.1.1 - March 8th, 2016

  • Fixed bug that prevented removing states correctly removing the listeners

###3.1.0 - February 10th, 2016

  • Added isActive method back into library

###3.0.0 - June 8th, 2015

  • Rewrite to use the matchMedia API
  • Add support for media queries
  • Major refactor
  • Remove legacy browser (IE 8 and below) support

###2.4.1 - May 17, 2015

  • Fix browser width when browser is zoomed

###2.4.0 - December 29, 2014

  • Improved release process with version auto updating
  • Implemented proper AMD support
  • Made the site a seperate repository

###2.3.0 - July 25, 2014

  • Added onFirstRun callback method to states.

###2.2.6 - June 23, 2014

  • Fixed issue where you can apply multiple readies.

###2.2.5 - June 12, 2014

  • Fixed issue where it didnt work when you zoom the browser.

###2.2.4 - March 12, 2014

  • Fixed issue where respond.js would trick SimpleStateManager into thinking the matchMedia API was fully supported.

###2.2.3 - February 14, 2014

  • Fixed issue where the width of the browser would not always match the media query.

###2.2.2 - February 12, 2014

  • Fixed issue where config options were required otherwise there would be an error.

###2.2.1 - January 31, 2014

  • Fixed build issue

###2.2.0 - January 29, 2014

  • Added ssm.isActive to allow us to test if a state is active.

###2.1.0 - December 23, 2013

  • Added config option API which allows you to add your own SimpleStateManager config options along with the test to see if they are valid.
  • Rewrote how testing of minWidth and maxWidth is handled to use the new config option API
  • Added new unit tests to improve code coverage

###2.0.3 - October 7, 2013

  • Fixed issue where browser width was not updated correctly

###2.0.2 - September 26, 2013

  • Fixed issue where leave events fired incorrectly

###2.0.1 - September 18, 2013

  • Fixed issue where ssm.js could not be placed in the head of the document

###2.0.0 - September 13, 2013

  • Major API changes to all states mangement methods, please read through the new API documention if upgrading
  • Ability to overlap your states
  • Debug mode removed - replaced with a new debug tool (currently early alpha) which will continue to be expanded to allow better responsive debugging
  • Define min-width and max-width values for each state
  • Easier to extend SSM (it is now encouraged)

###1.3.0 - August 10, 2013

  • Added .removeStates method
  • Added unit tests using QUnit
  • Integrated Travis CI

###1.2.0 - August 9, 2013

  • Added .getState method

###1.1.0 - August 9, 2013

  • Added .removeAllStates method

###1.0.2 - August 6, 2013

  • AMD Support
  • Replaced Debounce with timeout
  • New Site

###1.0.1 - June 24, 2013

  • Added Debounce to SSM (Thanks Kevin)

###1.0.0 - June 22, 2013

  • Initial release


License: MIT (

Cookies help us deliver our services. By using our services, you agree to our use of cookies Learn more