{"_id":"canvas-loop","_rev":"6-83436780a693209b83ca6d614bfe020b","name":"canvas-loop","description":"canvas loop/scale utility","dist-tags":{"latest":"1.0.7"},"versions":{"1.0.4":{"name":"canvas-loop","version":"1.0.4","description":"canvas loop/scale utility","main":"index.js","license":"MIT","author":{"name":"Matt DesLauriers","email":"dave.des@gmail.com","url":"https://github.com/mattdesl"},"dependencies":{"canvas-fit":"^1.4.0","raf-loop":"^1.1.0"},"devDependencies":{"2d-context":"^1.2.0","babelify":"^6.0.2","browserify":"^10.1.3","budo":"^4.0.0","eases":"^1.0.6","faucet":"0.0.1","garnish":"^2.1.3","lerp":"^1.0.3","smokestack":"^3.2.2","tap-closer":"^1.0.0","tape":"^4.0.0","uglify-js":"^2.4.21"},"scripts":{"test":"browserify test.js | tap-closer | smokestack | faucet","start":"budo demo.es6:bundle.js --live --verbose -- -t babelify | garnish","build":"browserify demo.es6 -t babelify > bundle.js"},"keywords":["canvas","shell","context","2d","webgl","glsl","gl","fit","fitter","raf","loop","render"],"repository":{"type":"git","url":"git://github.com/mattdesl/canvas-loop.git"},"homepage":"https://github.com/mattdesl/canvas-loop","bugs":{"url":"https://github.com/mattdesl/canvas-loop/issues"},"gitHead":"0e3569a080f99cd63796fea93a4a53e3db0e0005","_id":"canvas-loop@1.0.4","_shasum":"fb6986c8185cccae5d3e72cb9cb0e08ec619124e","_from":".","_npmVersion":"2.1.18","_nodeVersion":"0.10.32","_npmUser":{"name":"mattdesl","email":"dave.des@gmail.com"},"dist":{"shasum":"fb6986c8185cccae5d3e72cb9cb0e08ec619124e","tarball":"https://registry.npmjs.org/canvas-loop/-/canvas-loop-1.0.4.tgz","integrity":"sha512-Viqb2Ct7s0l5d0EHUJssx8jFO2tydFG5bs1kXW67/3t4sJBTHsofEVr8Tz7KA4jIEDdlkBexlcHVK3F1QI7/hg==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCo3JkKu1yN85bPUl4kJXcdYCosj8iZWA7ilF+LxwgNvQIgUr4xQiMKh2fI0JCA/zcOZFnDUi2wgxVOAMimHn8AfoI="}]},"maintainers":[{"name":"mattdesl","email":"dave.des@gmail.com"}]},"1.0.5":{"name":"canvas-loop","version":"1.0.5","description":"canvas loop/scale utility","main":"index.js","license":"MIT","author":{"name":"Matt DesLauriers","email":"dave.des@gmail.com","url":"https://github.com/mattdesl"},"dependencies":{"canvas-fit":"^1.4.0","raf-loop":"^1.1.0"},"devDependencies":{"2d-context":"^1.2.0","babelify":"^6.0.2","browserify":"^10.1.3","budo":"^4.0.0","eases":"^1.0.6","faucet":"0.0.1","garnish":"^2.1.3","lerp":"^1.0.3","smokestack":"^3.2.2","tap-closer":"^1.0.0","tape":"^4.0.0","uglify-js":"^2.4.21"},"scripts":{"test":"browserify test.js | tap-closer | smokestack | faucet","start":"budo demo.es6:bundle.js --live --verbose -- -t babelify | garnish","build":"browserify demo.es6 -t babelify > bundle.js"},"keywords":["canvas","shell","context","2d","webgl","glsl","gl","fit","fitter","raf","loop","render"],"repository":{"type":"git","url":"git://github.com/mattdesl/canvas-loop.git"},"homepage":"https://github.com/mattdesl/canvas-loop","bugs":{"url":"https://github.com/mattdesl/canvas-loop/issues"},"gitHead":"1807a73cb8b8c125039ba19c035fa856e53b5e30","_id":"canvas-loop@1.0.5","_shasum":"5b3be82e47ef5639fd9edce0065d9d2312495e64","_from":".","_npmVersion":"2.14.5","_nodeVersion":"0.12.7","_npmUser":{"name":"mattdesl","email":"dave.des@gmail.com"},"dist":{"shasum":"5b3be82e47ef5639fd9edce0065d9d2312495e64","tarball":"https://registry.npmjs.org/canvas-loop/-/canvas-loop-1.0.5.tgz","integrity":"sha512-EDxlWPS35O7GLI10v8Lsp1zstdFqW8CjLXq7amJnnfaNlVXobUBKgqwtfqq5A1rcofShqAfE4WTldmENuND8vA==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGxvB2lbZucLowq7PNNr0jIsYWti8hCrJkB4z3i6uprTAiEA6EbQK/b6dfnk3UlJztGz98acc7krufLVKCowEfM+zrY="}]},"maintainers":[{"name":"mattdesl","email":"dave.des@gmail.com"}]},"1.0.6":{"name":"canvas-loop","version":"1.0.6","description":"canvas loop/scale utility","main":"index.js","license":"MIT","author":{"name":"Matt DesLauriers","email":"dave.des@gmail.com","url":"https://github.com/mattdesl"},"dependencies":{"canvas-fit":"^1.4.0","raf-loop":"^1.1.0"},"devDependencies":{"2d-context":"^1.2.0","babelify":"^6.0.2","browserify":"^10.1.3","budo":"^4.0.0","eases":"^1.0.6","faucet":"0.0.1","garnish":"^2.1.3","lerp":"^1.0.3","smokestack":"^3.2.2","tap-closer":"^1.0.0","tape":"^4.0.0","uglify-js":"^2.4.21"},"scripts":{"test":"browserify test.js | tap-closer | smokestack | faucet","start":"budo demo.es6:bundle.js --live --verbose -- -t babelify | garnish","build":"browserify demo.es6 -t babelify > bundle.js"},"keywords":["canvas","shell","context","2d","webgl","glsl","gl","fit","fitter","raf","loop","render"],"repository":{"type":"git","url":"git://github.com/mattdesl/canvas-loop.git"},"homepage":"https://github.com/mattdesl/canvas-loop","bugs":{"url":"https://github.com/mattdesl/canvas-loop/issues"},"gitHead":"02f315664c2501a2998943008937b3b5c62e1429","_id":"canvas-loop@1.0.6","_shasum":"43b31af6e824d289571e46fc336bb57ba6d21120","_from":".","_npmVersion":"2.14.5","_nodeVersion":"0.12.7","_npmUser":{"name":"mattdesl","email":"dave.des@gmail.com"},"dist":{"shasum":"43b31af6e824d289571e46fc336bb57ba6d21120","tarball":"https://registry.npmjs.org/canvas-loop/-/canvas-loop-1.0.6.tgz","integrity":"sha512-ZQSEGx6CxJHB7syUpGTAMYuycnklPKH9KKKtMFAnpr6zNXaVB9hM4f4RSjtM75l367Msy2B8xThTyJfADS1YjQ==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIFZB9nwy5B6bT9CNWbSoaT4eaYYrAJ1qvLLAtDuqhntzAiANdy0x783ToECFD94LORHzYSEo6ZoaE6W0+mn4VojWjw=="}]},"maintainers":[{"name":"mattdesl","email":"dave.des@gmail.com"}]},"1.0.7":{"name":"canvas-loop","version":"1.0.7","description":"canvas loop/scale utility","main":"index.js","license":"MIT","author":{"name":"Matt DesLauriers","email":"dave.des@gmail.com","url":"https://github.com/mattdesl"},"dependencies":{"canvas-fit":"^1.4.0","raf-loop":"^1.1.0"},"devDependencies":{"2d-context":"^1.2.0","babelify":"^6.0.2","browserify":"^10.1.3","budo":"^4.0.0","eases":"^1.0.6","faucet":"0.0.1","garnish":"^2.1.3","lerp":"^1.0.3","smokestack":"^3.2.2","tap-closer":"^1.0.0","tape":"^4.0.0","uglify-js":"^2.4.21"},"scripts":{"test":"browserify test.js | tap-closer | smokestack | faucet","start":"budo demo.es6:bundle.js --live --verbose -- -t babelify | garnish","build":"browserify demo.es6 -t babelify > bundle.js"},"keywords":["canvas","shell","context","2d","webgl","glsl","gl","fit","fitter","raf","loop","render"],"repository":{"type":"git","url":"git://github.com/mattdesl/canvas-loop.git"},"homepage":"https://github.com/mattdesl/canvas-loop","bugs":{"url":"https://github.com/mattdesl/canvas-loop/issues"},"gitHead":"19451d0be6c8410f3174d57537986b20ae3dfb4d","_id":"canvas-loop@1.0.7","_shasum":"dbe6309dce50b934fc779f95f8aab5c49be29ecd","_from":".","_npmVersion":"2.14.5","_nodeVersion":"0.12.7","_npmUser":{"name":"mattdesl","email":"dave.des@gmail.com"},"dist":{"shasum":"dbe6309dce50b934fc779f95f8aab5c49be29ecd","tarball":"https://registry.npmjs.org/canvas-loop/-/canvas-loop-1.0.7.tgz","integrity":"sha512-sA6KBHSc/RDv6Ewik/nWrjKgdAyYujTV1KR3DZdem9dOEmS6x97W3MVmquW1MPwjzhO7JEA5osb+utLNYcuxRw==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFlcKe+l20QmfOmdd/lZ8L4lJha3zgUnirf4hO54DFRrAiEAnzXvT+Yq80NNRqY0sz+p3pIjVylNAoL5E33EL1wsfvg="}]},"maintainers":[{"name":"mattdesl","email":"dave.des@gmail.com"}]}},"readme":"# canvas-loop\n\n[![stable](http://badges.github.io/stability-badges/dist/stable.svg)](http://github.com/badges/stability-badges)\n\n[![demo](http://i.imgur.com/o4DFpz0.png)](http://mattdesl.github.io/canvas-loop/)\n\n[demo](http://mattdesl.github.io/canvas-loop/) - [source](demo.es6)\n\nYet another canvas shell utility, built on [canvas-fit](https://npmjs.org/package/canvas-fit) and [raf-loop](https://npmjs.org/package/raf-loop). Useful for full-screen retina canvas demos.\n\nExample:\n\n```js\nvar createGL = require('webgl-context')\nvar createLoop = require('canvas-loop')\n\n// get a WebGL context\nvar gl = createGL()\nvar canvas = gl.canvas\ndocument.body.appendChild(canvas)\n\n// setup a retina-scaled canvas\nvar app = createLoop(canvas, {\n  scale: window.devicePixelRatio\n})\n\n// start rendering\napp.start()\n\n// on requestAnimationFrame\napp.on('tick', function(dt) {\n  // do some rendering\n  gl.clear(gl.COLOR_BUFFER_BIT)\n})\n\n// handle window resize\napp.on('resize', function() {\n  // the unscaled size\n  var width = app.shape[0]\n  var height = app.shape[1]\n\n  console.log('new canvas size', width, height)\n})\n```\n\nSee [demo.es6](demo.es6) for a full demo.\n\n## Usage\n\n[![NPM](https://nodei.co/npm/canvas-loop.png)](https://www.npmjs.com/package/canvas-loop)\n\n#### `app = createLoop(canvas[, opt])`\n\nCreates a new loop with the given `canvas` (can be [2D](https://www.npmjs.com/package/2d-context) or [WebGL](https://www.npmjs.com/package/webgl-context)). \n\nThe options:\n\n- `parent` element to fit to, or a scaling function (default `window`)\n- `scale` scaling ratio for canvas (default 1)\n\nThese options are passed to [canvas-fit](https://github.com/hughsk/canvas-fit/).\n\n#### `app.start()`\n#### `app.stop()`\n\nStart and stop the render loop. Returns the `app` for chaining.\n\n#### `app.on('tick', fn)`\n\nListen to `tick` events, `fn` is called with `dt` parameter which is the delta time since last frame. Uses [raf-loop](https://www.npmjs.com/package/raf-loop).\n\n#### `app.on('resize', fn)`\n\nCalled when the `window` has resized, after the canvas has been re-scaled according to its `parent`.\n\n#### `app.shape`\n\nA getter for the `[ width, height ]` of the canvas *without* device scaling. This is the same as:\n\n```\n[ canvas.width / app.scale, canvas.height / app.scale ]\n```\n\n#### `app.parent`\n#### `app.scale`\n\nGetters/setters to change `parent` or `scale` at runtime. See [canvas-fit](https://www.npmjs.com/package/canvas-fit) for details.\n\n## License\n\nMIT, see [LICENSE.md](http://github.com/mattdesl/canvas-loop/blob/master/LICENSE.md) for details.\n","maintainers":[{"name":"mattdesl","email":"dave.des@gmail.com"}],"time":{"modified":"2022-06-13T05:34:11.921Z","created":"2015-05-15T20:47:45.851Z","1.0.4":"2015-05-15T20:47:45.851Z","1.0.5":"2015-09-28T16:41:51.518Z","1.0.6":"2015-09-28T22:27:12.660Z","1.0.7":"2015-11-05T17:50:00.863Z"},"homepage":"https://github.com/mattdesl/canvas-loop","keywords":["canvas","shell","context","2d","webgl","glsl","gl","fit","fitter","raf","loop","render"],"repository":{"type":"git","url":"git://github.com/mattdesl/canvas-loop.git"},"author":{"name":"Matt DesLauriers","email":"dave.des@gmail.com","url":"https://github.com/mattdesl"},"bugs":{"url":"https://github.com/mattdesl/canvas-loop/issues"},"license":"MIT","readmeFilename":"README.md"}