Code: Select all
Html$ = ~"<button id=\"increment\">Tap me</button>\n"+
~"<div>You tapped <span id=\"count\">0</span> time(s).</div>\n"+
~"<button id=\"compute\">Compute</button>\n"+
~"<div>Result of computation: <span id=\"compute-result\">0</span></div>\n"+
~"<script>\n"+
~" const [incrementElement, countElement, computeElement, "+
~"computeResultElement] =\n"+
~" document.querySelectorAll(\"#increment, #count, #compute, "+
~"#compute-result\");\n"+
~" document.addEventListener(\"DOMContentLoaded\", () => {\n"+
~" incrementElement.addEventListener(\"click\", () => {\n"+
~" window.increment().then(result => {\n"+
~" countElement.textContent = result.count;\n"+
~" });\n"+
~" });\n"+
~" computeElement.addEventListener(\"click\", () => {\n"+
~" computeElement.disabled = true;\n"+
~" window.compute(6, 7).then(result => {\n"+
~" computeResultElement.textContent = result;\n"+
~" computeElement.disabled = false;\n"+
~" });\n"+
~" });\n"+
~" });\n"+
~"</script>";
Procedure IncrementJS(Json$)
Static i
Debug "IncrementJS "+Json$
i+1
ProcedureReturn UTF8(~"{ \"count\": "+Str(i)+ "}")
EndProcedure
Procedure ComputeJS(Json$)
Debug "ComputeJS "+Json$
ProcedureReturn UTF8(~"150")
EndProcedure
OpenWindow(0, 100, 100, 400, 400, "Hello", #PB_Window_SystemMenu)
WebViewGadget(0, 0, 0, 400, 400)
SetGadgetText(0, Html$)
BindWebViewCallback(0, "increment", @IncrementJS())
BindWebViewCallback(0, "compute", @ComputeJS())
Repeat
Event = WaitWindowEvent()
Until Event = #PB_Event_CloseWindow
