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>