+15
| ISC License | ||
| Copyright (c) 2018, Damon Oehlman <damon.oehlman@gmail.com> | ||
| Permission to use, copy, modify, and/or distribute this software for any | ||
| purpose with or without fee is hereby granted, provided that the above | ||
| copyright notice and this permission notice appear in all copies. | ||
| THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES | ||
| WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF | ||
| MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR | ||
| ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES | ||
| WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN | ||
| ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF | ||
| OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE. |
Sorry, the diff of this file is too big to display
+4
-2
| language: node_js | ||
| node_js: | ||
| - 0.10 | ||
| - 10 | ||
| - 11 | ||
| - 12 | ||
| notifications: | ||
| email: | ||
| - damon.oehlman@gmail.com | ||
| - damon.oehlman@gmail.com |
@@ -1,7 +0,7 @@ | ||
| var fit = require('../contain'); | ||
| var crel = require('crel'); | ||
| var img = crel('img', { src: 'http://upload.wikimedia.org/wikipedia/commons/thumb/4/46/Plasma_globe_60th.jpg/1024px-Plasma_globe_60th.jpg' }); | ||
| var canvas = crel('canvas'); | ||
| var css = require('fdom/css'); | ||
| var context = canvas.getContext('2d'); | ||
| const fit = require('../contain'); | ||
| const crel = require('crel'); | ||
| const img = crel('img', { src: 'http://upload.wikimedia.org/wikipedia/commons/thumb/4/46/Plasma_globe_60th.jpg/1024px-Plasma_globe_60th.jpg' }); | ||
| const canvas = crel('canvas'); | ||
| const css = require('fdom/css'); | ||
| const context = canvas.getContext('2d'); | ||
@@ -19,3 +19,3 @@ // set document.body styling | ||
| canvas.height = window.innerHeight; | ||
| context.drawImage.apply(context, [img].concat(bounds)); | ||
| context.drawImage(img, ...bounds); | ||
| } | ||
@@ -22,0 +22,0 @@ |
+6
-28
@@ -1,29 +0,7 @@ | ||
| /** | ||
| # objectfit | ||
| const contain = require('./contain'); | ||
| const cover = require('./cover'); | ||
| This is a suite of functions for fitting (possibly overflowing depending on | ||
| the technique) one rectangular shape into another rectangular region, | ||
| preserving aspect ratio. | ||
| ## Example Usage | ||
| Displayed below is an example of drawing an image on a canvas using the | ||
| `objectfit/contain` function. It should be noted that as the functions | ||
| all use the same function signature, `objectfit/cover` could be used in | ||
| it's place. | ||
| <<< examples/contain.js | ||
| ## Reference | ||
| All objectfit functions use the following function signature: | ||
| ``` | ||
| fit(container, => subject) => [x, y, width, height] | ||
| ``` | ||
| ## Implementations | ||
| **/ | ||
| exports.contain = require('./contain'); | ||
| exports.cover = require('./cover'); | ||
| module.exports = { | ||
| contain, | ||
| cover | ||
| }; |
+11
-6
| { | ||
| "name": "objectfit", | ||
| "version": "1.2.0", | ||
| "version": "1.3.0", | ||
| "description": "Different objectfit strategies for rectangular regions preserving aspect ratio", | ||
| "main": "index.js", | ||
| "stability": "stable", | ||
| "scripts": { | ||
| "test": "node test/all.js", | ||
| "gendocs": "gendocs > README.md" | ||
| "gendocs": "embellish README.md", | ||
| "demo": "beefy examples/contain.js" | ||
| }, | ||
@@ -26,7 +28,10 @@ "repository": { | ||
| "devDependencies": { | ||
| "cog": "^1.0.0", | ||
| "crel": "^2.1.5", | ||
| "beefy": "^2.1.8", | ||
| "browserify": "^16.2.3", | ||
| "cog": "^1.1.0", | ||
| "crel": "^4.0.1", | ||
| "embellish-readme": "^1.5.0", | ||
| "fdom": "^1.2.0", | ||
| "tape": "^3.0.1" | ||
| "tape": "^4.10.2" | ||
| } | ||
| } | ||
| } |
+11
-11
@@ -7,6 +7,5 @@ # objectfit | ||
| [](https://nodei.co/npm/objectfit/) | ||
| [](https://travis-ci.org/DamonOehlman/objectfit) | ||
| [](https://github.com/dominictarr/stability#stable) [](https://travis-ci.org/DamonOehlman/objectfit) | ||
@@ -21,8 +20,9 @@ ## Example Usage | ||
| ```js | ||
| var fit = require('objectfit/contain'); | ||
| var crel = require('crel'); | ||
| var img = crel('img', { src: 'http://upload.wikimedia.org/wikipedia/commons/thumb/4/46/Plasma_globe_60th.jpg/1024px-Plasma_globe_60th.jpg' }); | ||
| var canvas = crel('canvas'); | ||
| var css = require('fdom/css'); | ||
| var context = canvas.getContext('2d'); | ||
| // examples/contain.js | ||
| const fit = require('../contain'); | ||
| const crel = require('crel'); | ||
| const img = crel('img', { src: 'http://upload.wikimedia.org/wikipedia/commons/thumb/4/46/Plasma_globe_60th.jpg/1024px-Plasma_globe_60th.jpg' }); | ||
| const canvas = crel('canvas'); | ||
| const css = require('fdom/css'); | ||
| const context = canvas.getContext('2d'); | ||
@@ -48,3 +48,2 @@ // set document.body styling | ||
| document.body.appendChild(canvas); | ||
| ``` | ||
@@ -54,3 +53,3 @@ | ||
| All objectfit functions use the following function signature: | ||
| All `objectfit` functions use the following function signature: | ||
@@ -79,3 +78,3 @@ ``` | ||
| Copyright (c) 2014, Damon Oehlman <damon.oehlman@gmail.com> | ||
| Copyright (c) 2014, Damon Oehlman <mailto:damon.oehlman@gmail.com> | ||
@@ -93,1 +92,2 @@ Permission to use, copy, modify, and/or distribute this software for any | ||
| PERFORMANCE OF THIS SOFTWARE. | ||
Sorry, the diff of this file is not supported yet
115279
1439.93%12
9.09%7
75%109
-11.38%