Quickstart

for browser JavaScript

To build, run the following shell script and find the generated distributable file at dist/funjes.js

FUNJES_TARGET="javascript" FUNJES_TYPE="javascript" "./build.sh"

Now, having the funjes.js, you can, for example, open the demo/lightbox.html in your browser

for server side Node.js

To build, run the following shell script and find the generated distributable file at dist/funjes.js

FUNJES_TARGET="nodejs" FUNJES_TYPE="nodejs" "./build.sh"

Now, if you evaluate the contents of funjes.js, you will then have the funjes namespace in the global namespace and you can straight away call any of the funjes functions:

(new Function(require('posix').cat('funjes.js').wait()))();
funjes.stdout('Hello, World!');

Overview

• Funjes is a simple ECMAScript library of various helpful functions (also object constructors) and number constants in a single namespace
• Funjes is absolutely unobtrusive, it is designed to play well with any library, e.g. ExtJS
• Funjes is fine-grained modular, can be generated to only include a selected set of elements
• Funjes is compatible with any ECMAScript v3 dialect (e.g. JavaScript, ActionScript, QtScript, DMDScript) and platform (e.g. Helma, Google Chrome, Opera, Opera Mobile, Opera Widgets, Mozilla XULRunner (e.g. Mozilla Firefox, Mozilla Thunderbird, Miro), Mozilla Rhino, Adobe Flash, Qt, Apple Dashboard Widgets, Microsoft Gadgets, Microsoft Active Scripting, Microsoft Internet Explorer, OpenOffice.org, Yahoo! Widgets, Google Desktop Gadgets, Serence Klipfolio, Adobe Flash, Adobe Integrated Runtime, Adobe Acrobat, Adobe Acrobat Reader, Adobe Creative Suite, Late Night Software JavaScript OSA, Philips Universal Remote Panels, VRML97, Sphere RPG Engine, Re-Animator, Nintendo DS, Nintendo Wii)
• Funjes is licensed under the terms of GNU General Public License version 3

Demos

getScrollbarWidth

• targets: javascript
• available in ./demo/getScrollbarWidth.html

Hash

• targets: javascript
• available in ./demo/hash.html

Lightbox

• targets: javascript
• available in ./demo/lightbox.html

wtm

• targets: javascript, rhino
• for javascript: available in ./demo/wtm.html
• for rhino: build Funjes (FUNJES_TYPE="rhino" ./build.sh), then build and run java sources in ./demo/myapp-rhino

Notable features

• modular architecture - funjes build script can read all jsdoc tags @requires from a specified list of files and include in a final distributable script only the required funjes. Or you can manually specify a list of funjes element names
• unit testing infrastructure - there is a unit test for each funjes element. You can also reuse the funjes.test function to execute your test suite and display the results in a web browser in a debugging convenient fashion
• checksum functions are available: md5, crc32, sha1, sha256
• string encoding functions are available: json, base64, url, utf8 (to ascii)

• arbitrary property binding - you can attach a listener to a list of properties of an object. It will be invoked only when at least one of the listed properties have changed. Model class enables you to write code such as:

  var Car, ferrari;
  Car = function() {
     var self;
     self = this;
     // generating listener infrastructure (tie method), getters and setters
     funjes.Model.call(self, {
        'throttle' : 0,
        'gear' : 0,
        'wheel' : new F.Model({
           'angle' : 0
        })
        // this array marks that events in wheel model are reported to parent model (Car)
     }, ['wheel']);
     // when either gear or throttle changed, report speed
     self.tie(['gear', 'throttle'], function(g, t) {
        if(g < 1) {
           alert('car speed is zero, because gear is not set, but throttle is at ' + self.getFormattedThrottle());
        } else {
             alert('car speed is about ' + ((g - 1) * 80 * t) + ' m/s');
          }
     });
     self.tie('wheel.angle', function(a) {
        if(a === 0) {
           alert('now driving straight forward');
          } else {
           alert('now turning ' + ((a < 0) ? 'right' : 'left'));
        }
     });
     self.getFormattedThrottle = function() {
        return (self.getThrottle() * 100) + '%';
     };
  };
  ferrari = new Car();
  // when throttle is changed, report it
  ferrari.tie('throttle', function() {
     alert('Ferrari\'s throttle is now at ' + ferrari.getFormattedThrottle());
  });
  // getters and setters are generated from provided default values by Model.ize
  ferrari.setGear(5);
  ferrari.setThrottle(0.7);
  // or you should do this, when you can provide multiple values
  // this helps to avoid invoking listeners too often (for example that of a speed reporter)
  ferrari.set({'gear':5, 'throttle':1, 'wheel.angle':-45});
  

• graceful performance - you can check, whether a function is using the fastest possible, implemented natively by the platform (browser), code by searching the array funjes.emulated, for example funjes.emulated will contain a string 'funjes.reduceIndices' when running on Mozilla Firefox 1.5; or for example 'funjes.arrayIndexOf' when running on Microsoft Internet Explorer 6.0

• and much more not listed here

Links

• The home page is here
• The source code management system of funjes is on gitorious and github
• The Ohloh profile is here
• The bug/issue/task tracking system of funjes is here
• The latest online version of jsDoc reference is here. //NOTE: to browse the non-constructor elements you will have to click on the funjes namespace in the reference.//
• The latest online version of funjes build for JavaScript with entire set of features is here (and minified)

Compatibility

The testsuite is here

Development Conventions

Variables available to all funjes

• F - namespace of all funjes, it is also a function that takes a function and calls it back when all funjes are available
• R - the Res object
• F.emulated - a list of funjes, that had to fallback to pure javascript, instead of native implementation

The Res object

• it is used to listen and announce availability of funjes
• methods:
  • add(string of name of funjes that is to be announced that it is available)
  • set(funjes name string, funjes value) - same as add, but it also assigns the funjes, convenience method, user does not have to do it manually
  • when(array of funjes names strings, function to be invoked when the listed funjes are set)

Various notes

• no funjes must reassign other funjes

Code structure

All the central code is in directory "main". The folders describe what api's the containing files depend on (e.g. dhtml contains code, that is runnable only on platforms with HTML DOM support i.e. web browsers). Currently (as of 2009-10-09) some files are not where they should belong - these are bugs that will be fixed in nearest future.

Code style

These statements suggest strict rules on programming ECMAScript funjes that do not specify a target (they are used for all targets, i. e. those that are organized as a single file, not a folder with folders for targets) (that means the code must be absolutely portable).

• do not use 'on', 'add' as identifiers, since they are keywords in ActionScript
• do not assign any variables in 'var' statement, since it fails to compile for ActionScript 2 with mtasc
• conform to actionscript2-like variable declaration (cannot redeclare variables in that are already declared in inherited scopes), since it fails to compile for ActionScript 2 with mtasc
• instead of keyword 'delete' use funjes.unset
• do not use keywords 'instanceof', 'throw', 'try' and 'catch' - invent your own mechanisms using other techniques based on pure standard ECMAScript
• do not use any global Error constructors
• instead of Math.LOG10E, use funjes.LOG10E
• instead of eval, use (new Function(...var names and script to eval..))(...vars that the eval'ed script need...);
• carefully convert floats to string, because, for example, converting 0.0001 can result in '0.0001' or '1E-04'

Users

• Singleton Labs. website
• MonarchCharts documentation
• EVE
• Bookmarklets
• Cat