Mobile development is a bigger challenge than you think it is….

mobileanalytics:

Since the first appearance of an Android OS Device in October 2008, PercentMobile has recorded mobile web activity for more than 100 different Android OS devices. This is roughly one new device per week over the past 2 years. Considering that it took almost 6 months for the second Android OS…

Debugging in Chrome or Firefox is pretty easy thanks to tools like the built in Chrome debugger or Firebug. However, once you get your app onto a mobile device it can be very difficult since these tools are not available there. A great option is to use the JavaScript API ‘console.log’ and a tool called jsconsole.com. With JSConsole you can connect to any web page running the JSConsole remote script from within the JSConsole web app. Simply add the following script tag to your HTML:

<script src="http://jsconsole.com/remote.js?random_id"></script>

Where <random_id> is anything you want. Preferably something easy to remember. Then go to http://jsconsole.com and in the box type

:listen <random_id>

Then when you refresh the page on your mobile device, all the console.log output will be echo’ed to the jsconsole.com web page.

More information can be found here:

http://jsconsole.com/remote-debugging.html

Since this is a Notes database on a Domino server, I figured the best way to get started would be with XPages. I don’t know XPages very well at all, but how hard could it be?

I have also chosen JQuery and JQuery Mobile as my framework. I’ve dabbled with these before so I’m most familiar with these, and that was really the only reason I chose them.

Note about the app: I’m not going crazy with features here, V1.0 will be a proof of concept.

Step 1 - Create the initial page.

The first page a user will see in version one is a list of all the customers. This turned out to be incredibly easy with XPages. After 10 minutes and a repeat control I ended up with this:

Here is all I have so far:

<xp:this.data>
 <xp:dominoView var="view1" databaseName=server/852!!test\crm.nsf" viewName="ALLCOMPANIES">
 </xp:dominoView>
</xp:this.data>
<ul>
	<xp:repeat var="vw" rows="30" value="#{view1}">
		<li>
			<a href="details.xsp?documentId=#{javascript:vw.getNoteID()}">
			<xp:text styleClass='companyName' escape="true" id="computedField1"
			 value="#{vw.fcftCompany_WB}">
			</xp:text>
			<br />
			<xp:text styleClass='companyAddress'
				escape="true" id="computedField2"
				value="#{vw.faddAddress_SS}">
			</xp:text>
			<xp:br />
			<xp:text styleClass='companyAddress'
				escape="true" id="computedField3"
				value="#{vw.faddAddress_SS_1}">
			</xp:text>
			<xp:br
				rendered="#{vw.faddAddress_SS_1!=''}" />
			<xp:text styleClass='companyAddress'
				escape="true" id="computedField4" value="#{vw.faddTown_SS}">
			</xp:text>
			<xp:text styleClass='companyAddress'
				escape="true" id="computedField5"
				value=",&#160;#{vw.faddCounty_SS}">
			</xp:text>
			<xp:text styleClass='companyAddress'
				escape="true" id="computedField6"
				value="&#160;#{vw.faddPostcode_SS}">
			</xp:text>
			<xp:text styleClass='companyAddress'
				escape="true" id="computedField7"
				value=",&#160;#{vw.faddCountry_SS}">
			</xp:text>
			</a>
		</li>
	</xp:repeat>
</ul>

I know, it’s a bit basic, but in the next post I’ll show how Jquery Mobile is going to help with that.

Here are the basics. I have a database where all my customer information is. Call this the ‘contacts’ db. I also have a database where I store all the license keys for the products people buy. Lets call this the ‘license’ db. As it stands right now, these two databases are not connected very well. Sure there are connections between the two, but they really can’t be called integrated. Oh, and neither of these are web enabled.

Both apps are fairly complicated and there probably isn’t anyone here that can say they know the app inside and out. I’ve been looking at these things for weeks and am totally baffled how it works at all!

In any case, the data is what I’m really after. I am not really trying to bring the app to the mobile web with all its functionality, I just want to make the data in it available to staff while they are on the road.

Simply stated, I’m going to build a mobile app for a notes database. I’m going to start with a pretty complex set of databases and bring them to a mobile phone. My goals and materials should be pretty typical for what most people are likely to have lying around - Lotus Notes db that is very old (10+years), very complex (hundres of views, forms and fields), and very large (1 gig+). The goal will be to distill the business functions down to a level that makes sense for a mobile version of that app, yet still provides the user with what they need. I’m also going to try 3 different approaches to the problem and explore the pluses and minuses of each. The first approach will be to work with out of the box stuff - ie XPages.

One more thing. I’m not a web guy and I’m not really a Notes guy either. I know enough about both to be dangerous and to know what to search for in google.