finre 0.1.x documentation¶

Overview¶

What is finre?¶

Finre is a FINe REsponsive UI framework.

Where to get it?¶

Find it on GitHub.

You also need to get and use the following dependencies:

browse.js
normalize.css: at deps/css/normalize.min.css in finre repository
modernizr.js: at deps/js/modernizr.min.js in finre repository
respond.js: at deps/js/respond.min.js in finre repository

How to use it?¶

The following HTML snippet shows the minimum code required to use finre:

<!DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.01//EN>
<html lang=en>
<head>
  <title>Finre Application</title>
  <link rel=stylesheet href=/css/normalize.css/>
  <link rel=stylesheet href=/css/finre.min.css/>
  <script src=/js/modernizr.min.js></script>
<!--[if lt IE 9]>
  <script src=/js/respond.min.js></script>
<![endif]-->
</head>
<body class=finre>
  <script src=/js/browse.min.js></script>
  <script src=/js/finre.min.js></script>
</body>
</html>

NOTE:

Note the class=finre attribute. The body element must have the finre class, or the finre CSS rules would not apply. You can disable finre CSS rules anytime by just removing the class finre from body element.
The locations /js and /css are not mandatory and just denote typical directory organization used in websites.

Working with Events¶

Events¶

Finre uses following application events.

EventManager¶

You can use finre.EventManager to work with finre events.

register¶

Synopsis¶

finre.EventManager.register(type, subscriber)

Example¶

var subscriber = {
  onabc: function(data, sender) {
    // do something
  }
}
finre.EventManager.register('abc', subscriber)

Description¶

The subscriber argument must be an object
If type is 'abc', then the subscriber object must have an onabc member which is a function
Once 'abc' event is fired, then the onabc member of the subscriber would be invoked by finre to handle the event
The onabc function would receive these two arguments when callled by finre:
- data: event data
- sender: the entity that generated the event

Errors¶

In case of input errors, this exception is raised: 'Invalid subscriber type or missing required handler'

unregister¶

fire¶

Defaults¶

box-sizing: border-box¶

Finre sets border-box as the default value for box-sizing to all elements.

clearfix¶

Finre applies the clear-fix based on microfix. Also see what is a clearfix?.