<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ include file="../common/init.jsp"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>学习中心</title>
<%@ include file="../common/top.jsp"%>
<link rel="stylesheet" href="${ctx}/resources/css/main.css" type="text/css" />
<link rel='stylesheet' href='${ctx}/resources/css/user-center-style.css' type='text/css' media='screen' />
<link rel='stylesheet' href='${ctx}/resources/css/easyui.css' type='text/css' media='screen' />
<link rel='stylesheet' href='${ctx}/resources/css/easyui/icon.css' type='text/css' media='screen' />

<script type="text/javascript" src="${ctx}/resources/js/jquery.easyui.min.js"></script>
<script type="text/javascript" src="${ctx}/resources/js/easyui-lang-zh_CN.js"></script>
<script type="text/javascript" src="${ctx}/resources/ckeditor4.4.7/ckeditor.js"></script>
<script type="text/javascript" src="${ctx}/resources/js/swfupload/swfupload.js"></script>
<script type="text/javascript" src="${ctx}/resources/js/swfupload/swfupload.queue.js"></script>
<script type="text/javascript" src="${ctx}/resources/js/jquery.alerts.js"></script>
<script type="text/javascript" src="${ctx}/resources/js/swfupload/uploadHandlers.js"></script>
</head>

<body>
	<%@ include file="../common/header.jsp"%>
	<div id="content">
		<%@ include file="../common/sub_menu.jsp"%>
		<div id="page">
			<div class="page-header">学习中心 ${learnCenter.categoryName }</div>
			<div class="page-body">
				<security:authorize ifAnyGranted="processManagement" >
					<div id="htmlContent" contenteditable="true" style="width:100%;height:100%">
						${learnCenter.htmlContent }
					</div>
				</security:authorize>
				
				<security:authorize ifNotGranted="processManagement" >
					<div id="htmlContent">
						${learnCenter.htmlContent }
					</div>
				</security:authorize>
				
			</div>
			<div class="page-footer">
				<div style="text-align:left;">
					<c:if test="${learnCenter.attachmentId > 0 }">
						附件列表：
						<c:forEach var="attachment" items="${attachments }">
							<a onclick='window.open("${ctx}/attachment/download/${attachment.id}")'>${attachment.originalName }</a>
							
						</c:forEach>
					</c:if>
				</div>
				
				<security:authorize ifAnyGranted="processManagement" >
					<input id="learnCenterId" type="hidden" value="${learnCenter.id }" />
					<input type="button" class="btn" onclick="goSave('${ctx }')" value="保存" />
					<button class="btn btn-small" id="uploadAttachmentBtn" style="margin-left: 20px;">上传附件</button>
				</security:authorize>
				
			</div>
		</div>
	</div>
	
	<div id="uploadFileDiv" title="上传附件" class="easyui-window" data-options="modal:true,closed:true,iconCls:'icon-import'" style="width:400px;height:190px;padding:10px;overflow: hidden;">
		<table cellpadding="5" width="380px;">
			<tr>
				<td><span id="spanButtonPlaceholder"></span></td>
			</tr>
			<tr>
				<td style="height: 50px;vertical-align: middle;">
					<span id="uploadedFileName"></span>
					<input type="hidden" id="uploadedAttId"/>
				</td>
			</tr>
		</table>
	</div>
	
<script type="text/javascript">
	$(function() {
		$("#downloadAttachmentBtn").click(function(){
			window.open("${ctx}/attachment/download/${learnCenter.attachmentId}");
		});

		{//加载SwfUpload上传组件
			loadSwfUpload();
		}
		
		$("#uploadAttachmentBtn").click(function(){
			$("#uploadedFileName").text("");
			$("#uploadedAttId").val("");
			$("#uploadFileDiv").window('open'); 
		});
	});
	
	function goSave(url){
		$(document).mask('正在保存中，请稍等...');
		var id = $('#learnCenterId').val();
		var htmlContent = $('#htmlContent').html();

		$.ajax({
			type : "POST",
			url : url + "/learnCenter/updateHtmlContent",
			data : JSON.stringify({'id': id, 'htmlContent': htmlContent}), 
			contentType : "application/json; charset=utf-8",
			dataType : "json",
			success : function(callback) {
				$(document).unmask();
				$.messager.alert('提示', "保存成功!");
			}
		});
	}
	
	var swfUpload = null;
	function loadSwfUpload() {
		swfUpload = new SWFUpload({
			 upload_url :"${ctx}/attachment/upload",
			 post_params: {"userId":"${sessionScope.web_session_user.id}"},
			 use_query_string : false,
			  
			// File Upload Settings
			file_size_limit : "50 MB",	// 50MB
			file_types : "*",
			file_types_description : "文件",
			file_upload_limit 	:	0,

			file_queue_error_handler : fileQueueError,
			file_dialog_complete_handler : fileDialogComplete,//选择好文件后提交
			upload_progress_handler : uploadProgress,
			upload_error_handler : uploadError,
			upload_success_handler : uploadSuccess,
			upload_complete_handler : uploadComplete,
			
			// Button Settings
			button_image_url : '${ctx}/resources/images/SmallSpyGlassWithTransperancy_17x18.png',
			button_placeholder_id : "spanButtonPlaceholder",
			button_width: 180,
			button_height: 18,
			button_text : '<span class="button">点击这里上传文件<span class="buttonSmall"></span></span>',
			button_text_style : '.button { font-family: Helvetica, Arial, sans-serif; font-size: 12px; } .buttonSmall { font-size: 10px; color: #ff0000;}',
			button_text_top_padding: 0,
			button_text_left_padding: 18,
			button_window_mode: SWFUpload.WINDOW_MODE.TRANSPARENT,
			button_cursor: SWFUpload.CURSOR.HAND,
			button_action: SWFUpload.BUTTON_ACTION.SELECT_FILE,
			
			
			// Flash Settings
			flash_url : '${ctx}/resources/js/swfupload/swfupload.swf',

			custom_settings : {
				upload_target : "importDivFileProgressContainer"
			},
			// Debug Settings
			debug: false //是否显示调试窗口
		});
	};
	
	function uploadSuccess(file, serverData) {
		$(document).unmask();
		serverData=eval('(' + serverData + ')');
		if(serverData.flag=='success'){
			$("#uploadedFileName").text("已上传文件：" + serverData.att.originalName);
			$("#uploadedAttId").val(serverData.att.id);
			
			var id = $('#learnCenterId').val();
			var attachmentId = serverData.att.id;
			
			$.ajax({
				type : "POST",
				url : "${ctx}/learnCenter/updateAttachment",
				data : JSON.stringify({'id': id, 'attachmentId': attachmentId}), 
				contentType : "application/json; charset=utf-8",
				dataType : "json",
				success : function(callback) {
					$(document).unmask();
					$.messager.alert('提示', "保存成功!");
					
					reloadWin();
				}
			});
			
		}else{
			$.messager.alert('提示',serverData.msg,'error');
		}
	}
</script>
</body>
</html>