Web Worker Javascript cannot find functions in other javascript files - javascript

I have an HTML file like this:
<html>
<head>
<title>World Aviation</title>
<script language="javascript" src="./jquery-min.js"> </script>
<script language="javascript" src="./jsDraw2D.js"> </script>
<script language="javascript" src="./script.js"> </script>
</head>
<body>
<input onClick="startAnimBackground();" type="button" value="Start"/>
<script language="javascript">
initAirports();
initRoutes();
var w;
function startAnimBackground()
{
if(typeof(Worker) !== "undefined")
{
if(typeof(w) == "undefined")
{
w = new Worker("start_script.js");
}
} else {
startAnimation();
}
}
</script>
</body>
</html>
the file "start_script.js" contains only 1 line which calls the startAnimation() function. This function is located in "script.js"
My problem is: my browser supports web-workers, so it creates a web-worker and loads the file "start_script.js", but it fails to call the function "startAnimation()" indicating that it cannot find the function. But this function is located in script.js which is included in the head section. So, the only conclusion I can draw is that web-worker JS files have a different scope and thus is not able to include the 3 javascript files specified in the head section. So what should I do to make this work?
Thanks.

Web workers don't share functions, variables, or scripts with the main script.
To load dependencies, call importScripts() in your worker.
To allow your web worker to interact with or affect the main script or the DOM, you have to use message passing and have the main script listen for, interpret, and act on the messages.
See: https://developer.mozilla.org/en-US/docs/Web/Guide/Performance/Using_web_workers

Related

GetGlobalContext is not defined in HTML webresrouce of Dynamics CRM

I've an HTML web resource in Dynamics CRM on-premise environment. It is saved as new_htmlpage1, now at a click of Custom button I'm opening this HTML web resource. I've added ClientGlobalContext.js.aspx as reference in HTML webresource as well. But still I am receiving error that GetGlobalContext is not defined
Below is my HTML source code.
<html>
<head>
<script src="../ClientGlobalContext.js.aspx" type="text/javascript"></script>
<script type="text/javascript">
function tempContext(){
if (typeof GetGlobalContext != "undefined") {
var userName = Xrm.Page.context.getUserName();
alert(userName);
return;
}
}
</script>
</head>
<body onload="tempContext()">
</body>
</html>
Here is the walkthrough from Microsoft that I am following, but still unable to get GlobalContext.
Please let me know what I am missing here.
The path to ClientGlobalContext.js.aspx is a relative path (relative to the location of your web resource), so ensure that you navigate up the necessary amount of times. E.g. one of the following might be what you need to use, depending on your web resource:
<script src="ClientGlobalContext.js.aspx" type="text/javascript" ></script>
<script src="../ClientGlobalContext.js.aspx" type="text/javascript" ></script>
<script src="../../ClientGlobalContext.js.aspx" type="text/javascript" ></script>
You should then call the function GetGlobalContext() from JavaScript to get access to the global context.
Right now you are trying to call Xrm.*, which is not available.
As the documentation for the GetGlobalContext function states:
Including a reference to ClientGlobalContext.js.aspx does not make the
Xrm object available in HTML web resources. Therefore, scripts
containing Xrm.* methods aren’t supported in HTML web resources.
parent.Xrm.* will work if the HTML web resource is loaded in a form
container. However, for other places, such as loading an HTML web
resource as part of the SiteMap, parent.Xrm.* also won’t work.

calling javascript function from another file

I am trying to accomplish something similar to: Calling a function from one JavaScript file which requires another
Essentially, I have index.php, which is the main file for the home page. Within the index file, I am calling a javascript function from another js file.
<script src="js/data.js"></script>
<script>(go_call())</script>
within data.js:
function go_call(){
alert('working');
}
I get the following error: Uncaught ReferenceError: go_call is not defined
UPDATE 1:
My original code is working fine in IE, but this error I have occurs in google chrome.
A function cannot be called unless it was defined in the same file or one loaded before the attempt to call it.
A function cannot be called unless it is in the same or greater scope then the one trying to call it.
It should work like this:
1) within data.js
function go_call(){
alert('working');
}
2) Within file2.js
function clickedTheButton() {
go_call();
}
3) Html File:
<html>
<head>
</head>
<body>
<button onclick="clickedTheButton()">Click me</button>
<script type="text/javascript" src="data.js"></script>
<script type="text/javascript" src="file2.js"></script>
</body>
</html>

How do I link scripts externally and internally?

I have a website that I want to work online and offline. I want to decrease load time, so I minified the slow loading scripts. It didn't work enough. Locally, some of the scripts are taking 4-6 seconds to load.
I know that linking scripts externally speeds it up drastically. I have tried it and it works. But some of the users will not have internet access. Is there a way to link a group of scripts to an external site, and locally if they do not have internet access?
<script src="js/jquery-1.9.1.min.js" type="text/javascript"></script>
<script src="js/jquery.dataTables.min.js" type="text/javascript"></script>
<script src="ui/jquery-ui.min.js" type="text/javascript"></script>
You can do something similar to this answer. Basically, the idea is that you attempt to load the Internet based script for jQuery. Afterward, you do a normal script where you check if jQuery === undefined. If it does, you want to load the local copy.
Basically, an example of what you want to do:
<script src="[jQueryURL]" type="text/javascript"></script>
<script src="[dataTablesURL]" type="text/javascript"></script>
<script src="[jQueryUIURL]" type="text/javascript"></script>
<script type="text/javascript">
if(jQuery === undefined) {
var script = document.createElement("script");
script.type = "text/javascript";
script.src = "js/jquery-1.9.1.min.js";
document.getElementsByTagName('head')[0].appendChild(script);
//repeat for other two scripts here
}
</script>
What will happen is that it will attempt to load the scripts in question, and afterward it will check if jQuery is defined. If it's not, that means the scripts didn't load, so you want to load the local versions and append them to your header.
Ensure that the script declares a global variable you can test for. Then generate a local script loading element if the external script fails to load (which you can determine by testing for that variable).
<script src="http://example.com/example.js"></script>
<script>
if !(window.Example) {
document.write('<script src="../scripts/example.js"><\/script>');
}
</script>
<script type="text/javascript">
if(navigator.onLine)
{
alert("Connected");
}
else
{
alert("Not Connected");
}
</script>
First Check if internet connection exist then load external file other wise load internal file

Can an inserted <script> tag be run multiple times without using eval in JavaScript?

I have to use a plugin which bundles js files inside html files (gadgets). For one use case I need to drop and re-instantiate a gadget to run updated code.
So say I have foo.html:
<html>
<head>
<script src="foo.js"></script>
</head>
<body>...</body>
</html>
and foo.js which is the file being injected into my actual document's head:
alert("hello");
Problem is I can only cachebust the html file dynamically and declare my gadget as foo.html?x=123, but the JS file I'm after will still be foo.js so the browser will not re-run it.
Question:
Once a <script> tag is inserted into the document and run, is there any way to run it again without using a module-loader or eval?
Thanks!
You could wrap your code in your <script> tags in a function then call your function. This will allow you to call your code to be called multiple times. Like this:
<script>
function loaded(){
// JavaScript here
}
loaded();
</script>
</body>

Why will an object literal load when in declared in external source file but not when called in a file including an external javascript file file

The code in the external file is
var testing = {
bugtest: function() {
alert('No Bugs Here');
}
}
In the php file I am using
<script type="text/javascript" src="externalScript.js">
testing.bugtest();
</script>
But this will not work why?
if I call the function in the external fil it works
var testing = {
bugtest: function() {
alert('No Bugs Here');
}
}
testing.bugtest()
this will work but this not what I want it to do I want to be able to call the function in the main file? What would the cause of this problem be?
You can not use src attribute and the text node with script elements.
They must be exclusive, e.g. an element each.
So your HTML would look something like...
<script type="text/javascript" src="externalScript.js"></script>
<script type="text/javascript">
testing.bugtest();
</script>
This
<script type="text/javascript" src="externalScript.js">
testing.bugtest();
</script>
is wrong. You can either specify a src, or run inline code.

Categories