How to use a function from a JavaScript package produced by GopherJS? - go

I have written a simple package in Go and I have compiled with gopherJS .
I have then included it my HTML via
<script src="./testgopher.js">
It has been loaded and all is well. But I am not sure how I can reuse a go function that has been declared in one of packages inside my own javascript.
What I want to do is in another script tag
<script> testpkg.Testfunc() </script>
where the testpkg and Testfunc have been written in go.
I tried to look into the window object and it doesnt look like the function has been added to window.

First you have to register your function if you want to call it from JavaScript. For that you may use the js.Global variable.
Let's see a simple Go function called Hello() which writes the "Hello World!" text into the main document:
import "github.com/gopherjs/gopherjs/js"
func Hello() {
js.Global.Get("document").Call("write", "Hello World!")
}
Then in your Go main() function you can register it like this:
func main() {
js.Global.Set("Hello", Hello)
}
After this registration, the "Hello" identifier will be available to you in JavaScript. Since we registered a Go function value (Hello) to this identifier, it will also be a function in JavaScript which you can simply call like this:
<script>
Hello();
</script>

Related

Cannot call getUI from this context when using google.script.run

I'm making a program that will automatically open the launch meeting page to take me to my next ZOOM class on time, and our schools have 'a days' and 'b days', each with a different schedule, so I have an HTML page that has two buttons, one that will trigger the schedule for an A day and another that triggers the schedule for a B day. I'm testing the functions that will open the new tab and run that function from the HTML, but when I run it from the HTML, I get an error message in my executions that says cannot call DocumentApp.getUI from this context. My code is here, if you put it into GAS you can see for yourself.
Part of my code came from this answer
My code.gs file
function doGet() {
return HtmlService.createHtmlOutputFromFile('index.html');
}
function openUrl( url ){
var html = HtmlService.createHtmlOutput('<html><script>'
+'window.close = function(){window.setTimeout(function(){google.script.host.close()},9)};'
+'var a = document.createElement("a"); a.href="'+url+'"; a.target="_blank";'
+'if(document.createEvent){'
+' var event=document.createEvent("MouseEvents");'
+' if(navigator.userAgent.toLowerCase().indexOf("firefox")>-1){window.document.body.append(a)}'
+' event.initEvent("click",true,true); a.dispatchEvent(event);'
+'}else{ a.click() }'
+'close();'
+'</script>'
+'<body style="word-break:break-word;font-family:sans-serif;">Failed to open automatically. Click here to proceed.</body>'
+'<script>google.script.host.setHeight(40);google.script.host.setWidth(410)</script>'
+'</html>')
.setWidth( 90 ).setHeight( 1 );
DocumentApp.getUi().showModalDialog( html, "Opening ..." );
}
function LaZoom(){
openUrl('https://op97-org.zoom.us/j/9622570589');
}
My HTML file
<!DOCTYPE html>
<html>
<button onclick = 'aDay()'>A day</button>
<button onclick = 'bDay()'>B day</button>
</html>
<script>
function aDay(){
google.script.run.LaZoom();
alert('ran')
}
</script>
You can easily do this client side using window.open instead of going back and forth between server and client.
function aDay(){window.open('A_URL')}

How to stop html template from escaping

I have an html template where i want to insert some JavaScript code from outside of template itself. In my template data struct i have created a string field JS string and call it with {{.JS}}. The problem is that everything in browser is escaped:
newlines are \n
< and > are \u003c and \u003e
" is \"
Same symbols inside of a template are fine. If I Print my JS field into console it is also fine. I have seen some similar problems solved by using template.HTML type instead of string. In my case it does not work at all.
EDIT 1
The actual context is
<script language="JavaScript">
var options = {
{{.JS}}
};
</script>
Either change the field's type to template.JS like so:
type Tmpl struct {
// ...
JS template.JS
}
Or declare a simple function that converts a string to the template.JS type like so:
func toJS(s string) template.JS {
return template.JS(s)
}
And then register the function with the Funcs method and use it in your template like so:
{{toJS .JS}}
Try setting the type of JS to template.JS:
import "html/template"
type x struct {
JS template.JS
}
Documentation can be found here.

Phalcon view not rendering right from other actions

I was reading the documentation on Phalcon about Hierarchical Rendering("http://docs.phalconphp.com/en/latest/reference/views.html#hierarchical-rendering"). And I can't seem to figure it out. I have the following file setup just like the documentation but the only difference is that i am using volt.
--views
--vacancy
--index.volt// action
--new.volt//action
--layouts
--vacancy.volt//controller
And this is my Vacancy controller. It's just an empty controller
class VacancyController extends \Phalcon\Mvc\Controller
{
public function indexAction()
{
}
public function newAction()
{
}
}
Problem
When i go to "mysite.com/vacancy" everything seems to be rendering just fine. But when i use the "new" action "mysite.com/vacancy/new" i get the content of the file new.volt but it doesn't render the way i think it's supposed too.
In the chrome console i get this error:
Resource interpreted as Script but transferred with MIME type text/html:
If i remove the action "new " it will just renders fine!
I hope it's clear enough.
I resolve it just by putting a / before every file that i was including into the html document..
Example
<script type="text/javascript" src="/js/main.js"></script>
instead of
<script type="text/javascript" src="js/main.js"></script>

Why can't I call goog.require() in the same code block in which I call a function from the loaded library?

Here is my html.
<html>
<head>
<script src="closure-library/closure/goog/base.js"></script>
<script src="hello.js"></script>
</head>
<body onload="sayHi()">
</body>
</html>
And here is my hello.js file.
var options = {
"style" : "background:#EEE;"
}
function sayHi() {
goog.require("goog.dom");
var header = goog.dom.createDom("h1", options, "hello world");
goog.dom.appendChild(document.body, header);
}
Why does Chrome Console issue this error?
Uncaught TypeError: Cannot call method 'createDom' of undefined
In general, I don't think I can require a library in the same code block in which I call a function from the library. I just saw this in the documentation, but I was wondering why.
In uncompiled Closure code, each goog.require(NAMESPACE) results in a call to:
document.write('<script src="SCRIPT_PROVIDING_NAMESPACE"></script>');
The dependencies are defined with calls to goog.addDependency(relativePath, provides, requires) in deps files generated with depswriter.py. Using the Chrome Developer Tools, the Elements tab shows all of the <script> elements dynamically inserted based on the Closure Library dependencies defined in deps.js.
In your example, when sayHi() is triggered by the body onload event, a new <script> element is inserted in the header. However, this new <script> element has not yet loaded goog.dom. Therefore, goog.dom is undefined.
If you change hello.js as follows:
goog.require("goog.dom");
var options = {
"style" : "background:#EEE;"
}
function sayHi() {
var header = goog.dom.createDom("h1", options, "hello world");
goog.dom.appendChild(document.body, header);
}
Then goog.require("goog.dom") gets executed prior to the onload event and the inserted <script> element has a chance to load dom.js prior to the call to sayHi().

how to use php variable in a external javascript file by ajax?

Basically, I want to use a php variavle in a external Js file by ajax. For instance:
in a example.php file
<?php
$a="123"
//and then I want to call a show() function through a onclick event later
<xxxxxxxxxxxxx...... onclick="show()">;
?>
in another example2.js file there is a function
show()
{
var b
// I want to assign $a's value to this variable b here.=> b=a
//but I only want to do this way by using ajax.
}
Is there anybody can tell me how to do that? Thanks.
did you try to insert the ajax_object.responceText into a value in a and then get it with javascript?

Resources