Integration with Meteor.js, http://meteor.com

This commit is contained in:
Dan Dascalescu 2014-11-26 05:01:54 -08:00
parent ac4eb9e368
commit 28a1eafd74
6 changed files with 141 additions and 0 deletions

1
.gitignore vendored
View File

@ -30,3 +30,4 @@ src/website/settingslocal.py
stunnel.log
.ruby-version
.build*

13
meteor/README.md Normal file
View File

@ -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
meteor/package.js Normal file
View File

@ -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
meteor/publish.sh Executable file
View File

@ -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
meteor/runtests.sh Executable file
View File

@ -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
meteor/test.js Normal file
View File

@ -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();
});
});