document.observe('dom:loaded', function() {
    loadboxEvents();

});

/*
Add by Quang 
10/02/2010
Load cac event cho trang Dang ky, Dang nhap moi
*/
function loadboxEvents() {
    var url = document.location.pathname.toLowerCase();
    if (url.indexOf('dangkypartner.aspx') != -1) {
        loadDDLs(); //load DDL cho trang Dang ky partner
    }
    else if (url.indexOf('bosungthongtin.aspx') != -1) {
        loadDDLs();
    }
    else if (url.indexOf('dangky.aspx') != -1) { }
    //edit 03/04/2010
    else if (url.indexOf('dangnhap.aspx') != -1 || url.indexOf('index.aspx') != -1) {
        loadCheckboxRemember($('chk_remember'));
    }

    //cac textbox
    try {
        loadTextboxEvent($(document.body));
    } catch (ex) { alert(ex); }

    //cac checkbox
    //edit 03/04/2010
    if (url.indexOf('dangnhap.aspx') == -1 && url.indexOf('index.aspx') == -1) {
        loadCheckBox(); //checkbox kieu fai chon 1 trong 2
    }

};

/*
Add by Quang 
10/02/2010
Load cac event cho checkbox
*/
function loadCheckboxRemember(checkID) {
    if (checkID) {
        var arrLabel;
        try {
            arrLabel = checkID.up().down('label');
        } catch (ee) { arrLabel = $('lb_remember'); }
        arrLabel.observe('click', function(e) {
            var ele = Event.element(e).up('div');
            if (ele.hasClassName('checked')) ele.removeClassName('checked');
            else ele.addClassName('checked');
        });
    }
};

/*DROP DOWN LIST*/
/*
Add by Quang 
10/02/2010
Thay the cac element select mac dinh bang Select kieu moi
*/
function loadDDLs() {
    var ddlDate = new ddlDD();
    ddlDate.initializeCtrl('ddlDate', onLoadDDL, onClickDDL);
    var ddlMonth = new ddlDD();
    ddlMonth.initializeCtrl('ddlMonth', onLoadDDL, onClickDDL);
    var ddlYear = new ddlDD();
    ddlYear.initializeCtrl('ddlYear', onLoadDDL, onClickDDL);
};

/*
Add by Quang 
10/02/2010
Ham duoc goi khi tao Select kieu moi
*/
function onLoadDDL(obj) {
    if (obj.scroller == null) {
        var id = obj.targetID;
        obj.scroller = new Scrolling.Scroller($(id + '_ddlScroller'), 400, 165);
        obj.scrollbar = new Scrolling.Scrollbar($(id + '_ddlScrollbar'), obj.scroller, new Scrolling.ScrollTween());
    }
};

/*
Add by Quang 
10/02/2010
Event click tren Dropdownlist
*/
function onClickDDL(id, value) {
    var selectedValue = value;
    //hoac lay gia tri tu dropdown cung dc
    //alert($(id).value)
};

/*
Add by Quang 
10/02/2010
Object Dropdownlist
*/
var ddlDD = Class.create({
    initialize: function() {
        this.targetID = null;
        this.DDL = null;
        this.selectedValue = '';
        this.onClickHandle = null;
        this.onLoadHandle = null;
        this.scroller = null;
        this.scrollbar = null;
    },
    /*
    Add by Quang 
    10/02/2010
    Ham khoi tao
    */
    initializeCtrl: function(targetID, onLoadHandle, onClickHandle, isSmall) {
        var select = $(targetID);
        if (select) {
            this.targetID = targetID;
            this.onClickHandle = onClickHandle;
            this.onLoadHandle = onLoadHandle;
            this.loadHtml(select, isSmall);
        }
    },
    /*
    Add by Quang 
    10/02/2010
    Ham thay the noi dung html
    */
    loadHtml: function(objSelect, isSmall) {
        var id = this.targetID;
        var objSelected = objSelect.options[objSelect.selectedIndex];
        this.selectedValue = objSelected.value;

        var html = '<div class="bg_select_l"><div class="bg_select_r"><div class="select_inner">' +
		        '<span id="' + id + '_SV" class="no_select" UNSELECTABLE="on">' + objSelected.text + '</span>' +
	        '</div></div></div>' +
	        '<div class="select_list">' +
		        '<ul id="' + id + '_ddlScroller" class="select_options" style="#zoom:1">';
        for (var i = 0, len = objSelect.options.length; i < len; i++) {
            var option = objSelect.options[i];
            html += '<li id="' + id + '_' + option.value + '">' + option.text + '</li>';
        }
        html += '</ul>' +
		        '<div id="' + id + '_ddlScrollbar" class="select_scrollbar">' +
			        '<div class="Scrollbar-Up"></div>' +
			        '<div class="Scrollbar-Down"></div>' +
			        '<div class="Scrollbar-Track">' +
				        '<div class="Scrollbar-Handle" style="top: 0; display: block;"></div></div></div></div>'; //Quang 23/02
        //Quang 23/02 
        this.DDL = new Element('div', { 'id': id + '_ddl', 'class': 'select' + (!isSmall ? '' : ' select_small'), 'style': 'width:' + (objSelect.getWidth() - 36) + 'px;float:left;position:relative' }).update(html);
        objSelect.insert({ 'before': this.DDL }).hide();
        if (this.onLoadHandle && typeof (this.onLoadHandle) == 'function') {
            this.onLoadHandle(this);
        }
        this.DDL.down('.select_list').hide();
        this.loadEvents();
    },
    /*
    Add by Quang 
    10/02/2010
    Gan events cho dropdownlist
    */
    loadEvents: function() {
        this.DDL.observe('click', this.DDLClick.bindAsEventListener(this));
        document.observe('click', this.docClick);
    },
    /*
    Add by Quang 
    10/02/2010
    Event click tren ddl
    */
    DDLClick: function(e) {
        var ele = Event.element(e);
        while (ele.id == '') ele = ele.up();
        if (ele.id == this.targetID + '_SV' || ele.id == this.targetID + '_ddl') {
            var ddlList = this.DDL.down('.select_list');
            if (ddlList.visible()) ddlList.hide();
            else {
                this.docClick(e);
                ddlList.show();
            }
        }
        else if (ele.tagName == 'LI') {
            var newValue = ele.id.replace(this.targetID + '_', '');
            if (this.selectedValue != newValue) {
                this.selectedValue = newValue;
                $(this.targetID).value = this.selectedValue;
                if (this.onClickHandle && typeof (this.onClickHandle) == 'function') {
                    this.onClickHandle(this.targetID, this.selectedValue);
                }
                this.DDL.down('#' + this.targetID + '_SV').update(ele.innerHTML);
            }
            this.DDL.down('.select_list').hide();
        }
        Event.stop(e);
    },
    /*
    Add by Quang 
    10/02/2010
    Event click tren 1 element khac ddl, hide ddl di
    */
    docClick: function(e) {
        $(document.body).select('.select_list').invoke('hide');
    }
});
/*END DROP DOWN LIST*/

var islang = 1;
var Calendar = Class.create({
    initialize: function() {
        this.container = null;
        this.box = null;
        this.day = -1;
        this.month = 1;
        this.year = 2004;
        this.date = -1;
    },
    initializeCtrl: function(container, box, type) {
        var now = new Date();
        this.container = container;
        this.box = box;
        this.loadHtml(container, type);
        this.loadEvents();
        if (this.container == $('small_calendar')) { events = eventSmall; };
        this.calendarEvents();
    },
    loadHtml: function(container, typeCal) {
        var html = [];
        var now = new Date();
        var day = now.getDate();
        var month = now.getMonth() + 1;
        var year = now.getFullYear();
        var firstday = new Date(String(month) + "/1/" + String(year));
        var date = firstday.getDay();
        var monthname = '';
        monthname = this.monthName(month, islang);
        var ids = 0;
        if (typeCal == 0) {
            html[ids++] = '<div style="position:relative; width:100%; overflow:hidden;"><div class="bg_infomation transparent white"></div>';
        }
        else html[ids++] = '<div class="bg_infomation transparent white"></div>';
        html[ids++] = '<div class="calendar_header">';
        //html[ids++] = '<div class="calendar_pre"><a href="javascript:void(0);"></a></div>';
        html[ids++] = '<div class="title_month_year"><div class="calendar_pre"><a href="javascript:void(0);"></a></div><div class="calendar_next"><a href="javascript:void(0);"></a></div><span class="title_month">' + monthname + ' ' + year + '</span></div>';
        //html[ids++] = '<div class="calendar_next"><a href="javascript:void(0);"></a></div>';

        html[ids++] = '<ul class="title_date">';
        html[ids++] = this.dayName(islang);
        html[ids++] = '</ul></div>';
        if (typeCal == 0) {
            html[ids++] = '<ul class="calendar_main">' + this.loadDays(day, month, year, date, 0) + '</ul></div>';
            html[ids++] = '<div class="calendar_footer"><span>Close</span></div>';
        }
        else html[ids++] = '<div class="calendar_main">' + this.loadDays(day, month, year, date, 0) + '</div>';
        container.update(html.join(''));
    },
    monthName: function(month, lang) {//debugger
        var monthname = '';
        switch (month.toString()) {
            case '1': monthname = '01 - '; break;
            case '2': monthname = '02 - '; break;
            case '3': monthname = '03 - '; break;
            case '4': monthname = '04 - '; break;
            case '5': monthname = '05 - '; break;
            case '6': monthname = '06 - '; break;
            case '7': monthname = '07 - '; break;
            case '8': monthname = '08 - '; break;
            case '9': monthname = '09 - '; break;
            case '10': monthname = '10 - '; break;
            case '11': monthname = '11 - '; break;
            case '12': monthname = '12 - '; break;
        }

        return monthname;
    },
    dayName: function(lang) {
        return (lang == 1) ? '<li>S</li><li>M</li><li>T</li><li>W</li><li>Th</li><li>F</li><li>Sa</li>' : '<li>CN</li><li>T.2</li><li>T.3</li><li>T.4</li><li>T.5</li><li>T.6</li><li>T.7</li>';
    },
    loadDays: function(day, month, year, date, type, typeCal) {
        var now = new Date();
        this.day = day;
        this.month = month;
        this.year = year;
        var html = [];
        var ids = 0;
        var currentmonth = now.getMonth() + 1;
        var currentday = now.getDate();
        var currentyear = now.getFullYear();
        var _class = '';
        var numDay = this.daysInMonth(month, year);

        for (var i = 1; i <= numDay + date; i++) {
            html[ids++] = '<li ';
            if ((month == currentmonth) && (year == currentyear)) {
                if ((i - date == currentday)) _class = 'current">';
                else if (i < date + 1) _class = 'none">';
                else if (i - date < currentday) _class = '"><div class="bg_calendar_cell"></div>';
                else if ((i - date > currentday)) _class = 'tomorrow">';
                html[ids++] = 'class="' + _class;
            }
            else if ((month > currentmonth && year == currentyear) || (year > currentyear)) {
                if (i < date + 1) html[ids++] = 'class="none">';
                else html[ids++] = 'class="tomorrow">';
            }
            else if ((month < currentmonth && year == currentyear) || (year < currentyear)) {
                if (i < date + 1) html[ids++] = 'class="none">';
                else html[ids++] = 'class=" "><div class="bg_calendar_cell"></div>';
            }
            html[ids++] = '<a rel="day_' + (i - date) + '_' + month + '_' + year + '" href="javascript:void(0);"><span>' + (i < date + 1 ? '' : i - date) + '</span></a></li>';
        }

        if (type == 1) {
            this.container.down('.calendar_main').update(html.join(''));
        }
        else {
            return html.join('');
        }
    },
    daysInMonth: function(monthNum, yearNum) {
        if (monthNum == undefined && yearNum == undefined) {
            now = new Date();
            monthNum = now.getMonth() + 1;
            yearNum = now.getFullYear();
        }
        else if (monthNum || yearNum || monthNum == "" || yearNum == "") {
            now = new Date();
            if (monthNum == undefined || monthNum == "")
                monthNum = now.getMonth() + 1;
            if (yearNum == undefined || yearNum == "")
                yearNum = now.getFullYear();
        }
        monthNum = Number(monthNum);
        yearNum = Number(yearNum);

        if (isNaN(monthNum) || isNaN(yearNum) || monthNum % 1 != 0 || yearNum % 1 != 0 || monthNum < 1 || monthNum > 12) {
            return false;
        }
        var d = new Date(yearNum, monthNum, 0);
        return d.getDate();
    },
    loadEvents: function() {//debugger
        var _next = this.container.down('.calendar_next');
        var _pre = this.container.down('.calendar_pre');
        _next.observe('click', this.monthEventChange.bindAsEventListener(this));
        _pre.observe('click', this.monthEventChange.bindAsEventListener(this));
        try {
            var _close = this.container.down('.calendar_footer');
            _close.observe('click', this.closeCalendar.bindAsEventListener(this));
        }
        catch (ex) { }
    },
    monthEventChange: function(e) {
        var firstday;
        var date;
        var eastermonth, easteryear;
        var ele = Event.element(e);
        if ((ele.tagName == 'A' || ele.tagName == 'DIV') && e.type == 'click') {
            if (ele.up('div').className == 'calendar_next' || ele.className == 'calendar_next') {
                if (this.month == 12) { eastermonth = 1; easteryear = this.year + 1; }
                else { eastermonth = this.month + 1; easteryear = this.year; }
            }
            else if (ele.up('div').className == 'calendar_pre' || ele.className == 'calendar_pre') {
                if (this.month == 1) { eastermonth = 12; easteryear = this.year - 1; }
                else { eastermonth = this.month - 1; easteryear = this.year; }
            }
            firstday = new Date(String(eastermonth) + "/1/" + String(easteryear));
            date = firstday.getDay();
            this.container.down('.title_month').update(this.monthName(eastermonth, islang) + easteryear);
            this.loadDays(-1, eastermonth, easteryear, date, 1, 1);
            if (this.container.id == "small_calendar")
                loadEventOfMonth(eastermonth, easteryear, "small");
            //this.calendarEvents();
            else
                loadEventOfMonth(eastermonth, easteryear);
        }
        else return;
    },
    calendarEvents: function() {
        var now = new Date();
        var currentday = now.getDate();
        var curmonth = now.getMonth() + 1;
        var calendar = this.container.down('.calendar_main');
        var arr = calendar.childElements();
        var len = arr.length;
        for (var i = 0; i < len; i++) {
            var idx = arr[i].down('A').rel;
            var _arr = idx.split('_');

            var day = parseInt(_arr[1]);
            if (day > 0) {
                var month = parseInt(_arr[2]);
                var year = parseInt(_arr[3]);
                if (month == events[0].month && year == events[0].year) {
                    for (var j = 1; j < events.length; j++) {
                        if (day == events[j].day) {
                            if (day < currentday && month == curmonth) {
                                arr[i].className = '';
                                var cla = 'bg_calendar_' + events[j].rate;
                                arr[i].innerHTML = '';
                                var element = new Element('div');
                                element.className = cla;
                                arr[i].appendChild(element);
                                element = new Element('a', { 'rel': idx, 'href': 'javascript:void(0);' });
                                arr[i].appendChild(element);
                                element = new Element('span').update(day);
                                arr[i].down('a').appendChild(element);
                            }
                            else if (day > currentday && month == curmonth) {
                                arr[i].className = 'event_' + events[j].rate;
                            }
                            else if (day == currentday && month == curmonth) {
                                arr[i].className = 'event_' + events[j].rate + ' current';
                                arr[i].down('span').style.color = '#fff';
                            }
                            else if (month < curmonth) {
                                arr[i].down('.bg_calendar_cell').className = 'bg_calendar_' + events[j].rate;
                            }
                            else if (month > curmonth) {
                                arr[i].className = 'event_' + events[j].rate;
                            }
                        }
                    }
                }
            }

            var eventday = arr[i].down('SPAN');
            eventday.observe('mouseover', this.hoverDay.bindAsEventListener(this));
            eventday.observe('mouseout', this.hoverDay.bindAsEventListener(this));
            eventday.observe('click', this.clickDay.bindAsEventListener(this));
            eventday.observe('click', this.hoverDay.bindAsEventListener(this));
        }
    },
    hoverDay: function(e) {
        var ele = Event.element(e);
        events = eventLarge;
        try {
            var box = this.box;
            if (ele.tagName == 'SPAN') {
                if ((e.type == 'mouseover' || e.type == 'click') && box != '') {
                    var idx = ele.up('a').rel;
                    var day = parseInt(idx.split('_')[1]);
                    var month = idx.split('_')[2];
                    var year = idx.split('_')[3];
                    if (month == events[0].month && year == events[0].year) {
                        for (var j = 0; j < events.length; j++) {
                            if (day == events[j].day) {
                                if (e.type == 'mouseover') {
                                    box.style.display = 'block';
                                    box.clonePosition(ele, { setWidth: false, setHeight: false, offsetLeft: -40, offsetTop: 40 });
                                    box.style.width = '57px';
                                    box.innerHTML = '';
                                    var element = new Element('div');
                                    element.className = 'arrow';
                                    box.appendChild(element);
                                    element = new Element('div');
                                    element.className = 'text';
                                    box.appendChild(element);
                                    element = new Element('p');
                                    element.className = 'tenor';
                                    element.innerHTML = events[j].tenor;
                                    box.down('.text').appendChild(element);
                                    element = new Element('strong');
                                    element.className = 'view';
                                    element.innerHTML = events[j].view + '<span>' + langEvents()[isLang][0] + '</span>';
                                    box.down('.text').appendChild(element);
                                    box.down('.text').style.backgroundColor = '#262d28';
                                    box.down('.text').style.border = '3px solid #000';
                                    box.down('.text').style.padding = '6px 0';
                                    new Effect.Morph(box, {
                                        style: 'width:111px;',
                                        duration: 0.3
                                    });
                                    return false;
                                }
                                else if (e.type == 'click') {
                                    if (document.URL.toLowerCase().indexOf('events.aspx') != -1) {
                                        // alert(idx);
                                        var ulTabEvent = $('ulTabEvent');
                                        var pos = ulTabEvent.cumulativeOffset();
                                        window.scrollTo(pos[0], pos[1]);
                                        var day = parseInt(idx.split('_')[1]);
                                        var month = idx.split('_')[2];
                                        var year = idx.split('_')[3];
                                        param.filter = year + '-' + month + '-' + day;
                                        param.P = 1;
                                        param.stpe = 42;
                                        utils.call("Comp.aspx", param, "POST", "showListEvent", "showListEvent");
                                        $("ulTabEvent").select('.actives').each(function(s) { s.removeClassName('actives'); });
                                        $('aTabChooseDay').up('li').addClassName('actives');
                                    }
                                }
                            }
                        }
                    }
                }
                else if (e.type == 'mouseout' && box != '') box.style.display = 'none';
            }
            else return;
        }
        catch (ex) { }
    },
    closeCalendar: function() {
        this.container.hide();
    },
    clickDay: function(e) {
        var ele = Event.element(e);
        try {
            if (ele.tagName == 'SPAN') {
                var idx = ele.up('a').rel;
                var day = parseInt(idx.split('_')[1]);
                var month = idx.split('_')[2];
                var year = idx.split('_')[3];

                if (window.location.href.toLowerCase().indexOf('events.aspx') != -1) { //Quang 25/05
                    param.filter = year + '-' + month + '-' + day;
                    param.P = 1;
                    param.stpe = 42;
                    utils.call("Comp.aspx", param, "POST", "showListEvent", "showListEvent");
                }
                else if (window.location.href.toLowerCase().indexOf('eventdetails.aspx') != -1) {
                    calendarOnClick(day, month, year);
                }
            }
        }
        catch (ex) { }
    }
});
/*Trang cong dong*/
//------------hieu ung Thang cuon cho trang congdong.aspx-------------
/*
Load danh sach Feed (Moi nguoi dang lam gi)
T.Nguyen 28/05
*/
function loadItems(start, rec) {
    var html = [];
    var j = 0;
    var len = community.length;
    var end = start + rec;
    if (end > len - 2) end = len - 1;
    for (var i = start; i < end; i++) {
        if (i < 0) j = i + len;
        else j = i;
        if (i == start || i == end) { html += '<div class="one_detail ' + community[j].status + '" style="display:none;" id="' + community[j].id + '">'; }
        else html += '<div class="one_detail ' + community[j].status + '" id="' + community[j].id + '">';
        html += '<div class="escalator">';
        html += '<div class="detail_photo"><div class="photo_75">';
        html += '<div class="photo"><a href="javascript:void(0);"><img src="' + community[j].avatar + '" alt="user avatar" /></a></div>';
        html += '<div class="photo_shadow"></div></div></div>';
        html += '<div class="detail_infor"><div class="detail_nick"><a href="javascript:void(0);">' + community[j].nick + '</a></div>';
        html += '<div class="detail_bg"><div class="detail_bg_left"></div><div class="detail_bg_right"></div></div>';
        if (community[j].img != '')
            html += '<div class="detail_info_75"><div class="detail_img"><a href="javascript:void(0);"><img src="' + community[j].img + '" alt=""/></a></div>';
        else html += '<div class="detail_info_75"><div class="detail_img"><a href="javascript:void(0);" class="icon_status"></a></div>';
        html += '<div class="detail_header"><p>';
        if (community[j].title != '') html += community[j].status + ' <a href="javascript:void(0);" class="detail_nickname">' + community[j].title + '</a>';
        if (community[j].text != '') html += community[j].text;
        if (community[j].comt != '') html += '<em class="location"><a href="javascript:void(0);" class="detail_comments">' + community[j].comt + '</a><span class="detail_time"> - ' + community[j].time + '</span></em>';
        if (community[j].location != '') html += '<em class="location">@ <a href="javascript:void(0);" class="detail_comments"><strong>' + community[j].location + '</strong></a><span class="detail_time"> - ' + community[j].time + '</span></em>';
        html += '</p></div></div></div>';
        html += '</div></div>';
    }
    var module = $('module_what_happened');
    try {
        module.innerHTML = html;

        var listItems = module.childElements();
        new Effect.BlindDown(listItems[0], { duration: 3.0, scaleFrom: 0, restoreAfterFinish: true });
        new Effect.Appear(listItems[listItems.length - 1], { duration: 3.0, from: 1, to: 0 });
        listItems.invoke('observe', 'click', onClickFeed);
    } catch (ex) { }
    //return;
};

var k = 0; //record dau tien
var record = 4; // so record xuat hien trong phan Moi nguoi dang lam gi

/*
Tao hieu ugn truot cho trang Cong Dong (Moi nguoi dang lam gi)
T.Nguyen 28/05
*/
function escalator() {
    loadItems(k, record);
    var len = community.length;
    if (Math.abs(k) == len - 1) k = 0;
    else k = k - 1;
    setTimeout(escalator, 3000);
};

/*
click on each feed (Moi nguoi dang lam gi)
T.Nguyen 28/05
*/
function onClickFeed(obj) {
    var ele = Event.element(obj);
    //if (ele.tagName == 'IMG') alert(ele.src);
};


