Adobe Edge Animate –Edge Commons強勢來襲，Edge團隊開發成為現實
版權聲明:
本文版權屬於 北京聯友天下科技發展有限公司。
轉載的時候請注明版權和原文地址。
Edge Commons CDN：
Edge剛剛發布第一個版本的時候，一直在考慮如何讓Edge實現團隊開發，當時Edge的功能還十分有限，而可實現的方法是：將做好的動畫打包為一個原件導出，在Edge大框架中導入的方法。
然而近來Adobe Edge Animate官方開發技術團隊（以Simon Widjaja為代表）發布了Edge Commons CDN，這是一個擴展的javascript庫，旨在提高Edge開發工作效率，並且提供Edge團隊合作開發的功能。
Edge Commons提供了多個版本，其中包含多個已經測試完畢的組件：Parallax Scrolling, Spotlight Overlay or Adaptive Layouts
Edge Commons 1.0.0版本（包含所有組件和功能）下載地址：
http://cdn.edgecommons.org/downloads/EdgeCommons.1.0.0.zip
以下通過一個例子講解Edge Commons的一些功能：
效果圖：
Edge工程文件框架：
工程文件一：
工程文件二：
測試圖：
1、 點擊comp-one：
2、 點擊comp-two：對工程文件二內部顯示文字進行修改
3、點擊工程文件二，既可以控制工程文件二的動畫，也可以控制主體框架的動畫：
一、Edge Commons的加載
在Stage中添加Actions，compositionReady函數
1、 將Edge Commons下載到本地進行加載，這樣當頁面加載的時候，不用等待從服務器下載js的時間
yepnope({
load: "lib/EdgeCommons.js",
complete: function(){
//add your code here
}
}
);
2、 直接從服務器加載js文件
yepnope({
load: "http://cdn.edgecommons.org/an/1.0.0/js/min/EdgeCommons.js",
complete: function() {
//add your code here
}
});
二、Edge Commons功能一：居中舞台
在加載完畢之后執行的函數complete：functions中，添加居中舞台的函數：
EC.centerStage(sym);
一句話就搞定了居中，之前沒有Edge Commons的時候，還需要寫css來實現居中。
三、Edge Commons功能二：加載工程
這就是Edge Commons最大的用處所在了，有了它就可以實現團隊開發的可能！只需要每個人完成工程的一部分，最后通過Edge Commons整合到一起，就ok了。
EC.loadComposition("comp-one/comp-one.html",sym.getSymbol("content"));
comp-one是加載的第一個工程，content是用於顯示comp-one的原件。
1、首先我們制作一個用於顯示comp-one的“容器”：content，使用矩形工具制作即可，然后將之轉換為原件，命名為content
記住content的width和height，接下來我們創建的新工程comp-one原則上是跟這個content的寬高相符的，這里width為：800，height為：380
2、新建一個工程，命名為comp-one，保存在工程目錄下的comp-one目錄下
在此，我們為comp-one添加兩個text，可以將舞台背景設置為透明。
這時，在瀏覽器中預覽就可以看到comp-one已經被加載進來了。
三、控制工程動畫
1、制作comp-two，與comp-one相同，但是可以考慮添加一個按鈕和一個動畫
2、制作主框架控制按鈕
這種控制按鈕在上一篇教程中已經介紹過，在此不再敖述
在第一個按鈕“btn”添加“click”事件：
添加load composition代碼：
EC.loadComposition("comp-one/comp-one.html", sym.getSymbol("content"));
復制按鈕，在復制出來的按鈕“btnCopy”同樣添加click事件，加載第二個工程，但是添加功能：修改工程中的文字，還可以為工程添加動畫控制
在加載完成之后添加function，獲得工程的stage，就可以對工程進行控制，其中stage.play()播放的是加載工程的動畫，而sym.play()播放的則是框架工程的動畫。
var promise = EC.loadComposition("comp-two/comp-two.html", sym.getSymbol("content"));
promise.done(function(comp){
var stage = comp.getStage();
stage.$("Title").html("Edge Animate");
stage.$("Sub-title").html("Something about The Usages of Edge Commons, A Specific JS in Edge...");
stage.$("btn").click( function(){
stage.play();
});
});
原文地址：http://www.cnblogs.com/adobeedge/p/Adobe_Edge_LoadComposition.html