Roels Blog

The fourth part of this series of posts will cover Notifications . When you are a user of GMail and using Chrome, you probably are familiar with those little boxes that popup when you've got new mail. Those type of notifications you can create in your APEX application as well - using HTML5! Alas, at this moment, these type of notifications only work in Chrome. In Firefox you can add this extension so it'll work in that browser as well. The other ones will follow - sooner or later... You can also use this plugin that mimics this feature - to be safe on every platform, but that one will appear in your browser, so that's not a desktop notification. But how do you create a real desktop notification? As usual with HTML5, you just need a few lines of code. The code below is executed in a Dynamic Action when a button is pressed: function RequestPermission (callback) { window.webkitNotifications.requestPermission(callback); } function showNotification(){ if (window.we...

Location, location, location, it's all about location... Probably one of the most frequently used HTML5 features is geoLocation. Why? Because it is very easy to use and cool too! You can check the corresponding example page on  http://apex.oracle.com/pls/apex/f?p=22115:GEOLOCATION . So how does that work? In fact it is just a few lines of code. First include the Google Javascript API ( <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script> ). The next step (on Page Load) is to actually get the current position of the browser device by if (navigator.geolocation) {   navigator.geolocation.getCurrentPosition(showLocation, handleError); } else {   error('GeoLocation is not supported in this browser'); } Where   showLocation  specifies the callback method that retrieves the location information. This method is called asynchronously with an object corresponding to the  Position  object wh...

As promised in the previous post in this series , this one will be about Web Storage. Before the HTML5 era, you could store information on the client (browser) using a cookie. But that has two disadvantages (or limitations). First of all, a cookie's size is limited to 4096 bytes (but that differs over the different browsers and versions) and secondly - even more important - is that a cookie is always sent with every HTTP request, resulting in more data being sent over the wire. And that reduces scalability and decreases performance. Using HTML5 you can use another type of storage, or even two types: sessionStorage and localStorage. In most browsers the storage is limited to 2.5Mb, but some go up to 5Mb or even unlimited. See this page for all limits per browser. And it is important to know that sessionStorage lives as long as your browser/tab is open - and is deleted on close, while localStorage stays on the client - even after a shutdown of the machine.  In a storage onl...

Recently I did a presentation with the title " 5 cool things you can do with HTML 5 ". I even did that presentation 3 times within a week: OUG Ireland had the premiere, then OUG Norway and OGH APEX Day as the last one of the week. I've planned the same - or similar - presentation for the upcomig Collaborate and OUG Bulgaria conferences. As the most stuff I present is demo (the slide deck is just 5 pages), people frequently ask whether I could write blogpost on one of the subjects. So why not create a sequence of 5 posts....that should make sense. So this is that first of five posts. I hope, not promise, to finish it within a week or two... Cool thing 1 - Input Types With HTML5, you can use both new Input Types as well as additional Attributes. New Input Types are  URL, email, number, search and more - see  http://www.w3schools.com for a complete list. The definition is very straightforward. In your HTML, replace type="text" with type="email...