Google Translate javascript snippet not working - javascript

I tried using the code snippet from w3school.com. It worked on w3school but doesnt work on my PC.
<div id="google_translate_element"></div>
<script>
function googleTranslateElementInit() {
new google.translate.TranslateElement({
pageLanguage: 'en'
}, 'google_translate_element');
}
</script>
<script src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
I got the following in the console.
translate.html:18 GET file://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit net::ERR_FILE_NOT_FOUND

The snippet over at w3school indeed has a bug.
It says to add the following line to include Google's API:
<script type="text/javascript" src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
Unfortunately the trailing // makes it point to a local file. So unless you've downloaded the library and bundled it with your html file this points to nowhere.
Instead link to the online library by adding https:
<script type="text/javascript" src="https://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>

When you're running it on your machine, you're running it as a local file. As such, the source file, which is loading from //translate.google etc, is trying to find this file on google.
If you replace this with:
<script type="text/javascript" src="https://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
you will find it is no longer trying to find a local file (i.e. on your machine), but instead will look for it on the internet.

pure javascript, can be integrated from browser debug console, or in webview, or any site. In this example we just find element and change his content to button (you can change any element you want)
importScriptURI("https://translate.google.com/translate_a/element.js");
document.getElementsByTagName("h1")[0].innerHTML='<div id="google_translate_element"></div>';
setTimeout(()=>{ new google.translate.TranslateElement({pageLanguage: 'en'},'google_translate_element');},1000);

Related

Angular custom scripts loader

I have an Angular 7 CLI app which is served by ASP.NET MVC.
In Index.cshtml file I have these lines:
<script type="text/javascript" src="~/app/runtime.js"></script>
<script type="text/javascript" src="~/app/polyfills.js"></script>
<script type="text/javascript" src="~/app/scripts.js"></script>
<script type="text/javascript" src="~/app/vendor.js"></script>
<script type="text/javascript" src="~/app/main.js"></script>
Everything works fine.
However sometimes during development these files are not generated due to compilation errors etc.
I'm wondering is there a way to write a custom manual loader that will try to fetch these files and if any of these are not found will pop up a nice message to the developer.
Basically a really simple pre-loader to the application.
Any input is greatly appreciated.
In my case, what I do when it comes to altering the index.html is having a controller, which I call SpaController with an Index (default) action. Then, I load the index.html file (which is really small) and patch it with all the changes I want to apply. After being patched and downloaded on the browser, the rest of the communication is done through API REST, so it's just a small patch.
In your case, I would use that action of that controller I mentioned above and check if all the tag scripts are included. If not, you have flexibility to alter index.html and do what you want, like showing an error, or even stop the application.

samsung smart TV how to include js library to other js files

I've written my own js library, how can i make other existing js files use it. For example, i created a video project, which include a default homepage scene (including homepgage.css, homepage.html and homepage.js) and a default detail scene (including detail.css, detail.html and detail.js). Then i created my own js file "lib.js" which fetches all video files from my server. Now the question is: how to make the file homepage.js able to use methods of "lib.js". I tried to include lib.js path in the file index.html by using:
<script type='text/javascript' language='javascript' src='scenes/detail.js'></script>
<script type='text/javascript' language='javascript' src='scenes/homepage.js'></script>
<script type='text/javascript' language='javascript' src='scenes/lib.js'></script>
I also include script tag:
<script type='text/javascript' language='javascript' src='scenes/lib.js'></script>
in the file homepage.html.
but both of them do not work.
Anybody know how to solve this ?
SmartTV application acts like normal website. If you want to use methods from lib.js you should include script before those methods are used. In your case problem may be in accessing methods from lib.js before they are declared. You should check emulator console to find such errors.

How to use Google Code

I use openlike (openlike.org) but the site seems to be temporarily down. I would normally use something like this:
<script type="text/javascript" src="http://openlike.org/v1/openlike.js"></script>
<script type="text/javascript">OPENLIKE.Widget()</script>
But that isn't working. I've found the project on google code, I was wondering how I implement exactly the same thing, but from Google? Is Google code completely different from the google cdn? I.e. I can't just change the URL of that javascript file?
Google code project: http://code.google.com/p/openlike/source/browse/#svn%2Ftrunk%2Fv1%253Fstate%253Dclosed
Thanks for any help,
Dave
From the link posted, if you click on "openlike.js" and then "View raw file" you'll get exactly that:
http://openlike.googlecode.com/svn/trunk/v1/openlike.js
You can certainly link to this file. Here's what I tried and it worked fine:
<script type="text/javascript" src="http://openlike.googlecode.com/svn/trunk/v1/openlike.js" ></script>
<script type="text/javascript" >
console.log(OPENLIKE);
</script>
I don't know enough about google code and svn to tell you if that file will be there forever and won't change. I doubt that it's intended to be used a CDN. But it's probably good enough to use while openlike.org is down temporarily.

turning on jquery?

I have website A: http://dl.dropbox.com/u/3264697/calc/v2/index.html
It is working as intended, 100%.
I have website B: http://pe2kasb.net63.net/
It is not working as intended. Website B is a file for file mirror of A.
I assume then, this is something wrong with the host. Looking at the Javascript console, the error appears to be related to the host:
screenshot here http://img825.imageshack.us/img825/4782/unlednwe.png
Need I contact them, or is there something I can do...? I'm new to JQuery, and I believe that's what is the root of the issue but... i'm not sure.
You are trying to load jQuery from ../v2/media/js/jquery.js but there is no such file in the second website.
I recommend that instead of hosting JQuery yourself, you use a hosted version:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js" type="text/javascript">
</script>
This post explains the reasons.
You have invalid jQuery path at http://pe2kasb.net63.net/
Replace
<script type="text/javascript" src="../v2/media/js/jquery.js"></script>
with
<script type="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
Also you have dataTable.js missing.
You are loading JQuery from ../v2/media/js/jquery.js which does not seem to exist...
To solve the issue and improve the speed of the website
do not store JQuery on the server, rather load it from a 3rd party (Google works well)
use JQuery minified version
To load JQuery from Google you can just use:
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("jquery", "1");
</script>
More information here
EDIT: note that the above automatically loads the minified version of JQuery. If, for whatever reason (?) you wanted to load the uncompressed version you could use
google.load("jquery", "1", {uncompressed:true});
Look what http://pe2kasb.net63.net/v2/media/js/jquery.js refers to.
The file does not exist.
Upload it or include it from another location.
Make sure that jQuery is correctly linked, currently jQuery is supposed to be at "../v2/media/js/jquery.js" on "http://pe2kasb.net63.net/", which means go back one folder then enter "/v2/media/js/jquery.js".

jquery: how do i know if i have it?

i need jquery to work on a browser locally. how do i know if it is installed and how do i install it ?
my question is specific to being able to run this code:
onmouseover="evt.target.setAttribute('opacity', '0.5'); $('#someDiv').show();"
onmouseout="evt.target.setAttribute('opacity', '1'); $('#someDiv').hide();"
You can test if jQuery is loaded by opening your javascript console (in Chrome: Settings > More tools > Javascript console).
Where the little blue arrow appears type:
if(jQuery) alert('jQuery is loaded');
Press enter.
jQuery isn't installed like a program, it's a file that needs to be included in your source code somehow, the most common practice is to include by adding <script type='text/javascript' language='javascript' src='local/path/to/jquery.js'></script> in the <head> section of your page.
If you are going to include jQuery locally, as per Robert's suggestion, you will first have to download it from here: http://code.jquery.com/jquery-1.4.2.min.js
put this right above your closing body tag:
<script src="//ajax.googleapis.com/ajax/libs/jquery/[jquery version here]/jquery.min.js"
language="javascript" type="text/javascript"></script>
jquery isn't "installed" into a browser. it's a js library referenced from the web page you are viewing.
EDIT: This works if you have internet access. If not, you will have to download that file to your local system and reference the local path.

Categories