Phonegap Geolocation Error: timeout - iphone

I've got the latest phonegap 1.2 and put the test code from the docs in my application. When I run my app both on the simulator (xcode 4.2 simulator 5.0) and on my iPad running 5, I get the error "Geolocation Error: timeout".
Has anyone else experienced this? Here is my code:
document.addEventListener("deviceready", onDeviceReady, false);
// PhoneGap is ready
function onDeviceReady() {
var myOptions = { enableHighAccuracy: true };
navigator.geolocation.getCurrentPosition(onSuccess, onError,myOptions);}
Thanks!


I think you missing with the script file importing issue. You need to import phonegap-1.2.0.js rather than phonegap.js.
following snippet work in iOS 5 simulator and on Device too.
<!DOCTYPE html>
<html>
<head>
<title>Device Properties Example</title>
<script type="text/javascript" charset="utf-8" src="phonegap-1.2.0.js"></script>
<script type="text/javascript" charset="utf-8">
// Wait for PhoneGap to load
document.addEventListener("deviceready", onDeviceReady, false);
// PhoneGap is ready
function onDeviceReady() {
var myOptions = { enableHighAccuracy: true };
navigator.geolocation.getCurrentPosition(onSuccess, onError,myOptions);
}
// onSuccess Geolocation
function onSuccess(position) {
var element = document.getElementById('geolocation');
element.innerHTML = 'Latitude: ' + position.coords.latitude + '' +
'Longitude: ' + position.coords.longitude + '' +
'Altitude: ' + position.coords.altitude + '' +
'Accuracy: ' + position.coords.accuracy + '' +
'Altitude Accuracy: ' + position.coords.altitudeAccuracy + '' +
'Heading: ' + position.coords.heading + '' +
'Speed: ' + position.coords.speed + '' +
'Timestamp: ' + new Date(position.timestamp) + '';
}
// onError Callback receives a PositionError object
function onError(error) {
alert('code: ' + error.code + '\n' +
'message: ' + error.message + '\n');
}
</script>
</head>
<body>
<p id="geolocation">Finding geolocation...</p>
</body>
</html>


The answer from iMayur is showing, that the non native geolocation API is working. If you call this script the first time on an iphone, than you will be asked the "geolocation access question" from the browsers HTML5 api.
I think here is a bigger issue in phonegap: Issuetracker #197
[EDIT]
There is a new issue opened: Issuetracker #304


Don't know if they fixed it for you.
Now assuming that your code is correct:
navigator.geolocation.getCurrentPosition(onSuccess, onError,{'enableHighAccuracy':true,'timeout':10000});
Add the timeout part, and it shouldnt give a timeout error anymore.

Related

How can I change the behaviour of bindPopup

Good day everybody.
I bought a nice template and leaftlet is used to show maker.
Here is the demo . Actually when you clik on a marker, it open a widnows with a picture and some température value.
I would like to have all of the windows open. Of course, I am going to modify the html, to remove the picture and some information as GPS, and only keep the temperatue value. The goal is to be able to immediately see the temperature boxes below the markers. Optionaly, when I click on the marker it redirect to another page, same you click on the picture.
My first problem, I can not find the jacasvript script which work with the link of marker. The idea would be to cancel the effect of the click, or as I wrote, after we click it open the graph page instead of opening the windows.
My first question: how can I find a do to change the action of the click, on the marker
My second question (may be it be cancel the 1st question :) ), how can I change the behaviour of the bindpopup? Is there way "to tell" to the bindpopup, stay always open?
My thirst question: Or can we add one or two additional nice boxes, which show always the temperature below the marker, and keep the bindPopup, as it is? That would be nice as well
Here is the code of the map line 215
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
// OpenStreetMap - Homepage
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
function createHomepageOSM(_latitude,_longitude,_nbField){
setMapHeight();
if( document.getElementById('map') != null ){
var map = L.map('map', {
center: [_latitude,_longitude],
zoom: 18,
scrollWheelZoom: false
});
//L.tileLayer('http://openmapsurfer.uni-hd.de/tiles/roadsg/x={x}&y={y}&z={z}', {
L.tileLayer('http://{s}.tile.openstreetmap.fr/hot/{z}/{x}/{y}.png', {
//subdomains: '0123',
maxZoom: 20,
attribution: 'OpenStreetMap contributors, CC-BY-SA'
}).addTo(map);
var markers = L.markerClusterGroup({
showCoverageOnHover: false
});
function locateUser() {
$('#map').addClass('fade-map');
map.locate({setView : true})
}
$('.geo-location').on("click", function() {
locateUser();
});
$.ajax({
type: "POST",
url: "sql/get_map.mysql.php",
//data:'node=node1',
//data:{node_id:"firstnode", node2:"secondnode", node3:"thirdnode", from:"from", to:"to"}, // Send parameter to get.php
success: result,
error: error,
dataType: "json"
});
function error(data)
{
$('body').addClass('loaded');
alert("Error getting datas from DB");
console.log("Error getting datas from DB");
console.log(data);
}
function result(data){
console.info("data:",data);
var allMarkers=[];
var nhtml = '<img src="assets/img/property-types/vineyard.png">';
for (var i = 0; i < data.properties.length; i++) {
allMarkers.push(L.latLng(data.properties[i]['la'], data.properties[i]['lo']));
//data.properties[i]['b2'] = 0;
if((data.properties[i]['b1']>=data.properties[i]['se'] && data.properties[i]['b1'] < data.properties[i]['se']+1) ||
(data.properties[i]['b2']>=data.properties[i]['se'] && data.properties[i]['b2'] < data.properties[i]['se']+1) ||
(data.properties[i]['b3']>=data.properties[i]['se'] && data.properties[i]['b3'] < data.properties[i]['se']+1) ||
(data.properties[i]['b4']>=data.properties[i]['se'] && data.properties[i]['b4'] < data.properties[i]['se']+1)
)
{
nhtml = '<img src="assets/img/property-types/vineyard-orange.png">';
}
if(((data.properties[i]['b1'] < data.properties[i]['se']) && data.properties[i]['b1'] != null) ||
((data.properties[i]['b2'] < data.properties[i]['se']) && data.properties[i]['b2'] != null) ||
((data.properties[i]['b3'] < data.properties[i]['se']) && data.properties[i]['b3'] != null) ||
((data.properties[i]['b4'] < data.properties[i]['se']) && data.properties[i]['b4'] != null)
)
{
nhtml = '<img src="assets/img/property-types/vineyard-red.png">';
}
else{
nhtml = '<img src="assets/img/property-types/vineyard.png">';
}
var _icon = L.divIcon({
//html: '<img src="' + locations[i][7] +'">',
html: nhtml,
iconSize: [40, 48],
iconAnchor: [20, 48],
popupAnchor: [0, -48]
});
var title = data.properties[i]['station'];
var marker = L.marker(new L.LatLng(data.properties[i]['la'],data.properties[i]['lo']), {
title: title,
icon: _icon
});
var str ='';
if(data.properties[i]['b1'] != null)
{
str = str.concat('<div class="tag price"> ' + data.properties[i]['b1'] + '°C</div>');
}
if(data.properties[i]['b2'] != null)
{
str = str.concat('<div class="tag price"> ' + data.properties[i]['b2'] + '°C</div>');
}
if(data.properties[i]['b3'] != null)
{
str = str.concat('<div class="tag price"> ' + data.properties[i]['b3'] + '°C</div>');
}
if(data.properties[i]['b4'] != null)
{
str = str.concat('<div class="tag price"> ' + data.properties[i]['b4'] + '°C</div>');
}
marker.bindPopup(
'<div class="property">' +
'<a data-field=' + data.properties[i]['id_field'] +'" data-station=' + data.properties[i]['id_station'] +'" href="charts.php?field='+ data.properties[i]['id_field'] +'">' +
'<div class="property-image">' +
'<img src="img/stations/station-' + data.properties[i]['id_station'] + '.jpg">' +
'</div>' +
'<div class="overlay">' +
'<div class="info">' +
'<h3>' + data.properties[i]['station'] + '</h3>' +
'<figure>' + data.properties[i]['da'] + '</figure>' +
'<figure>' + data.properties[i]['la'] + ' ' + data.properties[i]['lo'] +'</figure>' +
str +
'<div class="tag"> ' + data.properties[i]['se'] + '°C</div>' +
'</div>' +
'</div>' +
'</a>' +
'</div>'
);
markers.addLayer(marker);
}
if(_nbField>1){
bounds = L.latLngBounds(allMarkers);
map.fitBounds(bounds,{ padding: [10, 10] });
}
map.addLayer(markers);
map.on('locationfound', onLocationFound);
function onLocationFound(){
$('#map').removeClass('fade-map');
}
$('body').addClass('loaded');
setTimeout(function() {
$('body').removeClass('has-fullscreen-map');
}, 1000);
$('#map').removeClass('fade-map');
}
}
}
My last question, with firefox, id possible "to track" the javascript action?
Feel free to aks complementary question to better understand and help, if I missed to provide information.
Many thanks

You can add a click event to the marker:
marker.on('click',(e)=>{
console.log(e);
});
Show all Popups:
You need to set the options autoClose and closeOnClick to false:
marker.bindPopup(content,{autoClose: false, closeOnClick: false});
You can use Tooltips:
marker.bindTooltip('5.3°C', {direction: 'bottom', permanent: true});
I don't know exactly what do you mean, but it sounds like debugging. Use the developer console with the Debugger.

Thanks for your reply and help
Unfortunately 2. does not work. There is no differences. I added closeButton:true, and that works, but it's not what I need.
marker.bindPopup(
'<div class="property">' +
'<a data-field=' + data.properties[i]['id_field'] +'" data-station=' + data.properties[i]['id_station'] +'" href="charts.php?field='+ data.properties[i]['id_field'] +'#st-'+ data.properties[i]['id_station'] +'">' +
'<div class="property-image">' +
'<img src="img/stations/station-' + data.properties[i]['id_station'] + '.jpg">' +
'</div>' +
'<div class="overlay">' +
'<div class="info">' +
'<h3>' + data.properties[i]['station'] + '</h3>' +
'<figure>' + data.properties[i]['da'] + '</figure>' +
'<figure>' + data.properties[i]['la'] + ' ' + data.properties[i]['lo'] +'</figure>' +
str +
'<div class="tag"> ' + data.properties[i]['se'] + '°C</div>' +
'</div>' +
'</div>' +
'</a>' +
'</div>',{autoClose: true, closeOnClick: false, closeButton: true}
);
I also tried the interesting option with tooltip. Bellow the above code I added
marker.bindTooltip('5.3°C', {direction: 'bottom', permanent: true});
But that print an error message
marker.bindTooltip is not a function
Is there additionally library I have to add for tooltop, or is inlcuded into leafet.
(bindTootip would be great and enough for my need)
Thanks for helping
Cheers

Auto Redirect Visitors to the particular website

I have just discovered the code which is redirecting the visitors based on their IP address. For example if we want to redirect our visitors from example.in to example.com as ".in" is our local domain and ".com" is the international domain.
We want our customers to visit international website only who are from US, UK if they visit example.in.
The problem is if they are visting from mobile device, they are not getting redirected. Please help.
Sharing my code below :
<script>
jQuery.ajax( {
url: '//freegeoip.net/json/',
type: 'POST',
dataType: 'jsonp',
success: function(location) {
// If the visitor is browsing from Foreign Country
if (location.country_code == 'US' || location.country_code == 'ZA')) {
// Redirect to the International store.
window.top.location.href = 'http://www.example.com';
}
}
} );
</script>
PS : I am placing the above code in example.in

Try this also But I not tried this
<script type="application/javascript">
$(document).ready(function() {
$.getJSON("http://www.telize.com/geoip?callback=?",
function(json) {
// If the visitor is browsing from China.
if (json.country_code === 'CN') {
// Redirect him to the China store.
window.location.href = 'http://www.mydomainname.cn';
}
}
);
});
// ]]>
</script>

Lets do with this http://jsfiddle.net/kvishnudev/7Ut65/1/
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Get web visitor's location</title>
<meta name="robots" value="none" />
</head>
<body>
<div id="yourinfo"></div>
<script type="text/javascript" src="http://www.google.com/jsapi?key=ABQIAAAAp04yNttlQq-7b4aZI_jL5hQYPm-xtd00hTQOC0OXpAMO40FHAxQMnH50uBbWoKVHwgpklyirDEregg"></script>
<script type="text/javascript">
var Continent = {"AD":"Europe","AE":"Asia","AF":"Asia","AG":"North America","AI":"North America","AL":"Europe","AM":"Asia","AN":"North America","AO":"Africa","AQ":"Antarctica","AR":"South America","AS":"Australia","AT":"Europe","AU":"Australia","AW":"North America","AZ":"Asia","BA":"Europe","BB":"North America","BD":"Asia","BE":"Europe","BF":"Africa","BG":"Europe","BH":"Asia","BI":"Africa","BJ":"Africa","BM":"North America","BN":"Asia","BO":"South America","BR":"South America","BS":"North America","BT":"Asia","BW":"Africa","BY":"Europe","BZ":"North America","CA":"North America","CC":"Asia","CD":"Africa","CF":"Africa","CG":"Africa","CH":"Europe","CI":"Africa","CK":"Australia","CL":"South America","CM":"Africa","CN":"Asia","CO":"South America","CR":"North America","CU":"North America","CV":"Africa","CX":"Asia","CY":"Asia","CZ":"Europe","DE":"Europe","DJ":"Africa","DK":"Europe","DM":"North America","DO":"North America","DZ":"Africa","EC":"South America","EE":"Europe","EG":"Africa","EH":"Africa","ER":"Africa","ES":"Europe","ET":"Africa","FI":"Europe","FJ":"Australia","FK":"South America","FM":"Australia","FO":"Europe","FR":"Europe","GA":"Africa","GB":"Europe","GD":"North America","GE":"Asia","GF":"South America","GG":"Europe","GH":"Africa","GI":"Europe","GL":"North America","GM":"Africa","GN":"Africa","GP":"North America","GQ":"Africa","GR":"Europe","GS":"Antarctica","GT":"North America","GU":"Australia","GW":"Africa","GY":"South America","HK":"Asia","HN":"North America","HR":"Europe","HT":"North America","HU":"Europe","ID":"Asia","IE":"Europe","IL":"Asia","IM":"Europe","IN":"Asia","IO":"Asia","IQ":"Asia","IR":"Asia","IS":"Europe","IT":"Europe","JE":"Europe","JM":"North America","JO":"Asia","JP":"Asia","KE":"Africa","KG":"Asia","KH":"Asia","KI":"Australia","KM":"Africa","KN":"North America","KP":"Asia","KR":"Asia","KW":"Asia","KY":"North America","KZ":"Asia","LA":"Asia","LB":"Asia","LC":"North America","LI":"Europe","LK":"Asia","LR":"Africa","LS":"Africa","LT":"Europe","LU":"Europe","LV":"Europe","LY":"Africa","MA":"Africa","MC":"Europe","MD":"Europe","ME":"Europe","MG":"Africa","MH":"Australia","MK":"Europe","ML":"Africa","MM":"Asia","MN":"Asia","MO":"Asia","MP":"Australia","MQ":"North America","MR":"Africa","MS":"North America","MT":"Europe","MU":"Africa","MV":"Asia","MW":"Africa","MX":"North America","MY":"Asia","MZ":"Africa","NA":"Africa","NC":"Australia","NE":"Africa","NF":"Australia","NG":"Africa","NI":"North America","NL":"Europe","NO":"Europe","NP":"Asia","NR":"Australia","NU":"Australia","NZ":"Australia","OM":"Asia","PA":"North America","PE":"South America","PF":"Australia","PG":"Australia","PH":"Asia","PK":"Asia","PL":"Europe","PM":"North America","PN":"Australia","PR":"North America","PS":"Asia","PT":"Europe","PW":"Australia","PY":"South America","QA":"Asia","RE":"Africa","RO":"Europe","RS":"Europe","RU":"Europe","RW":"Africa","SA":"Asia","SB":"Australia","SC":"Africa","SD":"Africa","SE":"Europe","SG":"Asia","SH":"Africa","SI":"Europe","SJ":"Europe","SK":"Europe","SL":"Africa","SM":"Europe","SN":"Africa","SO":"Africa","SR":"South America","ST":"Africa","SV":"North America","SY":"Asia","SZ":"Africa","TC":"North America","TD":"Africa","TF":"Antarctica","TG":"Africa","TH":"Asia","TJ":"Asia","TK":"Australia","TM":"Asia","TN":"Africa","TO":"Australia","TR":"Asia","TT":"North America","TV":"Australia","TW":"Asia","TZ":"Africa","UA":"Europe","UG":"Africa","US":"North America","UY":"South America","UZ":"Asia","VC":"North America","VE":"South America","VG":"North America","VI":"North America","VN":"Asia","VU":"Australia","WF":"Australia","WS":"Australia","YE":"Asia","YT":"Africa","ZA":"Africa","ZM":"Africa","ZW":"Africa"};
if(google.loader.ClientLocation)
{
visitor_lat = google.loader.ClientLocation.latitude;
visitor_lon = google.loader.ClientLocation.longitude;
visitor_city = google.loader.ClientLocation.address.city;
visitor_region = google.loader.ClientLocation.address.region;
visitor_country = google.loader.ClientLocation.address.country;
visitor_countrycode = google.loader.ClientLocation.address.country_code;
if(visitor_countrycode!= null)
{
var Cont = Continent[visitor_countrycode];
//alert(Cont);
}
//
document.getElementById('yourinfo').innerHTML = '<p>Lat/Lon: ' + visitor_lat + ' / ' + visitor_lon + '</p><p>Location: ' + visitor_city + ', ' + visitor_region +', Continent : ' + Cont + ', ' + visitor_country + ' (' + visitor_countrycode + ')</p>';
}
else
{
document.getElementById('yourinfo').innerHTML = '<p>Whoops!</p>';
}
</script>
</body>

How can I integrate FusionChart in my SPA application developed using Durandal and Knockout?

How can I integrate FusionChart in my SPA application developed using MVVM architecture, Durandal and Knockout.js? I had created a simple HTML file, with hard coded data, in which the charts are working fine but I am not able to figure out how can I embed this code with my SPA Application.
I am sharing some details:
I have added following Js file in my HTML file :
<script type="text/javascript" src="./FusionCharts.js"></script>
<script type="text/javascript" src="./jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="./lib.js"></script>
My HTML file code in which fusion chart is rendered successfully is as follows :
<div id="chartdiv" align="center">Chart will load here</div>
<script type="text/javascript">
var chart = new FusionCharts("Column3D", "myChartId", "300", "200");
chart.setXMLData("<chart animation='0' caption='Aging' numberPrefix='$' showBorder='1'>" +
"<set label='Current' value='24000' color='00FF00' />" +
"<set label='30+' value='19600' color='0000FF' />" +
"<set label='60+' value='15700' color='FFFF00'/>" +
"<set label='90+' value='14400' color='FF0000' />" +
"<styles>" +
"<definition>" +
"<style name='myCaptionFont' type='font' align='right'/>" +
"</definition>" +
"<application>" +
"<apply toObject='Caption' styles='myCaptionFont' />" +
"</application>" +
"</styles> " +
"</chart>");
chart.render("chartdiv");
</script>
I am not able to figure out what should be the code in my ViewModel.js, and view.html file to render FusionChart.
Please Help.

I developed a working demo for including FusionCharts in DurandalJS. Just copy the project to a webserver and access the app.
https://github.com/bhargav3/fcdurandal
First thing is to include fusioncharts.js which can be done using requirejs or by directly adding it in the index file. To avoid creating duplicate charts we shall check if the FusionCharts('myChartId') exists and avoid redraws.
Your viewmodel will look something like this,
define(['durandal/http', 'durandal/app'], function() {
return {
displayText: 'FusionCharts in a SPA app!',
viewAttached: function(view) {
if (typeof FusionCharts('myChartId') === 'undefined') {
$('#binder').append('<div id="chartContainer"></div>');
var myChart = new FusionCharts("Column3D", "myChartId", "400", "300", "0");
myChart.setXMLData("<chart animation='0' caption='Aging' numberPrefix='$' showBorder='1'>" +
"<set label='Current' value='24000' color='00FF00' />" +
"<set label='30+' value='19600' color='0000FF' />" +
"<set label='60+' value='15700' color='FFFF00'/>" +
"<set label='90+' value='14400' color='FF0000' />" +
"</chart>");
myChart.render("chartContainer");
}
}
};
});
Where as your view will look like
<h2 data-bind="html:displayText"></h2>
<div id="binder"></div>
main.js is the bootstrap file and you can add your routers(for navigation) there.

If your JavaScript files are added via script tags on index.html, then Fusion Charts should be available to use from your view model. There is a way to utilize require.js to dynamically load into the scope of your view model if there was a reason you don't want it globally. I didn't include that below in the view model example in order to keep it simple to demonstrate the use of viewAttached.
viewAttached (http://durandaljs.com/documentation/Hooking-Lifecycle-Callbacks/) seems to be the last method called in the lifecycle. As the documentation indicates, the method indicates when the "view is attached to the parent DOM node." This should allow you to manipulate the view as needed after binding has occurred. See also: http://durandaljs.com/documentation/Interacting-with-the-DOM/
Below is an example of using viewAttached in your view model:
define(function() {
var activate = function() {
};
var viewAttached = function() {
var chart = new FusionCharts("Column3D", "myChartId", "300", "200");
chart.setXMLData("<chart animation='0' caption='Aging' numberPrefix='$' showBorder='1'>" +
"<set label='Current' value='24000' color='00FF00' />" +
"<set label='30+' value='19600' color='0000FF' />" +
"<set label='60+' value='15700' color='FFFF00'/>" +
"<set label='90+' value='14400' color='FF0000' />" +
"<styles>" +
"<definition>" +
"<style name='myCaptionFont' type='font' align='right'/>" +
"</definition>" +
"<application>" +
"<apply toObject='Caption' styles='myCaptionFont' />" +
"</application>" +
"</styles> " +
"</chart>");
chart.render("chartdiv");
};
return {
activate: activate,
viewAttached: viewAttached
};
};
Finally, your view should contain:
<div id="chartdiv" align="center">Chart will load here</div>

Play SoundCloud links through Soundmanager2

I'm using the Soundmanager Mp3 Button on my site. However, I'd like to use the Soundcloud Api to stream tracks through Soundmanager instead of hosting MP3's. Basically, I'd like to stream a Soundcloud link through the Soundmanager button. Possible?
I've tried creating a jQuery loop (below) but still haven't had any luck.
<ol>
<li><a class="sm2_button" href="http://soundcloud.com/....">Track Title</a>
</li>
</ol>
and the jQuery
$("ol a").each(function()
{
var thisLink = $(this);
var track_url = this.href; // save href value of each link to 'track_url' i.e. soundcloud.com/...
this.href = this.href.replace(track_url, "#"); // replace href value with '#'
var consumer_key = 'My Consumer Key';
// now resolve the stream_url through Soundcloud's getJSON method
$.when($.getJSON('http://api.soundcloud.com/resolve?url=' + track_url + '&format=json&consumer_key=' + consumer_key + '&callback=?', function(track) {
url = track.stream_url + '?consumer_key=' + consumer_key;
})).done(function() {
// and place an 'onclick' on each link
$(thisLink).attr('onclick', "if (basicMP3Player.lastSound) { basicMP3Player.lastSound.stop(); } document.getElementById('mp3').type='audio/mpeg'; document.getElementById('mp3').href = '" + url + "'; basicMP3Player.handleClick({target: document.getElementById('mp3')});");
});
});

This was driving me nuts too. After a bunch of digging I was able to get it to work if I specified an mp3 mimetype in the link:
<ol>
<li><a type="audio/mp3" class="sm2_button" href="https://api.soundcloud.com/tracks/49349198/stream?client_id=YOUR_CLIENT_ID">Track Title</a></li>
</ol>

You could also try using the SoundCloud Javascript SDK, which'll take care of most of this for you.
SC.initialize({
client_id: "YOUR_CLIENT_ID",
redirect_uri: "http://example.com/callback.html",
});
SC.stream("/tracks/293", function(sound){
sound.play();
});

I tried this and thought I had it...anyone see anything?
<script src="http://connect.soundcloud.com/sdk.js"></script>
<script>
SC.initialize({
client_id: "My Consumer Key",
redirect_uri: "My Redirect",
});
SC.get("/users/MYUSERID/tracks", {limit: 1000}, function(tracks){
alert("Latest track: " + tracks[0].title);
});
$(".sm2_button").live("click", function(sound){
sound.play();
});
</script>
<script>
$(document).ready(function() {
$(".sm2_button").each(function()
{
var thisLink = $(this);
var track_url = this.href; // save href value of each link to 'track_url' i.e. soundcloud.com/...
this.href = this.href.replace(track_url, "#"); // replace href value with '#'
var consumer_key = 'My Consumer Key';
// now resolve the stream_url through Soundcloud's getJSON method
$.when($.getJSON('http://api.soundcloud.com/resolve?url=' + track_url + '&format=json&consumer_key=' + consumer_key + '&callback=?', function(track) {
url = track.stream_url + '?consumer_key=' + consumer_key;
})).done(function() {
// and place an 'onclick' on each link
$(thisLink).attr('onclick', "if (basicMP3Player.lastSound) { basicMP3Player.lastSound.stop(); } document.getElementById('mp3').type='audio/mpeg'; document.getElementById('mp3').href = '" + url + "'; basicMP3Player.handleClick({target: document.getElementById('mp3')});");
});
});
}); </script>

Set a custom redirect after user accept permissions - Facebook Application

I try to build an app and i want to ask for permissions first, so the code below do just these but when it redirects, is transfer me in the domain i host the application.
Is it possible to set a custom redirect?
thanks a lot!
<html>
<head>
<title>Client Flow Example</title>
</head>
<body>
<script>
var appId = "YOUR_APP_ID";
if(window.location.hash.length == 0)
{
url = "https://www.facebook.com/dialog/oauth?client_id=" +
appId + "&redirect_uri=" + window.location +
"&response_type=token";
window.open(url);
} else {
accessToken = window.location.hash.substring(1);
graphUrl = "https://graph.facebook.com/me?" + accessToken +
"&callback=displayUser"
//use JSON-P to call the graph
var script = document.createElement("script");
script.src = graphUrl;
document.body.appendChild(script);
}
function displayUser(user) {
userName.innerText = user.name;
}
</script>
<p id="userName"></p>
</body>
</html>

I guess you only have to change this part :
"&redirect_uri=" + window.location +
To
"&redirect_uri=THE_URL_YOU_WANT" +
But I'm not sure I understand your question correctly ? Could you clarify ?