update
This commit is contained in:
56
tool-tech-file-view/src/main/resources/web/bpmn.ftl
Normal file
56
tool-tech-file-view/src/main/resources/web/bpmn.ftl
Normal file
@@ -0,0 +1,56 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="content-type" content="text/html; charset=utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
<#include "*/commonHeader.ftl">
|
||||
<script src="js/base64.min.js" type="text/javascript"></script>
|
||||
<#if currentUrl?contains("http://") || currentUrl?contains("https://") || currentUrl?contains("file://")>
|
||||
<#assign finalUrl="${currentUrl}">
|
||||
<#elseif currentUrl?contains("ftp://") >
|
||||
<#assign finalUrl="${currentUrl}">
|
||||
<#else>
|
||||
<#assign finalUrl="${baseUrl}${currentUrl}">
|
||||
</#if>
|
||||
<style>
|
||||
html, body, #diagram {
|
||||
height: 100%
|
||||
}
|
||||
</style>
|
||||
<title>kkFileView Bpmn</title>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<h2>kkFileView Bpmn : ${fileName}</h2>
|
||||
|
||||
<div id="diagram"></div>
|
||||
|
||||
<!-- required modeler styles -->
|
||||
<link rel="stylesheet" href="bpmn/diagram-js.css">
|
||||
<link rel="stylesheet" href="bpmn/bpmn-js.css">
|
||||
<link rel="stylesheet" href="bpmn/css/bpmn.css">
|
||||
|
||||
<!-- modeler distro -->
|
||||
<script src="bpmn/bpmn-modeler.development.js"></script>
|
||||
<script src="js/jquery-3.6.1.min.js"></script>
|
||||
|
||||
<!-- app -->
|
||||
<script>
|
||||
|
||||
const viewer = new BpmnJS({
|
||||
container: '#diagram'
|
||||
});
|
||||
var url = '${finalUrl}';
|
||||
var baseUrl = '${baseUrl}'.endsWith('/') ? '${baseUrl}' : '${baseUrl}' + '/';
|
||||
if (!url.startsWith(baseUrl)) {
|
||||
url = baseUrl + 'getCorsFile?urlPath=' + encodeURIComponent(Base64.encode(url));
|
||||
}
|
||||
async function showDiagram(diagramXML) {
|
||||
await viewer.importXML(diagramXML);
|
||||
}
|
||||
// load + show diagram
|
||||
$.get(url, showDiagram, 'text');
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
70
tool-tech-file-view/src/main/resources/web/code.ftl
Normal file
70
tool-tech-file-view/src/main/resources/web/code.ftl
Normal file
@@ -0,0 +1,70 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8"/>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=yes, initial-scale=1.0">
|
||||
<title>代码预览</title>
|
||||
<#include "*/commonHeader.ftl">
|
||||
<script src="js/jquery-3.6.1.min.js" type="text/javascript"></script>
|
||||
<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css"/>
|
||||
<script src="bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
|
||||
<link rel="stylesheet" href="highlight/default.min.css">
|
||||
<script src="highlight/highlight.min.js" type="text/javascript"></script>
|
||||
<script src="js/base64.min.js" type="text/javascript"></script>
|
||||
<script>hljs.highlightAll()</script>
|
||||
|
||||
<style>
|
||||
div.code {
|
||||
white-space: pre;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<input hidden id="textData" value="${textData}"/>
|
||||
|
||||
<div class="container">
|
||||
<div class="panel panel-default">
|
||||
<div class="panel-heading">
|
||||
<h4 class="panel-title">
|
||||
<a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">
|
||||
${file.name}
|
||||
</a>
|
||||
</h4>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<div id="code" class='code'></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<script>
|
||||
/**
|
||||
* 初始化
|
||||
*/
|
||||
window.onload = function () {
|
||||
initWaterMark();
|
||||
loadText();
|
||||
}
|
||||
|
||||
/**
|
||||
*加载普通文本
|
||||
*/
|
||||
function loadText() {
|
||||
var base64data = $("#textData").val()
|
||||
var textData = Base64.decode(base64data);
|
||||
|
||||
var textPreData = "<pre><code>" + textData + "</code></pre>";
|
||||
$("#code").append(textPreData);
|
||||
document.querySelectorAll('div.code').forEach(block => {
|
||||
// then highlight each
|
||||
hljs.highlightBlock(block);
|
||||
});
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
42
tool-tech-file-view/src/main/resources/web/commonHeader.ftl
Normal file
42
tool-tech-file-view/src/main/resources/web/commonHeader.ftl
Normal file
@@ -0,0 +1,42 @@
|
||||
<#setting classic_compatible=true>
|
||||
<link rel="icon" href="./favicon.ico" type="image/x-icon">
|
||||
<script src="js/watermark.js" type="text/javascript"></script>
|
||||
|
||||
<script>
|
||||
/**
|
||||
* 初始化水印
|
||||
*/
|
||||
function initWaterMark() {
|
||||
let watermarkTxt = '${watermarkTxt}';
|
||||
if (watermarkTxt !== '') {
|
||||
watermark.init({
|
||||
watermark_txt: '${watermarkTxt}',
|
||||
watermark_x: 0,
|
||||
watermark_y: 0,
|
||||
watermark_rows: 0,
|
||||
watermark_cols: 0,
|
||||
watermark_x_space: ${watermarkXSpace},
|
||||
watermark_y_space: ${watermarkYSpace},
|
||||
watermark_font: '${watermarkFont}',
|
||||
watermark_fontsize: '${watermarkFontsize}',
|
||||
watermark_color: '${watermarkColor}',
|
||||
watermark_alpha: ${watermarkAlpha},
|
||||
watermark_width: ${watermarkWidth},
|
||||
watermark_height: ${watermarkHeight},
|
||||
watermark_angle: ${watermarkAngle},
|
||||
});
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
html, body {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
</style>
|
||||
71
tool-tech-file-view/src/main/resources/web/compress.ftl
Normal file
71
tool-tech-file-view/src/main/resources/web/compress.ftl
Normal file
@@ -0,0 +1,71 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8"/>
|
||||
<title>压缩包预览</title>
|
||||
<script src="js/jquery-3.6.1.min.js"></script>
|
||||
<#include "*/commonHeader.ftl">
|
||||
<script src="js/base64.min.js" type="text/javascript"></script>
|
||||
<link href="css/zTreeStyle.css" rel="stylesheet" type="text/css">
|
||||
<script type="text/javascript" src="js/jquery.ztree.core.js"></script>
|
||||
<style type="text/css">
|
||||
body {
|
||||
background-color: #404040;
|
||||
}
|
||||
h1 {font-size: 24px;line-height: 34px;text-align: center;}
|
||||
a {color:#3C6E31;text-decoration: underline;}
|
||||
a:hover {background-color:#3C6E31;color:white;}
|
||||
code {color: #2f332a;}
|
||||
div.zTreeDemoBackground {
|
||||
max-width: 880px;
|
||||
text-align:center;
|
||||
margin:0 auto;
|
||||
border-radius:3px;
|
||||
box-shadow:rgba(0,0,0,0.15) 0 0 8px;
|
||||
background:#FBFBFB;
|
||||
border:1px solid #ddd;
|
||||
margin:1px auto;
|
||||
padding:5px;
|
||||
}
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="zTreeDemoBackground left">
|
||||
<h1>kkFileView</h1>
|
||||
<ul id="treeDemo" class="ztree"></ul>
|
||||
</div>
|
||||
<script>
|
||||
var settings = {
|
||||
data: {
|
||||
simpleData: {
|
||||
enable: true, //true 、 false 分别表示 使用 、 不使用 简单数据模式
|
||||
idKey: "id", //节点数据中保存唯一标识的属性名称
|
||||
pIdKey: "pid", //节点数据中保存其父节点唯一标识的属性名称
|
||||
rootPId: ""
|
||||
}
|
||||
},
|
||||
callback: {
|
||||
onClick: chooseNode,
|
||||
}
|
||||
};
|
||||
function chooseNode(event, treeId, treeNode) {
|
||||
if (!treeNode.isParent) {
|
||||
var path = '${baseUrl}' + treeNode.id + "?kkCompressfileKey=" + encodeURIComponent('${fileTree}')+"&kkCompressfilepath=" + encodeURIComponent(treeNode.id)+"&fullfilename="+encodeURIComponent(treeNode.name);
|
||||
location.href = "${baseUrl}onlinePreview?url=" + encodeURIComponent(Base64.encode(path));
|
||||
}
|
||||
}
|
||||
$(document).ready(function () {
|
||||
var url = '${fileTree}';
|
||||
$.ajax({
|
||||
type: "get",
|
||||
url: "${baseUrl}directory?urls="+encodeURIComponent(Base64.encode(url)),
|
||||
success: function (res) {
|
||||
zTreeObj = $.fn.zTree.init($("#treeDemo"), settings, res); //初始化树
|
||||
zTreeObj.expandAll(true); //true 节点全部展开、false节点收缩
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
84
tool-tech-file-view/src/main/resources/web/csv.ftl
Normal file
84
tool-tech-file-view/src/main/resources/web/csv.ftl
Normal file
@@ -0,0 +1,84 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<title>${file.name}预览</title>
|
||||
<#include "*/commonHeader.ftl">
|
||||
<link rel="stylesheet" href="xspreadsheet/xspreadsheet.css"/>
|
||||
<script src="xspreadsheet/xspreadsheet.js"></script>
|
||||
<script src="xspreadsheet/is-utf8.js"></script>
|
||||
<script src="xspreadsheet/xlsx.full.min.js"></script>
|
||||
<script src="xspreadsheet/xlsxspread.min.js"></script>
|
||||
<script src="xspreadsheet/zh-cn.js"></script>
|
||||
<script src="js/base64.min.js" type="text/javascript"></script>
|
||||
</head>
|
||||
<#if csvUrl?contains("http://") || csvUrl?contains("https://")>
|
||||
<#assign finalUrl="${csvUrl}">
|
||||
<#elseif csvUrl?contains("ftp://") >
|
||||
<#assign finalUrl="${csvUrl}">
|
||||
<#else>
|
||||
<#assign finalUrl="${baseUrl}${csvUrl}">
|
||||
</#if>
|
||||
<body>
|
||||
<div id="htmlout"></div>
|
||||
<script>
|
||||
x_spreadsheet.locale('zh-cn');
|
||||
var HTMLOUT = document.getElementById('htmlout');
|
||||
var xspr = x_spreadsheet(HTMLOUT);
|
||||
HTMLOUT.style.height = (window.innerHeight - 400) + "px";
|
||||
HTMLOUT.style.width = (window.innerWidth - 50) + "px";
|
||||
|
||||
var process_wb = (function() {
|
||||
return function process_wb(wb) {
|
||||
var data = stox(wb);
|
||||
xspr.loadData(data);
|
||||
if(typeof console !== 'undefined') console.log("output", new Date());
|
||||
};
|
||||
})();
|
||||
var url = '${finalUrl}';
|
||||
var baseUrl = '${baseUrl}'.endsWith('/') ? '${baseUrl}' : '${baseUrl}' + '/';
|
||||
if (!url.startsWith(baseUrl)) {
|
||||
url = baseUrl + 'getCorsFile?urlPath=' + encodeURIComponent(Base64.encode(url));
|
||||
}
|
||||
let xhr = new XMLHttpRequest();
|
||||
xhr.open('GET',url); //文件所在地址
|
||||
xhr.responseType = 'blob';
|
||||
xhr.onload = () => {
|
||||
let content = xhr.response;
|
||||
let blob = new Blob([content]);
|
||||
let file = new File([blob],'excel.csv',{ type: 'excel/csv' });
|
||||
var reader = new FileReader();
|
||||
reader.onload = function(e) {
|
||||
if(typeof console !== 'undefined') console.log("onload", new Date());
|
||||
var data = e.target.result;
|
||||
data = new Uint8Array(data);
|
||||
let f = isUTF8(data);
|
||||
if (f) {
|
||||
try {
|
||||
var str = cptable.utils.decode(65001, data);
|
||||
process_wb(XLSX.read(str, { type: "string" }));
|
||||
} catch (error) {
|
||||
process_wb(XLSX.read(data));
|
||||
}
|
||||
} else {
|
||||
try {
|
||||
var str = cptable.utils.decode(936, data);
|
||||
process_wb(XLSX.read(str, { type: "string" }));
|
||||
} catch (error) {
|
||||
process_wb(XLSX.read(data));
|
||||
}
|
||||
}
|
||||
};
|
||||
reader.readAsArrayBuffer(file);
|
||||
}
|
||||
xhr.send();
|
||||
/*初始化水印*/
|
||||
if (!!window.ActiveXObject || "ActiveXObject" in window)
|
||||
{
|
||||
}else{
|
||||
initWaterMark();
|
||||
}
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
104
tool-tech-file-view/src/main/resources/web/dcm.ftl
Normal file
104
tool-tech-file-view/src/main/resources/web/dcm.ftl
Normal file
@@ -0,0 +1,104 @@
|
||||
<!DOCTYPE html>
|
||||
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8"/>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=yes, initial-scale=1.0">
|
||||
<title>DCM预览</title>
|
||||
<#include "*/commonHeader.ftl">
|
||||
<script src="js/base64.min.js" type="text/javascript"></script>
|
||||
</head>
|
||||
<style>
|
||||
.container{
|
||||
width: 100%;
|
||||
height: 98%;
|
||||
max-width: 98%;
|
||||
margin: auto;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
background-color: green;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<#if currentUrl?contains("http://") || currentUrl?contains("https://")>
|
||||
<#assign finalUrl="${currentUrl}">
|
||||
<#else>
|
||||
<#assign finalUrl="${baseUrl}${currentUrl}">
|
||||
</#if>
|
||||
<div class="container" id="cornerstoneViewport">
|
||||
|
||||
</div>
|
||||
<script src="dcm/cornerstone.js"></script>
|
||||
<script src="dcm/cornerstoneMath.js"></script>
|
||||
<script src="dcm/cornerstoneTools.js"></script>
|
||||
<script src="dcm/dicomParser.js"></script>
|
||||
<script src="dcm/cornerstoneWADOImageLoader.bundle.min.js"></script>
|
||||
<script src="dcm/hammer.min.js"></script>
|
||||
<script src="dcm/initCornerstone.js"></script>
|
||||
<script src="dcm/react.development.js" ></script>
|
||||
<script src="dcm/react-dom.development.js"></script>
|
||||
<script>
|
||||
"use strict";
|
||||
|
||||
var process = {
|
||||
env: {
|
||||
NODE_ENV: "production"
|
||||
}
|
||||
};
|
||||
|
||||
window.process = process;
|
||||
</script>
|
||||
<script src="dcm/index.umd.js"></script>
|
||||
|
||||
<script>
|
||||
var url = '${finalUrl}';
|
||||
var baseUrl = '${baseUrl}'.endsWith('/') ? '${baseUrl}' : '${baseUrl}' + '/';
|
||||
if (!url.startsWith(baseUrl)) {
|
||||
url = baseUrl + 'getCorsFile?urlPath=' + encodeURIComponent(Base64.encode(url));
|
||||
}
|
||||
"use strict";
|
||||
|
||||
var imageNames = [];
|
||||
for (var i = 1; i < 546; i++) {
|
||||
imageNames.push(url);
|
||||
}
|
||||
// console.log(url);
|
||||
var imageIds = imageNames.map(name => {
|
||||
return 'dicomweb:'+url+'';
|
||||
});
|
||||
var imagePromises = imageIds.map(imageId => {
|
||||
return cornerstone.loadAndCacheImage(imageId);
|
||||
});
|
||||
|
||||
var exampleData = {
|
||||
stack: {
|
||||
currentImageIdIndex: 0,
|
||||
imageIds: imageIds
|
||||
}
|
||||
};
|
||||
|
||||
var CornerstoneViewport = window["react-cornerstone-viewport"];
|
||||
var props = {
|
||||
viewportData: exampleData,
|
||||
cornerstone,
|
||||
cornerstoneTools,
|
||||
activeTool: "Brush"
|
||||
};
|
||||
|
||||
var app = React.createElement(CornerstoneViewport, props, null);
|
||||
|
||||
ReactDOM.render(
|
||||
app,
|
||||
document.getElementById("cornerstoneViewport")
|
||||
);
|
||||
/*初始化水印*/
|
||||
window.onload = function () {
|
||||
initWaterMark();
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
42
tool-tech-file-view/src/main/resources/web/drawio.ftl
Normal file
42
tool-tech-file-view/src/main/resources/web/drawio.ftl
Normal file
@@ -0,0 +1,42 @@
|
||||
<!DOCTYPE html>
|
||||
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8"/>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=yes, initial-scale=1.0">
|
||||
<title>drawio文件预览</title>
|
||||
<#include "*/commonHeader.ftl">
|
||||
<script src="js/base64.min.js" type="text/javascript"></script>
|
||||
</head>
|
||||
<body>
|
||||
<iframe src="" width="100%" frameborder="0"></iframe>
|
||||
<#if currentUrl?contains("http://") || currentUrl?contains("https://")>
|
||||
<#assign finalUrl="${currentUrl}">
|
||||
<#else>
|
||||
<#assign finalUrl="${baseUrl}${currentUrl}">
|
||||
</#if>
|
||||
<script>
|
||||
var url = '${finalUrl}';
|
||||
var baseUrl = '${baseUrl}'.endsWith('/') ? '${baseUrl}' : '${baseUrl}' + '/';
|
||||
if (!url.startsWith(baseUrl)) {
|
||||
url = baseUrl + 'getCorsFile?urlPath=' + encodeURIComponent(Base64.encode(url));
|
||||
}
|
||||
document.getElementsByTagName('iframe')[0].src = "${baseUrl}drawio/index.html?lightbox=1&gapi=0&db=0&od=0&tr=0&gh=0&gl=0&edit=_blank&lang=zh#U"+ encodeURIComponent(url)+"";
|
||||
document.getElementsByTagName('iframe')[0].height = document.documentElement.clientHeight - 10;
|
||||
/**
|
||||
* 页面变化调整高度
|
||||
*/
|
||||
window.onresize = function () {
|
||||
var fm = document.getElementsByTagName("iframe")[0];
|
||||
fm.height = window.document.documentElement.clientHeight - 10;
|
||||
}
|
||||
|
||||
|
||||
/*初始化水印*/
|
||||
window.onload = function () {
|
||||
initWaterMark();
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
44
tool-tech-file-view/src/main/resources/web/eml.ftl
Normal file
44
tool-tech-file-view/src/main/resources/web/eml.ftl
Normal file
@@ -0,0 +1,44 @@
|
||||
<!DOCTYPE html>
|
||||
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>${file.name}文件预览</title>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width, user-scalable=yes, initial-scale=1.0">
|
||||
<#include "*/commonHeader.ftl">
|
||||
<script src="js/base64.min.js" type="text/javascript"></script>
|
||||
</head>
|
||||
<#if currentUrl?contains("http://") || currentUrl?contains("https://") || currentUrl?contains("file://")>
|
||||
<#assign finalUrl="${currentUrl}">
|
||||
<#elseif currentUrl?contains("ftp://") >
|
||||
<#assign finalUrl="${currentUrl}">
|
||||
<#else>
|
||||
<#assign finalUrl="${baseUrl}${currentUrl}">
|
||||
</#if>
|
||||
<body>
|
||||
<iframe src="" width="100%" frameborder="0"></iframe>
|
||||
</body>
|
||||
<script type="text/javascript">
|
||||
var url = '${finalUrl}';
|
||||
var baseUrl = '${baseUrl}'.endsWith('/') ? '${baseUrl}' : '${baseUrl}' + '/';
|
||||
if (!url.startsWith(baseUrl)) {
|
||||
url = baseUrl + 'getCorsFile?urlPath=' + encodeURIComponent(Base64.encode(url));
|
||||
}
|
||||
document.getElementsByTagName('iframe')[0].src = "${baseUrl}eml/index.html?file="+encodeURIComponent(url);
|
||||
document.getElementsByTagName('iframe')[0].height = document.documentElement.clientHeight - 10;
|
||||
/**
|
||||
* 页面变化调整高度
|
||||
*/
|
||||
window.onresize = function () {
|
||||
var fm = document.getElementsByTagName("iframe")[0];
|
||||
fm.height = window.document.documentElement.clientHeight - 10;
|
||||
}
|
||||
|
||||
/*初始化水印*/
|
||||
if (!!window.ActiveXObject || "ActiveXObject" in window)
|
||||
{
|
||||
}else{
|
||||
initWaterMark();
|
||||
}
|
||||
</script>
|
||||
</html>
|
||||
159
tool-tech-file-view/src/main/resources/web/epub.ftl
Normal file
159
tool-tech-file-view/src/main/resources/web/epub.ftl
Normal file
@@ -0,0 +1,159 @@
|
||||
<!DOCTYPE html>
|
||||
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>${file.name}文件预览</title>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width, user-scalable=yes, initial-scale=1.0">
|
||||
<#include "*/commonHeader.ftl">
|
||||
<script src="js/base64.min.js" type="text/javascript"></script>
|
||||
<script src="js/jszip.min.js"></script>
|
||||
<script src="epub/epub.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="epub/examples.css">
|
||||
</head>
|
||||
<#if currentUrl?contains("http://") || currentUrl?contains("https://") || currentUrl?contains("file://")>
|
||||
<#assign finalUrl="${currentUrl}">
|
||||
<#elseif currentUrl?contains("ftp://") >
|
||||
<#assign finalUrl="${currentUrl}">
|
||||
<#else>
|
||||
<#assign finalUrl="${baseUrl}${currentUrl}">
|
||||
</#if>
|
||||
<body>
|
||||
<select id="toc"></select>
|
||||
<div id="viewer" class="scrolled"></div>
|
||||
<div id="prev" class="arrow">‹</div>
|
||||
<div id="next" class="arrow">›</div>
|
||||
</body>
|
||||
<script type="text/javascript">
|
||||
var url = '${finalUrl}';
|
||||
var baseUrl = '${baseUrl}'.endsWith('/') ? '${baseUrl}' : '${baseUrl}' + '/';
|
||||
if (!url.startsWith(baseUrl)) {
|
||||
url = baseUrl + 'getCorsFile?urlPath=' + encodeURIComponent(Base64.encode(url));
|
||||
}
|
||||
|
||||
function blobToArrayBuffer(blob) {
|
||||
return new Promise((resolve, reject) => {
|
||||
const reader = new FileReader();
|
||||
reader.onerror = reject;
|
||||
reader.onload = () => {
|
||||
resolve(reader.result);
|
||||
};
|
||||
reader.readAsArrayBuffer(blob);
|
||||
});
|
||||
}
|
||||
let xhr = new XMLHttpRequest();
|
||||
xhr.open('GET',url); //文件所在地址
|
||||
xhr.responseType = 'blob';
|
||||
xhr.onload = () => {
|
||||
var currentSectionIndex = 100;
|
||||
var book = ePub();
|
||||
let content = xhr.response;
|
||||
let blob = new Blob([content]);
|
||||
var bookData = blobToArrayBuffer(blob);
|
||||
book.open(bookData, "binary");
|
||||
var rendition = book.renderTo("viewer", {
|
||||
flow: "scrolled-doc",
|
||||
width: "100%",
|
||||
allowScriptedContent: true
|
||||
// height: 600
|
||||
});
|
||||
|
||||
var displayed = rendition.display();
|
||||
var params = URLSearchParams && new URLSearchParams(document.location.search.substring(1));
|
||||
var currentSectionIndex = (params && params.get("loc")) ? params.get("loc") : undefined;
|
||||
rendition.display(currentSectionIndex);
|
||||
var next = document.getElementById("next");
|
||||
next.addEventListener("click", function(e){
|
||||
rendition.next();
|
||||
e.preventDefault();
|
||||
}, false);
|
||||
|
||||
var prev = document.getElementById("prev");
|
||||
prev.addEventListener("click", function(e){
|
||||
rendition.prev();
|
||||
e.preventDefault();
|
||||
}, false);
|
||||
|
||||
rendition.on("rendered", function(section){
|
||||
var nextSection = section.next();
|
||||
var prevSection = section.prev();
|
||||
|
||||
if(nextSection) {
|
||||
nextNav = book.navigation.get(nextSection.href);
|
||||
|
||||
if(nextNav) {
|
||||
nextLabel = nextNav.label;
|
||||
} else {
|
||||
nextLabel = "next";
|
||||
}
|
||||
|
||||
next.textContent = " »";
|
||||
} else {
|
||||
next.textContent = "";
|
||||
}
|
||||
if(prevSection) {
|
||||
prevNav = book.navigation.get(prevSection.href);
|
||||
|
||||
if(prevNav) {
|
||||
prevLabel = prevNav.label;
|
||||
} else {
|
||||
prevLabel = "previous";
|
||||
}
|
||||
prev.textContent = "« " ;
|
||||
} else {
|
||||
prev.textContent = "";
|
||||
}
|
||||
});
|
||||
|
||||
rendition.on("rendered", function(section){
|
||||
var current = book.navigation && book.navigation.get(section.href);
|
||||
|
||||
if (current) {
|
||||
var $select = document.getElementById("toc");
|
||||
var $selected = $select.querySelector("option[selected]");
|
||||
if ($selected) {
|
||||
$selected.removeAttribute("selected");
|
||||
}
|
||||
|
||||
var $options = $select.querySelectorAll("option");
|
||||
for (var i = 0; i < $options.length; ++i) {
|
||||
let selected = $options[i].getAttribute("ref") === current.href;
|
||||
if (selected) {
|
||||
$options[i].setAttribute("selected", "");
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
book.loaded.navigation.then(function(toc){
|
||||
var $select = document.getElementById("toc"),
|
||||
docfrag = document.createDocumentFragment();
|
||||
|
||||
toc.forEach(function(chapter) {
|
||||
var option = document.createElement("option");
|
||||
option.textContent = chapter.label;
|
||||
option.setAttribute("ref", chapter.href);
|
||||
|
||||
docfrag.appendChild(option);
|
||||
});
|
||||
$select.appendChild(docfrag);
|
||||
$select.onchange = function(){
|
||||
var index = $select.selectedIndex,
|
||||
url = $select.options[index].getAttribute("ref");
|
||||
rendition.display(url);
|
||||
return false;
|
||||
};
|
||||
});
|
||||
|
||||
}
|
||||
xhr.send();
|
||||
|
||||
|
||||
/*初始化水印*/
|
||||
if (!!window.ActiveXObject || "ActiveXObject" in window)
|
||||
{
|
||||
}else{
|
||||
initWaterMark();
|
||||
}
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,44 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8"/>
|
||||
<style type="text/css">
|
||||
body {
|
||||
margin: 0 auto;
|
||||
width: 900px;
|
||||
background-color: #CCB;
|
||||
}
|
||||
|
||||
.container {
|
||||
width: 700px;
|
||||
height: 700px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
img {
|
||||
width: auto;
|
||||
height: auto;
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
padding-bottom: 36px;
|
||||
}
|
||||
|
||||
span {
|
||||
display: block;
|
||||
font-size: 20px;
|
||||
color: blue;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="container">
|
||||
<img src="images/sorry.jpg"/>
|
||||
<span>
|
||||
该(${fileType})文件,系统暂不支持在线预览,具体原因如下:
|
||||
<p style="color: red;">${msg}</p>
|
||||
</span>
|
||||
<p>有任何疑问,请加入kk开源社区知识星球咨询:<a href="https://t.zsxq.com/09ZHSXbsQ">https://t.zsxq.com/09ZHSXbsQ</a><br></p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
33
tool-tech-file-view/src/main/resources/web/html.ftl
Normal file
33
tool-tech-file-view/src/main/resources/web/html.ftl
Normal file
@@ -0,0 +1,33 @@
|
||||
<!DOCTYPE html>
|
||||
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8"/>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=yes, initial-scale=1.0">
|
||||
<title>文件预览</title>
|
||||
<#include "*/commonHeader.ftl">
|
||||
<#include "*/needFilePasswordHeader.ftl">
|
||||
</head>
|
||||
<body>
|
||||
<iframe src="${pdfUrl}" width="100%" frameborder="0"></iframe>
|
||||
</body>
|
||||
|
||||
<script type="text/javascript">
|
||||
needFilePassword();
|
||||
</script>
|
||||
|
||||
<script type="text/javascript">
|
||||
document.getElementsByTagName('iframe')[0].height = document.documentElement.clientHeight - 10;
|
||||
/**
|
||||
* 页面变化调整高度
|
||||
*/
|
||||
window.onresize = function () {
|
||||
var fm = document.getElementsByTagName("iframe")[0];
|
||||
fm.height = window.document.documentElement.clientHeight - 10;
|
||||
}
|
||||
/*初始化水印*/
|
||||
window.onload = function () {
|
||||
initWaterMark();
|
||||
}
|
||||
</script>
|
||||
</html>
|
||||
361
tool-tech-file-view/src/main/resources/web/main/index.ftl
Normal file
361
tool-tech-file-view/src/main/resources/web/main/index.ftl
Normal file
@@ -0,0 +1,361 @@
|
||||
<!DOCTYPE html>
|
||||
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8"/>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
|
||||
<title>kkFileView演示首页</title>
|
||||
<link rel="icon" href="./favicon.ico" type="image/x-icon">
|
||||
<link rel="stylesheet" href="css/loading.css"/>
|
||||
<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css"/>
|
||||
<link rel="stylesheet" href="bootstrap-table/bootstrap-table.min.css"/>
|
||||
<link rel="stylesheet" href="css/theme.css"/>
|
||||
<script type="text/javascript" src="js/jquery-3.6.1.min.js"></script>
|
||||
<script type="text/javascript" src="js/jquery.form.min.js"></script>
|
||||
<script type="text/javascript" src="bootstrap/js/bootstrap.min.js"></script>
|
||||
<script type="text/javascript" src="bootstrap-table/bootstrap-table.min.js"></script>
|
||||
<script type="text/javascript" src="js/base64.min.js"></script>
|
||||
<style>
|
||||
<#-- 删除文件密码弹窗居中 -->
|
||||
.alert {
|
||||
width: 50%;
|
||||
}
|
||||
<#-- 删除文件验证码弹窗居中 -->
|
||||
.modal {
|
||||
width:100%;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
-ms-transform: translate(-50%, -50%);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<#-- 删除文件验证码弹窗 -->
|
||||
<#if deleteCaptcha >
|
||||
<div id="deleteCaptchaModal" class="modal fade" tabindex="-1" role="dialog">
|
||||
<div class="modal-dialog modal-sm" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
|
||||
<h4 class="modal-title">删除文件</h4>
|
||||
</div>
|
||||
<br>
|
||||
<input type="text" id="deleteCaptchaFileName" style="display: none">
|
||||
<div class="modal-body input-group">
|
||||
<span style="display: table-cell; vertical-align: middle;">
|
||||
<img id="deleteCaptchaImg" alt="deleteCaptchaImg" src="">
|
||||
|
||||
</span>
|
||||
<input type="text" id="deleteCaptchaText" class="form-control" placeholder="请输入验证码">
|
||||
</div>
|
||||
<div class="modal-footer" style="text-align: center">
|
||||
<button type="button" id="deleteCaptchaConfirmBtn" class="btn btn-danger">确认删除</button>
|
||||
<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</#if>
|
||||
|
||||
<!-- Fixed navbar -->
|
||||
<nav class="navbar navbar-inverse navbar-fixed-top">
|
||||
<div class="container">
|
||||
<div class="navbar-header">
|
||||
<a class="navbar-brand" href="https://kkview.cn" target='_blank'>kkFileView</a>
|
||||
</div>
|
||||
<ul class="nav navbar-nav">
|
||||
<li class="active"><a href="./index">首页</a></li>
|
||||
<li><a href="./integrated">接入说明</a></li>
|
||||
<li><a href="./record">版本发布记录</a></li>
|
||||
<li><a href="./sponsor">赞助开源</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<div class="container theme-showcase" role="main">
|
||||
<#-- 接入说明 -->
|
||||
<div class="page-header">
|
||||
<h1>支持的文件类型</h1>
|
||||
我们一直在扩展支持的文件类型,不断优化预览的效果,如果您有什么建议,欢迎在kk开源社区留意反馈:<a target='_blank' href="https://t.zsxq.com/09ZHSXbsQ">https://t.zsxq.com/09ZHSXbsQ</a>。
|
||||
</div>
|
||||
<div >
|
||||
<ol>
|
||||
<li>支持 doc, docx, xls, xlsx, xlsm, ppt, pptx, csv, tsv, dotm, xlt, xltm, dot, dotx, xlam, xla, pages 等 Office 办公文档</li>
|
||||
<li>支持 wps, dps, et, ett, wpt 等国产 WPS Office 办公文档</li>
|
||||
<li>支持 odt, ods, ots, odp, otp, six, ott, fodt, fods 等OpenOffice、LibreOffice 办公文档</li>
|
||||
<li>支持 vsd, vsdx 等 Visio 流程图文件</li>
|
||||
<li>支持 wmf, emf 等 Windows 系统图像文件</li>
|
||||
<li>支持 psd, eps 等 Photoshop 软件模型文件</li>
|
||||
<li>支持 pdf ,ofd, rtf 等文档</li>
|
||||
<li>支持 xmind 软件模型文件</li>
|
||||
<li>支持 bpmn 工作流文件</li>
|
||||
<li>支持 eml 邮件文件</li>
|
||||
<li>支持 epub 图书文档</li>
|
||||
<li>支持 obj, 3ds, stl, ply, gltf, glb, off, 3dm, fbx, dae, wrl, 3mf, ifc, brep, step, iges, fcstd, bim 等 3D 模型文件</li>
|
||||
<li>支持 dwg, dxf, dwf, iges , igs, dwt, dng, ifc, dwfx, stl, cf2, plt 等 CAD 模型文件</li>
|
||||
<li>支持 txt, xml(渲染), md(渲染), java, php, py, js, css 等所有纯文本</li>
|
||||
<li>支持 zip, rar, jar, tar, gzip, 7z 等压缩包</li>
|
||||
<li>支持 jpg, jpeg, png, gif, bmp, ico, jfif, webp 等图片预览(翻转,缩放,镜像)</li>
|
||||
<li>支持 tif, tiff 图信息模型文件</li>
|
||||
<li>支持 tga 图像格式文件</li>
|
||||
<li>支持 svg 矢量图像格式文件</li>
|
||||
<li>支持 mp3,wav,mp4,flv 等音视频格式文件</li>
|
||||
<li>支持 avi,mov,rm,webm,ts,rm,mkv,mpeg,ogg,mpg,rmvb,wmv,3gp,ts,swf 等视频格式转码预览</li>
|
||||
<li>支持 dcm 等医疗数位影像预览</li>
|
||||
<li>支持 drawio 绘图预览</li>
|
||||
</ol>
|
||||
</div>
|
||||
<#-- 输入下载地址预览文件 -->
|
||||
<div class="panel panel-success">
|
||||
<div class="panel-heading">
|
||||
<h3 class="panel-title">输入下载地址预览</h3>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<form>
|
||||
<div class="row">
|
||||
<div class="col-md-10">
|
||||
<div class="form-group">
|
||||
<input type="url" class="form-control" id="_url" placeholder="请输入预览文件 url">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-2">
|
||||
<button id="previewByUrl" type="button" class="btn btn-success">预览</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="alert alert-danger alert-dismissable hide" role="alert" id="previewCheckAlert">
|
||||
<button type="button" class="close" data-dismiss="alert" aria-label="Close">
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
<strong>请输入正确的url</strong>
|
||||
</div>
|
||||
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<#-- 预览测试 -->
|
||||
<div class="panel panel-success">
|
||||
<div class="panel-heading">
|
||||
<h3 class="panel-title">上传本地文件预览</h3>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<#if fileUploadDisable == false>
|
||||
<form enctype="multipart/form-data" id="fileUpload">
|
||||
<input type="file" id="file" name="file" style="float: left; margin: 0 auto; font-size:22px;" placeholder="请选择文件"/>
|
||||
<input type="button" id="fileUploadBtn" class="btn btn-success" value=" 上 传 "/>
|
||||
</form>
|
||||
</#if>
|
||||
<table id="table" data-pagination="true"></table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="loading_container" style="position: fixed;">
|
||||
<div class="spinner">
|
||||
<div class="spinner-container container1">
|
||||
<div class="circle1"></div>
|
||||
<div class="circle2"></div>
|
||||
<div class="circle3"></div>
|
||||
<div class="circle4"></div>
|
||||
</div>
|
||||
<div class="spinner-container container2">
|
||||
<div class="circle1"></div>
|
||||
<div class="circle2"></div>
|
||||
<div class="circle3"></div>
|
||||
<div class="circle4"></div>
|
||||
</div>
|
||||
<div class="spinner-container container3">
|
||||
<div class="circle1"></div>
|
||||
<div class="circle2"></div>
|
||||
<div class="circle3"></div>
|
||||
<div class="circle4"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<#if beian?? && beian != "default">
|
||||
<div style="display: grid; place-items: center;">
|
||||
<div>
|
||||
<a target="_blank" href="https://beian.miit.gov.cn/">${beian}</a>
|
||||
</div>
|
||||
</div>
|
||||
</#if>
|
||||
<script>
|
||||
<#if deleteCaptcha >
|
||||
$("#deleteCaptchaImg").click(function() {
|
||||
$("#deleteCaptchaImg").attr("src","${baseUrl}deleteFile/captcha?timestamp=" + new Date().getTime());
|
||||
});
|
||||
$("#deleteCaptchaConfirmBtn").click(function() {
|
||||
var fileName = $("#deleteCaptchaFileName").val();
|
||||
var deleteCaptchaText = $("#deleteCaptchaText").val();
|
||||
$.get('${baseUrl}deleteFile?fileName=' + fileName +'&password=' + deleteCaptchaText, function(data){
|
||||
if ("删除文件失败,密码错误!" === data.msg) {
|
||||
alert(data.msg);
|
||||
} else {
|
||||
$('#table').bootstrapTable("refresh", {});
|
||||
$("#deleteCaptchaText").val("");
|
||||
$("#deleteCaptchaModal").modal("hide");
|
||||
}
|
||||
});
|
||||
});
|
||||
function deleteFile(fileName) {
|
||||
$("#deleteCaptchaImg").click();
|
||||
$("#deleteCaptchaFileName").val(fileName);
|
||||
$("#deleteCaptchaText").val("");
|
||||
$("#deleteCaptchaModal").modal("show");
|
||||
}
|
||||
<#else>
|
||||
function deleteFile(fileName) {
|
||||
if (window.confirm('你确定要删除文件吗?')) {
|
||||
password = prompt("请输入默认密码:123456");
|
||||
$.ajax({
|
||||
url: '${baseUrl}deleteFile?fileName=' + fileName +'&password='+password,
|
||||
success: function (data) {
|
||||
if ("删除文件失败,密码错误!" === data.msg) {
|
||||
alert(data.msg);
|
||||
} else {
|
||||
$("#table").bootstrapTable("refresh", {});
|
||||
}
|
||||
}
|
||||
});
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
</#if>
|
||||
|
||||
function showLoadingDiv() {
|
||||
var height = window.document.documentElement.clientHeight - 1;
|
||||
$(".loading_container").css("height", height).show();
|
||||
}
|
||||
|
||||
function onFileSelected() {
|
||||
var file = $("#fileSelect").val();
|
||||
$("#fileName").text(file);
|
||||
}
|
||||
|
||||
function checkUrl(url) {
|
||||
//url= 协议://(ftp的登录信息)[IP|域名](:端口号)(/或?请求参数)
|
||||
var strRegex = '^((https|http|ftp)://)'//(https或http或ftp)
|
||||
+ '(([\\w_!~*\'()\\.&=+$%-]+: )?[\\w_!~*\'()\\.&=+$%-]+@)?' //ftp的user@ 可有可无
|
||||
+ '(([0-9]{1,3}\\.){3}[0-9]{1,3}' // IP形式的URL- 3位数字.3位数字.3位数字.3位数字
|
||||
+ '|' // 允许IP和DOMAIN(域名)
|
||||
+ '(localhost)|' //匹配localhost
|
||||
+ '([\\w_!~*\'()-]+\\.)*' // 域名- 至少一个[英文或数字_!~*\'()-]加上.
|
||||
+ '\\w+\\.' // 一级域名 -英文或数字 加上.
|
||||
+ '[a-zA-Z]{1,6})' // 顶级域名- 1-6位英文
|
||||
+ '(:[0-9]{1,5})?' // 端口- :80 ,1-5位数字
|
||||
+ '((/?)|' // url无参数结尾 - 斜杆或这没有
|
||||
+ '(/[\\w_!~*\'()\\.;?:@&=+$,%#-]+)+/?)$';//请求参数结尾- 英文或数字和[]内的各种字符
|
||||
var re = new RegExp(strRegex, 'i');//i不区分大小写
|
||||
//将url做uri转码后再匹配,解除请求参数中的中文和空字符影响
|
||||
return re.test(encodeURI(url));
|
||||
}
|
||||
|
||||
$(function () {
|
||||
$('#table').bootstrapTable({
|
||||
url: 'listFiles',
|
||||
pageNumber: ${homePageNumber},//初始化加载第一页
|
||||
pageSize:${homePageSize}, //初始化单页记录数
|
||||
pagination: ${homePagination}, //是否分页
|
||||
pageList: [5, 10, 20, 30, 50, 100, 200, 500],
|
||||
search: ${homeSearch}, //显示查询框
|
||||
columns: [{
|
||||
field: 'fileName',
|
||||
title: '文件名'
|
||||
}, {
|
||||
field: 'action',
|
||||
title: '操作',
|
||||
align: 'center',
|
||||
width: 160
|
||||
}]
|
||||
}).on('pre-body.bs.table', function (e, data) {
|
||||
// 每个data添加一列用来操作
|
||||
$(data).each(function (index, item) {
|
||||
item.action = "<a class='btn btn-success' target='_blank' href='${baseUrl}onlinePreview?url=" + encodeURIComponent(Base64.encode('${baseUrl}' + item.fileName)) + "'>预览</a>" +
|
||||
"<a class='btn btn-danger' style='margin-left:10px;' href='javascript:void(0);' onclick='deleteFile(\"" + encodeURIComponent(Base64.encode('${baseUrl}' + item.fileName)) + "\")'>删除</a>";
|
||||
});
|
||||
return data;
|
||||
}).on('post-body.bs.table', function (e, data) {
|
||||
return data;
|
||||
});
|
||||
|
||||
$('#previewByUrl').on('click', function () {
|
||||
var _url = $("#_url").val();
|
||||
if (!checkUrl(_url)) {
|
||||
$("#previewCheckAlert").addClass("show");
|
||||
window.setTimeout(function () {
|
||||
$("#previewCheckAlert").removeClass("show");
|
||||
}, 3000);//显示的时间
|
||||
return false;
|
||||
}
|
||||
|
||||
var b64Encoded = Base64.encode(_url);
|
||||
|
||||
window.open('${baseUrl}onlinePreview?url=' + encodeURIComponent(b64Encoded));
|
||||
});
|
||||
|
||||
$("#fileUploadBtn").click(function () {
|
||||
var filepath = $("#file").val();
|
||||
if(!checkFileSize(filepath)) {
|
||||
return false;
|
||||
}
|
||||
showLoadingDiv();
|
||||
$("#fileUpload").ajaxSubmit({
|
||||
success: function (data) {
|
||||
// 上传完成,刷新table
|
||||
if (1 === data.code) {
|
||||
alert(data.msg);
|
||||
} else {
|
||||
$('#table').bootstrapTable('refresh', {});
|
||||
}
|
||||
$("#fileName").text("");
|
||||
$(".loading_container").hide();
|
||||
},
|
||||
error: function () {
|
||||
alert('上传失败,请联系管理员');
|
||||
$(".loading_container").hide();
|
||||
},
|
||||
url: 'fileUpload', /*设置post提交到的页面*/
|
||||
type: "post", /*设置表单以post方法提交*/
|
||||
dataType: "json" /*设置返回值类型为文本*/
|
||||
});
|
||||
});
|
||||
});
|
||||
function checkFileSize(filepath) {
|
||||
var daxiao= "${size}";
|
||||
daxiao= daxiao.replace("MB","");
|
||||
// console.log(daxiao)
|
||||
var maxsize = daxiao * 1024 * 1024;
|
||||
var errMsg = "上传的文件不能超过${size}喔!!!";
|
||||
var tipMsg = "您的浏览器暂不支持上传,确保上传文件不要超过${size},建议使用IE、FireFox、Chrome浏览器";
|
||||
try {
|
||||
var filesize = 0;
|
||||
var ua = window.navigator.userAgent;
|
||||
if (ua.indexOf("MSIE") >= 1) {
|
||||
//IE
|
||||
var img = new Image();
|
||||
img.src = filepath;
|
||||
filesize = img.fileSize;
|
||||
} else {
|
||||
filesize = $("#file")[0].files[0].size; //byte
|
||||
}
|
||||
if (filesize > 0 && filesize > maxsize) {
|
||||
alert(errMsg);
|
||||
return false;
|
||||
} else if (filesize === -1) {
|
||||
alert(tipMsg);
|
||||
return false;
|
||||
}
|
||||
} catch (e) {
|
||||
alert("上传失败,请重试");
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,76 @@
|
||||
<!DOCTYPE html>
|
||||
|
||||
<html lang="en" xmlns="http://www.w3.org/1999/html">
|
||||
<head>
|
||||
<meta charset="utf-8"/>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
|
||||
<title>接入说明</title>
|
||||
<link rel="icon" href="./favicon.ico" type="image/x-icon">
|
||||
<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css"/>
|
||||
<link rel="stylesheet" href="css/theme.css"/>
|
||||
<script type="text/javascript" src="js/jquery-3.6.1.min.js"></script>
|
||||
<script type="text/javascript" src="bootstrap/js/bootstrap.min.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<nav class="navbar navbar-inverse navbar-fixed-top">
|
||||
<div class="container">
|
||||
<div class="navbar-header">
|
||||
<a class="navbar-brand" href="https://kkview.cn" target='_blank'>kkFileView</a>
|
||||
</div>
|
||||
<ul class="nav navbar-nav">
|
||||
<li><a href="./index">首页</a></li>
|
||||
<li class="active"><a href="./integrated">接入说明</a></li>
|
||||
<li><a href="./record">版本发布记录</a></li>
|
||||
<li><a href="./sponsor">赞助开源</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<div class="container theme-showcase" role="main">
|
||||
<#-- 接入说明 -->
|
||||
<div class="page-header">
|
||||
<h1>接入说明</h1>
|
||||
本文档针对前端项目接入 kkFileView 的说明,并假设 kkFileView 的服务地址为:http://127.0.0.1:8012。
|
||||
</div>
|
||||
<div class="well">
|
||||
|
||||
<div style="font-size: 16px;">
|
||||
【http/https 资源文件预览】如果你的项目需要接入文件预览项目,达到对docx、excel、ppt、jpg等文件的预览效果,那么通过在你的项目中加入下面的代码就可以成功实现:
|
||||
<p style="background-color: #2f332a;color: #cccccc;font-size: 14px;padding:10px;margin-top:10px;">
|
||||
var url = 'http://127.0.0.1:8080/file/test.txt'; //要预览文件的访问地址 <br>
|
||||
window.open('http://127.0.0.1:8012/onlinePreview?url='+encodeURIComponent(base64Encode(url)));
|
||||
</p>
|
||||
</div>
|
||||
<br>
|
||||
<div style="font-size: 16px;">
|
||||
【http/https 流资源文件预览】很多系统内不是直接暴露文件下载地址,而是请求通过id、code等参数到通过统一的接口,后端通过id或code等参数定位文件,再通过OutputStream输出下载,此时下载url是不带文件后缀名的,预览时需要拿到文件名,传一个参数fullfilename=xxx.xxx来指定文件名,示例如下
|
||||
<p style="background-color: #2f332a;color: #cccccc;font-size: 14px;padding:10px;margin-top:10px;">
|
||||
var originUrl = 'http://127.0.0.1:8080/filedownload?fileId=1'; //要预览文件的访问地址<br>
|
||||
var previewUrl = originUrl + '&fullfilename=test.txt'<br>
|
||||
window.open('http://127.0.0.1:8012/onlinePreview?url='+encodeURIComponent(Base64.encode(previewUrl)));
|
||||
</p>
|
||||
</div>
|
||||
<br>
|
||||
<div style="font-size: 16px;">
|
||||
【ftp 资源文件预览】如果要预览的FTP url是可以匿名访问的(不需要用户名密码),则可以直接通过下载url预览,示例如下
|
||||
<p style="background-color: #2f332a;color: #cccccc;font-size: 14px;padding:10px;margin-top:10px;">
|
||||
var url = 'ftp://127.0.0.1/file/test.txt'; //要预览文件的访问地址<br>
|
||||
window.open('http://127.0.0.1:8012/onlinePreview?url='+encodeURIComponent(Base64.encode(url)));
|
||||
</p>
|
||||
</div>
|
||||
<br>
|
||||
<div style="font-size: 16px;">
|
||||
【ftp 加密资源文件预览】如果 FTP 需要认证访问服,可以通过在 url 中加入用户名密码等参数预览,示例如下
|
||||
<p style="background-color: #2f332a;color: #cccccc;font-size: 14px;padding:10px;margin-top:10px;">
|
||||
var originUrl = 'ftp://127.0.0.1/file/test.txt'; //要预览文件的访问地址<br>
|
||||
var previewUrl = originUrl + '?ftp.username=xx&ftp.password=xx&ftp.control.encoding=xx';<br>
|
||||
window.open('http://127.0.0.1:8012/onlinePreview?url='+encodeURIComponent(Base64.encode(previewUrl)));
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
421
tool-tech-file-view/src/main/resources/web/main/record.ftl
Normal file
421
tool-tech-file-view/src/main/resources/web/main/record.ftl
Normal file
@@ -0,0 +1,421 @@
|
||||
<!DOCTYPE html>
|
||||
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8"/>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
|
||||
<title>kkFileView版本记录</title>
|
||||
<link rel="icon" href="./favicon.ico" type="image/x-icon">
|
||||
<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css"/>
|
||||
<link rel="stylesheet" href="css/theme.css"/>
|
||||
<script type="text/javascript" src="js/jquery-3.6.1.min.js"></script>
|
||||
<script type="text/javascript" src="bootstrap/js/bootstrap.min.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<nav class="navbar navbar-inverse navbar-fixed-top">
|
||||
<div class="container">
|
||||
<div class="navbar-header">
|
||||
<a class="navbar-brand" href="https://kkview.cn" target='_blank'>kkFileView</a>
|
||||
</div>
|
||||
<ul class="nav navbar-nav">
|
||||
<li><a href="./index">首页</a></li>
|
||||
<li><a href="./integrated">接入说明</a></li>
|
||||
<li class="active"><a href="./record">版本发布记录</a></li>
|
||||
<li><a href="./sponsor">赞助开源</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<div class="container theme-showcase" role="main">
|
||||
<#-- 版本发布记录 -->
|
||||
<div class="page-header">
|
||||
<h1>版本发布记录</h1>
|
||||
</div>
|
||||
<div class="panel panel-success">
|
||||
<div class="panel-heading">
|
||||
<h3 class="panel-title">2024年04月15日,v4.4.0-beta版本</h3>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<div>
|
||||
1. ofd修复部分已知问题.优化OFD 移动端预览 页面不自适应 <br>
|
||||
2. 更新xlsx前端解析组件,新增支持打印功能,加速解析速度 <br>
|
||||
3. 修复 forceUpdatedCache 属性设置,但是本地缓存文件不更新缺陷 <br>
|
||||
4. 配置文件新增启用 GZIP压缩 <br>
|
||||
5. 升级CAD组件,CAD格式新增支持 转换成svg tif 格式 新增 超时结束 新增线程管理 <br>
|
||||
6. 删除功能 新增验证码方法 <br>
|
||||
7. office 功能调整 支持批注 转换页码限制 生成水印等等 <br>
|
||||
8. 新增xbrl格式 <br>
|
||||
9. 修复PDF解密加密文件 转换成功后台报错问题 <br>
|
||||
10. 升级markdown组件 修复markdown被转义问题 <br>
|
||||
11. 升级dcm 解析组件 <br>
|
||||
12. 升级PDF.JS解析组件 新增:控制签名/绘图/插图控制方法 <br>
|
||||
13. 更换视频播放插件为ckplayer <br>
|
||||
14. tif解析更加智能化 支持被修改的图片格式 <br>
|
||||
15. 修复bpmn不支持跨域的问题 <br>
|
||||
16. 修复压缩包二级反代特殊符号错误问题 <br>
|
||||
17. 首页新增 搜索 定位页码 定义显示多少内容 <br>
|
||||
18. 修复video跨域配置导致视频无法预览问题 <br>
|
||||
19. 针对大小文本文件检测字符编码的正确率;处理并发隐患 <br>
|
||||
20. 修复txt文本类 分页二次加载问题 <br>
|
||||
21. 新增csv格式前端解析 <br>
|
||||
22. 重构下载文件的代码,新增通用的文件服务器认证访问的设计 <br>
|
||||
23. 更新bootstrap组件 并精简掉不需要的文件 <br>
|
||||
24. 新增arm64下的dockerfile <br>
|
||||
25. 更新epub版本,优化epub显示效果,修复epub 跨域报错问题 <br>
|
||||
26. 修复drawio缺少base64组件的问题 <br>
|
||||
27. 解决定时清除缓存时,对于多媒体类型文件,只删除了磁盘缓存文件 <br>
|
||||
28. 自动检测已安装Office组件增加LibreOffice7.5 & 7.6 版本默认路径 <br>
|
||||
29. 修改drawio默认为预览模式 <br>
|
||||
30. 新增office转换超时属性功能 <br>
|
||||
31. 新增预览文件 host 黑名单机制 <br>
|
||||
32. 修复 url特殊符号问题 <br>
|
||||
33. 其他功能优化及已知问题修复 <br>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel panel-success">
|
||||
<div class="panel-heading">
|
||||
<h3 class="panel-title">2023年07月04日,v4.3.0版本</h3>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<div>
|
||||
1. 新增dcm等医疗数位影像预览<br>
|
||||
2. 新增drawio绘图预览<br>
|
||||
3. 新增开启缓存的情况下重新生成的命令 &forceUpdatedCache=true <br>
|
||||
4. 新增dwg CAD文件预览 <br>
|
||||
5. 新增PDF文件支持密码功能 <br>
|
||||
6. 修复反代情况下压缩包获取路径错误 <br>
|
||||
7. 新增PDF文件生成图片的dpi自定义配置 <br>
|
||||
8. 修复预览图片的url中如果包含&会导致.click报错 <br>
|
||||
9. 新增删除转换后OFFICE、CAD、TIFF、压缩包源文件配置 默认开启 节约磁盘空间 <br>
|
||||
10. 调整生成的PDF文件 文件名称添加文件后缀 防止生成同名文件 <br>
|
||||
11. 新增pages格式支持,调整SQL文件预览方式 <br>
|
||||
12. OFD修复部分已知Bug,提高OFD兼容性处理。 <br>
|
||||
13. 新增前端解析xlsx方法。 <br>
|
||||
14. OFD修复部分文字未显示的问题,完善OFD兼容性处理 <br>
|
||||
15. 美化TXT文本 分页框的显示 <br>
|
||||
16. 修复预览压缩包时,如果点击的是文件目录(树节点),页面会报错 <br>
|
||||
17. 升级Linux、Docker版内置office为LibreOffice-7.5.3版本
|
||||
18. 升级Windows内置office为LibreOffice-7.5.3 Portable版本 <br>
|
||||
19. 新增pages,eps, iges , igs, dwt, dng, ifc, dwfx, stl, cf2, plt等格式支持 <br>
|
||||
20. 其他功能优化及已知问题修复 <br>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel panel-success">
|
||||
<div class="panel-heading">
|
||||
<h3 class="panel-title">2023年04月18日,v4.2.1版本</h3>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<div>
|
||||
1. 修复 dwg 等 CAD 类型文件报空指针的 bug<br>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel panel-success">
|
||||
<div class="panel-heading">
|
||||
<h3 class="panel-title">2023年04月13日,v4.2.0版本</h3>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<div>
|
||||
1. 新增 SVG 格式文件预览支持<br>
|
||||
2. 新增加密的 Office 文件预览支持<br>
|
||||
3. 新增加密的 zip、rar 等压缩包文件预览支持<br>
|
||||
4. 新增 xmind 软件模型文件预览支持<br>
|
||||
5. 新增 bpmn 工作流模型文件预览支持<br>
|
||||
6. 新增 eml 邮件文件预览支持<br>
|
||||
7. 新增 epub 电子书文件预览支持<br>
|
||||
8. 新增 dotm,ett,xlt,xltm,wpt,dot,xlam,xla,dotx 等格式的办公文档预览支持<br>
|
||||
9. 新增 obj, 3ds, stl, ply, gltf, glb, off, 3dm, fbx, dae, wrl, 3mf, ifc, brep, step, iges, fcstd, bim 等 3D 模型文件预览支持<br>
|
||||
10. 新增可配置限制高风险文件上传的功能,比如 exe 文件<br>
|
||||
11. 新增可配置站点的备案信息<br>
|
||||
12. 新增演示站点删除文件需要密码的功能<br>
|
||||
13. 文本文档预览加入缓存<br>
|
||||
14. 美化 404、500 报错页<br>
|
||||
15. 优化发票等 ofd 文件预览的印证渲染兼容性<br>
|
||||
16. 移除 office-plugin 模块, 使用新版 jodconverter组件<br>
|
||||
17. 优化 Excel 文件的预览效果<br>
|
||||
18. 优化 CAD 文件的预览效果<br>
|
||||
19. 更新 xstream 、junrar、pdfbox 等依赖的版本<br>
|
||||
20. 更新 TIF 文件转换 PDF 的插件,添加转换缓存<br>
|
||||
21. 优化演示页 UI 部署<br>
|
||||
22. 压缩包文件预览支持目录<br>
|
||||
23. 修复部分接口 XSS 问题<br>
|
||||
24. 修复控制台打印的演示地址不跟着 content-path 配置走的问题<br>
|
||||
25. 修复 ofd 文件预览跨域问题<br>
|
||||
26. 修复内部自签证书 https 协议 url 文件无法下载的问题<br>
|
||||
27. 修复特殊符号的文件无法删除的问题<br>
|
||||
28. 修复 PDF 转图片,内存无法回收导致的 OOM<br>
|
||||
29. 修复 xlsx7.4 以上版本文件预览乱码的问题<br>
|
||||
30. 修复 TrustHostFilter 未拦截跨域接口的问题,这是一个安全问题,有使用到 TrustHost 功能的务必升级<br>
|
||||
31. 修复压缩包文件预览在 Linux 系统下文件名乱码的问题<br>
|
||||
32. 修复 ofd 文件预览页码只能显示 10 页的问题<br>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel panel-success">
|
||||
<div class="panel-heading">
|
||||
<h3 class="panel-title">2022年12月14日,v4.1.0版本</h3>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<div>
|
||||
1. 全新首页视觉 @wsd7747 <br>
|
||||
2. tif图片预览兼容多页tif的pdf转换、jpg转换,以及jpg在线多页预览功能 @zhangzhen1979<br>
|
||||
3. 优化docker构建方案,使用分层构建方式 @yl-yue<br>
|
||||
4. 实现基于userToken缓存加密文件 @yl-yue<br>
|
||||
5. 实现加密word、ppt、excel文件预览 @yl-yue<br>
|
||||
6. Linux & Docker镜像升级LibreOffice 7.3<br>
|
||||
7. 更新OFD预览组件、更新tif预览组件、更新PPT水印支持<br>
|
||||
8. 大量其他升级优化 & 已知问题修复<br>
|
||||
<br>
|
||||
感谢 @yl-yue @wsd7747 @zhangzhen1979 @tomhusky @shenghuadun @kischn.sun 的代码贡献
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel panel-success">
|
||||
<div class="panel-heading">
|
||||
<h3 class="panel-title">2021年7月6日,v4.0.0版本</h3>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<div>
|
||||
1. 底层集成OpenOffice替换为LibreOffice,Office文件兼容性增强,预览效果提升<br>
|
||||
2. 修复压缩文件目录穿越漏洞<br>
|
||||
3. 修复PPT预览使用PDF模式无效<br>
|
||||
4. 修复PPT图片预览模式前端显示异常<br>
|
||||
5. 新增功能:首页文件上传功能可通过配置实时开启或禁用<br>
|
||||
6. 优化增加Office进程关闭日志<br>
|
||||
7. 优化Windows环境下,查找Office组件逻辑(内置的LibreOffice优先)<br>
|
||||
8. 优化启动Office进程改同步执行
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel panel-success">
|
||||
<div class="panel-heading">
|
||||
<h3 class="panel-title">2021年06月17日,v3.6.0版本</h3>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<div>
|
||||
** ofd 类型文件支持版本,本次版本重要功能均由社区开发贡献,感谢 @gaoxingzaq、@zhangxiaoxiao9527 的代码贡献 ** <br>
|
||||
1. 新增 ofd 类型文件预览支持,ofd 是国产的类似 pdf 格式的文件<br>
|
||||
2. 新增了 ffmpeg 视频文件转码预览支持,打开转码功能后,理论上支持所有主流视频的预览,如 rm、rmvb、flv 等<br>
|
||||
3. 美化了 ppt、pptx 类型文件预览效果,比之前版本好看太多<br>
|
||||
4. 更新了 pdfbox、xstream、common-io 等依赖的版本
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel panel-success">
|
||||
<div class="panel-heading">
|
||||
<h3 class="panel-title">2021年04月06日,v3.5.1版本</h3>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<div>
|
||||
3.5.1版本发布,修复已知问题<br>
|
||||
1. 修复 tif、tiff 文件预览初始内存太小预览失败的问题<br>
|
||||
2. 修复PDF预览模式跨域问题<br>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel panel-success">
|
||||
<div class="panel-heading">
|
||||
<h3 class="panel-title">2021年03月17日,v3.5.0版本</h3>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<div>
|
||||
2021 一季度 v3.5 性能升级版发布<br>
|
||||
1. 新增 office-plugin 转换进程、任务超时可配置<br>
|
||||
2. 更新 spring-boot 到最新的 v2.4.2 版本<br>
|
||||
3. 新增 tiff 、tif 图像文件格式预览支持<br>
|
||||
4. 新增依赖 highlightjs 代码文件预览高亮支持<br>
|
||||
5. 新增 wps 文档预览支持<br>
|
||||
6. 新增 stars 增长趋势图<br>
|
||||
7. 新增启动完成,打印启动耗时、演示页访问地址<br>
|
||||
8. 新增 kkFIleView 的 banner 信息<br>
|
||||
9. 优化启动脚本<br>
|
||||
10. 优化项目结构、优化 maven 结构<br>
|
||||
11. 移除多余的 repositories 配置,移除针对 tomcat 的配置<br>
|
||||
12. 优化下载文件 io 操作<br>
|
||||
13. 修复:优化项目目录结构之后,windows下启动报错“找不到office组件”<br>
|
||||
14. 修复:jodd.io.NetUtil.downloadFile下载大于16M文件报错问题<br>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel panel-success">
|
||||
<div class="panel-heading">
|
||||
<h3 class="panel-title">2021年1月28日,v3.3.1版本</h3>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<div>
|
||||
** 2020农历年最后一个版本发布,主要包含了部分 UI 改进,和解决了 QQ 群友、 Issue 里反馈的 Bug
|
||||
修复,最最重要的是发个新版,过个好年 **<br>
|
||||
1. 引入galimatias,解决不规范文件名导致文件下载异常<br>
|
||||
2. 更新index接入演示界面UI风格<br>
|
||||
3. 更新markdown文件预览UI风格<br>
|
||||
4. 更新XML文件预览UI风格,调整类文本预览架构,更方便扩展<br>
|
||||
5. 更新simTxT文件预览UI风格<br>
|
||||
6. 调整多图连续预览上下翻图的UI<br>
|
||||
7. 采用apache-common-io包简化所有的文件下载io操作<br>
|
||||
8. XML文件预览支持切换纯文本模式<br>
|
||||
9. 增强url base64解码失败时的提示信息<br>
|
||||
10. 修复导包错误以及图片预览 bug<br>
|
||||
11. 修复发行包运行时找不到日志目录的问题<br>
|
||||
12. 修复压缩包内多图连续预览的bug<br>
|
||||
13. 修复大小写文件类型后缀没通用匹配的问题<br>
|
||||
14. 指定Base64转码采用Apache Commons-code中的实现,修复base64部分jdk版本下出现的异常<br>
|
||||
15. 修复类文本类型HTML文件预览的bug<br>
|
||||
16. 修复:dwg文件预览时无法在jpg和pdf两种类型之间切换<br>
|
||||
17. escaping of dangerous characters to prevent reflected xss<br>
|
||||
18. 修复重复编码导致文档转图片预览失败的问题&编码规范
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel panel-success">
|
||||
<div class="panel-heading">
|
||||
<h3 class="panel-title">2020年12月27日,v3.3.0版本</h3>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<div>
|
||||
** 2020年年终大版本更新,架构全面设计,代码全面重构,代码质量全面提升,二次开发更便捷,欢迎拉源码品鉴,提issue、pr共同建设
|
||||
**<br>
|
||||
1. 架构模块调整,大量的代码重构,代码质量提升N个等级,欢迎品鉴<br>
|
||||
2. 增强XML文件预览效果,新增XML文档数结构预览<br>
|
||||
3. 新增markdown文件预览支持,预览支持md渲染和源文本切换支持<br>
|
||||
4. 切换底层web server为jetty,解决这个issue:<a href="https://github.com/kekingcn/kkFileView/issues/168">#issues/168</a><br>
|
||||
5. 引入cpdetector,解决文件编码识别问题<br>
|
||||
6. url采用base64+urlencode双编码,彻底解决各种奇葩文件名预览问题<br>
|
||||
7. 新增配置项office.preview.switch.disabled,控制offic文件预览切换开关<br>
|
||||
8. 优化文本类型文件预览逻辑,采用Base64传输内容,避免预览时再次请求文件内容<br>
|
||||
9. office预览图片模式禁用图片放大效果,达到图片和pdf预览效果一致的体验<br>
|
||||
10. 直接代码静态设置pdfbox兼容低版本jdk,在IDEA中运行也不会有警告提示<br>
|
||||
11. 移除guava、hutool等非必须的工具包,减少代码体积<br>
|
||||
12. Office组件加载异步化,提速应用启动速度最快到5秒内<br>
|
||||
13. 合理设置预览消费队列的线程数<br>
|
||||
14. 修复压缩包里文件再次预览失败的bug<br>
|
||||
15. 修复图片预览的bug
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel panel-success">
|
||||
<div class="panel-heading">
|
||||
<h3 class="panel-title">2020年08月12日,v2.2.1版本</h3>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<div>
|
||||
1. 支持纯文本预览原样格式输出<br>
|
||||
2. 修复PDF预览出现文字缺失异常,升级pdf.js组件<br>
|
||||
3. docker镜像底层使用ubuntu,镜像体积更小、构建更快<br>
|
||||
4. 预览接口同时支持get和post请求<br>
|
||||
5. 修复上传到demo中的压缩文件预览异常<br>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel panel-success">
|
||||
<div class="panel-heading">
|
||||
<h3 class="panel-title">2020年05月20日,v2.2.0版本</h3>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<div>
|
||||
1. 新增支持全局水印,并支持通过参数动态改变水印内容<br>
|
||||
2. 新增支持CAD文件预览<br>
|
||||
3. 新增base.url配置,支持使用nginx反向代理和使用context-path<br>
|
||||
4. 支持所有配置项支持从环境变量里读取,方便Docker镜像部署和集群中大规模使用<br>
|
||||
5. 支持配置限信任站点(只能预览来自信任点的文件源),保护预览服务不被滥用<br>
|
||||
6. 支持配置自定义缓存清理时间(cron表达式)<br>
|
||||
7. 全部能识别的纯文本直接预览,不用再转跳下载,如.md .java .py等<br>
|
||||
8. 支持配置限制转换后的PDF文件下载<br>
|
||||
9. 优化maven打包配置,解决 .sh 脚本可能出现换行符问题<br>
|
||||
10. 将前端所有CDN依赖放到本地,方便没有外网连接的用户使用<br>
|
||||
11. 首页评论服务由搜狐畅言切换到Gitalk<br>
|
||||
12. 修复url中包含特殊字符可能会引起的预览异常<br>
|
||||
13. 修复转换文件队列addTask异常<br>
|
||||
14. 修复其他已经问题<br>
|
||||
15. 官网建设:<a href="https://kkview.cn">https://kkview.cn</a><br>
|
||||
16. 官方Docker镜像仓库建设:<a href="https://hub.docker.com/r/keking/kkfileview">https://hub.docker.com/r/keking/kkfileview</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel panel-success">
|
||||
<div class="panel-heading">
|
||||
<h3 class="panel-title">2019年06月20日</h3>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<div>
|
||||
1. 支持自动清理缓存及预览文件<br>
|
||||
2. 支持http/https下载流url文件预览<br>
|
||||
3. 支持FTP url文件预览<br>
|
||||
4. 加入Docker构建
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel panel-success">
|
||||
<div class="panel-heading">
|
||||
<h3 class="panel-title">2019年04月08日</h3>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<div>
|
||||
1. 缓存及队列实现抽象,提供JDK和REDIS两种实现(REDIS成为可选依赖)<br>
|
||||
2. 打包方式提供zip和tar.gz包,并提供一键启动脚本
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel panel-success">
|
||||
<div class="panel-heading">
|
||||
<h3 class="panel-title">2018年01月19日</h3>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<div>
|
||||
1. 大文件入队提前处理<br>
|
||||
2. 新增addTask文件转换入队接口<br>
|
||||
3. 采用redis队列,支持kkFIleView接口和异构系统入队两种方式
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel panel-success">
|
||||
<div class="panel-heading">
|
||||
<h3 class="panel-title">2018年01月15日</h3>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<div>
|
||||
1. 首页新增社会化评论框
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel panel-success">
|
||||
<div class="panel-heading">
|
||||
<h3 class="panel-title">2018年01月12日</h3>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<div>
|
||||
1. 新增多图片同时预览<br>
|
||||
2. 支持压缩包内图片轮番预览
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel panel-success">
|
||||
<div class="panel-heading">
|
||||
<h3 class="panel-title">2018年01月02日</h3>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<div>
|
||||
1. 修复txt等文本编码问题导致预览乱码<br>
|
||||
2. 修复项目模块依赖引入不到的问题<br>
|
||||
3. 新增spring boot profile,支持多环境配置<br>
|
||||
4. 引入pdf.js预览doc等文件,支持doc标题生成pdf预览菜单,支持手机端预览
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel panel-success">
|
||||
<div class="panel-heading">
|
||||
<h3 class="panel-title">2017年12月12日</h3>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<div>
|
||||
1. 项目gitee开源:<a href="https://gitee.com/kekingcn/file-online-preview" target="_blank">https://gitee.com/kekingcn/file-online-preview</a><br>
|
||||
2. 项目github开源:<a href="https://github.com/kekingcn/kkFileView" target="_blank">https://github.com/kekingcn/kkFileView</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
72
tool-tech-file-view/src/main/resources/web/main/sponsor.ftl
Normal file
72
tool-tech-file-view/src/main/resources/web/main/sponsor.ftl
Normal file
@@ -0,0 +1,72 @@
|
||||
<!DOCTYPE html>
|
||||
|
||||
<html lang="en" xmlns="http://www.w3.org/1999/html">
|
||||
<head>
|
||||
<meta charset="utf-8"/>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
|
||||
<title>赞助开源</title>
|
||||
<link rel="icon" href="./favicon.ico" type="image/x-icon">
|
||||
<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css"/>
|
||||
<link rel="stylesheet" href="css/theme.css"/>
|
||||
<script type="text/javascript" src="js/jquery-3.6.1.min.js"></script>
|
||||
<script type="text/javascript" src="bootstrap/js/bootstrap.min.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<!-- Fixed navbar -->
|
||||
<nav class="navbar navbar-inverse navbar-fixed-top">
|
||||
<div class="container">
|
||||
<div class="navbar-header">
|
||||
<a class="navbar-brand" href="https://kkview.cn" target='_blank'>kkFileView</a>
|
||||
</div>
|
||||
<ul class="nav navbar-nav">
|
||||
<li><a href="./index">首页</a></li>
|
||||
<li><a href="./integrated">接入说明</a></li>
|
||||
<li><a href="./record">版本发布记录</a></li>
|
||||
<li class="active"><a href="./sponsor">赞助开源</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<div class="container theme-showcase" role="main">
|
||||
<#-- 接入说明 -->
|
||||
<div class="page-header">
|
||||
<h1>赞助开源</h1>
|
||||
<ul style="font-size: 16px;">
|
||||
<li>kkFileView 开源至今已 6 个年头,积累 <a target="_blank" href="https://gitee.com/kekingcn/file-online-preview">Gitee(16.9K)</a>、<a target="_blank" href="https://github.com/kekingcn/kkFileView">GitHub(8k)</a> 多的 star</li>
|
||||
<li>kkFileView 被广泛应用于金融、教育、银行、政务、计算机等行业, 不完全统计有 200+ 企业在使用</li>
|
||||
<li>kkFileView 每年的文档站点、演示站点的服务器、CDN 资源, 至少在 1000元以上</li>
|
||||
<li>kkFileView 是一款完全开源的在线预览项目,如果你觉得 kkFileView 对你有帮助,可以通过下面的方式来赞助我们,谢谢!</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div>
|
||||
<div style="font-size: 16px; text-align: center;">
|
||||
<img width="400px" height="550px" alt="alipay" src="../images/alipay.jpeg"/> <img width="400px" height="550px" alt="wxpay" src="../images/wxpay.jpeg"/>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<h3>赞助记录</h3>
|
||||
2023-03-14 开启赞助通道,赞助记录为手动录入的,存在周级别延迟,如有遗漏,请联系作者补充
|
||||
<br/>
|
||||
<table class="table table-striped table-bordered">
|
||||
<tr>
|
||||
<th>赞助人</th>
|
||||
<th>赞助金额</th>
|
||||
<th>赞助时间</th>
|
||||
<th>备注</th>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>陈**</td>
|
||||
<td>99</td>
|
||||
<td>2023-03-14</td>
|
||||
<td></td>
|
||||
</tr>
|
||||
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
93
tool-tech-file-view/src/main/resources/web/markdown.ftl
Normal file
93
tool-tech-file-view/src/main/resources/web/markdown.ftl
Normal file
@@ -0,0 +1,93 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8"/>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=yes, initial-scale=1.0">
|
||||
<title>markdown文本预览</title>
|
||||
<#include "*/commonHeader.ftl">
|
||||
<script src="js/jquery-3.6.1.min.js" type="text/javascript"></script>
|
||||
<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css"/>
|
||||
<script src="bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
|
||||
<script src="js/marked.min.js" type="text/javascript"></script>
|
||||
<script src="js/base64.min.js" type="text/javascript"></script>
|
||||
</head>
|
||||
<body>
|
||||
<input hidden id="textData" value="${textData}"/>
|
||||
|
||||
<div class="container">
|
||||
<div class="panel panel-default">
|
||||
<div id="markdown_btn" class="panel-heading">
|
||||
<h4 class="panel-title">
|
||||
<a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">
|
||||
${file.name}
|
||||
</a>
|
||||
</h4>
|
||||
</div>
|
||||
<div id="text_btn" class="panel-heading">
|
||||
<h4 class="panel-title">
|
||||
<a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">
|
||||
${file.name}
|
||||
</a>
|
||||
</h4>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<div id="markdown"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
/**
|
||||
* 初始化
|
||||
*/
|
||||
window.onload = function () {
|
||||
$("#markdown_btn").hide()
|
||||
initWaterMark();
|
||||
loadMarkdown();
|
||||
}
|
||||
function htmlEscape(str){
|
||||
var s = "";
|
||||
if(str.length == 0) return "";
|
||||
s = str.replace(/&/g,"&");
|
||||
s = str.replace(/&amp;/g,"&");
|
||||
s = s.replace(/</g,"<");
|
||||
s = s.replace(/>/g,">");
|
||||
s = s.replace(/ /g," ");
|
||||
s = s.replace(/'/g,"\'");
|
||||
s = s.replace(/"/g,"\"");
|
||||
s = s.replace(/<script.*?>.*?<\/script>/ig, '');
|
||||
s = s.replace(/<script/gi, "<script ");
|
||||
s = s.replace(/<iframe/gi, "<iframe ");
|
||||
return s;
|
||||
}
|
||||
|
||||
/**
|
||||
* 加载markdown
|
||||
*/
|
||||
function loadMarkdown() {
|
||||
var textData = Base64.decode($("#textData").val())
|
||||
textData = htmlEscape(textData);
|
||||
window.textPreData = "<pre style='background-color: #FFFFFF;border:none'>" + textData + "</pre>";
|
||||
window.textMarkdownData = marked.parse(textData);
|
||||
$("#markdown").html(window.textMarkdownData);
|
||||
}
|
||||
|
||||
|
||||
$(function () {
|
||||
$("#markdown_btn").click(function () {
|
||||
$("#markdown").html(window.textMarkdownData);
|
||||
$("#text_btn").show()
|
||||
$("#markdown_btn").hide()
|
||||
});
|
||||
|
||||
$("#text_btn").click(function () {
|
||||
$("#markdown_btn").show()
|
||||
$("#text_btn").hide();
|
||||
$("#markdown").html(window.textPreData);
|
||||
});
|
||||
});
|
||||
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
111
tool-tech-file-view/src/main/resources/web/media.ftl
Normal file
111
tool-tech-file-view/src/main/resources/web/media.ftl
Normal file
@@ -0,0 +1,111 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>${file.name}播放器</title>
|
||||
<link type="text/css" rel="stylesheet" href="ckplayer/css/ckplayer.css" />
|
||||
<#if "${file.suffix?lower_case}" == "m3u8" >
|
||||
<script type="text/javascript" src="ckplayer/hls.js/hls.min.js"></script>
|
||||
<#elseif "${file.suffix?lower_case}" == "flv">
|
||||
<script type="text/javascript" src="ckplayer/flv.js/flv.min.js"></script>
|
||||
<#elseif "${file.suffix?lower_case}" == "ts">
|
||||
<script type="text/javascript" src="ckplayer/mpegts.js/mpegts.js"></script>
|
||||
<#elseif "${file.suffix?lower_case}" == "mpd">
|
||||
<script type="text/javascript" src="ckplayer/js/dash.all.min.js"></script>
|
||||
</#if>
|
||||
<script type="text/javascript" src="ckplayer/js/ckplayer.min.js" charset="UTF-8"></script>
|
||||
<#include "*/commonHeader.ftl">
|
||||
<style>
|
||||
.adpause{
|
||||
width: 90%;
|
||||
height: 90%;
|
||||
max-width: 580px;
|
||||
max-height: 360px;
|
||||
color: #FFF;
|
||||
position: absolute;
|
||||
background: #07141E;
|
||||
top:0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
margin: auto;
|
||||
font-size: 30px;
|
||||
line-height: 38px;
|
||||
box-sizing:border-box;
|
||||
-moz-box-sizing:border-box; /* Firefox */
|
||||
-webkit-box-sizing:border-box; /* Safari */
|
||||
padding: 50px;
|
||||
display: none;
|
||||
}
|
||||
.video{
|
||||
width: 100%;
|
||||
height: 600px;
|
||||
max-width: 900px;
|
||||
margin: auto;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
background-color: green;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="video">播放容器</div>
|
||||
<script>
|
||||
<#if "${file.suffix?lower_case}" == "mpd" >
|
||||
function dashPlayer(video,fileUrl){
|
||||
video.attr('data-dashjs-player',' ');
|
||||
video.attr('src',fileUrl);
|
||||
}
|
||||
</#if>
|
||||
var videoObject = {
|
||||
container: '.video', //视频容器
|
||||
//autoplay:true,//自动播放
|
||||
// live:true,//指定为直播
|
||||
// crossOrigin:'Anonymous',//发送跨域信息,示例:Anonymous
|
||||
plug:<#if "${file.suffix?lower_case}" == "m3u8" >'hls.js'<#elseif "${file.suffix?lower_case}" == "ts" >'mpegts.js'<#elseif "${file.suffix?lower_case}" == "flv" >'flv.js'<#elseif "${file.suffix?lower_case}" == "mpd" >dashPlayer<#else>''</#if>,//设置使用插件
|
||||
loop: false,//是否需要循环播放
|
||||
rightBar:true,
|
||||
screenshot:true,//截图功能是否开启
|
||||
webFull:true,//是否启用页面全屏按钮,默认不启用
|
||||
//poster:'ckplayer/poster.png',//封面图片
|
||||
menu:[
|
||||
{
|
||||
title:'kkFileView',
|
||||
link:'https://www.kkview.cn',
|
||||
underline:true
|
||||
},
|
||||
{
|
||||
title:'播放/暂停',
|
||||
click:'player.playOrPause',
|
||||
},
|
||||
{
|
||||
title:'关于视频',
|
||||
click:'aboutShow'
|
||||
}
|
||||
],
|
||||
information:{
|
||||
'已加载:':'{loadTime}秒',
|
||||
'总时长:':'{duration}秒',
|
||||
'视频尺寸:':'{videoWidth}x{videoHeight}',
|
||||
'音量:':'{volume}%',
|
||||
'FPS:':'{fps}',
|
||||
'音频解码:':'{audioDecodedByteCount} Byte',
|
||||
'视频解码:':'{videoDecodedByteCount} Byte',
|
||||
},
|
||||
video:'${mediaUrl}'//视频地址
|
||||
};
|
||||
var player=new ckplayer(videoObject)//调用播放器并赋值给变量player
|
||||
/*初始化水印*/
|
||||
if (!!window.ActiveXObject || "ActiveXObject" in window)
|
||||
{
|
||||
}else{
|
||||
initWaterMark();
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,63 @@
|
||||
<#setting classic_compatible=true>
|
||||
<link rel="icon" href="./favicon.ico" type="image/x-icon">
|
||||
<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css"/>
|
||||
<script src="js/jquery-3.6.1.min.js" type="text/javascript"></script>
|
||||
<script src="bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
|
||||
<script src="js/bootbox.min.js" type="text/javascript"></script>
|
||||
<script>
|
||||
// 中文环境
|
||||
var locale_zh_CN = {
|
||||
OK: '确定',
|
||||
CONFIRM: '确认',
|
||||
CANCEL: '取消'
|
||||
};
|
||||
bootbox.addLocale('locale_zh_CN', locale_zh_CN);
|
||||
|
||||
/**
|
||||
* 需要文件密码
|
||||
*/
|
||||
function needFilePassword() {
|
||||
if ('${needFilePassword}' == 'true') {
|
||||
let promptTitle = "你正在预览加密文件,请输入文件密码。";
|
||||
if ('${filePasswordError}' == 'true') {
|
||||
promptTitle = "密码错误,请重新输入密码。";
|
||||
}
|
||||
bootbox.prompt({
|
||||
title: promptTitle,
|
||||
inputType: 'password',
|
||||
centerVertical: true,
|
||||
locale: 'locale_zh_CN',
|
||||
callback: function (filePassword) {
|
||||
if (filePassword != null) {
|
||||
const locationHref = window.location.href;
|
||||
const isInclude = locationHref.includes("filePassword=");
|
||||
let redirectUrl = null;
|
||||
if (isInclude) {
|
||||
const url = new URL(locationHref);
|
||||
url.searchParams.set("filePassword", filePassword);
|
||||
redirectUrl = url.href;
|
||||
} else {
|
||||
redirectUrl = locationHref + '&filePassword=' + filePassword;
|
||||
}
|
||||
window.location.replace(redirectUrl);
|
||||
} else {
|
||||
location.reload();
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
html, body {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
</style>
|
||||
|
||||
42
tool-tech-file-view/src/main/resources/web/notTrustDir.html
Normal file
42
tool-tech-file-view/src/main/resources/web/notTrustDir.html
Normal file
@@ -0,0 +1,42 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<style type="text/css">
|
||||
body {
|
||||
margin: 0 auto;
|
||||
width: 900px;
|
||||
background-color: #CCB;
|
||||
}
|
||||
|
||||
.container {
|
||||
width: 700px;
|
||||
height: 700px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
img {
|
||||
width: auto;
|
||||
height: auto;
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
padding-bottom: 36px;
|
||||
}
|
||||
|
||||
p {
|
||||
display: block;
|
||||
font-size: 20px;
|
||||
color: blue;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<img src="images/sorry.jpg" />
|
||||
<p>
|
||||
预览源文件来自未授信的目录,请停止访问!<br>
|
||||
有任何疑问,请加入kk开源社区知识星球咨询:<a href="https://t.zsxq.com/09ZHSXbsQ">https://t.zsxq.com/09ZHSXbsQ</a><br>
|
||||
</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
42
tool-tech-file-view/src/main/resources/web/notTrustHost.html
Normal file
42
tool-tech-file-view/src/main/resources/web/notTrustHost.html
Normal file
@@ -0,0 +1,42 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<style type="text/css">
|
||||
body {
|
||||
margin: 0 auto;
|
||||
width: 900px;
|
||||
background-color: #CCB;
|
||||
}
|
||||
|
||||
.container {
|
||||
width: 700px;
|
||||
height: 700px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
img {
|
||||
width: auto;
|
||||
height: auto;
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
padding-bottom: 36px;
|
||||
}
|
||||
|
||||
p {
|
||||
display: block;
|
||||
font-size: 20px;
|
||||
color: blue;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<img src="images/sorry.jpg" />
|
||||
<p>
|
||||
预览源文件来自不受信任的站点:<span style="color: red; display: inline;">${current_host}</span> 请联系管理员!<br>
|
||||
有任何疑问,请加入kk开源社区知识星球咨询:<a href="https://t.zsxq.com/09ZHSXbsQ">https://t.zsxq.com/09ZHSXbsQ</a><br>
|
||||
</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
51
tool-tech-file-view/src/main/resources/web/ofd.ftl
Normal file
51
tool-tech-file-view/src/main/resources/web/ofd.ftl
Normal file
@@ -0,0 +1,51 @@
|
||||
<!DOCTYPE html>
|
||||
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8"/>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=yes, initial-scale=1.0">
|
||||
<title>${file.name}OFD预览</title>
|
||||
<#include "*/commonHeader.ftl">
|
||||
<script src="js/base64.min.js" type="text/javascript"></script>
|
||||
</head>
|
||||
<body>
|
||||
<#if currentUrl?contains("http://") || currentUrl?contains("https://")>
|
||||
<#assign finalUrl="${currentUrl}">
|
||||
<#else>
|
||||
<#assign finalUrl="${baseUrl}${currentUrl}">
|
||||
</#if>
|
||||
<iframe src="" width="100%" frameborder="0"></iframe>
|
||||
</body>
|
||||
<script type="text/javascript">
|
||||
var url = '${finalUrl}';
|
||||
var baseUrl = '${baseUrl}'.endsWith('/') ? '${baseUrl}' : '${baseUrl}' + '/';
|
||||
if (!url.startsWith(baseUrl)) {
|
||||
url = baseUrl + 'getCorsFile?urlPath=' + encodeURIComponent(Base64.encode(url));
|
||||
}
|
||||
if(IsPhone()){
|
||||
document.getElementsByTagName('iframe')[0].src = "${baseUrl}ofd/index.html?file=" + encodeURIComponent(url)+"&scale=width";
|
||||
}else{
|
||||
document.getElementsByTagName('iframe')[0].src = "${baseUrl}ofd/index.html?file="+ encodeURIComponent(url)+"";
|
||||
}
|
||||
document.getElementsByTagName('iframe')[0].height = document.documentElement.clientHeight - 10;
|
||||
/**
|
||||
* 页面变化调整高度
|
||||
*/
|
||||
window.onresize = function () {
|
||||
var fm = document.getElementsByTagName("iframe")[0];
|
||||
fm.height = window.document.documentElement.clientHeight - 10;
|
||||
}
|
||||
|
||||
function IsPhone() {
|
||||
var info = navigator.userAgent;
|
||||
//通过正则表达式的test方法判断是否包含“Mobile”字符串
|
||||
var isPhone = /mobile/i.test(info);
|
||||
//如果包含“Mobile”(是手机设备)则返回true
|
||||
return isPhone;
|
||||
}
|
||||
/*初始化水印*/
|
||||
window.onload = function () {
|
||||
initWaterMark();
|
||||
}
|
||||
</script>
|
||||
</html>
|
||||
65
tool-tech-file-view/src/main/resources/web/officePicture.ftl
Normal file
65
tool-tech-file-view/src/main/resources/web/officePicture.ftl
Normal file
@@ -0,0 +1,65 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<title>PDF图片预览</title>
|
||||
<#include "*/commonHeader.ftl">
|
||||
<script src="js/lazyload.js"></script>
|
||||
<style>
|
||||
body {
|
||||
background-color: #404040;
|
||||
}
|
||||
.container {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.img-area {
|
||||
text-align: center;
|
||||
}
|
||||
.my-photo {
|
||||
max-width: 98%;
|
||||
margin:0 auto;
|
||||
border-radius:3px;
|
||||
box-shadow:rgba(0,0,0,0.15) 0 0 8px;
|
||||
background:#FBFBFB;
|
||||
border:1px solid #ddd;
|
||||
margin:1px auto;
|
||||
padding:5px;
|
||||
}
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<#list imgUrls as img>
|
||||
<div class="img-area">
|
||||
<img class="my-photo" alt="loading" data-src="${img}" src="images/loading.gif">
|
||||
</div>
|
||||
</#list>
|
||||
</div>
|
||||
<#if "false" == switchDisabled>
|
||||
<img src="images/pdf.svg" width="48" height="48" style="position: fixed; cursor: pointer; top: 40%; right: 48px; z-index: 999;" alt="使用PDF预览" title="使用PDF预览" onclick="changePreviewType('pdf')"/>
|
||||
</#if>
|
||||
<script>
|
||||
window.onload = function () {
|
||||
/*初始化水印*/
|
||||
initWaterMark();
|
||||
checkImgs();
|
||||
};
|
||||
window.onscroll = throttle(checkImgs);
|
||||
function changePreviewType(previewType) {
|
||||
var url = window.location.href;
|
||||
if (url.indexOf("officePreviewType=image") !== -1) {
|
||||
url = url.replace("officePreviewType=image", "officePreviewType="+previewType);
|
||||
} else {
|
||||
url = url + "&officePreviewType="+previewType;
|
||||
}
|
||||
if ('allImages' === previewType) {
|
||||
window.open(url)
|
||||
} else {
|
||||
window.location.href = url;
|
||||
}
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
138
tool-tech-file-view/src/main/resources/web/officeweb.ftl
Normal file
138
tool-tech-file-view/src/main/resources/web/officeweb.ftl
Normal file
@@ -0,0 +1,138 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<title>${file.name}预览</title>
|
||||
<link rel='stylesheet' href='xlsx/plugins/css/pluginsCss.css' />
|
||||
<link rel='stylesheet' href='xlsx/plugins/plugins.css' />
|
||||
<link rel='stylesheet' href='xlsx/css/luckysheet.css' />
|
||||
<link rel='stylesheet' href='xlsx/assets/iconfont/iconfont.css' />
|
||||
<script src="xlsx/plugins/js/plugin.js"></script>
|
||||
<script src="xlsx/luckysheet.umd.js"></script>
|
||||
<script src="js/watermark.js" type="text/javascript"></script>
|
||||
<script src="js/base64.min.js" type="text/javascript"></script>
|
||||
</head>
|
||||
<#if pdfUrl?contains("http://") || pdfUrl?contains("https://") || pdfUrl?contains("ftp://")>
|
||||
<#assign finalUrl="${pdfUrl}">
|
||||
<#else>
|
||||
<#assign finalUrl="${baseUrl}${pdfUrl}">
|
||||
</#if>
|
||||
<script>
|
||||
/**
|
||||
* 初始化水印
|
||||
*/
|
||||
function initWaterMark() {
|
||||
|
||||
let watermarkTxt = '${watermarkTxt}';
|
||||
if (watermarkTxt !== '') {
|
||||
watermark.init({
|
||||
watermark_txt: '${watermarkTxt}',
|
||||
watermark_x: 0,
|
||||
watermark_y: 0,
|
||||
watermark_rows: 0,
|
||||
watermark_cols: 0,
|
||||
watermark_x_space: ${watermarkXSpace},
|
||||
watermark_y_space: ${watermarkYSpace},
|
||||
watermark_font: '${watermarkFont}',
|
||||
watermark_fontsize: '${watermarkFontsize}',
|
||||
watermark_color: '${watermarkColor}',
|
||||
watermark_alpha: ${watermarkAlpha},
|
||||
watermark_width: ${watermarkWidth},
|
||||
watermark_height: ${watermarkHeight},
|
||||
watermark_angle: ${watermarkAngle},
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
<style>
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
html, body {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
</style>
|
||||
<body>
|
||||
<div id="lucky-mask-demo" style="position: absolute;z-index: 1000000;left: 0px;top: 0px;bottom: 0px;right: 0px; background: rgba(255, 255, 255, 0.8); text-align: center;font-size: 40px;align-items:center;justify-content: center;display: none;">加载中</div>
|
||||
<p style="text-align:center;">
|
||||
<div id="button-area">
|
||||
<label><button onclick="tiaozhuan()">跳转HTML预览</button></label>
|
||||
<button id="confirm-button" onclick="print()">打印</button>
|
||||
</div>
|
||||
<div id="luckysheet" style="margin:0px;padding:0px;position:absolute;width:100%;left: 0px;top: 20px;bottom: 0px;outline: none;"></div>
|
||||
|
||||
<script src="xlsx/luckyexcel.umd.js"></script>
|
||||
<script>
|
||||
function tiaozhuan(){
|
||||
var test = window.location.href;
|
||||
test = test.replace(new RegExp("&officePreviewType=xlsx",("gm")),"");
|
||||
test = test+'&officePreviewType=html';
|
||||
window.location.href=test;
|
||||
}
|
||||
var url = '${finalUrl}';
|
||||
var baseUrl = '${baseUrl}'.endsWith('/') ? '${baseUrl}' : '${baseUrl}' + '/';
|
||||
if (!url.startsWith(baseUrl)) {
|
||||
url = baseUrl + 'getCorsFile?urlPath=' + encodeURIComponent(Base64.encode(url));
|
||||
}
|
||||
let mask = document.getElementById("lucky-mask-demo");
|
||||
function loadText() {
|
||||
initWaterMark(); // 是否显示水印
|
||||
var value = url;
|
||||
var name = '${file.name}';
|
||||
if(value==""){
|
||||
return;
|
||||
}
|
||||
// mask.style.display = "flex";
|
||||
LuckyExcel.transformExcelToLuckyByUrl(value, name, function(exportJson, luckysheetfile){
|
||||
if(exportJson.sheets==null || exportJson.sheets.length==0){
|
||||
alert("读取excel文件内容失败!");
|
||||
return;
|
||||
}
|
||||
mask.style.display = "none";
|
||||
window.luckysheet.destroy();
|
||||
window.luckysheet.create({
|
||||
container: 'luckysheet', //luckysheet is the container id
|
||||
lang: "zh",
|
||||
showtoolbarConfig:{
|
||||
image: true,
|
||||
print: true, //关闭打印按钮 启用也不能用 等以后看情况而定
|
||||
exportXlsx: true, //关闭导出按钮 启用也不能用 等以后看情况而定
|
||||
},
|
||||
allowCopy: true, // 是否允许拷贝
|
||||
showtoolbar: true, // 是否显示工具栏
|
||||
showinfobar: false, // 是否显示顶部信息栏
|
||||
// myFolderUrl: "/",//作用:左上角<返回按钮的链接
|
||||
showsheetbar: true, // 是否显示底部sheet页按钮
|
||||
showstatisticBar: true, // 是否显示底部计数栏
|
||||
sheetBottomConfig: true, // sheet页下方的添加行按钮和回到顶部按钮配置
|
||||
allowEdit: true, // 是否允许前台编辑
|
||||
enableAddRow: false, // 允许增加行
|
||||
enableAddCol: false, // 允许增加列
|
||||
userInfo: false, // 右上角的用户信息展示样式
|
||||
showRowBar: true, // 是否显示行号区域
|
||||
showColumnBar: false, // 是否显示列号区域
|
||||
sheetFormulaBar: false, // 是否显示公式栏
|
||||
enableAddBackTop: true,//返回头部按钮
|
||||
forceCalculation: false, //下面是导出插件 默认关闭
|
||||
data: exportJson.sheets,
|
||||
title: exportJson.info.name,
|
||||
userInfo: exportJson.info.name.creator,
|
||||
});
|
||||
});
|
||||
}
|
||||
loadText();
|
||||
// 打印时,获取luckysheet指定区域html内容,拼接至div,隐藏luckysheet容器并显示打印区域html
|
||||
function to_print() {
|
||||
const html = luckysheet.getRangeHtml();
|
||||
document.querySelector('#print-html').innerHTML = html;
|
||||
document.querySelector('#print-area').style.display = 'block';
|
||||
document.querySelector('#button-area').style.display = 'none';
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
50
tool-tech-file-view/src/main/resources/web/online3D.ftl
Normal file
50
tool-tech-file-view/src/main/resources/web/online3D.ftl
Normal file
@@ -0,0 +1,50 @@
|
||||
<!DOCTYPE html>
|
||||
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8"/>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=yes, initial-scale=1.0">
|
||||
<title>${file.name}3D预览</title>
|
||||
<script src="js/base64.min.js" type="text/javascript"></script>
|
||||
<#include "*/commonHeader.ftl">
|
||||
|
||||
</head>
|
||||
<#if currentUrl?contains("http://") || currentUrl?contains("https://") || currentUrl?contains("file://")>
|
||||
<#assign finalUrl="${currentUrl}">
|
||||
<#elseif currentUrl?contains("ftp://") >
|
||||
<#assign finalUrl="${currentUrl}">
|
||||
<#else>
|
||||
<#assign finalUrl="${baseUrl}${currentUrl}">
|
||||
</#if>
|
||||
<body>
|
||||
<iframe src="" width="100%" frameborder="0"></iframe>
|
||||
</body>
|
||||
<script type="text/javascript">
|
||||
var url = '${finalUrl}';
|
||||
var baseUrl = '${baseUrl}'.endsWith('/') ? '${baseUrl}' : '${baseUrl}' + '/';
|
||||
if (!url.startsWith(baseUrl)) {
|
||||
url = baseUrl + 'getCorsFile?urlPath=' + encodeURIComponent(Base64.encode(url));
|
||||
document.getElementsByTagName('iframe')[0].src = "${baseUrl}website/index.html#model="+ url + "&fullfilename=/${file.name}";
|
||||
}else{
|
||||
document.getElementsByTagName('iframe')[0].src = "${baseUrl}website/index.html#model="+ url;
|
||||
}
|
||||
|
||||
document.getElementsByTagName('iframe')[0].height = document.documentElement.clientHeight - 10;
|
||||
/**
|
||||
* 页面变化调整高度
|
||||
*/
|
||||
window.onresize = function () {
|
||||
var fm = document.getElementsByTagName("iframe")[0];
|
||||
fm.height = window.document.documentElement.clientHeight - 10;
|
||||
}
|
||||
</script>
|
||||
|
||||
<script type="text/javascript">
|
||||
/*初始化水印*/
|
||||
if (!!window.ActiveXObject || "ActiveXObject" in window)
|
||||
{
|
||||
}else{
|
||||
initWaterMark();
|
||||
}
|
||||
</script>
|
||||
</html>
|
||||
61
tool-tech-file-view/src/main/resources/web/pdf.ftl
Normal file
61
tool-tech-file-view/src/main/resources/web/pdf.ftl
Normal file
@@ -0,0 +1,61 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8"/>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=yes, initial-scale=1.0">
|
||||
<title>PDF预览</title>
|
||||
<#include "*/commonHeader.ftl">
|
||||
<script src="js/base64.min.js" type="text/javascript"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<#if pdfUrl?contains("http://") || pdfUrl?contains("https://")>
|
||||
<#assign finalUrl="${pdfUrl}">
|
||||
<#else>
|
||||
<#assign finalUrl="${baseUrl}${pdfUrl}">
|
||||
</#if>
|
||||
<iframe src="" width="100%" frameborder="0"></iframe>
|
||||
<#if "false" == switchDisabled>
|
||||
<img src="images/jpg.svg" width="48" height="48" style="position: fixed; cursor: pointer; top: 40%; right: 48px; z-index: 999;" alt="使用图片预览" title="使用图片预览" onclick="goForImage()"/>
|
||||
</#if>
|
||||
</body>
|
||||
|
||||
<script type="text/javascript">
|
||||
var url = '${finalUrl}';
|
||||
var baseUrl = '${baseUrl}'.endsWith('/') ? '${baseUrl}' : '${baseUrl}' + '/';
|
||||
if (!url.startsWith(baseUrl)) {
|
||||
url = baseUrl + 'getCorsFile?urlPath=' + encodeURIComponent(Base64.encode(url));
|
||||
}
|
||||
document.getElementsByTagName('iframe')[0].src = "${baseUrl}pdfjs/web/viewer.html?file=" + encodeURIComponent(url) + "&disablepresentationmode=${pdfPresentationModeDisable}&disableopenfile=${pdfOpenFileDisable}&disableprint=${pdfPrintDisable}&disabledownload=${pdfDownloadDisable}&disablebookmark=${pdfBookmarkDisable}&disableediting=${pdfDisableEditing}";
|
||||
document.getElementsByTagName('iframe')[0].height = document.documentElement.clientHeight - 10;
|
||||
/**
|
||||
* 页面变化调整高度
|
||||
*/
|
||||
window.onresize = function () {
|
||||
var fm = document.getElementsByTagName("iframe")[0];
|
||||
fm.height = window.document.documentElement.clientHeight - 10;
|
||||
}
|
||||
|
||||
function goForImage() {
|
||||
var url = window.location.href
|
||||
|
||||
if (url.indexOf("tifPreviewType=pdf") != -1) {
|
||||
url = url.replace("tifPreviewType=pdf", "tifPreviewType=jpg");
|
||||
} else {
|
||||
url = url + "&tifPreviewType=jpg";
|
||||
}
|
||||
|
||||
if (url.indexOf("officePreviewType=pdf") != -1) {
|
||||
url = url.replace("officePreviewType=pdf", "officePreviewType=image");
|
||||
} else {
|
||||
url = url + "&officePreviewType=image";
|
||||
}
|
||||
window.location.href = url;
|
||||
}
|
||||
|
||||
/*初始化水印*/
|
||||
window.onload = function () {
|
||||
initWaterMark();
|
||||
}
|
||||
</script>
|
||||
</html>
|
||||
48
tool-tech-file-view/src/main/resources/web/picture.ftl
Normal file
48
tool-tech-file-view/src/main/resources/web/picture.ftl
Normal file
@@ -0,0 +1,48 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<title>图片预览</title>
|
||||
<#include "*/commonHeader.ftl">
|
||||
<link rel="stylesheet" href="css/viewer.min.css">
|
||||
<script src="js/viewer.min.js"></script>
|
||||
<style>
|
||||
body {
|
||||
background-color: #404040;
|
||||
}
|
||||
#image { width: 800px; margin: 0 auto; font-size: 0;}
|
||||
#image li { display: inline-block;width: 50px;height: 50px; margin-left: 1%; padding-top: 1%;}
|
||||
/*#dowebok li img { width: 200%;}*/
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<ul id="image">
|
||||
<#list imgUrls as img>
|
||||
<#if img?contains("http://") || img?contains("https://")>
|
||||
<#assign img="${img}">
|
||||
<#else>
|
||||
<#assign img="${baseUrl}${img}">
|
||||
</#if>
|
||||
<li><img id="${img}" url="${img}" src="${img}" style="display: none"></li>
|
||||
</#list>
|
||||
</ul>
|
||||
|
||||
<script>
|
||||
var viewer = new Viewer(document.getElementById('image'), {
|
||||
url: 'src',
|
||||
navbar: false,
|
||||
button: false,
|
||||
backdrop: false,
|
||||
loop : true
|
||||
});
|
||||
document.getElementById("${currentUrl}").click();
|
||||
|
||||
/*初始化水印*/
|
||||
window.onload = function() {
|
||||
initWaterMark();
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
145
tool-tech-file-view/src/main/resources/web/ppt.ftl
Normal file
145
tool-tech-file-view/src/main/resources/web/ppt.ftl
Normal file
@@ -0,0 +1,145 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
<#include "*/commonHeader.ftl">
|
||||
<link href="pptx/bootstrap/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link href="pptx/idocv/idocv_common.min.css" rel="stylesheet">
|
||||
<link href="pptx/jquery.contextMenu.css" rel="stylesheet">
|
||||
<#-- 手机端预览兼容 -->
|
||||
<script type="text/javascript">
|
||||
var windowWidth = document.documentElement.clientWidth;
|
||||
var searchStr = window.location.search.substr(1);
|
||||
if ((windowWidth < 768 || (/micromessenger/.test(navigator.userAgent.toLowerCase()))) && (!searchStr || searchStr.indexOf('type=') < 0)) {
|
||||
var redirectUrl = window.location.pathname + '?type=mobile' + (!!searchStr ? ('&' + searchStr) : '');
|
||||
window.location.replace(redirectUrl);
|
||||
}
|
||||
</script>
|
||||
|
||||
<!--[if lt IE 9]>
|
||||
<script src="/static/bootstrap/js/html5shiv.js"></script>
|
||||
<![endif]-->
|
||||
</head>
|
||||
|
||||
<body onload="resetImgSize();" class="ppt-body">
|
||||
|
||||
<div class="loading-mask" style="display: block;">
|
||||
<div class="loading-zone">
|
||||
<div class="text"><img src="pptx/img/loader_indicator_lite.gif">加载中...</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="navbar navbar-inverse navbar-fixed-top">
|
||||
<div class="navbar-inner">
|
||||
<div class="container-fluid">
|
||||
<button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</button>
|
||||
<!-- FILE NAME HERE -->
|
||||
<!-- SIGN UP & SIGN IN -->
|
||||
|
||||
<div class="nav-collapse collapse">
|
||||
<p class="navbar-text pull-right">
|
||||
<a href="#" title="全屏" class="fullscreen-link"><i class="icon-fullscreen icon-white"></i></a>
|
||||
</p>
|
||||
</div><!--/.nav-collapse -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container-fluid" style="max-height: 100%;">
|
||||
<div class="row-fluid">
|
||||
<div class="span2 hidden-phone"
|
||||
style="position: fixed; top: 60px; left: 20px; bottom: 20px; padding-right: 10px; border-right: 3px solid #c8c8c8; max-height: 100%; overflow: auto; text-align: center;">
|
||||
</div>
|
||||
<div class="span9 offset2">
|
||||
<div class="slide-img-container">
|
||||
<div class="ppt-turn-left-mask"></div>
|
||||
<div class="ppt-turn-right-mask"></div>
|
||||
<!--
|
||||
<img src="" class="img-polaroid" style="max-height: 100%;">
|
||||
-->
|
||||
</div>
|
||||
<!-- ONLY AVAILABLE ON MOBILE -->
|
||||
<div class="span12 visible-phone text-center"
|
||||
style="position: fixed; bottom: 10px; left: 0px; z-index: 1000;">
|
||||
<select class="select-page-selector span1" style="width: 80px; margin-top: 10px;">
|
||||
<!-- PAGE NUMBERS HERE -->
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="progress progress-striped active bottom-paging-progress">
|
||||
<div class="bar" style="width: 0%;"></div>
|
||||
</div>
|
||||
|
||||
<!-- JavaSript ================================================== -->
|
||||
<script src="js/jquery-3.6.1.min.js"></script>
|
||||
<script src="pptx/jquery.contextMenu.js?v=11.2.5_20210128"></script>
|
||||
<script src="pptx/idocv/idocv_common.min.js"></script>
|
||||
<script src="pptx/jquery.mobile-events.min.js"></script>
|
||||
<script src="pptx/ppt.js"></script>
|
||||
<script>
|
||||
var resultData = {
|
||||
"code": 1,
|
||||
"name": "PPT预览",
|
||||
"totalSize": ${imgUrls ? size},
|
||||
"curPage": 1,
|
||||
"totalPage": 1,
|
||||
"pageSize": 10,
|
||||
"titles": null,
|
||||
"data": [
|
||||
<#assign index = 0>
|
||||
<#list imgUrls as img>
|
||||
<#if index != 0>, </#if>{
|
||||
"uuid": null,
|
||||
"title": null,
|
||||
"content": null,
|
||||
"text": null,
|
||||
"url": "${img}",
|
||||
"destFile": null,
|
||||
"viewCount": 0,
|
||||
"downloadCount": 0,
|
||||
"ctime": null,
|
||||
"thumbUrl": "${img}",
|
||||
"largeUrl": null,
|
||||
"ratio": 0.5625,
|
||||
"note": null
|
||||
}<#assign index = index + 1>
|
||||
</#list>],
|
||||
"desc": "Success"
|
||||
}
|
||||
|
||||
var contextPath = '';
|
||||
var version = '12';
|
||||
// var urlObj = $.url($.url().attr('source').replace(contextPath, ''));
|
||||
var id = window.location.pathname.replace(contextPath, '').split('/')[2];
|
||||
var uuid = id;
|
||||
var params = getAllUrlParams(window.location.href); // 如果用urlObj.param()方法获取则被非正常解码
|
||||
// var queryStr = urlObj.attr('query'); // 参数被decode,IE下如果有中文参数则报错,需要获取原生参数
|
||||
var queryStr = window.location.search.slice(1);
|
||||
uuid = !!'' ? '' : uuid;
|
||||
var name = 'pptx';
|
||||
if (!!name) {
|
||||
params.name = name;
|
||||
}
|
||||
var reqUrl = '';
|
||||
var reqUrlMd5 = '';
|
||||
var authMap = '{}';
|
||||
var authMapStr = 'null';
|
||||
if (!!reqUrlMd5 && !!authMapStr) {
|
||||
authMap = JSON.parse(authMapStr);
|
||||
}
|
||||
|
||||
window.onload = function () {
|
||||
initWaterMark();
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
53
tool-tech-file-view/src/main/resources/web/svg.ftl
Normal file
53
tool-tech-file-view/src/main/resources/web/svg.ftl
Normal file
@@ -0,0 +1,53 @@
|
||||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>${file.name}文件预览</title>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
|
||||
<#include "*/commonHeader.ftl">
|
||||
<script src="js/jquery-3.6.1.min.js" type="text/javascript"></script>
|
||||
<script src="js/svg-pan-zoom.js"></script>
|
||||
<script src="js/base64.min.js"></script>
|
||||
<#if currentUrl?contains("http://") || currentUrl?contains("https://") || currentUrl?contains("ftp://")>
|
||||
<#assign finalUrl="${currentUrl}">
|
||||
<#else>
|
||||
<#assign finalUrl="${baseUrl}${currentUrl}">
|
||||
</#if>
|
||||
</head>
|
||||
<body>
|
||||
<div id="container">
|
||||
</div>
|
||||
<script type="text/javascript">
|
||||
|
||||
var url = '${finalUrl}';
|
||||
var baseUrl = '${baseUrl}'.endsWith('/') ? '${baseUrl}' : '${baseUrl}' + '/';
|
||||
if (!url.startsWith(baseUrl)) {
|
||||
url = baseUrl + 'getCorsFile?urlPath=' + encodeURIComponent(Base64.encode(url));
|
||||
}
|
||||
|
||||
function createNewEmbed(src){
|
||||
var lastEventListener = null;
|
||||
var gaodu1 =$(document).height();
|
||||
var gaodu=gaodu1-5;
|
||||
var embed = document.createElement('embed');
|
||||
embed.setAttribute('style', 'width: 99%; height: '+gaodu+'px; border:1px solid black;');
|
||||
embed.setAttribute('type', 'image/svg+xml');
|
||||
embed.setAttribute('src', src);
|
||||
$('#container').html(embed);
|
||||
lastEventListener = function(){
|
||||
svgPanZoom(embed, {
|
||||
zoomEnabled: true,
|
||||
controlIconsEnabled: true
|
||||
});
|
||||
}
|
||||
embed.addEventListener('load', lastEventListener)
|
||||
return embed;
|
||||
}
|
||||
createNewEmbed(url);
|
||||
/*初始化水印*/
|
||||
window.onload = function () {
|
||||
initWaterMark();
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
146
tool-tech-file-view/src/main/resources/web/tiff.ftl
Normal file
146
tool-tech-file-view/src/main/resources/web/tiff.ftl
Normal file
@@ -0,0 +1,146 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8"/>
|
||||
<title>Tiff 图片预览</title>
|
||||
<#include "*/commonHeader.ftl">
|
||||
<link rel="stylesheet" href="css/viewer.min.css">
|
||||
<script src="js/UTIF.js"></script>
|
||||
<script src="js/base64.min.js" type="text/javascript"></script>
|
||||
<#if currentUrl?contains("http://") || currentUrl?contains("https://") || currentUrl?contains("file://")|| currentUrl?contains("ftp://")>
|
||||
<#assign finalUrl="${currentUrl}">
|
||||
<#else>
|
||||
<#assign finalUrl="${baseUrl}${currentUrl}">
|
||||
</#if>
|
||||
</head>
|
||||
<style type="text/css">
|
||||
body{ text-align:center}
|
||||
img{max-width: 100%;
|
||||
margin:0 auto;
|
||||
border: 2px solid #ddd;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<#if "false" == pdfDownloadDisable>
|
||||
<!--endprint-->
|
||||
<button type="button" onclick="doPrint()">打印</button>
|
||||
<!--startprint-->
|
||||
</#if>
|
||||
<div id="tiff"></div>
|
||||
<script>
|
||||
String.prototype.startsWithh = function(str) {
|
||||
var reg = new RegExp("^" + str);
|
||||
return reg.test(this);
|
||||
}
|
||||
|
||||
String.prototype.endsWithh = function(str) {
|
||||
var reg = new RegExp(str + "$");
|
||||
return reg.test(this);
|
||||
}
|
||||
var url = '${finalUrl}';
|
||||
var baseUrl = '${baseUrl}'.endsWithh('/') ? '${baseUrl}' : '${baseUrl}' + '/';
|
||||
if (!url.startsWithh(baseUrl)) {
|
||||
url = baseUrl + 'getCorsFile?urlPath=' + encodeURIComponent(Base64.encode(url));
|
||||
}
|
||||
var myp = document.getElementById('tiff');
|
||||
let pages;
|
||||
let p;
|
||||
let resp;
|
||||
function loadOne(e) {
|
||||
UTIF.decodeImage(resp, pages[p]);
|
||||
const rgba = UTIF.toRGBA8(pages[p]);
|
||||
const canvas = document.createElement('canvas');
|
||||
canvas.width = pages[p].width;
|
||||
canvas.height = pages[p].height;
|
||||
const ctx = canvas.getContext('2d');
|
||||
var imageData = null;
|
||||
try{
|
||||
imageData = ctx.createImageData(canvas.width, canvas.height);
|
||||
} catch(e){
|
||||
if (e.message.indexOf("CanvasRenderingContext2D"))
|
||||
{
|
||||
var imgObjj = new Image();
|
||||
imgObjj.src = url;
|
||||
myp.appendChild(imgObjj);
|
||||
console.log("错误:" + e);
|
||||
return;
|
||||
}
|
||||
console.log("错误:" + e);
|
||||
var html = "";
|
||||
html += "<head>";
|
||||
html += " <meta charset=\"utf-8\"/>";
|
||||
html += " <style type=\"text/css\">";
|
||||
html += " body {";
|
||||
html += " margin: 0 auto;";
|
||||
html += " width: 900px;";
|
||||
html += " background-color: #CCB;";
|
||||
html += " }";
|
||||
html += "";
|
||||
html += " .container {";
|
||||
html += " width: 700px;";
|
||||
html += " height: 700px;";
|
||||
html += " margin: 0 auto;";
|
||||
html += " }";
|
||||
html += "";
|
||||
html += " img {";
|
||||
html += " width: auto;";
|
||||
html += " height: auto;";
|
||||
html += " max-width: 100%;";
|
||||
html += " max-height: 100%;";
|
||||
html += " padding-bottom: 36px;";
|
||||
html += " }";
|
||||
html += "";
|
||||
html += " span {";
|
||||
html += " display: block;";
|
||||
html += " font-size: 20px;";
|
||||
html += " color: blue;";
|
||||
html += " }";
|
||||
html += " </style>";
|
||||
html += "</head>";
|
||||
html += "";
|
||||
html += "<body>";
|
||||
html += "<div class=\"container\">";
|
||||
html += " <img src=\"images/sorry.jpg\"/>";
|
||||
html += " <span>";
|
||||
html += " 该(tif)文件,系统解析错误,具体原因如下:";
|
||||
html += " <p style=\"color: red;\">文件[${file.name}]解析失败,请联系系统管理员</p>";
|
||||
html += " </span>";
|
||||
html += " <p>有任何疑问,请加入kk开源社区知识星球咨询:<a href=\"https://t.zsxq.com/09ZHSXbsQ\">https://t.zsxq.com/09ZHSXbsQ</a><br></p>";
|
||||
html += "</div>";
|
||||
html += "</body>";
|
||||
html += "</html>";
|
||||
document.write(html);
|
||||
document.close();
|
||||
return;
|
||||
}
|
||||
for (let i = 0; i < rgba.length; i++) {
|
||||
imageData.data[i] = rgba[i];
|
||||
}
|
||||
ctx.putImageData(imageData, 0, 0);
|
||||
const imgObj = document.createElement('img');
|
||||
imgObj.src = canvas.toDataURL('image/png');
|
||||
if (++p < pages.length) {
|
||||
imgObj.onload = loadOne;
|
||||
}
|
||||
myp.appendChild(imgObj);
|
||||
}
|
||||
|
||||
function imgLoaded(e) {
|
||||
resp = e.target.response;
|
||||
pages = UTIF.decode(resp);
|
||||
p = 0;
|
||||
loadOne();
|
||||
}
|
||||
const xhr = new XMLHttpRequest();
|
||||
xhr.open('GET', url);
|
||||
xhr.responseType = 'arraybuffer';
|
||||
xhr.onload = imgLoaded;
|
||||
xhr.send();
|
||||
|
||||
/*初始化水印*/
|
||||
window.onload = function () {
|
||||
initWaterMark();
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
331
tool-tech-file-view/src/main/resources/web/txt.ftl
Normal file
331
tool-tech-file-view/src/main/resources/web/txt.ftl
Normal file
@@ -0,0 +1,331 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8"/>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=yes, initial-scale=1.0">
|
||||
<title>${file.name}普通文本预览</title>
|
||||
<#include "*/commonHeader.ftl">
|
||||
<script src="js/jquery-3.6.1.min.js" type="text/javascript"></script>
|
||||
<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css"/>
|
||||
<script src="bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
|
||||
<script src="js/base64.min.js" type="text/javascript"></script>
|
||||
</head>
|
||||
<body>
|
||||
<input hidden id="textData" value="${textData}"/>
|
||||
<#if "${file.suffix?html}" == "txt" || "${file.suffix?html}" == "log" || "${file.suffix?html}" == "TXT" || "${file.suffix?html}" == "LOG">
|
||||
<style type="text/css">
|
||||
DIV.black{line-height:25px;PADDING-RIGHT:1px;PADDING-LEFT:1px;FONT-SIZE:100%;MARGIN:1px;COLOR:#909090;BACKGROUND-COLOR:#000;TEXT-ALIGN:left}
|
||||
DIV.black A{BORDER-RIGHT:#909090 1px solid;PADDING-RIGHT:5px;BACKGROUND-POSITION:50% bottom;BORDER-TOP:#909090 1px solid;PADDING-LEFT:5px;BACKGROUND-IMAGE:url();PADDING-BOTTOM:2px;BORDER-LEFT:#909090 1px solid;COLOR:#fff;MARGIN-RIGHT:3px;PADDING-TOP:2px;BORDER-BOTTOM:#909090 1px solid;TEXT-DECORATION:none}
|
||||
DIV.black A:hover{BORDER-RIGHT:#f0f0f0 1px solid;BORDER-TOP:#f0f0f0 1px solid;BACKGROUND-IMAGE:BORDER-LEFT:#f0f0f0 1px solid;COLOR:#ffffff;BORDER-BOTTOM:#f0f0f0 1px solid;BACKGROUND-COLOR:#404040}
|
||||
DIV.black A:active{BORDER-RIGHT:#f0f0f0 1px solid;BORDER-TOP:#f0f0f0 1px solid;BACKGROUND-IMAGE:BORDER-LEFT:#f0f0f0 1px solid;COLOR:#ffffff;BORDER-BOTTOM:#f0f0f0 1px solid;BACKGROUND-COLOR:#404040}
|
||||
.divContent{color:#fff;font-size:30px;
|
||||
line-height:30px;
|
||||
font-family:“SimHei”;
|
||||
text-indent:2em;padding-bottom:10px;white-space:pre-wrap;white-space:-moz-pre-wrap;white-space:-pre-wrap;white-space:-o-pre-wrap;word-wrap:break-word;background-color:#000}
|
||||
input{
|
||||
color:#ffffff;
|
||||
background-color:#000000
|
||||
}
|
||||
</style>
|
||||
|
||||
|
||||
<div class="container">
|
||||
<div class="panel panel-default">
|
||||
<div class="panel-heading">
|
||||
<h4 class="panel-title">
|
||||
<a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">
|
||||
${file.name}
|
||||
</a>
|
||||
</h4>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<div id="divPagenation" class="black" >
|
||||
|
||||
</div>
|
||||
<div id="divContent" class="panel-body">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/javascript">
|
||||
var base64data = $("#textData").val()
|
||||
var s = Base64.decode(base64data);
|
||||
var imgReg = /(<img\s+src='\S+'\s*(\/)?>)/gi;
|
||||
matchContent = s.match(imgReg);
|
||||
imgContent = s;
|
||||
if(imgReg.test(s))
|
||||
{
|
||||
//将img标签替换为❈
|
||||
imgContent = s.replace(imgReg,"❈");
|
||||
}
|
||||
var Length= 20000;
|
||||
// 封装DHTMLpagenation
|
||||
function DHTMLpagenation(content)
|
||||
{
|
||||
this.content=content; // 内容
|
||||
this.contentLength=imgContent.length; // 内容长度
|
||||
this.pageSizeCount; // 总页数
|
||||
this.perpageLength= Length; //default perpage byte length.
|
||||
this.currentPage=1; // 起始页为第1页
|
||||
this.regularExp=/\d+/; // 建立正则表达式,匹配数字型字符串。
|
||||
this.divDisplayContent;
|
||||
this.contentStyle=null;
|
||||
this.strDisplayContent="";
|
||||
this.divDisplayPagenation;
|
||||
this.strDisplayPagenation="";
|
||||
|
||||
// 把第二个参数赋给perpageLength;
|
||||
arguments.length==2 ? perpageLength = arguments[1] : '';
|
||||
|
||||
try {
|
||||
//创建要显示的DIV
|
||||
divExecuteTime=document.createElement("DIV");
|
||||
document.body.appendChild(divExecuteTime);
|
||||
}
|
||||
catch(e)
|
||||
{
|
||||
}
|
||||
|
||||
// 得到divPagenation容器。
|
||||
if(document.getElementById("divPagenation"))
|
||||
{
|
||||
divDisplayPagenation=document.getElementById("divPagenation");
|
||||
}
|
||||
else
|
||||
{
|
||||
try
|
||||
{
|
||||
//创建分页信息
|
||||
divDisplayPagenation=document.createElement("DIV");
|
||||
divDisplayPagenation.id="divPagenation";
|
||||
document.body.appendChild(divDisplayPagenation);
|
||||
}
|
||||
catch(e)
|
||||
{
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
// 得到divContent容器
|
||||
if(document.getElementById("divContent"))
|
||||
{
|
||||
divDisplayContent=document.getElementById("divContent");
|
||||
}
|
||||
else
|
||||
{
|
||||
try
|
||||
{
|
||||
//创建每页显示内容的消息的DIV
|
||||
divDisplayContent=document.createElement("DIV");
|
||||
divDisplayContent.id="divContent";
|
||||
document.body.appendChild(divDisplayContent);
|
||||
}
|
||||
catch(e)
|
||||
{
|
||||
return false;
|
||||
}
|
||||
}
|
||||
DHTMLpagenation.initialize();
|
||||
return this;
|
||||
|
||||
};
|
||||
|
||||
//初始化分页;
|
||||
//包括把加入CSS,检查是否需要分页
|
||||
DHTMLpagenation.initialize=function()
|
||||
{
|
||||
divDisplayContent.className= contentStyle != null ? contentStyle : "divContent";
|
||||
|
||||
if(contentLength<=perpageLength)
|
||||
{
|
||||
strDisplayContent=content;
|
||||
divDisplayContent.innerHTML=strDisplayContent;
|
||||
return null;
|
||||
}
|
||||
|
||||
pageSizeCount=Math.ceil((contentLength/perpageLength));
|
||||
|
||||
DHTMLpagenation.goto(currentPage);
|
||||
|
||||
DHTMLpagenation.displayContent();
|
||||
};
|
||||
|
||||
//显示分页栏
|
||||
DHTMLpagenation.displayPage=function()
|
||||
{
|
||||
strDisplayPagenation="";
|
||||
if(currentPage && currentPage !=1)
|
||||
{
|
||||
|
||||
strDisplayPagenation+='<button onclick="DHTMLpagenation.previous()">上一页</button>';
|
||||
}
|
||||
else
|
||||
{
|
||||
strDisplayPagenation+="上一页 ";
|
||||
}
|
||||
|
||||
for(var i=1;i<=pageSizeCount;i++)
|
||||
{
|
||||
if(i!=currentPage)
|
||||
{
|
||||
|
||||
strDisplayPagenation+='<button onclick="DHTMLpagenation.goto('+i+');">'+i+'</button>';
|
||||
}
|
||||
else
|
||||
{
|
||||
strDisplayPagenation+=i+" ";
|
||||
}
|
||||
}
|
||||
|
||||
if(currentPage && currentPage!=pageSizeCount)
|
||||
{
|
||||
strDisplayPagenation+='<button onclick="DHTMLpagenation.next()">下一页</button>';
|
||||
}
|
||||
else
|
||||
{
|
||||
strDisplayPagenation+="下一页 ";
|
||||
}
|
||||
strDisplayPagenation+="共 " + pageSizeCount + " 页。<br>每页" + perpageLength + " 字符,调整字符数:<input type='text' value='"+perpageLength+"' id='ctlPerpageLength' /><input type='button' value='确定' onclick='DHTMLpagenation.change()' />";
|
||||
divDisplayPagenation.innerHTML=strDisplayPagenation;
|
||||
};
|
||||
|
||||
//上一页
|
||||
DHTMLpagenation.previous=function()
|
||||
{
|
||||
DHTMLpagenation.goto(currentPage-1);
|
||||
};
|
||||
|
||||
//下一页
|
||||
DHTMLpagenation.next=function()
|
||||
{
|
||||
|
||||
DHTMLpagenation.goto(currentPage+1);
|
||||
};
|
||||
|
||||
//跳转至某一页
|
||||
DHTMLpagenation.goto=function(iCurrentPage)
|
||||
{
|
||||
if(regularExp.test(iCurrentPage))
|
||||
{
|
||||
currentPage=iCurrentPage;
|
||||
|
||||
var tempContent = "";
|
||||
//获取当前的内容 里面包含 ❈
|
||||
var currentContent = imgContent.substr((currentPage-1)*perpageLength,perpageLength);
|
||||
tempContent = currentContent;
|
||||
//当前页是否有 ❈ 获取最后一个 ❈ 的位置
|
||||
var indexOf = currentContent.indexOf("❈");
|
||||
if(indexOf >= 0)
|
||||
{
|
||||
//获取从开始位置到当前页位置的内容
|
||||
var beginToEndContent = imgContent.substr(0,currentPage*perpageLength);
|
||||
|
||||
//获取开始到当前页位置的内容 中的 * 的最后的下标
|
||||
var reCount = beginToEndContent.split("❈").length - 1;
|
||||
|
||||
var contentArray = currentContent.split("❈");
|
||||
|
||||
tempContent = replaceStr(contentArray,reCount,matchContent);
|
||||
|
||||
}
|
||||
|
||||
strDisplayContent=tempContent;
|
||||
}
|
||||
else
|
||||
{
|
||||
alert("页面参数错误");
|
||||
}
|
||||
DHTMLpagenation.displayPage();
|
||||
DHTMLpagenation.displayContent();
|
||||
};
|
||||
//显示当前页内容
|
||||
DHTMLpagenation.displayContent=function()
|
||||
{
|
||||
divDisplayContent.innerHTML=strDisplayContent;
|
||||
};
|
||||
|
||||
//改变每页的字节数
|
||||
DHTMLpagenation.change=function()
|
||||
{
|
||||
|
||||
var iPerpageLength = document.getElementById("ctlPerpageLength").value;
|
||||
if(regularExp.test(iPerpageLength))
|
||||
{
|
||||
|
||||
DHTMLpagenation(s,iPerpageLength);
|
||||
}
|
||||
else
|
||||
{
|
||||
alert("请输入数字");
|
||||
}
|
||||
};
|
||||
|
||||
/* currentArray:当前页以 * 分割后的数组
|
||||
replaceCount:从开始内容到当前页的内容 * 的个数
|
||||
matchArray : img标签的匹配的内容
|
||||
*/
|
||||
function replaceStr(currentArray,replaceCount,matchArray)
|
||||
{
|
||||
var result = "";
|
||||
for(var i=currentArray.length -1,j = replaceCount-1 ;i>=1; i--)
|
||||
{
|
||||
|
||||
var temp = (matchArray[j] + currentArray[i]);
|
||||
|
||||
result = temp + result;
|
||||
|
||||
j--;
|
||||
}
|
||||
|
||||
result = currentArray[0] + result ;
|
||||
|
||||
return result;
|
||||
}
|
||||
|
||||
DHTMLpagenation(s,Length);
|
||||
|
||||
/**
|
||||
* 初始化
|
||||
*/
|
||||
window.onload = function () {
|
||||
initWaterMark();
|
||||
}
|
||||
</script>
|
||||
<#else/>
|
||||
<div class="container">
|
||||
<div class="panel panel-default">
|
||||
<div class="panel-heading">
|
||||
<h4 class="panel-title">
|
||||
<a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">
|
||||
${file.name}
|
||||
</a>
|
||||
</h4>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<div id="text"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
|
||||
/**
|
||||
*加载普通文本
|
||||
*/
|
||||
function loadText() {
|
||||
var base64data = $("#textData").val()
|
||||
var textData = Base64.decode(base64data);
|
||||
var textPreData = "<xmp style='background-color: #FFFFFF;overflow-y: scroll;border:none'>" + textData + "</xmp>";
|
||||
$("#text").append(textPreData);
|
||||
}
|
||||
/**
|
||||
* 初始化
|
||||
*/
|
||||
window.onload = function () {
|
||||
initWaterMark();
|
||||
loadText();
|
||||
}
|
||||
</script>
|
||||
</#if>
|
||||
</body>
|
||||
</html>
|
||||
54
tool-tech-file-view/src/main/resources/web/xmind.ftl
Normal file
54
tool-tech-file-view/src/main/resources/web/xmind.ftl
Normal file
@@ -0,0 +1,54 @@
|
||||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>${file.name}文件预览</title>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
|
||||
<#include "*/commonHeader.ftl">
|
||||
<script src="js/base64.min.js" type="text/javascript"></script>
|
||||
<#if currentUrl?contains("http://") || currentUrl?contains("https://")>
|
||||
<#assign finalUrl="${currentUrl}">
|
||||
<#elseif currentUrl?contains("ftp://") >
|
||||
<#assign finalUrl="${currentUrl}">
|
||||
<#else>
|
||||
<#assign finalUrl="${baseUrl}${currentUrl}">
|
||||
</#if>
|
||||
</head>
|
||||
<body>
|
||||
<div id="mount">
|
||||
</div>
|
||||
|
||||
<script src="xmind/xmind.js"></script>
|
||||
<script type="text/javascript">
|
||||
var url = '${finalUrl}';
|
||||
var baseUrl = '${baseUrl}'.endsWith('/') ? '${baseUrl}' : '${baseUrl}' + '/';
|
||||
if (!url.startsWith(baseUrl)) {
|
||||
url = baseUrl + 'getCorsFile?urlPath=' + encodeURIComponent(Base64.encode(url));
|
||||
}
|
||||
const init = async () => {
|
||||
var windowWidth = document.documentElement.clientWidth || document.body.clientWidth;
|
||||
var windowHeight = document.documentElement.clientHeight || document.body.clientHeight;
|
||||
windowWidth = windowWidth-30;
|
||||
windowHeight = windowHeight-30;
|
||||
windowWidth =windowWidth+"px";
|
||||
windowHeight =windowHeight+"px";
|
||||
const res = await fetch(url)
|
||||
const viewer = new XMindEmbedViewer({
|
||||
el: '#mount',
|
||||
file: await res.arrayBuffer(),
|
||||
styles: {
|
||||
'height': windowHeight,
|
||||
'width': windowWidth
|
||||
}
|
||||
})
|
||||
}
|
||||
init()
|
||||
/*初始化水印*/
|
||||
if (!!window.ActiveXObject || "ActiveXObject" in window)
|
||||
{
|
||||
}else{
|
||||
initWaterMark();
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
93
tool-tech-file-view/src/main/resources/web/xml.ftl
Normal file
93
tool-tech-file-view/src/main/resources/web/xml.ftl
Normal file
@@ -0,0 +1,93 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8"/>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=yes, initial-scale=1.0">
|
||||
<title>xml文本预览</title>
|
||||
<#include "*/commonHeader.ftl">
|
||||
<script src="js/jquery-3.6.1.min.js" type="text/javascript"></script>
|
||||
<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css"/>
|
||||
<script src="bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
|
||||
<link rel="stylesheet" href="css/xmlTreeViewer.css"/>
|
||||
<script src="js/xmlTreeViewer.js" type="text/javascript"></script>
|
||||
<script src="js/base64.min.js" type="text/javascript"></script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<input hidden id="textData" value="${textData}"/>
|
||||
<div class="container">
|
||||
<div class="panel panel-default">
|
||||
<div id="xml_btn" class="panel-heading">
|
||||
<h4 class="panel-title">
|
||||
<a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">
|
||||
${file.name}
|
||||
</a>
|
||||
</h4>
|
||||
</div>
|
||||
<div id="text_btn" class="panel-heading">
|
||||
<h4 class="panel-title">
|
||||
<a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">
|
||||
${file.name}
|
||||
</a>
|
||||
</h4>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<div id="xml"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
/**
|
||||
* 初始化
|
||||
*/
|
||||
window.onload = function () {
|
||||
$("#xml_btn").hide()
|
||||
initWaterMark();
|
||||
loadXmlData()
|
||||
}
|
||||
|
||||
/**
|
||||
* 加载xml数据
|
||||
*/
|
||||
function htmlEscape(str){
|
||||
var s = "";
|
||||
if(str.length == 0) return "";
|
||||
s = str.replace(/&/g,"&");
|
||||
s = str.replace(/&amp;/g,"&");
|
||||
s = s.replace(/</g,"<");
|
||||
s = s.replace(/>/g,">");
|
||||
s = s.replace(/ /g," ");
|
||||
s = s.replace(/'/g,"\'");
|
||||
s = s.replace(/"/g,"\"");
|
||||
s = s.replace(/<script.*?>.*?<\/script>/ig, '');
|
||||
s = s.replace(/<script/gi, "<script ");
|
||||
s = s.replace(/<iframe/gi, "<iframe ");
|
||||
return s;
|
||||
}
|
||||
function loadXmlData() {
|
||||
var textData = Base64.decode($("#textData").val())
|
||||
textData = htmlEscape(textData);
|
||||
window.textPreData = "<xmp style='background-color: #FFFFFF;overflow-y: scroll;border:none'>" + textData + "</xmp>";
|
||||
var xmlNode = xmlTreeViewer.parseXML(textData);
|
||||
window.retNode = xmlTreeViewer.getXMLViewerNode(xmlNode.xml);
|
||||
$("#xml").html(window.retNode);
|
||||
}
|
||||
|
||||
$(function () {
|
||||
$("#xml_btn").click(function () {
|
||||
$("#xml").html(window.retNode);
|
||||
$("#text_btn").show()
|
||||
$("#xml_btn").hide()
|
||||
});
|
||||
|
||||
$("#text_btn").click(function () {
|
||||
$("#xml_btn").show()
|
||||
$("#text_btn").hide();
|
||||
$("#xml").html(window.textPreData);
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Reference in New Issue
Block a user