Meteor useraccounts watch state - meteor

I'm using Meteor useraccounts:bootstrap.
On my navbar i have btnLogin and btnLogOut. I want only my login button to show when im logged out, and only the logout button when im logged in.
My logic:
if (!error) {
if (state === "signIn") {
document.getElementById('btnLogin').style.display = 'none';
}
else if (state != 'signIn') {
document.getElementById('btnLogOut').style.display = 'visible';
}
How do i get my app to look for state without triggering an event/click?
Thank you!

If you're logged in, Meteor.userId() will return the _id of the current user.
So you can have something like this:
page.html:
{{#if isUserLoggedIn}}
<<<<<show logout button >>>>>>
{{else}}
<<<<<show login button >>>>>>
{{/if}}
page.js
Template.page.helper({
isUserLoggedIn: function(){
if(Meteor.userId()){
return true;
}
return false;
}
});

Related

can not get current user after page refresh in Meteor.js

i'm trying to display Logged in User name .
After login i can get user name but once i refresh page it is undefined .
My code :
<p>{{currentUser.profile.full_name}}</p>
i try other way too
blaze Side
{{currentUser}}
js
Template.main.helpers({
"currentUser": function() {
if (Meteor.user())
return Meteor.user().profile.full_name;
}
});
after login i can get name but i can not get name after refresh page.
So, what is solution for get name if i refresh page in Meteor blaze ?
Try this:
Template.Default.onCreated(function() {
this.user = Meteor.user();
});
Template.main.helpers({
currentUser: function() {
var user = Template.instance().user;
if (user) {
return user.profile.full_name;
}
});
Also make sure that profile.full_name exists;

find a document with the current username in a helper

I'm trying to create a helper like this:
this.helpers({
data() {
return Customers.findOne({ user: Meteor.user().username });
}
});
but an error occurs, It seems that the user is logging in when the helper is executing, How can I execute the helper after the user is logged in ?
Don't know if is the best solution but I created a deferred promise that wait for the user to login and resolve the $state.
resolve: {
currentUser: ($q) => {
var deferred = $q.defer();
Meteor.autorun(function() {
if(!Meteor.loggingIn()) {
if(!Meteor.user()) {
deferred.reject('PERMISSION_REQUIRED');
} else {
deferred.resolve();
}
}
});
I hope that it can be useful for someone else.
Try this:
data() {
if(Meteor.user()){
return Customers.findOne({ user: Meteor.user().username });
}
}
Try builtin currentUser users helper, which check whether the user is logged in. Like that:
{{#if currentUser}}
{{data}}
{{/if}}

Meteor Html pages appearing in single window

I am trying to use iron router to route the html pages on click events.But as I run the application, all pages appear in the main page itself, whereas the click event doesn't route the page needed.The JS code as below
Template.Login.events({
'submit form': function(){
event.preventDefault();
var username = $('[name=userId]').val();
var password = $('[name=password]').val();
if(username == '' && password ==''){
alert("Please fill all fields...!!!!!!");
}
else if( username =='deal' && password ==''){
alert("You are logged in as a Deal manager");
Meteor.Router.to("/dashboard");
}
else if( username =='practice' && password ==''){
alert("You are logged in as a Practice manager");
Meteor.Router.to("/pracDashboard");
}
}
});
As in the above is a login page with conditions as 'deal' or 'practice' to route to different pages.The moment I place the dashboard.html in the folder, both the login and dashboard page appear in the same window.
For displaying a page we should convert the html page in template form. Let say login.html is as follows
<html>
<title>Sample title</title>
<body>Sample Text</body>
</html>
for meteor the html page should be like this
<template name="login">
Sample Text
</template>
Then for displaying login page we need to implement Route like this
Router.route('/login', function (){
this.render('login.html');
});
So set Router first then in events during submit redirect.
Router.route('/dashboard', function (){
this.render('dashboard.html');
});
Router.route('/pracDashboard', function (){
this.render('pracDashboard.html');
});
Router.route('/login', function (){
this.render('login.html');
});
Template.login.events({
'submit form': function(){
event.preventDefault();
var username = $('[name=userId]').val();
var password = $('[name=password]').val();
if(username == '' && password =='') {
alert("Please fill all fields...!!!!!!");
} else if( username =='deal' && password =='') {
alert("You are logged in as a Deal manager");
Router.go("/dashboard");
} else if( username =='practice' && password ==''){
alert("You are logged in as a Practice manager");
Router.go("/pracDashboard");
}
}
});

Better handle logged_in and logged_out without showing wrong layout in iron-router

i'm trying to get a clean redirection to the login form if the user isn't logged in. This basically works but i often see my main layout which only logged in users should see. I only see it for a second then before the login screen is showing but i'm trying to get rid of this shortly "flickering" faulty page.
My router.js looks a bit like this:
Router.configure({
layoutTemplate: 'layoutPrimary',
loadingTemplate: 'loading',
waitOn: function() {
if (Meteor.user()) {
return Meteor.subscribe('messages');
}
else {
return;
}
}
});
Router.route('/', {name: 'dashboard'});
Router.route('/login', {name: 'login'});
some more routes without anything special (some subscriptions). Now we check if the user is logged in. If not he shall be delivered a special layout containing only the login/register functions.
// require login on all routes
Router.onBeforeAction(function () {
if(!Meteor.user() && !Meteor.loggingIn()){
this.layout('layoutSlim');
this.render('login');
} else {
this.next();
}
});
then we're handling 404s and doing some functions for user check that are used in the routes above.
// 404 Handling
Router.route('/(.*)',function(){
this.render('error404');
});
// Be sure the Meteor.user() exists when settings are loaded
var userIsLoaded = {
ready: function() { return !!Meteor.user(); }
};
var userLoggedIn = function() {
if (!Meteor.user() && !Meteor.loggingIn()) {
this.stop();
Router.go('login');
return false;
}
else {
return true;
}
};
Any idea what i can do to avoid that shortly showing wrong layout? I also sometimes see the login screen when logged in - this is quite rare but it would be a better user experience if this wouldn't happen at all.
I'm not 100% sure if this is related to iron-router or probably an issue that could be handled by spacebars/blaze?
Thanks for helping,
Frank
This is happening because the subscribe('messages') gets done, but the Meteor users collection not.
You can use the currentUser helper from Accounts Package
{{if currentUser}}
<!-- show information here -->
{{else}}
<!-- Forbiden template or login template -->
{{/if}}

Meteor never see's me as looged in

I want to detect if a logged in user has no records in the collection and then start them with some default values. So I use this at the beginning of my isClient part;
if (Meteor.isClient) {
if(Meteor.user()){
Meteor.subscribe('collection');
var currentUserId = Meteor.userId();
if (collection.find({"userID": currentUserId}).count() == 0)
{
Meteor.call('initUser', currentUserId);
}
} else {
console.log("You are not logged in");
}
}
Problem is that it never see's me as logged in. Do I need to be calling this from a template or something? In the tutorial that I did they just had it all by itself.
Your code looks good to me but it does not live in a reactive computation, meaning that it's going to run only once at the beginning of your code and never again, just like regular sequential programming.
You need to surround your code with a Tracker.autorun like this :
if (Meteor.isClient) {
Tracker.autorun(function(){
// Meteor.userId() is a reactive data source that will trigger invalidation
// of the reactive computation whenever it is modified (on login/logout)
var currentUserId = Meteor.userId();
if(currentUserId){
Meteor.subscribe('collection',function(){
if (collection.find({
userID: currentUserId
}).count() === 0){
Meteor.call('initUser', currentUserId);
}
});
} else {
console.log("You are not logged in");
}
}
}
I've refactored it to only use Meteor.userId() because you don't use the currentUser properties in this piece of code.

Resources