Meteor create user ranking by score [closed] - meteor

Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 1 year ago.
Improve this question
I'm a total beginner. I'm using Meteor for a school project and I'm trying to create a ranking. I want to rank users according to their score. I want to display their usernames with their scores.
enter image description here
the function I found to sort the users and the following one
Meteor.users.find({}, { sort: { score: -1 } });
I would like to include it in the following code
Template.classement.helpers({
users() {
Meteor.users.find().forEach(function(oneUser) {
const affichage = `nom : ${oneUser.username} score : ${oneUser.profile.score}`;
console.log(affichage);
console.log(oneUser.profile.score);
console.log(oneUser);
});
return Meteor.users.find();
},
});
on the html side, I have this to display but it dosen't work
<template name="classement">
<h1>Classement</h1>
{{#each users}}
{{user}}
{{/each}}
</template>
Could you please help me. (sorry for the grammar, English is not my first language).

Welcome to SO!
The issue is in the sort:
Meteor.users.find({}, { sort: { score: -1 } });
This attempts to sort documents by the top level field score. While you have score stored in a sub-document, under profile.
The syntax to sort by an attribute of a submodule in MongoDB is this:
Meteor.users.find({}, { sort: { 'profile.score': -1 } });

Related

What is the difference between events and helpers? [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 6 years ago.
Improve this question
What is the difference between Meteor.templateName.events and Meteor.templateName.helpers.
and how do I know which one I need to implement for my template?
In short, helpers are functions you can use with {{}} as if they were variables in your Blaze templates. Events are functions you can bind to DOM events.
Example:
Template:
<template name="example">
<button>{{buttonLabel}}</button>
</template>
JS:
Template.example.helpers({
'buttonLabel': function(){ return "Click me"; }
});
Template.example.events({
'click button': function() {
// put your action here
console.log("button was clicked");
}
});
With this, your template will have a button with the label "Click me", returned by the buttonLabel helper. And when you click the button, the code inside the function bound to a button click event will be triggered (in this case, just printing "button was clicked" on the console).

How to add missing browser-specific css declaration properties and prefixes to epub [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
We don’t allow questions seeking recommendations for books, tools, software libraries, and more. You can edit the question so it can be answered with facts and citations.
Closed 7 years ago.
Improve this question
Publishers sometimes release Epub titles without including all of the required browser-specific css declaration properties and prefixes. For example, a title might include a -webkit-transform declaration but omit transform or vice versa.
There are a number of tools available to assist developer workflow in the creation of new content Stackoverflow: How to automatically add browser prefix to CSS3 properties?; however, I am looking for a way to parse an entire Epub and add any missing properties.
We will assume that all the relevant CSS is in .css files. You can open the epub by unzipping it, and this will expose the CSS files, wherever they might be. You can then simply run these through your favorite prefixing tool, then zip the book back up.
The problem is that AFAIK prefixing tools typically expect the transform property and add the -webkit-transform counterpart. I am not sure these tools will work if only -webkit-transform is there and you want transform to be added. You'll have to check each tool to see if it provides this behavior. In the worst case, you could write your own plugin for a CSS transformation framework like rework to do what you need.
Ended up solving the problem using postcss with plugins postcss-unprefix and autoprefixer. postcss-unprefix removes existing prefixes and autoprefixer then adds any needed ones.
var fs = require('fs')
var postcss = require('postcss');
var input = process.argv[2]; // the source of the css
var output = process.argv[3]; // where to write the output
fs.readFile(input, 'utf8', function (err, result) {
if (err) {
console.log(err);
process.exit(1);
}
processCss(result, function (err, result) {
if (err) {
console.log(err);
process.exit(1);
} else {
fs.writeFileSync(output, result, "utf8");
process.exit(0);
}
})
});
function processCss(cssString, callback) {
postcss([require('postcss-unprefix'), require('autoprefixer')])
.process(cssString, { from: 'in.css', to: 'out.css' })
.then(function ( error, result ) {
if (result) {
callback(String.trim(result.css));
} else {
callback(null, error);
}
});
}

Adsense or Google Doubleclick with meteor.js [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 7 years ago.
Improve this question
Is anyone succesfully adding adsense (loads with each pageview) or even better, with doubleclick (DFP)?
No matter what I try I cannot get them to show anywhere.
You can add Adsense as follows. This use the iron:router package.
<template name="MyAds">
<div class="leaderboard"></div>
</template>
Template.MyAds.rendered = function() {
$.getScript("//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js", function() {
var ads, adsbygoogle;
ads = '<ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-72414***074839" data-ad-slot="4009***57" data-ad-format="auto"></ins>';
$('.leaderboard').html(ads);
return (adsbygoogle = window.adsbygoogle || []).push({});
});
};
Router.map( function () {
this.route('MyRoute', {
waitOn: function() {
return IRLibLoader.load("//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js");
}
});
});
See here for more info: https://gentlenode.com/journal/meteor-18-add-google-adsense-to-your-application/37

How do I display a template with Meteor Iron Router while the user is logging in? [closed]

Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 8 years ago.
Improve this question
(When Meteor.loggingIn() is true)
You can use a custom action function.
Router.map(function () {
this.route('postShow', {
path: '/posts/:_id',
action: function () {
if (Meteor.loggingIn()) {
this.render('loggingIn');
} else {
this.render();
}
}
});
});
When Meteor.loggingIn() changes, the action function will reactively rerun.

FullCalendar addEventSource isn't working [closed]

Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 4 years ago.
Improve this question
On page load I have a function that sets my event sources like this:
var source1 = {
url: '/Feed1.aspx?param=abc',
color: '#4793E6',
textColor: 'black'
};
var source2 = {
url: '/Feed2.aspx?param=abc',
color: '#4793E6',
textColor: 'black'
};
Then I create the FullCalendar doing something like this:
$('#Calendar').fullCalendar({
eventSources: [
source1,
source2
]
});
This successfully loads both sources and renders the calendar. Then after changing a value using a drop-down on the page I want to remove source1 and source2, recreate them based on the changed value and refetch the events doing this:
$('#calendar').fullCalendar('removeEventSource', source1);
$('#calendar').fullCalendar('removeEventSource', source2);
var source1 = {
url: '/Feed1.aspx?param=defgh',
color: '#4793E6',
textColor: 'black'
};
var source2 = {
url: '/Feed2.aspx?param=defgh',
color: '#4793E6',
textColor: 'black'
};
$('#calendar').fullCalendar('addEventSource', source1);
$('#calendar').fullCalendar('addEventSource', source2);
/* According to the documentation this is NOT needed, but I tried anyway */
$('#calendar').fullCalendar('refetchEvents');
The event sources are successfully removed, but after changing the source values (using the same successful function as I do initially) and re-adding them, the fullCalendar doesn't try to fetch the events automatically which according to the documentation it's supposed to and still doesn't when I manually call refectchEvents.
No JavaScript errors are being thrown it just doesn't properly alter the sources and/or refetch the events.
What am I doing wrong?
Answer from comment
Be careful to use case sensitivity when getting elements by Id.
Don't feel bad though, it happens to all of us at one time or another!

Resources