Introduction
Writing a Playbook App is an interesting proposition as BlackBerry’s WebWorks makes it so easy. Currently the runtime for BlackBerry WebWorks on the BlackBerry smartphones is based on Java while that for the BlackBerry PlayBook is based on Adobe AIR. WebWorks is fully Open Sourced and is developed transparently.
WebWorks is aligned with Apache Cordova. WebWorks is also the main way to deliver WebGL-based applications. WebWorks repositories at GitHub include:
In the summer of 2010, Google released Blockly, a completely Visual Programming language that will let you build software without typing a single character. It is reminiscent of Scratch, a platform developed at MIT that seeks to turn even young children into programmers.
You create programs by joining pieces together, and are restricted in the same way puzzle pieces are, by what fits where, just like Legos. This is an ingenious and easy to understand method of ensuring that the program is correct. It short cuts the process of having to learn correct syntax. If the pieces fit, the program works.
Blockly is something of an experiment in teaching people to program. Instead of having to learn the intricacies of a language like JavaScript, you can show Blockly to teenagers or even younger kids, and visually explain the concepts and engage their brains.
Requirements
Follow the tutorial published here in Redacacia blog Writing a “Resistor Code” App for BlackBerry Playbook up to Preparing our App. This tutorial will explain how to obtain BlackBerry’s Code Signing keys, as well as how to install debug token in your Playbook, a requirement to install the App that we will write next.
Preparing our App
We are now ready to write our App. Our App will open Blockly Apps website at https://blockly-demo.appspot.com/static/apps/index.html. There are several Blockly Apps on that website that you can play with, and do some serious programming. My favourite App is Maze, but I have never managed to pass level 6.
Crackberry has a post with a a Youtube link that shows Tim Neil from RIM whipping together a basic CrackBerry.com App in 3 minutes. Actually it is quite easy to turn a website into a BlackBerry PlayBook app as we will do next.
a) Write config.xml
Our App will have very basic structure. So here is the code for config.xml an important component for writing our App.
<?xml version=“1.0” encoding=“UTF-8”>
<widget xmlns=“http://www.w3.org/ns/widgets”
xmlns:rim=“http://www.blackberry.com/ns/widgets”
version=“1.0.0.1”>
<author href=“https://redacacia.me/”; email=“tayeb.habib@gmail.com”
rim:copyright=“Copyright 2014 Aliatron”>Aliatron</author>
<name>Blockly Apps</name>
<icon src=“images/icon.png” />
<content src=“https://blockly-demo.appspot.com/static/apps/index.html”>
<access uri=“https://blockly-demo.appspot.com/static/apps/” subdomains=“true”>
<feature id=“blackberry.ui.dialog” />
<feature id=“blackberry.app.event”/>
<feature id=“blackberry.invoke”/>
<license>
Copyright (c) 2014 Tayeb Habib
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
WHETHER IN AN ACTION OF CONTRACT, INSULT OR OTHERWISE, ARISING
FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
OTHER DEALINGS IN THE SOFTWARE.
</license>
</widget>
b) Create a zip file
Next, we need to prepare an icon, that must have 82×82 pixels and save as icon.png. Once this is done, we will create a zipped file blockly.zip which will contain config.xml and an images folder with icon.png as the following image shows:
To make it easy for this tutorial you can use my zipped file blockly.zip which you can download from Bitbucket, an unlimited free private repositories’ site.
c) Compile a bar file
To avoid error unknown protocol: c you need to first create a temp directory in your C: drive (if you don’t have it already) and then issue the following commands in your DOS terminal:
SET TEMP =C:\TEMP SET TMP=C:\TEMP
This solution was found at Blackberry’s Discussion Forum. I did not find any alternative solution yet.
So let us compile blockly.zip and output as blockly.bar. Go to your DOS terminal and navigate to your PlayBook WebWorks SDK
cd C:\Program Files\Research In Motion\BlackBerry WebWorks SDK for TabletOS 2.2.0.5\bbwp
To make it easy, create a directory myapp, and a sub-directory inside called output. Drop blockly.zip file into myapp directory (or one that you modded) and run the DOS command:
bbwp c:\myapp\blockly.zip -d -o c:\myapp\output
The results will be similar to ones as follows (I have blockly.zip in my c:\ drive’s bb folder and output to blockly folder:
If you check your output directory, you will now find blockly.bar.
Install and run the App
Now we will deploy this App in our Playbook. Navigate to tablet-sdk with the following DOS command:
cd blackberry-tablet-sdk\bin
Run the following command to install the App:
blackberry-deploy -installApp -password 123 -device (your Playbook IP) -package c:\myapp\output\blockly.bar
Hopefully it will install itself correctly, and you will see the reassuring icon in your Playbook:
If you run this App, and wireless connection to your router with Internet is not available, or if you have not tethered your PlayBook to your BlackBerry phone to share Internet connections, you will get the following message (in english or in your PlayBook’s default language, of course):
So, if your PlayBook is connected to Internet you will be greeted with the following screen:
You can use any of Apps. Here is an image of Maze app working:
I will not show you how each of apps work. You can change the language, for example. Blockly is translated into numerous world languages.
One final consideration: The link shown of Googlecode’s site does not work. I have done it for obvious reasons.
If you want to learn how each of the apps works I suggest you check around the Web. There is enormous amount of teaching material from Educators, and others interested in Blockly, and Visual Programming languages.
Conclusions
I have shown how easy it is to integrate a webpage into an App with BlackBerry’s WebWorks. Blockly, Google’s Visual Programming language, is quite powerful and it has lots of potential to be more and more widely used so an App for PlayBook is an interesting proposition. To make your App permanent, you will need to sign your blockly.bar file and re-install it. I leave it to you to do this exercise.
RedAcacia 