Google AppEngine + Cloud Storage

I am trying to build a simple application using Google AppEngine.

I want to take some content on the web and copy it into a location for processing.

So simply download Eclipse Luna

Add in the Google AppEngine API

Add in the Maven2Eclipse Plugin

Create a sample application.

 

Then when I try to reference Google Cloud Storage I get resolution errors against

com.google.appengine.tools.cloudstorage.*

So a quick Google indicates I need to add in the Client API.

Easily done by adding the dependancy com.google.appengine.tools (GroupId), and appengine-gcs-client (Artefact) to the POM file and rebuilding.

All the dependencies download into the Maven Dependencies folder.

BUT

When I deploy it – the obvious problem occurs – the libs have not be shifted across into war/WEB-INF/lib so the application fails.

Once I work this all out I will update.

 

Issues with Google Apps for Business Sites

I still cannot believe Google Apps for Business has so much Google advertising embedded. I am constantly struggling with their Sites footer, and more recently the footers added to every form published.

Each Sites page has the following system footer, after all optional entries are hidden.

Report Abuse|Remove Access|Powered By Google Sites

Additionally every form that is published or embedded has the following 3 lines added.

“Never submit passwords through Google Forms
Powered by Google Docs
 
I have raised this issue through Google Support and they have advised me that they have forwarded my “Feature Request” to the right department.
 
Lets be clear here – I have a website that I have built – it is my website and has my contact details and information on it.  If I am paying Google for a Business Account I do not desire or expect them to automatically add their advertising to everything single page.
 
I am now actively looking for an alternative service that gives me far greater control over my own web presence and will disable Google Sites as soon as I can.
 

AWS Elastic Beanstalk + DynamoDB + PHP API

Well this took some working out.

I simply wanted to stand up a PHP instance of Beanstalk but have it talk via the AWS API with DynamoDB. This sounds simple and a few attempts I ran into quite a few issues. The first challenge is that AWS does not bundle the PHP API in the PHP Beanstalk instance, so you have to do it yourself.

First the install guide is not very helpful.

e.g.

The AWS PHP API install documents point to the preferred install process Composer.

What this means is you have to both learn the AWS API ‘AND’ the Composer package process – requiring some context switching and research, without having something working out of the gates.

2.1 Create a ‘preDeply.sh’ file in the root of your application.

#!/bin/bash

curl -s “http://getcomposer.org/installer” | php php composer.phar

install /usr/bin/composer.phar self-update

What this does is downloads an install of composer, and then does an update on it.

This has been added here so that if the Elastic bit happens, any future AMI’s also inherit the setup of the composer and AWS API components. There are examples online where people have created custom AMI’s as an approach, but have not taken into account the ‘elastic’ bit.

4.1 Create a ‘bootstrap.php’ file in the root of your application.

<?php

require ‘vendor/autoload.php’;

?>

What this does is suppress errors if this line is entered into a page PHP file (such as index.php) which I am seeing in lots of sample applications. These I found were throwing errors such as.

… PHP Fatal error:  require(): Failed opening required ‘./autoload.php’ …

AWS Elastic Beanstalk

Today I have mostly been experimenting with Amazons Elastic Beanstalk.

I selected a simple PHP environment and found it very easy to setup, the immediate goal is to provide a framework for interacting with DynamoDB. The installation instructions are very straightforward. Initially I referenced the Git Deployment model for PHP which provides the main overview, but the real detail outlines what to download and how to configure the sample applications.

I hope to split the framework into 2 main parts, the user-space applications, which will be lightweight widgets, supported by an API WS framework.

So now I have a fully configured GIT installation for managing my code, and a test and dev deployment environment for managing my runtime.

 

SMS v Social

I recently did a quick survey of the trends in my own personal communications.  I noticed something interesting. I now communicate to my friends by default using social (Facebook / Twitter), however my fiance is the exception, I send a LOT of texts to her. This is typically because we are not always online, while SMS has a reasonable ‘time to read’, also I don’t want to share it with a group as it is personal.  However, when I then looked at my texts, the majority I recieve fall into 2 groups.

1. Two Factor authentication tokens that allow me access to my finantial services, email and other services, and I get a LOT of those.

2. Questionaires from Utility companies (BT, Virgin, Water) about the level of service they gave me after I called their call centre.

My mobile phones SMS facilities are turning into a critical channel for security and a secondary less useful channel for questioning my levels of satisfaction.  While I am on this subject there are then 2 major issues I encounter almost every day.

1. In Facebook if you change the visibility of a post, from friends [not acquaintances] to global, then any future posts will also be global. Even when setting a default (friends [not acquaintances]). I consider this a bug, and a leak in my privacy. #Facebook – fix it!

2. Apples SMS Messaging via iCloud is VERY BAD, sometimes messages take days to arrive, many times they NEVER arrive.

How are trends in your communication changing, and what trips you up?

Experiments with embedded browsers

I have been doing some research on how to best integrate SaaS and web based applications into the desktop. I work with a number of desktop Applications that do high performance graphic rendering on the client, but which benefit significantly from Cloud and web based data sources.

By using VisualStudio and C# there is a very simple control called WebBrowser, this embeds an IE (whatever version you have installed) into your form.

The browser then takes a single command to load a remote page.

webBrowser1.Navigate(new Uri(@http://server.com/path/geocoder.html));

When the page has fully loaded, the DocumentCompleted event is triggered. This simple example updates a status strip in the form to indicate the document has loaded.

Additionally it then seeks a certain tag with a given ID, and passes the contents to a Form specific event handler. This emans data returned from a web server can be passed into the desktop application.

privatevoid webBrowser1_DocumentCompleted(object sender, WebBrowserDocumentCompletedEventArgs e)

{

toolStripStatusLabel1.Text =“Document Complete”;

webBrowser1.Document.GetElementById(“Latitude”).AttachEventHandler(“onpropertychange”, delegate { documentFieldChange(); });

webBrowser1.Document.GetElementById(“Longitude”).AttachEventHandler(“onpropertychange”, delegate { documentFieldChange(); });

}

There are a few weaknesses.

If an asynchronous call is made via JavaScript, it is not possible to trap the event that the call has returned. Only page level events are triggered.

As such to handle true ‘asynchronous’ calls, consider having one visual WebBrowser control, and one hidden WebBrowser control in your form. 

When the first page loads then and ‘submit’ actions on the buttons in the form are captured and the ‘parameters’ (Via GetElementById)  are passed via say REST to the second browser URI. When this returns you can then trap the response. In this way you can mix a visual rendition (via HTML) and a computer readable (XHMLT / XML) representation in the same form.

OpenLayers + Dojo = Simple zoom control

As a quick test of the new OpenLayers and Dojo integration I thought I would take up the challenge of creating a simple zoom control using Dojo widgets. However that proved a little harder than I first thought.

1) You need to remember to add the OpenLayers library as it does not ship with Dojo.
2) You need a container to add the zoom slider too, how about a floating window.
3) Then need to work out the scales and set the slider to the map.
4) But remember the map object is wrapped.
5) As well as having a crazy z-index.

So here is a quick outline of how it was put together.

Create the HTML page

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />    
    <title>Test</title>
    <style>
        html, body { width: 100%; height: 100%; margin:0; padding:0; font-family:Sans-serif; font-size:12px; }    
    </style>

Add the correct script references.

    <script src="./OpenLayers-2.11/OpenLayers-2.11/OpenLayers.js" type="text/javascript"></script>        
    <script src="./dojo-release-1.7.1/dojo-release-1.7.1/dojo/dojo.js" type="text/javascript"></script>
    <link rel="stylesheet" href="./OpenLayers-2.11/OpenLayers-2.11/theme/default/style.css" type="text/css">
    <link rel="stylesheet" href="./dojo-release-1.7.1/dojo-release-1.7.1/dijit/themes/dijit.css" type="text/css">
    <link rel="stylesheet" href="./dojo-release-1.7.1/dojo-release-1.7.1/dijit/themes/tundra/tundra.css" type="text/css">

Also remember to add the stylesheets for the floating layers, otherwise bad things happen.

    <link rel="stylesheet" href="./dojo-release-1.7.1/dojo-release-1.7.1/dojox/layout/resources/FloatingPane.css" type="text/css">
    <link rel="stylesheet" href="./dojo-release-1.7.1/dojo-release-1.7.1/dojox/layout/resources/ResizeHandle.css" type="text/css">
  </head>

The rest of the HTML with the div that acts as the content for the floating layer, containing another div we will convert into a dojo slider.

<body class="tundra">      
    <div id="navDialog">
        <div style="width:100px; margin:auto; margin-top:5px;margin-bottom:5px;" align="center">
            <div id="verticalSlider" data-dojo-type="dijit.form.VerticalSlider"
            value="6" minimum="0" maximum="10" intermediateChanges="true" showButtons="false" style="height:200px;" name="verticalSlider">
                <div data-dojo-type="dijit.form.VerticalRule" container="rightDecoration" count=11 style="width:5px"></div>
                <ol data-dojo-type="dijit.form.VerticalRuleLabels" container="rightDecoration" style="font-size:75%;color:gray;width:40px;">
                   <li>Region</li><li>Area</li><li>Local</li><li>Postal</li><li>Street</li>
                </ol>
            </div>    
        </div>    
    </div>    

Also add in the map object, this will be full screen and the styles in the header mean we have no borders.

    <div id="map" style="width:100%; height:100%; z-index:10"></div>

Now onto the script

    <script type="text/javascript">
                require([ 
                "dojo/ready",
                "dojo/parser", 
                "dojo/domReady",
                "dojo/dom-construct", 
                "dojo/_base/window",
                "dojox/geo/openlayers/Map", 
                "dojox/geo/openlayers/Layer",
                "dojox/geo/openlayers/WidgetFeature", 
                "dojox/layout/FloatingPane",
                "dijit/form/Slider"
                ],
                
                function(ready, win, domConstruct, 
                        Map, Layer, WidgetFeature, Chart, Chart2D, Pie, blue,
                        FloatingPane, Slider, ComboBox, JsonRestStore, rpcJsonRest){                
                  var map;
 
                  ready(function(){
                    navDialog = new dojox.layout.FloatingPane({
                        title: "Zoom",
                        resizable: false,
                        closable: false,
                        dockable: false,
                        style: "top:10px; right:10px; opacity:0.9",
                        id: "navDialog"
                    }, "navDialog");
                    navDialog.startup();
                    navDialog.bringToTop(); 

Now lets setup the map control, note the over-ride of the z_index so the map sits under the floating layers.


                    // This is New York
                    var ny = {latitude : 40.71427, longitude : -74.00597};              
                    // create a map widget and place it on the page.
                    OpenLayers.Map.prototype.Z_INDEX_BASE.Control = 10;
                    
                    map = new dojox.geo.openlayers.Map("map");
                    layer = new dojox.geo.openlayers.Layer();
                    map.addLayer(layer);
                    map.fitTo({
                      position : [ ny.longitude, ny.latitude ],
                      extent : 0.1
                    });

This section sets up the slider, and the 2 events one that triggers on a change in the slider value, and the other if the map is zoomed using the mouse roller. Note the wrapped map object “map.getOLMap()”.


        
                    var zoomSlider = dijit.byId("verticalSlider");
                    zoomSlider.maximum = map.getOLMap().getNumZoomLevels()-1;
                    function updateMapZoom() { map.getOLMap().zoomTo(Math.round(zoomSlider.get("value"))); }
                    function updateSliderZoom() { zoomSlider.setValue(map.getOLMap().getZoom());}
                    map.getOLMap().events.register("zoomend", this, updateSliderZoom);
                    dojo.connect(zoomSlider,"onChange",updateMapZoom);
                    updateMapZoom();

                  });
                });

        </script>
    </body>        
</html>

Dojo and the JsonRestStore, adding custom parameters

I have been working on a really simple suggest address search component. The ComboBox backed by a REST Store seemed the best way to go, so as the address was typed, the candidates would be suggested. However I quickly ran into 2 problems.

1) The response from the JSON query that I was making has the following construct:

{"Output":[{"Data.AddressLine1":" HIGH STREET, WINDSOR, SL4 6AX", ... ,"PostalCode":"SL4 6AX","user_fields":[]}]}

This means I need to accommodate the “Output” object in the response, as the JsonRestStore expects the response to be:

[{"Data.AddressLine1":" HIGH STREET, WINDSOR, SL4 6AX", ... ,"PostalCode":"SL4 6AX","user_fields":[]}]

By examining the JsonRestStore methods, it was clear the _processResults provided a method of managing how the response was parsed. Providing an over-ride of this method sorted out the issue.

var addressStore = new dojox.data.JsonRestStore({
target: "http://localhost:8080/rest/OnDemandAddressWrapper/results.json"
});
addressStore._processResults = function(results, deferred)
{
results = results.Output;
var count = results.length;
return {totalCount:deferred.fullLength || (deferred.request.count == count ? (deferred.request.start || 0) + count * 2 : count), items: results};
}

2) I needed to add additional parameters such as the country that was being searched. This turned out to be a little more difficult as the links between the ComboBox and the Store were very tightly coupled. A custom service may be required. However the custom services are complex and there is very little documentation. So the next best option is again over-riding the single method required.

Because this method is complex, it was a matter of wrapping it instead of replacing it:

var orig_getRequest = addressStore.service._getRequest;
addressStore.service._getRequest = function(id, args)
{
args.query["Data.Country"] = "GBR";
return orig_getRequest(id,args);
}

This adds the property “Data.Country” with the value “GBR” to the outgoing request.

It took me a while to work this out, hopefully this posting will save somebody a little time. However this is not the correct approach, the correct method is to use a Service object. However I cannot find a good example of adding custom properties and handling cutom responses. I would much prefer proper extension methods that can be over-ridden in the JsonRestStore directly.

Pitney Bowes Software, Kickoff 2012 – Social Media Tool Choices?

I am travelling to the annual Pitney Bowes Software 2012 kickoff and I have a couple of social media app tool choices to make. I have a selection of applications available to me that are all linked in various ways.

– Public
Twitter is good for publishing quotes and interesting questions into the public domain, these cascade to Facebook, LinkedIn and Yammer (with the #yam tag) automatically.

WordPress provides a good channel for larger public facing posts, it also automatically updates and links into Twitter, which in turn updates Facebook and LinkedIn.

Facebook is a good for updating friends on personal things during the event, such as “check out the picture of the view from my hotel room”. I also use this to keep track of my locations and let family know how my travels are progressing.

– Business
Yammer is available to all Pitney Bowes employees and I have well over a 1000 follower on this channel. It is good for posting short updates into the business domain.

SharePoint Blog is a great place to post large content such as meeting minutes, or notes from presentations, but cross linking into other channels is very manual.

Chatter is a recent addition, but the audience is limited to people who use SalesForce within the business.

So I think it’s going to work like this …

– Public
Short quotes and interesting public snippets will go to Twitter (auto linked into yammer with #yam)
Larger public facing updates in the event summarising events will go to WordPress.

– Personal
Facebook is the channel of choice.

– Business
Short quotes and interesting snippets will go to Yammer by default as the audience is much larger then retrospectively into Chatter.
Larger summary and presentation notes will go on SharePoint, cross linked into Yammer, then retrospectively to Chatter.

There is defiantly scope for a tool that can post to single locations and then provide the appropriate cascade and cross linking into other channels. However not all of these applications have trivial APIs. For example posting to SharePoint, Chatter and Yammer is poorly cross linked unlike public services such as Facebook, LinkedIn and Twitter. There is still some way to go in the Business app world to link everything together.

The Internet of Things

Today I met with an organisation that provides communications infrastructure. The discussion quickly came to areas of hot debate around the Internet of things and to what degree that domain is developing and the trends that are emerging.

There was an interesting balance in how the metaphors were explained. The discussion rocked between “we can tell everything you are doing” to “but privacy is important”, I found myself developing a split personality.

However where it got interesting was when the discussion came to integrating mNy different systems. We are sat in a restaurant, they have a point of sale, a security alarm, lighting, heating and yet today all of these systems are separate. I recently encountered the same issue when designing my home cinema, how do I link my TV, with my xbox, and my blue ray player. My solution to date has been a universal remote, but this does not let me connect my PC to my telly, stream audio to the bedroom and integrate my surround sound system.

Each vendor wants to lock you in, and in doing so limits my ability as a general consumer to achieve something which should be common practice today.

Even open systems such as Android lock in, for example in the secure payments space (Google checkout / wallet).

It would be interesting to determine how much time people spend working out how to restrict people doing things, over the time spent helping people exceed their potential.

In the near future machines will have greater privacy than peopole, will be able to control more things than people (electricity, heat, financial transactions .. ) and we will be outnumbered 100-1.

I will let you know if I solve my Home Cinema problem 🙂