Develop Reference

Meteor: publish dynamically requested range of items

I have huge collection of over 5000+ records. I want to be able to view records 10 at a time. How can I dynamically publish the data that way?
I've tried this so far:
My server.js file :
Meteor.methods({
publishSongs : function (first, last) {
Meteor.publish('adminSongs', function() {
return Songs.find({}, {
skip : first,
limit : last,
sort : {
date : -1
}
});
});
}
});
My client.jsfile :
Template.admin.events({
'click #previous' : function() {
updateSession(-10);
publishSong();
},
'click #next' : function() {
updateSession(10);
publishSong();
}
});
Template.admin.onCreated(function() {
Session.setDefault('limit', {
first : 0,
last : 10
});
publishSong()
})
function publishSong() {
Meteor.call(
'publishSong',
Session.get('limit').first,
Session.get('limit').last
);
}
function updateSession(value) {
Session.set('limit', {
first: Session.get('limit').first + value,
last: Session.get('limit').last + value,
});
}
The server is printing this error message:
Ignoring duplicate publish named 'adminSongs'
It seems like I'm using publications wrong and could use some guidance.

It doesn't look like you're never updating your Session.get('limit'). You'll need to update then you press next/previous otherwise you're always going to get the same records. You'll also need to change the way you're doing publications:
Template.admin.events({
'click #previous' : function() {
updateSession(-10);
},
'click #next' : function() {
updateSession(10);
}
});
Template.admin.onCreated(function() {
Session.setDefault('limit', {
first : 0,
last : 10
});
Template.instance().autorun( function() {
Template.instance().subscribe('adminSongs', Session.get('limit').first, Session.get('limit').last);
});
});
function updateSession(value) {
Session.set('limit', {
first: Session.get('limit').first + value,
last: Session.get('limit').last + value,
});
}
I'm assuming based on your code that you already have a helper defined to return the available songs. The code above makes it so that you have one subscription, and that subscription will update any time your session variable changes.
Your server code will also need to be updated:
Meteor.publish('adminSongs', function(first, last) {
return Songs.find({}, {
skip : first,
limit : last,
sort : {
date : -1
}
});
});
Can be outside of a Meteor.method.

How can I update a complex knockout observable programatically?

I'm using durandal/requirejs/knockout here.
I'm also using the coderenaissance plugin for mapping (ko.viewmodel.updateFromModel(zitem, data).)
I'm getting the following data from my ajax call which I'm mapping into my zitem observable.
{
"itemNumber" : "ABATAH000",
"effectiveDate" : "2015-11-03T15:30:05.7118023-05:00",
"expiryDate" : "2015-05-03T15:30:05.7118023-04:00",
"minimumPremium" : 25,
"zSubItems" : [{
"zSubItemName" : "Mine",
"unitDistance" : 100000,
"zSubSubItems" : [{
"zSubSubItemName" : "CoverageA",
"zSubSubItemPremium" : 100.0,
"id" : 0
}
],
"id" : 1
}
],
"id" : 0
}
And here is the viewmodel I'm using:
define(['plugins/http', 'durandal/app', 'knockout', 'services/datacontext'],
function (http, app, ko, datacontext) {
var zitem = ko.observable();
var activate = function () {
//This is just a wrapper around an ajax call.
return datacontext.getPolicy("value")
.then(function(data) {
ko.viewmodel.updateFromModel(zitem, data);
});
};
var updateMinimumPremium = function (thisItem) {
//This doesn't work
zitem.minimumPremium(thisItem.minimumPremium + 1);
};
return {
displayName: 'zitem example',
zitem: zitem,
updateMinimumPremium: updateMinimumPremium,
activate: activate
};
});
I'm binding the updateMinimumPremium to a click on a button at the same level as the minimumPremium element.
<button data-bind="click: $parent.updateMinimumPremium">Add 1</button>
How can I update [minimumPremium] or [zSubSubItemPremium] programatically?

"minimumPremium" would be observable
zitem.minimumPremium(thisItem.minimumPremium() + 1);

Your zitem is observable as well, so try this:
zitem().minimumPremium(thisItem.minimumPremium + 1);
In real application don't forget to check the value of zitem() call - it can be uninitialized.

ExtJS addEvents - is it optional?

Using an ExtJS example from http://www.extjs-tutorial.com/extjs/custom-events-in-extjs
Can someone explain why it makes no difference if I comment those 2 lines in the constructor as bellow?
Here is the code:
Ext.define('Student', {
config : {
name : '',
schoolName : ''
},
mixins :
{
observable : 'Ext.util.Observable'
},
constructor : function(config){
// this.addEvents('studentNameChanged');
this.mixins.observable.constructor.call(this, config);
// this.initConfig(config);
},
updateName : function(newValue, oldValue){
this.fireEvent('studentNameChanged', newValue);
}
});
var newStudent = Ext.create('Student', { name: 'xyz' });
newStudent.on('studentNameChanged', function(name){
alert('student Name has been Chaged to ' + name);
});
newStudent.setName('John');

IIRC using addEvents was mandatory in Ext JS 3.x and below, was deprecated in 4.x and will produce an error in 5.0+. Don't use it.

Reload jstree window with new base node id

I have 2 JSTree windows, the first shows a directory tree, the second showing the files (not directories) within the selected directory.
var dirTree = $('#folders').jstree({
'core' : {
'data' : {
'url' : '/myUrl?action=tree',
'data' : function (node) {
return { 'id' : node.id };
}
}
}});
var fileTree = $('#files').jstree({
'core' : {
'data' : {
'url' : '/myUrl?action=files',
'data' : function (node) {
return { 'id' : node.id };
}
}
}});
// listen for event
$('#folders').on('select_node.jstree', function (e, data) {
fileTree.jstree("refresh");
}).jstree();
The above is the current state of my code, but I appreciate the jstree call in the select will need to change somehow.
When a directory is clicked on, I wish to have my list of files totally refreshed with the contents of the selected directory node. I believe I wish to ask how I set the base node when I refresh the file window, but if you think you know of a better way of doing this let me know.

If anyone has any other ideas, you are welcome to post an alternative answer.
My current solution is to set a baseId which is used as the id for the file window and then refreshed....
var baseId = '#';
var dirTree = $('#folders');
var fileTree = $('#files');
dirTree.jstree({
'core' : {
'data' : {
'url' : '/myUrl?action=tree',
'data' : function (node) {
return { 'id' : node.id };
}
}
}});
fileTree.jstree({
'core' : {
'data' : {
'url' : '/myUrl?action=files',
'data' : function (node) {
return { 'id' : baseId };
}
}
}});
// listen for event - could chain this with instantiation??
dirTree.on('select_node.jstree', function (e, data) {
baseId = data.selected[0];
fileTree.jstree("refresh");
}).jstree();

how to access function in Json

I am able to access the onclick properties function for the printButton property at the end of the block. Although I am unable to initiate the onclick functions under the exportButton property.I have the following code.
B.exporting = {
type : "image/png",
url : "http://export.highcharts.com/",
width : 800,
enableImages : false,
buttons : {
exportButton : {
symbol : "exportIcon",
x : -10,
symbolFill : "#A8BF77",
hoverSymbolFill : "#768F3E",
_titleKey : "exportButtonTitle",
menuItems : [{
textKey : "downloadPNG",
onclick : function() {
this.exportChart()
}
}, {
textKey : "downloadJPEG",
**onclick : function() {
this.exportChart({
type : "image/jpeg"
})**
}
}, {
textKey : "downloadPDF",
onclick : function() {
this.exportChart({
type : "application/pdf"
})
}
}, {
textKey : "downloadSVG",
onclick : function() {
this.exportChart({
type : "image/svg+xml"
})
}
}
}]
},
printButton : {
symbol : "printIcon",
x : -36,
symbolFill : "#B5C9DF",
hoverSymbolFill : "#779ABF",
_titleKey : "printButtonTitle",
onclick : function() {
this.print()
}
}
}
};
I am binding keyboard controls to the click events using the jquery plugin this is what I used to print. This Works!:
Mousetrap.bind('ctrl+s', function(e) { B.exporting.buttons.printButton.onclick(this.print());
});
This code is what I tried to access an individual onclick function under the exportButton property in the json above
Mousetrap.bind('*', function(e) {B.exporting.buttons.exportButton.menuItems[0].onclick;});
The result i get is the value but i want to run the function as the onclick property does.Does anyone know how to run a function under a json property?I Appreciate any help here thanks folks.

Mousetrap.bind('click', B.exporting.buttons.exportButton.menuItems[0].onclick);
Your ctrl-s binding also looks wrong, it should be:
Mousetrap.bind('ctrl+s', B.exporting.buttons.printButton.onclick);
The printButton.onclick function doesn't take an argument. Your binding calls this.print before calling the printButton.onclick function, and then the printButton.onclick function
does it again.