Posts

Posted on

NS Basic/App Studio 1.2.2 released!

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

There are a few nice new features:
– Syntax checking as you enter your code.
– Grids and Picturebox controls can scroll.
– New samples for Facebook and Sencha Touch.

Here is the complete list:

  1. Code Window: Syntax checking added.
  2. Controls: Grid can scroll.
  3. Controls: PictureBox can scroll.
  4. Samples: New FacebookAPI sample.
  5. Samples: New Sencha Touch sample.
  6. Code Window: Turn off undo when setting initial text.
  7. Controls: Grid new row height is now correct.
  8. Controls: Button had invalid default property.
  9. Deploy: Error message if remote server cannot be found.
  10. Deploy: Error message shows if login info is not correct.
  11. Deploy: Error message shows if remote folder cannot be created.
  12. Deploy: Progress message improved.
  13. Deploy: Thumbs.db file ignored if in upload folder.
  14. IDE: Bug when closing minimized IDE fixed.
  15. IDE: iPhone 4 Design Screen size corrected.
  16. IDE: Problem with positioning bottom of object above top fixed.
  17. IDE: Problem with save fixed.
  18. Language: For Each index, item in Data now supported.
  19. Language: ReadFile produces better error messages.
  20. Samples: GetData sample improved.
  21. Samples: HTMLview – added display a .htm file in HTMLview control.
  22. Samples: ReadFile sample improved.
  23. Samples: WebSocket sample improved.
  24. Translator: Execute() function now works.
  25. Translator: Exit Function now returns value.
  26. Translator: If e.keyCode = 13 Then Button1_onclick() fixed


Documentation Changes for Version 1.2.2

  1. The first time you compile under this release, it will take a bit longer. Afterwards, it will be as usual.
  2. Do a full deploy the first time you run on the new release.
Posted on

How to print from your app

You can print the current screen contents from your app using the statement

window.print()

For this to work from an iOS device, you will need to be connected by WiFi to a network with a properly configured printer. For example, if you are connected to a Mac running Mac OS 10.6, you can print to any AirPlay enabled printer.

While Apple has only a short list of AirPlay printers built in, almost any printer connected to the network will work if you run Air Printer Lite or Air Print Activator on the system.

jQuery Mobile 1.4 adds some extra styling which can interfere with printing a full page. Here is the workaround:

Function btnPrint_onclick()
  Dim h = Page_PrintTest.style.minHeight
  Page_PrintTest.style.minHeight = ""
  window.print()
  Page_PrintTest.style.minHeight = h
End Function
Posted on

Programming Contest Results

The results of the first NS Basic/App Studio Programming Contest are in. The winners are:

Business: RMRFuel – RMR Software

This is a very real, very usable app. It should really be considered together with its 3 siblings. In fact, the author plans to create an integrated app. Since the entry was submitted, improbements have been made to the user interface. You can try the beta of the improved banking module at http://www.rmrsoft.com/RMRBank1.

Fun: Color/Shape — mizuno-ami/JAPAN

Simple, but nicely laid out. It works just like the successful Palm OS version. It has the potential for much improvement, using the user interface possibilities of the platform.

Congratulations to both the winners and other entrants. It was tough to pick the single best app!

See the full results here:
http://www.nsbasic.com/app/contest/

Update: mizuno-ami has requested his reward be sent to the Japanese Red Cross for their disaster relief efforts in Japan. 14,575 persons died, and 11,324 persons are missing now. We have matched his donation and encourage others to paypal contributions to https://gienkin.jrc.or.jp/paypal

Posted on

Using Sencha Touch with NS Basic/App Studio

Sencha Touch is a JavaScript framework which can be used to add additional functionality to NS Basic/App Studio. It has a number of slick features and controls. Complete documentation is at http://dev.sencha.com/deploy/touch/docs/. One thing to keep in mind: it’s quite large, adding almost 500K to your project.

Let’s use it to create a Date Picker that looks like this:

Start by adding the Sensha .css and js files into your project folder. Add this to your project’s extraheaders property:
<link rel="stylesheet" href="sencha-touch.css" type="text/css">
<script type="text/javascript" src="sencha-touchcompressed.js"></script>

Add this to your project’s manifest:
sencha-touch.css
sencha-touchcompressed.js

Now, we’re ready to code. First thing we need to do is set up a reference to Sencha’s DataPicker object. All of Sencha’s functions are wrapped in a single object named Ext. To call any Sencha function, you therefore put “Ext.” in front of it:
datePicker = new Ext.DatePicker({yearFrom:2010, yearTo:2015})

Next, we want to tell datePicker what to do if the value of our datePicker changes. Sencha has a handy function for that: the following statement will call the showDate function in our program when this happens:
datePicker.on("change", showDate)

We’ll need a button to open the datePicker window. Add one to the project and put the following code for onclick. The first statement sets the initial date for the picker as today. The second one shows the DatePicker as a modal dialog.
Function Button1_onclick()
  datePicker.setValue(new Date())
  datePicker.show()
End Function

Now we just have to add the function that gets run if the user changes the date. We’ll just display it on the screen. An NS Basic/App Studio MsgBox statement could do this well, but since we’re showing off Sencha, let’s use their fancy one:
Function showDate()
  Ext.Msg.alert("Sencha Touch", "Date Entered is " & datePicker.getValue(), Ext.emptyFn)
End Function

Here is all the code in one listing:

datePicker = new Ext.DatePicker({yearFrom:2010, yearTo:2015}
datePicker.on("change", showDate)

Function Button1_onclick()
  datePicker.setValue(new Date())
  datePicker.show()
End Function

Function showDate()
  Ext.Msg.alert("Sencha Touch", "Date Entered is " & datePicker.getValue(), Ext.emptyFn)
End Function

This sample is included in the NS Basic/App Studio Samples folder starting in version 1.2.2.

There’s a lot more to Sencha Touch than this. If you discover any good tips or tricks, let us know so we can share with everyone!

Posted on

NS Basic/App Studio Handbooks are here!

The NS Basic/App Studio Handbooks have just arrived. They are about 125 pages and spiral bound so they lie flat on your desk. PDF’s are handy, but hardcopy is always nice. It does not take up any space on your screen, and it’s easy to write your own notes on the pages.

Just $24.95 USD, plus shipping of $6.50. We ship by regular mail to North America, Air Mail to the rest of the world. Delivery is usually within 2 weeks.


handbook

Posted on

NS Basic/App Studio 1.2.1 released!

NS Basic/App Studio 1.2.1 is ready to download. You can download it from the same URL as before. There is also a new, faster download location: we will be emailing that to everyone.

There are a few nice new features:
– You can now upload a whole folder of files with your app.
– A number of controls have new properties to enhance their appearance.
– iPads can now have splashscreens

Here is the complete list:

  1. Deploy: Directory names can be put in the manifest.
  2. Controls: FontSize, FontFamily, FontStyle, FontWeight, color and backgroundColor properties added to Label, Text, TextArea and Button.
  3. Controls: FontSize, FontFamily, FontStyle, FontWeight and color properties added to HTMLview.
  4. Controls: Hidden property added to a number of controls.
  5. Controls: HTMLview border-style changed to borderStyle, and background-color changed to backgroundColor.
  6. Deploy: Cache Manifest simplified.
  7. Deploy: All system files are now put into a new nsb folder.
  8. Deploy: slash and colon now allowed in manifest file names.
  9. Deploy: Apps deployed to nsbapp are now available immediately.
  10. Deploy: Apps now stay on nsbapp.com for 10 days.
  11. Deploy: Progress message appears properly with lots of files.
  12. Docs: Handbook and Language Reference updated.
  13. IDE: Adding code file marks project as dirty for saving.
  14. IDE: Problems in Recent Files list fixed.
  15. IDE: New splashscreenipad property.
  16. Setup: Menu shortcut no longer contains version number. You may need to uninstall/reinstall to see this change.
  17. Project Explorer: multiple code files fixed.
  18. Runtime: Browser check fixed for IE.
  19. Samples: Base64Image added – shows using image as a string.
  20. Samples: HTMLviewCallFunction – call a function in your app from HTMLview.
  21. Samples: iMenu and iTitlebar renamed Menu and Titlebar.
  22. Samples: MoveTheBall renamed to Accelerometer.
  23. Translator: Dim tt(6):s=tt(1-1) fixed.
  24. Translator: if s=”if(” then s=s & “}” fixed.
  25. Translator: if s=”if(” then s=s & “” fixed.
  26. Translator: d = new Date() fixed.


Documentation Changes for Version 1.2.1

  1. Deploy: We have made some changes to how files are deployed to provide some additional functionality. You can now put the name of folder in your list of files to deploy. That folder, and all of the files and folders in it, will be copied to your server. This makes it easy to have a project with a lot of files: you no longer have to list each file in the manifest.

    We also reorganized the files that NS Basic needs at runtime, putting them all into an /nsb/ folder within your project. You may want to delete your app from your server completely before you deploy next time: that will get the obsolete NS Basic files out of your app’s folder.

Posted on

Calling a function in your app from HTMLview

NS Basic/App Studio’s HTMLview is a powerful control. It allows you to display HTML formatted content in your app.

HTML can include links to other pages. But it can also be used to execute code. Here’s how to have a link in an HTMLview control call a function in your program.

First, set up a function in your program that you want to call:
Function MyFunction()
    MsgBox "MyFunction called.
End Function

Put this in the innerHTML property of your HTMLview. You can do this in the IDE or at runtime:
<a href='javascript:MyFunction();>
    Text to click
</a>

Now, run it in Chrome or on a device. (The link will display as a link in the IDE, but it won’t do anything). Clicking on the link will bring up the MsgBox.

You can do some amazing stuff with this. You could create an object with much more complexity than the IDE itself lets you do – for example, a scrolling listbox with custom formatting on each line. You could even use BASIC to create your own HTML from your data, then set the HTMLview to show it.

Posted on

Multiple overlapping windows in IDE

Version 1.2 lets you tear off the items in the tab bar into their own windows. This is handy if you want to edit code and see the form at the same time, or view more than one code window at a time. Drag a tab outside the bounds of the IDE to make this happen.

Here’s how it looks afterwards:

Posted on

NS Basic/App Studio and Symbian S^3

Denis Jakus has done some testing with a Nokia C7, a Symbian S^3 device. He reports that NS Basic/App Studio seems to run OK on it: apps deploy normally, can be added to the Home page and run offline.

He wasn’t able to get definitive results on SQLite databases before he gave up the device.

The latest browser from Symbian is WebKit and HTML5 enabled, so this is good news.

Let us know if you have additional information on Symbian!

Posted on

Images in strings and Base64

Images can be saved as strings encoded using Base64. This can be quite useful. For example, you can pass such strings from a server to your app, or store them in an SQLite database. Here’s an example of a png file with an image of a red dot, represented as a string:

reddot="data:Image/png;base64,"
reddot=reddot & "iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAABGdBTUEAALGP"
reddot=reddot & "C/xhBQAAAAlwSFlzAAALEwAACxMBAJqcGAAAAAd0SU1FB9YGARc5KB0XV+IA"
reddot=reddot & "AAAddEVYdENvbW1lbnQAQ3JlYXRlZCB3aXRoIFRoZSBHSU1Q72QlbgAAAF1J"
reddot=reddot & "REFUGNO9zL0NglAAxPEfdLTs4BZM4DIO4C7OwQg2JoQ9LE1exdlYvBBeZ7jq"
reddot=reddot & "ch9//q1uH4TLzw4d6+ErXMMcXuHWxId3KOETnnXXV6MJpcq2MLaI97CER3N0"
reddot=reddot & "vr4MkhoXe0rZigAAAABJRU5ErkJggg=="

To display in an Image Control, do this:

Image1.innerHTML="<img height=10 width=10 src='" & reddot & "'/>"

To display in the PictureBox control: do this:

reddotImg=new Image()
reddotImg.src=reddot
pb = PictureBox1.getContext("2d")

Function redditImg_onload()
  pb.drawImage(reddotImg,0,0)
End Function

You can save a Picturebox to a string using the PictureBox.toDataURL() function.