index.js

var path = require('path');
var fs = require('fs');
var postcss = require('postcss');
var _ = require('lodash');
var spritesmith = require('spritesmith').run;
var mkdirp = require('mkdirp');
var md5 = require('spark-md5').hash;
var revHash = require('rev-hash');
var Promise = require('bluebird');
var colors = require('ansi-colors');
var fancyLog = require('fancy-log');
var SVGSpriter = require('svg-sprite');

var space = postcss.list.space;
Promise.promisifyAll(fs);

// @media rule for @2x resolutions
var resolutions2x = [
  'only screen and (-webkit-min-device-pixel-ratio: 2)',
  'only screen and (min--moz-device-pixel-ratio: 2)',
  'only screen and (-o-min-device-pixel-ratio: 2/1)',
  'only screen and (min-device-pixel-ratio: 2)',
  'only screen and (min-resolution: 2dppx)',
  'only screen and (min-resolution: 192dpi)'
];

// @media rule for @3x resolutions. currently only work in some mobile devices
var resolutions3x = [
  'only screen and (-webkit-min-device-pixel-ratio: 3)',
  'only screen and (min-resolution: 3dppx)'
];

var GROUP_DELIMITER = '.';
var GROUP_MASK = '*';
var GROUP_SVG_FLAG = '@svgGroup';

var SVG_CONFIG = {
  mode: {
    css: {
      dimensions: true,
      bust: false,
      render: {
        css: true
      }
    }
  },
  shape: {
    id: {
      generator: function (name, file) {
        return path.relative(process.cwd(), file.path).split(path.sep).join('|');
      }
    }
  },
  svg: {
    precision: 5
  }
};

// Cache objects
var cache = {};
var cacheIndex = {};

/* --------------------------------------------------------------
 # Main functions
 -------------------------------------------------------------- */
module.exports = postcss.plugin('postcss-lazysprite', function (options) {
  // Default Options
  options = options || {};

  options = _.merge({
    cloneRaws: options.cloneRaws || {},
    groupBy: options.groupBy || [],
    padding: options.padding ? options.padding : 10,
    nameSpace: options.nameSpace || '',
    outputDimensions: options.outputDimensions || true,
    outputExtralCSS: options.outputExtralCSS || false,
    smartUpdate: options.smartUpdate || false,
    retinaInfix: options.retinaInfix || '@', // Decide '@2x' or '_2x'
    logLevel: options.logLevel || 'info', // 'debug','info','slient'
    cssSeparator: options.cssSeparator || '__', // Separator between block and element.
    pseudoClass: options.pseudoClass || false
  }, options);

  // Option `stylesheetPath` is deprecated,
  // so has to give a tip for preview users.
  if (options.stylesheetPath) {
    throw log(options.logLevel, 'lv1', ['Lazysprite:', colors.red('Option `stylesheetPath` was deprecated!' +
      ' Please use `stylesheetRelative` to replace.')]);
  }

  // Option `imagePath` is required
  if (!options.imagePath) {
    throw log(options.logLevel, 'lv1', ['Lazysprite:', colors.red('Option `imagePath` is undefined!' +
      ' Please set it and restart.')]);
  }

  // Option `stylesheetInput` is required
  if (!options.stylesheetInput) {
    throw log(options.logLevel, 'lv1', ['Lazysprite:', colors.red('Option `stylesheetInput` is undefined!' +
      ' Please set it and restart.')]);
  }

  // Option `smartUpdate` is deprecated
  if (options.smartUpdate) {
    throw log(options.logLevel, 'lv1', ['Lazysprite:', colors.red('Option `smartUpdate` is deprecated since v2.0!')]);
  }

  // Paths
  options.imagePath = path.resolve(process.cwd(), options.imagePath || '');
  options.spritePath = path.resolve(process.cwd(), options.spritePath || '');

  // Group retina images
  options.groupBy.unshift(function (image) {
    if (image.ratio > 1) {
      return '@' + image.ratio + 'x';
    }

    return null;
  });

  // Svg sprite config
  options.svgsprite = SVG_CONFIG;

  // Processer
  return function (css) {
    return extractImages(css, options)
      .spread(function (images, options) {
        return applyGroupBy(images, options);
      })
      .spread(function (images, options) {
        return setTokens(images, options, css);
      })
      .spread(function (images, options) {
        return runSpriteSmith(images, options);
      })
      .spread(function (images, options, sprites) {
        return saveSprites(images, options, sprites);
      })
      .spread(function (images, options, sprites) {
        return mapSpritesProperties(images, options, sprites);
      })
      .spread(function (images, options, sprites) {
        return updateReferences(images, options, sprites, css);
      })
      .catch(function (err) {
        throw log(options.logLevel, 'lv1', ['Lazysprite:', colors.red(err.message)]);
      });
  };
});

/**
 * Walks the @lazysprite atrule and get the value to extract the target images.
 * @param  {Node}   css
 * @param  {Object} options
 * @return {Promise}
 */
function extractImages(css, options) {
  var images = [];
  var stylesheetRelative = options.stylesheetRelative || path.dirname(css.source.input.file);

  if (!stylesheetRelative) {
    log(options.logLevel, 'lv1', ['Lazysprite:', colors.red('option `stylesheetRelative` is undefined!')]);
  }

  // When the css file is in the second or more depth level directory of destination
  // which relative to `stylesheetRelative`,
  // ref path in css will wrong, so has to be fix it.
  if (css.source.input.file) {
    var stylesheetInputDirRelative = path.relative(options.stylesheetInput, path.dirname(css.source.input.file));
    stylesheetRelative = path.join(stylesheetRelative, stylesheetInputDirRelative);
  }

  // Find @lazysprite string from css
  css.walkAtRules('lazysprite', function (atRule) {
    // Get the directory of images from atRule value
    var params = space(atRule.params);
    var atRuleValue = getAtRuleValue(params);
    var sliceDir = atRuleValue[0];

    // Get absolute path of directory.
    var imageDir = path.resolve(options.imagePath, sliceDir);

    // Check whether dir exist.
    if (!fs.existsSync(imageDir)) {
      log(options.logLevel, 'lv1', ['Lazysprite:', colors.red('No exist "' + imageDir + '"')]);
      return null;
    }

    // Get indent format of the css content.
    var atRuleNext = atRule.parent.nodes;
    var rawNode = _.find(atRuleNext, function (node) {
      return node.type === 'rule';
    });

    // Store the indent format.
    if (rawNode === undefined) {
      options.cloneRaws.between = '';
      options.cloneRaws.after = '';
    } else {
      options.cloneRaws.between = rawNode.raws.between;
      options.cloneRaws.after = rawNode.raws.after;
    }

    // Foreach the images and set image object.
    var files = fs.readdirSync(imageDir);
    files = _.orderBy(files); // Fix orders issue in mac and win's difference.
    _.forEach(files, function (filename) {
      // Have to be png or svg file
      var reg = /\.(png|svg)\b/i;
      if (!reg.test(filename)) {
        return null;
      }

      var image = {
        path: null, // Absolute path
        name: null, // Filename
        stylesheetRelative: stylesheetRelative,
        ratio: 1,
        groups: [],
        isSVG: false,
        token: ''
      };

      image.name = filename;

      // Set the directory name as sprite file name,
      // .pop() to get the last element in array
      image.dir = imageDir.split(path.sep).pop();
      image.groups = [image.dir];

      // For svg file
      if (/^\.svg/.test(path.extname(filename))) {
        image.isSVG = true;
        image.groups.push('GROUP_SVG_FLAG');
      }

      image.selector = setSelector(image, options, atRuleValue[1]);

      // Get absolute path of image
      if (isUrl(filename)) {
        image.path = filename;
      } else {
        image.path = path.resolve(imageDir, filename);
      }

      // For retina
      if (isRetinaImage(image.name)) {
        image.ratio = getRetinaRatio(image.name);
        image.selector = setSelector(image, options, atRuleValue[1], true);
      }

      // Push image obj to array.
      images.push(image);
    });
  });
  return Promise.resolve([images, options]);
}

/**
 * Apply groupBy functions over collection of exported images.
 * @param  {Object} options
 * @param  {Array}  images
 * @return {Promise}
 */
function applyGroupBy(images, options) {
  return Promise.reduce(options.groupBy, function (images, group) {
    return Promise.map(images, function (image) {
      return Promise.resolve(group(image)).then(function (group) {
        if (group) {
          image.groups.push(group);
        }

        return image;
      }).catch(function (image) {
        return image;
      });
    });
  }, images).then(function (images) {
    return [images, options];
  });
}

/**
 * Set the necessary tokens info to the background declarations.
 * @param  {Node}   css
 * @param  {Object} options
 * @param  {Array}  images
 * @return {Promise}
 */
function setTokens(images, options, css) {
  return new Promise(function (resolve) {
    css.walkAtRules('lazysprite', function (atRule) {
      // Get the directory of images from atRule value
      var params = space(atRule.params);
      var atRuleValue = getAtRuleValue(params);
      var sliceDir = atRuleValue[0];
      var sliceDirname = sliceDir.split(path.sep).pop();
      var atRuleParent = atRule.parent;
      var mediaAtRule2x = postcss.atRule({
        name: 'media',
        params: resolutions2x.join(', ')
      });
      var mediaAtRule3x = postcss.atRule({
        name: 'media',
        params: resolutions3x.join(', ')
      });

      // Tag flag
      var has2x = false;
      var has3x = false;

      const usePseudoBefore = options.usePseudoBefore;

      if (options.outputExtralCSS) {
        var outputExtralCSSRule = postcss.rule({
          selector: '.' + options.nameSpace + (atRuleValue[1] ? atRuleValue[1] : sliceDirname),
          source: atRule.source
        });

        outputExtralCSSRule.append({
          prop: 'display',
          value: 'inline-block'
        });
        outputExtralCSSRule.append({
          prop: 'overflow',
          value: 'hidden'
        });
        outputExtralCSSRule.append({
          prop: 'font-size',
          value: '0'
        });
        outputExtralCSSRule.append({
          prop: 'line-height',
          value: '0'
        });
        atRule.before(outputExtralCSSRule);
      }

      // Foreach every image object
      _.forEach(images, function (image) {
        // Only work when equal to directory name
        if (sliceDirname === image.dir) {
          image.token = postcss.comment({
            text: image.path,
            raws: {
              between: options.cloneRaws.between,
              after: options.cloneRaws.after,
              left: '@replace|',
              right: ''
            }
          });

          var selector = '.' + options.nameSpace + image.selector;
          // Add `source` argument for source map create.
          var singleRule = postcss.rule({
            selector: selector + (usePseudoBefore ? ':before' : ''),
            source: atRule.source
          });

          if (usePseudoBefore) {
            var rule = postcss.rule({
              selector,
              source: atRule.source
            });
            rule.append(postcss.decl({
              prop: 'position',
              value: 'relative'
            }));
            atRuleParent.insertBefore(atRule, rule);
          }

          singleRule.append(image.token);

          switch (image.ratio) {
          // @1x
          case 1:
            atRuleParent.insertBefore(atRule, singleRule);
            break;
            // @2x
          case 2:
            mediaAtRule2x.append(singleRule);
            has2x = true;
            break;
            // @3x
          case 3:
            mediaAtRule3x.append(singleRule);
            has3x = true;
            break;
          default:
            break;
          }
        }
      });

      // @2x @3x media rule are last.
      if (has2x) {
        atRuleParent.insertBefore(atRule, mediaAtRule2x);
      }

      if (has3x) {
        atRuleParent.insertBefore(atRule, mediaAtRule3x);
      }

      atRule.remove();
    });
    resolve([images, options]);
  });
}

/**
 * Use spritesmith module to process images.
 * @param  {Object} options
 * @param  {Array}  images
 * @return {Promise}
 */
function runSpriteSmith(images, options) {
  return new Promise(function (resolve, reject) {
    var all = _
      .chain(images)
      .groupBy(function (image) {
        var temp;

        temp = image.groups.map(mask(true));
        temp.unshift('_');

        return temp.join(GROUP_DELIMITER);
      })
      .map(function (images, temp) {
        var config = _.merge({}, options, {
          src: _.map(images, 'path')
        });

        var checkString = [];

        _.each(config.src, function (image) {
          var checkBuffer = fs.readFileSync(image);
          var checkHash = revHash(checkBuffer);
          checkString.push(checkHash);
        });

        // Get the group files hash.
        checkString = md5(_.sortBy(checkString).join('&'));

        // Collect images datechanged
        config.spriteName = temp.replace(/^_./, '').replace(/.@/, '@');

        // Get data from cache (avoid spritesmith)
        if (cache[checkString]) {
          var deferred = Promise.pending();
          var results = cache[checkString];
          results.isFromCache = true;
          deferred.resolve(results);
          return deferred.promise;
        }

        // SVG SPRITES MOD.
        if (temp.indexOf('GROUP_SVG_FLAG') > -1) {
          var svgConfig = _.defaultsDeep({
            src: _.map(images, 'path')
          }, options.svgsprite);

          var spriter = new SVGSpriter(svgConfig);

          _.forEach(images, function (item) {
            spriter.add(item.path, null, fs.readFileSync(item.path, {
              encoding: 'utf-8'
            }));
          });

          return Promise.promisify(spriter.compile, {
            context: spriter,
            multiArgs: true
          })().spread(function (result, data) {
            var spritesheet = {};
            spritesheet.extension = 'svg';
            spritesheet.coordinates = {};
            spritesheet.image = result.css.sprite.contents;
            spritesheet.properties = {
              width: data.css.spriteWidth,
              height: data.css.spriteHeight
            };

            data.css.shapes.forEach(function (shape) {
              spritesheet.coordinates[path.join(process.cwd(), shape.name.split('|').join(path.sep))] = {
                width: shape.width.outer,
                height: shape.height.outer,
                x: shape.position.absolute.x,
                y: shape.position.absolute.y
              };
            });

            return spritesheet;
          }).then(function (result) {
            temp = temp.split(GROUP_DELIMITER);
            temp.shift();
            // Append info about sprite group
            result.groups = temp.map(mask(false));
            var oldCheckString = cacheIndex[config.spriteName];
            if (oldCheckString && cache[oldCheckString]) {
              delete cache[oldCheckString];
            }

            // Cache - add brand new data
            cacheIndex[config.spriteName] = checkString;
            cache[checkString] = result;
            return result;
          });
        }

        // NORMAL MOD (spritesmith)

        var ratio;

        // Enlarge padding when are retina images
        if (areAllRetina(images)) {
          ratio = _
            .chain(images)
            .flatMap('ratio')
            .uniq()
            .value();

          if (ratio.length === 1) {
            config.padding *= ratio[0];
          }
        }

        return Promise.promisify(spritesmith)(config)
          .then(function (result) {
            temp = temp.split(GROUP_DELIMITER);
            temp.shift();

            // Append info about sprite group
            result.groups = temp.map(mask(false));

            // Cache - clean old
            var oldCheckString = cacheIndex[config.spriteName];
            if (oldCheckString && cache[oldCheckString]) {
              delete cache[oldCheckString];
            }

            // Cache - add brand new data
            cacheIndex[config.spriteName] = checkString;
            cache[checkString] = result;

            return result;
          });
      })
      .value();

    Promise.all(all)
      .then(function (results) {
        resolve([images, options, results]);
      })
      .catch(function (err) {
        if (err) {
          reject(err);
        }
      });
  });
}

/**
 * Save the sprites to the target path.
 * @param  {Object} options
 * @param  {Array}  images
 * @param  {Array}  sprites
 * @return {Promise}
 */
function saveSprites(images, options, sprites) {
  return new Promise(function (resolve, reject) {
    if (!fs.existsSync(options.spritePath)) {
      mkdirp.sync(options.spritePath);
    }

    var all = _
      .chain(sprites)
      .map(function (sprite) {
        sprite.path = makeSpritePath(options, sprite.groups);
        var deferred = Promise.pending();

        // If this file is up to date
        if (sprite.isFromCache) {
          log(options.logLevel, 'lv3', ['Lazysprite:', colors.yellow(path.relative(process.cwd(), sprite.path)), 'unchanged.']);
          deferred.resolve(sprite);
          return deferred.promise;
        }

        const filePath = sprite.path;
        // Save new file version
        return fs.writeFileAsync(sprite.path, Buffer.from(sprite.image, 'binary'))
          .then(function () {
            log(options.logLevel, 'lv2', ['Lazysprite:', colors.green(path.relative(process.cwd(), sprite.path)), 'generated.']);
            // Upload image
            if (typeof options.upload === 'function') {
              try {
                return Promise.resolve(options.upload(filePath))
                  .then(url => {
                    log(options.logLevel, 'lv2', ['Lazysprite:', colors.green('upload success'), url]);
                    sprite.path = url;
                    return sprite;
                  });
              } catch (e) {
                log(options.logLevel, 'lv1', ['Lazysprite upload:', colors.red(path.relative(process.cwd(), sprite.path)), 'upload failed.']);
              }
            }

            return sprite;
          });
      })
      .value();

    Promise.all(all)
      .then(function (sprites) {
        resolve([images, options, sprites]);
      })
      .catch(function (err) {
        if (err) {
          reject(err);
        }
      });
  });
}

/**
 * Map sprites props for every image.
 * @param  {Object} options
 * @param  {Array}  images
 * @param  {Array}  sprites
 * @return {Promise}
 */
function mapSpritesProperties(images, options, sprites) {
  return new Promise(function (resolve) {
    sprites = _.map(sprites, function (sprite) {
      return _.map(sprite.coordinates, function (coordinates, imagePath) {
        return _.merge(_.find(images, {
          path: imagePath
        }), {
          coordinates: coordinates,
          spritePath: sprite.path,
          properties: sprite.properties
        });
      });
    });
    resolve([images, options, sprites]);
  });
}

/**
 * Updates the CSS references from the token info.
 * @param  {Node}   css
 * @param  {Object} options
 * @param  {Array}  images
 * @param  {Array}  sprites
 * @return {Promise}
 */
function updateReferences(images, options, sprites, css) {
  return new Promise(function (resolve) {
    css.walkComments(function (comment) {
      var rule,
        image,
        backgroundImage,
        backgroundPosition,
        backgroundSize;
      // Manipulate only token comments
      if (isToken(comment)) {
        // Match from the path with the tokens comments
        image = _.find(images, {
          path: comment.text
        });
        if (image) {
          // 2x check even dimensions.
          if (image.ratio === 2 && (image.coordinates.width % 2 !== 0 || image.coordinates.height % 2 !== 0)) {
            throw log(options.logLevel, 'lv1', ['Lazysprite:', colors.red(path.relative(process.cwd(), image.path)), '`2x` image should have' +
            ' even dimensions.']);
          }

          // 3x check dimensions.
          if (image.ratio === 3 && (image.coordinates.width % 3 !== 0 || image.coordinates.height % 3 !== 0)) {
            throw log(options.logLevel, 'lv1', ['Lazysprite:', colors.red(path.relative(process.cwd(), image.path)), '`3x` image should have' +
            ' correct dimensions.']);
          }

          // Generate correct ref to the sprite
          if (isUrl(image.spritePath)) {
            image.spriteRef = image.spritePath;
          } else {
            image.spriteRef = path.relative(image.stylesheetRelative, image.spritePath);
            image.spriteRef = image.spriteRef.split(path.sep).join('/');
          }

          backgroundImage = postcss.decl({
            prop: 'background-image',
            value: getBackgroundImageUrl(image)
          });

          backgroundPosition = postcss.decl({
            prop: 'background-position',
            value: getBackgroundPosition(image)
          });

          // Replace the comment and append necessary properties.
          comment.replaceWith(backgroundImage);

          // Output the dimensions (only with 1x)
          if (options.outputDimensions && image.ratio === 1) {
            ['height', 'width'].forEach(function (prop) {
              backgroundImage.after(
                postcss.decl({
                  prop: prop,
                  value: (image.ratio > 1 ? image.coordinates[prop] / image.ratio : image.coordinates[prop]) + 'px'
                })
              );
            });
          }

          backgroundImage.after(backgroundPosition);

          if (options.usePseudoBefore) {
            backgroundImage.before(postcss.decl({
              prop: 'content',
              value: '\'\''
            }));
            backgroundImage.before(postcss.decl({
              prop: 'position',
              value: 'absolute'
            }));
            backgroundImage.before(postcss.decl({
              prop: 'top',
              value: '0'
            }));
            backgroundImage.before(postcss.decl({
              prop: 'left',
              value: '0'
            }));
            backgroundImage.before(postcss.decl({
              prop: 'transform-origin',
              value: 'top left'
            }));
          }

          if (image.ratio > 1) {
            backgroundSize = postcss.decl({
              prop: 'background-size',
              value: getBackgroundSize(image)
            });

            backgroundPosition.after(backgroundSize);
          }
        }
      }
    });

    resolve([images, options, sprites, css]);
  });
}

/* --------------------------------------------------------------
 # Helpers
 -------------------------------------------------------------- */

// Get the value of Atrule and trim to string without quote.
function getAtRuleValue(params) {
  var value = params[0];
  var array = [];
  value = _.trim(value, '\'"()');
  if (value.indexOf('#') > -1) {
    value = value.split('#');
    return value;
  }

  array.push(value);
  return array;
}

// Set the class name.
// Also deal with retina, `:hover` css class contexts.
function setSelector(image, options, dynamicBlock, retina) {
  dynamicBlock = dynamicBlock || false;
  retina = retina || false;
  var basename = image.isSVG ? path.basename(image.name, '.svg') : path.basename(image.name, '.png');
  if (retina) {
    // If retina, then '@2x','@3x','_2x','_3x' will be removed.
    basename = _.replace(basename, /[@_](\d)x$/, '');
  }

  var selector = (dynamicBlock ? dynamicBlock : image.dir) + options.cssSeparator + basename;
  if (options.pseudoClass) {
    if (image.name.toLowerCase().indexOf('hover') > -1 || image.name.toLowerCase().indexOf('active') > -1) {
      selector = _.replace(selector, 'Hover', ':hover');
      selector = _.replace(selector, 'Active', ':active');
      selector = _.replace(selector, '_hover', ':hover');
      selector = _.replace(selector, '_active', ':active');
    }
  }

  return selector;
}

// Set the sprite file name form groups.
function makeSpritePath(options, groups) {
  var base = options.spritePath;
  var file;

  // If is svg, do st
  if (groups.indexOf('GROUP_SVG_FLAG') > -1) {
    groups = _.filter(groups, function (item) {
      return item !== 'GROUP_SVG_FLAG';
    });
    file = path.resolve(base, groups.join('.') + '.svg');
  } else {
    file = path.resolve(base, groups.join('.') + '.png');
  }

  return file.replace('.@', options.retinaInfix);
}

// Mask function
function mask(toggle) {
  var input = new RegExp('[' + (toggle ? GROUP_DELIMITER : GROUP_MASK) + ']', 'gi');
  var output = toggle ? GROUP_MASK : GROUP_DELIMITER;
  return function (value) {
    return value.replace(input, output);
  };
}

// RegExp to match `@replace` comments
function isToken(comment) {
  return /@replace/gi.test(comment.toString());
}

// Return the value for background-image property
function getBackgroundImageUrl(image) {
  var template = _.template('url(<%= image.spriteRef %>)');
  return template({
    image: image
  });
}

// Return the value for background-position property
function getBackgroundPosition(image) {
  var logicValue = image.isSVG ? 1 : -1;
  var x = logicValue * (image.ratio > 1 ? image.coordinates.x / image.ratio : image.coordinates.x);
  var y = logicValue * (image.ratio > 1 ? image.coordinates.y / image.ratio : image.coordinates.y);
  var template = _.template('<%= (x ? x + "px" : x) %> <%= (y ? y + "px" : y) %>');
  return template({
    x: x,
    y: y
  });
}

// Return the pencentage value for background-position property
function getBackgroundPositionInPercent(image) {
  var x = 100 * (image.coordinates.x) / (image.properties.width - image.coordinates.width);
  var y = 100 * (image.coordinates.y) / (image.properties.height - image.coordinates.height);
  var template = _.template('<%= (x ? x + "%" : x) %> <%= (y ? y + "%" : y) %>');
  return template({
    x: x,
    y: y
  });
}

// Return the value for background-size property.
function getBackgroundSize(image) {
  var x = image.properties.width / image.ratio;
  var y = image.properties.height / image.ratio;
  var template = _.template('<%= x %>px <%= y %>px');

  return template({
    x: x,
    y: y
  });
}

// Check whether is '.png' file.
function isPNG(url) {
  return /.png$/gi.test(url);
}

// Check whether the image is retina,
// Both `@2x` and `_2x` are support.
function isRetinaImage(url) {
  return /[@_](\d)x\.[a-z]{3,4}$/gi.test(url);
}

// Check whether the image is retina,
// work with hashed naming filename,
// eg. `@2x.578cc898ef.png`, `_3x.bc11f5103f.png`
function isRetinaHashImage(url) {
  return /[@_](\d)x\.[a-z0-9]{6,10}\.[a-z]{3,4}$/gi.test(url);
}

// Return the value of retina ratio.
function getRetinaRatio(url) {
  var matches = /[@_](\d)x\.[a-z]{3,4}$/gi.exec(url);
  if (!matches) {
    return 1;
  }

  var ratio = _.parseInt(matches[1]);
  return ratio;
}

// Get retina infix from file name
function getRetinaInfix(name) {
  var matches = /([@_])[0-9]x\.[a-z]{3,4}$/gi.exec(name);
  if (!matches) {
    return '@';
  }

  return matches[1];
}

// Check whether all images are retina. should both with 1x and 2x
function areAllRetina(images) {
  return _.every(images, function (image) {
    return image.ratio > 1;
  });
}

// Log with same stylesheet and level control.
function log(logLevel, level, content) {
  var output = true;

  switch (logLevel) {
  case 'slient':
    if (level !== 'lv1') {
      output = false;
    }

    break;
  case 'info':
    if (level === 'lv3') {
      output = false;
    }

    break;
  default:
    output = true;
  }

  if (output) {
    var data = Array.prototype.slice.call(content);
    fancyLog.apply(false, data);
  }
}

// Log for debug
function debug() {
  var data = Array.prototype.slice.call(arguments);
  fancyLog.apply(false, data);
}

function isUrl(url) {
  return /^https?/.test(url);
}