Recent

Author Topic: qxotica tools for qooxdoo Web app development with Lazarus  (Read 13400 times)

Phil

  • Hero Member
  • *****
  • Posts: 2737
qxotica tools for qooxdoo Web app development with Lazarus
« on: October 04, 2012, 12:52:26 am »
Develop both the client and server parts of a mobile Web app using the qooxdoo JavaScript framework and Lazarus.

Documentation is here:

http://web.fastermac.net/~MacPgmr/qxotica/QxoticaStatus.html

To download source, change to where you want to the source files to be placed and enter this:

svn checkout svn://svn.code.sf.net/p/qxotica/code/trunk .

Commented source for the Unicodum demo app is included. Unicodum has a qooxdoo client and a choice of Pascal or PHP server apps. Try it out now to see what's possible with qooxdoo:

http://web.fastermac.net/~MacPgmr/iApps/unicodum/

Note that this is a mobile Web app, although it will work with most desktop browsers too (but not IE). To support all browsers, you would normally develop both a mobile and a desktop client - if there's interest, support for desktop browser clients could be added too.

Let me know if the documentation is not clear enough or if I missed any steps.

Thanks.

-Phil


otorres

  • Jr. Member
  • **
  • Posts: 94
Re: qxotica tools for qooxdoo Web app development with Lazarus
« Reply #1 on: October 06, 2012, 11:31:01 pm »
I wanna try to intefrate with fpWeb, because fpWeb can be a WebServer application or CGI apllication, when make a try, post it here.

regards.

PD. Sorry for my bad english.

Leledumbo

  • Hero Member
  • *****
  • Posts: 8747
  • Programming + Glam Metal + Tae Kwon Do = Me
Re: qxotica tools for qooxdoo Web app development with Lazarus
« Reply #2 on: October 07, 2012, 07:02:47 am »
This follows the tradition of your PHP Toolkit, where it makes Lazarus as an IDE (well, a little) for PHP. The downside of this approach is that we still have to code in another language, namely JavaScript, for the client. It would be better IMHO, if you take ExtPascal approach, where JavaScript is generated on the fly from Pascal code.

Phil

  • Hero Member
  • *****
  • Posts: 2737
Re: qxotica tools for qooxdoo Web app development with Lazarus
« Reply #3 on: October 07, 2012, 05:59:41 pm »
I wanna try to intefrate with fpWeb, because fpWeb can be a WebServer application or CGI apllication, when make a try, post it here.

If by "WebServer application" you mean an app that includes its own Web server, so that it can be run standalone, you should be able to do that with the supplied getunicode.lpr by compiling it with WebServer defined. You'll need one additional file from ExtPascal: IdExtHTTPServer.pas, which of course also requires Indy.

Thanks.

-Phil

Phil

  • Hero Member
  • *****
  • Posts: 2737
Re: qxotica tools for qooxdoo Web app development with Lazarus
« Reply #4 on: October 07, 2012, 07:27:25 pm »
This follows the tradition of your PHP Toolkit, where it makes Lazarus as an IDE (well, a little) for PHP. The downside of this approach is that we still have to code in another language, namely JavaScript, for the client. It would be better IMHO, if you take ExtPascal approach, where JavaScript is generated on the fly from Pascal code.

Good points. Let me see if I can expand on those a bit.

(1) Yes, I borrowed several ideas from PHP Toolkit and ExtPascal, but only the ideas that I thought made sense and could easily be implemented. That is, some integration with Lazarus so developers can at least edit and manage both ends of a Web app in the same IDE, plus the bonus of being able to "compile" the JavaScript client app from the IDE and jump to the file and line of the syntax error.

(2) I also spent a lot of time creating the Unicodum app, and included both the JS client project as well as a choice of backends (Pascal FCGI or PHP). The power of data bindings between the qooxdoo widgets and the backend datastore (JSON, JSON-P, offline, etc.) cannot be overstated - bindings have always been a big deal in the OS X Cocoa world, and they're a big deal in qooxdoo as well.

(3) It's important to keep in mind that qooxdoo is not just a UI framework - it's a complete toolchain, a complete build system. The fact that you have to work with it via JavaScript is not the biggest obstacle in my mind - rather, a desktop-centric point of view is harder to overcome than a mere change in syntax.

(4) Emphasis on mobile. Any development tool that doesn't have its mobile story worked out by now is probably going to be irrelevant.

(5) There's a lot of action in the JavaScript world right now. Ignore JavaScript at your own peril.

Just within the last month, we have CoffeeScript:

http://www.itwriting.com/blog/6543-dropbox-turns-to-coffeescript-to-beat-javascript-syntactic-noise.html

http://coffeescript.org/

And from the creator of both the Delphi and C# languages, we have TypeScript:

http://www.itwriting.com/blog/6630-here-comes-typescript-microsofts-superset-of-javascript.html

http://blogs.msdn.com/b/somasegar/archive/2012/10/01/typescript-javascript-development-at-application-scale.aspx

(6) My current thinking is that Pascal should be limited to the server side part of a Web app. As soon as you introduce Pascal into the client side (for example, by generating the JS that gets sent to the browser), you lose the ability to create client-only Web apps or convert a qooxdoo app into a native PhoneGap app.

Another problem with Pascal and Web apps is that unless you have your own server on the Web or a Virtual Private Server (VPS), you will probably not be able to deploy a compiled Pascal app. My fastermac server is just like most shared servers: PHP is provided, but no compiled binaries are permitted.

(7) Is there some other place where Pascal could be used? If so, I would like to hear about ideas.

Thanks.

-Phil


snorkel

  • Hero Member
  • *****
  • Posts: 817
Re: qxotica tools for qooxdoo Web app development with Lazarus
« Reply #5 on: November 19, 2012, 08:10:57 am »
Hi Phil,
qooxdoo looks pretty cool.

have you seen this:

http://code.google.com/p/jsqt/

Would it be possible to do something like this with lazarus? Use the Lazarus Designer and have some middle layer convert the LFM file like they are converting the output of the QT designer?
***Snorkel***
If I forget, I always use the latest stable 32bit version of Lazarus and FPC. At the time of this signature that is Laz 3.0RC2 and FPC 3.2.2
OS: Windows 10 64 bit

marcov

  • Administrator
  • Hero Member
  • *
  • Posts: 11383
  • FPC developer.
Re: qxotica tools for qooxdoo Web app development with Lazarus
« Reply #6 on: November 19, 2012, 10:24:22 am »
Phil: I think Leledumbo means using javascript strictly as backend language for the client. So the client code is javascript, but generated and considered not editable.  (at least not as part of the normal workflow).

 

Phil

  • Hero Member
  • *****
  • Posts: 2737
Re: qxotica tools for qooxdoo Web app development with Lazarus
« Reply #7 on: November 19, 2012, 06:55:31 pm »
Phil: I think Leledumbo means using javascript strictly as backend language for the client. So the client code is javascript, but generated and considered not editable.  (at least not as part of the normal workflow).

See point 6 in my answer above.

Thanks.

-Phil

Phil

  • Hero Member
  • *****
  • Posts: 2737
Re: qxotica tools for qooxdoo Web app development with Lazarus
« Reply #8 on: November 19, 2012, 07:07:35 pm »
http://code.google.com/p/jsqt/

Would it be possible to do something like this with lazarus? Use the Lazarus Designer and have some middle layer convert the LFM file like they are converting the output of the QT designer?

I did look at that before I started and it looked abandoned. In any case, the converter included with ExtPascal is already far ahead of the jsqt converter.

http://code.google.com/p/extpascal/

The Lazarus form designer always creates a .pas file for every .lfm file you create. If it were a generic designer, using it for JavaScript widgets (or iOS Cocoa Touch controls or Android Java widgets) might make sense. But it's not that kind of designer - look at the property editors - they all assume Pascal, FPC and LCL runtime, etc. A qooxdoo client app is JS, not Pascal.

The only JS client designer I've seen that actually works well is Apple's Dashcode:

http://dl.dropbox.com/u/28343282/MacXPlatform/MacXPlatform_Part9.html

Dashcode attempts to address some of the issues of designing a mobile Web app JS client:

(1) Phone-sized pages often don't have much on them - maybe a list and a standard title bar with a standard back button. A designer might be overkill here.

(2) Widget visual appearance is set via CSS styles, not by setting individual properties.

(3) A widget's content is usually not set programmatically (nor at "design" time). Rather, a widget's data is supplied by a data binding to a data store that is populated asynchronously.

(4) Widget positioning is also done via CSS. CSS has 5 types of positioning. The default is "document flow" ("static" in CSS). Widgets expand and contract at runtime to accommodate content and browser window dimensions. For example, a qooxdoo "list" is not a box that you draw on the screen that has a scroll bar - rather, it's like an iOS UITableView, with optional sections and section titles, filing up the page and scrolled by touch.

(5) Rendering a page in a designer is harder to do when document flow, touch look and feel, and data binding are involved. Easier just to click Reload on your external browser and run the app.

Web UI frameworks are all written in JavaScript and all documentation will be in terms of JS. Just use JS for the client. Stock JS is used less and less. For example, qooxdoo adds interfaces, "mixins", typed properties, private and protected class members, etc.

Writing a proper mobile Web app (or mobile native app) involves unlearning the LCL / VCL. While it's possible to think of a qooxdoo page as being analogous to a "form", pages are not used like dialogs. Rather, they're displayed ala iOS, typically by selecting a "disclosure" item in a list or by touching a standard title bar back button - not by popping up the page like a dialog or "closing" the page by choosing OK or Cancel. A mobile app is not just a "little" LCL / VCL app.

Thanks.

-Phil

Phil

  • Hero Member
  • *****
  • Posts: 2737
Re: qxotica tools for qooxdoo Web app development with Lazarus
« Reply #9 on: November 22, 2012, 02:12:47 am »
The latest qooxdoo 2.1 has some interesting new features - see Mobile section here:

http://news.qooxdoo.org/qooxdoo-2-1-released

Example: The new Carousel component, very similar to iOS UIPageControl:

http://demo.qooxdoo.org/current/mobileshowcase/index.html#%2Fcarousel

Thanks.

-Phil
« Last Edit: November 24, 2012, 05:51:54 am by Phil »

Phil

  • Hero Member
  • *****
  • Posts: 2737
Re: qxotica tools for qooxdoo Web app development with Lazarus
« Reply #10 on: November 24, 2012, 05:57:18 am »
Would it be possible to do something like this with lazarus? Use the Lazarus Designer and have some middle layer convert the LFM file like they are converting the output of the QT designer?

If you do decide to write a converter for .lfm files, you might look at this:

http://code.google.com/p/qookery/

Qookery appears to be just a wrapper around standard qooxdoo components, but allows "forms" to be loaded in from XML files. The XSD file for these XML forms' components is here:

http://code.google.com/p/qookery/source/browse/trunk/qookery/docs/form.xsd

This XML might be easier to target than the mix of JavaScript code and CSS attributes that you normally set for qooxdoo components.

See the examples:

http://www.qookery.org/content/waffle/qookerydemo/index.html

The demo source indicates that it's pretty much a normal qooxdoo app:

http://code.google.com/p/qookery/source/browse/#svn%2Ftrunk%2Fqookerydemo

Thanks.

-Phil

 

TinyPortal © 2005-2018