wonderfl - build flash online

Frequently Asked Questions

どうやってコードを書けばいいの?
"build from scratch"または"fork"してコードの編集画面に行き、
左側のtextareaにactionscriptコードを書きます。

数秒キー操作が無ければ、textareaに入力したコードを自動でコンパイルし、もしあれば、errorやwarningメッセージを、下部のtextareaに表示します。
メッセージを参考にしながらコードを修正しましょう。

めでたくコンパイルが通ると、右側にFlashが表示されます。
思い通りのswfができましたか?
Couldn't Connect With Server?
コードを書いて、コンパイルしようとしている時に、コード編集画面のメッセージエリア(右下の黒いエリア)に以下のようなメッセージが出る場合、
"[ERROR]Couldnt Connect with Server, Reconnecting..."

wonderflのコンパイラーに接続できていない状態です。
ネットワークの問題の可能性がありますので、ファイアウォールやウィルス対策ソフト、NATの設定を確認し、以下のサーバに接続できることを確認してください。
domain: compiler1.wonderfl.net port: 4000 TCP
domain: compiler2.wonderfl.net port: 4000 TCP

ターミナルに以下のように入力し:
telnet compiler1.wonderfl.net 4000
以下のように表示されれば:
Connected to compiler1.wonderfl.net.
あなたのネットワークに問題はありません。wonderflのサーバに問題があり、開発チームが対応しているはずです:-) 少々お待ちください。
質問&回答(Q&A)機能の質問方法
以下のようにして、コードを質問として投稿することができます
※質問とは、単純に question タグのついたコードです。
※そしてコードに question タグがついていると、Flash 質問&回答 (Q&A)ページにコードが掲載されます。
  1. wonderflでコードを書く時に、タグに"question"を入れる
  2. コードのタイトルやコメント欄を使って、自分のできた事、質問の内容(やりたいけどできなかったこと)、を具体的に説明しましょう。
→ 質問一覧へ
質問&回答(Q&A)機能の回答方法
以下のようにして、質問に回答することができます
※質問への回答とは、単純にコードをforkすることで行います
  1. このページの下部に、質問の一覧が表示されますので、クリックしてコードページへ行き、コードやコメントから質問の意図を読み取ります
  2. コードページからforkをクリックして、質問者のできなかったことを実現するようなコードを書きましょう

→ 質問一覧へ
質問&回答(Q&A)機能の質問の終了方法
以下のようにして、質問への回答(fork)を締め切ることができます
  1. 満足する回答を得られたら、タグにいれていた"question"を"question-closed"に変更して、質問を閉じましょう
  2. 回答していただいた方へ感謝!
→ 質問一覧へ
related actions, my actionsって?
wonderflユーザーのページには、related actionsとmy actionsというメニューがあります。

related actionsには、そのユーザーと、そのユーザーがフォローしている人がwonderflの中で行ったアクションについて、お知らせしています。
my actionsには、そのユーザーが起こしたアクションのみをお知らせします。

wonderflにユーザー登録したら、自分のページのrelated actionsをRSS購読するとよいでしょう。コードランキング等でユーザーを発見し、フォローすると、フォローしたユーザーがwonderflでコードを投稿したりアクションをすると、RSSでそれを見ることができます。

wonderfl内で、以下のような操作を行った時に、アクションに通知がいきます。
  • * コードを作成した時に、コードを作成したユーザーと、作成したユーザーをフォローしているユーザーと、もしコードが他のコードをForkして作成された場合にはFork元のコードを投稿したユーザーに、通知がいきます
  • * コードを前回編集してから3時間後以降に再度編集した時に、コードを作成したユーザーと、作成したユーザーをフォローしているユーザーと、もしコードが他のコードをForkして作成された場合にはFork元のコードを投稿したユーザーと、さらにそのコードにtalkがある場合にはtalkを投稿したユーザーに、通知がいきます
  • * コードをお気に入りに追加した時に、コードをお気に入りに追加したユーザーと、そのユーザーをフォローしているユーザー、そしてお気に入りに追加されたコードを投稿したユーザーに、通知がいきます。
  • * ユーザーが他のあるユーザーをフォローした時に、フォローしたユーザーと、そのユーザーをフォローしているユーザーと、フォローされたユーザーに、通知がいきます
  • * talkを投稿した時に、talkを投稿したユーザーと、talkがついたコードを投稿したユーザーと、そのコードについた他のtalkを投稿したユーザーと、talkを投稿したユーザーをフォローしているユーザーに、通知がいきます
Actionscript3コンパイラのバージョン
Version 4.5.0.20967
使用可能なActionscript3ライブラリ
moved to libraries
キャプチャについて

作成したFlashのキャプチャは自動的に作成されます。
コードを編集中の間にのみ、swfロード完了後一定時間(デフォルト:3秒)経過後に、stageの画面をキャプチャしたものをjpgにエンコードしてサーバに送信しています。
jpgへのエンコード処理は同期的に行っているため、このタイミングで一時的にフレームレートが落ちます。ご了承ください。
編集を完了し、作成されたswfファイルを閲覧する時にはキャプチャ処理は動作しませんので、閲覧するユーザーはキャプチャを意識することはありません。

キャプチャ処理のため、以下のようなコードをサーバサイドで自動的に挿入しています(wonderflユーザーがこのコードを見ることはないでしょう)。
Wonderfl.capture(stage);
Wonderflという名前のクラス名を自分のコード内で使う場合にはキャプチャができなくなる場合がございます。お控えください。

編集中のキャプチャ処理によるフレームレート低下が気になる場合には、以下のコードに示した方法を使って、
* キャプチャ処理のタイミングを変更すること
* キャプチャ処理を行わないように変更すること
が可能です。
次のコードをご覧ください。 Customizing Capture

外部のリソースを使用するにはどうすればよいですか?

外部のリソースを使用する際、フラッシュ・プレイヤーのセキュリティー・サンドボックスについて気をつける必要があります。
大まかに言って、異なるドメインからリソースをロードする際、フラッシュ・プレイヤーはcrossdomain.xmlを調べることにより、そのリソースが使用可能かどうかをチェックします。なので、必要なことは、

1. crossdomain.xmlを先ず調べる。(もし許可されていなければ、そのリソースにアクセスすることは出来ません。)
2. crossdomain.xmlがswf.wonderfl.netまたは"*"を許可していれば、そのリソースをロードして使うことが可能です。(ただし、リソースのライセンスについても考慮して下さい。)

コード・サンプルはこちらにあります。
より詳しくは、Adobeの資料(Flash Player 9セキュリティー白書)をご確認下さい。

Wonderflで作るSWFにはどんな制限がありますか?
トップ・レベルのパッケージとインターナル・クラスの使用
Wonderflでは現在単一のActionScriptファイルのみをコンパイルします。パッケージ名を宣言することは出来ません。

NG
package net.wonderfl {
}

OK
package {
}

複数クラスを使用するためには、インターナル・クラスをpackage {}の外に宣言することが出来ます。
アクセス属性は、デフォルトがインターナルとなっていますので、'internal'というキーワードを省略して、以下のようにクラスを定義することが可能です。

Main.as
package {
    import flash.display.Sprite;
    public class Main extends Sprite {
        public function Main() {
            new A();
        }
    }
}

A.as
package {
    public class A {
           .....    
    }
}

=>

package {
    import flash.display.Sprite;
    public class Main extends Sprite {
        public function Main() {
            new A();
        }
    }
}

class A {
       .....    
}


ExternalInterfaceが使用できない。
ExternalInterfaceを使用できるように、と計画していますが、現在のところはまだ使用できません。

ライブラリのリスト
使用できるライブラリのリストはこちらにあります。

SWFのサイズ
デフォルトのサイズは465 x 465になります。フルスクリーン・モードで見ることも可能です。
ライブ・コーディングを開始するにはどうすればよいですか?
エディタの左上にある'LIVE CODING'と書かれたボタンを押すことで、いつでもライブ・コーディングを始めることができます。



ライブ・コーディングが正常に開始されると、経過時間、視聴者数がエディタの上部に表示されるようになります。

チャット機能はどうやったら使えるの?
チャット機能はライブ・コーディングモードで使用可能となります。チャットをつかうためには、先ずライブ・コーディングを開始します。ライブ・コーディングが開始されると、チャットUIがエディタの右に現れます。



チャットの入力テキストエリアでは、'Enter'と'Shift Enter'は特別な意味を持ちます。
Enter   テキストエリア内の現在のメッセージを投稿する。
Shift Enter   改行する。

入力のテキストエリアはサイズが変更可能です。また、チャットUIの上部にある'Chat'と書かれたボタンをクリックすることで、チャットUIの表示・非表示を切り替えることができます。
WonderflEditorの特徴は何ですか?

エラー情報の表示
WonderflEditorはコンパイラと連携することで、コンパイル・エラーをフィード・バックします。以下の例では、変数'v'が宣言されていないというのを示しています。
error highlighing

自動コード補完
WonderflEditorはメソッド・変数・クラスの名前を補完します。ショートカットはCtrl + Space(Cmd + Space)となります。ここにいくつかの例を紹介します。

- ドキュメント・クラスで'adc'とタイプし、その次に'Ctrl + Space'とタイプすると、'addChild'が補完メニューに載ります。上下キーで候補を選択することができます。
エンター・キーを押すことで選択中の候補が補完されます。
error highlighing

- 変数を宣言し、その後‘:’とタイプすると、自動補完のメニューが現れます。‘:’の後に‘ldr’とタイプすると、Loaderが候補として現れます。

関数の説明
関数の名前の後に‘(‘とタイプすると、関数の説明がツールチップに表示されます。

リンクの挿入
WonderflEditorはURLにマッチする文字列を見つけると、下線を引き、リンクをつけます。

定義へジャンプと元に戻る
F4を押すことで、変数やメソッドの定義へジャンプすることができます。その後、Shift F4を押すことで、元の位置にジャンプすることができます。

検索
F3を押すことで、カーソル位置にある単語の次の出現にジャンプすることができます。Shift F3を押すことで、前の出現にジャンプすることができます。

キーボード・ショートカット
いくつかのショートカットはIEのようなブラウザ(Ctrl + Keyのイベントを送らない)で使用できないかもしれません。例えば、Ctrl + Nは新しいウィンドウを開くに結び付けられてしまいます。
F3 次の一致にジャンプ
Shift + F3 ひとつ前の一致へジャンプ
F4 定義へジャンプ
Shift + F4 元へ戻る(F4の後で)
Ctrl + N 次の行へ (補完メニューでは次の候補へ)
Ctrl + P 前の行へ (補完メニューでは前の候補へ)
Ctrl + F 次の文字へ
Ctrl + B 前の文字へ
Ctrl + J 改行

ライセンスについて

あなたがwonderflで書いたコードはあなたのものです。

あなたが書いたコードについて、そのライセンスをどのように指定するかはあなたの自由です。
ただし、wonderflはコードの共有を前提としたサービスであるため、
wonderflにコードを投稿した時点で、All rights reservedを選択した場合であっても、
* wonderflサービスが、wonderflサービスを通してそのコード及び生成したバイナリを頒布すること
* 他のwonderflユーザーが、wonderflのコア機能である'fork'を通して、あなたの作成したコードを複製、改変すること
は認めていただいているものと解釈します。

ライセンスは、コード作成時にコード毎に設定することができ、
またユーザー毎にデフォルト設定を行うことができます。

ライセンスは、コード編集時に以下
* All Rights Reserved
* MIT License
* GPLv3 License
* other license, see code comments
から選択でき、1,2,3つ目を選択する場合には、コード周辺にライセンス本文へのリンクを置くことでライセンスを宣言するものとします(wonderflサービスでリンクをおきます)。
4つ目を選択する場合には、ユーザー自身で、コード内にコメントとしてライセンスを記述してください。

他のユーザーのコードをforkした場合、コードのライセンスは基本的にはfork元のライセンスになります。
fork後にライセンスを手動で変更することはできません(GPLライブラリ使用の場合を除く)。
容易にライセンスを変更できることによる利便性より、簡単にライセンス違反を起こしてしまう問題を重く考えるためです。

GPL関連では、コードの保存やライセンスの変更時に、以下の制限を行っています。
* GPLライセンスでないコードで、GPLライセンスのライブラリを使用している場合には、コードのライセンスを自動的にGPLに変更します。その旨注意を喚起するようメッセージがメッセージエリア(コンパイラーからのエラーメッセージ等が表示されるコード下部のエリア)に表示されます。
* GPLライセンスのコード内で、GPL非互換のライブラリをimportして使用した場合には、そのコードを保存することができません
* GPLライブラリをimportして使用している場合には、そのコードのライセンスをGPL以外には変更できない

だれがつくったの?
面白法人カヤックのwonderflチーム

Director: kataoka
Assistant Director: takizawa
Designer: hashimoto
Markup Engineer: gunji
Programmer: ohtsuka
Programmer: sugi-yoshihiro
Flash Developer: kobayashi-taro
お問い合わせ
広告や協業のお問い合わせを現在大募集しております!
wonderflのユーザー層に向けた商品、Flash開発者の求人の広告、
wonderflのエンジンを使いたい、という方などなど、お気軽にお問い合わせください。
機能要望や不具合のご報告も受け付けております。お手数ですが以下へメールお願いいたします!

メール受付時間:平日10:00-18:00
info@wonderfl.net
Special Thanks!
サムネイル画像作成は HeartRails Capture を使わせていただいております。ありがとうございます。

ページの先頭へ戻る

KAYAC Project