Author Archive

The new iWebkit Pediaphon interface for Android, iPhone, iPad and iPad

Friday, June 24th, 2011

The HTML5 audio tag is supported by iPhones, iPods and iPad since IOS3. Android supports HTML5 audio since version 2.3 gingerbread too. I was curious if the shared base of the browser in both worlds is usable to create a unique touch based interface for a web based application like the Pediaphon. Most of todays mobile web browsers (Android, Nokia S60, Palm Pre, Openmocko, … ) are relying of the free and open source Webkit rendering engine. Initially developed as rendering engine for KDE-KHTML later adopted by Apple and nowadays supported even by Google (Chrome and Android web browser) Webkit is a lean but powerful rendering engine not only for mobile devices. If you are reading this blog with a Mac you are actually using the Webkit rendering engine. A really lean Webkit based browser for Linux/Windows I can recommend is Midori.

I am a great fan of the concept to prefer web based standardized applications to native apps for proprietary devices for e- and m-learning purposes. Development resources are usually rare especial at universities. It is always a good idea to focus on standard reusable HTML component rather than wasting time an effort for proprietary development app development.

My first idea was to use the multi platform sencha touch framework for the Pediaphon (a text-to-speech service for the Wikipedia) touch interface. A colleague pointed me to iWebkit, which is originally targeting the iPhone but it performs also nice on other Webkit-based browsers, like Androids stock web browser. It provides a IOS like touch interface to all Webkit-based browsers, the web page look an feel is exactly like a native iPhone app. For the programmer or integrator iWebkit is a lean and simple solution, even rudimentary HTLM knowledge is sufficient to use it.

Here the result, a touch interface for the Pediaphon, which converts Wikipedia articles into speech and realizes audio output just with the HTML5 audio tag, no plugin is required for IOS>=3 and Android 2.3 Gingerbread. For Android 2.2, which supports flash on some devices, there is still a flash option. The Pediaphon mobile touch interface offers 5 languages so far, of course English is included 😉 .

Screenshots:

Try it here: http://i-e.pediaphon.de

Enjoy!

HTML5 geolocation with Openstreetmap and OpenLayers for Android, iPhone, iPAD and iPod

Wednesday, March 30th, 2011

Since I am very interested in the HTML5 geolocation feature and Openstreetmap (with the help of the great Openlayers project), I have coded a minimal solution for Android and iPhone in july 2010 (my blog in German language). Because of the large amount of Google hits I have embedded the example in an iframe into my blog now:

Try this link to use the map directly on your Android/IOS phone.

This example realizes a simple map with a marker at the users position in a webkit-based smartphone web browser. It can easily be extended to a simple moving map. It’s like Google maps mobile without Google (not really, runs on Android too and the embedded location provider in your Firefox PC browser is also Google. Believe me, just open about:config and filter for geo.wifi) 😉 And it is platform independent! Works perfectly on Android, iPhone, iPod touch and iPad too.

Here is the minimal source code for the example:

 
<html>
  <head>
    <title>HTML5 geolocation with Openstreetmap and OpenLayers</title>
    <style type="text/css">
      html, body, #basicMap {
          width: 240;
          height: 320;
          margin: 10;
      }
    </style>


    <script src="OpenLayers.js"></script>
    <script>
      function init() {
        map = new OpenLayers.Map("basicMap");
        var mapnik = new OpenLayers.Layer.OSM();
        map.addLayer(mapnik);
                        

        navigator.geolocation.getCurrentPosition(function(position) {       
            document.getElementById('anzeige').innerHTML="Latitude: " + position.coords.latitude + "   Longitude: " +
            position.coords.longitude + "<p>";
            var lonLat = new OpenLayers.LonLat(position.coords.longitude,
                                    position.coords.latitude)
                      .transform(
                                  new OpenLayers.Projection("EPSG:4326"), //transform from WGS 1984
                                              map.getProjectionObject() //to Spherical Mercator Projection
                                            );
                                            
            markers.addMarker(new OpenLayers.Marker(lonLat));
           
            map.setCenter(lonLat, 14 // Zoom level
            );
           
        });
        //map = new OpenLayers.Map("basicMap");
        //var mapnik = new OpenLayers.Layer.OSM();
        //map.addLayer(mapnik);
        map.setCenter(new
        OpenLayers.LonLat(3,3) // Center of the map
          .transform(
            new OpenLayers.Projection("EPSG:4326"), // transform from WGS 1984
            new OpenLayers.Projection("EPSG:900913") // to Spherical Mercator Projection
          ), 15 // Zoom level
         );
        var markers = new OpenLayers.Layer.Markers( "Markers" );
        map.addLayer(markers);
                             
            
      
      }
    </script>

  </head>

  <body onload="init();">
<center>
HTML5 geolocation: 
<br>
    <div id="basicMap"></div>
<br>HTML5 geolocation<br>
<br>with Openstreetmap and OpenLayers<br>
For Android Froyo,iPhone,iPAD,iPod
<br>
Your position estimated by browser geolocation API:<p>

<div id="anzeige">(will be displayed here)<p></div>
<a href="http://www.dr-bischoff.de">Andreas Bischoff</a>

<br>(view source to see how it works ;-)
</center>
  </body>
</html>

Update: There is a new version with moving map available, view the source code on my German blog.

Long awaited feature: HTML5 audio support in Android 2.3 gingerbread

Monday, February 21st, 2011

A long awaited feature: The Android 2.3 gingerbread webkit browser supports HTML5 audio naively like Apple iPad and iPhone!

Tested with the Pediaphon service on an emulated gingerbread device. On selected Android 2.1 and 2.2 devices like the Archos internet tablet 7.0 there is flash based audio support for the Pediaphon site too, but finally Android supports HTML5 audio naively.

android gingerbread supporting HTML5 audio in emulator

The Pediaphon at the CeBIT 2010 fair, Hannover, Germany 2.-6.3.2010, hall 9 / booth D06

Wednesday, February 17th, 2010

I am proud to announce that I will present the Pediaphon at the
CeBIT fair(Germany, Hannover 2.-6.3.2010, hall 9/booth D06) this year. I will present at the ‘Innovationsland Nordrhein-Westfalen’ booth, a presentation of all universities located in North Rhine-Westphalia. I will share my booth with the ‘mobile learning project’ of the University of Hagen (FernUniversität in Hagen). Because of the lack of time I will only be at the booth between 4th-6th March 2010.

At the ‘future talk” event I will present my work in a talk (Saturday, 6th March 2010, at 10.00, (hall 9, booth A30, German
language, I am sorry 😉

Six more languages – the Pediaphon now supports Polish, Czech, Dutch, Italian, Swedish and Portuguese

Monday, April 27th, 2009

I am very proud to announce that six new languages are now supported by the Pediaphon, the computer generated speech interface to the Wikipedia:

  • Polish (Polski),
  • Czech
  • Italian (Italiano)
  • Swedish (Svenska)
  • Portuguese (Portugues)
  • Dutch (Nederlands)

Try it here.

Watch out for more languages! Coming soon!

Have fun!

Ballad of Wiki by Teru – the Pediaphon as a singer in a mix at ccmixter.org

Monday, March 3rd, 2008

I am very proud to announce that Pediaphon is now part of a piece of art!
Teru, a musician living in
Vancouver, Canada used the voice of the English language Pediaphon in a
song. The voice
is originally a British English male voice (known as ‘Roger’s voice’) from
the Mbrola project.
The very impressive song is
available at ccmixter.org, a cool site which provides musicians with samples released under creative commons licence. The title of the song is ‘Ballad of Wiki’.

Thank you very much Teru!

Don’t miss Teru’s other mixes at ccmixter.org!

The Pediaphon in Spanish language

Tuesday, February 12th, 2008

I have just released a Pediphon version for the Spanish language Wikipedia. The Spanish language version is still beta, but support for talking large numbers was added. Phone access to the spanish version is still a todo.

Try the the Spanish language version here!

Pediaphon as a location based service

Tuesday, February 12th, 2008

English Web version released!

Let your computer read out the Wikipedia article that fits best to your location! Use Wikipedia as a talking guide!

To extend the features of the Pediaphon service to a location based service some information about the users position is required.
The proposed approach assumes that the user is equipped with a GPS receiver, a cell phone or knows a least some address data of his location. In cases, where the user only knows some address
data, this information can easily be converted to GPS coordinates by the help of the Google maps API Web service. Even if only a PO.Box or city name is known, the Web service returns, relative to
the users real position, imprecise but nearby coordinates.

As a mobile user you can estimate your position with Google mobile my location without a GPS device! Unfortunately there is no open API to use it directly for external location based services like Pediaphon at this time.

With the help of a Web service at geonames.org it is possible to
get nearby geocoded Wikipedia articles of a given position. This approach is the so-called reverse geocoding. The Pediaphon location based service converts the given article to a spoken MP3 audio file on the fly for each position request. In a second step the
Web based Pediaphon service was enriched by a Google maps mashup. A Google map with markers of the users
position and the position of the geocoded nearby Wikipedia articles will be generated for each request, with the help of the Google maps API. Each marker provides on click a direct link to a
generated audio representation of the geocoded Wikipedia article. In case of an user equipped with a GPS receiver or cell phone (smartphone), this approach can be easily extended to an
automatic play back of the nearest Wikipedia article in case of a better fitting article with respect to user movements. This is the functionality of an automatic talking travel-guide in an unknown environment (e.g. a tourist guide).

Try the location based Pediaphon service here.



Google map mashup (satellite
view) with Pediaphon markers.