Abstract JS is a client-side javascript framework that provides a clean and easy to use API to create and organize your application with Controllers, Models, Collections, Routes etc..
An Controller example
x.Controller('EmployeesController',[function(){
this.edit = function(param){
record = this.allEmployees[param]
this.employee.edit(record);
}
}]);Abstract xEngine is a parser system that gives your HTML super-powers. Its a way to attribute actions and behaviors to HTML elements and you can easily make AjaxCalls, form validations or even create controllers or models just with HTML.
for example :
<table border="1" x-controller="EmployeesController">
<thead>
<tr>
<th>Name</th>
<th>Age</th>
<th>Company</th>
<th>Area</th>
</tr>
</thead>
<tbody x-content="data.json" x-model="funcionario" x-collection="allFuncionarios">
<tr>
<td>{{name}}</td>
<td>{{age}}</td>
<td>{{company.name}}</td>
<td>{{company.area.name}}</td>
<td><button x-click="editar({{id}})">Edit</button></td>
</tr>
</tbody>
</table>Will automatically be parsed into this :
<table border="1" x-controller="EmployeesController">
<thead>
<tr>
<th>Name</th>
<th>Age</th>
<th>Company</th>
<th>Area</th>
</tr>
</thead>
<tbody x-content="data.json" x-model="employees" x-collection="allEmployees">
<tr>
<td>John</td>
<td>21</td>
<td>Google</td>
<td>Technology</td>
<td><button x-click="edit(0)">Edit</button></td>
</tr>
<tr>
<td>Mark</td>
<td>22</td>
<td>Facebook</td>
<td>Technology</td>
<td><button x-click="edit(1)">Edit</button></td>
</tr>
<tr>
<td>Garry</td>
<td>23</td>
<td>Instagram</td>
<td>Technology</td>
<td><button x-click="edit(2)">Edit</button></td>
</tr>
<tr>
<td>Silverster Stalone</td>
<td>24</td>
<td>Picasa</td>
<td>Technology</td>
<td><button x-click="edit(3)">Edit</button></td>
</tr>
</tbody>
</table>PS: this is a pre-alpha Version