mirror of
https://gitlab.com/freepascal.org/fpc/pas2js.git
synced 2025-09-07 12:41:03 +02:00
* ts2pas demo
This commit is contained in:
Michaël Van Canneyt
parent
7ca2845cbd
commit
765bc8506e
1
demo/ts2pas/bulma.min.css
vendored
Normal file
1
demo/ts2pas/bulma.min.css
vendored
Normal file
File diff suppressed because one or more lines are too long
84
demo/ts2pas/convert.lpi
Normal file
84
demo/ts2pas/convert.lpi
Normal file
@ -0,0 +1,84 @@
|
||||
<?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="convert"/>
|
||||
<UseAppBundle Value="False"/>
|
||||
<ResourceType Value="res"/>
|
||||
</General>
|
||||
<CustomData Count="2">
|
||||
<Item0 Name="PasJSPort" Value="0"/>
|
||||
<Item1 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="convert.lpr"/>
|
||||
<IsPartOfProject Value="True"/>
|
||||
</Unit>
|
||||
<Unit>
|
||||
<Filename Value="index.html"/>
|
||||
<IsPartOfProject Value="True"/>
|
||||
</Unit>
|
||||
</Units>
|
||||
</ProjectOptions>
|
||||
<CompilerOptions>
|
||||
<Version Value="11"/>
|
||||
<Target FileExt=".js">
|
||||
<Filename Value="convert"/>
|
||||
</Target>
|
||||
<SearchPaths>
|
||||
<UnitOutputDirectory Value="js"/>
|
||||
</SearchPaths>
|
||||
<Parsing>
|
||||
<SyntaxOptions>
|
||||
<AllowLabel Value="False"/>
|
||||
<CPPInline Value="False"/>
|
||||
<UseAnsiStrings 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>
|
||||
168
demo/ts2pas/convert.lpr
Normal file
168
demo/ts2pas/convert.lpr
Normal file
@ -0,0 +1,168 @@
|
||||
program convert;
|
||||
{$mode objfpc}
|
||||
|
||||
uses typinfo, types, web, js, webwidget, browserapp;
|
||||
|
||||
var
|
||||
dtsfiles : TStringDynArray; external name 'dtsfiles';
|
||||
|
||||
Type
|
||||
|
||||
TConversionOption = (coRaw,coGenericArrays,coUseNativeTypeAliases,coLocalArgumentTypes, coUntypedTuples, coDynamicTuples,
|
||||
coExternalConst,coExpandUnionTypeArgs,coaddOptionsToheader,coInterfaceAsClass,coSkipImportStatements);
|
||||
|
||||
{ TConvertApplication }
|
||||
|
||||
TConvertApplication = class(TBrowserApplication)
|
||||
Private
|
||||
edtFileInput : TJSHTMLInputElement;
|
||||
edtUnitName : TJSHTMLInputElement;
|
||||
btnGo : TJSHTMLButtonElement;
|
||||
edtSource : TJSHTMLTextAreaElement;
|
||||
divMenu : TJSHTMLElement;
|
||||
cbOptions : Array[TConversionOption] of TJSHTMLInputElement;
|
||||
cbPrependLog : TJSHTMLInputElement;
|
||||
function GetQueryOptions: String;
|
||||
Protected
|
||||
Function LogGetElementErrors : Boolean; override;
|
||||
Procedure DoGoClick(aEvent : TJSEvent);
|
||||
Procedure DoAnchorClick(aEvent : TJSEvent);
|
||||
Procedure DoInputChange(aEvent : TJSEvent);
|
||||
Procedure DoInputExit(aEvent : TJSEvent);
|
||||
Procedure DoRun; override;
|
||||
end;
|
||||
|
||||
function TConvertApplication.GetQueryOptions: String;
|
||||
|
||||
Procedure AddToRes(N,V : String);
|
||||
|
||||
begin
|
||||
if V='' then
|
||||
exit;
|
||||
if Result<>'' then
|
||||
Result:=Result+'&';
|
||||
Result:=Result+N+'='+V;
|
||||
end;
|
||||
|
||||
Var
|
||||
T : TConversionOption;
|
||||
|
||||
begin
|
||||
AddToRes('file',edtFileInput.value);
|
||||
AddToRes('unit',edtUnitName.value);
|
||||
if cbPrependLog.Checked then
|
||||
AddToRes('prependlog','1');
|
||||
For T in TConversionoption do
|
||||
if cbOptions[T].checked then
|
||||
AddToRes(cbOptions[T].ID,'1');
|
||||
end;
|
||||
|
||||
function TConvertApplication.LogGetElementErrors: Boolean;
|
||||
begin
|
||||
Result:=true;
|
||||
end;
|
||||
|
||||
procedure TConvertApplication.DoGoClick(aEvent: TJSEvent);
|
||||
|
||||
function haveText(res : JSValue) : JSValue;
|
||||
|
||||
begin
|
||||
edtSource.Value:=String(res);
|
||||
end;
|
||||
|
||||
function DoFetchOK (res : JSValue) : JSValue;
|
||||
|
||||
var
|
||||
Resp : TJSResponse absolute res;
|
||||
|
||||
begin
|
||||
Resp.Text()._then(@HaveText);
|
||||
Result:=True;
|
||||
end;
|
||||
|
||||
begin
|
||||
divMenu.style['display']:='none';
|
||||
window.fetch('convcgi.cgi/convert/?'+GetQueryOptions)._then(@DoFetchOK)
|
||||
end;
|
||||
|
||||
procedure TConvertApplication.DoAnchorClick(aEvent: TJSEvent);
|
||||
|
||||
var
|
||||
a : TJSHTMLAnchorElement;
|
||||
|
||||
begin
|
||||
aEvent.preventDefault();
|
||||
a:=TJSHTMLAnchorElement(aEvent.target);
|
||||
edtFileInput.Value:=a.innertext;
|
||||
divmenu.style['display']:='none';
|
||||
end;
|
||||
|
||||
procedure TConvertApplication.DoInputExit(aEvent: TJSEvent);
|
||||
|
||||
var
|
||||
FE: TJSFocusEvent absolute aEvent;
|
||||
|
||||
begin
|
||||
if (FE.relatedTarget=Nil) or (Pos('dropdown-item',FE.relatedTarget.className)=0) then
|
||||
divmenu.style['display']:= 'none'
|
||||
end;
|
||||
|
||||
procedure TConvertApplication.DoInputChange(aEvent: TJSEvent);
|
||||
|
||||
var
|
||||
inp,S : String;
|
||||
a : TJSHTMLAnchorElement;
|
||||
aCount : Integer;
|
||||
|
||||
begin
|
||||
inp:=edtFileInput.Value;
|
||||
if length(inp)<2 then exit;
|
||||
divMenu.style['display']:='none';
|
||||
divMenu.innerHTML:='<div class="dropdown-content"></div>';
|
||||
aCount:=0;
|
||||
for S in dtsFiles do
|
||||
if Pos(Inp,S)<>0 then
|
||||
begin
|
||||
a:=TJSHTMLAnchorElement(Window.Document.CreateElement('a'));
|
||||
a.className:='dropdown-item';
|
||||
a.href:='#';
|
||||
a.InnerText:=S;
|
||||
a.addEventListener('click',@DoAnchorClick);
|
||||
divMenu.childNodes[0].appendChild(a);
|
||||
Inc(aCount);
|
||||
end;
|
||||
if aCount>0 then
|
||||
divMenu.style['display']:='block';
|
||||
end;
|
||||
|
||||
procedure TConvertApplication.DoRun;
|
||||
|
||||
Var
|
||||
T : TConversionOption;
|
||||
N : String;
|
||||
|
||||
begin
|
||||
edtFileInput:=TJSHTMLInputElement(GetHTMLElement('edtfilename'));
|
||||
edtFileInput.addEventListener('input',@DoInputChange);
|
||||
edtFileInput.addEventListener('focusout',@DoInputexit);
|
||||
edtUnitName:=TJSHTMLInputElement(GetHTMLElement('edtunitname'));
|
||||
btnGo:=TJSHTMLButtonElement(GetHTMLElement('btnGo'));
|
||||
btnGo.AddEventListener('click',@DoGoClick);
|
||||
edtSource:=TJSHTMLTextAreaElement(GetHTMLElement('edtSource'));
|
||||
cbPrependLog:=TJSHTMLInputElement(GetHTMLElement('cbPrependLog'));
|
||||
divMenu:=GetHTMLElement('file-menu');
|
||||
for T in TConversionOption do
|
||||
begin
|
||||
N:=GetEnumName(TypeInfo(TConversionOption),Ord(T));
|
||||
cbOptions[T]:=TJSHTMLInputElement(GetHTMLElement(N));
|
||||
end;
|
||||
end;
|
||||
|
||||
Var
|
||||
Application : TConvertApplication;
|
||||
|
||||
begin
|
||||
Application:= TConvertApplication.Create(Nil);
|
||||
Application.Initialize;
|
||||
Application.Run;
|
||||
end.
|
||||
91
demo/ts2pas/index.html
Normal file
91
demo/ts2pas/index.html
Normal file
@ -0,0 +1,91 @@
|
||||
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>Convert definitelytyped Typescript module to Pascal</title>
|
||||
<link rel="stylesheet" href="bulma.min.css">
|
||||
<script src="convcgi.cgi/list/"></script>
|
||||
<script src="convert.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="section pb-4">
|
||||
<h1 class="title is-3">Convert typescript to Pas2JS import</h1>
|
||||
<div class="dropdown">
|
||||
<div class="dropdown-trigger">
|
||||
<input id="edtfilename" class="input is-info" type="text" placeholder="Enter file name" aria-haspopup="true" aria-controls="file-menu">
|
||||
</div>
|
||||
<button id="btnGo" class="button is-info">Go!</button>
|
||||
<div class="dropdown-menu" id="file-menu" role="menu" />
|
||||
</div>
|
||||
</div>
|
||||
<!-- checkboxes -->
|
||||
<div class="block mt-5">
|
||||
<div class="columns">
|
||||
<label class="column is-one-quarter">
|
||||
Unit name:
|
||||
<input id="edtunitname" class="input is-info" type="text" placeholder="Enter unit name" aria-haspopup="true" aria-controls="file-menu">
|
||||
</label>
|
||||
</div>
|
||||
<div class="columns">
|
||||
<label class="column is-one-quarter checkbox">
|
||||
<input type="checkbox" id="coGenericArrays"> Use generic arrays
|
||||
</label>
|
||||
<label class="column checkbox">
|
||||
<input type="checkbox" id="coUseNativeTypeAliases"> Use native type aliases
|
||||
</label>
|
||||
</div>
|
||||
<div class="columns">
|
||||
<label class="column is-one-quarter checkbox">
|
||||
<input type="checkbox" id="coLocalArgumentTypes"> Create class local argument types
|
||||
</label>
|
||||
<label class="column checkbox">
|
||||
<input type="checkbox" id="coUntypedTuples"> Use untyped tuples
|
||||
</label>
|
||||
</div>
|
||||
<div class="columns">
|
||||
<label class="column is-one-quarter checkbox">
|
||||
<input type="checkbox" id="coDynamicTuples"> Use dynamic tuples
|
||||
</label>
|
||||
<label class="column checkbox">
|
||||
<input type="checkbox" id="coExternalConst"> Use external consts
|
||||
</label>
|
||||
</div>
|
||||
<div class="columns">
|
||||
<label class="column is-one-quarter checkbox">
|
||||
<input type="checkbox" id="coExpandUnionTypeArgs"> Expand union type arguments
|
||||
</label>
|
||||
<label class="column checkbox">
|
||||
<input type="checkbox" id="coaddOptionsToheader"> Add options to header
|
||||
</label>
|
||||
</div>
|
||||
<div class="columns">
|
||||
<label class="column is-one-quarter checkbox">
|
||||
<input type="checkbox" id="coInterfaceAsClass"> Interface as class
|
||||
</label>
|
||||
<label class="column checkbox">
|
||||
<input type="checkbox" id="coSkipImportStatements"> Skip import statements
|
||||
</label>
|
||||
</div>
|
||||
<div class="columns">
|
||||
<label class="column is-one-quarter checkbox">
|
||||
<input type="checkbox" id="coRaw"> Do not generate unit header
|
||||
</label>
|
||||
<label class="column checkbox">
|
||||
<input type="checkbox" id="cbPrependLog"> Prepend conversion log to unit as comment
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <hr> -->
|
||||
<div class="section">
|
||||
<h5 class="title is-5">Output</h5>
|
||||
<textarea id="edtSource" rows=40 cols=132></textarea>
|
||||
</div>
|
||||
<script>
|
||||
rtl.showUncaughtExceptions=true;
|
||||
window.addEventListener("load", rtl.run);
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Reference in New Issue
Block a user