Sign in Join

Live chat for Free Pascal, Lazarus, Delphi and every Pascal programmer.

Mailing lists / pas2js / 2019-08

missing definitions

6 messages · 2 people · –

Reply by email Subscribe to this list Your subscription

Read-only archive. Use j and k to move between messages.

warleyalex

I remember I had to include some missing definitions at the external classses (JS unit) to compile my test project.

-------------------
{ TJSObject }

  TJSObject = class external name 'Object'
  public
  (..)
    class function values(const obj: JSValue): TJSObject; external name
'values';
  end;
-------------------
  TJSArrayEventProc = reference to procedure(element : JSValue; index:
NativeInt; anArray : TJSArray);
  { TJSIteratorValue }
  TJSIteratorValue = class external name 'IteratorValue'
  public
    value : JSValue; external name 'value';
    done : boolean; external name 'done';
  end;
  { TJSIterator }
  TJSIterator = class external name 'Iterator'
  Public
    function next: TJSIteratorValue;
  end;
  TJSSet = class;
  type
    TJSMapFunctionCallBack = reference  to function(arg : JSValue): JSValue;
    TJSMapProcCallBack = reference  to procedure(value: JSValue; key:
JSValue);
    TJSSetyEventProc = reference to procedure(value : JSValue; key:
NativeInt; &set: TJSSet);
    TJSSetProcCallBack = reference  to procedure(value: JSValue; key:
JSValue);
  { TJSSet }
  TJSSet = class external name 'Set'
  public
    constructor new; overload;
    constructor new(aElement1 : JSValue); varargs; overload;
    function add(value: JSValue): TJSSet;
    function has(value: JSValue): Boolean;
    function delete(value: JSValue): Boolean;
    function size: Integer; external name 'size.valueOf';
    procedure clear;
    function values: TJSIterator;
    procedure forEach(const aCallBack: TJSSetyEventProc); overload;
    procedure forEach(const aCallBack: TJSSetProcCallBack); overload;
    procedure forEach(const aCallBack: TJSSetyEventProc; thisArg: JSValue);
overload;
    function entries: TJSIterator;
    function keys: TJSIterator;
  end;
  { TJSMap }
  TJSMap = class external name 'Map'
  public
    constructor new; varargs; overload;
    constructor new(aElement1 : JSValue); varargs; overload;
    function &set(key: JSValue; value: JSValue) :TJSMap;
    function get(key : JSValue): JSValue;
    function has(key: JSValue): Boolean;
    function delete(key: JSValue): Boolean;
    procedure clear;
    function entries: TJSIterator;
    procedure forEach(const aCallBack: TJSMapFunctionCallBack); overload;
    procedure forEach(const aCallBack: TJSMapFunctionCallBack; thisArg:
JSValue); overload;
    procedure forEach(const aCallBack: TJSMapProcCallBack); overload;
    function keys: TJSIterator;
    function values: TJSIterator;
    function size: Integer; external name 'size.valueOf';
  end;
  { TJSArray }
  TJSArray = Class external name 'Array'
  public
  (...)
   //ES2015
    class function from(arrayLike : JSValue) : TJSArray; overload;
    class function from(arrayLike : JSValue; mapFunction :
TJSMapFunctionCallBack): TJSArray; overload;
    class function from(arrayLike : JSValue; mapFunction :
TJSMapFunctionCallBack; thisArg : JSValue): TJSArray; overload;
    function entries: TJSIterator;
    procedure forEach(const aCallBack : TJSArrayEventProc); overload;
    function keys: TJSIterator;
    Function map(const aCallBack : TJSArrayMapEventArray) : JSValue;
overload;
    function values: TJSIterator;
  end;

-------------------
TJSTypedArray = class external name 'TypedArray' (TJSBufferSource)

  Public
  (...)
    //class var BYTES_PER_ELEMENT : NativeInt;  // I think it is not a class

var definition

    BYTES_PER_ELEMENT : NativeInt;                 // this works for me
  end;

-------------------

  TJSInt8Array = class external name 'Int8Array' (TJSTypedArray)
  public
    constructor new; // new in ES2017
    constructor new (buffer : TJSValueDynArray);
    (...)
    class function _of(aValue : TJSValueDynArray) : TJSInt8Array; varargs;
external name 'of'; reintroduce;
    function subarray(aBegin, aEnd: Integer): TJSInt8Array; external name
'subarray'; overload;
    function subarray(aBegin: Integer): TJSInt8Array; external name
'subarray'; overload;
  end;
-------------------
and the same, a slight modification for the method subarray (return type)
for the TJSUint8Array | TJSUint8ClampedArray | TJSInt16Array |
TJSUint16Array | TJSInt32Array | TJSUint32Array | TJSFloat32Array |
TJSFloat64Array
-------------------

Reply by email

Michael Van Canneyt
to warleyalex

Thank you !

I added all of them except 1, revision 582.

The read-only properties I added using the usual method instead of your function trick.

Show quoted text 6 lines
TJSArray = Class external name 'Array' public Function map(const aCallBack : TJSArrayMapEventArray) : JSValue; overload;

This one I didn't add, because you didn't include the TJSArrayMapEventArray definition.

Michael.

Reply by email

warleyalex
to Michael Van Canneyt
TJSArrayMapEventArray = reference to function (element : TJSValueDynArray;
index: NativeInt; anArray : TJSArray) : JSValue;
Function map(const aCallBack : TJSArrayMapEventArray) : JSValue; overload;
-----------------------------------
{test case}
var
  nameLengths: JSValue;
  JavaTpoint: array of JSValue;
begin
JavaTpoint := ['JavaTpoint','C','C++','RDBMS'];
 nameLengths := TJSArray(JavaTpoint).map(
             function (element: {JSValue}TJSValueDynArray; index: NativeInt;
anArray : TJSArray) : JSValue
              begin
                Result := TJSArray(element).length;  //
             end);
nameLengths;   // expected output:  [10, 1, 3, 5]
-----------------------------------

Reply by email

Michael Van Canneyt
to warleyalex

What is the point of this definition ?

You can perfectly do this with the existing TJSArrayMapCallBack. JSValue is a string.

uses js;
var
   nameLengths: JSValue;
   JavaTpoint: array of JSValue;
begin
   JavaTpoint := ['JavaTpoint','C','C++','RDBMS'];
   nameLengths := TJSArray(JavaTpoint).map(
              function (element: JSValue; index: NativeInt; anArray : TJSArray) : JSValue
               begin
                 asm
                   console.log(typeof(element));
                 end;
                 Result := Length(String(element));  //
              end);
   writeln(nameLengths);
end.
outputs

home:~/pas2js/packages/rtl> nodejs ta.js
string
string
string
string
10,1,3,5

Michael.

warleyalex wrote 32 lines
TJSArrayMapEventArray = reference to function (element : TJSValueDynArray; index: NativeInt; anArray : TJSArray) : JSValue; Function map(const aCallBack : TJSArrayMapEventArray) : JSValue; overload; ----------------------------------- {test case} var nameLengths: JSValue; JavaTpoint: array of JSValue; begin JavaTpoint := ['JavaTpoint','C','C++','RDBMS']; nameLengths := TJSArray(JavaTpoint).map( function (element: {JSValue}TJSValueDynArray; index: NativeInt; anArray : TJSArray) : JSValue begin Result := TJSArray(element).length; // end); nameLengths; // expected output: [10, 1, 3, 5] ----------------------------------- -- Sent from: http://pas2js.38893.n8.nabble.com/ _______________________________________________ Pas2js maillist - https://lists.freepascal.org/cgi-bin/mailman/listinfo/pas2js

Reply by email

warleyalex
to Michael Van Canneyt
// Test case

(* Inject some Google fonts via: http://www.google.com/fonts/ The fonts are hosted at Google and you link them in the HTML header. Then, you can use them freely in CSS
*)

procedure InjectFontLink(const url: string);
var
  el: TJSHTMLLinkElement;
begin
  el :=
TJSHTMLLinkElement(TJSHTMLElement(window.document.createElement('link')));
  el.rel := 'stylesheet';
  el._type := 'text/css';
  el.href := url;
TJSHTMLElement(window.document.getElementsByTagName('head')[0]).appendChild(el);
end;
InjectFontLink('https://fonts.googleapis.com/css?family=Rancho&effect=shadow-multiple');

(...)
then in you HTML

<div class="font-effect-shadow-multiple">This is a font effect!<div> -----
There is a minor type at the 'HTMLScriptElement' definition >> type_ : String; anyway.

type
  TJSHTMLScriptElement = class external name
'HTMLScriptElement'(TJSHTMLElement)
  private
    fsrc: string; external name 'src';
    ftype: string; external name 'type';
    fnoModule: boolean; external name 'noModule';
    fasync: boolean; external name 'async';
    fdefer: boolean; external name 'defer';
    fcrossOrigin: string; external name 'crossOrigin';
    ftext: string; external name 'text';
    fcharset: string; external name 'charset';
    fintegrity: string; external name 'integrity';
    freferrerPolicy: string; external name 'referrerPolicy';
  public
    property src: string read fsrc write fsrc;
    property _type: string read ftype write ftype;
    property noModule: boolean read fnoModule write fnoModule;
    property async: boolean read fasync write fasync;
    property defer: boolean read fdefer write fdefer;
    property crossOrigin: string read fcrossOrigin write fcrossOrigin;
    property text: string read ftext write ftext;
    property charset: string read fcharset write fcharset;
    property integrity: string read fintegrity write fintegrity;
    property referrerPolicy: string read freferrerPolicy write
freferrerPolicy;
  end;
  {A DOMSettableTokenList object is equivalent to a DOMTokenList object
without
  an associated attribute.}
type
  TJSDOMSettableTokenList = class external name 'DOMSettableTokenList'
(TJSDOMTokenList)
  private
    fvalue: TJSDOMString; external name 'value';
  public
    property value: TJSDOMString read fvalue; // readonly
  end;
type
  TJSHTMLLinkElement = class external name 'HTMLLinkElement'(TJSHTMLElement)
  private
    fhref: string; external name 'href';
    fcrossOrigin: string; external name 'crossOrigin';
    frel: string; external name 'rel';
    fas: string; external name 'as';
    fmedia: string; external name 'media';
    fintegrity: string; external name 'integrity';
    fhreflang: string; external name 'hreflang';
    ftype: string; external name 'type';
    fimageSrcset: string; external name 'imageSrcset';
    fimageSizes: string; external name 'imageSizes';
    freferrerPolicy: string; external name 'referrerPolicy';
    fdisabled: string; external name 'disabled';
    frelList: TJSDOMTokenList; external name 'relList';
    fsizes: TJSDOMSettableTokenList{TJSDOMTokenList}; external name 'sizes';
    fcharset: string; external name 'charset'; // obsolete property
    frev: string; external name 'rev'; // obsolete property
    ftarget: string; external name 'target'; // obsolete property
  public
    property href: string read fhref write fhref;
    property crossOrigin: string read fcrossOrigin write fcrossOrigin;
    property rel: string read frel write frel;
    property _as: string read fas write fas;
    property media: string read fmedia write fmedia;
    property integrity: string read fintegrity write fintegrity;
    property hreflang: string read fhreflang write fhreflang;
    property _type: string read ftype write ftype;
    property imageSrcset: string read fimageSrcset write fimageSrcset;
    property imageSizes: string read fimageSizes write fimageSizes;
    property referrerPolicy: string read freferrerPolicy write
freferrerPolicy;
    property disabled: string read fdisabled write fdisabled;
    property relList: TJSDOMTokenList read frelList;
    property sizes: TJSDOMSettableTokenList{TJSDOMTokenList} read fsizes;
    property charset: string read fcharset write fcharset; // obsolete
property
    property rev: string read frev write frev; // obsolete property
    property target: string read ftarget write ftarget; // obsolete property
  end;

Reply by email

Michael Van Canneyt
to warleyalex

Hello,

Added the missing fields/class, thank you !

Small tip:

When properties are read/write, you can declare them as fields of a class.

Only when a property is read-only you must declare it as a property:

property name : type read fname;

When you need to rename it, a field is also sufficient:

as_: string; external name 'as';

Michael.

warleyalex wrote 122 lines
// Test case (* Inject some Google fonts via: http://www.google.com/fonts/ The fonts are hosted at Google and you link them in the HTML header. Then, you can use them freely in CSS *) procedure InjectFontLink(const url: string); var el: TJSHTMLLinkElement; begin el := TJSHTMLLinkElement(TJSHTMLElement(window.document.createElement('link'))); el.rel := 'stylesheet'; el._type := 'text/css'; el.href := url; TJSHTMLElement(window.document.getElementsByTagName('head')[0]).appendChild(el); end; InjectFontLink('https://fonts.googleapis.com/css?family=Rancho&effect=shadow-multiple'); (...) then in you HTML <div class="font-effect-shadow-multiple">This is a font effect!<div> ----- There is a minor type at the 'HTMLScriptElement' definition >> type_ : String; anyway. type TJSHTMLScriptElement = class external name 'HTMLScriptElement'(TJSHTMLElement) private fsrc: string; external name 'src'; ftype: string; external name 'type'; fnoModule: boolean; external name 'noModule'; fasync: boolean; external name 'async'; fdefer: boolean; external name 'defer'; fcrossOrigin: string; external name 'crossOrigin'; ftext: string; external name 'text'; fcharset: string; external name 'charset'; fintegrity: string; external name 'integrity'; freferrerPolicy: string; external name 'referrerPolicy'; public property src: string read fsrc write fsrc; property _type: string read ftype write ftype; property noModule: boolean read fnoModule write fnoModule; property async: boolean read fasync write fasync; property defer: boolean read fdefer write fdefer; property crossOrigin: string read fcrossOrigin write fcrossOrigin; property text: string read ftext write ftext; property charset: string read fcharset write fcharset; property integrity: string read fintegrity write fintegrity; property referrerPolicy: string read freferrerPolicy write freferrerPolicy; end; {A DOMSettableTokenList object is equivalent to a DOMTokenList object without an associated attribute.} type TJSDOMSettableTokenList = class external name 'DOMSettableTokenList' (TJSDOMTokenList) private fvalue: TJSDOMString; external name 'value'; public property value: TJSDOMString read fvalue; // readonly end; type TJSHTMLLinkElement = class external name 'HTMLLinkElement'(TJSHTMLElement) private fhref: string; external name 'href'; fcrossOrigin: string; external name 'crossOrigin'; frel: string; external name 'rel'; fas: string; external name 'as'; fmedia: string; external name 'media'; fintegrity: string; external name 'integrity'; fhreflang: string; external name 'hreflang'; ftype: string; external name 'type'; fimageSrcset: string; external name 'imageSrcset'; fimageSizes: string; external name 'imageSizes'; freferrerPolicy: string; external name 'referrerPolicy'; fdisabled: string; external name 'disabled'; frelList: TJSDOMTokenList; external name 'relList'; fsizes: TJSDOMSettableTokenList{TJSDOMTokenList}; external name 'sizes'; fcharset: string; external name 'charset'; // obsolete property frev: string; external name 'rev'; // obsolete property ftarget: string; external name 'target'; // obsolete property public property href: string read fhref write fhref; property crossOrigin: string read fcrossOrigin write fcrossOrigin; property rel: string read frel write frel; property _as: string read fas write fas; property media: string read fmedia write fmedia; property integrity: string read fintegrity write fintegrity; property hreflang: string read fhreflang write fhreflang; property _type: string read ftype write ftype; property imageSrcset: string read fimageSrcset write fimageSrcset; property imageSizes: string read fimageSizes write fimageSizes; property referrerPolicy: string read freferrerPolicy write freferrerPolicy; property disabled: string read fdisabled write fdisabled; property relList: TJSDOMTokenList read frelList; property sizes: TJSDOMSettableTokenList{TJSDOMTokenList} read fsizes; property charset: string read fcharset write fcharset; // obsolete property property rev: string read frev write frev; // obsolete property property target: string read ftarget write ftarget; // obsolete property end; -- Sent from: http://pas2js.38893.n8.nabble.com/ _______________________________________________ Pas2js maillist - https://lists.freepascal.org/cgi-bin/mailman/listinfo/pas2js

Reply by email