Integrating External JQUERY code with Edge Animate

Question

Hi all...
There are two ways i can see of integrating Edge Animate With External JQuery
Something happens within Adobe edge and triggers something to happen externally or vice versa.....
1: When an action is performed (mouseUp MouseOver... etc...) we can initiate some external Jquery
For example
When I "mouseUp" my play button i run the function  "playPause()" and my audio starts to play
function playPause(){
    if( $("#liveStream").data("jPlayer").status.paused ) {
        $("#liveStream").jPlayer("play");
    else {
        $("#liveStream").jPlayer("pause");
So this is fine... i perform an action in Adobe Edge and something external to the composition occurs, in this case it connects to a live stream of audio and the user gets the desired result.
2:When an event occurs in external Jquery (playing, connection lost, audio not ready... etc...) we can perform an action within Adobe Edge
For example
When the audio stream is playing and the user is definatly hearing music i need to perform an action within Adobe Edge like "sym.$("playButton").hide();" which hides the play button because obviously there is no need to click play anymore when the music is already playing..
This is were my Jquery understanding ends..
Questions:
1: Where do i put global code within my Adobe Edge composition that triggers actions when external jQuery returns an event
2: How do i go about coding this...
Below is my best attempt
function playStatus(){
     $("#liveStream").bind($.jPlayer.event.playing, function (event) {
          sym.$("playButton").hide();
Now my attempt is probably way off the truth but im hoping you understand what i am trying to achieve..
Thank you for reading this through
Any advice would be greatly appreciated.....
Justin..

Answer 1

Hi, thanks for the assistance....
I have tried to integrate the following code into the "creationComplete event"
//Initiate JPlayer
$(document).ready(function(){
    var stream = {
        mp3: "http://streaming.radionomy.com/ABC-Jazz"
    ready = false;
    $("#liveStream").jPlayer({
        ready: function (event) {
            ready = true;
            $(this).jPlayer("setMedia", stream);
        pause: function() {
            $(this).jPlayer("clearMedia");
        error: function(event) {
            if(ready && event.jPlayer.error.type === $.jPlayer.error.URL_NOT_SET) {
                // Setup the media stream again and play it.
                $(this).jPlayer("setMedia", stream).jPlayer("play");
        swfPath: "js",
        supplied: "mp3",
        preload: "none",
        wmode: "window",
        keyEnabled: true
//Create function for Play & Pause
function playPause(){
    if( $("#liveStream").data("jPlayer").status.paused ) {
        $("#liveStream").jPlayer("play");
    else {
        $("#liveStream").jPlayer("pause");
The above code used to be within a player.js file that i called into edge, As you have recomended to me i have moved this code to within edge...
When i try to play the stream i get the following error from the console "Javascript error in event handler! Event Type = element"
It is refering to edge.3.0.0.min.js
In a bit stuck now as to why it is not working....
This error is usually generated when the scripts are not talking to each other so im guessing it should be an easy one for you guys as my knowledge of jquery is not great!