In this tutorial we are going to cover using the Depot as a data source for a list. We will be expanding on the code written in the previous parts of this tutorial listed below.
Part 1: Mojo Lists
Part 2: Mojo Lists: Using a Cookie as a Data Source
Part 3: Mojo Lists: Restructuring our Code
If you were able to follow along with using the cookie as a data source this is going to be relatively easy for you to integrate into the existing code.
In Part 2 of this series we created the ability to use a cookie for a lists data source. In this part we are going to clean-up our code a bit and try to restructure things so that it is easier to expand on our set of code.
After looking at the code I saw that we created the WBCookie model object that was not very abstract. We wish to keep things somewhat abstract so that the application is not concerned too much about where the data is coming from. We are going to be creating a few files that will be in our lib/ directory and I will explain why we are using them and what they do as we continue through the tutorial.
The first thing I want you to do is open up your sources.json file and add 3 lines at the top. We will want to include the files that we will be creating so that Mojo will know where to find them. Open your file and make it look like the following. Note that I only added the first three lines to this file.
In Part 1 of this tutorial we created the base for our application. It consisted of a static list that was displayed when the application was launched.
At the end of Part 1 you were able to build the application and tap on any of the items which would push another scene. In Part 2 of this tutorial we are going to focus on using a cookie as a data source for our list. We will build a list that will display a list based on a cookie’s contents.
When you tap on a list item you will be taken to another scene where you will be able to change the title for the list item and it will be retained in a cookie. I did find an issue with cookies on the emulator and device. There is a known bug that cookies will retain on the emulator and device even after the application is removed. To learn more about this issue and cookies I suggest you read the Working with Cookies tutorial.
We will be continuing with the code that we created in Part 1 so open that application up. We will first be creating a model object that we will use to interact with the Mojo cookie stuff. In your application create the folder /app/lib/ and then create a new file named WBCookie.js and put it in your newly created lib folder. Now you will also have to update your sources.json so that Mojo will know where to find this file. Be sure that your sources.json file looks like the code below.
At the request of a reader this next tutorial will cover Mojo Lists however it will get quite long so I have decided to break it into smaller parts.
Part 1 (This section) will deal with setting up a static list.
Part 2 will show how to use a cookie as a data source.
Part 3 will be some restructuring of the code
Part 4 will show how to use the depot as a data source.
Part 5 will show how to use an Sqlite database as the source.
Source Code will be posted for download after the series is complete.
On our main scene we are going to show a static list of items. This means that we are going to use an array of elements which will never change over the lifetime of the application. The list item data will be specified by us and not fetched from any data source. The main list will give you options to choose from such as using a Cookie, Depot or Sqlite for the data source. When you tap on one of these options another scene will be displayed that will actually load another list. The data that populates these lists will come from the data source that you specified. This should give you the ability to write your own lists using any data source that you see fit.
The very first thing that you need to do is create a new WebOS application and add a new scene to it called main. Now that we have the main scene created we need to alter our stage-controller.js so that it actually pushes the main-scene on startup. Open the file and make the code look like this.
A lot of people are trying to understand how to write applications for WebOS so I figured the very first tutorial I would create for this site would be a simple walk-through of creating a very basic application. I am going to go a bit deeper than just a basic application like they cover in the Hello World example. The application created in this walk-through will explain the concepts behind creating a basic application, explaining what each part is and why you have to do it that way. I will also introduce the Depot in this walk-through. Are you ready?
The Tools I Use
Everyone will have their own set of tools that they use and they do not have to be the same as mine, however please note that I am not going to give the terminal commands for pushing the app to the emulator etc. My tools do that all for me and allow me to focus on developing my application.
The very first thing you should install is the Palm Developer SDK which you can get from the Palm Developer Website. For my Editor I use Komodo IDE with the very nice add-on that Templarian has created. If you do not have a license for Komodo IDE you can use the free version of Komodo Edit. You can download the add-on on Templarian’s website and installing is as easy as dragging and dropping on your editor window. The last thing I use is a file that you import into your editor that provides code completion for your editor. You can download this file here. Please note that you want to click the Download link and download the rawmojo.zip file. Installation instructions can be found on the same page. You can ignore the tool-kit as the tool-kit is the ancestor of the add-on.
Once you have these things installed you are all ready to start developing your first WebOS application.
With the release of the Palm Pre it seems like everyone is trying to learn how to develop applications for the platform. I have found some great resources on-line for using if you wish to learn how to develop your own applications.
I will start off by talking about The WebOS Book because that is the first thing I looked at. When I first looked at the book it was in the “Rough Cuts” phase which means the data is bound to be incorrect as they are still working on finalizing the book. The book was a mess when I first bought it, I tried to get through the first few chapters but I could not because the code would not work. In order to make the code work you had to do your research and that was tough to do since the on-line documentation was still in rough shape. I decided to stop using the book and wait until it was closer to a final version before writing a review on it, The other day they removed the book from the “Rough Cuts” phase. As of today I really am hoping that it is not on the way to the printing press because there are still quite a few errors in the book which I have reported in the Errata. Currently I have only gone through the first 100 pages of the book however I have found 15 errors which equates to be 1 error for every 6.6 pages. There are 2 different Errata sections for you to browse. The Confirmed Errata and the Unconfirmed Errata.
I am not going to say that this is a bad book however if you are just starting out you might find it to be quite difficult to make your way through this book. I have had to spend a lot of time debugging code that is in the book and also reading between the lines to fill in some code that was not provided when it should have been. If you do happen to fall upon one of these errors in the book I would suggest you check the Errata to see if someone else has hit the same problem and what they did to solve it. The WebOS Book has been very good at teaching you how to use widgets and explaining why they are having you do what they are. It seems to be very easy to follow. It is structured well so far meaning it is teaching you as if you knew nothing about Mojo or Pre Development which is the way it should be.
As I stated above I am not going to say that this is not a good book. I do however feel they have rushed the process a bit too much because I have never read a technical book that went to production with an error every 6.6 pages. Spelling errors are one thing but when you are missing code or providing code that will not run, that is another. I am actually a bit upset that my printed version will have this many errors. I mean I bought the “Rough Cut” version which means I paid to help find and correct errors. I think this is a way the publishers are trying to save money. They do not have to pay several people to scour the book and find all the errors. People are paying to do that job. I am really hoping that this book is not on the way to the printing press but what can you do?
The next resource that I have found to be useful is Palm’s Developer Website. You can find documentation on the individual widgets as well as the Mojo Framework which will come in handy. The documentation is not in a book form so it is more of a reference you will find yourself visiting quite often.
The last resource has been the most valuable. The Unofficial IRC channels which you can find on the Freenode IRC Network. I have gotten help from several people there. The regulars in #webos are very knowledgeable when it comes to Mojo, if you are looking for deeper knowledge about the internals of the platform you can check out #webos-internals which goes beyond that and dives deep into the internals of the platform. I like IRC for help related questions because generally you get an answer in real time, like instant messaging except your message is seen by everyone in the room. Everyone on the IRC channel have been a great help to me as I go through the learning process.. For that A BIG Thank You goes out to the following people (no particular order): rwhitby, Templarian, blau-mikeDG, oc80z, PreGame, Pre101, PuffTheMagic, anyone else that I might have failed to list here.
One thing that I want to mention which is not a resource is actually a toolkit for use with the Komodo IDE. Templarian created the toolkit and is also working on a plug-in which makes development for palm WebOS much easier. Check it out by going to his website.
Development, Entertainment, Frameworks, Internet, JavaScript, News, Palm, Rants, Raves, Reviews, Useful.
Over the last few weeks I have been fiddling with trying to learn how to develop applications on the WebOS platform that Palm released on their Palm Pre. If you are not familiar with WebOS it is an operating system that Palm, Inc. has created for the Palm Pre and their future line of phones. From this point forward they are not going to release a phone that is not running WebOS. This means that the old Palm OS is going away. You use technologies such as JavaScript, CSS, HTML to develop applications on the devices. Mojo is the JavaScript framework that allows you to access core functionality of the phone such as the location services, calendar, contacts, etc.
I have been looking through the applications source code for the apps that are bundled with the operating system when you buy a phone so that I can learn. I have also been reading the “rough cuts” version of the WebOS Book. The book has not been much help since it was in “rough cuts” which means it is still being written and a lot of the code was out of date as the framework continued to evolve as the book was being written. I believe the book is in production and if not will be soon. The latest version of the PDF still has some errors but they are not complete show stoppers while learning. I do suggest that if you own the book or are buying the book that you check both the Confirmed Errata and Unconfirmed Errata as well because I have found several errors even in the latest version over the last 2 days.
As I begin to learn more and more about the Mojo framework you will be able to find tutorials on my site. I will probably start out with the List widget because that was the first widget they created and the rest of the framework evolved around it. I want to dig into the API a bit deeper before I start writing anything to make sure that I completely understand how to use it and do not mislead anyone.
I do have my first app planned however I cannot reveal what it is going to be for fear someone else will steal the idea and release before I do. However if you are a designer and would like to partner with me on the project we could split the profits. I am learning more and more about CSS as I have been going but I have not used it on a daily basis so what you can do in 5 minutes would probably take me 20.
I am honestly amazed at the things you can do with JavaScript and am loving the fact that I can use this as an excuse to learn a lot more about it.bs
Over the last few weeks I have been applying all over for Web Developer positions here in the Boston area. I have been telling everyone that I am a beginner with CSS / JavaScript however I think I have been selling myself short. I decided to take the W3Schools CSS Quiz just to see how much I know off the top of my head. I found the quiz to be easy but I never figured I would make it through 20 questions in 3 minutes 34 seconds and get them all correct. I know that the W3Schools quiz is just a simple one so that you can see how much you know and is not actually a test of skill. While I still have quite a bit to learn I think I have been stating that I know less than I do and well that is not a good thing when it comes to trying to find a job. I have been trying to be honest however I have been lying to myself. I know more about CSS than I thought. I also did a lot of reading today from a sitepoint book I have and most of the stuff I understood.
As most of you know I have been getting more and more into mac development in what free time I have (which is not much). I have actually learned a lot about it with the help of some great guys in #macdev on irc.freenode.net
I have been trying to keep up with what is happening in the Cappuccino world as well because while that is not technically mac development they are making it so that you can develop interactive web apps in much the same way you do Cocoa Applications.
If you are not sure who 280 North is or what exactly Cappuccino is you can check them out at http://280north.com/.
When I first heard of Cappucino I was intrigued by the idea of creating a framework like Cocoa based on JavaScript. I really wanted to see what they could do with it. I was first amazed by the application that 280 North had written with it called 280Slides. This is a very impressive application to have been written completely with JavaScript.
Yesterday 280 North revealed an application called 280Atlas. I have to say this is another very well put together application and once again I cannot believe all of this can be done via JS. Building applications like this is going to be very nice considering you can store data on the server but have all of the code for the application run on the client side in their browser window. They are really making Cappuccino development very much like Mac Development using Interface Builder for the interface. This is going to save developers a lot of time in the code.
This really makes me want to learn JavaScript and front-end stuff has never intrigued me at all.
There are a lot of blogs on the internet and most of them will have all of the social networking badges. As a webmaster wouldn’t it be nice to know what social networks your visitors frequent so that you could show only the appropriate badges?
Website developer Aza Raskin has come up with a simple JavaScript solution. It is a small javascript that will create a list of links in an iframe and then decide which site a visitor has been to based on the link color. When you visit sites on the web the links change colors to let you know that the link has been visited. This little javascript will return a list of sites that have been matched as visited. Now this is not a fool proof way but it is the best way currently. There are a few catches. The user has to have JavaScript enabled in their browser. It also only goes based on the browser history so if they clear their history often it won’t pick-up on this.
I am going to look into integrating this into my site maybe in a wordpress plug-in so that I can show only the relevant badges to my visitors. Obviously I would have a default list of badges to show just in case the script was not able to detect any of the sites. If you would like to get the script to use on your site be sure to visit this blog post.
