[
  {
    "path": ".editorconfig",
    "content": "[package.json]\nindent_style = space\nindent_size = 2\n\n[*.js]\nindent_style = tab\nindent_size = 4\n"
  },
  {
    "path": ".envrc",
    "content": "use nix\n"
  },
  {
    "path": ".gitignore",
    "content": "node_modules\n"
  },
  {
    "path": ".npmignore",
    "content": "img\njs\nindex.html\n.editorconfig\n.tern-project\ndefault.nix\n.envrc\n"
  },
  {
    "path": ".tern-project",
    "content": "{\n\t\"libs\": [\n\t\t\"browser\"\n\t]\n}\n"
  },
  {
    "path": "ISSUE_TEMPLATE.md",
    "content": "<!--\nFound an Issue?\n\nThanks for reporting it! If this looks like a bug it would be super helpful if\nyou could create a sample on CodePen to help me reproduce it.\n\nHere is a template pen: https://codepen.io/spinningarrow/pen/WJprrg\n\nIt includes the necessary CSS and JS along with a sample image. Please fork it\nin a way that demonstrates the issue, and paste the link in the issue\ndescription.\n-->\n"
  },
  {
    "path": "LICENSE",
    "content": "The MIT License\n\nPermission is hereby granted, free of charge, to any person obtaining\na copy of this software and associated documentation files (the\n\"Software\"), to deal in the Software without restriction, including\nwithout limitation the rights to use, copy, modify, merge, publish,\ndistribute, sublicense, and/or sell copies of the Software, and to\npermit persons to whom the Software is furnished to do so, subject to\nthe following conditions:\n\nThe above copyright notice and this permission notice shall be\nincluded in all copies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND,\nEXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF\nMERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND\nNONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE\nLIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION\nOF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION\nWITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.\n"
  },
  {
    "path": "README.md",
    "content": "# zoom-vanilla.js [![npm version](https://badge.fury.io/js/zoom-vanilla.js.svg)](https://www.npmjs.com/package/zoom-vanilla.js)\n\n```\n                                                  _ _ _         _     \n                                                 (_) | |       (_)    \n  _______   ___  _ __ ___ ________   ____ _ _ __  _| | | __ _   _ ___ \n |_  / _ \\ / _ \\| '_ ` _ \\______\\ \\ / / _` | '_ \\| | | |/ _` | | / __|\n  / / (_) | (_) | | | | | |      \\ V / (_| | | | | | | | (_| |_| \\__ \\\n /___\\___/ \\___/|_| |_| |_|       \\_/ \\__,_|_| |_|_|_|_|\\__,_(_) |___/\n                                                              _/ |    \n                                                             |__/     \n```\n\n**Live demo**: [zoom-vanilla.js in action][live demo].\n\nA simple library for image zooming; [as seen on Medium][medium-zoom-article].\nIt zooms in really smoothly, and zooms out when you click again, scroll away,\nor press the <kbd>esc</kbd> key.\n\nIf you hold the <kbd>⌘</kbd> or <kbd>Ctrl</kbd> key when clicking the image, it\nwill open the image in a new tab instead of zooming it.\n\n_This is a fork of the [jQuery plugin by fat][fat-zoom]_. These are the key\ndifferences:\n\n1. **No jQuery dependency**; vanilla JavaScript only\n2. ~Equivalent~smaller file size (the minified version is slightly smaller due\n   to better minification)\n3. Includes bug fixes not present in [fat/zoom.js][fat-zoom], which is no\n   longer being maintained\n\n## Installation\n\n1. Download the JS and CSS files using any of the following methods:    \n\n    - npm: `npm i zoom-vanilla.js`. This will download the the necessary\n\t  files to the `node_modules/zoom-vanilla.js/dist/` directory.\n\n    - Directly link to the files hosted on a CDN:\n    \n\t\t- JS:\n\t\t  https://cdn.jsdelivr.net/npm/zoom-vanilla.js/dist/zoom-vanilla.min.js\n        \n        - CSS: https://cdn.jsdelivr.net/npm/zoom-vanilla.js/dist/zoom.css\n    \n\t- Manually download `dist/zoom-vanilla.min.js` and `dist/zoom.css` from\n\t  GitHub\n\n2. Add the `zoom-vanilla.min.js` and `zoom.css` files to your HTML page:\n\n    ```html\n    <!-- inside <head> -->\n    <link href=\"path/to/dist/zoom.css\" rel=\"stylesheet\">\n\n    <!-- before </body> -->\n    <script src=\"path/to/dist/zoom-vanilla.min.js\"></script>\n    ```\n\n    You can also `import` them if you're using webpack:\n\n    ```javascript\n    import \"zoom-vanilla.js/dist/zoom.css\"\n    import \"zoom-vanilla.js/dist/zoom-vanilla.min.js\"\n    ```\n\n## Usage\n\nAdd a `data-action=\"zoom\"` attribute to the images you want to make\nzoomable:\n\n```html\n<img src=\"img/blog_post_featured.png\" data-action=\"zoom\">\n```\n\n## Browser support\n\nzoom-vanilla.js should (in theory) work in all modern browsers. If not, create\nan issue! Thanks!\n\n[medium-zoom-article]: https://medium.com/designing-medium/image-zoom-on-medium-24d146fc0c20\n[fat-zoom]: https://github.com/fat/zoom.js\n\n## Known issues\n\n- The image is appended to the body; use an appropriate CSS selector for extra\n  styling\n- Zooming may not be quite right if the aspect ratio of the image is changed\n\n## Build\n\n- `git clone` the repo\n- `npm i` to install dev dependencies\n- `npm start` to start a simple HTTP server (makes it easy to view the demo\n  page)\n- `npm run build` to build the minified JS and vendor-prefixed CSS\n- `npm run watch` to rebuild when any JS files change (recommended for\n  development)\n\n[live demo]: http://code.sahil.me/zoom-vanilla.js\n"
  },
  {
    "path": "css/zoom.css",
    "content": "img[data-action=\"zoom\"] {\n  cursor: zoom-in;\n}\n.zoom-img,\n.zoom-img-wrap {\n  position: relative;\n  z-index: 666;\n  transition: all 300ms;\n}\nimg.zoom-img {\n  cursor: zoom-out;\n}\n.zoom-overlay {\n  cursor: zoom-out;\n  z-index: 420;\n  background: #fff;\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  filter: \"alpha(opacity=0)\";\n  opacity: 0;\n  transition:      opacity 300ms;\n}\n.zoom-overlay-open .zoom-overlay {\n  filter: \"alpha(opacity=100)\";\n  opacity: 1;\n}\n"
  },
  {
    "path": "default.nix",
    "content": "let pkgs = import <nixpkgs> {};\n\nin pkgs.stdenv.mkDerivation rec {\n  name = \"zoom-vanilla.js\";\n\n  buildInputs = with pkgs; [\n    nodejs-9_x\n  ];\n}\n"
  },
  {
    "path": "dist/zoom.css",
    "content": "img[data-action=\"zoom\"] {\n  cursor: zoom-in;\n}\n.zoom-img,\n.zoom-img-wrap {\n  position: relative;\n  z-index: 666;\n  transition: all 300ms;\n}\nimg.zoom-img {\n  cursor: zoom-out;\n}\n.zoom-overlay {\n  cursor: zoom-out;\n  z-index: 420;\n  background: #fff;\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  filter: \"alpha(opacity=0)\";\n  opacity: 0;\n  transition:      opacity 300ms;\n}\n.zoom-overlay-open .zoom-overlay {\n  filter: \"alpha(opacity=100)\";\n  opacity: 1;\n}\n\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uL2Nzcy96b29tLmNzcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTtFQUNFLGdCQUFnQjtDQUNqQjtBQUNEOztFQUVFLG1CQUFtQjtFQUNuQixhQUFhO0VBQ2Isc0JBQXNCO0NBQ3ZCO0FBQ0Q7RUFDRSxpQkFBaUI7Q0FDbEI7QUFDRDtFQUNFLGlCQUFpQjtFQUNqQixhQUFhO0VBQ2IsaUJBQWlCO0VBQ2pCLGdCQUFnQjtFQUNoQixPQUFPO0VBQ1AsUUFBUTtFQUNSLFNBQVM7RUFDVCxVQUFVO0VBQ1YsMkJBQTJCO0VBQzNCLFdBQVc7RUFDWCwrQkFBK0I7Q0FDaEM7QUFDRDtFQUNFLDZCQUE2QjtFQUM3QixXQUFXO0NBQ1oiLCJmaWxlIjoiem9vbS5jc3MiLCJzb3VyY2VzQ29udGVudCI6WyJpbWdbZGF0YS1hY3Rpb249XCJ6b29tXCJdIHtcbiAgY3Vyc29yOiB6b29tLWluO1xufVxuLnpvb20taW1nLFxuLnpvb20taW1nLXdyYXAge1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gIHotaW5kZXg6IDY2NjtcbiAgdHJhbnNpdGlvbjogYWxsIDMwMG1zO1xufVxuaW1nLnpvb20taW1nIHtcbiAgY3Vyc29yOiB6b29tLW91dDtcbn1cbi56b29tLW92ZXJsYXkge1xuICBjdXJzb3I6IHpvb20tb3V0O1xuICB6LWluZGV4OiA0MjA7XG4gIGJhY2tncm91bmQ6ICNmZmY7XG4gIHBvc2l0aW9uOiBmaXhlZDtcbiAgdG9wOiAwO1xuICBsZWZ0OiAwO1xuICByaWdodDogMDtcbiAgYm90dG9tOiAwO1xuICBmaWx0ZXI6IFwiYWxwaGEob3BhY2l0eT0wKVwiO1xuICBvcGFjaXR5OiAwO1xuICB0cmFuc2l0aW9uOiAgICAgIG9wYWNpdHkgMzAwbXM7XG59XG4uem9vbS1vdmVybGF5LW9wZW4gLnpvb20tb3ZlcmxheSB7XG4gIGZpbHRlcjogXCJhbHBoYShvcGFjaXR5PTEwMClcIjtcbiAgb3BhY2l0eTogMTtcbn1cbiJdfQ== */"
  },
  {
    "path": "index.html",
    "content": "<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n  <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\n  <title>zoom-vanilla.js</title>\n\n  <style>\n    /* SIMPLE DEMO STYLES */\n    body {\n      font-family: \"Helvetica Neue\",Helvetica,Arial,sans-serif;\n      font-size: 12px;\n      line-height: 1.6;\n    }\n    .container {\n      margin: 50px;\n      max-width: 700px;\n    }\n    .container img {\n      width: 100%;\n    }\n    .container .pull-left {\n      width: 55%;\n      float: left;\n      margin: 20px 20px 20px -80px;\n    }\n    @media (min-width: 750px) {\n      body {\n        font-size: 16px;\n        line-height: 1.6;\n      }\n      .container {\n        margin: 100px auto;\n      }\n    }\n  </style>\n  <link rel=\"stylesheet\" type=\"text/css\" href=\"dist/zoom.css\">\n</head>\n<body>\n  <div class=\"container\">\n    <h1>Image Zoom</h1>\n    <p>\n      Trust fund seitan chia, wolf lomo letterpress Bushwick before they sold out. Carles kogi fixie, squid twee Tonx readymade cred typewriter scenester locavore kale chips vegan organic. Meggings pug wolf Shoreditch typewriter skateboard. McSweeney's iPhone chillwave, food truck direct trade disrupt flannel irony tousled Cosby sweater single-origin coffee. Organic disrupt bicycle rights, tattooed messenger bag flannel craft beer fashion axe bitters. Readymade sartorial craft beer, quinoa sustainable butcher Marfa Echo Park Terry Richardson gluten-free flannel retro cred mlkshk banjo. Salvia 90's art party Blue Bottle, PBR&B cardigan 8-bit.\n    </p>\n    <p>\n      Meggings irony fashion axe, tattooed master cleanse Blue Bottle stumptown bitters authentic flannel freegan paleo letterpress ugh sriracha. Wolf PBR&B art party aesthetic meh cliche. Sartorial before they sold out deep v, aesthetic PBR&B craft beer post-ironic synth keytar pork belly skateboard pour-over. Tonx cray pug Etsy, gastropub ennui wolf ethnic Odd Future viral master cleanse skateboard banjo. Pitchfork scenester cornhole, whatever try-hard ethnic banjo +1 gastropub American Apparel vinyl skateboard Shoreditch seitan. Blue Bottle keffiyeh Austin Helvetica art party. Portland ethnic fixie, beard retro direct trade ugh scenester Tumblr readymade authentic plaid pickled hashtag biodiesel.\n    </p>\n    <img src=\"img/palm.jpg\" data-action=\"zoom\">\n    <p>\n      Thundercats freegan Truffaut, four loko twee Austin scenester lo-fi seitan High Life paleo quinoa cray. Schlitz butcher ethical Tumblr, pop-up DIY keytar ethnic iPhone PBR sriracha. Tonx direct trade bicycle rights gluten-free flexitarian asymmetrical. Whatever drinking vinegar PBR XOXO Bushwick gentrify. Cliche semiotics banjo retro squid Wes Anderson. Fashion axe dreamcatcher you probably haven't heard of them bicycle rights. Tote bag organic four loko ethical selfies gastropub, PBR fingerstache tattooed bicycle rights.\n    </p>\n    <p>\n      Ugh Portland Austin, distillery tattooed typewriter polaroid pug Banksy Neutra keffiyeh. Shoreditch mixtape wolf PBR&B, tote bag dreamcatcher literally bespoke Odd Future selfies 90's master cleanse vegan. Flannel tofu deep v next level pickled, authentic Etsy Shoreditch literally swag photo booth iPhone pug semiotics banjo. Bicycle rights butcher Blue Bottle, actually DIY semiotics Banksy banjo mixtape Austin pork belly post-ironic. American Apparel gastropub hashtag, McSweeney's master cleanse occupy High Life bitters wayfarers next level bicycle rights. Wolf chia Terry Richardson, pop-up plaid kitsch ugh. Butcher +1 Carles, swag selfies Blue Bottle viral.\n    </p>\n    <p>\n      Keffiyeh food truck organic letterpress leggings iPhone four loko hella pour-over occupy, Wes Anderson cray post-ironic. Neutra retro fixie gastropub +1, High Life semiotics. Vinyl distillery Etsy freegan flexitarian cliche jean shorts, Schlitz wayfarers skateboard tousled irony locavore XOXO meh. Ethnic Wes Anderson McSweeney's messenger bag, mixtape XOXO slow-carb cornhole aesthetic Marfa banjo Thundercats bitters. Raw denim banjo typewriter cray Tumblr, High Life single-origin coffee. 90's Tumblr cred, Terry Richardson occupy raw denim tofu fashion axe photo booth banh mi. Trust fund locavore Helvetica, fashion axe selvage authentic Shoreditch swag selfies stumptown +1.\n    </p>\n      <img src=\"img/trees.jpg\" data-action=\"zoom\" class=\"pull-left\">\n    <p>\n      Scenester chambray slow-carb, trust fund biodiesel ugh bicycle rights cornhole. Gentrify messenger bag Truffaut tousled roof party pork belly leggings, photo booth jean shorts. Austin readymade PBR plaid chambray. Squid Echo Park pour-over, wayfarers forage whatever locavore typewriter artisan deep v four loko. Locavore occupy Neutra Pitchfork McSweeney's, wayfarers fingerstache. Actually asymmetrical drinking vinegar yr brunch biodiesel. Before they sold out sustainable readymade craft beer Portland gastropub squid Austin, roof party Thundercats chambray narwhal Bushwick pug.\n    </p>\n    <p>\n      Literally typewriter chillwave, bicycle rights Carles flannel wayfarers. Biodiesel farm-to-table actually, locavore keffiyeh hella shabby chic pour-over try-hard Bushwick. Sriracha American Apparel Brooklyn, synth cray stumptown blog Bushwick +1 VHS hashtag. Wolf umami Carles Marfa, 90's food truck Cosby sweater. Fanny pack try-hard keytar pop-up readymade, master cleanse four loko trust fund polaroid salvia. Photo booth kitsch forage chambray, Carles scenester slow-carb lomo cardigan dreamcatcher. Swag asymmetrical leggings, biodiesel Tonx shabby chic ethnic master cleanse freegan.\n    </p>\n    <p>\n      Raw denim Banksy shabby chic, 8-bit salvia narwhal fashion axe. Ethical Williamsburg four loko, chia kale chips distillery Shoreditch messenger bag swag iPhone Pitchfork. Viral PBR&B single-origin coffee quinoa readymade, ethical chillwave drinking vinegar gluten-free Wes Anderson kitsch Tumblr synth actually bitters. Butcher McSweeney's forage mlkshk kogi fingerstache. Selvage scenester butcher Shoreditch, Carles beard plaid disrupt DIY. Pug readymade selvage retro, Austin salvia vinyl master cleanse flexitarian deep v bicycle rights plaid Terry Richardson mlkshk pour-over. Trust fund try-hard banh mi Brooklyn, 90's Etsy kogi YOLO salvia.\n    </p>\n\n  </div>\n  <script src=\"dist/zoom-vanilla.min.js\"></script>\n</body>\n</html>\n"
  },
  {
    "path": "js/zoom-vanilla.js",
    "content": "+function () { \"use strict\";\n\tvar OFFSET = 80\n\n\t// From http://youmightnotneedjquery.com/#offset\n\tfunction offset(element) {\n\t\tvar rect = element.getBoundingClientRect()\n\t\tvar scrollTop = window.pageYOffset ||\n\t\t\tdocument.documentElement.scrollTop ||\n\t\t\tdocument.body.scrollTop ||\n\t\t\t0\n\t\tvar scrollLeft = window.pageXOffset ||\n\t\t\tdocument.documentElement.scrollLeft ||\n\t\t\tdocument.body.scrollLeft ||\n\t\t\t0\n\t\treturn {\n\t\t\ttop: rect.top + scrollTop,\n\t\t\tleft: rect.left + scrollLeft\n\t\t}\n\t}\n\n\tfunction zoomListener() {\n\t\tvar activeZoom = null\n\t\tvar initialScrollPosition = null\n\t\tvar initialTouchPosition = null\n\n\t\tfunction listen() {\n\t\t\tdocument.body.addEventListener('click', function (event) {\n\t\t\t\tif (event.target.getAttribute('data-action') !== 'zoom' ||\n\t\t\t\t\tevent.target.tagName !== 'IMG') return\n\n\t\t\t\tzoom(event)\n\t\t\t})\n\t\t}\n\n\t\tfunction zoom(event) {\n\t\t\tevent.stopPropagation()\n\n\t\t\tif (document.body.classList.contains('zoom-overlay-open')) return\n\n\t\t\tif (event.metaKey || event.ctrlKey) return openInNewWindow()\n\n\t\t\tcloseActiveZoom({ forceDispose: true })\n\n\t\t\tactiveZoom = vanillaZoom(event.target)\n\t\t\tactiveZoom.zoomImage()\n\n\t\t\taddCloseActiveZoomListeners()\n\t\t}\n\n\t\tfunction openInNewWindow() {\n\t\t\twindow.open(event.target.getAttribute('data-original') ||\n\t\t\t\tevent.target.currentSrc ||\n\t\t\t\tevent.target.src,\n\t\t\t\t'_blank')\n\t\t}\n\n\t\tfunction closeActiveZoom(options) {\n\t\t\toptions = options || { forceDispose: false }\n\t\t\tif (!activeZoom) return\n\n\t\t\tactiveZoom[options.forceDispose ? 'dispose' : 'close']()\n\t\t\tremoveCloseActiveZoomListeners()\n\t\t\tactiveZoom = null\n\t\t}\n\n\t\tfunction addCloseActiveZoomListeners() {\n\t\t\t// todo(fat): probably worth throttling this\n\t\t\twindow.addEventListener('scroll', handleScroll)\n\t\t\tdocument.addEventListener('click', handleClick)\n\t\t\tdocument.addEventListener('keyup', handleEscPressed)\n\t\t\tdocument.addEventListener('touchstart', handleTouchStart)\n\t\t\tdocument.addEventListener('touchend', handleClick)\n\t\t}\n\n\t\tfunction removeCloseActiveZoomListeners() {\n\t\t\twindow.removeEventListener('scroll', handleScroll)\n\t\t\tdocument.removeEventListener('keyup', handleEscPressed)\n\t\t\tdocument.removeEventListener('click', handleClick)\n\t\t\tdocument.removeEventListener('touchstart', handleTouchStart)\n\t\t\tdocument.removeEventListener('touchend', handleClick)\n\t\t}\n\n\t\tfunction handleScroll(event) {\n\t\t\tif (initialScrollPosition === null) initialScrollPosition = window.pageYOffset\n\t\t\tvar deltaY = initialScrollPosition - window.pageYOffset\n\t\t\tif (Math.abs(deltaY) >= 40) closeActiveZoom()\n\t\t}\n\n\t\tfunction handleEscPressed(event) {\n\t\t\tif (event.keyCode == 27) closeActiveZoom()\n\t\t}\n\n\t\tfunction handleClick(event) {\n\t\t\tevent.stopPropagation()\n\t\t\tevent.preventDefault()\n\t\t\tcloseActiveZoom()\n\t\t}\n\n\t\tfunction handleTouchStart(event) {\n\t\t\tinitialTouchPosition = event.touches[0].pageY\n\t\t\tevent.target.addEventListener('touchmove', handleTouchMove)\n\t\t}\n\n\t\tfunction handleTouchMove(event) {\n\t\t\tif (Math.abs(event.touches[0].pageY - initialTouchPosition) <= 10) return\n\t\t\tcloseActiveZoom()\n\t\t\tevent.target.removeEventListener('touchmove', handleTouchMove)\n\t\t}\n\n\t\treturn { listen: listen }\n\t}\n\n\tvar vanillaZoom = (function () {\n\t\tvar fullHeight = null\n\t\tvar fullWidth = null\n\t\tvar overlay = null\n\t\tvar imgScaleFactor = null\n\n\t\tvar targetImage = null\n\t\tvar targetImageWrap = null\n\t\tvar targetImageClone = null\n\n\t\tfunction zoomImage() {\n\t\t\tvar img = document.createElement('img')\n\t\t\timg.onload = function () {\n\t\t\t\tfullHeight = Number(img.height)\n\t\t\t\tfullWidth = Number(img.width)\n\t\t\t\tzoomOriginal()\n\t\t\t}\n\t\t\timg.src = targetImage.currentSrc || targetImage.src\n\t\t}\n\n\t\tfunction zoomOriginal() {\n\t\t\ttargetImageWrap = document.createElement('div')\n\t\t\ttargetImageWrap.className = 'zoom-img-wrap'\n\t\t\ttargetImageWrap.style.position = 'absolute'\n\t\t\ttargetImageWrap.style.top = offset(targetImage).top + 'px'\n\t\t\ttargetImageWrap.style.left = offset(targetImage).left + 'px'\n\n\t\t\ttargetImageClone = targetImage.cloneNode()\n\t\t\ttargetImageClone.style.visibility = 'hidden'\n\n\t\t\ttargetImage.style.width = targetImage.offsetWidth + 'px'\n\t\t\ttargetImage.parentNode.replaceChild(targetImageClone, targetImage)\n\n\t\t\tdocument.body.appendChild(targetImageWrap)\n\t\t\ttargetImageWrap.appendChild(targetImage)\n\n\t\t\ttargetImage.classList.add('zoom-img')\n\t\t\ttargetImage.setAttribute('data-action', 'zoom-out')\n\n\t\t\toverlay = document.createElement('div')\n\t\t\toverlay.className = 'zoom-overlay'\n\n\t\t\tdocument.body.appendChild(overlay)\n\n\t\t\tcalculateZoom()\n\t\t\ttriggerAnimation()\n\t\t}\n\n\t\tfunction calculateZoom() {\n\t\t\ttargetImage.offsetWidth // repaint before animating\n\n\t\t\tvar originalFullImageWidth  = fullWidth\n\t\t\tvar originalFullImageHeight = fullHeight\n\n\t\t\tvar maxScaleFactor = originalFullImageWidth / targetImage.width\n\n\t\t\tvar viewportHeight = window.innerHeight - OFFSET\n\t\t\tvar viewportWidth  = window.innerWidth - OFFSET\n\n\t\t\tvar imageAspectRatio    = originalFullImageWidth / originalFullImageHeight\n\t\t\tvar viewportAspectRatio = viewportWidth / viewportHeight\n\n\t\t\tif (originalFullImageWidth < viewportWidth && originalFullImageHeight < viewportHeight) {\n\t\t\t\timgScaleFactor = maxScaleFactor\n\t\t\t} else if (imageAspectRatio < viewportAspectRatio) {\n\t\t\t\timgScaleFactor = (viewportHeight / originalFullImageHeight) * maxScaleFactor\n\t\t\t} else {\n\t\t\t\timgScaleFactor = (viewportWidth / originalFullImageWidth) * maxScaleFactor\n\t\t\t}\n\t\t}\n\n\t\tfunction triggerAnimation() {\n\t\t\ttargetImage.offsetWidth // repaint before animating\n\n\t\t\tvar imageOffset = offset(targetImage)\n\t\t\tvar scrollTop   = window.pageYOffset\n\n\t\t\tvar viewportY = scrollTop + (window.innerHeight / 2)\n\t\t\tvar viewportX = (window.innerWidth / 2)\n\n\t\t\tvar imageCenterY = imageOffset.top + (targetImage.height / 2)\n\t\t\tvar imageCenterX = imageOffset.left + (targetImage.width / 2)\n\n\t\t\tvar translateY = Math.round(viewportY - imageCenterY)\n\t\t\tvar translateX = Math.round(viewportX - imageCenterX)\n\n\t\t\tvar targetImageTransform = 'scale(' + imgScaleFactor + ')'\n\t\t\tvar targetImageWrapTransform =\n\t\t\t\t'translate(' + translateX + 'px, ' + translateY + 'px) translateZ(0)'\n\n\t\t\ttargetImage.style.webkitTransform = targetImageTransform\n\t\t\ttargetImage.style.msTransform = targetImageTransform\n\t\t\ttargetImage.style.transform = targetImageTransform\n\n\t\t\ttargetImageWrap.style.webkitTransform = targetImageWrapTransform\n\t\t\ttargetImageWrap.style.msTransform = targetImageWrapTransform\n\t\t\ttargetImageWrap.style.transform = targetImageWrapTransform\n\n\t\t\tdocument.body.classList.add('zoom-overlay-open')\n\t\t}\n\n\t\tfunction close() {\n\t\t\tdocument.body.classList.remove('zoom-overlay-open')\n\t\t\tdocument.body.classList.add('zoom-overlay-transitioning')\n\n\t\t\ttargetImage.style.webkitTransform = ''\n\t\t\ttargetImage.style.msTransform = ''\n\t\t\ttargetImage.style.transform = ''\n\n\t\t\ttargetImageWrap.style.webkitTransform = ''\n\t\t\ttargetImageWrap.style.msTransform = ''\n\t\t\ttargetImageWrap.style.transform = ''\n\n\t\t\tif (!'transition' in document.body.style) return dispose()\n\n\t\t\ttargetImageWrap.addEventListener('transitionend', dispose)\n\t\t\ttargetImageWrap.addEventListener('webkitTransitionEnd', dispose)\n\t\t}\n\n\t\tfunction dispose() {\n\t\t\ttargetImage.removeEventListener('transitionend', dispose)\n\t\t\ttargetImage.removeEventListener('webkitTransitionEnd', dispose)\n\n\t\t\tif (!targetImageWrap || !targetImageWrap.parentNode) return\n\n\t\t\ttargetImage.classList.remove('zoom-img')\n\t\t\ttargetImage.style.width = ''\n\t\t\ttargetImage.setAttribute('data-action', 'zoom')\n\n\t\t\ttargetImageClone.parentNode.replaceChild(targetImage, targetImageClone)\n\t\t\ttargetImageWrap.parentNode.removeChild(targetImageWrap)\n\t\t\toverlay.parentNode.removeChild(overlay)\n\n\t\t\tdocument.body.classList.remove('zoom-overlay-transitioning')\n\t\t}\n\n\t\treturn function (target) {\n\t\t\ttargetImage = target\n\t\t\treturn { zoomImage: zoomImage, close: close, dispose: dispose }\n\t\t}\n\t}())\n\n\tzoomListener().listen()\n}()\n"
  },
  {
    "path": "package.json",
    "content": "{\n  \"name\": \"zoom-vanilla.js\",\n  \"version\": \"2.0.6\",\n  \"description\": \"Medium's image zoom in vanilla JS (no jQuery)\",\n  \"main\": \"dist/zoom-vanilla.min.js\",\n  \"repository\": {\n    \"type\": \"git\",\n    \"url\": \"git@github.com:spinningarrow/zoom-vanilla.js.git\"\n  },\n  \"keywords\": [\n    \"zoom\",\n    \"vanilla\",\n    \"vanilla-js\",\n    \"image\"\n  ],\n  \"author\": \"spinningarrow <sahil29@gmail.com>\",\n  \"license\": \"MIT\",\n  \"bugs\": {\n    \"url\": \"https://github.com/spinningarrow/zoom-vanilla.js/issues\"\n  },\n  \"homepage\": \"https://github.com/spinningarrow/zoom-vanilla.js\",\n  \"devDependencies\": {\n    \"autoprefixer\": \"^6.7.7\",\n    \"http-server\": \"^0.9.0\",\n    \"postcss-cli\": \"^3.0.0\",\n    \"uglify-js\": \"^2.7.3\",\n    \"watch\": \"^0.19.2\"\n  },\n  \"scripts\": {\n    \"_echo_done\": \"echo [`date`] \\\"\\\\033[1;32mzoom-vanilla.min.js rebuilt\\\\033[0m\\\"\",\n    \"compress\": \"uglifyjs --compress --mangle --source-map=dist/zoom-vanilla.min.js.map --source-map-url='/dist/zoom-vanilla.min.js.map' --source-map-root='/' --preamble=\\\"// $npm_package_name - $npm_package_version ($npm_package_homepage)\\\" js/zoom-vanilla.js > dist/zoom-vanilla.min.js\",\n    \"clean\": \"rm -rf dist/*\",\n    \"build\": \"npm run clean && npm run compress && npm run css\",\n    \"css\": \"postcss css/zoom.css --use autoprefixer -d dist/\",\n    \"start\": \"http-server\",\n    \"version\": \"npm run build && git add -u .\",\n    \"watch\": \"watch 'npm run compress && npm run _echo_done' js --ignoreDotFiles\"\n  }\n}\n"
  }
]