Function Not Defined

1

I am getting very frustrated with this. Basically, I am unable to get Meteor to recognize a function I wrote.

Here is some of the code in a JS in the lib folder:
function moveBelowBottomOfBanner(id) {
$(id).css(“top”, getBottomOfElement($("#banner")));
}

I have a js folder within the client folder with a JS file that contains this code:
(function () {
scrollToTop = function() {
$(“html, body”).animate({ scrollTop: “0px” });
}

getBottomOfElement = function(element) {
    alert(element.offset() != null)
    //add y position and height to get the position of the bottom of the element
    return 50;//element.offset().top + element.height();
}

})();

So why is it giving me a reference error?

Thanks

2

You are declaring a bunch of non-namespaced globals, which is a tad concerning. However, leaving that aside, Meteor wraps all js files not in client/compatibility in a closure, so I suspect your self-closed code is doubly wrapped. Also, you need to ensure that this code is executed before getBottomOfElement is referenced.

So, if you want to do it this way, it looks like your best bet is to place your closure in client/compatibility. See the docs for more info.

This folder is for compatibility JavaScript libraries that rely on variables declared with var at the top level being exported as globals. Files in this directory are executed without being wrapped in a new variable scope. These files are executed before other client-side JavaScript files.

3

I changed the location to the compatibility folder and it still gives me an error. It tells me an error starting with 'Exception in callback of async function: getBottomOfElement@http://localhost:3000/client/compatibility/global.js?’.
Thanks

4

Well, the code you have provided has no async functions or callbacks, so that error is elsewhere. The exception message normally contains the line number of the offending request.

5

Thanks I believe the problem was that I tried to use onRendered as a callback function as a pose to rendered.