My First APEX Plug-In – Color Picker.
For anyone who does not know by now, APEX 4.0 has been released. And if you have not yet downloaded and upgraded, I say, “What are you waiting for?!?!?!”. Click here NOW and download it. I’ll wait. *insert jeopardy music here*. Ok, done? Great!
There are a ton of new features in this release. One of the most significant ones are Plug-Ins. In a nut shell, Plug-Ins give you, the APEX developer, to ability to extend the APEX development framework with custom item types, region types, and process and dynamic actions.
I finally got around to playing with them and lets just say I am impressed. At first, the idea of writing Plug-Ins seems daunting, but after playing with them for an hour or so, it did not seem so hard. It’s easy to take the example supplied with the sample application and and use it as a outline to make your own. In fact, that is exactly what I did to make my first item Plug-In. I encourage you to do the same. You can also grab my Plug-In and see what I did as well.
In prior APEX releases, if you wanted to include a jQuery plugin on your page, you would have had to embed all the code into the page itself. And there are many different places to include that code. Each developer does it a bit differently. I know myself, I was not very consistent going from page to page within the same application. This made for maintenance nightmares. Plug-Ins fix all of that.
The Plug-In I built was a color picker. I know APEX already has one, but let’s face it, it’s so Web 1.0. I felt it needed a face lift. But I kinda cheated. I did not write one from scratch. Well to be completely honest, I did not write any of the JavaScript code for this color picker. I downloaded a jQuery color picker called Farbtastic written by Steven Wittens and built an APEX Plug-In with the apex_plugin, apex_javascript, and apex_css APIs. And that is what is so powerful about this Plug-In framework. Among other things, it allows you to leverage code and jQuery plugins in APEX natively. So, now I can use my Plug-In on any page of my application as easily as I could use any other item type in APEX. It’s listed right there in the item type select list with textbox, date picker, shuttle, … and the rest of the default item types.
You can check out my color picker Plug-In and download and install it yourself.
Christopher,
Thanks for saying it’s probably easier to write one of these than at first blush. I’ve played with V4, but haven’t delved into these yet. Nice little tool you’ve written! The interface looks very cool. I’ve used a jquery control in an app I did last year, and it’s wasn’t a walk in the park and I probably did it differently than you would have. Seeing that you’ve done that integration here has me thinking that building plug-ins to call some of the popular jquery controls would greatly benefit the Apex community.
BTW, I found a small typo in this sentence “So, not I can use my Plug-In on any page of my application as easily as I could use any other item type in APEX.” I would have written privately, but couldn’t find your email address here.
Exactly. I see many of the popular jQuery plugins turned into APEX Plug-Ins.
Wow, only one typo. I’m ahead of the game in this post
Thanks for pointing it out.
Nice work!
You should make a popup using jQuery Impromptu to display the color picker.
Christopher,
Nice Plugin, you can add it to http://www.apex-plugin.com, an internet repository for APEX Plugins maintained by the “APEX community”
Thanks for reminding me. I meant to add it there as well when I first blogged about it, but forgot. It’s up there now.
Nice work!
Thank you sir.
Nice plugin.
Very interesting tool, Excellent work and Nice looking. Many thanks, really great effort.