status-im
/
metro
mirror of https://github.com/status-im/metro.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

[react-packager] Modernize AssetServer to ES6

This commit is contained in:
Martín Bigio 2015-08-18 13:34:23 -07:00
parent 801dd2d133
commit f77f48c61c
2 changed files with 168 additions and 175 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

92
react-packager/src/AssetServer/__tests__/AssetServer-test.js vendored
View File

@ -8,22 +8,22 @@ jest
.mock('crypto') .mock('crypto')
.mock('fs'); .mock('fs');
var Promise = require('promise'); const Promise = require('promise');
describe('AssetServer', function() { describe('AssetServer', () => {
var AssetServer; let AssetServer;
var crypto; let crypto;
var fs; let fs;
beforeEach(function() { beforeEach(() => {
AssetServer = require('../'); AssetServer = require('../');
crypto = require('crypto'); crypto = require('crypto');
fs = require('fs'); fs = require('fs');
}); });
describe('assetServer.get', function() { describe('assetServer.get', () => {
pit('should work for the simple case', function() { pit('should work for the simple case', () => {
var server = new AssetServer({ const server = new AssetServer({
projectRoots: ['/root'], projectRoots: ['/root'],
assetExts: ['png'], assetExts: ['png'],
}); });
@ -40,15 +40,15 @@ describe('AssetServer', function() {
return Promise.all([ return Promise.all([
server.get('imgs/b.png'), server.get('imgs/b.png'),
server.get('imgs/b@1x.png'), server.get('imgs/b@1x.png'),
]).then(function(resp) { ]).then(resp =>
resp.forEach(function(data) { resp.forEach(data =>
expect(data).toBe('b image'); expect(data).toBe('b image')
}); )
}); );
}); });
pit('should work for the simple case with jpg', function() { pit('should work for the simple case with jpg', () => {
var server = new AssetServer({ const server = new AssetServer({
projectRoots: ['/root'], projectRoots: ['/root'],
assetExts: ['png', 'jpg'], assetExts: ['png', 'jpg'],
}); });
@ -65,16 +65,16 @@ describe('AssetServer', function() {
return Promise.all([ return Promise.all([
server.get('imgs/b.jpg'), server.get('imgs/b.jpg'),
server.get('imgs/b.png'), server.get('imgs/b.png'),
]).then(function(data) { ]).then(data =>
expect(data).toEqual([ expect(data).toEqual([
'jpeg image', 'jpeg image',
'png image', 'png image',
]); ])
}); );
}); });
pit('should pick the bigger one', function() { pit('should pick the bigger one', () => {
var server = new AssetServer({ const server = new AssetServer({
projectRoots: ['/root'], projectRoots: ['/root'],
assetExts: ['png'], assetExts: ['png'],
}); });
@ -90,13 +90,13 @@ describe('AssetServer', function() {
} }
}); });
return server.get('imgs/b@3x.png').then(function(data) { return server.get('imgs/b@3x.png').then(data =>
expect(data).toBe('b4 image'); expect(data).toBe('b4 image')
}); );
}); });
pit('should support multiple project roots', function() { pit('should support multiple project roots', () => {
var server = new AssetServer({ const server = new AssetServer({
projectRoots: ['/root', '/root2'], projectRoots: ['/root', '/root2'],
assetExts: ['png'], assetExts: ['png'],
}); });
@ -116,27 +116,23 @@ describe('AssetServer', function() {
}, },
}); });
return server.get('newImages/imgs/b.png').then(function(data) { return server.get('newImages/imgs/b.png').then(data =>
expect(data).toBe('b1 image'); expect(data).toBe('b1 image')
}); );
}); });
}); });
describe('assetSerer.getAssetData', function() { describe('assetSerer.getAssetData', () => {
pit('should get assetData', function() { pit('should get assetData', () => {
var hash = { const hash = {
update: jest.genMockFn(), update: jest.genMockFn(),
digest: jest.genMockFn(), digest: jest.genMockFn(),
}; };
hash.digest.mockImpl(function() { hash.digest.mockImpl(() => 'wow such hash');
return 'wow such hash'; crypto.createHash.mockImpl(() => hash);
});
crypto.createHash.mockImpl(function() {
return hash;
});
var server = new AssetServer({ const server = new AssetServer({
projectRoots: ['/root'], projectRoots: ['/root'],
assetExts: ['png'], assetExts: ['png'],
}); });
@ -152,7 +148,7 @@ describe('AssetServer', function() {
} }
}); });
return server.getAssetData('imgs/b.png').then(function(data) { return server.getAssetData('imgs/b.png').then(data => {
expect(hash.update.mock.calls.length).toBe(4); expect(hash.update.mock.calls.length).toBe(4);
expect(data).toEqual({ expect(data).toEqual({
type: 'png', type: 'png',
@ -163,20 +159,16 @@ describe('AssetServer', function() {
}); });
}); });
pit('should get assetData for non-png images', function() { pit('should get assetData for non-png images', () => {
var hash = { const hash = {
update: jest.genMockFn(), update: jest.genMockFn(),
digest: jest.genMockFn(), digest: jest.genMockFn(),
}; };
hash.digest.mockImpl(function() { hash.digest.mockImpl(() => 'wow such hash');
return 'wow such hash'; crypto.createHash.mockImpl(() => hash);
});
crypto.createHash.mockImpl(function() {
return hash;
});
var server = new AssetServer({ const server = new AssetServer({
projectRoots: ['/root'], projectRoots: ['/root'],
assetExts: ['png', 'jpeg'], assetExts: ['png', 'jpeg'],
}); });
@ -192,7 +184,7 @@ describe('AssetServer', function() {
} }
}); });
return server.getAssetData('imgs/b.jpg').then(function(data) { return server.getAssetData('imgs/b.jpg').then(data => {
expect(hash.update.mock.calls.length).toBe(4); expect(hash.update.mock.calls.length).toBe(4);
expect(data).toEqual({ expect(data).toEqual({
type: 'jpg', type: 'jpg',

171
react-packager/src/AssetServer/index.js vendored
View File

@ -8,20 +8,20 @@
*/ */
'use strict'; 'use strict';
var declareOpts = require('../lib/declareOpts'); const Promise = require('promise');
var getAssetDataFromName = require('../lib/getAssetDataFromName');
var path = require('path');
var Promise = require('promise');
var fs = require('fs');
var crypto = require('crypto');
var stat = Promise.denodeify(fs.stat); const crypto = require('crypto');
var readDir = Promise.denodeify(fs.readdir); const declareOpts = require('../lib/declareOpts');
var readFile = Promise.denodeify(fs.readFile); const fs = require('fs');
const getAssetDataFromName = require('../lib/getAssetDataFromName');
const path = require('path');
module.exports = AssetServer; const stat = Promise.denodeify(fs.stat);
const readDir = Promise.denodeify(fs.readdir);
const readFile = Promise.denodeify(fs.readFile);
var validateOpts = declareOpts({
const validateOpts = declareOpts({
projectRoots: { projectRoots: {
type: 'array', type: 'array',
required: true, required: true,
@ -32,13 +32,52 @@ var validateOpts = declareOpts({
}, },
}); });
function AssetServer(options) { class AssetServer {
var opts = validateOpts(options); constructor(options) {
const opts = validateOpts(options);
this._roots = opts.projectRoots; this._roots = opts.projectRoots;
this._assetExts = opts.assetExts; this._assetExts = opts.assetExts;
} }
/** get(assetPath) {
const assetData = getAssetDataFromName(assetPath);
return this._getAssetRecord(assetPath).then(record => {
for (let i = 0; i < record.scales.length; i++) {
if (record.scales[i] >= assetData.resolution) {
return readFile(record.files[i]);
}
}
return readFile(record.files[record.files.length - 1]);
});
}
getAssetData(assetPath) {
const nameData = getAssetDataFromName(assetPath);
const data = {
name: nameData.name,
type: nameData.type,
};
return this._getAssetRecord(assetPath).then(record => {
data.scales = record.scales;
return Promise.all(
record.files.map(file => stat(file))
);
}).then(stats => {
const hash = crypto.createHash('md5');
stats.forEach(fstat =>
hash.update(fstat.mtime.getTime().toString())
);
data.hash = hash.digest('hex');
return data;
});
}
/**
* Given a request for an image by path. That could contain a resolution * Given a request for an image by path. That could contain a resolution
* postfix, we need to find that image (or the closest one to it's resolution) * postfix, we need to find that image (or the closest one to it's resolution)
* in one of the project roots: * in one of the project roots:
@ -48,102 +87,61 @@ function AssetServer(options) {
* 3. We then build a map of all assets and their scales in this directory * 3. We then build a map of all assets and their scales in this directory
* 4. Then pick the closest resolution (rounding up) to the requested one * 4. Then pick the closest resolution (rounding up) to the requested one
*/ */
_getAssetRecord(assetPath) {
const filename = path.basename(assetPath);
AssetServer.prototype._getAssetRecord = function(assetPath) { return (
var filename = path.basename(assetPath); this._findRoot(
return findRoot(
this._roots, this._roots,
path.dirname(assetPath) path.dirname(assetPath)
).then(function(dir) { )
return Promise.all([ .then(dir => Promise.all([
dir, dir,
readDir(dir), readDir(dir),
]); ]))
}).then(function(res) { .then(res => {
var dir = res[0]; const dir = res[0];
var files = res[1]; const files = res[1];
var assetData = getAssetDataFromName(filename); const assetData = getAssetDataFromName(filename);
var map = buildAssetMap(dir, files); const map = this._buildAssetMap(dir, files);
var record = map[assetData.assetName]; const record = map[assetData.assetName];
if (!record) { if (!record) {
throw new Error('Asset not found'); throw new Error('Asset not found');
} }
return record; return record;
});
};
AssetServer.prototype.get = function(assetPath) {
var assetData = getAssetDataFromName(assetPath);
return this._getAssetRecord(assetPath).then(function(record) {
for (var i = 0; i < record.scales.length; i++) {
if (record.scales[i] >= assetData.resolution) {
return readFile(record.files[i]);
}
}
return readFile(record.files[record.files.length - 1]);
});
};
AssetServer.prototype.getAssetData = function(assetPath) {
var nameData = getAssetDataFromName(assetPath);
var data = {
name: nameData.name,
type: nameData.type,
};
return this._getAssetRecord(assetPath).then(function(record) {
data.scales = record.scales;
return Promise.all(
record.files.map(function(file) {
return stat(file);
}) })
); );
}).then(function(stats) { }
var hash = crypto.createHash('md5');
stats.forEach(function(fstat) { _findRoot(roots, dir) {
hash.update(fstat.mtime.getTime().toString());
});
data.hash = hash.digest('hex');
return data;
});
};
function findRoot(roots, dir) {
return Promise.all( return Promise.all(
roots.map(function(root) { roots.map(root => {
var absPath = path.join(root, dir); const absPath = path.join(root, dir);
return stat(absPath).then(function(fstat) { return stat(absPath).then(fstat => {
return {path: absPath, isDirectory: fstat.isDirectory()}; return {path: absPath, isDirectory: fstat.isDirectory()};
}, function (err) { }, err => {
return {path: absPath, isDirectory: false}; return {path: absPath, isDirectory: false};
}); });
}) })
).then( ).then(stats => {
function(stats) { for (let i = 0; i < stats.length; i++) {
for (var i = 0; i < stats.length; i++) {
if (stats[i].isDirectory) { if (stats[i].isDirectory) {
return stats[i].path; return stats[i].path;
} }
} }
throw new Error('Could not find any directories'); throw new Error('Could not find any directories');
});
} }
);
}
function buildAssetMap(dir, files) { _buildAssetMap(dir, files) {
var assets = files.map(getAssetDataFromName); const assets = files.map(getAssetDataFromName);
var map = Object.create(null); const map = Object.create(null);
assets.forEach(function(asset, i) { assets.forEach(function(asset, i) {
var file = files[i]; const file = files[i];
var record = map[asset.assetName]; let record = map[asset.assetName];
if (!record) { if (!record) {
record = map[asset.assetName] = { record = map[asset.assetName] = {
scales: [], scales: [],
@ -151,8 +149,8 @@ function buildAssetMap(dir, files) {
}; };
} }
var insertIndex; let insertIndex;
var length = record.scales.length; const length = record.scales.length;
for (insertIndex = 0; insertIndex < length; insertIndex++) { for (insertIndex = 0; insertIndex < length; insertIndex++) {
if (asset.resolution < record.scales[insertIndex]) { if (asset.resolution < record.scales[insertIndex]) {
break; break;
@ -163,4 +161,7 @@ function buildAssetMap(dir, files) {
}); });
return map; return map;
}
} }
module.exports = AssetServer;