Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

instacam

Package Overview
Dependencies
Maintainers
1
Versions
24
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

instacam - npm Package Compare versions

Comparing version 1.9.1 to 1.9.2

2

dist/instacam.js
/*!
instacam – Instant canvas video
Xavier Foucrier @xavierfoucrier 2019 MIT
1.9.1
1.9.2
*/

@@ -6,0 +6,0 @@ (function webpackUniversalModuleDefinition(root, factory) {

/*!
instacam – Instant canvas video
Xavier Foucrier @xavierfoucrier 2019 MIT
1.9.1
1.9.2
*/
!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define("Instacam",[],e):"object"==typeof exports?exports.Instacam=e():t.Instacam=e()}(window,function(){return function(t){var e={};function i(r){if(e[r])return e[r].exports;var n=e[r]={i:r,l:!1,exports:{}};return t[r].call(n.exports,n,n.exports,i),n.l=!0,n.exports}return i.m=t,i.c=e,i.d=function(t,e,r){i.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:r})},i.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"h",{value:!0})},i.t=function(t,e){if(1&e&&(t=i(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.h)return t;var r=Object.create(null);if(i.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var n in t)i.d(r,n,function(e){return t[e]}.bind(null,n));return r},i.n=function(t){var e=t&&t.h?function(){return t.default}:function(){return t};return i.d(e,"a",e),e},i.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},i.p="",i(i.s=0)}([function(t,e,i){"use strict";i.r(e);let r={width:400,height:300,autostart:!0,camera:!0,mode:"front",framerate:30,ratio:4/3,sound:!1,volume:100,mirror:!1,opacity:1,brightness:1,contrast:1,saturation:1,hue:0,invert:0,grayscale:0,sepia:0,blur:0,url:"",blend:{},filter:null,done:null,fail:null,unsupported:null},n="requestAnimationFrame"in window&&"mediaDevices"in navigator&&"Promise"in window;i.d(e,"Instacam",function(){return s});class s{constructor(t,e){if(this.u=Object.assign({},r,e),n){if("string"==typeof t&&(t=document.querySelector(t)),null==t||"canvas"!==t.nodeName.toLowerCase())throw new Error("Invalid viewport, you need to pass a valid selector or HTML5 canvas element");this.viewport=t,this.viewport.width=this.u.width,this.viewport.height=this.u.height,this.v=document.createElement("video"),this.v.style.display="none",this.v.autoplay=!0,this.v.width=this.u.width,this.v.height=this.u.height,this.viewport.parentNode.insertBefore(this.v,this.viewport.nextSibling),this.g=document.createElement("div"),this.g.setAttribute("data-instacam",""),this.viewport.parentNode.insertBefore(this.g,this.viewport),this.g.appendChild(this.viewport),this.g.appendChild(this.v),this.mirror=this.u.mirror,!0===this.u.autostart&&(this.I(),this.j())}else"function"==typeof this.u.unsupported&&this.u.unsupported()}j(){try{navigator.mediaDevices.getUserMedia({audio:this.u.sound,video:(()=>!1!==this.u.camera&&{frameRate:this.u.framerate,aspectRatio:this.u.ratio,facingMode:"front"===this.u.mode?"user":"environment"})()}).then(t=>{this.$=t,this.v.srcObject=t,this.volume=this.u.volume;const e=()=>{"function"!=typeof this.u.filter?this.viewport.getContext("2d").drawImage(this.v,0,0,this.u.width,this.u.height):(void 0===this.O&&(this.O=document.createElement("canvas"),this.O.style.display="none",this.O.width=this.u.width,this.O.height=this.u.height,this.viewport.parentNode.insertBefore(this.O,this.viewport.nextSibling)),this.O.getContext("2d").drawImage(this.v,0,0,this.u.width,this.u.height),this.viewport.getContext("2d").putImageData(this._(this.O.getContext("2d").getImageData(0,0,this.u.width,this.u.height)),0,0)),requestAnimationFrame(e)};requestAnimationFrame(e),"function"==typeof this.u.done&&this.u.done()}).catch(t=>{"function"==typeof this.u.fail&&this.u.fail(t)})}catch(t){"function"==typeof this.u.fail&&this.u.fail(t)}}I(){if(this.M=this.u.opacity!==r.opacity?`opacity(${this.u.opacity}) `:"",this.M+=this.u.brightness!==r.brightness?`brightness(${this.u.brightness}) `:"",this.M+=this.u.contrast!==r.contrast?`contrast(${this.u.contrast}) `:"",this.M+=this.u.saturation!==r.saturation?`saturate(${this.u.saturation}) `:"",this.M+=this.u.hue!==r.hue?`hue-rotate(${this.u.hue}deg) `:"",this.M+=this.u.invert!==r.invert?`invert(${this.u.invert}) `:"",this.M+=this.u.grayscale!==r.grayscale?`grayscale(${this.u.grayscale}) `:"",this.M+=this.u.sepia!==r.sepia?`sepia(${this.u.sepia}) `:"",this.M+=this.u.blur!==r.blur?`blur(${this.u.blur}px) `:"",this.M+=this.u.url!==r.url?`url(${this.u.url}) `:"",this.viewport.style.filter=this.M,0!==Object.keys(this.u.blend).length){void 0===this.S&&(this.S=document.createElement("div"),this.viewport.parentNode.insertBefore(this.S,this.viewport));const t=this.viewport.getBoundingClientRect();this.S.style=`position:absolute;z-index:1;width:${t.width}px;height:${t.height}px;mix-blend-mode:${this.u.blend.mode};background:${this.u.blend.color};pointer-events:none;`}else void 0!==this.S&&(this.S.parentNode.removeChild(this.S),delete this.S)}_(t){let e=t.data;try{for(let t=0;t<this.u.height;t++)for(let i=0;i<this.u.width;i++){const r=4*(this.u.width*t+i),n=this.u.filter({offset:r,x:i,y:t,red:e[r],green:e[r+1],blue:e[r+2],alpha:e[r+3]});e[r]=n[0],e[r+1]=n[1],e[r+2]=n[2],e[r+3]=n[3]}return t}catch(t){throw new Error("Invalid filter, you need to return a valid [red, green, blue, alpha] pixel array")}}start(){this.I(),this.j()}stop(){void 0!==this.$&&(this.$.getTracks().forEach(function(t){t.stop()}),this.v.srcObject=null)}snap(t=0,e=0,i=this.u.width,r=this.u.height){if(i<=0||r<=0)throw new Error("Invalid snap area, you need to specify a positive width and height for your image capture");return this.viewport.getContext("2d").getImageData(t,e,i,r)}save(t="png",e=1){return this.viewport.toDataURL("image/"+t,e)}mute(){this.u.muted=this.v.muted=!0}unmute(){this.u.muted=this.v.muted=!1}get mode(){return this.u.mode}set mode(t){if("string"!=typeof t||"front"!==t&&"back"!==t)throw new Error("Invalid facing mode, you need to give a valid string front|back");this.u.mode=t,this.$.getVideoTracks().forEach(function(t){t.stop()}),this.j()}get muted(){return this.v.muted}get volume(){return this.u.volume}set volume(t){if("number"!=typeof t||t<0||t>100)throw new Error("Invalid volume, you need to give a number between 0 and 100");this.v.volume=this.u.volume=t/100}get mirror(){return this.u.mirror}set mirror(t){if("boolean"!=typeof t)throw new Error("Invalid mirror mode, you need to give a boolean to enable or disable the mirror mode");let e=getComputedStyle(this.viewport).getPropertyValue("transform");e="none"!==e?e:"",this.viewport.style.transform=!0===t?`${e} scale(-1, 1)`:"",this.u.mirror=t}get opacity(){return this.u.opacity}set opacity(t){if("number"!=typeof t||t<0||t>1)throw new Error("Invalid opacity, you need to give a number between 0 and 1");this.u.opacity=t,this.I()}get brightness(){return this.u.brightness}set brightness(t){if("number"!=typeof t||t<0)throw new Error("Invalid brightness, you need to give a number above 0");this.u.brightness=t,this.I()}get contrast(){return this.u.contrast}set contrast(t){if("number"!=typeof t||t<0)throw new Error("Invalid contrast, you need to give a number above 0");this.u.contrast=t,this.I()}get saturation(){return this.u.saturation}set saturation(t){if("number"!=typeof t||t<0)throw new Error("Invalid saturation, you need to give a number above 0");this.u.saturation=t,this.I()}get hue(){return this.u.hue}set hue(t){if("number"!=typeof t||t<0||t>360)throw new Error("Invalid hue, you need to give a number between 0 and 360");this.u.hue=t,this.I()}get invert(){return this.u.invert}set invert(t){if("number"!=typeof t||t<0||t>1)throw new Error("Invalid invert, you need to give a number between 0 and 1");this.u.invert=t,this.I()}get grayscale(){return this.u.grayscale}set grayscale(t){if("number"!=typeof t||t<0||t>1)throw new Error("Invalid grayscale, you need to give a number between 0 and 1");this.u.grayscale=t,this.I()}get sepia(){return this.u.sepia}set sepia(t){if("number"!=typeof t||t<0||t>1)throw new Error("Invalid sepia, you need to give a number between 0 and 1");this.u.sepia=t,this.I()}get blur(){return this.u.blur}set blur(t){if("number"!=typeof t||t<0)throw new Error("Invalid blur, you need to give a number above 0");this.u.blur=t,this.I()}get url(){return this.u.url}set url(t){if("string"!=typeof t)throw new Error("Invalid url, you need to give a string");this.u.url=t,this.I()}get blend(){return this.u.blend}set blend(t){if("object"!=typeof t)throw new Error("Invalid blend, you need to give a valid object with {mode|color} or an empty object to disable blending");this.u.blend=t,this.I()}get filter(){return this.u.filter}set filter(t){if(null!==t&&"function"!=typeof t)throw new Error("Invalid filter, you need to give a function or null to disable the custom filtering");this.u.filter=t}get style(){return 0!==this.M.length?this.M.trim().split(" "):[]}get hardware(){if(void 0===this.$)return null;let t=this.$.getAudioTracks().filter(t=>"live"===t.readyState)[0],e=this.$.getVideoTracks().filter(t=>"live"===t.readyState)[0];return{audio:void 0===t?null:{id:t.id,name:t.label},video:void 0===e?null:{id:e.id,name:e.label}}}}}]).Instacam});

@@ -30,6 +30,10 @@ # Instacam documentation

### Use with Webpack
Instacam is using the **UMD** *(Unified Module Definition)* pattern, making it capable of working everywhere and compatible with webpack. The module is published on the **NPM** *(Node Package Manager)* registry, so you can install it through the command line interpreter using:
Instacam is using the **UMD** *(Unified Module Definition)* pattern, making it capable of working everywhere and compatible with webpack. The module is published on the **NPM** *(Node Package Manager)* registry, so you can install it through the command line interpreter using your favorite package manager:
```console
# npm
npm install instacam
# yarn
yarn add instacam
```

@@ -40,3 +44,3 @@

```js
import {Instacam} from 'instacam';
import { Instacam } from 'instacam';

@@ -55,3 +59,3 @@ let camera = new Instacam(

<script type="module">
import {Instacam} from 'src/instacam.js';
import { Instacam } from 'src/instacam.js';

@@ -71,2 +75,5 @@ let camera = new Instacam(

> Instead of directly serve the file, you can use a **CDN** *(Content Delivery Network)*
> https://cdn.jsdelivr.net/npm/instacam@1.9.1/dist/instacam.min.js
Then **instanciate the class** by using this javascript syntax:

@@ -73,0 +80,0 @@

{
"name": "instacam",
"year": "2019",
"version": "1.9.1",
"version": "1.9.2",
"description": "Instant canvas video",

@@ -37,6 +37,6 @@ "main": "src/instacam.js",

"devDependencies": {
"terser-webpack-plugin": "^1.2.3",
"webpack": "^4.30.0",
"webpack-command": "^0.4.2"
"terser-webpack-plugin": "^1.4.1",
"webpack": "^4.39.3",
"webpack-command": "^0.5.0"
}
}

@@ -14,9 +14,13 @@ # Instacam – [![npm](https://img.shields.io/npm/v/instacam.svg)](https://www.npmjs.com/package/instacam) [![npm](https://img.shields.io/github/size/xavierfoucrier/instacam/dist/instacam.min.js.svg)](https://raw.githubusercontent.com/xavierfoucrier/instacam/master/dist/instacam.min.js) [![dependencies](https://david-dm.org/xavierfoucrier/instacam.svg)](https://github.com/xavierfoucrier/instacam/network/dependencies)

## Install
Instacam is published on the **NPM** *(Node Package Manager)* registry, so you can install it through the command line interpreter using:
Instacam is published on the **NPM** *(Node Package Manager)* registry, so you can install it through the command line interpreter using your favorite package manager:
```console
# npm
npm install instacam
# yarn
yarn add instacam
```
For other implementation of Instacam in your project, see the [usage documentation](DOCUMENTATION.md#usage).
> For other implementation of Instacam in your project, see the [usage documentation](DOCUMENTATION.md#usage)

@@ -23,0 +27,0 @@

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc