From: Pas2js on behalf of Sent: Tuesday, April 28, 2020 6:00 AM To: Subject: Pas2js Digest, Vol 26, Issue 5 Send Pas2js mailing list submissions to To subscribe or unsubscribe via the World Wide Web, visit https://lists.freepascal.org/cgi-bin/mailman/listinfo/pas2js or, via email, send a message with subject or body 'help' to You can reach the person managing the list at When replying, please edit your Subject line so it is more specific than "Re: Contents of Pas2js digest..." Today's Topics: 1. ui framework help with pas2js (mister highball) 2. Re: ui framework help with pas2js (Michael Van Canneyt) 3. Re: ui framework help with pas2js (Mattias Gaertner) ---------------------------------------------------------------------- Message: 1 Date: Tue, 28 Apr 2020 03:43:51 +0000 From: mister highball To: Pas2js Subject: [Pas2js] ui framework help with pas2js Message-ID: Content-Type: text/plain; charset="iso-8859-1" Hello! This is my first post to this mailing list, and just wanted to start out saying that I've been very much impressed using pas2js so far. I've been following the development for quite some time now, but I've just actually started to try and use the compiler. I've been working on a UI framework since this seems to be something the community could use. Here's the repo (it's in the infant stage) https://github.com/mr-highball/nyx The idea is to build the UI fluently in code, rather than rely on a traditional form editor. While there are some downsides, I believe the upsides are there too (UI changes can be checked in to git/diff'd, easy to see how things are hooked up, etc...). Additionally, I'm building the framework to allow the same code to be used to produce browser apps as well as desktop apps. Because of this I rely heavy on interfaces and creation of objects via factories. Now... here's my problem I have this code which is the most basic example I could come up with to debug my library (adding a button) https://github.com/mr-highball/nyx/blob/master/test/nyx_browser_test.lpr ``` var UI : INyxUI; procedure BuildUI; var I : Integer; LContainer: INyxContainer; begin UI := NewNyxUI; LContainer := NewNyxContainer; //** Here's the issue ** //setup the ui with the demo ui components UI .AddContainer(LContainer, I) //add a container .ContainerByIndex(I) .Add(NewNyxButton) .Container .UI .Render(); end; ``` Rather than returning my interface on that line (the one above works just fine, and constructs the UI object the same way), an exception gets thrown and leads me to rtl.js (line:687) which looks like this (latest version being used 1.4.20) ``` for (var id in this){ if (this.hasOwnProperty(id)){ //console.log('rtl.intfRefs.free: id='+id+' '+this[id].$name+' $o='+this[id].$o.$classname); this[id]._Release(); ``` and throws, (Uncaught TypeError: Cannot read property '_Release' of null) This easily could be an issue with my code, but in this case it seems like my reference is getting immediately freed after creation and am having a hard time seeing why. I am debugging in the browser (chrome variant) but still having a hard time spotting the issue. I'm going to continue debugging this to see if I can gain some headway, but just didn't know if there were any known issues with * interface reference counting * object creation via metaclasses Any insight would be appreciated! Anyways, keep up the good work, and I'll be sure to post updates on the library when I have them -Highball -------------- next part -------------- An HTML attachment was scrubbed... URL: <http://lists.freepascal.org/pipermail/pas2js/attachments/20200428/b4479143/attachment.htm> ------------------------------ Message: 2 Date: Tue, 28 Apr 2020 08:35:05 +0200 (CEST) From: Michael Van Canneyt To: pas2js discussions Subject: Re: [Pas2js] ui framework help with pas2js Message-ID: <alpine.DEB.2.21.2004280823000.16917 at home> Content-Type: text/plain; charset=US-ASCII; format=flowed On Tue, 28 Apr 2020, mister highball wrote: > Hello! > This is my first post to this mailing list, and just wanted to start out saying that I've been very much impressed using pas2js so far. I've been following the development for quite some time now, but I've just actually started to try and use the compiler. > I've been working on a UI framework since this seems to be something the community could use. > > Here's the repo (it's in the infant stage) > https://github.com/mr-highball/nyx > > The idea is to build the UI fluently in code, rather than rely on a traditional form editor. While there are some downsides, I believe the upsides are there too (UI changes can be checked in to git/diff'd, easy to see how things are hooked up, etc...). > Additionally, I'm building the framework to allow the same code to be used to produce browser apps as well as desktop apps. Because of this I rely heavy on interfaces and creation of objects via factories. A tip: TNyxElementCallback = procedure(const AElement : INyxElement); TNyxElementNestedCallback = procedure(const AElement : INyxElement) is nested; TNyxElementMethod = procedure(const AElement : INyxElement) of object; Can be replaced by TNyxElementCallback = reference to procedure(const AElement : INyxElement); You don't need the 3 different types. It will simplify your code a lot. > > Now... here's my problem > > I have this code which is the most basic example I could come up with to debug my library (adding a button) > https://github.com/mr-highball/nyx/blob/master/test/nyx_browser_test.lpr > > ``` > var > UI : INyxUI; > > procedure BuildUI; > var > I : Integer; > LContainer: INyxContainer; > begin > UI := NewNyxUI; > LContainer := NewNyxContainer; //** Here's the issue ** > > //setup the ui with the demo ui components > UI > .AddContainer(LContainer, I) //add a container > .ContainerByIndex(I) > .Add(NewNyxButton) > .Container > .UI > .Render(); > end; ``` > Rather than returning my interface on that line (the one above > works just fine, and constructs the UI object the same way), an exception > gets thrown and leads me to rtl.js (line:687) which looks like this > (latest version being used 1.4.20) > > ``` > for (var id in this){ > if (this.hasOwnProperty(id)){ > //console.log('rtl.intfRefs.free: id='+id+' '+this[id].$name+' $o='+this[id].$o.$classname); > this[id]._Release(); > ``` > and throws, (Uncaught TypeError: Cannot read property '_Release' of null) > > This easily could be an issue with my code, but in this case it seems like > my reference is getting immediately freed after creation and am having a > hard time seeing why. Since your're using interfaces: Reference counting issue, most likely. > I am debugging in the browser (chrome variant) but > still having a hard time spotting the issue. I'm going to continue > debugging this to see if I can gain some headway, but just didn't know if > there were any known issues with > > * interface reference counting > * object creation via metaclasses Both should work OK, bugs excepted of course. I personally don't use interfaces, but others do and we haven't received any bugrepors. (which doesn't necessarily mean there are no bugs, of course) By contrast I use metaclasses a lot and have not yet seen any errors. Michael.. ------------------------------ Message: 3 Date: Tue, 28 Apr 2020 09:57:00 +0200 From: Mattias Gaertner To: Subject: Re: [Pas2js] ui framework help with pas2js Message-ID: Content-Type: text/plain; charset=US-ASCII On Tue, 28 Apr 2020 08:35:05 +0200 (CEST) Michael Van Canneyt wrote: >[...] > > * interface reference counting > > * object creation via metaclasses > > Both should work OK, bugs excepted of course. I personally don't use > interfaces, but others do and we haven't received any bugrepors. > (which doesn't necessarily mean there are no bugs, of course) > > By contrast I use metaclasses a lot and have not yet seen any errors. In other words: Please create a bug report with a small example to demonstrate the bug. Mattias ------------------------------ Subject: Digest Footer