Category: tips

Posted on

AppStudio and Chrome OS

We were contacted by a large government organization and asked whether AppStudio can be used to create apps for their field personnel. It’s an interesting idea: use a cheap, sturdy Chromebook which automatically syncs with the cloud, but can run apps locally. They’re easy to maintain and replace: grab a new one out of the box, sign in and all your apps and files get reinstalled automatically.

The AppStudio IDE itself won’t run on it. But would apps created by AppStudio work?
Continue reading “AppStudio and Chrome OS”

Posted on

Turn your mobile app into a desktop app!

Many fine apps have been made with AppStudio for mobile devices. With AppStudio 3.2, these apps can be turned into packaged apps that run on the desktop. They can even be sold in the Google Play store.

Packaged apps deliver an experience as capable as a native app, but as safe as a web page. Just like web apps, packaged apps are written in HTML5, JavaScript, and CSS. But packaged apps look and behave like native apps, and they have native-like capabilities that are much more powerful than those available to web apps.

Apps packaged this way currently run on Windows. Google says Mac and Linux support is coming soon.

Detailed instructions can be found here. Here’s an overview of what needs to be done:

  1. Get your app ready: certain instructions, such as alert, MsgBox and eval() are not allowed.
  2. Prepare 16×16 and 128×128 icons.
  3. Use “Build Desktop App” on AppStudio’s Run menu to make the upload zip file.
  4. From your Google Developer Account, upload the file.
  5. Set up the other information Google requires for a store listing.
  6. Wait a few minutes for your app to appear in the Play Store.
  7. Download the app.
  8. You can run it from the Chrome App Launcher or from a Windows shortcut.

      This is a great way to extend your apps to new markets, for training, for prototyping and for testing!

Posted on

Chrome can’t find jquery.min.map

Recently, one of our users reported getting this message when running in Chrome:

mailmaperror

It’s not one you need to worry about. It only happens when you are running with the Chrome Debugger open. It’s complaining that it does not have the extra files it needs to display the jQuery source code properly. Since it is very unlikely that you will have any need to look at that code, it doesn’t matter.

If it really bugs you, you can go into the Debugger Preferences and turn off the warning. The setting to turn off is “Enable Source Maps”.

There is more info here.

Posted on

A handy little Chrome trick: FullScreen

Google recently added a little trick to Chrome, allowing apps to become full screen. It works on both the Desktop and Android devices. You’ll need to be running Chrome Version 32 or newer.

To use it, add a button to your app with the following code:

Function btnChrome_onclick()
  document.documentElement.webkitRequestFullScreen()
End Function


After going to full screen, a message is displayed telling how to go back: swipe down on an Android device or hit escape on the desktop. As of Chrome 32, this is no longer needed.

Here’s how it looks on an Android device.

If you want to execute some code after the resize (perhaps to move controls to take advantage of the larger screen, do the following:

Function window_onresize()
  Print "resize"
  '… do any housekeeping
End Function

If you want hide the button if you are not using Chrome, add this code to your global code:

  If Not window.chrome Then btnChrome.hide()

A few gotchas:

  • This won’t work with the Android Browser or iOS.
  • This won’t work with PhoneGap, as long as it still uses the Android Browser.
  • It seems to have to be done from a button: just putting it in Global Code does not work.

Let us know if you find out anything more about this trick!

Posted on

Ultimate list of Libraries for AppStudio

JSDB is a collection of the best JavaScript libraries on the net: at last count, more than 300 are listed.

You should be able to use any of them with AppStudio. After all, if you can do something in JavaScript, you can do it in AppStudio.

The libraries can be used from JavaScript or BASIC: the functions they add to your app become part of your program.

Read more about using JavaScript libraries in Using JavaScript in your App.

Visit the JavaScript Library database here: http://www.jsdb.io.

Posted on

A couple of debugging tricks…

Examine variables in a running app

You can examine the value of global variables in a running app on any device, without needing to have a debugger hooked up.

Simply enter this into the URL bar:

javascript:alert(a)

This will display the value of a in a message box.

You can also use this to call functions:

javascript:alert(window.innerHeight)

You can enter any valid JavaScript code and it will execute in the current context.

Wow.

View JavaScript errors on Android devices

It’s not easy to see JavaScript errors on Android devices, especially older ones. To do this, you will need to have the Android SDK installed.

Start the simulator or connect your device in debug mode.

Open up a command window and type

adb logcat

You will see a stream of output with all the messages from the device or simulator. The error message will look something like this:


D/dalvikvm(  284): GC_FOR_MALLOC freed 34 objects / 2096 bytes in 212ms
E/browser (  284): Console: TypeError: defineProperty is not supported on DOM Ob
jects http://www.nsbasic.com/i/Order/nsb/hfunc.js:1926
Posted on

What does FastClick do?

Update Nov 2016: FastClick is no longer needed on modern browsers. It is only needed for iOS Home Screen apps.

AppStudio 3.0.9 added a new feature: FastClick. It will make your app feel faster and more responsive when running on a mobile device. Here’s the reason: mobile devices have a built in 200 to 500ms delay from the time you tap until the onclick() function in your app gets fired. FastClick gets rid of that delay. Here’s what is going on…
Continue reading “What does FastClick do?”