Skip to content

Instantly share code, notes, and snippets.

@thejefflarson

thejefflarson/cryptor.js

Created November 23, 2014 08:35
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save thejefflarson/cbb8fc3d0834f7b33cde to your computer and use it in GitHub Desktop.
Save thejefflarson/cbb8fc3d0834f7b33cde to your computer and use it in GitHub Desktop.
Download ZIP
Raw
cryptor.js
// WILL SAD TAB CHROME IF YOU OPEN THE INSPECTOR
// LOL CRYPTO
var c1 = document.querySelector("canvas#video");
var c2 = document.querySelector("canvas#crypt");
var video = document.querySelector("video");
var plain = c1.getContext("2d");
var crypt = c2.getContext("2d");
var key;
var algo = "AES-CBC";
var iv = new Uint8Array(16);
window.crypto.getRandomValues(iv);
var p = window.crypto.subtle.generateKey({name: "AES-CBC", length:128}, true, ['encrypt']);
p.then(function(val) {
var key = val;
navigator.webkitGetUserMedia({video:true}, function(stream){
video.src = window.webkitURL.createObjectURL(stream);
video.play();
function go(){
plain.drawImage(video, 0, 0, 320, 240);
var img = plain.getImageData(0,0, 320, 240);
window.crypto.subtle.encrypt({name: "AES-CBC", iv: iv}, key, img.data).then(function(secret){
crypt.putImageData(secret, 0 ,0);
});
window.requestAnimationFrame(go);
};
window.requestAnimationFrame(go);
}, function(err){
console.log(err);
});
});
Raw
index.html
<html>
<head>
<style>
video, canvas {
width: 320px;
height: 240px;
}
video {
display:none;
}
</style>
</head>
<body>
<video></video>
<canvas width="320" height="240" id="video"></canvas>
<canvas width="320" height="240" id="crypt"></canvas>
<script src="cryptor.js"></script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment