Edit in JSFiddle

var demo = CanDo('demo', {
    frameRate: 60,
    duration: 2000,
    easing: 'easeInOutQuad',
    events: {
        mouseover: function () {demo.play({speed:1});},
        mouseout: function () {demo.play({speed:-1});}
    },       
    paint: function() {
        this.identity();
        this.clearRect(0, 0, 400, 380);
        this.translate(160, 160);
        
        this.canDo('rotate', [{params: [0],cuePoint: 0},{params: [44],cuePoint: 1}]);
        this.translate(-105, -105);
        this.canDo('scale', [{params: [0.1, 0.1],cuePoint: 0},{params: [1.0, 1.0],cuePoint: 1}]);
        this.canSet('shadowColor', [{params: ['rgba(0, 0, 0, 0.7)'], cuePoint:0},{params:['rgba(0,0,0,0.1)'], cuePoint: 1}]);
        this.canSet('shadowOffsetX', [{params: [3],cuePoint: 0},{params: [90],cuePoint: 1}]);
        this.canSet('shadowOffsetY', [{params: [3],cuePoint: 0},{params: [50],cuePoint: 1}]);
        this.canSet('shadowBlur', [{params: [3],cuePoint: 0},{params: [20],cuePoint: 1}]);
        
        drawJSBox(this);
        this.shadowOffsetX = 0;
        this.shadowOffsetY = 0;
        this.shadowBlur = 0;
        drawJ(this);
        drawS(this);
    }
});