Permalink
Browse files

initial commit - version 0.0.1

  • Loading branch information...
0 parents commit 890b2e40fb99d03bfe8cafb7531a6e2f8bf67cc6 @mateuszwozniak committed Apr 24, 2013
Showing with 1,443 additions and 0 deletions.
  1. +4 −0 .gitignore
  2. +190 −0 README.md
  3. +52 −0 bin/glint
  4. +3 −0 index.js
  5. +35 −0 package.json
  6. +58 −0 src/BundleParser.js
  7. +80 −0 src/FileProcessor.js
  8. +84 −0 src/Glint.js
  9. +50 −0 src/IndexBuilder.js
  10. +87 −0 src/PackageBuilder.js
  11. +182 −0 src/PackageWriter.js
  12. +83 −0 src/adapters/express.js
  13. +5 −0 src/adapters/index.js
  14. +8 −0 src/index.js
  15. +9 −0 src/postprocessors/clean-css.js
  16. +4 −0 src/postprocessors/index.js
  17. +10 −0 src/postprocessors/uglify-js.js
  18. +4 −0 src/preprocessors/index.js
  19. +29 −0 src/preprocessors/jade.js
  20. +28 −0 src/preprocessors/stylus.js
  21. +111 −0 test/e2e/createPackages.specs.js
  22. +2 −0 test/fixtures/assets/file1.js
  23. +2 −0 test/fixtures/assets/file2.js
  24. +4 −0 test/fixtures/assets/gallery.css
  25. +2 −0 test/fixtures/assets/gallery.js
  26. +12 −0 test/fixtures/assets/styles.styl
  27. +6 −0 test/fixtures/assets/template.jade
  28. +1 −0 test/fixtures/assets/variables.styl
  29. +48 −0 test/fixtures/config.js
  30. +10 −0 test/fixtures/filesIndex.js
  31. +9 −0 test/fixtures/filesList.js
  32. +14 −0 test/fixtures/finalPackages.js
  33. +20 −0 test/fixtures/manifestContent.js
  34. +34 −0 test/fixtures/parsedPackages.js
  35. +4 −0 test/fixtures/processedAssets/gallery.css
  36. +2 −0 test/fixtures/processedAssets/gallery.js
  37. +1 −0 test/fixtures/processedAssets/gallery.package.css
  38. +1 −0 test/fixtures/processedAssets/gallery.package.js
  39. +11 −0 test/fixtures/processedAssets/styles.styl.css
  40. +57 −0 test/fixtures/processedAssets/template.jade.js
  41. +16 −0 test/setup.js
  42. +32 −0 test/unit/BundleParser.specs.js
  43. +24 −0 test/unit/IndexBuilder.specs.js
  44. +15 −0 test/unit/PackageBuilder.specs.js
@@ -0,0 +1,4 @@
+.DS_Store
+node_modules/
+.idea/
+test/fixtures/output/
@@ -0,0 +1,190 @@
+#Glint
+Glint is an asset (css, js, whatever-you-need) management tool for your project.
+It helps you better organize files you serve to browser, as well as process them with any processor you need, even with your own one.
+
+For now it works with express.js but you can simply adjust it to your project and technology.
+
+##Features:
+- creating named 'packages' from your assets (e.g. jquery-ui, my-tools, etc.)
+- merging, processing, compressing files for production environment
+- generating separate files for development process
+- watching for changes and rebuilding suitable packages
+- switching between merged, compressed files and separate files with query parameter (in express.js)
+- support for jade and stylus (more in progress)
+
+##How it works:
+1. Create config file with packages (or simply files) you want to serve to your application
+2. Specify output directory in config
+3. Specify preprocessors (optional) and postprocessors (optional)
+4. Run glint
+5. Inject created packages to your project.
+
+##How to do that:
+###Installation
+```javascript
+npm install glint
+```
+###Creating config file
+```javascript
+
+module.exports = {
+ /** directory with files you want to use in your project (relative path to this file) */
+ assetsDir: 'assets',
+ /** directory where processed files will be saved (relative path to this file) */
+ outputDir: 'output',
+ /** path to file with information about generated packages (relative path to this file) */
+ manifest: 'output/manifest.json',
+ /** preprocessors you want to use (explained below) */
+ preprocessors: {},
+ /** postprocessors you want to use (explained below) */
+ postprocessors: {},
+
+ /** definitions with your packages */
+ packages: [
+ {
+ /** package name - you can use it as requirement for another package */
+ name: 'core',
+ /** generate output file for this package - only packages with final set to true will be saved to output directory
+ this gives you possibility to create a bunch of small, reusable packages which will be included in final packages */
+ final: false,
+ /* list of files for this package - files paths are relative to directory passed as 'assetsDir', so in this case
+ we are using files: assets/file1.js, assets/file2.js */
+ files: [
+ 'file1.js',
+ 'file2.js'
+ ]
+ },
+ {
+ name: 'gallery',
+ final: true,
+ /** list of required packages - files from packages listed here will be included before files from this package */
+ require: ['templates'],
+ files: [
+ 'gallery.js',
+ 'gallery.css'
+ ]
+ },
+ {
+ name: 'templates',
+ final: false,
+ files: [
+ 'template.jade',
+ 'styles.styl'
+ ]
+ }
+ ]
+};
+```
+
+###Preprocessors
+Preprocessors are functions that will receive raw content of your files, and will generate from this content final file content (e.g. generate css files from stylus files).
+For now jade and stylus are supported.
+Definition looks like this:
+```javascript
+var preprocessors = require('glint').preprocessors;
+var stylus = preprocessors.stylus;
+var jade = preprocessors.jade;
+
+module.exports = {
+ ...
+ preprocessors: {
+ /** for files with extensions 'styl' use stylus */
+ styl: stylus,
+
+ /** for files with extensions 'jade' use jade
+ you can also pass object with preprocessor as fn and options for this preprocessor */
+ jade: {
+ fn: jade,
+ options: {
+ pretty: true
+ }
+ }
+ },
+ ...
+};
+
+```
+For now you can use only one preprocessor per file extension.
+
+###Postprocessors
+Postprocessors are functions that will receive content of your merged packages, and will generate from this content final package content (e.g. uglify/compress merged package)
+Definition looks like this:
+```javascript
+var postprocessors = require('glint').postprocessors;
+var cleanCss = postprocessors['clean-css'];
+var uglifyJs = postprocessors['uglify-js'];
+
+module.exports = {
+ ...
+ postprocessors: {
+ /** for css files use clean-css */
+ css: [cleanCss],
+ /** for js files use uglify-js - you can also pass options here */
+ js: [{
+ fn: uglifyJs,
+ options: {
+ unsafe: true
+ }
+ }]
+ },
+ ...
+};
+
+
+```
+
+###Run Glint
+```javascript
+./node_modules/.bin/glint --config path/to/config/file.js
+```
+This will create your packages, preprocess and postprocess them, save them to output directories and create manifest.json file.
+Now you have your packages ready to use. You just have to use them in your application
+
+###Using packages with express.js
+```javascript
+// file clientlibs/config.js
+module.exports = {
+ assetsDir: 'assets',
+ outputDir: 'output',
+ manifest: 'output/manifest.json',
+ packages: [
+ {
+ name: 'gallery',
+ final: true,
+ files: [
+ 'gallery.css',
+ 'jquery.js',
+ 'gallery.js'
+ ]
+ }
+ ]
+};
+
+```
+
+```javascript
+// file server.js
+
+var express = require('express');
+
+// import glint adapter for express
+var glintForExpress = require('glint').adapters.express;
+
+var app = express();
+// add glint to express application
+app.use(glintForExpress('output/mainfest.json'));
+
+app.get('/', function (req, res) {
+ // now you have assets variable in res.locals
+ // you can access final packages via package_name.files_category
+ var body = '<html><head>' + res.locals.assets.gallery.css + '</head><body>' + res.locals.assets.gallery.js + '</body></html>';
+ res.setHeader('Content-Type', 'text/html');
+ res.setHeader('Content-Length', body.length);
+ res.end(body);
+});
+
+app.listen(3000);
+console.log('Listening on port 3000');
+```
+
+TBC...
@@ -0,0 +1,52 @@
+#!/usr/bin/env node
+
+'use strict';
+
+var path = require('path');
+var program = require('commander');
+var package_data = require('../package.json');
+var Glint = require('../src/Glint');
+
+
+program
+ .version(package_data.version)
+ .option('-c, --config <path>', 'path to config file', String)
+ .option('-w, --watch', 'watch for file changes', Boolean)
+ .option('-d, --dev', 'use development mode - do not merge and process files', Boolean);
+
+program.parse(process.argv);
+var config = initConfig();
+var glint = new Glint(config);
+glint.run();
+
+function initConfig() {
+ var config;
+ if (!program.config) {
+ console.error('[ERROR] Can not start without config file!');
+ process.exit(-1);
+ }
+
+ var absConfigPath = path.normalize(path.join(process.cwd(), program.config));
+ try {
+ config = require(absConfigPath);
+ } catch (ex) {
+ console.log('[ERROR] Can not open config file: ', configPath);
+ process.exit(-1);
+ }
+
+ var configDir = path.dirname(absConfigPath);
+ var outputPath = path.join(configDir, config.outputDir);
+ config.outputDir = path.normalize(outputPath);
+ config.baseDir = configDir;
+
+ var assetsPath = path.join(configDir, config.assetsDir);
+ config.assetsDir = path.normalize(assetsPath);
+
+ config.watch = program.watch;
+ config.dev = program.dev;
+
+ config.preprocessors = config.preprocessors || {};
+ config.postprocessors = config.postprocessors || {};
+
+ return config;
+}
@@ -0,0 +1,3 @@
+'use strict';
+
+module.exports = require('./src');
@@ -0,0 +1,35 @@
+{
+ "name": "glint",
+ "version": "0.0.1",
+ "author": "Mateusz Wozniak <mateusz@wozniak.io>",
+ "description": "Glint is an asset (css, js, whatever-you-need) management that helps you organize and manage your client side files",
+ "keywords": ["packer", "build", "compress", "glint", "assets"],
+ "dependencies": {
+ "async": "0.2.6",
+ "commander": "1.1.x",
+ "fs.notify": "0.0.x",
+ "fs-extra": "0.5.x",
+ "nib": "0.9.x",
+ "stylus": "0.29.x",
+ "jade": "0.28.x",
+ "clean-css": "0.10.x",
+ "uglify-js": "2.2.x"
+ },
+ "devDependencies": {
+ "mocha": "*",
+ "chai": "*"
+ },
+ "repository": {
+ "type": "git",
+ "url": "git://github.com/mateuszwozniak/glint.git"
+ },
+ "engines": {
+ "node": ">= 0.4.0"
+ },
+ "scripts": {
+ "test": "./node_modules/.bin/mocha --timeout 5000 --reporter spec test/*.js test/unit/*.js test/e2e/*.js"
+ },
+ "bin": {
+ "glint": "./bin/glint"
+ }
+}
@@ -0,0 +1,58 @@
+'use strict';
+module.exports = BundleParser;
+
+var fs = require('fs');
+var path = require('path');
+
+function BundleParser(rawBundle, assetsDir) {
+
+ this.parse = function () {
+ updateFilesPaths();
+ checkFiles();
+ };
+
+ function updateFilesPaths() {
+ rawBundle.forEach(updateFilesPathsInPackage);
+ }
+
+ function updateFilesPathsInPackage(pkg) {
+ var files = pkg.files.map(function updateFilePath(filePath) {
+ var pth = path.join(assetsDir, filePath);
+ return path.normalize(pth);
+ });
+ pkg.files = files;
+ }
+
+ function checkFiles() {
+ var fileChecker = new FileChecker(rawBundle);
+ if (!fileChecker.check()) {
+ throw new Error('File : ' + fileChecker.getLastFailedFile() + 'does not exists!');
+ }
+ }
+}
+
+function FileChecker(packages) {
+ var lastFailedFile;
+
+ this.getLastFailedFile = function () {
+ return lastFailedFile;
+ };
+
+ this.check = function () {
+ return packages.every(checkFilesFromPackage);
+ };
+
+ function checkFilesFromPackage(pkg) {
+ var files = pkg.files;
+
+ for (var i = 0, len = files.length; i < len; i++) {
+ if (!fs.existsSync(files[i])) {
+ lastFailedFile = files[i];
+ return false;
+ }
+ }
+
+ return true;
+ }
+}
+
Oops, something went wrong.

0 comments on commit 890b2e4

Please sign in to comment.