raix:famono

v0.9.27Published 9 years ago

This package has not had recent updates. Please investigate it's current state before committing to using it in your project.

raix:famono

What is it?

In short you can load libraries from bower, github, http, locally from path or as in memory alias libraries.

It currently supports umd/commonjs/requirejs/amd libraries.

Default libraries:

It was built to support Famo.us in Meteor (examples below) But target has become finegrained reuse of javascript code in general from the web.

If you want a "pure" app without the meteor libraries just remove meteor-platform package.

Installing it

Meteor package

$ meteor add raix:famono

Requires: Meteor-0.9.0 and of course git

Use it

How: When you install famono it will add a lib/smart.require file to your main app folder:

1{
2  "famous": {
3    "git": "https://github.com/Famous/famous.git",
4    "root": "src" // From version 3 of famous
5  },
6  "famous.polyfills": {
7    "git": "https://github.com/Famous/polyfills.git"
8  }
9}

The lib/smart.require library registry comes with references to famous and famous.polyfills repos by default.

This enables you to do:

1if (Meteor.isClient) {
2
3  // Rig some famo.us deps
4  famous.polyfills;
5  famous.core.famous;
6
7  // Make sure dom got a body...
8  Meteor.startup(function() {
9    var mainContext = famous.core.Engine.createContext();
10    var renderController = new famous.views.RenderController();
11    var surfaces = [];
12    var counter = 0;
13
14    for (var i = 0; i < 10; i++) {
15        surfaces.push(new famous.core.Surface({
16             content: "Surface: " + (i + 1),
17             size: [200, 200],
18             properties: {
19                 backgroundColor: "hsl(" + (i * 360 / 10) + ", 100%, 50%)",
20                 lineHeight: "200px",
21                 textAlign: 'center'
22             }
23        }));
24    }
25
26    renderController.show(surfaces[0]);
27
28    famous.core.Engine.on("click", function() {
29        var next = (counter++ + 1) % surfaces.length;
30        this.show(surfaces[next]);
31    }.bind(renderController));
32
33    mainContext.add(new famous.core.Modifier({align: [.5, .5], origin: [.5, .5]})).add(renderController);
34
35  });
36
37}

NOTE: You can still do regular var Surface = require('famous/core/Surface');

Will the entire repo be loaded to the client??

Nope!! - the package scans your code and figure outs dependencies based on your calls to require.

Adding additional libraries

You can add additional libraries like moment/underscore etc

By editing lib/smart.require manually:

1  "underscore": {
2    "bower": "underscore"
3  },
4  "moment": {
5    "git": "https://github.com/moment/moment.git"
6  },
7  "numeral": {
8    "git": "https://github.com/adamwdraper/Numeral-js"
9  },
10  "jquery": {
11    "alias": "$"
12  },
13  "foo": {
14    "bower": "foo",
15    "root": "src/path"
16  },
17  "jqueryui": {
18    "http": "http://code.jquery.com/ui/jquery-ui-git.js"
19  },
20  "localDevLib": {
21    "path": "/just/something/I/m/working/on",
22  },
23  "localLib": {
24    "path": "/some/where/over/the/rainbow"
25    "watch": "false" // default is true
26  }

Famono will add/download or removal of the changed namespace LIVE - Note that you can use bower and github as source

Advanced stuff

I've moved documentation for more advanced features / usage into Advanced.md

Kind regards Morten (aka raix)