Add support for watermarks, either tiled or positioned

README.md

@@ -48,37 +48,39 @@ Optionally specify `options` to resize the image:
 opts = {}
 
 // proportionally resize the photo to a maximum height
-opts = {height}
+opts = {height: 300}
 
 // proportionally resize the photo to a maximum width
-opts = {width}
-
-// resize and crop the photo to exactly height x width (aspect ratio preserved)
-opts = {height, width}
+opts = {width: 300}
+
+// resize and crop the photo to exactly height x width
+// the image will not be distorted
+opts = {height: 100, width: 100}
+
+// overlay a watermark on top of the image
+opts = {
+  watermark: {
+    // PNG file with transparency, relative to the working directory
+    file: 'path/watermark.png',
+    // NorthWest | North | NorthEast | West | Center | East | SouthWest | South | SouthEast
+    gravity: 'SouthEast',
+    // whether the watermark should be repeated across the whole image
+    tile: false
+  }
+}
 ```
 
+Note: watermarks are not compatible with cropped images.
+The `watermark` option will simply be ignored if both width and height are specified.
+
 ### .still
 
 ```js
 .still(source, target, options, callback)
 ```
 
 Extract a single frame from the video in `source`, and writes the image to `target`.
-Optionally specify `options` to resize the image:
-
-```js
-// don't resize
-opts = {}
-
-// proportionally resize the still to a maximum height
-opts = {height}
-
-// proportionally resize the still to a maximum width
-opts = {width}
-
-// resize and crop the still to exactly height x width (aspect ratio preserved)
-opts = {height, width}
-```
+This method supports all  the same options as `.image()`.
 
 ### .video
 

lib/index.js

@@ -13,6 +13,19 @@ exports.image = function (source, target, options, callback) {
   // read baked-in orientation info, and output a rotated image with orientation=0
   const image = gm(source)
   image.autoOrient()
+  // optional watermark
+  const cropping = options.width && options.height
+  if (options.watermark && !cropping) {
+    image.composite(options.watermark.file)
+    if (options.watermark.tile) {
+      image.tile(options.watermark.file)
+    }
+    if (options.watermark.gravity) {
+      image.gravity(options.watermark.gravity)
+    } else {
+      image.gravity('SouthEast')
+    }
+  }
   // resize if necessary
   if (options.height && options.width) {
     // crop to the exact height and weight

test/image.js

@@ -75,6 +75,71 @@ tape('converts a TIFF to JPEG', (test) => {
   })
 })
 
+tape('can add a watermark in the default location', (test) => {
+  diff.image(test, {
+    input: 'images/bike.jpg',
+    expect: 'images/bike-wm-default.jpg',
+    options: {
+      watermark: {
+        file: 'test-data/input/images/watermark.png'
+      }
+    }
+  })
+})
+
+tape('can add a watermark in a given location', (test) => {
+  diff.image(test, {
+    input: 'images/bike.jpg',
+    expect: 'images/bike-wm-gravity.jpg',
+    options: {
+      watermark: {
+        file: 'test-data/input/images/watermark.png',
+        gravity: 'NorthEast'
+      }
+    }
+  })
+})
+
+tape('can add a tiled watermark', (test) => {
+  diff.image(test, {
+    input: 'images/bike.jpg',
+    expect: 'images/bike-wm-tiled.jpg',
+    options: {
+      watermark: {
+        file: 'test-data/input/images/watermark.png',
+        tile: true
+      }
+    }
+  })
+})
+
+tape('includes the watermark when resizing', (test) => {
+  diff.image(test, {
+    input: 'images/bike.jpg',
+    expect: 'images/bike-wm-resize.jpg',
+    options: {
+      height: 200,
+      watermark: {
+        file: 'test-data/input/images/watermark.png'
+      }
+    }
+  })
+})
+
+tape('ignores the watermark when cropping', (test) => {
+  diff.image(test, {
+    input: 'images/bike.jpg',
+    expect: 'images/bike-wm-crop.jpg',
+    options: {
+      height: 100,
+      width: 100,
+      watermark: {
+        file: 'test-data/input/images/watermark.png'
+      }
+    }
+  })
+})
+
 const ORIENTATIONS = [1, 2, 3, 4, 5, 6, 7, 8]
 
 ORIENTATIONS.forEach((orientation) => {