Create iOS App Store apps using PhoneGap

From Lennie De Villiers:

This requires a Mac OX running 10.6.0 Snow Leopard or greater.

  1. Download and install XCode with iPhone SDK.
  2. Note: You will need an Apple Developer license (USD $99.00 per year) to deploy to your device or the App Store.
  3. Get the latest PhoneGap for iPhone from GIT. See setup instructions at https://github.com/phonegap/phonegap-iphone
  4. Create a new PhoneGap project using the XCode template.
  5. Delete index.html file under the www folder
  6. Download the NSBasic App Studio project to the www folder
  7. Rename “index.htm” to “index.html”
  8. You might need to change the “index.html” file to use the PhoneGap API if you want to use features like camera etc.
  9. Remove the off line file
  10. Reload the XCode project to pickup your files
  11. Build + Run
  12. You will see an PhoneGap splash screen first before it shows your application.

Once this is done, you can start the process for submitting to the App Store. Be prepared – it’s a lot of work.

Create Android .apk files using PhoneGap

From Lennie De Villiers:

Instructions to compile an NSBasic app to PhoneGap on Android on MS (Windows only)

  1. Download Java JDK 1.6
  2. Set the Java class path and add the Java bin folder to the PATH variable so that you can run Java (“javac”) from the command line
  3. Download latest Apache Ant
  4. Download Apache Ant to a folder and set the PATH variable to the bin folder so that you can run ant from the command line
  5. set the ANT_HOME variable to the Ant home folder
  6. Download the latest version of Ruby
  7. Set the PATH variable to the bin folder of Ruby so that you can run it from the command line
  8. Get the latest source code of Phone Gap for Android from the GIT repo: https://github.com/phonegap/phonegap-android
  9. Set the PATH variable to the bin folder so that you can run droidgap.bat from the command line (droidgap.bat is just a wrapper that calls the Ruby script)
  10. Open an command prompt and CD to a folder that contains your NSBasic script files (Index.htm etc)
  11. Rename “index.htm” to “index.html”
  12. Run “droidgap create”. This will create an Android solution using your NSBasic script files.
  13. Compile the application using Ant and deploy to device for testing.

NS Basic/App Studio 1.0.2 released

NS Basic/App Studio 1.0.2 is ready to download. You can download it from the same URL as before.

  1. Forms: Add new style property.
  2. Code Window: Type Ctl J to see the translated JavaScript.
  3. Controls: Grid: Add new cellstyle property
  4. Controls: Grid: reduce default padding, font size default is now 10 and populate each cell with a space.
  5. Controls: Grid: multiple grids can have different styles.
  6. Controls: TextBox: Add inputType of hidden.
  7. Samples: HTMLview’s manifest fixed so image is deployed.
  8. Samples: Added tutorial samples.
  9. Samples: GetData retrieves data from a remote site.
  10. Translator: some color constants were incorrect
  11. Translator: Msgbox “Grid(4,4)=” & Grid1.getValue(3,3)
  12. Translator: Function ComboBox1_onchange
  13. Translator: datediff(“ww”,fromdate,todate)

Getting data from a remote server

This turns out to be pretty easy.

First, you’ll need to reformat the data on the server a bit and rename
the file:

Contents of the file:

processData("1,1000,500,500,500,500,500,500,1001,2000,1000,1000,1000");

Call it whatever you like – in my sample, it’s data.js.

Here’s the code in an NS Basic/App Studio program:

'GetData - gets some data from a remote site and processes it

Function Button1_onclick()
  head = document.getElementsByTagName("head")[0]
  newScript = document.createElement("script")
  newScript.type = "text/javascript"
  newScript.src = "http://www.nsbasic.com/data.js"
  head.appendChild(newScript)  
End Function

Function processData(s)
  data=Split(s,",")
  Textarea1.value=""
  For i=0 To UBound(data)-1
    Textarea1.value=Textarea1.value & data(i) & vbcrlf
  End If
End Function

The data in data.js is actually a mini program: it calls a function called processData with the data you want to download.

In the above code, Button1_onclick() takes that file, inserts it into your program and executes it. The code in the file calls processData, which interprets the incoming data and, in this case, simply displays it.

You’ll have to take care that no one can modify data.js, or they could
have all kinds of fun!

This sample will be included in the next build.

WebSockets

We have just uploaded Version 1.0.1. One the things it includes is a new sample called WebSockets.

WebSockets are a very new part of HTML5. They implement a higher level of the regular sockets protocol, with improved security and other advantages. This means, however, that it won’t just simply connect to Windows Winsock. There is more information here:

http://websockets.org/echo.html

WebSockets are supported starting in iOS 4.2.1. They have not appeared in Android yet.

We will be adding more information about WebSockets as we develop it.

NS Basic/App Studio 1.0.1 released

We have just put NS Basic/App Studio 1.0.1 up. You can download it from the same URL as before.

This update concentrates, not unexpectedly, on fixes. Here they are:

  1. Deploy: Meta tag viewport.user-scalable changed to no.
  2. Deploy: Missing file in deploy fixed.
  3. Deploy: Unique name for registered users is now lower case.
  4. Docs: Tutorial 1 updated to show Android install.
  5. Docs: Appearance of Language Reference improved.
  6. Docs: Handbok updated.
  7. Runtime: Titlebar images now all show.
  8. IDE: NSB Icon now appears in top left corner
  9. IDE: Removed single quotes around image names.
  10. IDE: Problem deleting forms is fixed.
  11. Controls: Label.value is now called textContent (same as runtime)
  12. Samples: new WebSockets is an early demo
  13. Translation: a = ((i/100) ^ 12 * a)
  14. Translation: a = Eval(“Grid1_” & x & “_” & y)
  15. Translation: a = NSBVersionView
  16. Translation: a=”<img src=””mario.jpg””>”
  17. Translation: If (Location.coords.longitude > 0) Then Amendment = ” east”
  18. Translation: Dim Amendment; Amendment = “”
  19. Translation: LGA(0) = “a” : LGA(1) = “b” : LGA(2) = “b”
  20. Translation: MsgBox “aaaa ()”
  21. Translation: MsgBox a.b.c()
  22. Translation: MsgBox a.b.c(0)[name]