Archive for the ‘Web 2.0’ Category

WebCenter Suite Real Time Chat – Mobile (Android, RIM, iOS, Windows)

October 25, 2012

As our continued drive to improve the WebCenter Suite I’m happy to announce that Fishbowl Solutions WebCenter Mobile Real Time Chat integration is soon to be released supporting Android, RIM, iOS and Windows Mobile Devices.

No true tablet application support yet but this is on the roadmap (you can use the mobile app on the tablets today or if your site has been optimised for tablets access chat via the integrated browser solution).

If your not familiar with our WebCenter Messging and Presence integration here is a quick rundown of it’s features.

Supports browser messaging integration with the WebCenter Suite – Portal, Sites & Content. There are no requirements to have a messaging XMPP server ie MS Lync setup; however if you do our solution can integrate with a number of messaging solutions ie – MS Lync, gTalk, etc.

For a preview of our browser integration check out these earlier posts

Addon:: WebCenter Portal Spaces Real Time Chat Instant Messaging and Presence Integration Video.

WebCenter Portal Spaces – Real Time Messaging & Presence Solution.

Oracle ADF Mobile released today!

October 22, 2012

Thats right the press release went out this morning (Here).

Overview
Oracle ADF Mobile is a HTML5 and Java-based framework that enables developers to easily build, deploy, and extend enterprise applications for mobile environments, including iOS and Android, from a single code base. Based on a next-generation hybrid mobile development architecture, Oracle ADF Mobile allows developers to increase productivity, while protecting investments, by enabling code reuse through a flexible, open standards-based architecture.

Oracle is committed to ADF Mobile driving innovating and delivering cutting-edge mobile capabilities across the enterprise, Oracle Applications are planned to be built with Oracle Application Development Framework (ADF), part of Oracle Fusion Middleware.

 

 

Check out the latest data sheet here to find out more on ADF Mobile.

Also hit  Oracles Mobile ADF site here to get the latest samples and info on ADF Mobile.

 

WebCenter Oracle Social Network Challenge – Fishbowls Mobile GeoTagging Solution.

October 5, 2012

Last week I entered the Oracle Social Network Challenge that was held at Oracle Open World. Unfortunately I couldn’t attend the event this year but that didn’t stop me from entering.

The goal of the Challenge was to build something that solves a business problem using Oracle Social Network; its Public API and another service or application.

Fishbowls Mobile GeoTagging Solution.

My proposed solution was to design and simplify GeoLocation mapping, and automate updates for users and teams on the move; who don’t have access to a laptop or want to take their ipads out – but allow them to make quick updates to OSN and upload photos taken from their mobile device – there and then.

As part of this; the plan was to include a rules engine that could be configured by the user to allow the device to automatically update and post messages when they arrived at a set location(s). Inspiration for this came from on{x} – automate your life.

For more info on how I built the app plus access to the viewlet and more screenshots read on..

(more…)

jQuery Customizations for WebCenter

September 24, 2012

jQuery has become a staple for a lot of the customizations in WebCenter Content. In fact, I can’t think of a customization over the past couple years that I haven’t used jQuery in some form. I’ve outlined below a few of the basics to get jQuery running on your content server and a couple examples on how we use it. For those of you mumbling “jQuery is just javascript”, well you’re right, but who in the world would pick an axe to cut down a tree when you’ve got a perfectly good chainsaw to do the work for you? Javascript is still great for the little stuff, but jQuery is a much better toolbox.

First things first, you need a place to include your jQuery and you customizations. We generally create a brand new component, which I won’t cover here, but you’ll find all the  information you need at oracle.com. You’ll also need to download the latest and greatest jQuery here:

http://www.jquery.com/download

After downloading the jQuery source you’ll need to put it on the server so the client can access it. We usually store these files with the component we create to allow easy access.
Once you’ve created your new jQuery customizations component you’ll simply need to overwrite the std_html_head_declarations like so:

<@dynamichtml std_html_head_declarations@>
<$include super.std_html_head_declarations$>
<script type=”text/javascript” src=”js/jquery-min.js“></script>
<@end@>

You will need to make a few small changes to setup the source highlighted in red, but this is pretty straight forward. (it’s the location of those jQuery files you’ve just downloaded)

Now that all the pieces are in place to use jQuery, let’s move on to some quick and easy customizations.  Say you have a pretty basic UCM check-in screen: Content ID, Title, Author and any other information you need for a standard check-in. This is great, but your users don’t follow the standard you’d really like them to follow for Titles. This can be difficult to regulate and the default profiles and rules just don’t cut it. With jQuery, we could simply add the following code and it would pop-up a message when the user clicks on the title field:

$(document).on("click", "input[name='dDocTitle']", function(){
     alert("Please make sure to add ‘FB_’ to the beginning of 
     your titles.");
});


While this may look confusing the code is very straight forward. It basically states that when the document is ready for check in, add a click event to the dDocTitle input, and when this click event occurs send an alert to the user. With such a minimal amount of code we were able to let our users know they need to structure their titles to start with ‘FB_’.

This is great and almost everyone is following the process, but they are getting really frustrated with all the alerts. Here is some code to check if they have added the ‘FB_’ and alert them if they haven’t:

$(document).on("focusout", "input[name='dDocTitle']", function(){
     if(jQuery(this).val().substr(0,3) !== "FB_"){
          alert("Please make sure to add 'FB_' to the beginning of 
          your titles.");
     }
});


With just a simple if statement to check the beginning of all our clients values when they focus off the item we can alert them of their mistake. To take this one last step further, we can add the ability to check for the correct value. If it’s not there, it would be added instead of warning our users by simply adding this section inside of the ‘if statement’ above:

$(document).on("focusout", "input[name='dDocTitle']", function(){
     jQuery(this).val("FB_" + jQuery(this).val());
});


While regulating what our users enter can be very difficult in most situations, jQuery makes regulating this easy. On top of that it removes any server side work which can take a lot of expensive resource time for even the simplest validation. I encourage you to give jQuery a try and see what other solutions you can come up with.

Introducing WebCenter Portal Spaces HTML5 Template Support

September 8, 2012

When designing and coding sites, I like to keep ahead with latest coding standards and best practises whilst still maintaining support for older browsers that don’t yet have support for new tags or functionality that are available today in the latest browser releases. I’m not talking about nightly release support but browsers that have been fully tested and have been an official releases for at least 6 months.

As we know ADF is putting in HTML5 support into it’s latest PatchSets just take a look at DVT graphing for example that uses the HTML 5 <Canvas> tag.
Now; how does that work with Internet Explorer? Well they use a fallback to Flash as a lot of html5 tags aren’t supported by IE.

This is great!.. I can create my own TagLib to detect the browser and put in fallback support.

But what if you are a webdesigner with no knowledge of how to create your own tagLib and develop a html based template for WebCenter Portal or Spaces, that incorporates new functionality new tags unsupported by older browsers??

There is a Solution!
First “HTML5 Shim” also know more popularly as “HTML5 Shiv” coined by the jQuery Guru John Resig  .

Whats the difference..

Answer: nothing, one has an m and one has a v – that’s it.

So what do they.. … … it.. … Do?
They are really a polyfill for browsers that do not support HTML5 tags.
I’ll come back to Polyfills later..

So essentially it’s a script that applies support for tags like <header>, <nav>, <figure> etc that make up html5 incorporating the correct styling and functionality.

Now when I create simple html5 based templates I incorportate Modernizr.
Modenizr includes html5 shiv/m but also provides detection on the browser for CSS3 and HTML5 elements handled all within Javascript..
This allows me to write CSS or Javascript files that can easily provide support or clean degredation for incompatible features.

Also you can choose to include the yepNope.js conditional loader that will load in polyfils to supply support for functionality not currently within a browser like localStorage..

Ok, but what is a polyfill?..

Simply a JS Library that integrates support for older browsers that don’t support the latest and greatest additions that are available in todays browsers.
Click here to check a list of polyfills that are available today!

One thing to note.. Although <canvas> makes up html5 it is not supported by html5 shiv/m and therefor requires a pollyfill fallback to something like flashCanvas or excanvas.

If your interested in the history of HTML Shiv/Shim Modernizr check out another Gurus Blog Paul Irish know for his HTML 5 Boilerplate.

Thats it.
Have fun incorporating and playing with Modernizr and Polyfills..
A Word of warning:: although I know Modernizr plays well with ADF I cannot guarentee that some of the polyfill addons will work..