Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/tomatau/tomatao.js
Medium weight Javascript Framework
https://github.com/tomatau/tomatao.js
Last synced: 26 days ago
JSON representation
Medium weight Javascript Framework
- Host: GitHub
- URL: https://github.com/tomatau/tomatao.js
- Owner: tomatau
- License: apache-2.0
- Created: 2013-11-11T22:12:32.000Z (almost 11 years ago)
- Default Branch: master
- Last Pushed: 2014-05-08T15:24:57.000Z (over 10 years ago)
- Last Synced: 2024-04-14T22:20:46.017Z (7 months ago)
- Language: JavaScript
- Size: 406 KB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
tomatao.js
===
A medium weight Javascript MVP Framework built as a practical learning excersize.
###Concept
Based on the flexibility and simplicity of Backbone JS, this framework aims to:
- reduce load time
- promote the MVP design pattern
- add structural components
- add integration components
- add convenience
####reduced load time
By utilising more of the existing features within jQuery and underscore (which are requirements of backbone), the full and compressed versions of the files for this framework are much smaller.
The framework is currently incomplete, but, already adding a small number of features and covering most existing significant features; shows a noteworthy reduction in file size.
######Comparison
| Framework | Version | Size |
|-----------|---------|------|
|**backbone.js** | 1.1.0 | *60.515 kb* |
|**backbone.min.js** | 1.1.0 | *19.548 kb* |
|**tomatao.js** | 0.0.1 | *17.29 kb* …29% |
|**tomatao.min.js** | 0.0.1 | *4.42 kb* …23% |
Once complete, I plan to also release a *'lite'* version that will not contain validation strings and other features that take up many bytes.
##Features
Below is a list of the current and working features:
***Philanthropy*** - This is one of my favourite words and it is at the heart of this Framework… infact it's the namespace, a convenient three letter alternative to longer namespaces such as 'Backbone'.
```javascript
var MyEventObj = _.extend({
foo: function(){}
}).extend(Pln.Events); // Pln = Main Namespace
```
***Base Klass Object*** - A base class is exposed for custom lightweight objects
**'init'** is used instead of **'initialize'** as I always spell it incorrectly and often don't even realise; causing a world of pain!
```javascript
// Extend normally gaining Klass methods
var Parent = Pln.Klass.extend({
foo: function(){
return this.bar;
}
});
// extend through parent definition
// access methods through super
// allows for quick and dirty multiple extension
var Child = Pln.Klass.extend({
parent: myParent, // extend through super
bar: "wurp durp",
init: function(){ // automatically called
this.once("custom:event", this.super('foo'));
}
});
```
This exposes an events implementation as well as init and parent (super) access.
***Automatic method binding*** - Within many parts of backbone, methods lose their context. Tomatao JS maintains the original context of each method
***Request and Response*** - Not only can you publish and subscribe to events, you can also make requests; an inversion of the pubsub technique.
```javascript
var foo = new Child.extend({
parent: Child,
cheezburger: "YES",
init: function(){
this.super('init');
Pln.response("canihaz:cheezburger",
function(){
return this.cheezeburger;
}
);
}
});
// somewhere else completely
var chzbrgr = Pln.request('canihaz:cheezburger');
```
These methods can also accept options that are passed from the request to the response for further control.
***Presenter Object*** - This is an MVP framework, and so the Backbone's 'View' object could be an equivilent and is for translating Model data into a format suitable for the view (template). As such, the object is not called a View, it is called a 'Presenter' aka 'Pres'.
```javascript
var Todo = Pln.Pres.extend({
view: someTemplateHTML,
el: "selector",
model: Todo,
attrs: {
id: "my-id",
klass: "my classname"
},
events: {
'click': 'method'
},
modelEvents: {
'change:name': 'method'
},
method: function(){}
});
```
***Composite Presenter*** - TBA
***Module*** - A higher level object for orchestrating Views and Models. This can be seen as used for grouping components or use-cases. Also TBA.
```javascript
var TodoComponent = Pln.Module.extend({
model: MyApp.Model.Todo,
views: {
todo: MyApp.Pres.Todo
}
});
```
Features of this are still undecided; currently the Views are all initialized when a module is initialized. Also the views are cleaned when you call Module.stop().
***Models*** - Basic models are very similar to Backbone Models but have a few syntactical differences along with no implementation.
***Base Model*** - The basic model functionality.
***Rest Model*** - Extends the base model for Restful server communication.
***Socket Model*** - Extends the base model for Web Socket communication.
These are all TBA as SockJS and SocketIO each offer advantages. You can also add new types through a modelMaps property of Pln.
The default model defaults to 'Base' when you use Pln.Model using a factory.
***Validation*** - I plan to provide a number of basic validation options that will ease validation implementation; such as required, min, max, length, patterns, etc… These will be possible to bind to both Models and Views.
The implementation of this is also yet to be decided.
##Not Featured
- This framework has no Routing implementation but may do in the future.
- This framework is not designed to be used in NodeJS applications; it is purely for client side UI development.
##TODO
- Validation methods, this is in the works
- Composite Presenters, for binding Collections and rendering of views
- Tests
- Modules
- Model Implementations
- TBA
***
#INCOMPLETE#
This project is incomplete and just a learning excersize for myself. As such, the requirements have not been confirmed and so I have not bothered with any Unit tests. This will come once I'm more happy with the expected Use Cases and behaviour!