OracleJET – Massive Open Online Course (22 Aug – 12 Sept)!

There are these times where really interesting initiatives surface. And to me Oracle’s Javascript Extension Toolkit is one of these. OraceJET in its essence is Oracle’s selection of a number of well-established Javascript libraries to enable rapid development of Javascript client-side applications. You could argue that already enough frameworks exists such as Angular.

But then: OracleJET is not yet another framework, but a modular ‘plug-in’ approach to building pure Javascript applications. If you prefer alternatives for modularization where OracleJET has opted for requireJS but you’d prefer Browserify instead? Or you feel more comfortable with React for two-way data binding instead of using Knockout? Feel free.

Take a step back, why is Oracle interested in building JavaScript applications? Well – traditionally Oracle build most of their applications using Application Developer Framework (ADF). Which resonates of course perfectly fine to Java developers. But to keep pace with Web development techniques, ADF has it’s limitations.

Just to take one key issue for Oracle today: accessibility. Each and every application’s UI should be fully accessible and compliant with WCAG standards. Now, complying with WCAG using ADF is not impossible, but if you consider the relative easy building fully accessible components using JQueryUI that sets back ADF significantly. Get the point?

Now Oracle developed OracleJET first-and-foremost as an internal toolkit, to enable rapid development of new UI’s. These UI’s should implement consistently Oracle’s standard Alta UI theme. And of course fully responsive. So Alta UI styling comes as default, responsive. Like with Bootstrap or Google’s Material-UI components – it allows rapidly developing an application. It gained so much internal success at Oracle (there are 100+ UI’s already developed through OracleJET) that Oracle decided to provide it for anybody to use and leverage. Not only customers, but everybody. So licensed under the Universal Permissive License.

This slideshow requires JavaScript.

Of course, Oracle customer are first-and-foremost targeted. Have purchased Oracle Sales Cloud, and seeking for an elegant way to develop a point-solution comprising a mobile hybrid native app? Sure. OracleJET provides full integration with Cordova for this matter as well as native integration with Netbeans as IDE.

So – what’s this Massive Open Online Course (MOOC) all about? It will crash-cours teach the fundamentals of OracleJET. Presented by OracleJET’s Product marketing team: John Brock and Geertjan Wielenga.

This slideshow requires JavaScript.

You will learn how to:

  • Apply basic JET principles to create Oracle JET application including JET modules, layouts and components
  • Apply more advanced JET functionality, including navigation, routing, validation, layouts, and responsive design.
  • Create hybrid mobile applications with Cordova in combination with Oracle JET.
  • Integrate with the world outside Oracle JET, e.g., JQuery components and the Oracle Cloud.
  • Deal with the remaining enterprise-level challenges, i.e., internationalization, accessibility, and security.

Register here.

Seeking the relationship with Siebel? Think Innovation Pack 2016. Think REST API. Matter of fact is, that using OracleJET we developed in matter of days a descent looking proof on concept, leveraging IP16’s REST capabilities.

– Jeroen

Advertisements

IP16 – Introducing… LogLevel = debug

loglevelsmallDuncan Ford pointed us to this tiny little enhancement. Alright, nothing very fancy. On the other hand, something essential you’d expect from your OpenUI development toolkit. IP16 introduces a client-side LogLevel. It has two states: “info” and “debug”. And well, Null defaults to “info”.

In conjunction, the SiebelJS pseudo-class now carries besides Log() and Trace() also a third method Debug(). If you want to instrument your code, but don’t want it to flood the console – go for Debug(). Only when SiebelJS.LogLevel = “debug” it will output to the console.

debugginconsole

– Jeroen

Siebel Premier Support +1 Year

Along with the recent release of Innovation Pack 2016, Oracle extended Premier and Extended support by one year. Refer to the Oracle Lifetime Support Policy for Applications. It further underlines Oracle’s commitment to Siebel customers – where other forces might try to diminish Siebel (…).

sblpremsup– Jeroen

OpenUI – Single Click Sort (The Sequel)

qsRead my post, from two days back? I left the Single Click Sort solution at a point where it was functional, but at the same time introduced a significant limitation. Limitation such, that the Column Lock/Unlock feature would be put at stake.

In the mean time, collaborating with my colleague Pedro Melo we tweaked the initial solution a bit. The setTimeout() function existing in the initial solution, had a wait of zero (0) milliseconds. That basically means, the call to the function() will be postponed until the browser is done, essentially to the point that there are no further function calls stacked in the browser’s message loop. An interesting Stackoverflow thread on this topic can be found here.  I typically set the timeout to zero, to force execution to wait until the browser is done. Often solves hard-to-tackle issues related with event bubbling. Like to learn more? Check this.

Well, we changed the setTimeout() to wait for 200 milliseconds. Why 200 milliseconds, you might ask? That will be the maximum time-span in which we will capture a ‘double click’ event. More that 200 milliseconds, and we will treat those mouse clicks as two individual clicks.

Added a dblclick event handler, and the sole thing it’s bound to do, is set a local ‘dblclick’ variable to true. After the 200 milliseconds have passed, the ‘stacked’ function will execute. Why? Because the browser also captured the click event. A true/native double-click will trigger both ‘click’ and ‘dblclick’ events. First the ‘click’ event will fire, second the ‘dblclick’. It’s kind of a hack, but it’s functional.

On touch devices, default functionality should prevail – the condition IsTouch() got added to by-pass the custom code conditionally. Alternatively, the same could have been done using a Manifest Administration expression – preventing the QuickSortPR.js to download at all.

What does the complete solution look like?

if (typeof(SiebelAppFacade.QuickSortPR) === "undefined") {
SiebelJS.Namespace("SiebelAppFacade.QuickSortPR");

define("siebel/custom/QuickSortPR", ["siebel/jqgridrenderer"],
function () {
SiebelAppFacade.QuickSortPR = (function () {

function QuickSortPR(pm) {
SiebelAppFacade.QuickSortPR.superclass.constructor.apply(this, arguments);
}

SiebelJS.Extend(QuickSortPR, SiebelAppFacade.JQGridRenderer);

QuickSortPR.prototype.ShowUI = function () {
SiebelAppFacade.QuickSortPR.superclass.ShowUI.apply(this, arguments);

if (!SiebelAppFacade.DecisionManager.IsTouch()) {
var dblclick = false;
var placeHolder = "s_" + this.GetPM().Get("GetFullId") + "_div";
var elSortable = $("#" + placeHolder).find(".ui-jqgrid-sortable");
var sort = $("li[data-caption='Sort']");

elSortable.on("click", function () {
sort.parent().css("visibility", "hidden");

setTimeout(function () {

if (!dblclick)
sort.click();
else
$("li[data-caption='Lock']").click();

dblclick = false;
}, 200);
});

elSortable.on("dblclick", function () {
dblclick = true;
});
}
}

return QuickSortPR;
}());
return "SiebelAppFacade.QuickSortPR";
})
}

Can grab the code from here also.

– Jeroen

 

Birth Of The DISA Code Template Generator

Oracle’s Duncan Ford did it again! Driving force behind the PM, PR and PW boiler-plate code generators as well (not to forget the OracleSiebel Git) – he crafted a refreshing life-hacking solution for Siebel developers. For DISA extensibility this time. Given the extensibility options DISA provides, having a tool which makes life easier will be well-received by many. Preventing the nitty-gritty work, but instead have an accelerated start for your DISA-based endeavors…!

Duncan proudly presents…

The DISA Code Template Generator

Not only does it generate boiler-plate for the relevant physical renderer and presentation model, it also generates boiler-plate Java code along. Not to forget a build script, and relevant Java manifest. Check it out!

This slideshow requires JavaScript.

– Jeroen

OpenUI – Single Click Sort

Got triggered by an internal discussion with some colleagues, to re-enable a single-click-sort solution. Came up with the below solution, which does work beautifully.

But with to major drawbacks:

  1. It disallows the column ‘lock’ / ‘unlock’ feature.
  2. It still sorts default in Ascending mode, where I’d like to have the option to specificy ‘Descending’ under certain circumstances.

Well – thought, just post the work-in-progress and elicit some feedback from the field (yes, you!). Posted the same sample code also on the OracleSiebel Git repository.

My first focus is on a proper solution that will somehow enable lock/unlock along side the single-click-sort. The path using a dblclick event handler led nowhere, because having two mouse events on the same element is simply no good. I had a quick look at overriding the context menu (right mouse) and instead displaying again the standard sort / lock popup.

Any takers :-)?

if (typeof(SiebelAppFacade.QuickSortPR) === "undefined") {

SiebelJS.Namespace("SiebelAppFacade.QuickSortPR");
define("siebel/custom/QuickSortPR", ["siebel/jqgridrenderer"],
function () {
SiebelAppFacade.QuickSortPR = (function () {

function QuickSortPR(pm) {
SiebelAppFacade.QuickSortPR.superclass.constructor.apply(this, arguments);
}

SiebelJS.Extend(QuickSortPR, SiebelAppFacade.JQGridRenderer);

QuickSortPR.prototype.ShowUI = function () {
SiebelAppFacade.QuickSortPR.superclass.ShowUI.apply(this, arguments);

var placeHolder = "s_" + this.GetPM().Get("GetFullId") + "_div";
var elSortable = $("#" + placeHolder).find(".ui-jqgrid-sortable");
var sort = $("li[data-caption='Sort']");

elSortable.on("click", function () {

sort.parent().css("visibility", "hidden");
setTimeout(function () {
sort.click();
}, 0);
});
}

return QuickSortPR;
}());
return "SiebelAppFacade.QuickSortPR";
})
}

– Jeroen