Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
gulp-retina-resizer
Advanced tools
gulp-retina-resizer - npm Package Compare versions
Comparing version 0.2.2 to 0.3.0
135
index.js
| 'use strict'; | ||
| let through = require('through2'); | ||
| let gutil = require('gulp-util'); | ||
| let gUtil = require('gulp-util'); | ||
| let gm = require('gm'); | ||
| let CreateError = gutil.PluginError; | ||
| let CreateFile = gutil.File; | ||
| let CreateFile = gUtil.File; | ||
| let CreateError = gUtil.PluginError; | ||
| module.exports = function(arg) { | ||
| let argTo = arg && arg.to; | ||
| let toConf = Array.isArray(argTo) ? argTo.map(num => Number.parseInt(num)) : [Number.parseInt(argTo) || 1]; | ||
| const BASE = 3 === Number.parseInt(arg && arg.base) ? 3 : 2; | ||
| const TO = { | ||
| one: -1 !== toConf.indexOf(1), | ||
| two: (2 !== BASE) && ( 2 !== toConf.indexOf(2)) | ||
| }; | ||
| const COPY = Boolean(arg && arg.copy); | ||
| let args = Object(arg); | ||
| let to = args.to; | ||
| let toArr = Array.isArray(to) ? to.map(int => parseInt(int)) : [parseInt(to) || 1]; | ||
| return through.obj(function(file, encoding, cb) { | ||
| if(!file.isBuffer()) { | ||
| return cb(null, file); | ||
| } | ||
| const BASE = 3 === parseInt(args.base) ? 3 : 2; | ||
| const ONE = -1 !== toArr.indexOf(1); | ||
| const TWO = (2 !== BASE) && ( -1 !== toArr.indexOf(2)); | ||
| const COPY = Boolean(args.copy); | ||
| const GM = Boolean(args.im) ? gm.subClass({imageMagick: true}) : gm; | ||
| let handler = new Promise(function(resolve, reject) { | ||
| return gm(file.path).identify(function(err, info) { | ||
| function getInfo(path) { | ||
| return new Promise(function(resolve, reject) { | ||
| return GM(path).identify(function(err, info) { | ||
| if(err) { | ||
@@ -34,53 +31,67 @@ return reject(err); | ||
| }); | ||
| } | ||
| let createFile = data => this.push(new CreateFile({ | ||
| function createName(path, to) { | ||
| let rule = /[\\\/]+([^\\\/@]+)(@\dx)?\.[^\.\\\/]+$/i; | ||
| let name = rule.exec(path)[1]; | ||
| if(1 !== to) { | ||
| name += '@' + to + 'x'; | ||
| } | ||
| name += '.png'; | ||
| return name; | ||
| } | ||
| function createBuffer(info, to) { | ||
| let size = info.size; | ||
| let path = info.path; | ||
| let width = Math.ceil(size.width / BASE * to); | ||
| let height = Math.ceil(size.height / BASE * to); | ||
| let borderWidth = Math.ceil(width / to) * to - width; | ||
| let borderHeight = Math.ceil(height / to) * to - height; | ||
| let workFlow = GM(path).resize(width, height); | ||
| if(borderWidth || borderHeight) { | ||
| workFlow = workFlow | ||
| .borderColor('transparent') | ||
| .border(borderWidth, borderHeight) | ||
| .crop(width + borderWidth, height + borderHeight, Math.floor(borderWidth / 2), Math.floor(borderHeight /2)); | ||
| } | ||
| return new Promise(function(resolve, reject) { | ||
| return workFlow.toBuffer('png', function(err, buffer) { | ||
| if(err) { | ||
| return reject(err); | ||
| } | ||
| let name = createName(path, to); | ||
| return resolve({buffer, name}); | ||
| }); | ||
| }); | ||
| } | ||
| function transform(file, encoding, callback) { | ||
| if(!file.isBuffer() && !file.isStream()) { | ||
| return callback(); | ||
| } | ||
| let addFiles = datas => datas.forEach(data => this.push(new gUtil.File({ | ||
| cwd : './', | ||
| path : data.name, | ||
| contents: Buffer.concat([data.buffer]) | ||
| })); | ||
| }))); | ||
| let getName = function(path, to) { | ||
| return /[\\\/]+([^\\\/@]+)(@\dx)?\.[^\.\\\/]+$/.exec(path)[1] + (1 == to ? '' : '@' + to + 'x' ) + '.png'; | ||
| }; | ||
| return getInfo(file.path) | ||
| .then(function(info) { | ||
| let promises = []; | ||
| ONE && promises.push(createBuffer(info, 1)); | ||
| TWO && promises.push(createBuffer(info, 2)); | ||
| COPY && promises.push(createBuffer(info, BASE)); | ||
| return Promise.all(promises).then(function(datas) { | ||
| addFiles(datas); | ||
| return callback(); | ||
| }) | ||
| }) | ||
| .catch(error => console.warn(error)); | ||
| } | ||
| let makePromise = function(info, to) { | ||
| let size = info.size; | ||
| let resize = { | ||
| width: Math.ceil(size.width/BASE)*to, | ||
| height: Math.ceil(size.height/BASE)*to | ||
| }; | ||
| let path = info.path; | ||
| let name = getName(path, to); | ||
| return new Promise(function(resolve, reject) { | ||
| return gm(path).resize(resize.width).toBuffer('png', function(err, buffer) { | ||
| if(err) { | ||
| return reject(err); | ||
| } | ||
| return resolve({buffer, name}); | ||
| }); | ||
| }); | ||
| }; | ||
| return handler.then(function(info) { | ||
| let promises = []; | ||
| if(TO.one) { | ||
| promises.push(makePromise(info, 1)); | ||
| } | ||
| if(TO.two) { | ||
| promises.push(makePromise(info, 2)); | ||
| } | ||
| return Promise.all(promises).then(datas => datas.forEach(data => createFile(data))); | ||
| }) | ||
| .then(function() { | ||
| if(COPY) { | ||
| createFile({ | ||
| name: getName(file.path, BASE), | ||
| buffer: file.contents | ||
| }); | ||
| } | ||
| return cb(); | ||
| }) | ||
| .catch(err => this.emit('error', err)); | ||
| }); | ||
| return through.obj(transform); | ||
| }; |
| { | ||
| "name": "gulp-retina-resizer", | ||
| "version": "0.2.2", | ||
| "version": "0.3.0", | ||
| "description": "resize images", | ||
@@ -20,4 +20,4 @@ "main": "index.js", | ||
| "author": { | ||
| "name": "HaoyCn", | ||
| "email": "xuhaoyang@live.com" | ||
| "name": "HaoyCn", | ||
| "email": "xuhaoyang@live.com" | ||
| }, | ||
@@ -29,6 +29,6 @@ "license": "MIT", | ||
| "dependencies": { | ||
| "gulp-util": "*", | ||
| "gm": "*", | ||
| "through2": "*" | ||
| "gulp-util": "*", | ||
| "gm": "*", | ||
| "through2": "*" | ||
| } | ||
| } |
@@ -5,47 +5,44 @@ 本插件用于在 Gulp 中转换图片大小，可从3倍图转换到2倍或1倍，也可从2倍转到1倍。 | ||
| 本插件依赖 gm，故也须安装本地软件 GraphicsMagick。 | ||
| 本插件依赖 gm，故也须安装本地软件 GraphicsMagick 或 ImageMagick。 | ||
| ##使用方法 ## | ||
| ``` | ||
| 'use strict'; | ||
| let gulp = require('gulp'); | ||
| let resizer = require('gulp-retina-resizer'); | ||
| gulp.task('default', function() { | ||
| gulp.src('slice/*.png') | ||
| .pipe(resizer({ | ||
| base: 3, | ||
| to: [1, 2], | ||
| copy: true, | ||
| im: true | ||
| })) | ||
| .pipe(gulp.dest('dest')) | ||
| }); | ||
| 'use strict'; | ||
| let gulp = require('gulp'); | ||
| let resizer = require('gulp-retina-resizer'); | ||
| ### 参数说明 ### | ||
| gulp.task('default', function() { | ||
| gulp.src('slice/*.png') | ||
| .pipe(resizer({ | ||
| base: 3, | ||
| to: [1, 2], | ||
| copy: true | ||
| })) | ||
| .pipe(gulp.dest('dest')) | ||
| }); | ||
| 如上例子，`resizer` 接受一个对象作为参数（可选），默认为 | ||
| ``` | ||
| ### 参数说明 ### | ||
| { | ||
| base: 2, | ||
| to: 1, | ||
| copy: false, | ||
| im: false | ||
| } | ||
| 如上例子，`resizer` 接受一个对象作为参数（可选），默认为 | ||
| ``` | ||
| { | ||
| base: 2, | ||
| to: 1, | ||
| copy: false | ||
| } | ||
| ``` | ||
| 1. `base`：数字，是原始图的倍数比 | ||
| 2. `to`：数字或数组，生成图的倍数比 | ||
| 3. `copy`: 布尔值，是否添加按原始图的倍数比生成的图 | ||
| 4. `im`：布尔值，为 true 时使用 ImageMagick 处理图片，否则使用 GraphicsMagick | ||
| - `base`：数字，是原始图的倍数比 | ||
| - `to`：数字或数组，生成图的倍数比 | ||
| - `copy`: 布尔值，是否复制原图到目的文件夹 | ||
| 生成的图片的尺寸将保证可以被生成图的倍数比整除。例如：大小为60x61的3倍图转2倍图时，得到的2倍图大小为40x42，如果 `copy` 为 `true`，还将得到60x63的3倍图。 | ||
| 计算方式： | ||
| ``` | ||
| Math.ceil(原始图宽/原始图倍数比)*生成图倍数比 | ||
| ``` | ||
| 可从3倍图转换到2倍或1倍，亦可从2倍转到1倍。即只能由高到低，不能由低到高。 |
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by19.78%
4578
- Lines of code
- increased by10.96%
81
Worsened metrics
- Number of lines in readme file
- decreased by-6%
47
No dependency changes