Hi,
I would like to change the view of our Real Time monitor. Now i have a few things i would like to change, but not sure how and where:
1) I want to delete the parts: title + time, querow and the buttons (all in the upper screen)
2) The links to export as buttons under the tables
3) Some culomns in tables
I see i can delete some things from realtime_view.jsp but the data in the tables i dont see there, where can i change/delete these values?
Also i would like to put two tables next to eachother instead of under, so we dont have to scroll down if the table is very long. How can i do this?
Anyone who can help me? The script of my realtime_view is like this:
Thanks already!
<%@ page language="java" %>
<%@ page import="it.loway.tpf.*" %>
<%@ page import="it.loway.tpf.common.containers.*" %>
<%@ page import="it.loway.tpf.common.debug.*" %>
<%@ page import="it.loway.tpf.common.interfaces.*" %>
<%@ page import="it.loway.tpf.common.exceptions.*" %>
<%@ page import="it.loway.tpf.presentation.html.*" %>
<%@ page import="it.loway.tpf.presentation.html.decorators.*" %>
<%@ page import="it.loway.app.queuemetrics.*" %>
<%@ page import="it.loway.app.queuemetrics.caricamento.*" %>
<%@ page import="it.loway.app.queuemetrics.caricamento.DataObjects.*" %>
<%@ page import="it.loway.app.queuemetrics.asterisk.logs.*" %>
<%@ page import="it.loway.app.queuemetrics.liveData.*" %>
<%@ page import="it.loway.app.queuemetrics.smartTableDecorators.realtime.*" %>
<%@ page import="java.text.*" %>
<%@ include file="../00_page_header.jsp" %>
<script src="../img/js/LTF-ddm.js"></script>
<%
// $Id: realtime_view.jsp,v 1.33 2009/11/13 16:20:23 lenz-mobile Exp $
// Instanzia Data Object appropriato
BasicDO doRT = new RealtimeDO();
doRT.init( oC, oDec, oU );
doRT.initWebHere( stWebHere );
// inizializza Timer
LTimer t = new LTimer();
SmartTable T = null;
%>
<div id="soundSpan" ></div>
<script defer>
function onLoadApplicativo() {
// transazione standard
document.forms[0].<%= K.REQ_VERBO %>.value = "";
document.forms[0].<%= K.REQ_PARAM %>.value = "";
playSoundIfAlarms();
startCountdown( <%= oC.getI( "REALTIME_reload_time" ) %> * 2 );
aggiungiEventoOnchangeAComboLocation();
}
var inCdown = 0;
var inCdownMax = 0;
function countdown() {
inCdown=inCdown-1;
VuMeter( '#F00', '#CCC', inCdown, inCdownMax );
if ( inCdown < 1 ) {
startTransaction( "qm_realtime", "" );
} else {
setTimeout( "countdown()", 500 );
}
}
function startCountdown( max ) {
inCdown = max-1;
inCdownMax = max;
VuMeter( '#F00', '#CCC', max, max );
setTimeout( "countdown()", 500 );
}
function VuMeter( stCss1, stCss2, nCounter, nMax ) {
var myT = document.getElementById( "vmeter" );
var rows = myT.rows;
var cells = rows[0].cells;
var nCells = cells.length;
var last1 = (nCounter / nMax) * nCells;
for ( var i = 0; i < cells.length; i++ ) {
var cell = cells
;
if ( i < last1 ) {
cell.style.background = stCss1;
} else {
cell.style.background = stCss2;
}
}
}
//
// per non incasinare i controlli, aggiungo l'onChange alla combo delle location
// in maniera programmatica
//
function aggiungiEventoOnchangeAComboLocation() {
document.getElementById( "CODA_F_idLocation" ).onchange = OnChangeCboLocation;
}
function OnChangeCboLocation() {
startTransaction('qm_realtime', '');
}
function openPopUpListen( stNumRiga, stServer, stDirezione ) {
verb = "qm_popup_audiomon.do";
unique = new Date().getTime();
stUrl = verb + "?POPUP_agent=" + escape(stNumRiga) + "&POPUP_server=" + escape(stServer) + "&POPUP_direction=" + escape(stDirezione) + "&cachebreak=<%= U.getRandomString(9) %>" + unique;
eval("page" + unique + " = window.open( stUrl, '" + unique + "', 'toolbar=0,scrollbars=0,location=0,statusbar=0,menubar=0,resizable=0,width=300,height=300,left = 490,top = 200');");
}
function openPopUpQA( agent, clid, tst, queue, caller ) {
unique = new Date().getTime();
stUrl = "qm_qa_popup.do?QAE_agent=" + escape(agent) + "&QAE_astclid=" + escape(clid) + "&QAE_call_tst=" + escape(tst) + "&QAE_queue=" + escape(queue) + "&QAE_caller=" + escape(caller) + "&QAE_comment=" + "&cachebreak=<%= U.getRandomString(9) %>" + unique;
eval("page" + unique + " = window.open( stUrl, 'QA', 'toolbar=0,scrollbars=0,location=0,statusbar=0,menubar=0,resizable=0,width=650,height=700,left = 200,top = 200');");
}
//
// S U O N I A L C A R I C A M E N T O
//
function playSoundIfAlarms() {
var stSoundYellow = "<%= oC.getS( "SOUND_URL_yellow" ) %>";
var stSoundRed = "<%= oC.getS( "SOUND_URL_red" ) %>";
var soundChosen = "";
var inNumYellows = countCellsInClass( 'STRIASS', '<%= answerDecor.stYellowCssCellBackground %>' )
+ countCellsInClass( 'CALLS', '<%= answerDecor.stYellowCssCellBackground %>' )
;
var inNumReds = countCellsInClass( 'STRIASS', '<%= answerDecor.stRedCssCellBackground %>' )
+ countCellsInClass( 'CALLS', '<%= answerDecor.stRedCssCellBackground %>' )
;
if ( inNumReds > 0 ) {
soundChosen = stSoundRed;
} else
if ( inNumYellows > 0 ) {
soundChosen = stSoundYellow;
};
if ( soundChosen.length > 0 ) {
document.getElementById("soundSpan").innerHTML= "<embed src='" + soundChosen + "' width='0' height='0' hidden=true autostart=true loop=false>";
}
}
function countCellsInClass( stTableId, stClass ) {
var n = 0;
var i = 0;
var j = 0;
var table = document.getElementById( stTableId );
if ( !table ) {
return 0;
}
for ( i = 0; i < table.rows.length; i++ ) {
for ( j = 0; j < table.rows.cells.length; j++ ) {
myCell = table.rows.cells[j];
if ( myCell.className ) {
if ( myCell.className == stClass ) {
n += 1;
}
}
}
}
return n;
}
</script>
<h1><%= oDec.k("rt_realtime_call_center_monitoring") %> - <%= oC.getS( "REALTIME_dataOra" ) %></h1>
<%= oDec.k("rt_queues") %>
<%= oC.getS( "REALTIME_includedCodeName" ) %>
<p>
<%= oH.button( oDec.k("rt_reload_now") , oU.hasKey("REALTIME"), "", "qm_realtime", "" ) %>
<%= realtimeHelper.toggleButton( oH, oDec.k("rt_show_calls"), oDec.k("rt_hide_calls"),
oU.hasKey("REALTIME") && oC.getS( "REALTIME_SHOWBTN_calls" ).equals("1"),
"qm_realtime_toggles", "c", oC.getS( "REALTIME_toggle_calls" ) ) %>
<%= realtimeHelper.toggleButton( oH, oDec.k("rt_show_agents"), oDec.k("rt_hide_agents"),
oU.hasKey("REALTIME") && oC.getS( "REALTIME_SHOWBTN_agents" ).equals("1"),
"qm_realtime_toggles", "a", oC.getS( "REALTIME_toggle_agents" ) ) %>
<%= realtimeHelper.toggleButton( oH, oDec.k("rt_active_queues"), oDec.k("rt_all_queues"),
oU.hasKey("REALTIME") && oC.getS( "REALTIME_SHOWBTN_showAllSubqueues" ).equals("1"),
"qm_realtime_toggles", "q", oC.getS( "REALTIME_toggle_showAllSubqueues" ) ) %>
<%= realtimeHelper.toggleButton( oH, oDec.k("rt_show_any_agent"), oDec.k("rt_show_members_only"),
oU.hasKey("REALTIME") && oC.getS( "REALTIME_SHOWBTN_memberagentsonly" ).equals("1"),
"qm_realtime_toggles", "s", oC.getS( "REALTIME_toggle_memberagentsonly" ) ) %>
<%= oDec.k("rt_location") %> <%= oH.combo( "CODA_F_idLocation", true, "width: 150px;", oC.getLt( "DATI_locations_selectable" ), 0, 1, "" ) %>
<p>
<%
if ( oC.getI( "CODA_F_supervision" ) > 0 ) {
out.println( oDec.k("clhdr_supervised_by") + oU.getRealName() + "<p>" );
}
%>
<%
T = doRT.dispatch( RealtimeDO.RIASSUNTO_REALTIME );
out.println(T.render());
%>
<%
if ( !oC.defined( "CODA_rt_hideExportButtons" ) ) {
out.print( doRT.exportButtons( RealtimeDO.THIS_DO, RealtimeDO.RIASSUNTO_REALTIME) );
}
%>
<% t.label( "OK: tabella iniziale " ); %>
<p>
<% if ( realtimeHelper.panelEnabled( oC.getS("REALTIME_toggle_calls") ) ) { %>
<b><%= oDec.k("rt_calls_being_processed") %></b>
<%
T = doRT.dispatch( RealtimeDO.CALLS_BEING_PROC );
out.println(T.render());
%>
<%
if ( !oC.defined( "CODA_rt_hideExportButtons" ) ) {
out.print( doRT.exportButtons( RealtimeDO.THIS_DO, RealtimeDO.CALLS_BEING_PROC) );
}
%>
<% t.label( "OK: calls being procd " ); %>
<% }; %>
<p>
<% if ( realtimeHelper.panelEnabled( oC.getS("REALTIME_toggle_agents" )) ) { %>
<b><%= oDec.k("rt_agents_currently_logged_in") %></b>
<%
T = doRT.dispatch( RealtimeDO.AGENTS_LOGGED_IN);
out.println(T.render());
%>
<%
if ( !oC.defined( "CODA_rt_hideExportButtons" ) ) {
out.print( doRT.exportButtons( RealtimeDO.THIS_DO, RealtimeDO.AGENTS_LOGGED_IN ) );
}
%>
<% t.label( "OK: agents logged in " ); %>
<% }; %>
<p> <p>
<center>
<small><%= oDec.k("rt_in_order_to_mantain_session_information") %></small>
<style>
.red {
background-color: #EE0000;
width: 5px;
}
.blk {
background-color: #CCCCCC;
width: 5px;
}
</style>
<table id="vmeter">
<tr>
<td class="blk"> </td> <td class="blk"> </td> <td class="blk"> </td> <td class="blk"> </td>
<td class="blk"> </td> <td class="blk"> </td> <td class="blk"> </td> <td class="blk"> </td>
<td class="blk"> </td> <td class="blk"> </td> <td class="blk"> </td> <td class="blk"> </td>
<td class="blk"> </td> <td class="blk"> </td> <td class="blk"> </td> <td class="blk"> </td>
<td class="blk"> </td> <td class="blk"> </td> <td class="blk"> </td> <td class="blk"> </td>
<td class="blk"> </td> <td class="blk"> </td> <td class="blk"> </td> <td class="blk"> </td>
<td class="blk"> </td> <td class="blk"> </td> <td class="blk"> </td> <td class="blk"> </td>
<td class="blk"> </td> <td class="blk"> </td> <td class="blk"> </td> <td class="blk"> </td>
<td class="blk"> </td> <td class="blk"> </td> <td class="blk"> </td> <td class="blk"> </td>
<td class="blk"> </td> <td class="blk"> </td> <td class="blk"> </td> <td class="blk"> </td>
<td class="blk"> </td> <td class="blk"> </td> <td class="blk"> </td> <td class="blk"> </td>
<td class="blk"> </td> <td class="blk"> </td> <td class="blk"> </td> <td class="blk"> </td>
<td class="blk"> </td> <td class="blk"> </td> <td class="blk"> </td> <td class="blk"> </td>
<td class="blk"> </td> <td class="blk"> </td> <td class="blk"> </td> <td class="blk"> </td>
<td class="blk"> </td> <td class="blk"> </td> <td class="blk"> </td> <td class="blk"> </td>
<td class="blk"> </td> <td class="blk"> </td> <td class="blk"> </td> <td class="blk"> </td>
</tr>
</table>
</center>
