Skip to content

Instantly share code, notes, and snippets.

@turbodrive
turbodrive / flipThreejsCanvas.js
Created December 19, 2014 11:13
Flip Three.js canvas when used as source in Seriously.js
var sourceBottom = seriously.source('#threejs-canvas', null, {
flip: 'vertical'
});
@turbodrive
turbodrive / aeCameraParser.js
Last active April 2, 2019 09:39
After Effects Camera Parser
var aeCameraParser = function () {
"use strict";
var cameraAnimation = {};
var kLines = "<1br />";
var kSplit = [
{aeK : "Units Per Second", jsVar:"framerate"},
{aeK : "Source Width", jsVar:"viewportWidth"},
{aeK : "Source Height", jsVar:"viewportHeight"},
@turbodrive
turbodrive / aeToThreeJSFocalLength.js
Last active August 29, 2015 14:07
Formula to convert After Effects to Three.js camera focal length
/* aeFocalLength must be in millimeters */
var getThreeFocalLength = function(viewportWidth, viewportHeight, aeFocalLength, filmWidth, filmHeight) {
if ( filmWidth === undefined ) filmWidth = 36;
if ( filmHeight === undefined ) filmHeight = 24;
return (filmHeight*(viewportWidth / (filmWidth/aeFocalLength)))/viewportHeight;
}
@turbodrive
turbodrive / main_easeinterpolatefunc_excerpt.js
Last active August 29, 2015 14:07
AE to CSS Workflow - Part 3 - Finalisation Javascript and enhancements.
var easeInOutExpo = function (t, b, c, d) {
if ((t/=d/2) < 1)
return c/2 * Math.pow(2, 10 * (t - 1)) + b;
return c/2 * (-Math.pow(2, -10 * --t) + 2) + b;
};
var getValueForProp = function(propName){
if(globalCamProgression == parseInt(globalCamProgression)){
return -targets3D[parseInt(globalCamProgression)][propName];
@turbodrive
turbodrive / custom_control_targetfcam.xml
Last active August 29, 2015 14:07
AE to CSS Workflow - Part 2 - Transposition CSS to After Effects and JSON exporting
<Effect matchname="Custom TargetFCam" name="$$$/AE/Preset/TargetsFCamManager=Targets FCam Manager">
<Group name="$$$/AE/Preset/Targets=Targets">
<Layer name="$$$/AE/Preset/Target1=Target 1" default_self="false"/>
<Layer name="$$$/AE/Preset/Target2=Target 2" default_self="false"/>
<Layer name="$$$/AE/Preset/Target3=Target 3" default_self="false"/>
<Layer name="$$$/AE/Preset/Target4=Target 4" default_self="false"/>
<Layer name="$$$/AE/Preset/Target5=Target 5" default_self="false"/>
<Layer name="$$$/AE/Preset/Target6=Target 6" default_self="false"/>
<Layer name="$$$/AE/Preset/Target7=Target 7" default_self="false"/>
<Layer name="$$$/AE/Preset/Target8=Target 8" default_self="false"/>
@turbodrive
turbodrive / ae_to_json_exporter.jsx
Created September 24, 2014 17:15
Positions and rotations JSON exporter for After Effects 3D elements
function getJsonObjectFromLayer(layer) {
var name = layer.name;
var pX = layer.property("Position").value[0];
var pY = layer.property("Position").value[1];
var pZ = -layer.property("Position").value[2];
var rX = -layer.property("xRotation").value;
var rY = -layer.property("yRotation").value;
var rZ = layer.property("zRotation").value;
var jsonObject = '{"name":"' + name + '","x":' + pX + ',"y":' + pY + ',"z":' + pZ + ',"rotationX":' + rX + ',"rotationY":' + rY + ',"rotationZ":' + rZ + '}';
@turbodrive
turbodrive / ae-to-css-workflow-part1.html
Last active August 29, 2015 14:06
AE to CSS Workflow - Part 1 - Introduction
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<meta name="language" content="en" />
<title>AE to CSS Workflow - Part 1 - Introduction</title>
<link rel="stylesheet" href="css/styles.css" type="text/css" media="all">
<script src="js/Sprite3D.js" type="text/javascript"></script>
@turbodrive
turbodrive / cubicBezierExporter.jsx
Last active November 23, 2019 03:34
Cubic bezier ease exporter from After Effects
var comp = app.project.activeItem;
var layer = comp.selectedLayers[0];
var numEffects = layer.Effects.numProperties;
var slider;
for(var i = 1; i<=numEffects; i++){
var effectLayer = layer.Effects.property(i);
var matchName = effectLayer.matchName;
if(matchName == "ADBE Slider Control"){
@turbodrive
turbodrive / focalLengthToCSSPerspective.js
Last active September 19, 2015 12:46
Formula to get the CSS Perspective value from the focal length and viewport size
var viewportWidth = 1280;
var focalLength = 28;
var filmWidth = 36;
var cssPerspective = viewportWidth / (filmWidth/focalLength);