Meteor subscription won't set checkbox if app is refreshed - meteor

Question

I'm running into an issue with Meteor subscription not setting checkbox "checked" after refresh. Basically, if I have Meteor running and change the JS, the app works as expected (pulls data from Meteor.user() and sets checkbox accordingly). However, if I refresh the app all my checkboxes are set to false. I don't see why that should happen, any ideas?
My subscription looks as follows:
Server-side
Meteor.publish("user-preferences", function () {
if (this.userId) {
return Meteor.users.find({_id: this.userId},
{fields: {'notification': 1}});
} else {
this.ready();
}
});
Client-side:
Meteor.subscribe("user-preferences", function() {
if (Meteor.user()) {
var notification = Meteor.user().notification;
// Check to see if notification and systems exists; if not, default to TRUE
if (notification) {
Session.set('aNotificationPreference', notification.hasOwnProperty('a') ? notification.a : true);
}
else {
Session.set('aNotificationPreference', true);
}
}
else {
// TRUE too if no user yet
Session.set('aNotificationPreference', true);
}
});
This is the helper that will look up the session variable to make things reactive:
Template.preferences.helpers({
isChecked: function() {
console.log('#### PREF INITIAL: ' + Session.get("aNotificationPreference"));
var pref = Session.get("aNotificationPreference");
if (typeof pref === 'undefined') {
Meteor.setTimeout(function() {
pref = Session.get("aNotificationPreference");
console.log('#### PREF IN TIMEOUT: ' + pref);
return pref ? 'checked' : false;
}, 1250);
}
else {
console.log('#### PREF in ELSE: ' + pref);
return pref ? 'checked' : false;
}
}
});
Finally, this is the HTML checkbox field:
<input type="checkbox" data-role="flipswitch" data-theme="b" name="aNotificationSwitch" id="aNotificationSwitch" data-mini="true" checked={{isChecked}}>
This is based of the Blaze documentation on this specifically and other posts I found.
I know the issue is in the helper but I'm not sure how to address it. The logs on failure show as follows:
Application Cache Checking event (index):1
Application Cache NoUpdate event (index):1
#### PREF INITIAL: undefined index.js?8b2a648142fb63b940f4fb04771d18f25b5bf173:63
Connected to Meteor Server. index.js?8b2a648142fb63b940f4fb04771d18f25b5bf173:37
#### PREF INITIAL: true index.js?8b2a648142fb63b940f4fb04771d18f25b5bf173:63
#### PREF in ELSE: true index.js?8b2a648142fb63b940f4fb04771d18f25b5bf173:73
Connected to Meteor Server. index.js?8b2a648142fb63b940f4fb04771d18f25b5bf173:37
#### PREF IN TIMEOUT: true

Answer 1

I am not an expert in Meteor yet.
But I would change the JavaScript you have for:
if(Meteor.isClient){
Template.preferences.helpers({
isChecked: function() { return Meteor.user().notification ? 'checked' : false; }
});
Template.preferences.events({
'click #aNotificationSwitch': function(event){
var checked = event.target.checked; // true or false
Meteor.users.update({_id: Meteor.userId()}, $set: {notification: checked});
}
});
}
It's different from your approach though. With this way you don't need to use session variables.
Allowing to update users:
Meteor.users.allow({
update: function(userId, user){
return user._id == userId;
}
});

Answer 2

The best solution I found was to set the flipswitch with jQueryMobile by doing the following on my panel's open event in the Template.body.events:
'panelbeforeopen #mypanel': function() {
//Refresh flipswitches prior to opening sidepanel otherwise they default to disabled
$("#aNotificationSwitch").flipswitch("enable").flipswitch("refresh");
$("#bNotificationSwitch").flipswitch("enable").flipswitch("refresh");
$("#cNotificationSwitch").flipswitch("enable").flipswitch("refresh");
}