User Tools

Site Tools


Sidebar



edge

Edge Animate

$ does not refer to jQuery in newer versions of Edge Animate

In newer versions of Adobe Edge, the $ symbol is a limited implementation of jQuery. If you want full jQuery add an external script to your library. (ie. from https://code.jquery.com/jquery-2.1.1.min.js)
Read more

audio

sym.$("oinkbeest-intro")[0].play();

show/hide/composition/stage/symbol

// hide this symbol
sym.getSymbolElement().hide();
 
// show the next symbol and play it
sym.getComposition().getStage().$("Symbol_2").show();
sym.getComposition().getStage().getSymbol("Symbol_2").play();

upload

Javascript error in event handler! Event Type = element

in case of these kind of unhelpful errors use an exception handler to get the actual error.

try {
  sym.$("upload").trigger("click");
} catch (e) {
  console.log(e);
}

functions in symbols

//on stage timeline:
sym.getSymbol("Pinguins").zingen();
 
//on symbol timeline
sym.zingen = function() {
  console.log("zingen");
}

javascript API

access nested symbols from action

sym.getSymbol("Pinguins").getSymbol("Pinguin1").getSymbol("Snavel").play("zingen");


use html5 webcam video in edge animate

console.log('enable webcam');
 
var getUserMedia = function(t, onsuccess, onerror) {
  if (navigator.getUserMedia) {
    return navigator.getUserMedia(t, onsuccess, onerror);
  } else if (navigator.webkitGetUserMedia) {
    return navigator.webkitGetUserMedia(t, onsuccess, onerror);
  } else if (navigator.mozGetUserMedia) {
    return navigator.mozGetUserMedia(t, onsuccess, onerror);
  } else if (navigator.msGetUserMedia) {
    return navigator.msGetUserMedia(t, onsuccess, onerror);
  } else {
    onerror(new Error("No getUserMedia implementation found."));
  }
};
 
var vid = sym.$("Rectangle2");
vid.html('<video id="video" width= "640" height= "480" type= "video/mp4" autoplay loop</video><canvas id="cv" width="640" height="480"></canvas>'); 
 
var URL = window.URL || window.webkitURL;
var createObjectURL = URL.createObjectURL || webkitURL.createObjectURL;
if (!createObjectURL) {
  throw new Error("URL.createObjectURL not found.");
}
 
getUserMedia({'video': true},
  function(stream) {
    var url = createObjectURL(stream);
    video.src = url;
  },
  function(error) {
    alert("Couldn't access webcam.");
  }
);
 
//////////
 
var canvas = document.getElementById('cv');
var context = canvas.getContext("2d");
context.drawImage(video, 0, 0, 640, 480);
saveImage();
 
function saveImage(){
    var baseURL = "http://SERVER/post.php"; //see http://wiki.companje.nl/php for samples
 
    var xmlhttp;
    xmlhttp=((window.XMLHttpRequest)?new XMLHttpRequest():new ActiveXObject("Microsoft.XMLHTTP"));
    xmlhttp.onreadystatechange=function(){
        if (xmlhttp.readyState==4){
            if(xmlhttp.status==200){
                console.log('success');             
            }
        }
    }
    xmlhttp.open("POST",baseURL,true);
    var oldCanvas = canvas.toDataURL("image/png");
    var params=oldCanvas;
    xmlhttp.send(params);
}

edge animate

cheat sheet

edge inspect

Edge Commons

Dirty Little Helpers for Edge Animate

Edge Reflow

Edge Animate

Random stars

for (var i=0; i<40; i++) {
  var x = Math.floor(Math.random()*1920)+"px";
  var y = Math.floor(Math.random()*700)+"px";
  var ms = Math.floor(Math.random()*5000);
 
  var star = sym.createChildSymbol('Star',sym.getSymbolElement());
  star.getSymbolElement().css({position:"absolute",left:x,top:y});  
  star.play(ms);
}
edge.txt · Last modified: 2014/12/30 20:02 by rick