drama.news_lecture_clipContent = function() {
	// We only want these styles applied when javascript is enabled
	$('div.navigation').css({'width' : '300px', 'float' : 'left'});
	$('div.contentpic').css('display', 'block');

	// Initially set opacity on thumbs and add
	// additional styling for hover effect on thumbs
	var onMouseOutOpacity = 0.67;
	$('#thumbs ul.thumbs li').opacityrollover({
		mouseOutOpacity:   onMouseOutOpacity,
		mouseOverOpacity:  1.0,
		fadeSpeed:         'fast',
		exemptionSelector: '.selected'
	});
	
	// Initialize Advanced Galleriffic Gallery
	var gallery = $('#thumbs').galleriffic({
		delay:                     2500,
		numThumbs:                 15,
		preloadAhead:              10,
		enableTopPager:            true,
		enableBottomPager:         true,
		maxPagesToShow:            7,
		imageContainerSel:         '#slideshow',
		controlsContainerSel:      '#controls',
		captionContainerSel:       '#caption',
		loadingContainerSel:       '#loading',
		renderSSControls:          true,
		renderNavControls:         true,
		playLinkText:              'Play Slideshow',
		pauseLinkText:             'Pause Slideshow',
		prevLinkText:              '&lsaquo; Previous Photo',
		nextLinkText:              'Next Photo &rsaquo;',
		nextPageLinkText:          'Next &rsaquo;',
		prevPageLinkText:          '&lsaquo; Prev',
		enableHistory:             false,
		autoStart:                 false,
		syncTransitions:           true,
		defaultTransitionDuration: 900,
		onSlideChange:             function(prevIndex, nextIndex) {
			// 'this' refers to the gallery, which is an extension of $('#thumbs')
			this.find('ul.thumbs').children()
				.eq(prevIndex).fadeTo('fast', onMouseOutOpacity).end()
				.eq(nextIndex).fadeTo('fast', 1.0);
		},
		onPageTransitionOut:       function(callback) {
			this.fadeTo('fast', 0.0, callback);
		},
		onPageTransitionIn:        function() {
			this.fadeTo('fast', 1.0);
		}
	});
}

drama.lecture_form = function() {
    
}

drama.news_lecture_list = function() {
    // hide all popup
    $('.lecturedetail').hide();
    
    // detail popup
    $('.detail').each(function() {
        $(this)
            .click(function() {
                return false;
            })
            .hover(function() {
                $('.lecturedetail').hide();
                $(this).parent().find('.lecturedetail').show();
            }, function() {
                $('.lecturedetail').hide();
            });
    });
    
    // popup show itself
    $('.lecturedetail').hover(function() {
        $(this).show();
    }, function() {
        $(this).hide();
    });
}

drama.news_lecture_form = function() {
    var $dF = $('#divFill'),
        $dC = $('#divConfirm').hide(),
        $notice = $('.notice').css({height: 100}),
        $signupForm = $('#signupForm'),
        $year = $('#year'),
        $yearStr = '西元年',
        $noticeStr = '感謝您，您的報名資料已經送出，但並不代表您報名成功。<br />老行家將於3~5個工作天內，確認出席資格與名額後，<br />寄送報名結果至您的信箱，<br /><strong>別忘了確認您有報名成功再出席課程哦!</strong><div class="clear"></div><a href="news_lecture_list.php" class="circleBtn"><span>確認關閉</span></a>';
        
    // setting modal
    with ($.blockUI.defaults) {
        css.border = 'none';
        css.cursor = 'default';
        css.color = '#666666';
        css.textAlign = 'left';
        css.cursor = 'default';
        overlayCSS.cursor = 'default';
        overlayCSS.opacity = 0.7;
        overlayCSS.backgroundColor = '#6a9e60';
    }
    
    // custom birthday year
    $year
        .focus(function() {
            if ($year.val() == $yearStr) {
                $year.val('');
            }
        })
        .blur(function() {
            if ($year.val() == '') {
                $year.val($yearStr);
            }
        });
    
    // form validate
    $signupForm.validate({
        rules: {
            name: 'required',
            year: {
                required: true,
                digits: true
            },
            cell: 'required',
            email: {
                required: true,
                email: true
            },
            address: 'required'
        },
        messages: {
            name: {
                required: '請輸入姓名'
            },
            year: {
                required: '請輸入生日',
                digits: '請輸入正確格式'
            },
            cell: {
                required: '請輸入手機號碼'
            },
            email: {
                required: '請輸入電子信箱',
                email: '請輸入正確Email格式'
            },
            address: {
                required: '請輸入地址'
            }
        },
        errorPlacement: function(err, ele) {
            err.appendTo(ele.parent("td"));
        },
        errorElement: 'span',
        submitHandler: function() {
            var $phone = '';
            $('#confirmName').html($('#name').val());
            $('#confirmBirth').html($('#year').val() + '年' + $('#month option:selected').val() + '月' + $('#day option:selected').val() + '日');
            $('#confirmGender').html($('[name="gender"]:checked').attr('myGender'))
            $('#confirmCell').html($('#cell').val());
            $phone += $('#area').val();
            $phone += ' ' + $('#phone').val();
            if ($('#ext').val() != '') { $phone += '#' + $('#ext').val() };
            $('#confirmPhone').html($phone);
            $('#confirmEmail').html($('#email').val());
            $('#confirmAddress').html($('#city option:selected').text() + $('#address').val());
            $dF.fadeOut(function() {
                $dC.fadeIn();
            });
        }
    });
        
    // fill form submit button
    $('#btnFillSubmit').click(function() {
        $signupForm.submit();
        return false;
    });
    
    // confirm submit button
    $('#btnConfirmSubmit').click(function() {
        $notice.html('報名處理中…');
        $.post('ajax_lecture_signup.php', $signupForm.serialize(), function($res) {
            if ($.trim($res.err) == '') {
                $notice.html($noticeStr);
            } else {
                $notice.html($res.err);
                $('body').oneTime(2500, $.unblockUI);
            }
        }, 'json');
        $.blockUI({
            message: $notice,
            css: {
                width: $notice.width(),
                height: $notice.height(),
                left: ($(window).width() - $notice.width()) / 2,
                top: ($(window).height() - $notice.height()) / 2
            }
        });
        return false;
    });
    
    // confirm back button
    $('#btnConfirmBack').click(function() {
        $dC.fadeOut(function() {
            $dF.fadeIn();
        });
        return false;
    });
}
