<%@ page contentType="text/html;charset=UTF-8"%>
<link rel="stylesheet" type="text/css" href="${ctxStatic}/jBox/Source/jBox.css">
<script type="text/javascript" src="${ctxStatic}/jBox/Source/jBox.min.js"></script>
<script type="text/javascript">
var sheetTagModal = new jBox('Modal');
var sheetTagContainer = $('#sheet-tag-content');

$(document).ready(function() {
    sheetTagContainer.find('iframe').height($(window).height()*0.83);
});

function initSheetTagPopover(id, title, sheetServer, sheetUrl, answerUrl) {
    $('#sheet-tag-tab-nav').empty();
    $('#sheet-tag-tab-content').empty();
    
	sheetTagModal.setWidth($(window).width()*0.9);
	sheetTagModal.setHeight($(window).height()*0.85);
	sheetTagModal.setTitle('正在加载');
	//暂时屏蔽答案PDF显示
    initSheetTagPopoverContent(sheetServer, sheetUrl.split(','), '', function(){
        sheetTagModal.setTitle(title);
        sheetTagModal.setContent($('#sheet-tag-content'));
    });
	sheetTagModal.open();
}

function initSheetTagPopoverContent(sheetServer, sheetUrls, answerUrl, callback){
    var leftDiv = $('#sheet-tag-left');  
    var rightDiv = $('#sheet-tag-right');
    var tabNav = $('#sheet-tag-tab-nav');
    var tabContent = $('#sheet-tag-tab-content');
    if(answerUrl!=undefined && answerUrl.length>0){
        rightDiv.removeClass('span12');
        rightDiv.addClass('span6');
		leftDiv.find('iframe').attr('src', answerUrl);
		leftDiv.show();
	}else{
	    rightDiv.removeClass('span6');
	    rightDiv.addClass('span12');
		leftDiv.find('iframe').attr('src', '');
		leftDiv.hide();
	}

    tabNav.empty();
    tabContent.empty();
	for(var i=0;i<sheetUrls.length;i++){
		tabNav.append($('<li><a href="#sheet_tag_'+i+'" data-toggle="tab">第'+(i+1)+'页</a></li>'));
		tabContent.append($('<div class="tab-pane fade" id="sheet_tag_'+i+'" style="overflow: scroll;"></div>'));
		var image = new Image();
		image.src = sheetServer + sheetUrls[i];
		image.onload = function(){
		    this.width = Math.min(this.width, tabContent.width()>0?tabContent.width():($(window).width()*0.9-40));
		}
		$(image).appendTo($('#sheet_tag_'+i));
	}
	tabNav.find('a:first').trigger('click');
	callback();
}
</script>
<div id="sheet-tag-content" class="container-fluid" style="display:none">
	<div class="row-fluid">
		<div class="span6" style="overflow:scroll" id="sheet-tag-left">
			<iframe src="" border="0" scrolling="yes" width="100%"></iframe>
		</div>
		<div class="span6" id="sheet-tag-right">
			<ul class="nav nav-tabs" id="sheet-tag-tab-nav">
			</ul>
			<div class="tab-content" id="sheet-tag-tab-content">
			</div>
		</div>
	</div>
</div>