Basically I want the user to record a sound with the SoundCloud recorder and once they click save, the sound they just recorded will be embedded on to my webpage.
I use the SC.record() method to get the recording. This is my function for where I save the recordings... Right now nothing is embedded when I try to run it
$('#save a').click(function(e) {
var currentURL ="";
e.preventDefault();
SC.connect({
connected: function() {
$('.status').html('Uploading...');
SC.recordUpload({
track: {
title: 'whatever',
sharing: 'public'
}
}, function(track) {
currentURL = '"'+track.permalink_url+'"';
$('#SCtracks').append('<li id='+currentURL+'>'+currentURL+'</li>');
SC.oEmbed(currentURL, {color: "ff0066"}, document.getElementById(currentURL));
});
}
});
});
But if I go in and call SC.oEmbed with a URL to a recording I made earlier it works fine.
So I think I might be trying to embed the recording before it is fully uploaded, but I don't know where else I could put that statement.
Thanks
This answered my question. I guess you have to just keep checking the state until it is for sure done. If someone know a quicker way please answer
Related
I have a website that plays an icecast stream with jPlayer.
I want the play button to always start the stream from the live position (like a radio) instead of picking the stream back up from the last position. Attempted behavior:
play plays the stream live > pause suspends / discards the stream / optionally stops downloading it > play plays the stream from live position / reloads the stream.
There is a way to monitor the current media position with $.jPlayer.event.timeupdate as mentioned in comment on this post, and use that to resume playing from the end of the stream.
Alternatively, there must be a way to discard the stream when pausing and then reloading it when hitting play again. I think it is what is happening on this jPlayer demo. But I don't know how to do that part:
The error event is used with a check for the URL_NOT_SET error type to jPlayer("setMedia",stream) back to the live-stream again and jPlayer("play") it.
I am new to javascript and can't make it work. I can't find another post of someone trying to do that. I tried with the "playhead" at 100 which does not start the stream at all.
Here is the code I am using:
<script type="text/javascript">
//<![CDATA[
$(document).ready(function(){
$("#jquery_jplayer_1").jPlayer({
ready: function () {
$(this).jPlayer("setMedia", {
mp3: "http://realbadradio.ddns.net:21000/mpd.mp3"
})
},
});
});
//]]>
</script>
Here the repo to my website for full code.
I finally found the solution thanks to this answer on a different question related to achieving autoplay in jPlayer.
SOLUTION
$(document).ready(function(){
const stream = {
// stream address
mp3: 'http://realbadradio.ddns.net:21000/mpd.mp3'
};
ready = false;
$("#jquery_jplayer_1").jPlayer({
ready: function () {
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");
}
},
keyEnabled: true,
preload: 'none',
});
});
Solved this myself and it made me feel silly. What I was looking to do is not properly referenced in the API article. Giving the solution for others looking to achieve this.
The solution is:-
I've found the solution myself and boy do I feel silly. It's not referenced correctly in the YouTube Player API.
After many hours of playing with it, here is the solution.
// Skip dead videos
function onPlayerError(event) {
window.location.reload(true);
}
This requires you have the following in the YouTube Player calls:-
'onError' : onPlayerError
I am loading an array of video id's into the player, sometimes thousands (randomly). I have been trying to figure out a way to reload the page if x video shoots out an error.
The YouTube Player API lists only a couple error codes:-
https://developers.google.com/youtube/iframe_api_reference#Events
However, this does not cover private/copyright videos.
As is when a video ends I reload the page to randomly load a new video with:-
function onPlayerStateChange(event) {
if(event.data === 0) {
window.location.reload(true);
}
}
I have tried the below to no avail:-
// skip copyright videos
function onPlayerError(errorCode) {
if(errorCode == auth) {
window.location.reload(true);
}
}
The error code here is what I pulled out of the debug info for a copyright video (its the same for private). However, this is not in the API, thus does not work.
I also tried the following:-
// skip by numeric code
function onPlayerError(errorCode) {
if(errorCode == 100) {
window.location.reload(true);
}
}
Which is a valid error code and should work, but doesn't seem to want to.
I've tried a few other methods as well thinking I could read the API info and force a function, seems not. Have also tried fiddling with PlayerState.
Before anyone asks. No, I cannot use playlist embeds.
If anyone could help out, I'd really appreciate it!
Thanks
This has been bugging me for a while now, I am using this generic script to create a player
var player = new YT.Player(videoArray[0], { videoId : videoArray[0], events : { 'onStateChange' : onPlayerStateChange } });
I have the callback function set up with just a simple console.log the problem is when I change the state of a player the console throws
https://www.youtube.com/get_video?noflv=1&video_id=ghUA.... GET 404 from the file html5player-en_US-vfloyxzv5.js:39 witch I asume is loaded by the YouTube Iframe API.
Any ideeas or posibile solutions will be greatly apreciated.
Sadly, this is one of the numerous little things you'll have to cope with using the Youtube Player API. I don't think there is any solution, and we can only wait for a Youtube fix.
A bug report has already been created, feel free to vote for it.
Youtube player is updated every tuesday. Hopefully, this will be fixed someday.
I found out what I was doing wrong, I am posting this maybe it will help someone along the way.
Since the videoArray was holding jQuery object, I used this piece of code to get it all working.
if(isYouTubeVideo) {
videoID = iframeSrc.substr(baseUrlLength);
}
videoArray[i] = {};
videoArray[i].id = videoID;
jQuery.ajax({
dataType: 'JSON',
url: 'https://gdata.youtube.com/feeds/api/videos/' + videoID + '?v=2&alt=json'
})
.done(function(data) {
videoArray[i].title = data.entry.title.$t;
});
jQuery(this).attr('id', videoID);
playerArray[i] = new YT.Player(videoArray[i].id, { event : //Events here})
I hope this helps someone :)
I get this for certain videos. In my experience, the get_video 404 doesn't matter - the video still loads correctly.
There is one random caveat though; if you're running this on an iPhone connected to Mac Safari Web Inspector, the 404 causes the video to stop loading. This caused me hours of fun!
Im using soundcloud dot com to upload my sounds. i want to press a button within my mobile application and have that sound play.
So basically i want my sound to be referenced from the URL that I am given when the button is pressed by the user.
I need to do it with Javascript only. No HTML 5 please. Any help is greatly appreciated cause this is Xtremely frustrating. Any ideas? Thanks in advance.
It's pretty simple to get started really:
function playSound(url) {
var a = new Audio(url);
a.play();
}
Use that as whatever event handler you want for your application. Of course, I'd hope you'd want to do more than just play (for example, maybe pause would be good too?), but it's a start.
let sound = new Audio("http://sound.com/mySound.mp3");
//on play event:
sound.onplay = () => {
};
//on pause event:
sound.onpause = () => {
};
//on end event:
sound.onended = () => {
};
//play:
sound.play();
//pause:
sound.pause();
//stop:
sound.pause();
sound.currentTime = 0;
Use jPlayer to play sound using Javascript. This will take you a lot of time and frustration.
jplayer.org/
Here's what your code might look like with jPlayer. Note: You're not forced to use a skin with jPlayer because all it is is just an API to play audio.
Example code to play a video or audio on load.
$(function() { // executed when $(document).ready()
$("#jpId").jPlayer( {
ready: function () {
$(this).jPlayer("setMedia", {
m4v: "http://www.myDomain.com/myVideo.m4v" // Defines the m4v url
}).jPlayer("play"); // Attempts to Auto-Play the media
},
supplied: "m4v",
swfPath: "jPlayer/js"
});
});
http://jplayer.org/latest/developer-guide/
I am working on my first extension for Google Chrome. I want to be able to hit the "Thumbs Up" button on the Google Music Beta page using my extension. For some reason, the thumbs up button seems to be much more complicated than shuffle, repeat, play, next, and previous. For all of those, the following code works:
chrome.tabs.executeScript(tab_id,
{
code: "location.assign('javascript:SJBpost(\"" + command +
"\");void 0');",
allFrames: true
});
where command="playPause", "nextSong", "prevSong", "toggleShuffle", "togglePlay", etc.
I figured a lot of those out using the developer tools to follow the stack trace and see the arguments given to SJBpost. Trying SJBpost with "thumbsUp" returns an error.
Obviously this question is going to be restricted to a smaller crowd since not everyone is going to be able to view the source of Google Music, but if you can help me out, I would greatly appreciate it.
The div for the thumbs up on the Google Music page looks like this:
<div id="thumbsUpPlayer" class="thumbsUp" title="Thumbs up"></div>
Now, I've tried doing this using jQuery:
$("#thumbsUpPlayer").click()
But I get TypeError, undefined_method message in the javascript console.
Any help would be greatly appreciated. I am a huge beginner to javascript and plugins, and all of this stuff, and I'm really excited to get these last pieces of the extension together.
Thank you!
It seems that Google Music Beta doesn't actually listen on the click() event per se, rather, it is based on the events which usually precede the actual click event: mouseover, mousedown and mouseup.
I'm not a jQuery expert, so I can't exactly figure out why $("#thumbsUpPlayer").mouseover().mousedown().mouseup() doesn't work (neither does doing .trigger).
Anyway, here's some (tested on June 21) working javascript code (no dependencies).
function triggerMouseEvent(element, eventname){
var event = document.createEvent('MouseEvents');
event.initMouseEvent(eventname, true, true, document.defaultView, 1, 0, 0, 0, 0, false, false, false, false, 0, element);
element.dispatchEvent(event);
}
function replicateClick(element){
triggerMouseEvent(element, 'mouseover');
triggerMouseEvent(element, 'mousedown');
triggerMouseEvent(element, 'mouseup');
}
function thumbsUp(){
replicateClick(document.getElementById('thumbsUpPlayer'));
}
function thumbsDown(){
replicateClick(document.getElementById('thumbsDownPlayer'));
}
It should be probably fairly easy to use, just call thumbsUp() if you want a thumbs up or call thumbsDown() if you want to thumbs down.
I've been looking into this today and found that you can trigger a lot of the commands using SJBpost from the console.
http://hints.macworld.com/article.php?story=20110622061755509
SJBpost('thumbsUpPlayer');
Commands I've tried and can confirm working:
playPause
thumbsUpPlayer
thumbsDownPlayer
prevSong
nextSong
I'm still looking into commands which let you retrieve current artist / track info. Let me know if you find out what those are.
The following snippet from the 'music plus for google' chrome extension might be of interest:
function playback_action(type, callback) {
var $button;
if (type == 'playPause') {
$button = $('button[data-id="play-pause"]');
}
else if (type == 'nextSong') {
$button = $('button[data-id="forward"]');
}
else if (type == 'prevSong') {
$button = $('button[data-id="rewind"]');
}
else if (type == 'currently_playing') {
$button = $('button[data-id="play-pause"]');
}
if ($('button[data-id="play-pause"]').attr('disabled')) {
$instant_mix = $('li[data-type="rd"]').click();
setTimeout(function() {
$('div[data-type="im"] .radio-icon').first().click();
}, 1000);
}
else {
$button.click();
}
callback();
}
When the above snippet stops working, check the link again and see if maybe the author updated the extension to something that works.