Javascript Variable

[dee]

Hi All,

I know there is some programming awesomeness around here so hope you dont mind me asking. Im trying to make a soundcloud widgit api variable global scope, so I can access in another function. Probably simple but cant get my head round it . Heres the souncloud widget api bit:



(function(){
var widgetIframe = document.getElementById('sc-widget'),
widget = SC.Widget(widgetIframe);

widget.bind(SC.Widget.Events.READY, function() {
widget.bind(SC.Widget.Events.PLAY, function() {
getOutput();
// get information about currently playing sound
widget.getCurrentSound(function(currentSound) {
console.log('sound ' + currentSound.get('') + 'began to play');
});
});
// get current level of volume
widget.getVolume(function(volume) {
console.log('current volume value is ' + volume);
});
// set new volume level
widget.setVolume(1.0);
// get the value of the current position
});

}());



I need to get the track name currentSound into a global outside the scope of this function. Any help appreciated.

 

[Edwin]

Here you go...
http://stackoverflow.com/questions/5786851/define-global-variable-in-a-javascript-function

 

[RobM]

Just declare it outside of the function. You don't need to give it a value just create it.
eg
<script>
var a;
function dosomething()
{
var b;
a=4; b=5;
}
</script>


'a' will be 4 throughout your code when set however 'b' will only exist and be 5 inside your function.

 

[dee]

Thanks for your help Edwin and Rob ! Slowly getting my head round scope.

Okay... so this is where i got too:

Ive declared the var trackName outside function ( so it exists in global scope ?...thank you )

Im then setting that variable within the soundcloud api function ( trackName = 'Song ' + currentSound.get; )

Im then trying to add this to a url parameter further down. I have the system working... it sends me emails on the play event , but the track name trackName var comes in as undefined.

Heres my current code minus the email stuff, the variable comes in as undefined though



<script type="text/javascript">
var trackName;

(function(){
var widgetIframe = document.getElementById('sc-widget'),
widget = SC.Widget(widgetIframe);

widget.bind(SC.Widget.Events.READY, function() {
widget.bind(SC.Widget.Events.PLAY, function() {
getOutput();
// get information about currently playing sound
widget.getCurrentSound(function(currentSound) {
console.log('sound ' + currentSound.get('') + 'began to play');

trackName = 'Song ' + currentSound.get;

});
});
// get current level of volume
widget.getVolume(function(volume) {
console.log('current volume value is ' + volume);
});
// set new volume level
widget.setVolume(1.0);
// get the value of the current position
});

}());



// handles the play event for player
function getOutput() {

getRequest(
'track.php?v='+ trackName, // URL for the PHP file
drawOutput, // handle successful request
drawError // handle error
);
return false;
}

 

[seemly]

One thing I notice is that you are calling getOutput(); before the trackName variable has been set?
Also, you don't have to set the variable globally (avoiding polluting the global scope), just pass the track name into the function?

Something like this:
https://jsfiddle.net/xfpmjogh/

 

[dee]

Thanks for your perseverance on this. It' s doing my head in ! Even if i define the var trackName as something definite, its not passing . Heres my full code.

In the php get request I have an email script.This is all fine and sending. Just the trackName variabe comes in as undefined still.

<script type="text/javascript">
var trackName;

(function(){
var widgetIframe = document.getElementById('sc-widget'),
widget = SC.Widget(widgetIframe);

widget.bind(SC.Widget.Events.READY, function() {
widget.bind(SC.Widget.Events.PLAY, function() {

// get information about currently playing sound
widget.getCurrentSound(function(currentSound) {
console.log('sound ' + currentSound.get('') + 'began to play');

trackName = 'Trying To Get Trackname From Widget';

});
});
// get current level of volume
widget.getVolume(function(volume) {
console.log('current volume value is ' + volume);
});
// set new volume level
widget.setVolume(1.0);

getOutput();
});





// handles the play event for link
function getOutput() {

getRequest(
'track.php?v='+ trackName, // URL for the PHP file
drawOutput, // handle successful request
drawError // handle error
);
return false;
}
// handles drawing an error message
function drawError() {
var container = document.getElementById('output');
container.innerHTML = 'error!';
}
// handles the response, adds the html
function drawOutput(responseText) {
var container = document.getElementById('output');
container.innerHTML = responseText;
}
// helper function for cross-browser request object
function getRequest(url, success, error) {
var req = false;
try{
// most browsers
req = new XMLHttpRequest();
} catch (e){
// IE
try{
req = new ActiveXObject("Msxml2.XMLHTTP");
} catch(e) {
// try an older version
try{
req = new ActiveXObject("Microsoft.XMLHTTP");
} catch(e) {
return false;
}
}
}
if (!req) return false;
if (typeof success != 'function') success = function () {};
if (typeof error!= 'function') error = function () {};
req.onreadystatechange = function(){
if(req.readyState == 4) {
return req.status === 200 ?
success(req.responseText) : error(req.status);
}
}
req.open("GET", url, true);
req.send(null);
return req;
}

}());
</script>

 

[seemly]

Now getOutput is being called outside of the Play event - so trackName has still not (always) been set.

Try this:
https://jsfiddle.net/ex31gen7/

 

[dee]

That just kills it sending at all unfortunately.

 

[seemly]

That just kills it sending at all unfortunately.

Without seeing it in action, I am unable to help you further.

 

[dee]

@seemly Thanks for your time anyway. I'll dm you a link in a bit just in case you have a spare 5 mins to see in context. Either way, thanks for the input.