Develop Reference

how to trigger google onSignIn data-onsuccess without global onSignIn function?

After playing around with google sign https://developers.google.com/identity/sign-in/web/sign-in. I wanted to clean up the code a bit by placing it in another file and maybe renaming them.
But somehow data-onsuccess would not work if I put the onSignIn function as an object's attribute.
I have something like this to give it a try
const google_auth = {};
google_auth.id_token = null;
google_auth.onSignIn = (googleUser) => {
const profile = googleUser.getBasicProfile();
const id_token = google_auth.id_token = googleUser.getAuthResponse().id_token;
console.log(profile, 'profile');
console.log('ID: ' + profile.getId()); // Do not send to your backend! Use an ID token instead.
console.log('ID token: ' + id_token);
console.log('Name: ' + profile.getName());
console.log('Image URL: ' + profile.getImageUrl());
console.log('Email: ' + profile.getEmail()); // This is null if the 'email' scope is not present.
console.log(id_token.split('.'), 'id_token split');
};
then for html I tried
<div class="g-signin2" data-onsuccess="google_auth.onSignIn"></div>
the function will not be called though. If I just use the original code such as
const google_auth = {};
google_auth.id_token = null;
function onSignIn(googleUser) {
const profile = googleUser.getBasicProfile();
const id_token = google_auth.id_token = googleUser.getAuthResponse().id_token;
console.log(profile, 'profile');
console.log('ID: ' + profile.getId()); // Do not send to your backend! Use an ID token instead.
console.log('ID token: ' + id_token);
console.log('Name: ' + profile.getName());
console.log('Image URL: ' + profile.getImageUrl());
console.log('Email: ' + profile.getEmail()); // This is null if the 'email' scope is not present.
console.log(id_token.split('.'), 'id_token split');
};
<div class="g-signin2" data-onsuccess="onSignIn"></div>
Which works perfectly, I tried googling about data-onsuccess attributes but no one really talk much about this situation. Most people saying it doesn't work with the framework.
Thanks in advance for any help / suggestions.

JavaScript - custom Google Sign In has to be clicked twice

This is the HTML:
<div id="button_google_login" class="customGPlusSignIn" onclick="startApp();">
<span class="dont_close" style="padding-left: 12px;">Sign In with Google</span>
</div>
JavaScript:
var googleUser = {};
var startApp = function() {
gapi.load('auth2', function(){
// Retrieve the singleton for the GoogleAuth library and set up the client.
auth2 = gapi.auth2.init({
client_id: '[Secret].apps.googleusercontent.com',
cookiepolicy: 'single_host_origin',
// Request scopes in addition to 'profile' and 'email'
//scope: 'additional_scope'
});
attachSignin(document.getElementById('button_google_login'));
});
};
function attachSignin(element) {
console.log(element.id);
auth2.attachClickHandler(element, {},
function(googleUser) {
var profile = googleUser.getBasicProfile();
console.log('ID: ' + profile.getId()); // Do not send to your backend! Use an ID token instead.
console.log('Name: ' + profile.getName());
console.log('Image URL: ' + profile.getImageUrl());
console.log('Email: ' + profile.getEmail()); // This is null if the 'email' scope is not present.
}, function(error) {
// error or break up
});
}
I need to click the button twice to start the Sign In process, what could be the problem? I also tried the normal non custom version and it worked how it should.
Thanks in advance!

I guess you copied the example from Google Documentation. There the startApp() function is called at the end of the body Tag. Therefore the click handler to the Google button is assigned, when the document has loaded. You changed the behaviour insofar as that the click handler is only assigned, when somebody clicks the button. Because of that, you have to click that button two times.
Why don't you want to do it like in the Google provided example?
Simply add <script>startApp();</script> before the closing </body> Tag and remove the onclick="startApp(); attribute from your button.

I would to a onClick event on a btn and then call a login function
function login() {
var profile = googleUser.getBasicProfile();
console.log('ID: ' + profile.getId()); // Do not send to your backend! Use an ID token instead.
console.log('Name: ' + profile.getName());
console.log('Image URL: ' + profile.getImageUrl());
console.log('Email: ' + profile.getEmail()); // This is null if the 'email' scope is not present.
}

Add permissions to channel for user

I've recently added this Discord bot to my server: https://github.com/critcola/discord-auto-grouping
It's working great and I've modified it slightly to ensure it creates a room based on the user's name, with a user limit and under a certain category in my server.
My last edit — which I can't seem to get my head around — is, when the channels are created, to add the user to the permissions and allow them full administrative rights on the channel only.
Below is what I've tried so far, it produces no errors it just doesn't do anything hence I'm now stumped!
Any help would be greatly appreciated.
// Check if the user entered a new channel.
if (member.voiceChannelID) {
const newChannel = member.guild.channels.get(member.voiceChannelID);
// If the user entered a game channel (prefixed with a game controller unicode emoji), group them into their own channel.
if (newChannel.name.startsWith(String.fromCodePoint('0x1F3AE'))) {
newChannel.clone(String.fromCodePoint('0x2501') + member.user.username + "'s Room", false)
.then(createdChannel => {
createdChannel.edit({
bitrate: 96000,
//position: newChannel.position + 0,
userLimit: 5,
parent: '409821646698971136'
})
//Set Permissions
.then(createdChannel.overwritePermissions(member.user.id,{'MANAGE_PERMISSIONS':true, 'MANAGE_CHANNELS':true}))
.then(createdChannel => {
member.setVoiceChannel(createdChannel)
.then(console.log('[' + new Date().toISOString() + '] Moved user "' + member.user.username + '#' + member.user.discriminator + '" (' + member.user.id + ') to ' + createdChannel.type + ' channel "' + createdChannel.name + '" (' + createdChannel.id + ') at position ' + createdChannel.position))
.catch(console.error);
})
.catch(console.error);
})
.catch(console.error);
}
}

You've made a little mistake. As MANAGE_PERMISSIONS is an invalid permission,
you need to use MANAGE_ROLES.

why isn't my casperjs displaying any errors?

var casper = require('casper').create({
logLevel:'deubg',
verbose:true,
});
casper.start(someurl,function(){
not_existing_function();
})
When executing above code, all I see on the screen is debug informations that means very little to me. I am expecting to see some error saying the function being called doesn't exist, but there is not.
I thought it was just the behavior, until I see this.
The question clearly indicates he has got some error message:
ReferenceError: Can't find variable: $
Why can't I see something like this on my screen?

You're likely using PhantomJS 2.x. It has a known bug where some errors are not reported. That includes the class of errors that you're describing.
Also, registering to the various error events of CasperJS/PhantomJS doesn't help in this case, but here they are just in case:
// http://phantomjs.org/api/phantom/handler/on-error.html
phantom.onError = function(msg, trace) {
var msgStack = ['PHANTOM ERROR: ' + msg];
if (trace && trace.length) {
msgStack.push('TRACE:');
trace.forEach(function(t) {
msgStack.push(' -> ' + (t.file || t.sourceURL) + ': ' + t.line + (t.function ? ' (in function ' + t.function +')' : ''));
});
}
console.error(msgStack.join('\n'));
phantom.exit(1);
};
// http://docs.casperjs.org/en/latest/events-filters.html#remote-message
casper.on("remote.message", function(msg) {
this.echo("Console: " + msg);
});
// http://docs.casperjs.org/en/latest/events-filters.html#page-error
casper.on("page.error", function(msg, trace) {
this.echo("Error: " + msg);
// maybe make it a little fancier with the code from the PhantomJS equivalent
});
// http://docs.casperjs.org/en/latest/events-filters.html#resource-error
casper.on("resource.error", function(resourceError) {
this.echo("ResourceError: " + JSON.stringify(resourceError, undefined, 4));
});
// http://docs.casperjs.org/en/latest/events-filters.html#page-initialized
casper.on("page.initialized", function(page) {
// CasperJS doesn't provide `onResourceTimeout`, so it must be set through
// the PhantomJS means. This is only possible when the page is initialized
page.onResourceTimeout = function(request) {
console.log('Response Timeout (#' + request.id + '): ' + JSON.stringify(request));
};
});
You can run something like eslint or jshint over the script to catch syntax errors and you can run your script in PhantomJS 1.9.8/1.9.7 in order to catch these sort of errors.

Error in line of javascript 'missing ) after argument list"

I am trying to pass variables to a javascript function but i have the Javascript Error: 'missing ) after argument list"
html = html + '' + 'Lugar: ' +name.name +' Coordenadas: Lat '+ name.lat +' Lng'+ name.lng+ '<br>';
It doesn't look like I am missing any ')'s.

I see you have found your solution, but here's an alternative anyway, which reduces your string concatenation a little. There's still a far better way of achieving this, but this may help you start to see the benefit of moving away from building HMTL via string concatenation.
<meta charset="UTF-8">
<span id="spanTest"></span>
<script>
// Or whatever your initMap2 function does...
function initMap2(lat, lng, name) {
console.log('Lat: ' + lat);
console.log('Lng: ' + lng);
console.log('Name: ' + name);
}
var spanTest = document.getElementById('spanTest');
var worldLocation = { name:"test", lat:98.5, lng:-88.45 };
var anchor = document.createElement('a');
anchor.href = 'javascript:initMap2(' + worldLocation.lat +', ' + worldLocation.lng + ', \'' + worldLocation.name + '\');';
anchor.innerHTML = 'Name: ' + worldLocation.name + ', Lat: ' + worldLocation.lat + ' Lng: ' + worldLocation.lng;
spanTest.appendChild(anchor);
</script>

I'm assuming your last argument is expected to be a string, but it's resolved to look like a variable. Try this instead:
html = html + '<a href="javascript:initMap2(' + name.lat +','+ name.lng +',\''+ name.name +'\');">' // etc.
When name.name resolves to a string, it'll be wrapped in single quotes as expected. It'll look something like javascript:initMap2(1, 2, 'someString').