Seed

Simple yet powerful library for building modern web interfaces.


Keywords
mvvm, browser, framework
Install
bower install Seed

Documentation

SeedHq

Build Status

Introduction

Elegant customizable inheritance, attributes and events in JavaScript.

Basic Usage

Extend your own Constructors

    var Fruit = S.extend({
      options : {
        // by default the fruit is Tasty
        isTasty : true,
        //and no one owns it
        owner : null
      },
      
      // i like to taste any fruit
      taste : function() {
        console.log('I like to taste a fruit');
      },
      
      dump : function() {
        return {
          objectType :  'a fruit'
        }
      }
    });
    
    var Banana = Fruit.extend({
      // by default the banana is owned by a banana eater and is yellow
      '+options' : {
        owner : 'banana eater',
        color : 'yellow'
      },
      
      // but the taste of the banana depends if it tasty
      '+taste' : function() {
        console.log(this.isTasty ? 'GREAT' : 'beurk');
      },
      
      '+dump' : function() {
        return {
          color : this.color
        }
      }
    });
    

Instanciate them

var oldBanana = new Banana({
  isTasty : false,
  color : 'black',
  owner : 'me'
});

// options are set as attributes in the instance
oldBanana.isTasty 
//=> false

// +taste in Banana is executed after taste in Fruit
oldBanana.taste();
// I like to test fruits
// beurk

var favoriteBanana = new Banana();

favoriteBanana.taste(); 
// I like to test fruits
// GREAT

favoriteBanana.dump();
//=> { color : 'yellow', objectType : 'a fruit'}

More infos/usages

Seed.js is a package of 4 little Tools :

Demo

See cagosta.github.io/Seed

## Install ##

SeedHq is developed as AMD module but can be installed with npm, bower or old-fashioned src=".min.js".

With npm:

npm install seedhq

and use it with nodejs:

var Seed = require('seedgq')

With bower:

bower install Seed

Point Seed to [bower_components_path]/SeedHq/app/Seed.js into your requirejs path config and load it with requirejs:

require(['Seed/Seed'], function( Seed ){

})

With src=" .min.js"

Inside the dist folder, download latest standalone minified version or development version and include it in your html page:

<script src="[path_to_source]/SeedHq-latest-standalone-min.js%>"></script>

The module is available via the scope

window.SeedHq

To do

  • rewrite old tests with mocha
  • document plugins

## Documentation ##

See jsdoc-generated documentation in /documentation

Folder Structure

app         ->  development files
|- bower_components          ->  bower front-end packages
|- main.js                   ->  main file for browser and node.js, handle AMD config
|- seed_hq   -> main AMD module
test        ->  unit tests
|
tasks       -> grunt tasks, see [generator-mangrove-module](https://github.com/cagosta/generator-mangrove-module)
|
dist        ->  distribution & build files
|
node_modules -> node packages
|
documentation  -> [jsdoc](http://usejsdoc.org/about-jsdoc3.html) generated documentation 

Run unit tests

On the browser

Run grunt test:browser and open test/ on your browser.

#### On a headless browser ####

grunt test:headless will run your tests in a headless browser, with phantomjs and mocha

On node

grunt test:node will run your tests with node and mocha.

Because of requirejs, the mocha command does not work.

Build your own

This project uses Node.js, Grunt and Require.js for the build process. If for some reason you need to build a custom version install Node.js, npm install and run:

grunt build

## Yeoman Mangrove module Generator ##

This module is based on a Yeoman generator: Generator-mangrove-module
Check it for task-related references such as build, deploy etc ..

Authors

License

MIT License