davidturnbull / leaderboard-v2 Goto Github PK

In the Forms Summary, under the "To gain a deeper understanding of Meteor" section, there is this last task 'Add a “Score” field to the “Add Player” form...'.

Even though I used the number type in the form

<input type="number" name="playerScore">

I got this nasty error.

MinimongoError: Cannot apply $inc modifier to non-number", details: undefined, message: "MinimongoError: Cannot apply $inc modifier to non-number [409]

What I had to do is:

PlayersList.insert({
    name: playerNameVar,
    score: parseInt(playerScoreVar) 
 });

On chapter 12: Methods the following code is wrong:

Meteor.methods({
    'insertPlayerData': function(playerNameVar){
        var currentUserId = Meteor.userId(); // <====
(...)

And should be:

Meteor.methods({
    'insertPlayerData': function(playerNameVar){
        var currentUserId = this.userId(); // <====
(...)

Edit:

Reading further, I found that most of the examples in this chapter are using Meteor.userId() instead of this.userId()

Hi,

you secure your update methods and the remove method. However, I can insert data as a guest via the console. This data is not assigned to any user but I would still be able to bloat the database which is most likely not desired.

Your tutorial is great! I learnt a lot from it. Not being a programming beginner but quite new to meteor.js you also explained some nice details that I wondered about. Good job!

All the best,
Michael

Hi,

i was going through your second tutorial and noticed an error in the css file (http://meteortips.com/second-meteor-tutorial/managing-todos/)
The css file is incomplete as far as i can tell:

[name=todoItem]{
border:none;
font-family: "Times New Roman";
font-size: 100%;
padding:0.15em;
}

background-color: #f9f9f9;
cursor:pointer;

}

background-color: #f9f9f9;
cursor:default;
outline:none;

}

On page 127 of the current revision of the book it states one should move their methods to isServer. However a few line down it tells them to put their methods under isClient, that should be isServer. Confusion will most likely arise when they get to the end of the chapter and look at the git commit wondering why their project is doing funny things only to see the code on git has the methods under isServer.

Hi, when i place the isServer section of the code in to the server folder the application. And the isClient part in the client folder. The app beaks because of undefined method. when all combined in one js file with if client everything is working just fine. Any idea way this is the case?

so

/app/server/leaderServer.js

PlayersList = new Mongo.Collection('players');

Meteor.publish('thePlayers', function(){
var currentUserId = this.userId;
return PlayersList.find({createdBy: currentUserId})
});

Meteor.methods({
'insertPlayerData': function(playerNameVar){
var currentUserId = Meteor.userId();
PlayersList.insert({
name: playerNameVar,
score: 0,
createdBy: currentUserId
});
},
'removePlayerData': function(selectedPlayer){
var currentUserId = Meteor.userId();
PlayersList.remove({_id: selectedPlayer, createdBy: currentUserId});
},
'modifyPlayerScore': function(selectedPlayer, scoreValue){
var currentUserId = Meteor.userId();
PlayersList.update( {_id: selectedPlayer, createdBy: currentUserId},
{$inc: {score: scoreValue} });
}
});

and /app/client/leaderClient.js

Meteor.subscribe('thePlayers');

Template.leaderboard.helpers({
'player': function(){
var currentUserId = Meteor.userId();
return PlayersList.find({}, {sort: {score: -1, name: 1}});
},
'selectedClass': function(){
var playerId = this._id;
var selectedPlayer = Session.get('selectedPlayer');
if(playerId == selectedPlayer){
return "selected"
}
},
'showSelectedPlayer': function(){
var selectedPlayer = Session.get('selectedPlayer');
return PlayersList.findOne(selectedPlayer)
}
});

Template.leaderboard.events({
'click .player': function(){
var playerId = this._id;
Session.set('selectedPlayer', playerId);
},
'click .increment': function(){
var selectedPlayer = Session.get('selectedPlayer');
Meteor.call('modifyPlayerScore', selectedPlayer, 5);
},
'click .decrement': function(){
var selectedPlayer = Session.get('selectedPlayer');
Meteor.call('modifyPlayerScore', selectedPlayer, -5);
},
'click .remove': function(){
var selectedPlayer = Session.get('selectedPlayer');
Meteor.call('removePlayerData', selectedPlayer);
}
});

Template.addPlayerForm.events({
'submit form': function(event){
event.preventDefault();
var playerNameVar = event.target.playerName.value;
Meteor.call('insertPlayerData', playerNameVar);
}
});

Any chance you can put up a React.js version?

The bottom of page 118 talks about simplifying the client player function as we no longer need to get the current logged in user because we're querying this in the server publish function. You point out that we can therefore remove this from the first find argument:

Also know that we can now simplify the player function from this:

 'player': function(){
   var currentUserId = Meteor.userId();
   return PlayersList.find({createdBy: currentUserId}, {sort: {score: -1, name: 1}});
 }

...to this:

 'player': function(){
   var currentUserId = Meteor.userId();
   return PlayersList.find({}, {sort: {score: -1, name: 1}});
 }

Unless I'm misunderstanding, we can also remove the currentUserId variable from the client helper function completely, so the simplified code should be just:

'player': function(){
  return PlayersList.find({}, {sort: {score: -1, name: 1}});
}