Skip to content

S
slm-fileview
Commit 12e12392 authored by kl's avatar kl Committed by kl
Browse files
Options

前端模板抽象出通用的header，将水印等初始化内容挪到通用header里

parent 7c963193
Hide whitespace changes
Inline Side-by-side
Showing with 108 additions and 372 deletions
server/src/main/resources/web/commonHeader.ftl 0 → 100644
View file @ 12e12392
<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css"/>
<script src="js/jquery-3.0.0.min.js" type="text/javascript"></script>
<script src="js/jquery.form.min.js" type="text/javascript"></script>
<script src="bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
<script src="js/watermark.js" type="text/javascript"></script>
<script src="js/base64.min.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>
server/src/main/resources/web/compress.ftl
View file @ 12e12392
......@@ -5,15 +5,8 @@
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, user-scalable=yes, initial-scale=1.0">
<link href="css/zTreeStyle.css" rel="stylesheet" type="text/css">
<#include "*/commonHeader.ftl">
<style type="text/css">
* {
margin: 0;
padding: 0;
}
html, body {
height: 100%;
width: 100%;
}
body {
background-color: #404040;
}
......@@ -32,10 +25,7 @@
<div class="zTreeDemoBackground left">
<ul id="treeDemo" class="ztree"></ul>
</div>
<script src="js/watermark.js" type="text/javascript"></script>
<script type="text/javascript" src="js/jquery-3.0.0.min.js"></script>
<script type="text/javascript" src="js/jquery.ztree.core.js"></script>
<script type="text/javascript" src="js/base64.min.js" ></script>
<script type="text/javascript">
const data = JSON.parse('${fileTree}');
......@@ -87,25 +77,7 @@
/*初始化水印*/
window.onload = function() {
var 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},
});
}
initWaterMark();
}
/**
......
server/src/main/resources/web/fileNotSupported.ftl
View file @ 12e12392
......@@ -32,7 +32,7 @@
<div class="container">
<img src="images/sorry.jpg" />
<span>
该文件类型(${fileType})系统暂时不支持在线预览，<b>说明</b>：
该文件类型(${file.suffix})系统暂时不支持在线预览，<b>说明</b>：
<p style="color: red;">${msg}</p>
有任何疑问，请加&nbsp;<a href="https://jq.qq.com/?_wv=1027&k=5c0UAtu">官方QQ群：613025121</a>&nbsp;咨询
</span>
......
server/src/main/resources/web/flv.ftl
View file @ 12e12392
......@@ -3,18 +3,10 @@
<head>
<meta charset="utf-8" />
<title>多媒体文件预览</title>
<script src="js/flv.min.js"type="text/javascript"></script>
<script src="js/watermark.js" type="text/javascript"></script>
<script src="js/flv.min.js" type="text/javascript"></script>
<#include "*/commonHeader.ftl">
</head>
<style>
* {
margin: 0;
padding: 0;
}
html, body {
height: 100%;
width: 100%;
}
body {
background-color: #404040;
}
......@@ -40,25 +32,7 @@
}
/*初始化水印*/
window.onload = function() {
var 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},
});
}
initWaterMark();
}
</script>
</body>
......
server/src/main/resources/web/html.ftl
View file @ 12e12392
......@@ -4,21 +4,11 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, user-scalable=yes, initial-scale=1.0">
<style type="text/css">
* {
margin: 0;
padding: 0;
}
html, body {
height: 100%;
width: 100%;
}
</style>
<#include "*/commonHeader.ftl">
</head>
<body>
<iframe src="${pdfUrl}" width="100%" frameborder="0"></iframe>
</body>
<script src="js/watermark.js" type="text/javascript"></script>
<script type="text/javascript">
document.getElementsByTagName('iframe')[0].height = document.documentElement.clientHeight-10;
/**
......@@ -30,25 +20,7 @@
}
/*初始化水印*/
window.onload = function() {
var 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},
});
}
initWaterMark();
}
</script>
</html>
\ No newline at end of file
server/src/main/resources/web/markdown.ftl
View file @ 12e12392
......@@ -3,7 +3,9 @@
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, user-scalable=yes, initial-scale=1.0">
<title>普通文本预览</title>
<title>markdown文本预览</title>
<script src="js/marked.min.js" type="text/javascript"></script>
<#include "*/commonHeader.ftl">
</head>
<body>
<input hidden id="textData" value="${textData}"/>
......@@ -30,15 +32,6 @@
</div>
</div>
<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css"/>
<script src="js/jquery-3.0.0.min.js" type="text/javascript"></script>
<script src="js/jquery.form.min.js" type="text/javascript"></script>
<script src="bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
<script src="js/watermark.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>
<script>
/**
* 初始化
......@@ -49,32 +42,6 @@
loadMarkdown();
}
/**
* 初始化水印
*/
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},
});
}
}
/**
* 加载markdown
*/
......@@ -101,18 +68,6 @@
});
</script>
<style>
* {
margin: 0;
padding: 0;
}
html, body {
height: 100%;
width: 100%;
}
</style>
</body>
</html>
server/src/main/resources/web/media.ftl
View file @ 12e12392
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8" />
<meta charset="utf-8"/>
<title>多媒体文件预览</title>
<link rel="stylesheet" href="plyr/plyr.css" />
<link rel="stylesheet" href="plyr/plyr.css"/>
<script type="text/javascript" src="plyr/plyr.js"></script>
<script type="text/javascript" src="js/watermark.js"></script>
<#include "*/commonHeader.ftl">
<style>
* {
margin: 0;
padding: 0;
}
html, body {
height: 100%;
width: 100%;
}
body {
background-color: #404040;
}
.m {
width: 1024px;
margin: 0 auto;
......@@ -27,31 +20,13 @@
<body>
<div class="m">
<video>
<source src="${mediaUrl}" />
<source src="${mediaUrl}"/>
</video>
</div>
<script>
plyr.setup();
window.onload = function() {
var 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},
});
}
window.onload = function () {
initWaterMark();
}
</script>
</body>
......
server/src/main/resources/web/officePicture.ftl
View file @ 12e12392
......@@ -4,15 +4,8 @@
<meta charset="utf-8" />
<title>PDF图片预览</title>
<script src="js/lazyload.js"></script>
<#include "*/commonHeader.ftl">
<style>
* {
margin: 0;
padding: 0;
}
html, body {
height: 100%;
width: 100%;
}
body {
background-color: #404040;
}
......@@ -37,29 +30,10 @@
<#if "false" == switchDisabled>
<img src="images/pdf.svg" width="63" height="63" style="position: fixed; cursor: pointer; top: 40%; right: 48px; z-index: 999;" alt="使用PDF预览" title="使用PDF预览" onclick="changePreviewType('pdf')"/>
</#if>
<script src="js/watermark.js" type="text/javascript"></script>
<script>
window.onload = function () {
/*初始化水印*/
var 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},
});
}
initWaterMark();
checkImgs();
};
window.onscroll = throttle(checkImgs);
......
server/src/main/resources/web/pdf.ftl
View file @ 12e12392
......@@ -2,41 +2,33 @@
<html lang="en">
<head>
<meta charset="utf-8" />
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, user-scalable=yes, initial-scale=1.0">
<title>PDF预览</title>
<style type="text/css">
* {
margin: 0;
padding: 0;
}
html, body {
height: 100%;
width: 100%;
}
</style>
<#include "*/commonHeader.ftl">
</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="63" height="63" style="position: fixed; cursor: pointer; top: 40%; right: 48px; z-index: 999;" alt="使用图片预览" title="使用图片预览" onclick="goForImage()"/>
</#if>
<#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="63" height="63"
style="position: fixed; cursor: pointer; top: 40%; right: 48px; z-index: 999;" alt="使用图片预览" title="使用图片预览"
onclick="goForImage()"/>
</#if>
</body>
<script src="js/watermark.js" type="text/javascript"></script>
<script type="text/javascript">
document.getElementsByTagName('iframe')[0].src = "${baseUrl}pdfjs/web/viewer.html?base=${baseUrl}&file="+encodeURIComponent('${finalUrl}')+"&disabledownload=${pdfDownloadDisable}";
document.getElementsByTagName('iframe')[0].height = document.documentElement.clientHeight-10;
document.getElementsByTagName('iframe')[0].src = "${baseUrl}pdfjs/web/viewer.html?base=${baseUrl}&file=" + encodeURIComponent('${finalUrl}') + "&disabledownload=${pdfDownloadDisable}";
document.getElementsByTagName('iframe')[0].height = document.documentElement.clientHeight - 10;
/**
* 页面变化调整高度
*/
window.onresize = function(){
window.onresize = function () {
var fm = document.getElementsByTagName("iframe")[0];
fm.height = window.document.documentElement.clientHeight-10;
fm.height = window.document.documentElement.clientHeight - 10;
}
function goForImage() {
......@@ -46,29 +38,12 @@
} else {
url = url + "&officePreviewType=image";
}
window.location.href=url;
window.location.href = url;
}
/*初始化水印*/
window.onload = function() {
var 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},
});
}
window.onload = function () {
initWaterMark();
}
</script>
</html>
\ No newline at end of file
server/src/main/resources/web/picture.ftl
View file @ 12e12392
......@@ -4,25 +4,20 @@
<meta charset="utf-8" />
<title>图片预览</title>
<link rel="stylesheet" href="css/viewer.min.css">
<script src="js/viewer.min.js"></script>
<#include "*/commonHeader.ftl">
<style>
* {
margin: 0;
padding: 0;
}
html, body {
height: 100%;
width: 100%;
}
body {
background-color: #404040;
}
#dowebok { width: 800px; margin: 0 auto; font-size: 0;}
#dowebok li { display: inline-block;width: 50px;height: 50px; margin-left: 1%; padding-top: 1%;}
#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="dowebok">
<ul id="image">
<#list imgUrls as img>
<#if img?contains("http://") || img?contains("https://")>
<#assign img="${img}">
......@@ -32,11 +27,9 @@
<li><img id="${img}" url="${img}" src="${img}" width="1px" height="1px"></li>
</#list>
</ul>
<script src="js/jquery-3.0.0.min.js"></script>
<script src="js/viewer.min.js"></script>
<script src="js/watermark.js" type="text/javascript"></script>
<script>
var viewer = new Viewer(document.getElementById('dowebok'), {
var viewer = new Viewer(document.getElementById('image'), {
url: 'src',
navbar: false,
button: false,
......@@ -80,25 +73,7 @@
});
/*初始化水印*/
window.onload = function() {
var 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},
});
}
initWaterMark();
}
</script>
</body>
......
server/src/main/resources/web/txt.ftl
View file @ 12e12392
......@@ -4,8 +4,10 @@
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, user-scalable=yes, initial-scale=1.0">
<title>普通文本预览</title>
<#include "*/commonHeader.ftl">
</head>
<body>
<input hidden id="textData" value="${textData}"/>
<div class="container">
......@@ -23,13 +25,6 @@
</div>
</div>
<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css"/>
<script src="js/jquery-3.0.0.min.js" type="text/javascript"></script>
<script src="js/jquery.form.min.js" type="text/javascript"></script>
<script src="bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
<script src="js/watermark.js" type="text/javascript"></script>
<script src="js/base64.min.js" type="text/javascript"></script>
<script>
/**
......@@ -40,31 +35,6 @@
loadText();
}
/**
* 初始化水印
*/
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},
});
}
}
/**
*加载普通文本
*/
......@@ -76,18 +46,7 @@
}
</script>
<style>
* {
margin: 0;
padding: 0;
}
html, body {
height: 100%;
width: 100%;
}
</style>
</body>
</html>
server/src/main/resources/web/xml.ftl
View file @ 12e12392
......@@ -3,9 +3,13 @@
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, user-scalable=yes, initial-scale=1.0">
<title>普通文本预览</title>
<title>xml文本预览</title>
<#include "*/commonHeader.ftl">
<link rel="stylesheet" href="css/xmlTreeViewer.css"/>
<script src="js/xmlTreeViewer.js" type="text/javascript"></script>
</head>
<body>
<input hidden id="textData" value="${textData}"/>
<div class="container">
<div class="panel panel-default">
......@@ -22,17 +26,6 @@
</div>
</div>
<link rel="stylesheet" href="css/xmlTreeViewer.css"/>
<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css"/>
<script src="js/jquery-3.0.0.min.js" type="text/javascript"></script>
<script src="js/jquery.form.min.js" type="text/javascript"></script>
<script src="bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
<script src="js/watermark.js" type="text/javascript"></script>
<script src="js/marked.min.js" type="text/javascript"></script>
<script src="js/xmlTreeViewer.js" type="text/javascript"></script>
<script src="js/base64.min.js" type="text/javascript"></script>
<script>
/**
* 初始化
......@@ -42,32 +35,6 @@
loadXmlData()
}
/**
* 初始化水印
*/
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},
});
}
}
/**
* 加载xml数据
*/
......@@ -76,22 +43,9 @@
var xmlNode = xmlTreeViewer.parseXML(textData);
var retNode = xmlTreeViewer.getXMLViewerNode(xmlNode.xml);
$("#xml").html(retNode);
}
</script>
<style>
* {
margin: 0;
padding: 0;
}
html, body {
height: 100%;
width: 100%;
}
</style>
</body>
</html>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment