I am currently coding a website for a band and i have a music player located within a frame in the website. I would like to make the music player pop out from within the page when i click on a button.
I was wondering if there was some sort of javascript/jquery code i can employ for this function. If not, what other work-around can i use to achieve this.
If possible, as part of the function, i would like the frame to close from the window after it has popped out, and the other frame to load up as a complete website.
If you must... ;)
http://javascript.internet.com/generators/popup-window.html
You can call javascript window.open() function from your flash music player with ExternalInterface.call() (and make sure you've set allowScriptAccess=samedomain as flash param in html for it to work).
Then open your music player swf in a popup with some additional parameter attached, so you know that it lives in popup window.
To make the popup version continue playing where framed one was at, you can use a LocalConnection call. The framed version would listen for LocalConnection, and expose its current play state (what is playing, at what second etc) and popped up version could ask for this and continue exactly from the same place. This will make the popping up experience much smoother for end user.
Finally the framed player can call additional javascript functions via ExternalInterface.call() to remove itself from framed document's DOM.
Related
I was creating a website for my YouTube channel since I make music for YouTube and etc.
I was wondering how can I add a mp3 player for my website without it stopping on every page reload.
I want the mp3 player to constantly playing no matter how many pages it goes on.
One way I only think this will work is having it on another server side. But the thing is that 1 person isn't going to want to listen to the same music on the website.
I'm able to just broadcast the song on one page but I want users to listen to my music and browse other pages as well.
Can someone please show me how to do this? Thanks :)
There's two ways you can do that:
The correct way would be for you to set up all your site content as AJAX calls, so your MP3 player would be at the top and untouched. It requires programming knowledge and some planning to make all the AJAX calls correctly.
The easy way, although i don't recommend because it's not W3C valid, is to put a frame at the top with your mp3 player, so it won't postback with the rest of the page when you navegate.
load your content into a div/iframe and have the mp3 playing on the main page.
You'd be best off to go with a div loaded content, iframes are going out the way of the dinosaur.
<----- Main Page -----> Music Player here
>----- ContentDiv -----< Load content into the div
<----- Main Page -----> Or Music Player here
or with an html mockup, Content being what you load your pages into, Music Player being on the main page and never being reloaded.
<head></head>
<body id="mainpage">
<div id="musicplayer"></div>
<div id="content">
</div>
</body>
The answer the Mike has suggested would be a very SEO unfriendly method, if thats a concern, but the only way I can think of to have the music completely unbroken. If you don't mind the break in music between page loads, then you would need to capture the current play length of the track and then pass that in either a cookie or as a parameter in the url which would require you to montior the user behavior and have a js function bound to all naviagtion links monitoring that.
I already know that you can have an embedded Vimeo video start from a certain point by adding this line of code #t=0m0s to the iframe source, but what I'm trying to achieve is to have the time the viewer is on the page be cookied so it can set the start point when they return.
This way the video picks up where they left off.
I know the values can be passed with cookies so I'm assuming it's possible, I just don't have the javascript knowledge to wrap my head around it.
Any ideas if this is actually possible?
You can use our JavaScript API to listen for the playProgress event to record how far along they are in the video, then use the beforeunload event on window to store the value that you have in a cookie.
I am building a site for someone who wants to have a sound cloud player on his site, but wants it skinned up to look integrated into the site. For the moment, I am using a script which will create an iframe element within a hidden div (which auto plays), and when a new item is selected to play, it clears the div, and replaces it with a new iframe element.
The next phase for the project requires a bit more integration though. I have been searching for javascript sound cloud integration, but all it seems to provide is creating a simple link that will play and pause the track (only on the users request) with a little bit of javascript to coax it into playing immediately.
Are there any other integrations for sound cloud via javascript that would allow for playing, pausing, stopping and getting information about the current play position (like from an event), as well as other events (like onstart, onstop, onpositionchange, etc)?
Ah ha, found the answer. Have a look on: http://developers.soundcloud.com/docs/api/sdks#javascript
The SC.stream seems to provide all the answers
I am looking to have a video start when a page loads, but once the video has completed, to hide the video (remove the layer possibly). I saw it on a yoga site a few years ago where a video message from the owner appeared over top the content when the page loaded but then dissapeared after the video was done. Not even sure where to begin looking for something like this.
This is something that needs to be handled at the player level. Many flash players or frameworks allow you to register for an event. One event might be on video complete. First get this working. You may not be able to do this from javascript. For example, adobe's strobe player requires you to write a swf plugin which would be loaded in the flash player. Not trivial.
After you have registered it, you can easily close the window by executing some javascript function.
Let me know if you have more questions.
I have a video playing on my page. I want to show and hide some div's when the video reaches a certain point. Lets say hide something on 10th second and show it again on 20th second.
I can easily do it in HTML5 with video tag and currentTime attribute but for IE I have to create the same functionality and I think with flash based videos (from YouTube or something like that).
Is there a way to detect the current time of a video playing on my website, embeded from YouTube, Metacafe or any other video sharing site?
I know I could detect it in flash and make it run some JavaScript function but I don't have flash nor have the skills to do it in AS3.
Is it possible to do it from JavaScript level or does any video sharing website out there provides this kind of functionality for their videos?
You could look into using flowplayer, it exposes events for meta data and timing.
You can use ExternalInterface to communicate between flash and js. So inside the flash app, when the video reaches the defined time, you can trigger a call to js function, doing whatever you need with the divs.
Since you will need to receive a stream and you need to detect a specific point in the video I thing you have read this inside flash.