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>