/* 
 * Copyright (C) 2008 Church of Scientology International.
 * All Rights Reserved.  Confidential and proprietary.
 */

var SelectCourseUi = function() {
    
    var myThis = this;
    
    this.mainPanel = new YAHOO.widget.Panel("mainPanel", {
        width:"450px",
        visible:false,
        constraintoviewport:true,
        close:false,
        draggable:false
    } );
    this.mainPanel.render();
    
    /*
    this.startCourseButton = new YAHOO.widget.Button("startCourseButton"); 
    
    // listen for login button click
    this.startCourseButton.on("click", function(aEvent) {
        myThis.onStartCourseButtonClick(aEvent);
    });
    */
    
    // "select course" button
    this.selectCourseButton = new YAHOO.widget.Button("selectCourseButton"); 
    this.selectCourseButton.on("click", function(aEvent) {
        myThis.onSelectCourseClick(aEvent);
    });
    
    this.mainPanel.show();
    
};

/**
 * Intialization stuff
 */
SelectCourseUi.prototype.init = function() {
    
    var myThis = this;
    
    CoursePublicApi.getLoggedInStudent(
        function(aResult) {
            myThis.onGetLoggedInStudentResult(aResult);
        }
    );
    
};

/**
 * Called when the Start Course button is clicked
 */
//SelectCourseUi.prototype.onStartCourseButtonClick = function(aEvent) {
    /*
    var myCourseId = $('newCourseSelect').value;
    if (myCourseId && myCourseId.length > 0) {
      CoursePublicApi.enrollOnCourse(myCourseId, function(aResult) {
          document.location = 'main/index.html?courseId=' + myCourseId;
      });
    }
    */
//};

/**
 * Called when CoursePublicApi.getLoggedInStudent returns 
 */
SelectCourseUi.prototype.onGetLoggedInStudentResult = function(aResult) {
    
    var myThis = this;
    
    this.student = aResult;
    
    document.getElementById('studentNameText').innerHTML = this.student.uid;
    
    // now get all of the data about what courses this guy is or is not enrolled in
    CoursePublicApi.getAllCourseAndEnrollmentInfo(
        function(aResult) {
            myThis.onGetAllCourseAndEnrollmentInfo(aResult);
        }
    );
    
};

/**
 * When the user clicks "select course"
 */
SelectCourseUi.prototype.onSelectCourseClick = function(aEvent) {
    
    var myCourse = this.currentCourseAndEnrollmentEntry.course;
    
    if (this.currentCourseAndEnrollmentEntry.enrollment == null) {
        if (!confirm('You will now be enrolled newly on the course: ' + myCourse.name)) {
            return;
        }
    }
    
    CoursePublicApi.enrollOnCourse(myCourse.id, function(aResult) {
        document.location = 'main/index.html?courseId=' + myCourse.id;
    });
pageTracker._trackPageview('/course/selectcourse/');    
};

/**
 * Show the course detail
 */
SelectCourseUi.prototype.showCourseDetail = function(aCourseId) {
    
    // loop over and find the right one
    for (var i = 0; i < this.courseAndEnrollmentInfo.length; i++) {
        var myEntry = this.courseAndEnrollmentInfo[i];
        if (myEntry.course.id == aCourseId) {
            
            $('detailDiv').style.visibility = 'visible';
            $('detailCourseNameDiv').innerHTML = myEntry.course.name;
            $('detailCourseImageDiv').innerHTML = '<img src="/course/images/items/book_' + myEntry.course.id + '.jpg"/>';
            $('detailCourseDescriptionDiv').innerHTML = myEntry.course.description;
            
            this.currentCourseAndEnrollmentEntry = myEntry;
            
            break;
        }
    }
    
};

/**
 * Called when CoursePublicApi.getAllCourseAndEnrollmentInfo returns
 */
SelectCourseUi.prototype.onGetAllCourseAndEnrollmentInfo = function(aResult) {
    
    this.courseAndEnrollmentInfo = aResult;
    
    var myThis = this;
    
    var i;
    
    var myEnrolledHtml = '';
    
    // sort entries into - enrolled, new and completed
    var myEnrolledEntries = [];
    var myNewEntries = [];
    var myCompletedEntries = [];
    
    for (i = 0; i < aResult.length; i++) {
        
        var myMap = aResult[i];
        var myCourse = myMap['course'];
        var myEnrollment = myMap['enrollment'];
        
        if (myEnrollment) {
            if (myEnrollment.enrollmentState && myEnrollment.enrollmentState.value == 'COMPLETED_SENT_CERT') {
                myCompletedEntries.push(myMap);
            }
            else {
                myEnrolledEntries.push(myMap);
            }
        }
        else {
            myNewEntries.push(myMap);
        }
        
    }
    
    // fix display of titles
    if (myNewEntries.length == 0) {
        $('startNewCourseTitleTd').style.visibility = 'hidden';
    }
    if (myEnrolledEntries.length == 0) {
        $('coursesStartedTr1').style.display = 'none';
        $('coursesStartedTr2').style.display = 'none';
        $('coursesStartedTr3').style.display = 'none';
    }
    if (myCompletedEntries.length == 0) {
        $('coursesCompletedTr1').style.display = 'none';
        $('coursesCompletedTr2').style.display = 'none';
        $('coursesCompletedTr3').style.display = 'none';
    }
    
    // display enrolled
    dwr.util.removeAllRows('enrolledCoursesTbody');
    
    var myEnrolledTableEntries = makeColumnArray(myEnrolledEntries, 4);
    
    var myFormatFunc = function(aEntry) {
        if (aEntry) {
            return '<img onclick="document.selectCourseUi.showCourseDetail(\'' + aEntry.course.id + '\');" src="/course/images/items/book_' + aEntry.course.id + '_small.jpg" />';
        }
        return '';
    };
    
    var myFunctions = [
        function(aRow){return myFormatFunc(aRow[0])},
        function(aRow){return myFormatFunc(aRow[1])},
        function(aRow){return myFormatFunc(aRow[2])},
        function(aRow){return myFormatFunc(aRow[3])}
    ];
    
    var myCellCreatorFunc = function(options) {
        var td = document.createElement("td");
        td.align = "center";
        td.style.padding = '4px';
        td.width = "25%";
        td.onmouseover = function(aEvent) {
            if (td.innerHTML.length > 2) {
                td.style.backgroundColor = '#9999FF';
            }
        };
        td.onmouseout = function(aEvent) {
            td.style.backgroundColor = '';
        }
        return td;
    }
    
    dwr.util.addRows('enrolledCoursesTbody', myEnrolledTableEntries, myFunctions, {
        escapeHtml:false,
        cellCreator: myCellCreatorFunc
    });
    
    // display not enrolled
    dwr.util.removeAllRows('newCoursesTbody');
    
    var myNewTableEntries = makeColumnArray(myNewEntries, 4);
    
    myFormatFunc = function(aEntry) {
        if (aEntry) {
            return '<img onclick="document.selectCourseUi.showCourseDetail(\'' + aEntry.course.id + '\');" src="/course/images/items/book_' + aEntry.course.id + '_small.jpg" />';
        }
        return '';
    };
    
    myFunctions = [
        function(aRow){return myFormatFunc(aRow[0])},
        function(aRow){return myFormatFunc(aRow[1])},
        function(aRow){return myFormatFunc(aRow[2])},
        function(aRow){return myFormatFunc(aRow[3])}
    ];
    
    myCellCreatorFunc = function(options) {
        var td = document.createElement("td");
        td.align = "center";
        td.style.padding = '4px';
        td.width = "25%";
        td.onmouseover = function(aEvent) {
            if (td.innerHTML.length > 2) {
                td.style.backgroundColor = '#9999FF';
            }
        };
        td.onmouseout = function(aEvent) {
            td.style.backgroundColor = '';
        }
        return td;
    }
    
    dwr.util.addRows('newCoursesTbody', myNewTableEntries, myFunctions, {
        escapeHtml:false,
        cellCreator: myCellCreatorFunc
    });

    // display completed
    dwr.util.removeAllRows('completedCoursesTbody');
    
    var myCompletedTableEntries = makeColumnArray(myCompletedEntries, 4);
    
    myFormatFunc = function(aEntry) {
        if (aEntry) {
            return '<img onclick="document.selectCourseUi.showCourseDetail(\'' + aEntry.course.id + '\');" src="/course/images/items/book_' + aEntry.course.id + '_small.jpg" />';
        }
        return '';
    };
    
    myFunctions = [
        function(aRow){return myFormatFunc(aRow[0])},
        function(aRow){return myFormatFunc(aRow[1])},
        function(aRow){return myFormatFunc(aRow[2])},
        function(aRow){return myFormatFunc(aRow[3])}
    ];
    
    myCellCreatorFunc = function(options) {
        var td = document.createElement("td");
        td.align = "center";
        td.style.padding = '4px';
        td.width = "25%";
        td.onmouseover = function(aEvent) {
            if (td.innerHTML.length > 2) {
                td.style.backgroundColor = '#9999FF';
            }
        };
        td.onmouseout = function(aEvent) {
            td.style.backgroundColor = '';
        }
        return td;
    }
    
    dwr.util.addRows('completedCoursesTbody', myCompletedTableEntries, myFunctions, {
        escapeHtml:false,
        cellCreator: myCellCreatorFunc
    });
    
};