# μ (mu) - a micro UI library for embedded web applications

Mu is a work in progress, licensed under the MIT license. Mu is designed
to be a simple user interface framework for embedded javascript
applications. This means that the html and code will be included in other
webpages and must be able to handle that, without changing the design of the
webpage or the webpage design bleeding over in the embedded app. So Mu uses 
a single namespace for all the CSS and Javascript: 'mu'.

You create an embedded app, either by including the HTML directly in the
page or by inserting it through javascript. The HTML must follow this
structure:

```
<section id="muApplication" class="mu-app" style="height: 677px;">
	<header>
	    <ul class="mu-toolbar" data-mu-id="mu-main-toolbar">
	        <li>
	             <button class="mu-button" data-mu-command="a-command" title="A
	command"><i class="fa fa-gears"></i>A command</button>
	        </li>
	    </ul>
	</head>
	<section>
		Application specific content
	</section>
</section>
```

The application code is started like this:

```
<script>
    var myApp = mu.app({
        container: document.getElementById('muApplication'),
        commands: {
            'a-command': function(value, el) {
                this.action('an-action', el, value);
            }
        },
        actions: {
            'an-action': function(el, value) {
                alert('a command triggered an action');
            }
        }
    }); 
</script>
```

The application UI is responsive and will fit any size given to the
container element. If a toolbar is too wide to fit, you can drag the toolbar
left/right, either with the mouse or by touch.

You can create popup dialogs and dropdown menu's as well. Open the design/
directory in a webbrowser to get a full overview of the UI of Mu (or take a look
at <a href="http://auke.muze.nl/mu/" target="_blank">http://auke.muze.nl/mu/</a>).

Regards,

Auke van Slooten

auke@muze.nl