timeReport.html
<HTML>
<HEAD>
<script>var dFrameFilePath =
'../../../../../dFrame/'</script>
<script language="Javascript"
src="../../../../../dFrame/dFrame/lib/DFrameAPI.js"></script>
<script language="Javascript">
//FormBuffer class
DFrameAPI.include('/dFrame/ext/formBuffer.js')
//Style
DFrameAPI.include('dFrame/styles/green/styleGreen.js')
DFrameAPI.onLoad =
function(){
DFrameAPI.checkStyles(false)
openReportDemo()
}
//================================
SCHEMA
=================================
// DFrames:
// The
showWeeksData() function shows a list of weeks.
// The
editWeek() function
// -
creates 6 DFrames, one for each day (=DFreportDays)
// -
creates a hidden DFrame (=DFopenWeek)
// -
creates the DFrame for data input/edit (=DFreportData)
// -
loads the page corresponding to the selected week in DFopenWeek
// This
page, thru the onLoadDFrame function, launch the onLoadDFrameWeekData function.
It:
// -
loads datas from the form of the DFopenWeek DFrame into the reportBuffer FormBuffer
objects
// -
calls the printData() function
// The
printData function print datas on the DFreportDays DFrames
// Datas:
// One
FormBuffer object is created for each day in the openReportDemo function:
// for
(i = 0 ; i<6 ; i++) reportBuffer[i] = new FormBuffer()
// Those
FormBuffer objects are loaded in the onLoadDFrameWeekData function:
// reportBuffer[i].loadSessionsFromFormattedString(days[i],
sep4, sep3, sep2)
// When
edit data of one day the data of the selected day/reportBuffer are copied into
the form of the DFreportData DFrame
// reportBuffer[day-1].updateForm(DFreportData,
0, sessionId);
// When
save data of one day the sendData function update the reportBuffer object:
// reportBuffer[oldDay-1].removeElements(DFreportData,
0, sessionId);
// reportBuffer[day-1].addElements(DFreportData,
0, sessionId);
// When
save week the datas of the 6 days are merged and sent by the saveWeek function
to the hidden DFopenWeek DFrame
// for
(var i = 0 ; i<6 ; i++) str += reportBuffer[i].getSessionsAsFormattedString(sep4,
sep3, sep2)
// var
elt = new FormBufferElement(DFopenWeek, 0, 'weekValue')
// elt.value
= str
// weekValueBuffer.updateElements(elt)
// weekValueBuffer.updateForm(DFopenWeek,
0, elt)
// In
this sample the form inside DFopenWeek is not submitted so datas remain
unchanged.
//===========================================================================
var DFreportBase
var DFshowWeeksData
var DFreportData
var DFopenWeek
var DFreportDays = new Array()
var weekValueBuffer
var reportBuffer = new Array()
var dFrameStyleForReport
var oldDay = 0
var sessionId = null
var daysNames = ['Monday', 'Tuesday', 'Wednesday', 'Thursday',
'Friday', 'Saturday']
var txt1, txt2, txt3
var sep4 = '|#|'
var sep3 = '|##|'
var sep2 = '|###|'
var sep1 = '|####|'
function openReportDemo() {
if (!DFreportBase) {
//6 dFrameBuffers for 6 days
(global var.)
for (i = 0 ;
i<6 ; i++) reportBuffer[i] = new FormBuffer()
//dFrameBuffer
for week data transfert (global var.)
weekValueBuffer =
new FormBuffer()
DFreportBase=new
DFrame([0,0,100,100],'Report Demo',dFrameStyle)
txt1 =
DFreportBase.addText([50, 15], 'Select a week (01/17/2002 is the best) and Edit
Week.')
txt2 =
DFreportBase.addText([50, 4], 'Select a day and an item.')
txt2.show(false)
txt3 =
DFreportBase.addText([5, 82], 'Edit data and Save or Delete it.')
txt3.show(false)
showWeeksData()
}
DFreportBase.show()
}
function showWeeksData() {
//show
a list of available weeks
if (!DFshowWeeksData) {
//style
for the view
var s = new
DFrameStyle(dFrameStyle)
s.setBordersWidth(1)
s.setTitleBar(true)
s.setContentBgColor('#9AC355')
var b =
s.getDefaultBarStyle()
b.setPos('RIGHT')
b.setBordersWidth(0)
b.setBorderTopWidth(1)
s.setDefaultBarStyle(b)
//show
the view
pos=[5, 10, 45,
35]
DFshowWeeksData=new
DFrame(pos,'Weeks',s, DFreportBase)
DFshowWeeksData.editDataButton
= DFshowWeeksData.addButton('Edit Week','editWeek()')
DFshowWeeksData.editDataButton.setInactive(true)
DFshowWeeksData.saveDataButton
= DFshowWeeksData.addButton('Save','saveWeek()')
DFshowWeeksData.saveDataButton.setInactive(true)
DFshowWeeksData.setHideOnRecover(true)
}
DFshowWeeksData.setURL('./TimeReport/weeks.html')
}
function setInactivateEditDataButton(b) {
//used
by functions of radio buttons of items of the DFshowWeeksData page
DFshowWeeksData.editDataButton.setInactive(b)
}
function editWeek() {
txt1.show(false)
txt2.show(true)
//reset
6 FormBuffer objects
for (var i = 0 ; i<6
; i++) reportBuffer[i].resetElements()
//Create
6 DFrames, one for each day.
if (!DFreportDays[0]) {
var s = new
DFrameStyle(dFrameStyle)
s.setBordersWidth(1)
s.setIndentY(35)
s.setTitleBar(true)
s.setCopyTitleBarToBottom(true)
s.setMessageBgColor('#9CC352')
s.setScrollType('push')
var
pos=[50,10,95,50]
for (var i = 0 ;
i<6 ; i++) {
DFreportDays[i]
= new DFrame(pos, daysNames[i], s, DFreportBase)
DFreportDays[i].setHideOnRecover()
}
}
for (var i = 0 ; i<6
; i++) {
DFreportDays[i].show(true)
}
//create
dFrame for entering data
if (!DFreportData) {
var s = new
DFrameStyle(dFrameStyle)
s.setBordersWidth(1)
s.setTitleBar(true)
s.setContentBgColor('#9AC355')
var b =
s.getDefaultBarStyle()
b.setBordersWidth(0)
b.setBorderTopWidth(1)
s.setDefaultBarStyle(b)
DFreportData=new
DFrame([5, 40, 45, 80],'Enter Data',s, DFreportBase)
DFreportData.sendData
= DFreportData.addButton('Save item','sendData()')
DFreportData.sendData.setInactive(true)
DFreportData.deleteData
= DFreportData.addButton('Delete item','deleteData()')
DFreportData.deleteData.setInactive(true)
}
DFreportData.setURL('./timeReport/enterData.html')
//open
a hidden DFrame for formBuffer load (onLoadDFrame event of )
if (!DFopenWeek) {
//For NS6:
//If
DFopenWeek.setURL(url, false) so that the form is not visible =>
//Forms in a
hidden iFrame are not visibles in the DOM.
//So dims are set
to 0.
var pos = [0, 0,
0, 0]
DFopenWeek = new DFrame(pos,'Hidden',dFrameStyle, DFreportBase)
}
//Create
an element from field 'selectedWeek' of forms[0] of dFrame DFshowWeeksData
var elt = new
FormBufferElement(DFshowWeeksData, 0, 'selectedWeek')
//As
there are many fields of the same name, elt is an array of Elements
for (var i in elt) {
if (elt[i].checked
== true) {
//Store the selected week in previous DFrame ()
//The
page inserted in DFopenWeek has a onLoadDFrame function = mainPage.onLoadDFrameWeekData()
DFopenWeek.setURL('./timeReport/'
+ elt[i].value.toString())
break;
}
}
DFshowWeeksData.saveDataButton.setInactive(false)
}
function onLoadDFrameWeekData() {
//get
data of 6 days from form inside DFopenWeek
var elt = new
FormBufferElement(DFopenWeek, 0, 'weekValue')
if (elt.value != '') {
//split datas of 6 days into 6 strings
var days =
elt.value.split(sep1)
for (var i = 0 ; i
< days.length ; i++) {
//load data of
each day in a FormBuffer object
if (days[i] !=
'') {
reportBuffer[i].loadSessionsFromFormattedString(days[i],
sep4, sep3, sep2)
}
}
}
for (var i = 0 ; i<6
; i++) printData(i + 1)
}
function sendData() {
txt3.show(false)
txt2.show(true)
var elt = new
FormBufferElement(DFreportData, 0, 'Day')
day = elt.value
//new
if (!sessionId)
reportBuffer[day-1].addElements(DFreportData, 0);
//edit
else {
reportBuffer[oldDay-1].removeElements(DFreportData,
0, sessionId);
reportBuffer[day-1].addElements(DFreportData,
0, sessionId);
reportBuffer[day-1].resetForm(DFreportData,
0)
DFreportData.sendData.setInactive(true)
DFreportData.deleteData.setInactive(true)
}
if (oldDay != 0
&& oldDay != day) printData(oldDay)
printData(day)
oldDay = day
sessionId = null
}
function editData(tmpSessionId, day) {
txt2.show(false)
txt3.show(true)
sessionId =
tmpSessionId
reportBuffer[day-1].updateForm(DFreportData,
0, sessionId);
var elt = new
FormBufferElement(DFreportData, 0, 'Day')
oldDay = Math.abs(elt.value)
DFreportData.sendData.setInactive(false)
DFreportData.deleteData.setInactive(false)
}
function checkEnterDataButtons() {
//called by onChange event in EnterData form
var elt = new
FormBufferElement(DFreportData, 0, 'Duration')
var x0 = elt.value !=
''
var elt = new
FormBufferElement(DFreportData, 0, 'Account')
var x1 = elt.value !=
''
var elt = new
FormBufferElement(DFreportData, 0, 'Day')
var x2 = elt.value !=
''
DFreportData.sendData.setInactive(!(x0
&& x1 && x2))
}
function deleteData() {
txt3.show(false)
txt2.show(true)
//oldDay and sessionId (global vars) are known from editData()
reportBuffer[oldDay-1].removeElements(DFreportData,
0, sessionId);
printData(oldDay)
reportBuffer[oldDay-1].resetForm(DFreportData,
0)
DFreportData.sendData.setInactive(true)
DFreportData.deleteData.setInactive(true)
}
function saveWeek() {
txt2.show(false)
txt1.show(true)
var str = ''
for (var i = 0 ; i<6
; i++) {
str +=
reportBuffer[i].getSessionsAsFormattedString(sep4, sep3, sep2)
str += sep1
}
//get
an element from field in form
var elt = new
FormBufferElement(DFopenWeek, 0, 'weekValue')
//update element
elt.value = str
//send updated element to formBuffer
weekValueBuffer.updateElements(elt)
//update
form from updated formBuffer
weekValueBuffer.updateForm(DFopenWeek,
0, elt)
//Discarded here
//DFopenWeek.submitForm()
//Reset
and close everything
DFshowWeeksData.editDataButton.setInactive(true)
DFshowWeeksData.saveDataButton.setInactive(true)
for (var i = 0 ; i<6
; i++) DFreportDays[i].show(false)
DFreportData.show(false)
reportBuffer[0].resetForm(DFshowWeeksData,
0)
reportBuffer[0].resetForm(DFreportData,
0)
DFreportData.sendData.setInactive(true)
DFreportData.deleteData.setInactive(true)
}
function printData(day) {
//Print data for each day of the week
var w =
DFreportDays[day-1].getWidth()
if (is.ie) var
openTDTag = '<td style="border:1px solid Black;"'
else var openTDTag =
'<td'
before = '<FONT
SIZE=2 COLOR="000080" FACE="Arial">'
var html =
'<form><table border=1 width=' + Math.abs(w-20) + '><tr>'
var tag = openTDTag + '
width=' + Math.abs(w*0.15) + '>'
html += tag + before +
'Select</td>'
var tag = openTDTag + '
width=' + Math.abs(w*0.60) + '>'
html += tag + before +
'Account</td>'
var tag = openTDTag + '
width=' + Math.abs(w*0.25) + ' align=right>'
html += tag + before +
'Duration</td></tr>'
sessions =
reportBuffer[day-1].sessions
var duration = 0
for (var i in sessions)
{
session =
sessions[i]
if (session !=
null) {
html +=
'<tr>'
var radio =
'<input type=radio name="selectedAct"
onClick="Javascript:editData(\'' + i + '\',' + day + ')">'
html +=
openTDTag + '>' + radio + '</td>'
html +=
openTDTag + '>' + before + session['Account'].value +
'</FONT></td>'
html +=
openTDTag + ' align=right>' + before + session['Duration'].value +
'</FONT></td>'
html +=
'</tr>'
duration +=
Math.abs(session['Duration'].value)
}
}
html += '<tr>' +
openTDTag + '></td>'
html += openTDTag +
'>' + before + 'Total</td>'
html += openTDTag + '
align=right>' + before + duration + '</td></tr>'
html +=
'</table></form><br>'
DFreportDays[day-1].alert(html)
}
</script>
</HEAD>
</HTML>