Home Explore Help
Sign In
pascal
/
pas2js
mirror of https://gitlab.com/freepascal.org/fpc/pas2js.git
2
0
Fork 0
Files Issues 0 Wiki
Browse Source

* Really simple event handler demo

Michael Van Canneyt 1 year ago
parent
8ea30c73c1
commit
b81e313402
8 changed files with 326 additions and 0 deletions
Split View Show Diff Stats
  1. 10 0
      demo/wasienv/job/onclick/README.md
  2. 0 0
      demo/wasienv/job/onclick/bulma.min.css
  3. 2 0
      demo/wasienv/job/onclick/host-config.js
  4. 33 0
      demo/wasienv/job/onclick/index.html
  5. 71 0
      demo/wasienv/job/onclick/wasmdemo.lpi
  6. 46 0
      demo/wasienv/job/onclick/wasmdemo.lpr
  7. 104 0
      demo/wasienv/job/onclick/wasmjobhost.lpi
  8. 60 0
      demo/wasienv/job/onclick/wasmjobhost.lpr

+ 10 - 0
demo/wasienv/job/onclick/README.md
View File 

@@ -0,0 +1,10 @@
 
+This is a demo to show that you can set an event handler for a DOM element
 
+from within a Webassembly program that uses JOB.
 
+
 
+You need the job_web.pas unit which is distributed in the Free Pascal
 
+sources, see packages/wasm-job/examples/job_web.pas
 
+
 
+Compile both the host program and webassembly program, and then you can see
 
+the onclick event in action.
 
+
 
+

File diff suppressed because it is too large
+ 0 - 0
demo/wasienv/job/onclick/bulma.min.css


+ 2 - 0
demo/wasienv/job/onclick/host-config.js
View File 

@@ -0,0 +1,2 @@
 
+var 
+  wasmFilename = "wasmdemo.wasm";

+ 33 - 0
demo/wasienv/job/onclick/index.html
View File 

@@ -0,0 +1,33 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+<head>
 
+    <meta charset="UTF-8">
 
+    <title>Wasm Javascript Object Bindings - Test bed</title>
 
+    <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate"> <!-- Prevents caching -->
 
+    <meta http-equiv="Pragma" content="no-cache"> <!-- Legacy HTTP 1.0 backward compatibility -->
 
+    <meta http-equiv="Expires" content="0"> <!-- Proxies -->
 
+    <link href="bulma.min.css" rel="stylesheet">
 
+    <link type="stylesheet" src="bulma.min.css">
 
+    <script src="host-config.js"></script>
 
+    <script src="wasmjobhost.js"></script>
 
+</head>
 
+<body>
 
+    
+    <div class="box">
 
+    <div/>
 
+    <div class="box">
 
+      <p class="title is-3">Webassembly test bed</p>
 
+      <p class="subtitle is-5">Console output:</p>
 
+      <div id="pasjsconsole">
 
+      </div>
 
+    </div>
 
+    <div class="box">
 
+      <button id="btnOK" class="button is-primary">Click me, please!</button>
 
+    <div/>
 
+   
+  <script>
 
+    rtl.showUncaughtExceptions=true;
 
+    rtl.run();
 
+  </script>
 
+</body>
 
+</html>

+ 71 - 0
demo/wasienv/job/onclick/wasmdemo.lpi
View File 

@@ -0,0 +1,71 @@
 
+<?xml version="1.0" encoding="UTF-8"?>
 
+<CONFIG>
 
+  <ProjectOptions>
 
+    <Version Value="12"/>
 
+    <General>
 
+      <Flags>
 
+        <MainUnitHasCreateFormStatements Value="False"/>
 
+        <MainUnitHasTitleStatement Value="False"/>
 
+        <MainUnitHasScaledStatement Value="False"/>
 
+      </Flags>
 
+      <SessionStorage Value="InProjectDir"/>
 
+      <Title Value="wasmdemo"/>
 
+      <UseAppBundle Value="False"/>
 
+      <ResourceType Value="res"/>
 
+    </General>
 
+    <BuildModes>
 
+      <Item Name="Default" Default="True"/>
 
+    </BuildModes>
 
+    <PublishOptions>
 
+      <Version Value="2"/>
 
+      <UseFileFilters Value="True"/>
 
+    </PublishOptions>
 
+    <RunParams>
 
+      <FormatVersion Value="2"/>
 
+    </RunParams>
 
+    <Units>
 
+      <Unit>
 
+        <Filename Value="wasmdemo.lpr"/>
 
+        <IsPartOfProject Value="True"/>
 
+      </Unit>
 
+    </Units>
 
+  </ProjectOptions>
 
+  <CompilerOptions>
 
+    <Version Value="11"/>
 
+    <Target>
 
+      <Filename Value="wasmdemo.wasm"/>
 
+    </Target>
 
+    <SearchPaths>
 
+      <IncludeFiles Value="$(ProjOutDir)"/>
 
+      <UnitOutputDirectory Value="lib/$(TargetCPU)-$(TargetOS)"/>
 
+    </SearchPaths>
 
+    <CodeGeneration>
 
+      <RelocatableUnit Value="True"/>
 
+      <TargetCPU Value="wasm32"/>
 
+      <TargetOS Value="wasi"/>
 
+      <Subtarget Value="browser"/>
 
+    </CodeGeneration>
 
+    <Linking>
 
+      <Debugging>
 
+        <GenerateDebugInfo Value="False"/>
 
+        <UseLineInfoUnit Value="False"/>
 
+      </Debugging>
 
+      <Options>
 
+        <ExecutableType Value="Library"/>
 
+      </Options>
 
+    </Linking>
 
+  </CompilerOptions>
 
+  <Debugging>
 
+    <Exceptions>
 
+      <Item>
 
+        <Name Value="EAbort"/>
 
+      </Item>
 
+      <Item>
 
+        <Name Value="ECodetoolError"/>
 
+      </Item>
 
+      <Item>
 
+        <Name Value="EFOpenError"/>
 
+      </Item>
 
+    </Exceptions>
 
+  </Debugging>
 
+</CONFIG>

+ 46 - 0
demo/wasienv/job/onclick/wasmdemo.lpr
View File 

@@ -0,0 +1,46 @@
 
+library wasmdemo;
 
+
 
+{$mode objfpc}{$H+}
 
+
 
+uses
 
+  Classes,
 
+  job.js,
 
+  job_web;
 
+
 
+Type
 
+
 
+  { TApplication }
 
+
 
+  TApplication = class(TComponent)
 
+    Procedure Run;
 
+  private
 
+    function HandleClick(event: IJSEvent): Variant;
 
+  end;
 
+
 
+{ TApplication }
 
+
 
+procedure TApplication.Run;
 
+
 
+var
 
+  EL : IJSElement;
 
+  HTMLEl : IJSHtmlElement;
 
+
 
+begin
 
+  El:=JSDocument.getelementbyid('btnOK');
 
+  HTMLEl:=TJSHTMLELement.Cast(El);
 
+  HTMLEl.OnClick:=@HandleClick;
 
+end;
 
+
 
+function TApplication.HandleClick(event: IJSEvent): Variant;
 
+begin
 
+  Writeln('Here in webassembly handleclick');
 
+  Result:=UnAssigned;
 
+  JSWindow.alert('You clicked the button.');
 
+end;
 
+
 
+
 
+begin
 
+  With TApplication.Create(nil) do
 
+    Run;
 
+end.
 
+

+ 104 - 0
demo/wasienv/job/onclick/wasmjobhost.lpi
View File 

@@ -0,0 +1,104 @@
 
+<?xml version="1.0" encoding="UTF-8"?>
 
+<CONFIG>
 
+  <ProjectOptions>
 
+    <Version Value="12"/>
 
+    <General>
 
+      <Flags>
 
+        <MainUnitHasCreateFormStatements Value="False"/>
 
+        <MainUnitHasTitleStatement Value="False"/>
 
+        <MainUnitHasScaledStatement Value="False"/>
 
+        <Runnable Value="False"/>
 
+      </Flags>
 
+      <SessionStorage Value="InProjectDir"/>
 
+      <Title Value="BrowserDomTest1"/>
 
+      <UseAppBundle Value="False"/>
 
+      <ResourceType Value="res"/>
 
+    </General>
 
+    <CustomData Count="4">
 
+      <Item0 Name="MaintainHTML" Value="1"/>
 
+      <Item1 Name="Pas2JSProject" Value="1"/>
 
+      <Item2 Name="PasJSLocation" Value="BrowserTixeoDom"/>
 
+      <Item3 Name="PasJSWebBrowserProject" Value="1"/>
 
+    </CustomData>
 
+    <BuildModes>
 
+      <Item Name="Default" Default="True"/>
 
+    </BuildModes>
 
+    <PublishOptions>
 
+      <Version Value="2"/>
 
+      <UseFileFilters Value="True"/>
 
+    </PublishOptions>
 
+    <RunParams>
 
+      <FormatVersion Value="2"/>
 
+    </RunParams>
 
+    <Units>
 
+      <Unit>
 
+        <Filename Value="wasmjobhost.lpr"/>
 
+        <IsPartOfProject Value="True"/>
 
+      </Unit>
 
+      <Unit>
 
+        <Filename Value="index.html"/>
 
+        <IsPartOfProject Value="True"/>
 
+        <CustomData Count="1">
 
+          <Item0 Name="PasJSIsProjectHTMLFile" Value="1"/>
 
+        </CustomData>
 
+      </Unit>
 
+      <Unit>
 
+        <Filename Value="../../../packages/job/job_browser.pp"/>
 
+        <IsPartOfProject Value="True"/>
 
+        <UnitName Value="JOB_Browser"/>
 
+      </Unit>
 
+      <Unit>
 
+        <Filename Value="../../../packages/job/job_shared.pp"/>
 
+        <IsPartOfProject Value="True"/>
 
+        <UnitName Value="JOB_Shared"/>
 
+      </Unit>
 
+    </Units>
 
+  </ProjectOptions>
 
+  <CompilerOptions>
 
+    <Version Value="11"/>
 
+    <Target FileExt=".js">
 
+      <Filename Value="wasmjobhost"/>
 
+    </Target>
 
+    <SearchPaths>
 
+      <IncludeFiles Value="$(ProjOutDir)"/>
 
+      <OtherUnitFiles Value="../../../packages/job"/>
 
+      <UnitOutputDirectory Value="js"/>
 
+    </SearchPaths>
 
+    <Parsing>
 
+      <SyntaxOptions>
 
+        <AllowLabel Value="False"/>
 
+        <UseAnsiStrings Value="False"/>
 
+        <CPPInline Value="False"/>
 
+      </SyntaxOptions>
 
+    </Parsing>
 
+    <CodeGeneration>
 
+      <TargetOS Value="browser"/>
 
+    </CodeGeneration>
 
+    <Linking>
 
+      <Debugging>
 
+        <GenerateDebugInfo Value="False"/>
 
+        <UseLineInfoUnit Value="False"/>
 
+      </Debugging>
 
+    </Linking>
 
+    <Other>
 
+      <CustomOptions Value="-Jeutf-8
 
+-Jirtl.js
 
+-Jc
 
+-Jminclude"/>
 
+      <CompilerPath Value="$(pas2js)"/>
 
+    </Other>
 
+  </CompilerOptions>
 
+  <Debugging>
 
+    <Exceptions>
 
+      <Item>
 
+        <Name Value="EAbort"/>
 
+      </Item>
 
+      <Item>
 
+        <Name Value="ECodetoolError"/>
 
+      </Item>
 
+      <Item>
 
+        <Name Value="EFOpenError"/>
 
+      </Item>
 
+    </Exceptions>
 
+  </Debugging>
 
+</CONFIG>

+ 60 - 0
demo/wasienv/job/onclick/wasmjobhost.lpr
View File 

@@ -0,0 +1,60 @@
 
+program wasmjobhost;
 
+
 
+{$mode objfpc}
 
+
 
+uses
 
+  BrowserConsole, JS, Types, Classes, SysUtils, Web, WasiEnv, WasiHostApp, JOB_Browser, JOB_Shared;
 
+
 
+var
 
+  wasmFilename : string; external name 'wasmFilename';
 
+
 
+
 
+Type
 
+
 
+  { TMyApplication }
 
+
 
+  TMyApplication = class(TBrowserWASIHostApplication)
 
+  Private
 
+    FWADomBridge : TJSObjectBridge;
 
+  Public
 
+    constructor Create(aOwner : TComponent); override;
 
+    procedure DoRun; override;
 
+  end;
 
+
 
+
 
+constructor TMyApplication.Create(aOwner: TComponent);
 
+begin
 
+  inherited Create(aOwner);
 
+  FWADomBridge:=TJSObjectBridge.Create(WasiEnvironment);
 
+  RunEntryFunction:='_initialize';
 
+end;
 
+
 
+procedure TMyApplication.DoRun;
 
+
 
+var
 
+  wasmmodule : string;
 
+
 
+begin
 
+  // Your code here
 
+  Terminate;
 
+  if isString(wasmFilename) then
 
+    WasmModule:=wasmFilename
 
+  else
 
+    begin
 
+    WasmModule:=ParamStr(1);
 
+    if WasmModule='' then
 
+      WasmModule:='demo.wasm';
 
+    end;
 
+
 
+  StartWebAssembly(wasmmodule,true);
 
+end;
 
+
 
+var
 
+  Application : TMyApplication;
 
+begin
 
+  ConsoleStyle:=DefaultCRTConsoleStyle;
 
+  HookConsole;
 
+  Application:=TMyApplication.Create(nil);
 
+  Application.Initialize;
 
+  Application.Run;
 
+end.

Some files were not shown because too many files changed in this diff