Custom session timeout warning popup in Webcenter portal 11.1.1.8 using jquery

Hi All,

Requirement – To show customised session time out warning popup in webcenter portal builder.

Solution- Edit your template-

editpagetemplate

In the composer, open web development and add an html markup anywhere in the template.
Edit that markup and add below code as the value.

Below snippet uses normal javascript.

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Dialog Box Witout Close Button</title>


</head>
<body>
<div id="dialog"  title="Dialog Title"></div>
<script>
var resetTime_int;
function resetTimer(){
    if(resetTime_int) window.clearTimeout(resetTime_int)
    resetTime_int=window.setTimeout(function (){
    if(document.getElementById('dialog').innerHTML = 'You have ' + (timeoutCount * 3000)/1000 + 'seconds until timeout' 😉     
    location.reload()
    }, 1000*60*2)
}

resetTimer()
document.onmousemove=resetTimer
document.onkeyup=resetTimer
</script>
</body>
</html>

html

Following snippet with Jquery

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Dialog Box Witout Close Button</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.1/themes/base/jquery-ui.css">
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script>

</head>
<body>
</head>
<body>
<div id="dialog" style="display:none;" title="Dialog Title"></div>
<script>
var lefttime=3;
var interval;
interval = setInterval('change()',60000);


function change()
{
   lefttime--;
   if(lefttime<=2) {
$( "#dialog" ).dialog( "open" );
return false;

}
}
$("#dialog").dialog({
autoOpen: false,
position: 'center' ,
title: 'session',
draggable: false,
width : 400,
height : 200,
resizable : true,
modal : true,
});

JS

With jquery you can make it more beautiful with these dialog options.

Thats it. You can change the time to show popup for idle user.

Happy learning with Vinay in techartifact

ADF Popup ContentDelivery attribute – ADF Tips

In Adf application we normally used popup.We have one of the property and attribute of popup is contentDelivery .
ContentDelivery attribute of an af:popup component controls the popup initialization time and how does the data get refreshed within the popup. The default content delivery is lazy. This means the content of the popup is not delivered to the client until shown the first time

Good ADF developer should know , when to use what-

immediate — The popup component is added inline within the page when the page is loaded. It does not matter if you do or do not display it, the popup component will always be loaded.

ContentDelivery should be set to immediate if and only if you are absolutely sure that the popup will be invoked at least once. Otherwise you should use the other two values.

Example: If you use a logout logic that needs confirmation than the confirmation popup should be set to immediate.

lazy — The popup component will be loaded (and cached) only when is called for the first time. If you do not explicitly set the ContentDelivery attribute when creating the popup it will implicitly be set to lazy.

This value should be used when dealing with static information(that does not change): warning messages, information messages and so on.

lazyUncached — The popup component will be loaded(but not cached) only when is invoked for the first time; and every time the popup is called it will be reloaded.

This value should be used when dealing with dynamic data.

Handling OK and Cancel button in af:dialog using popup in Oracle ADF by dialogListener

Requirement – We are displaying a popup message to user and on selecting on OK and CANCEl by user , writing custom code inside bean

Solution – You can have af:popup component in the page .Inside the popup , drag drop af:dialog component. You can call the pop up programmatic using my
another post of popup

For the dialog , you need to have some dialog listener. write it like

<af:dialog title="handling Ok and cancel event}"
           type="okCancel"
           dialogListener="#{techartifact.headerManage.dialogListener1}"
           id="d1">

The method of dialogListener1 can be written as below.Write inside a headerManage bean.

public void dialogListener1(DialogEvent dialogEvent)
  {
    if (dialogEvent.getOutcome() == DialogEvent.Outcome.ok)
    {
     // write your custom code for ok event
    } else
    {
      // write your custom code for cancel event
   } 
  }

Happy coding with techartifact….