Tuesday, December 21, 2010

Plugin: Re-sizable columns and save preferences

A very quick post, with an example of an APEX GridPanel Plugin used to convert a APEX Standard Report into an ExtJS GridPanel.


The Plugin implements the following functionality:

  • drag-and-drop to re-arrange columns
  • check-box menu to show or hide columns
  • resizable table to change width
  • resizable columns
  • save settings and restore defaults.
IE has a nasty habit of caching the page, so make sure you do a refresh to retrieve the saved layout.

Full details of how to implement are in chapter 9 of my book Oracle Application Express 4.0 with Ext JS

Tuesday, December 14, 2010

Illumination for Developers

Just wanted to let people know about an awesome Firebug addon called Illumination for Developers created by Steven Roussey.


It makes Firebug know about ExtJS components and it's an absolute gem.

In this screenshot from Steven's blog you can see the Ext components on the left, and their properties etc on the right.

Currently it supports ExtJS, Sencha Touch, Dojo, SproutCore with plans for qooxdo, jQuery UI and YUI.
It's early days for it's development, and it will be a commercial product, but looks like a great addition for your toolbox.

BTW, I have no affiliation with the product and don't know Steven. I'm just impressed with the concept.



Wednesday, November 3, 2010

Book "Oracle Application Express 4.0 with Ext JS" released


I'm very pleased to announce my book "Oracle Application Express 4.0 with Ext JS" has just been released as a RAW book by Packt Publishing.

RAW simply means the book is still being written, with 8 of 11 chapters completed so far. You're getting access to new chapters as they are being completed, in an unedited format.

A RAW book is an ebook, and this one is priced at 40% of the usual eBook price. Once you purchase the RAW book, you can immediately download the content of the book so far, and when new chapters become available, you will be notified, and  can download the new version of the book. When the book is published, you will receive the full, finished eBook.

For details on the book visit the Packt website.

If you're not familiar with Ext JS, take a look at the Sencha website.

APEX combined with Ext JS allows you to create visually impressive web applications easily. Integrating the Ext interface into a APEX theme and powerful widgets as APEX Plug-ins allows you to give your users a much richer Web 2.0 desktop experience.

Writing the book has been an opportunity to revisit every aspect of integrating the two technologies, with the benefit of over 3 years experience combining the two.

My knowledge has deepened along the way, and I'm happy to be able to share what I've learnt with you.

Friday, October 29, 2010

Why do go to conferences?


One of the really nice things about working with Oracle APEX is the sense of community you gain through the forums with people scattered all over the globe.

Attending OpenWorld this year was a great opportunity to met face to face with several members of the APEX development team and APEX enthusiasts after communicating with them via forums and emails. It's really surprising how much personality comes through in the written word.

One of the strengths of APEX is how accessible the APEX development team is to the community. When you visit the APEX stand in the exhibition hall, the people manning it are from the APEX development team - you just can't get better information than directly from the person who developed the functionality.
They really are interested in your feedback and making APEX better. 


Leading up to OpenWorld I had contacted some of the team members asking for a small enhancement for Plugins.
A few emails later, they had agreed to include the functionality in a future release.
Catching up with Patrick Wolf at the APEX booth, we talked a bit more on the subject with a couple of different approaches, before landing on a final solution.

Anyway, I'm looking forward to the 4.02 patch which includes my enhancement request - bug# 10157646.


So that's why I go to conferences - to meet up with people I know online, talk shop, share ideas, and learn new stuff I can use at work.
How about you? Why do you go?


The next conference I'll be going to is the AUSOUG 2020 Conference in Perth, Australia on Nov 22-23.


Maybe I'll see you there.


Sunday, August 15, 2010

Extend APEX 4.0 JS using trigger events

APEX 4.0 has introduced JavaScript "trigger events" such as apexbeforerefreshapexafterrefresh and apexbeforepagesubmit.
I'm using them to show a "loading" mask on regions when Partial Page Refresh (PPR) is enabled by clicking on the next rows button, or clicking on the heading to sort by a column.
You can see a live demo of Over-riding APEX JS and using APEX event triggers.
The JavaScript to add this effect is very brief, but there's a lot of concepts to understand.
To implement just copy into your application's JavaScript.

// Copy the APEX function to a new name, so we can override the original.
var apexInitReport = initReport;

// Extend the APEX function by over-riding with our own version and adding functionality
initReport = function(pRegionID, pInternalRegionID, pStyleMouseOver, pStyleChecked) {
   // we can call still call the original (renamed) version to use the existing functionality
   apexInitReport(pRegionID, pInternalRegionID, pStyleMouseOver, pStyleChecked);

   // APEX wraps PPR regions with a DIV with id report_xxx_catch, xxx being the region number
   var c = 'report_' + pInternalRegionID + '_catch';

   // proceed if the PPR region exists
   if (apex.jQuery('#'+c).length) {
      // find the parent DOM node for the PPR
      var p = apex.jQuery('#'+c).parent();

      // Add a bind event to the parent, since the wrapper is deleted on each refresh action.
      // This uses jQuery "live" binding, taking advantage of event bubbling up the DOM hierarchy.
      // ExtJS has more a advanced Event handler.
      apex.jQuery(p).bind('apexbeforerefresh', function(){
          // add a mask when any PPR actions happen 
          // NOTE: this is using the ExtJS library, jQuery users will need to do more work here.
          new Ext.LoadMask(c).show();
      });

   }
}

Over-riding the original initReport function means I don't have to add a call to it in my pages - APEX already does that for me.
Another advantage is that it is automatically applied to all my PPR reports, regardless of what report template I use.

Those of you with sharp eyes will note the "Go to row" item in the bottom of the screenshot.
I've added extra functionality to allow me to jump to any row I like.
I'll be discussing this and other ideas at OpenWorld this year, as well as in my upcoming book on APEX 4.0 with Ext JS.

Sunday, February 28, 2010

APEX 4.0 joining the chorus for phasing out IE6


Good to see APEX 4.0 has joined a growing chorus of vendors phasing out support of older browsers such as Internet Explorer 6.
Of course, it's up to you to take up the message in your apps.

Facebook requires its users to upgrade to Internet Explorer 8 before creating an account and YouTube has announced that it will stop supporting IE6.

Google recently announced the phasing out of support for IE6 for for Google Apps, claiming "We’re following other companies that have done the same, like Twitter, Facebook and Microsoft for Office Web Apps."

Saturday, February 27, 2010

APEX 4.0 EA2: Improved debugging, my new favorite feature

Just started looking at EA2, and like very much the new improved debugging.

First of all it's now in a popup window, which is a really good move.
With web pages relying more and more on javascript to render page components and rearrange page layouts, the old "inline" debugging was no longer effective.

I love the performance graph at the top, you really can't miss what areas are taking the longest time to execute.
Hovering over an item in the graph, shows the step number and name, so it's very quick to diagnose potential problems.

APEX is really coming of age!


Thursday, January 21, 2010

Oracle APEX 4.0 + Ext JS = Happy Days



2010 is going to be a great year!

I've taken Oracle APEX 4.0 for a spin over the last couple of weeks having a look at the new plugins functionality.
So far I've really only scratched the surface, but like it very much so far.

After integrating Ext 3.1 into a theme, I created a couple of plugins following Patrick Wolfs' post on how to create a plug-in. You can see the result above.

What's really nice about it, is now we can define attributes for the plugin, which can be assigned to the page item, as shown below for the Spinner.



So now I can choose my "spinner" item type and define the attributes without having to write a single line of javascript. Nice!

The Application Builder incorporates nice touches with the "Settings" region also.
For the spinner example, I have set the "Decimal Precision" fields visibility to be dependent on "Allow Decimals" value being true.
Selecting false, automatically hides the "Decimal Precision" field.

So if you haven't already done so, register a workspace at http://tryapexnow.com and give Oracle APEX 4.0 a go.
The APEX team are looking for feedback and suggestions on how to make the product even better, and they really do use your feedback.

My New Years Resolution is to write a book on "Oracle APEX 4.0 with Ext JS".
I've already arranged a publisher, and the first chapter is well underway - but more about that in another post.


With the new plugins functionality in APEX 4.0 and the highly customizable components in Ext JS, you'll be building amazing web apps faster than ever. 


Like I said before, 2010 is going to be a great year!