======Flex=======









=====EmacsでFlexやるための環境設定====
Flex Builderだとなんもしなくていいからつまんない。なのでEmacsとrascutたすlog.asの設定。\\ 
Flex Builder使っててもrascut、log.asを使うととっても便利。
flexだけじゃなくAIRとかactionscriptやるときの環境でげす。\\ 
さらにyasnippet用のactionscript-modeも付け足します。\\ 
yasnippetを入れると、例えばforを打ってtabを押すと
<code>
for [tab]
 ↓
for(var i:int = 0; i < elements.length; i++){
  var x:Object = elements[i];
}
</code>
といっきに補完してくれちゃう機能です。C-oの動的略語展開と同じキーバインドにしておくととっても便利です。


====emacs====
Emacsのactionscript用設定は[[development_tool:emacs:plugins#actionscript|こっち]]\\ 
yasnippetのactionscript-modeは[[development_tool:emacs:plugins#actionscript-mode_yasnippet|actionscript-mode(yasnippet)]]




















====rascut====
rascutはファイル修正したら自動コンパイル、ブラウザリロードまで一気にやってくれたりな便利機能いっぱいコマンドです。\\
これがあればBuilderいらず。



===インストール===
<code bash>
gem install rascut
</code>
だけ。

.zshrcとか.bashrcに
<code bash>
export _JAVA_OPTIONS='-Duser.language=en'
</code>

（追記 \\ 
rascutが0.21になってたのでアップデートしたら何もしなくても問題なくなりました。
なのでここから下の文はいらないかもしれません。

サーバモードで起動できない場合は
/Library/Ruby/Gems/1.8/gems/rascut-0.1.3/lib/rascut/httpd.rbの27行目あたりの
portsでインストールしているなら/opt/local/lib/ruby/gems/1.8/gems/rascut-0.1.3/lib/rascut/httpd.rbの
<code bash>
 @path = env["PATH_INFO"] == '/' ? @root : F.join(@root, env['PATH_INFO'])
</code>
を
<code bash>
@path = env["PATH_INFO"].empty? || env["PATH_INFO"] == '/' ? @root : F.join(@root, env['PATH_INFO'])
</code>

に修正

さらにrascut0.1.3はrackのバージョンが0.9.1だとNameError at /js/swfobject.jsとか 
uninitialized constant Rascut::Httpd::FileOnly::MIME_TYPESがでて動かないので
<code bash>
$ sudo gem install -v 0.4.0 rack
$ sudo gem uninstall -v 0.9.1 rack
</code>
と修正。

[[http://blog.r3c7.net/|note.xさん]]のところによると最新版のrascutを下のようにインストールすると
rackの最新版でも解決できるらしいです。
<code bash>
$ sudo gem install rubygems-update
$ sudo gem update --system
$ gem sources -a http://gems.github.com
$ sudo gem install hotchpotch-rascut
</code>
が、自分の環境じゃそれでもだめでしたので結局rasct0.1.3を使ってます。
なんででしょうか。。。




下の例は \\ 
srcディレクトリにあるmain.mxmlを (src/main.mxml)\\ 
サーバモードで (-s) \\ 
親ディレクトリにあるimageフォルダを/imgフォルダとして、(-m "../image=img") \\ 
デバックモードで (-c "debug=true")\\ 
現在のカレントディレクトリのdebugディレクトリにmain.swfを掃き出す設定。(output=./bin-debug)
<code bash>
rascut src/main.mxml -s -m "../image=img" -c "-debug=true -output=debug/main.swf"
</code>

====log.as====
firebugにtraceみたいなものを掃き出すlog関数を使えるようになる。
上のrascutとあわせると、とってもとっても便利に。

修正保存したら、再コンパイル -> ブラウザリロード -> firebugのコンソールにlog掃き出し。

という一連の動作を自動でやってくれちゃっています。すばらしき。

[[http://subtech.g.hatena.ne.jp/secondlife/20070219/1171872801|ASでどこからでもlog();]]からlog.asのソースコードをとってきて適当なところに置いて
flex_sdkのframeworks/flex-config.xmlに

<code xml>
<flex-config>
...略
  <source-path>
    <path-element>log.asを置いてあるフォルダのパス（例 /usr/local/libs）</path-element>
  </source-path>
</flex-config>
</code>

それであとはlog関数をtraceと同じように使うとfirebugのコンソール欄に表示されるようになります。




====Trace Log====
mm.cfgというファイルを作る。

===mm.cfg作成場所===
macの場所が変更された模様

^ OS ^ ファイルの作成場所 ^
| Mac OS X | <del>/Library/Application Support/Macromedia</del> /Users/username |
| Linux | /home/username |
| WindowsXP | C:\Documents and Settings \ username|
| Windows Vista | C:\Users\username |

===mm.cfgプロパティ一覧===
^ プロパティ ^ 説明 ^
| ErrorReportingEnable | エラーメッセージの有効化 (1:0) :default 0|
| MaxWarnings | ログの最大数 :default 100 |
| TraceOutputFileEnable | トレースログの有効化 (1:0) :default 0 |
| TraceoutputFileName | ログファイルの場所 \\ Macではdirectoryを:で区切る\\ Flash Player 9 Update以降では無効|

===ログファイルの場所===
Flash Player 9 Update 以降ではログファイルの場所は下記に固定される。
^ OS ^ ログファイルの場所 ^
| Mac OS X | ~/Library/Preferences/Macromedia/Flash Player/logs/ |
| Linux | ~/.macromedia/Flash_Player/Logs/ |
| Win XP | C:\Documents and Setteings\username\Application Data\Macromedia\Flash Player\Logs |
| Win Vista | C:\Users\username\AppData\Roaming\Macromedia\Flash Player\Logs |

【例】 macでトレースログとエラーレポートを有効にしたmm.cfgファイルを作る場合
<code bash>
$ cd ~
$ echo ErrorReportingEnable=1 > mm.cfg
$ echo TraceOutputFileEnable=1 >> mm.cfg
</code>
でFlex Builderの場合はBuilderのコンソールに、じゃなければflashlog.txtにtraceの値がはきだされる.\\ 
毎回log見るときにフォルダの場所忘れるのでリンク張っとく。
<code bash>
$ cd ~/Library/Logs
$ ln -s ~/Library/Preferences/Macromedia/Flash\ Player/Logs/flashlog.txt .
</code>
あとはflexやるときにtailとかでてきとうに。
<code bash>
$ tail -f ~/library/Logs/flashlog.txt
</code>




=====AIR=====
  * [[http://help.adobe.com/ja_JP/AIR/1.1/devappsflex/|Adobe Flex 3 での Adobe AIR 1.1 アプリケーションの開発 ]]
  * [[http://help.adobe.com/ja_JP/AIR/1.1/devappshtml/|HTML および Ajax での Adobe AIR 1.1 アプリケーションの開発]]

=====Red5=====
http://osflash.org/red5/help




=====Link=====
  * [[http://livedocs.adobe.com/flex/3_jp/langref/|Adobe® Flex™ 3.2 リファレンスガイド]]
  * [[http://examples.adobe.com/flex3/consulting/styleexplorer/Flex3StyleExplorer.html| Flex Style Explorer v3.0]]
  * [[http://examples.adobe.com/flex2/inproduct/sdk/explorer/explorer.html|Tour De Flex]]
  * [[http://www.degrafa.org/index.html|Degrafa]]
  * [[http://livedocs.adobe.com/flex/3_jp/html/help.html?content=Part2_DevApps_1.html|Adobe Flex3ヘルプ]]
  * [[http://help.adobe.com/ja_JP/ActionScript/3.0_ProgrammingAS3/WS5b3ccc516d4fbf351e63e3d118a9b8cbfe-7ff7.html|Adobe ActionScript3.0]]
  * [[http://www.adobe.com/support/documentation/jp/flex/|Adobe Flexリソース]]
  * [[http://akabana.sandbox.seasar.org/ja/products/yui/index.html|yui]]
  * [[http://code.google.com/intl/ja/apis/maps/documentation/flash/intro.html|Google Maps API for Flash Developer Guide]]
  * [[http://www.adobe.com/cfusion/exchange/index.cfm?event=productHome&exc=15&loc=en_us|Adobe(Flexコンポーネント紹介サイト)]]
  * [[http://flexbox.mrinalwadhwa.com/|Flex Box (Flexコンポーネント紹介サイト)]]
  * flex3 sdkのダウンロード場所[[http://opensource.adobe.com/wiki/display/flexsdk/Download+Flex+3|Flex 3 Downloads]] \\
  * flex4 sdkのダウンロード場所(MX+Sparkコンポーネント使う場合はsdk4じゃないとだめ)[[http://opensource.adobe.com/wiki/display/flexsdk/Download+Flex+4|Flex 4 Downloads]]
  * flash player10のdebugはflex_sdk3.2を解凍したruntimes/player/10においてある。または[[http://www.adobe.com/support/flashplayer/downloads.html|ここ]]
  * [[http://www.adobe.com/jp/shockwave/download/alternates/|uninstall flash player]]
  * [[http://www.adobe.com/devnet/air/ajax/samples.html|Adobe AIR Developer Center for HTML and Ajax ]]
  * [[http://www.libspark.org/wiki|Spark project]]
  * [[http://designingwebinterfaces.com/great-flex-ux|6 Tips for a Great Flex UX: Part 1]]