www.webdeveloper.com
Results 1 to 5 of 5

Thread: How do I create an object with its own events

  1. #1
    Join Date
    Jan 2014
    Posts
    7

    How do I create an object with its own events

    Suppose I create an object such as YouTube's video player (but not the same, this is just for an example). I want to fire events when the player ends, and when it starts playing, etc.
    So in any code by any customer that uses my object, I want him to be able to do something like:
    Code:
     player.addEventListener("onWeirdPlayerEnded", "somefunction");
    I do know that there is such a thing as a javaScript "createEvent" feature such as:
    Code:
    var ppEvent = document.createEvent('CustomEvent');
    However, I have some questions about it.

    Lets say in my player code, I have function that does something like this:
    Code:
    function reachedEnd() {
    // do something
    }
    It seems to be that I should fire the event "onWeirdPlayerEnded" at this point (within the function). But I don't think I should create it with "createEvent" at the same time that I fire it. I should just fire it. Creation should have happened earlier.

    So what I need to know is:
    1. Where and how do I create the event and give a name such as "onWeirdPlayerEnded"
    2. How do I fire the event (in the do something... area)
    3. Can the customer's use it in his webpage with his "addEventListener".
    Thanks

  2. #2
    Join Date
    Mar 2007
    Location
    localhost
    Posts
    2,506
    What events are you talking about adding?
    Yes, I know I'm about as subtle as being hit by a bus..(\\.\ Aug08)
    Yep... I say it like I see it, even if it is like a baseball bat in the nutz... (\\.\ Aug08)
    I want to leave this world the same way I came into it, Screaming, Incontinent & No memory!
    I laughed that hard I burst my colostomy bag... (\\.\ May03)
    Life for some is like a car accident... Mine is like a motorway pile up...

    Problems with Vista? :: Getting Cryptic wid it. :: The 'C' word! :: Whois?

  3. #3
    Join Date
    Jan 2014
    Posts
    28
    Depends what player you're using, Here's an example from Flow Player.

    Code:
    var api = flowplayer();
    
    // bind to the finish event
    api.bind("finish", function(e, api){
        alert("Bacon");
    });

  4. #4
    Join Date
    Mar 2007
    Location
    localhost
    Posts
    2,506
    Ok, if you are using HTML5 then you can use one of the HTML5 video player triggers to fire an event on playback end.

    You might want to consider a test to see if the HTML5 video / audio are supported then use a different player as a fall back position, much simpler.
    Yes, I know I'm about as subtle as being hit by a bus..(\\.\ Aug08)
    Yep... I say it like I see it, even if it is like a baseball bat in the nutz... (\\.\ Aug08)
    I want to leave this world the same way I came into it, Screaming, Incontinent & No memory!
    I laughed that hard I burst my colostomy bag... (\\.\ May03)
    Life for some is like a car accident... Mine is like a motorway pile up...

    Problems with Vista? :: Getting Cryptic wid it. :: The 'C' word! :: Whois?

  5. #5
    Join Date
    Jan 2014
    Posts
    7
    The answer is this:
    var msg = document.getElementById("msg").value.trim();

    if (msg && window.CustomEvent) {
    var event = new CustomEvent("newMessage", {
    detail: {
    message: msg,
    time: new Date(),
    },
    bubbles: true,
    cancelable: true
    });

    this.dispatchEvent(event);
    }

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles