CODEWITHSUNDEEP
meteorbreadcrumbs
coldfry
coldfry

Reputation: 15

ReferenceError: is not defined with Meteor

I am using Meteor for Windows. I am trying to run a function in breadcrumb.js which is located in /client/lib and I keep getting this error. ReferenceError: initBreadcrumb is not defined. I am a Java programmer and I am not sure if I am just trying to call intiBreadcrumb() wrong or if there is just something weird with Meteor that I am not used to.

I reference it in index.js like so:

if (Meteor.isClient) {
     // counter starts at 0
     Session.setDefault('json', "Hello");

     Template.div1.created = function() {
         initBreadcrumb();
     }
}

Here is the breadcrumb.js code:

var breadcrumbList;
var crumbItems = [];
var variableCrumb;

function initBreadcrumb() {
     var breadcrumb=$('<div>');
     breadcrumb.addClass('breadcrumb');

     breadcrumbList=$('<ul>');
     breadcrumbList.addClass('breadcrumb_list');
     breadcrumbList.appendTo(breadcrumb);

     // Always add homepage icon
     var homeIcon=$("<img>");
     homeIcon.attr('alt','Homepage');
     homeIcon.attr('src','../../public/images/home.png');

     addCrumb('index.html', homeIcon, 'breadcrumb_first');


     breadcrumb.prependTo($('body'));
}

function addCrumb(link, content, className) {
     var newListItem=$('<li>');
     if (className != undefined)
         newListItem.addClass(className);
     var newLink=$('<a>');
     newLink.attr('href', link);

     content.appendTo(newLink);
     newLink.appendTo(newListItem);
     newListItem.appendTo(breadcrumbList);

     crumbItems.push(newListItem);
}

function addTextCrumb(linkHref, linkText) {
     var newLink=$('<a>').text(linkText);
     addCrumb(linkHref, newLink, 'breadcrumb_text');
     return newLink
}

/***
* Set the "variable" crumb - i.e. the page content crumb
*/
function setVariableCrumb(linkHref, linkText) {
     if (variableCrumb == undefined) {
         variableCrumb=addTextCrumb(linkHref, linkText);
     } else {
         variableCrumb.text(linkText);
     variableCrumb.attr('href', linkHref);
     }
}

Upvotes: 0

Views: 790

Answers (2)

Tomas Hromnik
Tomas Hromnik

Reputation: 2200

You have to understand how JavaScript scope works. There is global and local scope. Meteor wraps all *.js files by function (closure):

(function() {
  //local function
  function yourFunction() {
    //code
  }
})()

So your functions becomes local ones.

If you want to define global function in closure you need to define it as global variable:

(function() {
  //global function
  yourFunction = function() {
    //code
  }
})()

Upvotes: 3

SungYong Jang
SungYong Jang

Reputation: 106

You have to change the function definition code.

initBreadcrumb = function(){...};
addCrumb = function(link, content, className){...};
addTextCrumb = function(linkHref, linkText){...};
...

Then your function can be run in your template code. This will make your function to global.

Upvotes: 0

Related Questions