[image-url] Introducing the image-url package

packages/@sanity/image-url/.babelrc

@@ -0,0 +1,10 @@
+{
+  "presets": ["es2015", "react"],
+  "plugins": [
+    "syntax-object-rest-spread",
+    "transform-object-rest-spread",
+    "syntax-class-properties",
+    "transform-class-properties",
+    "lodash"
+  ]
+}

packages/@sanity/image-url/.eslintignore

@@ -0,0 +1 @@
+/lib

packages/@sanity/image-url/.eslintrc

@@ -0,0 +1,7 @@
+{
+  "extends": [
+    "sanity",
+    "sanity/react"
+  ],
+  "parser": "babel-eslint"
+}

packages/@sanity/image-url/.gitignore

@@ -0,0 +1,4 @@
+node_modules
+npm-debug.log
+package-lock.json
+/lib

packages/@sanity/image-url/.npmignore

@@ -0,0 +1,4 @@
+example
+test
+src
+.idea

packages/@sanity/image-url/README.md

@@ -0,0 +1,8 @@
+# Tools to generate image urls from Sanity content
+
+## Getting started
+
+    npm install --save @sanity/image-url
+
+## Usage
+

packages/@sanity/image-url/index.js

@@ -0,0 +1 @@
+module.exports = require('./lib')

packages/@sanity/image-url/package.json

@@ -0,0 +1,38 @@
+{
+  "name": "@sanity/image-url",
+  "version": "0.119.0",
+  "description": "Tools to generate image urls from Sanity content",
+  "main": "index.js",
+  "scripts": {
+    "clean": "rimraf lib",
+    "bloat":
+      "browserify -t babelify --full-paths ./src/index.js | discify --open",
+    "lint": "eslint .",
+    "pre-commit-check":
+      "npm test && (eslint . || (echo 'Warning: project has lint errors. Please fix and re-commit with `git commit --amend`' && echo))",
+    "test": "mocha --recursive --require babel-register test"
+  },
+  "author": "Sanity.io <hello@sanity.io>",
+  "license": "MIT",
+  "dependencies": {},
+  "devDependencies": {
+    "babelify": "^7.3.0",
+    "browserify": "^14.3.0",
+    "mocha": "^3.2.0",
+    "remon": "^1.0.2",
+    "rimraf": "^2.6.2",
+    "should": "^11.1.0"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/sanity-io/sanity.git"
+  },
+  "bugs": {
+    "url": "https://github.com/sanity-io/sanity/issues"
+  },
+  "homepage": "https://www.sanity.io/",
+  "directories": {
+    "test": "test"
+  },
+  "keywords": ["sanity", "cms", "headless", "realtime", "content", "image-url"]
+}

packages/@sanity/image-url/src/builder.js

@@ -0,0 +1,150 @@
+import urlForImage from './urlForImage'
+
+class ImageUrlBuilder {
+  constructor(parent, options) {
+    if (parent) {
+      this.options = Object.assign({}, parent.options, options || {})
+    } else {
+      this.options = options || {}
+    }
+  }
+
+  _withOptions(options) {
+    return new ImageUrlBuilder(this, options)
+  }
+
+  // The image to be represented. Accepts a Sanity 'image'-document, 'asset'-document or
+  // _id of asset. To get the benefit of automatic hot-spot/crop integration with the content
+  // studio, the 'image'-document must be provided.
+  image(source) {
+    return this._withOptions({source})
+  }
+
+  // Specify the dataset
+  dataset(dataset) {
+    return this._withOptions({dataset})
+  }
+
+  // Specify the projectId
+  projectId(projectId) {
+    return this._withOptions({projectId})
+  }
+
+  // Specify the width of the image in pixels
+  width(width) {
+    return this._withOptions({width})
+  }
+
+  // Specify the height of the image in pixels
+  height(height) {
+    return this._withOptions({height})
+  }
+
+  // Specify focal point in fraction of image dimensions. Each component 0.0-1.0
+  focalPoint(x, y) {
+    return this._withOptions({focalPoint: {x, y}})
+  }
+
+  maxWidth(maxWidth) {
+    return this._withOptions({maxWidth})
+  }
+
+  minWidth(minWidth) {
+    return this._withOptions({minWidth})
+  }
+
+  maxHeight(maxHeight) {
+    return this._withOptions({maxHeight})
+  }
+
+  minHeight(minHeight) {
+    return this._withOptions({minHeight})
+  }
+
+  // Specify width and height in pixels
+  size(width, height) {
+    return this._withOptions({width, height})
+  }
+
+  // Specify blur between 0 and 100
+  blur(blur) {
+    return this._withOptions({blur})
+  }
+
+  sharpen(sharpen) {
+    return this._withOptions({sharpen})
+  }
+
+  // Specify the desired rectangle of the image
+  rect(left, top, width, height) {
+    return this._withOptions({rect: {left, top, width, height}})
+  }
+
+  // Specify the image format of the image. 'jpg', 'pjpg', 'png', 'webp'
+  format(format) {
+    return this._withOptions({format})
+  }
+
+  invert(invert) {
+    return this._withOptions({invert})
+  }
+
+  sharpen(sharpen) {
+    return this._withOptions({sharpen})
+  }
+
+  // Rotation in degrees 0, 90, 180, 270
+  orientation(orientation) {
+    return this._withOptions({orientation})
+  }
+
+  // Compression quality 0-100
+  quality(quality) {
+    return this._withOptions({quality})
+  }
+
+  // Make it a download link. Parameter is default filename.
+  forceDownload(download) {
+    return this._withOptions({download})
+  }
+
+  // Flip image horizontally
+  flipHorizontal() {
+    return this._withOptions({flipHorizontal: true})
+  }
+
+  // Flip image verically
+  flipVertical() {
+    return this._withOptions({flipVertical: true})
+  }
+
+  // Ignore crop/hotspot from image record, even when present
+  ignoreImageParams() {
+    return urlForImage({ignoreImageParams: true})
+  }
+
+  // Gets the url based on the submitted parameters
+  url() {
+    return urlForImage(this.options)
+  }
+
+
+  // Synonym for url()
+  toString() {
+    return this.url()
+  }
+}
+
+export default function urlBuilder(options) {
+  // Did we get a SanityClient?
+  if (options.clientConfig) {
+    // Inherit config from client
+    return new ImageUrlBuilder(null, {
+      projectId: options.clientConfig.projectId,
+      dataset: options.clientConfig.dataset,
+    })
+  }
+
+  // Or just accept the options as given
+  return new ImageUrlBuilder(null, options)
+}

packages/@sanity/image-url/src/index.js

@@ -0,0 +1 @@
+export default require('./builder')