Skip to content

Commit

Permalink
Integration with Meteor.js, http://meteor.com
Browse files Browse the repository at this point in the history
  • Loading branch information
dandv committed Nov 26, 2014
1 parent ea48d2e commit 0540aa0
Show file tree
Hide file tree
Showing 6 changed files with 141 additions and 0 deletions.
1 change: 1 addition & 0 deletions .gitignore
Expand Up @@ -30,3 +30,4 @@ src/website/settingslocal.py
stunnel.log

.ruby-version
.build*
13 changes: 13 additions & 0 deletions meteor/README.md
@@ -0,0 +1,13 @@
Packaging Font Awesome for Meteor.js, the most popular
full-stack JavaScript framework on GitHub (http://meteor.com).

# DONE

* Tests that fonts are downloadable
* Visual check

# TODO

* Figure out exactly what font files are needed and trim unnecessary ones (woff, eot, svg) - perhaps in specialized packages
* Read the `src/test.html` file into the test directly instead of via rawgit - how to do this with TinyTest?
* Explain the magic behind how Meteor resolves CSS `@font-face src url('../fonts/...')` to the correct `/packages/.../fonts/...` path
34 changes: 34 additions & 0 deletions meteor/package.js
@@ -0,0 +1,34 @@
// package metadata file for Meteor.js

var packageName = 'fortawesome:fontawesome'; // http://atmospherejs.com/fortawesome:fontawesome
var where = 'client'; // where to install: 'client', 'server', or ['client', 'server']

var packageJson = JSON.parse(Npm.require("fs").readFileSync('package.json'));

Package.describe({
name: packageName,
summary: 'Font Awesome (official): 470+ scalable vector icons, customizable via CSS, Retina friendly',
version: packageJson.version,
git: 'https://github.com/FortAwesome/Font-Awesome/'
});

Package.onUse(function (api) {
api.versionsFrom('METEOR@0.9.2.1');
api.addFiles([
'fonts/FontAwesome.otf', // TODO What exactly does this file do? Can we get rid of it?
'fonts/fontawesome-webfont.eot', // TODO What exactly does this file do? Can we get rid of it?
'fonts/fontawesome-webfont.svg', // TODO What exactly does this file do? Can we get rid of it?
'fonts/fontawesome-webfont.ttf', // This provides the actual font in Chrome
'fonts/fontawesome-webfont.woff', // TODO What exactly does this file do? Can we get rid of it?

'css/font-awesome.css'
], where);
});

Package.onTest(function (api) {
api.use(packageName, where);
api.use(['tinytest', 'http'], where);

// TODO we should just bring in src/test.html - but how to do that with TinyTest?
api.addFiles('meteor/test.js', where);
});
23 changes: 23 additions & 0 deletions meteor/publish.sh
@@ -0,0 +1,23 @@
# Publish package on Meteor's Atmosphere.js

# Make sure Meteor is installed, per https://www.meteor.com/install. The curl'ed script is totally safe; takes 2 minutes to read its source and check.
type meteor >/dev/null 2>&1 || { curl https://install.meteor.com/ | sh; }

# sanity check: make sure we're in the root directory of the checkout
DIR=$( cd "$( dirname "$0" )" && pwd )
cd $DIR/..

# Meteor expects package.js to be in the root directory of the checkout, so copy it there temporarily
cp meteor/package.js ./

# publish package, creating it if it's the first time we're publishing
PACKAGE_NAME=$(grep -i name package.js | head -1 | cut -d "'" -f 2)
PACKAGE_EXISTS=$(meteor search $PACKAGE_NAME 2>/dev/null | wc -l)

if [ $PACKAGE_EXISTS -gt 0 ]; then
meteor publish
else
meteor publish --create
fi

rm package.js
28 changes: 28 additions & 0 deletions meteor/runtests.sh
@@ -0,0 +1,28 @@
# Test Meteor package before publishing to Atmosphere.js

# Make sure Meteor is installed, per https://www.meteor.com/install. The curl'ed script is totally safe; takes 2 minutes to read its source and check.
type meteor >/dev/null 2>&1 || { curl https://install.meteor.com/ | sh; }

# sanity check: make sure we're in the root directory of the checkout
DIR=$( cd "$( dirname "$0" )" && pwd )
cd $DIR/..

# Meteor expects package.js to be in the root directory of the checkout, so copy it there temporarily
cp meteor/package.js ./

# run tests and delete the temporary package.js even if Ctrl+C is pressed
int_trap() {
echo
echo "Tests interrupted."
}

trap int_trap INT

meteor test-packages ./

PACKAGE_NAME=$(grep -i name package.js | head -1 | cut -d "'" -f 2)
rm -rf ".build.$PACKAGE_NAME"
rm -rf ".build.local-test:$PACKAGE_NAME"
rm versions.json 2>/dev/null

rm package.js
42 changes: 42 additions & 0 deletions meteor/test.js
@@ -0,0 +1,42 @@
'use strict';

// Check that the font files are downloadable. Meteor places assets at /packages/<packageName>/.
// Only the TTF actually does anything in Chrome.
['eot', 'svg', 'ttf', 'woff'].forEach(function (font) {
Tinytest.addAsync(font + ' fonts are shipped', function (test, done) {

HTTP.get('/packages/fortawesome_fontawesome/fonts/fontawesome-webfont.' + font, function callback(error, result) {
if (error) {
test.fail({message: 'Font failed to load'});
} else {
test.isTrue(result.content.length > 10000, font + ' font could not be downloaded');
}

done();
});
});
});


// Visual check. Fonts are set by font-awesome.css in @font-face { src: url('../fonts/...') }.
// TODO How does Meteor find those occurrences in the source and resolve them to /packages/<packageName>/fonts/... ?
Tinytest.addAsync('Visual check', function (test, done) {
var iconsDropZone = document.createElement('div');
iconsDropZone.style.height = '10em';
document.body.appendChild(iconsDropZone);


// TODO ideally we'd get src/test HTML straight from this repo, but no idea how to do this from TinyTest
HTTP.get('https://rawgit.com/FortAwesome/Font-Awesome/master/src/test.html', function callback(error, result) {
if (error) {
test.fail('Error getting the icons. Do we have an Internet connection to rawgit.com?');
} else {
// [^] matches across newlines. Exclude the Stacked Icons section and below, because they transclude some other HTML.
iconsDropZone.innerHTML = result.content.match(/<section[^]+(?=<h3>Stacked)/);
test.ok({message: 'Test passed if the icons look OK.'});
}

done();
});

});

0 comments on commit 0540aa0

Please sign in to comment.