# Project Mariah
## Note: this project is in early development and it not ready for production!

## TLDR;
Project Mariah is a set of tools made to separate markup from logic for client side development.

## Full Explanation
Often in client side development for complex dynamic web applications, markup ends up tangled up with with the JavaScript.

Mariah compiles components written in Jade into a JavaScript object which contains jQuery HTML objects that can be used on the client side in a way that is almost transparent to the developer.

You can define every bit of you're dynamic markup in jade file while you program their logic in a separate JavaScript file, making a complex project more maintainable.

Optionally you can use the client ```mariah.js``` file to extend jQuery with some fancy binding methods.

# Get started

## Node/CLI Setup
Run ```npm install mariah -g``` .
##### Note: you must install with the ```-g``` flag if you want to use Mariah from the command line.
By default Mariah will use the ```/components``` directory as it's source and ```/public/js/comps``` for the target directory.

Any files in the root of the source directory will be compiled into an object which will be set to ```Main```  in the global scope, where the key to each component is the origin filename truncated at the first ".", and will be saved to  ```/public/js/comps/main.js``` .

If a one or more files are added to a sub directory of the source folder they will be saved to ```/public/js/comps/[source file name, truncated at the first "." and .toLowerCase()].js``` and the object will be set to the source file name, truncated at the first ".".
## Command Line Interface
Once you've installed Mariah globally you can access all of it's exported methods via the command line. 
Example:  ```mariah watch```.
#### Arguments
| Argument                   | option name        |
|----------------------------|---------------------|
| ```-s``` or ```--source``` | ```source_folder``` |
| ```-t``` or ```--target``` | ```target_folder``` |
| ```-n``` or ```--name```   | ```object_name```   |
| ```-f``` or ```--file```   | ```filename```      |
##### See [Options](#options) section bellow
## Methods

#### ```Mariah.compile({options}, callback)```

##### Note: Compilation is meant to be done ahead of time but can be done of the fly if needed.

#### Description
This method is used to call Mariah's compiler directly.
Useful for triggering a compile programmatically or from a build server.
#### Arguments
| Name       | Type           | Required | Description     |
|-----------------|----------------|----------|-----------------|
| ```options```   | ```Object```   | no       | [Option object](#options-object)   |
| ```callbacks``` | ```Function``` | yes      | Result callback |
#### Example
```
var Mariah = require('mariah');
Mariah.compile({options}, function(err, result){
    if(err) return console.error(err);
    console.log(result);
});
```
### ```Mariah.watch({options})```
### Description
This method is used to watch a folder of components and recompile upon changing a file in the folder.
Useful while developing or in a live application to allow remote changes to recompile on the fly.
### Arguments
| Name       | Type           | Required | Description     |
|-----------------|----------------|----------|-----------------|
| ```options```   | ```Object```   | no       | [Option object](#options-object)   |
#### Example
```
var Mariah = require('mariah');
Mariah.watch({options});
```
### Options Object
| Name                 | Required | Type         | Default              | Description                                                                |
|----------------------|----------|--------------|----------------------|----------------------------------------------------------------------------|
| ```object_name```    | no       | ```String``` | ```'Comps'```        | Global variable name of object which the compiled output will be saved in. |
| ```filename```       | no       | ```String``` | ```'/comps.js'```    | Name of file which the compiled output will be saved to.                   |
| ```target_folder ``` | no       | ```String``` | ```'./public/js'```  | Target folder for output file.                                             |
| ```source_folder ``` | no       | ```String``` | ```'./components'``` | Source folder that components are compiled from.                           |

## Client Setup
By adding the ```mariah.js``` file (found in the root of the module) to your client after jQuery will add the following helper methods to the jQuery constructor .
#### ```$.bound(callback)```
Attaches bindings to all child input elements and return the jQuery html object.

The ```.values``` property of a bound object is representation to all input values with the key set to the value of their name property.

#### ```$.buttons({bindings})```

Binds click events on target element to desired callback, e.g.
```
form.buttons({
	'.css-selector': function(e){
		console.log(this.values);
	}
})
```