Skip to content

Instantly share code, notes, and snippets.

View eeropic's full-sized avatar

Eero Pitkänen eeropic

View GitHub Profile
@eeropic
eeropic / _.js
Created February 12, 2019 23:03 — forked from shamansir/_.js
Parse and convert any SVG path to the list of commands with JavaScript + Regular Expressions
// svgPathToCommands('M10,10 l 5,7 C-5,7.2,.3-16,24,10 z');
//
// produces:
//
// [ { marker: "M", values: [ 10, 10 ] },
// { marker: "l", values: [ 5, 7 ] },
// { marker: "C", values: [ -5, 7.2, 0.3, -16, 24, 10 ] },
// { marker: "z", values: [ ] } ]
//
// commandsToSvgPath(svgPathToCommands('M10,10 l 5,7 C-5,7.2,.3-16,24,10 z'))
@eeropic
eeropic / paperjs-tween-timeline.js
Created January 22, 2019 20:22
PaperJS Tween timeline
var c=new Shape.Circle({
radius:30,
fillColor:"red",
position:[70,70]
})
var keys=[
]
var motionPath=new Path({
@eeropic
eeropic / PseudoEffectXML.xml
Created January 21, 2019 14:03 — forked from animoplex/PseudoEffectXML.xml
Pseudo Effect Via XML - After Effects Example XML by Animoplex
// Pseudo Effect Via XML - Example File
// Full Tutorial: https://www.youtube.com/watch?v=pHwBOFZgKcs&t=296s
// Edit the PresetEffects.xml for your version of After Effects to add Pseudo Effects.
// XML File Location on Windows:
// Program Files > Adobe > After Effects (Version) > Support Files
// XML File Location on OSX:
// Apps > After Effects > Right-click After Effects.app > “Show Contents” > Contents > Resources
@eeropic
eeropic / pAEper.jsx
Last active September 9, 2021 12:15
pAEper.jsx & pAEperPlayer.js
#include "lib/json2.js"
//export AE shape layer animations to Paper.js project JSON
//AE matchname shortcuts
ae={
contents:"ADBE Root Vectors Group",
transform:"ADBE Transform Group",
let count=[...Array(10)].map(
(x,idx) => {return idx}
)
Point.prototype.toIso=function(){
var x=this.x
var y=this.y
this.x=x-y;
this.y=(x+y)/2;
}
@eeropic
eeropic / animPaperKeyframes.js
Last active May 27, 2018 17:57
paper.js sketches 2018
include('http://eerojohannes.com/js/bezier-easing.js')
var ease=BezierEasing(0.3,0,0.3,1)
function lerp(obj1,obj2,prop,fac){
return (obj2[prop]-obj1[prop])*fac+obj1[prop]
}
function lerpArray(arr1,arr2,fac){
return [
@eeropic
eeropic / vector-smear-path-1.aepx
Created April 22, 2018 14:52
Vector smear path demo (AE project XML / .aepx)
<?xml version="1.0" encoding="UTF-8"?>
<AfterEffectsProject xmlns="http://www.adobe.com/products/aftereffects" majorVersion="1" minorVersion="0">
<svap bdata="077886a6"/>
<head bdata="005c000e077886a680000000000000f400007485"/>
<nhed bdata="0000000000000000000100001e10020000000000006cee80000060000089a9f0"/>
<nnhd bdata="0000000000000000000100000000001e000000100200000000000000006cee80000060000089a9f0"/>
<adfr bdata="40e7700000000000"/>
<Pefl>
</Pefl>
<qtlg bdata="00"/>
@eeropic
eeropic / hexToRGB.js
Last active April 14, 2018 14:12
AE SVG importer pieces
function hexToRgb(hex) {
var result = /^#?([A-F\d]{2})([A-F\d]{2})([A-F\d]{2})$/i.exec(hex);
return result ? [parseInt(result[1], 16)/255, parseInt(result[2], 16)/255, parseInt(result[3], 16)/255] : null;
}
@eeropic
eeropic / toolPen.js
Created April 14, 2018 12:53
Paper.JS tool module test
(function(global) {
with(paper){
var toolPen=new Tool();
toolPen.snap=true;
toolPen.gridSize=20;
toolPen.buttonClass="icon-fountain-pen";
toolPen.on({
mousedown:function(event){
this.draw=true;
@eeropic
eeropic / animepaper.js
Last active April 9, 2018 12:43
anime.js + paper.js
include('http://eerojohannes.com/js/anime.min.js')
var item=new Path.Circle([100,100],50)
item.fillColor="red"
/*
old way
let segs=[]
for(let i in item.segments){
segs.push(item.segments[i].point)
}
*/