Smart Mobile Studio Compiler Is Now Free

Giving back to the community

Updated: This news caused so much traffic that the main Smart Mobile Studio server went down. We are working on getting it back up again as quickly as possible.

Yes you read right. The Smart Mobile Studio command-line compiler is about to be released as free to use by everyone. For a quick presentation of Smart Mobile Studio (other than the main website linked above) you can click here.

One extremely important distinction: Only the command-line compiler is released as free to use, the RTL (source libraries), toolkit and IDE remains a commercial product.

After all, Smart Mobile Studio is a massive undertaking and it costs money to deliver such a system. The development of Smart Mobile Studio have helped finance the further development of DWScript and several critical fixes to SynEdit – so supporting this product is well worth every penny!

So why is this cool?

It means that you can use the most advanced object pascal to JavaScript compiler in the world freely in your own projects.

It means that you can automate object pascal to JavaScript compilation on your web server (which is really cool) to create awesome adaptive projects (code that changes according to user input, perfect for heavy-duty security or multi-player games). You can in fact remote-compile and run projects in the browser. What about a “delphi for the web” where people can actually work online and compile directly in the browser? Then use phonegap/cordova to compile directly to native ? Nothing is impossible.

And it means that the Delphi community finally have a proper HTML5 development tool. After all, HTML5 builder from Embarcadero was just a re-hashing of php-builder which was before that called “Delphi for PHP”. A product which sadly provide absolutely no source to source compilation at all.

Well, now the community can enjoy exactly that.

Is it any good?

Yes. It is the best object pascal source-level compiler on the marked, and most notably the only compiler that processes around 90% of the Delphi syntax and correctly reproduces it in JavaScript. It actually sculpts a VMT (virtual method table) in JavaScript in order to deliver this. Which is no small achievement.

• Classes
• Polymorphism
• Inheritance
• Interfaces
• Virtual, abstract and static members
• Class functions and procedures
• Class variables
• Anonymous procedures and functions
• Private, protected, public and published members
• Var parameters
• Class, record and type helpers

Smart Pascal (our flavor of object pascal) also has features not yet supported by Embarcadero Delphi:

• Partial classes
• Lambdas
• Property expressions
• In place number operators
• In place array operators

Without the RTL, what’s the point?

The possibilities are endless. For instance, you could easily write a game that only uses a minimalistic RTL that you write yourself (we must remember that this is HTML5 and you have full access to the DOM, which is the operative system in this case). In fact, this is what the “other” JS compiler-vendors out there do. Most of them come with 40+ commands for graphics and general key/mouse/touch handling.

Compare that to the several hundred classes and thousands of functions you get when you buy Smart Mobile Studio (!)

But you can easily use the command-line compiler to create awesome products:

• Teach Pascal by running the compiler via a web server.
  You can now compile and execute object pascal in the browser quite easily!
• Write a simple webGL wrapper or canvas wrapper and create your own games (!)
• Automate server-side code, make nodeJS work for you – not the other way around!
• Use Delphi to write a nice utility for website effects (flash replacement), then use the compiler to generate the JS
• Teach kids to program, you now have a compiler and kids needs simple programs (so the RTL is overkill)
• Use your imagination, the possibilities are endless ..

But the most important time-saving feature (and time being money) is: you can write object pascal and target a language that has absolutely no concept of classes or objects at all. What you can achieve with our compiler in 3 days — equals 3 weeks in native JavaScript. And what you do in 3 months with Smart Pascal – is like 3 years if hand-writing java script. And you still would be nowhere near the quality of code that our compiler produces.

And I might add, you get more power in this single executable, than all of Embarcadero HTML5 Builder combined. This is what Embarcadero should have delivered but failed to do. So there.

I will be blogging a course in how to use it properly over the next weeks.

Also be sure to get the smart pascal book, it will save you a lot of time!

Hello world

No language is complete without a “hello world” example, so here is the classical introduction:

program HelloWorld;

procedure writeln(const aMessage:String);
begin
  asm
    console.log(@aMessage);
  end;
end;

Begin
  writeln('Hello world!);
end.

As you can see from the code we access the DOM (document object model) and JavaScript engine directly via an ASM section. In this case we simply call the stdout.

Having compiled this, you can run it either in the browser with the javascript console visible, or using nodeJS from the command-line like this:

node helloworld.js

And the output is as expected 🙂

A bit more advanced

Let’s do something a bit more fun. Note: you would never have to do this in Smart Mobile Studio, there everything is taken care of by distinctly organized classes and all the low-level stuff is dealt with by the VJL (visual javascript library). Just like in Delphi you have great depth in how you can program. You can chose to write low-level code or stick to the high level classes.

But since an RTL is not available here, we have to do some extra ground-work to get started. Let’s see how to isolate some core functions:

program myFirstHTML5Program;

type
THandle = variant; 

//Creates a HTML element by code
function makeHTMLElement(const aTypeId:String):THandle;
begin
  asm
    @Result = document.createElement(@aTypeId);
  end;
end;

//Destroys a HTML element by code
Procedure killHtmlElement(const aHandle:THandle);
begin
  asm
    window.document.body.removeChild(@aHandle);
  end;
end;

//Display a message
procedure showmessage(const aMessage:String);
begin
  asm
    alert(@aMessage);
  end;
end;

Procedure setupMyApp;
var
  mButton: THandle;
Begin
 mButton:=makeHTMLElement('button');
 mButton.style.width  := "80px";
 mbutton.style.height := "28px";
 mButton.text := "Click me";
 mButton.onClick:=procedure ()
  begin
    showmessage('You clicked me!');
    killHtmlElement(mButton);
  end;
end;

begin
  setupMyApp;
end.

Which neatly compiles to:

function setupMyApp() {
   var mButton=undefined;
   mButton=makeHTMLElement("button");
   mButton.style.width="80px";
   mButton.style.height="28px";
   mButton.text="Click me";
   mButton.onClick=function () {
      showmessage("You clicked me!");
      killHtmlElement(mButton);
   };
};
function showmessage(aMessage) {
    alert(aMessage);
  };
function killHtmlElement(aHandle$1) {
    window.document.body.removeChild(aHandle$1);
  };
function makeHTMLElement(aTypeId) {
   var Result=undefined;
   Result = document.createElement(aTypeId);
  return Result
};

I’m sure you can guess what the outcome looks like:

Fairly straight forward

What does a class look like?

Now let’s see how a class looks like when it’s compiled. Here is the TW3Button class (ordinary button) from the Smart Mobile Studio RTL. Notice the VMT and inheritance chain for each compiled method. This is no simple function mapper – but a real compiler with quality output. Unlike our competitors we produce code that is extremely fast – with no “copy and paste” mechanisms or pre-defined set of RTL functions. Each pascal line is tokenized, parsed and used to build an AST (abstract symbolic tree) which in turn is compiled into JavaScript. And the results speak for themselves.

/// TW3Button = class (TW3CustomControl)
///  [line: 9, column: 3, file: w3button]
var TW3Button= {
   $ClassName:"TW3Button",
   $Parent:TW3CustomControl,
   $Init:function ($) {
      TW3CustomControl.$Init($);
   }
   /// function TW3Button.getCaption() : String
   ///  [line: 39, column: 20, file: w3button]
   ,getCaption:function(Self) {
      var Result="";
      if (Self.FHandle$4) {
         Result=Self.FHandle$4.innerHTML.toString();
      }
      return Result
   }
   /// procedure TW3Button.setCaption(Value: String)
   ///  [line: 45, column: 21, file: w3button]
   ,setCaption$2:function(Self, Value$6) {
      if (Self.FHandle$4) {
         Self.FHandle$4.innerHTML=Value$6;
      }
   }
   /// function TW3Button.makeElementTagObj() : Variant
   ///  [line: 34, column: 20, file: w3button]
   ,makeElementTagObj:function(Self) {
      return w3_createHtmlElement("button");
   }
   /// procedure TW3Button.InitializeObject()
   ///  [line: 27, column: 21, file: w3button]
   ,InitializeObject:function(Self) {
      TW3CustomControl.InitializeObject(Self);
      TW3MovableControl.SetWidth$(Self,100);
      TW3MovableControl.setHeight$(Self,32);
   }
   ,Destroy:TW3TagObj.Destroy
   ,AfterUpdate:TW3CustomControl.AfterUpdate
   ,FinalizeObject:TW3CustomControl.FinalizeObject
   ,InitializeObject$:function($){return $.ClassType.InitializeObject($)}
   ,makeElementTagId:TW3TagObj.makeElementTagId
   ,makeElementTagObj$:function($){return $.ClassType.makeElementTagObj($)}
   ,StyleTagObject:TW3CustomControl.StyleTagObject
   ,Resize:TW3MovableControl.Resize
   ,setHeight:TW3MovableControl.setHeight
   ,SetWidth:TW3MovableControl.SetWidth
   ,supportAdjustment:TW3MovableControl.supportAdjustment
   ,Invalidate:TW3CustomControl.Invalidate
};

Incidentally, here is a small Chrome (webkit) demo coded in Smart Mobile Studio. I wrote it for iPad so you may have to scale down your window slightly, but it took me roughly 2 hours to make since I had to port over a CSS library first. But no-one can tell me that object pascal doesnt make perfect sense in the HTML5 world, because it does. It makes website programming fun and easy. You can also embed your creations in an IFRAME and use it just like people used flash. But SMS is way beyond flash in terms of features.

Easy, fun and very fast! Music from Last Ninja 1 @ Commodore 64

 Sources

http://smartmobilestudio.com/2014/06/04/giving-back-community/