TileBoard
TileBoard copied to clipboard
Fetch logged in user information
Since we're using HA's new auth, it would be great to have access to the current logged in user within TileBoard. I'm thinking I could use the logged in user to determine what pages or layout I want to use (giving each tablet its own HA user). A means of logging out or switching the account would also be useful for troubleshooting/developing.
It looks like sending "auth/current_user" over the websocket will return the needed information. If it could be accessed in config.js under something like this.user
that would be awesome.
A wiki page on this would be great, once you get it going.
hey @cgarwood i saw you have a git with your hass config. would you please consider one for your tileboard config.js too?
Is it possible to use different config variables for different users? In a similar way to the example of showing a different config for mobile and non-mobile devices:
if(/[?&]mobile/.test(location.search)) {
var CONFIG = {/*mobile config*/};
}
else {
var CONFIG = {/*non-mobile config*/};
}
It is not straightforward as API calls are made at later stage and are async.
Ok, thanks, I've found a workaround for now, I'm just using a different copy of tileboard within my www
folder for each user.
I guess if the HA devs implement the 'permissions' feature mentioned here:
Permissions. Using the same user and context features, we will also be able to limit access to entities to users.
Then having different layouts/tileboards for different users would far easier. :)
Why not just separate config files?
I did try multiple config variables, using the mobile example in the wiki to try and get seperate tileboards to mobile and non mobile devices, but it didn't work for me. I used this as my basis for my config file:
if(/[?&]mobile/.test(location.search)) {
var CONFIG = {/*mobile config*/};
}
else {
var CONFIG = {/*non-mobile config*/};
}
In order to get my mobile page I would go to:
http://hassos.local:8123/local/tileboard/index.html?mobile
I would then get the login screen for HomeAssistant, where I would enter my login and password.
After logging in, it redirects my browser to:
http://hassos.local:8123/local/tileboard/index.html?oauth=1&code=xxxxx
which then gives me the non-mobile config, as seems to be removing the '?mobile' from the url once I log in.
If I manually change the url to
http://hassos.local:8123/local/tileboard/index.html?oauth=1&code=xxxxx&mobile
then it does give me the mobile version of my tileboard, however doing this using a Kiosk type browser on a mobile device can be difficult or impossible.
If there is a better way to do this some sort of fix then that would be great. :)
@DeviousPenguin fixed (i suppose)
Btw, we already have a method Api.getUser(callback)
Btw, we already have a method Api.getUser(callback)
Thanks, I didn't know about this, is there a basic example of Api.getUser(callback)
being used somewhere? I'd quite like to try it out. Would this.apiRequest.getUser(callback)
be needed now?
Some things have changed since the previous comment. Now the Api object will be exposed as this.api
in your functions. So you will have to use this.api.getUser([callback])
.
Also added an onReady
function that you can define in your config (CONFIG.onReady
) which is probably gonna be the best place to get the user data.
It will work as soon as #309 is merged.
Ok, I'll wait until #309 is merged and see if I can get it work, thanks.
Just a quick follow up to this, I can report it works OK.
I've managed to get the basics working OK after pulling the latest commits.
If anyone else is looking to do something similar, here's a simple example of how to show the logged in user as a Popup on connection:
// in the config:
onReady: function () {
this.api.getUser(User_Callback)
},
// have this function in the config.js, but not in the CONFIG variable:
function User_Callback(object) {
// console.log(object);
// console.log(object.result.name);
if(!CONFIG.ignoreErrors) Noty.addObject({
type: Noty.SUCCESS,
title: 'Connection Successful',
message: ("Connected as " + object.result.name),
lifetime: 2,
});
}