Random Insights into Oracle

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!

Monday, December 14, 2009

Another Oracle APEX + Ext JS website

Munky (Ben Burrell) has just got his demo site up and running after a short delay caused by falling off a cliff!

He's very active in the APEX forums, so I'm looking forward to some interesting content in the new year.

Other APEX + ExtJS sites to follow:

Matt Nolan: e-DBA blog and APEX Plugin Registry demo
Tobias Arnhold: APEX at Work blog and APEX at Work demo

If anyone else has APEX + Ext JS demo sites running, please let me know.

Sunday, December 13, 2009

How to create a Loading Indicator...

CJ recently asked how to implement a loading indicator to hide the page layout changing regions into tab panels on my post Tabbed Regions in Oracle APEX using Ext JS.
While I use Ext JS to do it on my demo, here is how to do it using plain old javascript:

Create a div element which has width and height 100% at the beginning of your page.
Include an animated gif in a floating div to make it look like something is happening.
Include the rest of your page and javascript below the div.
Delete the div and image after a short delay using some javascript at the end of the page.

And here's the example html:

<html lang="en-au">
<head>
  <title>Page loading indicator</title>
  <!-- standard stylesheets -->

<style type="text/css">
/*Loading Indicator*/
#loading-mask{
  position:absolute;
  left:0;
  top:0;
  width:100%;
  height:100%;
  z-index:20000;
  background-color:white;
}

#loading{
  position:absolute;
  left:45%;
  top:40%;
  padding:2px;
  z-index:20001;
}

#loading .loading-indicator{
  background:white;
  color:#555;
  font:bold 13px tahoma,arial,helvetica;
  padding:10px;
  margin:0;
  text-align:center;
  height:auto;
}
</style>

  <script type="text/javascript">
      function removeElementById(el) {
          var node = document.getElementById(el);
          if (node) {
              node.parentNode.removeChild(node);
          }
      }
      function removeLoading() {
          removeElementById("loading");
          removeElementById("loading-mask");
      }
  </script>
</head>

<body>
  <div id="loading-mask" style=""></div>
  <div id="loading">
    <div class="loading-indicator"><img src="http://extjs.cachefly.net/ext-2.3.0/resources/images/default/shared/large-loading.gif" width="32" height="32" style="margin-right:8px;" align="absmiddle"/>Loading...</div>
  </div>

  <!-- include everything, including scripts after the loading indicator -->

  <p>Here is some content that will appear when the loading indicator has been removed.</p>

<script type="text/javascript">
    setTimeout("removeLoading()",250);
</script>
</body>
</html>

Thursday, December 10, 2009

Quickest way to delete unused templates in Oracle APEX

Best practice is to remove unused/unwanted templates from your application.
This encourages standardization in your application, which benefits both your users and developers.
It also reduces the size of your application.

But how to do it quickly?
APEX deliberately makes you delete them one at a time, a reasonable sanity check for novices.
But not very helpful if you know exactly what you want.

So here's how:

Export the theme
Use the splitter utility following instructions in apex/utilities/readme.txt
Comment out the unwanted templates as shown above
Import the theme from the sql command line.

And best of all, it's iterative, so you can repeat it as often as needed!

Note: It's not the quickest way - but it is the quickest supported way.

Thursday, November 19, 2009

Oracle APEX: Silly Developer toolbar tricks

At the AUSOUG National Conference in Melbourne on the weekend I presented on "Oracle APEX Themes and 4.0 Plug-ins".

The presentation was about creating a Theme in APEX from scratch, and just to make it interesting I did it using jQuery UI, and integrated the ThemeRoller into my theme.

Audience members were curious how the developer toolbar was moved into the header.

I blogged how to Move the Developer toolbar with ExtJS back in 2008, but since learnt an even easier way - CSS:

table[summary="Developer Toolbar"] {position:absolute;top:10px;left:25%;z-index:1000;}

This positions the toolbar 10 pixels from the top, 25% of the way in from the left margin.

One of the audience members suggested copying it, so you could have 1 copy at the top of the page, and one at the bottom.
So, ditch the CSS, and use the following jQuery code to copy the toolbar to a div.

This time add the following div to the top of your page template:

<div id="topDevToolbar"></div>

Then add the following javascript into your page:

$(document).ready(function(){
$('table[summary="Developer Toolbar"]').clone().appendTo("#topDevToolbar");
});

Now you have 2 toolbars!