Взаимодействие JavaScript / jQuery Flash AS3 - PullRequest
0 голосов
/ 27 декабря 2011

Я занимаюсь проектированием музыкального плеера с использованием JavaScript (jQuery) и HTML5, а Flash AS3 откатился назад.По сути, я хочу щелкнуть элементы управления HTML и заставить их взаимодействовать со флэш-памятью, чтобы воспроизводить / приостанавливать и пропускать дорожки в списке воспроизведения (файл JSON списка воспроизведения, читаемый JavaScript, передает идентификатор файла в AS3, AS3 читаетдругой файл JSON для получения URL-адреса, а затем воспроизводит аудио)

Это позволяет мне использовать только Flash для воспроизведения аудио, создавая, таким образом, тот же пользовательский интерфейс независимо от поддержки браузера HTML5.

I 'Я предполагаю, что мне придется «слушать» события в AS3, однако любые указания о том, как задействовать эти события в JS и реагировать на события в AS3, были бы очень полезны!

Ответы [ 2 ]

1 голос
/ 28 декабря 2011

У меня был ответ на этот вопрос, но затем ответ был принят до того, как я его закончил.В любом случае вот оно:

Main.as (класс документа):

package 
{
    import flash.display.Sprite;
    import flash.events.Event;
    import flash.external.ExternalInterface;
    import flash.media.Sound;
    import flash.media.SoundChannel;
    import flash.net.URLRequest;

    public class Main extends Sprite 
    {
        private var _sound:Sound;
        private var _soundChannel:SoundChannel;

        public function Main():void 
        {
            if (stage) init();
            else addEventListener(Event.ADDED_TO_STAGE, init);

        }// end function

        private function init(e:Event = null):void 
        {
            removeEventListener(Event.ADDED_TO_STAGE, init);

            if (ExternalInterface.available)
            {
                ExternalInterface.addCallback("loadSound", loadSound);
                ExternalInterface.addCallback("stopSounds", stopSounds);

            }// end if

        }// end function

        private function loadSound(url:String):void
        {
            _sound = new Sound();
            _sound.load(new URLRequest(url));
            if (_soundChannel) _soundChannel.stop();
            _soundChannel = _sound.play();

        }// end function

        private function stopSounds():void
        {
            _soundChannel.stop();

        }// end function

    }// end class

}// end package

sounds.json:

{ "sounds" : {
    "sound": [
        { "name": "Sound 1", "url": "sounds/sound1.mp3" },
        { "name": "Sound 2", "url": "sounds/sound2.mp3" },
        { "name": "Sound 3", "url": "sounds/sound3.mp3" }
    ]
}}

index.html:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8"/>
    <title>SoundPlayer</title>
    <meta name="description" content="" />
    <script src="js/swfobject.js"></script>
    <script src="js/jquery.min.js"></script>
    <script>
        var flashvars = {
        };
        var params = {
            menu: "false",
            scale: "noScale",
            allowFullscreen: "true",
            allowScriptAccess: "always",
            bgcolor: "",
            wmode: "direct" // can cause issues with FP settings & webcam
        };
        var attributes = {
            id:"SoundPlayer"
        };
        swfobject.embedSWF(
            "SoundPlayer.swf", 
            "altContent", "0", "0", "10.0.0", 
            "expressInstall.swf", 
            flashvars, params, attributes);
    </script>
    <style>
        html, body { height:100%; overflow:hidden; }
        body { margin:0; margin-top:25px; }
        .button { float:left; margin-left:25px; width:100px; height:60px;
                  background-color:#fafafa; border: 1px solid #e1e1e1;
                  font-size:15px; font-family: Arial; text-align:center; padding-top:40px;
                  text-decoration: none; color: #323232; } 
    </style>
</head>
<body>
    <script>
    $(document).ready(function() {

        var soundPlayer = $("#SoundPlayer").get(0);

        $.getJSON('json/sounds.json', function(data) {

            $.each(data.sounds.sound, function(i, sound) {

                $("<a href=\"#\" class=\"button\">" + sound.name + "</a>")
                .click(function () { soundPlayer.loadSound(sound.url); })
                .appendTo("body");

            });

            $("<a href=\"#\" class=\"button\">Stop Sounds</a>")
            .click(function() { soundPlayer.stopSounds(); })
            .appendTo("body");

        });

    });
    </script>
    <div id="altContent">
        <h1>SoundPlayer</h1>
        <p><a href="http://www.adobe.com/go/getflashplayer">Get Adobe Flash player</a></p>
    </div>
</body>
</html>
1 голос
/ 27 декабря 2011

Для связи между JavaScript и ActionScript вы можете использовать API-интерфейс ExternalInterface:

http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/flash/external/ExternalInterface.html

В качестве альтернативы тому, что вы хотите сделать, вы можете использовать SoundManager 2 для воспроизведения звука и выполнять все свои собственные программирования на JavaScript:

"Используя HTML5 и Flash, SoundManager 2 обеспечивает надежную кроссплатформенность аудио под одним JavaScript API. "

http://www.schillmania.com/projects/soundmanager2/

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...