feat: 上传文件
This commit is contained in:
cgd_mac
parent
2d7bc82ad3
commit
2c0d1ce1c8
|
|
@ -1,187 +1,187 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="zh-cmn-Hans">
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
||||
<link rel="icon" href="<%= BASE_URL %>logo.png">
|
||||
<title>安全培训平台管理系统</title>
|
||||
<style>
|
||||
.first-loading-wrp {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
min-height: 420px;
|
||||
height: 100%
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
||||
<link rel="icon" href="<%= BASE_URL %>logo.png">
|
||||
<title>安全培训平台管理系统</title>
|
||||
<style>
|
||||
.first-loading-wrp {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
min-height: 420px;
|
||||
height: 100%
|
||||
}
|
||||
|
||||
.first-loading-wrp>h1 {
|
||||
font-size: 128px
|
||||
}
|
||||
|
||||
.first-loading-wrp .loading-wrp {
|
||||
padding: 98px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center
|
||||
}
|
||||
|
||||
.dot {
|
||||
animation: antRotate 1.2s infinite linear;
|
||||
transform: rotate(45deg);
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
font-size: 32px;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
box-sizing: border-box
|
||||
}
|
||||
|
||||
.dot i {
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
position: absolute;
|
||||
display: block;
|
||||
background-color: #1890ff;
|
||||
border-radius: 100%;
|
||||
transform: scale(.75);
|
||||
transform-origin: 50% 50%;
|
||||
opacity: .3;
|
||||
animation: antSpinMove 1s infinite linear alternate
|
||||
}
|
||||
|
||||
.dot i:nth-child(1) {
|
||||
top: 0;
|
||||
left: 0
|
||||
}
|
||||
|
||||
.dot i:nth-child(2) {
|
||||
top: 0;
|
||||
right: 0;
|
||||
-webkit-animation-delay: .4s;
|
||||
animation-delay: .4s
|
||||
}
|
||||
|
||||
.dot i:nth-child(3) {
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
-webkit-animation-delay: .8s;
|
||||
animation-delay: .8s
|
||||
}
|
||||
|
||||
.dot i:nth-child(4) {
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
-webkit-animation-delay: 1.2s;
|
||||
animation-delay: 1.2s
|
||||
}
|
||||
|
||||
@keyframes antRotate {
|
||||
to {
|
||||
-webkit-transform: rotate(405deg);
|
||||
transform: rotate(405deg)
|
||||
}
|
||||
}
|
||||
|
||||
.first-loading-wrp>h1 {
|
||||
font-size: 128px
|
||||
@-webkit-keyframes antRotate {
|
||||
to {
|
||||
-webkit-transform: rotate(405deg);
|
||||
transform: rotate(405deg)
|
||||
}
|
||||
}
|
||||
|
||||
.first-loading-wrp .loading-wrp {
|
||||
padding: 98px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center
|
||||
@keyframes antSpinMove {
|
||||
to {
|
||||
opacity: 1
|
||||
}
|
||||
}
|
||||
|
||||
.dot {
|
||||
animation: antRotate 1.2s infinite linear;
|
||||
transform: rotate(45deg);
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
font-size: 32px;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
box-sizing: border-box
|
||||
@-webkit-keyframes antSpinMove {
|
||||
to {
|
||||
opacity: 1
|
||||
}
|
||||
}
|
||||
|
||||
.dot i {
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
position: absolute;
|
||||
display: block;
|
||||
background-color: #1890ff;
|
||||
border-radius: 100%;
|
||||
transform: scale(.75);
|
||||
transform-origin: 50% 50%;
|
||||
opacity: .3;
|
||||
animation: antSpinMove 1s infinite linear alternate
|
||||
}
|
||||
/* 组织机构数选择组件样式修改 start */
|
||||
.popover-tree>.ant-popover-content {
|
||||
margin-top: -15px;
|
||||
border: 1px solid #1890ff;
|
||||
max-height: 400px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.dot i:nth-child(1) {
|
||||
top: 0;
|
||||
left: 0
|
||||
}
|
||||
.popover-tree>.ant-popover-content>.ant-popover-arrow {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.dot i:nth-child(2) {
|
||||
top: 0;
|
||||
right: 0;
|
||||
-webkit-animation-delay: .4s;
|
||||
animation-delay: .4s
|
||||
}
|
||||
/* 组织机构数选择组件样式修改 end */
|
||||
|
||||
.dot i:nth-child(3) {
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
-webkit-animation-delay: .8s;
|
||||
animation-delay: .8s
|
||||
}
|
||||
/* 项目管理 - 选择单位组件样式 start */
|
||||
.tree-transfer .ant-transfer-list-body-customize-wrapper {
|
||||
overflow-y: auto !important;
|
||||
height: 500px !important;
|
||||
}
|
||||
|
||||
.dot i:nth-child(4) {
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
-webkit-animation-delay: 1.2s;
|
||||
animation-delay: 1.2s
|
||||
}
|
||||
.tree-transfer .ant-transfer-list-content {
|
||||
height: 500px !important;
|
||||
}
|
||||
|
||||
@keyframes antRotate {
|
||||
to {
|
||||
-webkit-transform: rotate(405deg);
|
||||
transform: rotate(405deg)
|
||||
}
|
||||
}
|
||||
/* 项目管理 - 选择单位组件样式 end */
|
||||
|
||||
@-webkit-keyframes antRotate {
|
||||
to {
|
||||
-webkit-transform: rotate(405deg);
|
||||
transform: rotate(405deg)
|
||||
}
|
||||
}
|
||||
/* 修改菜单页面的边距 start */
|
||||
.ant-pro-basicLayout-content {
|
||||
margin: 15px !important;
|
||||
}
|
||||
|
||||
@keyframes antSpinMove {
|
||||
to {
|
||||
opacity: 1
|
||||
}
|
||||
}
|
||||
/* 修改菜单页面的边距 end */
|
||||
|
||||
@-webkit-keyframes antSpinMove {
|
||||
to {
|
||||
opacity: 1
|
||||
}
|
||||
}
|
||||
/* card 样式调整 start */
|
||||
.ant-card-head {
|
||||
min-height: auto !important;
|
||||
padding: 0 15px !important;
|
||||
}
|
||||
|
||||
/* 组织机构数选择组件样式修改 start */
|
||||
.popover-tree>.ant-popover-content {
|
||||
margin-top: -15px;
|
||||
border: 1px solid #1890ff;
|
||||
max-height: 400px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
.ant-card-head-title {
|
||||
padding: 10px 0 !important;
|
||||
}
|
||||
|
||||
.popover-tree>.ant-popover-content>.ant-popover-arrow {
|
||||
display: none;
|
||||
}
|
||||
.ant-card-extra {
|
||||
padding: 10px 0 !important;
|
||||
}
|
||||
|
||||
/* 组织机构数选择组件样式修改 end */
|
||||
.ant-card-body {
|
||||
padding: 15px !important;
|
||||
}
|
||||
|
||||
/* 项目管理 - 选择单位组件样式 start */
|
||||
.tree-transfer .ant-transfer-list-body-customize-wrapper {
|
||||
overflow-y: auto !important;
|
||||
height: 500px !important;
|
||||
}
|
||||
/* card 样式调整 end */
|
||||
</style>
|
||||
<!-- require cdn assets css -->
|
||||
<% for (var i in htmlWebpackPlugin.options.cdn && htmlWebpackPlugin.options.cdn.css) { %>
|
||||
<link rel="stylesheet" href="<%= htmlWebpackPlugin.options.cdn.css[i] %>" />
|
||||
<% } %>
|
||||
</head>
|
||||
|
||||
.tree-transfer .ant-transfer-list-content {
|
||||
height: 500px !important;
|
||||
}
|
||||
|
||||
/* 项目管理 - 选择单位组件样式 end */
|
||||
|
||||
/* 修改菜单页面的边距 start */
|
||||
.ant-pro-basicLayout-content {
|
||||
margin: 15px !important;
|
||||
}
|
||||
|
||||
/* 修改菜单页面的边距 end */
|
||||
|
||||
/* card 样式调整 start */
|
||||
.ant-card-head {
|
||||
min-height: auto !important;
|
||||
padding: 0 15px !important;
|
||||
}
|
||||
|
||||
.ant-card-head-title {
|
||||
padding: 10px 0 !important;
|
||||
}
|
||||
|
||||
.ant-card-extra {
|
||||
padding: 10px 0 !important;
|
||||
}
|
||||
|
||||
.ant-card-body {
|
||||
padding: 15px !important;
|
||||
}
|
||||
|
||||
/* card 样式调整 end */
|
||||
</style>
|
||||
<!-- require cdn assets css -->
|
||||
<% for (var i in htmlWebpackPlugin.options.cdn && htmlWebpackPlugin.options.cdn.css) { %>
|
||||
<link rel="stylesheet" href="<%= htmlWebpackPlugin.options.cdn.css[i] %>" />
|
||||
<% } %>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<noscript>
|
||||
<strong>We're sorry but vue-antd-pro doesn't work properly without JavaScript enabled. Please enable it to
|
||||
continue.</strong>
|
||||
</noscript>
|
||||
<div id="app">
|
||||
<div class="first-loading-wrp">
|
||||
<!-- <h1>Pro</h1> -->
|
||||
<div class="loading-wrp">
|
||||
<span class="dot dot-spin"><i></i><i></i><i></i><i></i></span>
|
||||
</div>
|
||||
<!-- <div style="display: flex; justify-content: center; align-items: center;">Ant Design</div> -->
|
||||
<body>
|
||||
<noscript>
|
||||
<strong>We're sorry but vue-antd-pro doesn't work properly without JavaScript enabled. Please enable it to
|
||||
continue.</strong>
|
||||
</noscript>
|
||||
<div id="app">
|
||||
<div class="first-loading-wrp">
|
||||
<!-- <h1>Pro</h1> -->
|
||||
<div class="loading-wrp">
|
||||
<span class="dot dot-spin"><i></i><i></i><i></i><i></i></span>
|
||||
</div>
|
||||
<!-- <div style="display: flex; justify-content: center; align-items: center;">Ant Design</div> -->
|
||||
</div>
|
||||
<!-- require cdn assets js -->
|
||||
<% for (var i in htmlWebpackPlugin.options.cdn && htmlWebpackPlugin.options.cdn.js) { %>
|
||||
<script type="text/javascript" src="<%= htmlWebpackPlugin.options.cdn.js[i] %>"></script>
|
||||
<% } %>
|
||||
<!-- built files will be auto injected -->
|
||||
</body>
|
||||
</div>
|
||||
<!-- require cdn assets js -->
|
||||
<% for (var i in htmlWebpackPlugin.options.cdn && htmlWebpackPlugin.options.cdn.js) { %>
|
||||
<script type="text/javascript" src="<%= htmlWebpackPlugin.options.cdn.js[i] %>"></script>
|
||||
<% } %>
|
||||
<!-- built files will be auto injected -->
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
|
@ -1,40 +1,40 @@
|
|||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
|
||||
"http://www.w3.org/TR/html4/loose.dtd">
|
||||
<html>
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<title></title>
|
||||
<style type="text/css">
|
||||
*{color: #838383;margin: 0;padding: 0}
|
||||
html,body {font-size: 12px;overflow: hidden; }
|
||||
.content{padding:5px 0 0 15px;}
|
||||
input{width:210px;height:21px;line-height:21px;margin-left: 4px;}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="content">
|
||||
<span><var id="lang_input_anchorName"></var></span><input id="anchorName" value="" />
|
||||
</div>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
<script type="text/javascript">
|
||||
var anchorInput = $G('anchorName'),
|
||||
node = editor.selection.getRange().getClosedNode();
|
||||
if(node && node.tagName == 'IMG' && (node = node.getAttribute('anchorname'))){
|
||||
anchorInput.value = node;
|
||||
}
|
||||
anchorInput.onkeydown = function(evt){
|
||||
evt = evt || window.event;
|
||||
if(evt.keyCode == 13){
|
||||
editor.execCommand('anchor', anchorInput.value);
|
||||
dialog.close();
|
||||
domUtils.preventDefault(evt)
|
||||
}
|
||||
};
|
||||
dialog.onok = function (){
|
||||
editor.execCommand('anchor', anchorInput.value);
|
||||
dialog.close();
|
||||
};
|
||||
$focus(anchorInput);
|
||||
</script>
|
||||
</body>
|
||||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
|
||||
"http://www.w3.org/TR/html4/loose.dtd">
|
||||
<html>
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<title></title>
|
||||
<style type="text/css">
|
||||
*{color: #838383;margin: 0;padding: 0}
|
||||
html,body {font-size: 12px;overflow: hidden; }
|
||||
.content{padding:5px 0 0 15px;}
|
||||
input{width:210px;height:21px;line-height:21px;margin-left: 4px;}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="content">
|
||||
<span><var id="lang_input_anchorName"></var></span><input id="anchorName" value="" />
|
||||
</div>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
<script type="text/javascript">
|
||||
var anchorInput = $G('anchorName'),
|
||||
node = editor.selection.getRange().getClosedNode();
|
||||
if(node && node.tagName == 'IMG' && (node = node.getAttribute('anchorname'))){
|
||||
anchorInput.value = node;
|
||||
}
|
||||
anchorInput.onkeydown = function(evt){
|
||||
evt = evt || window.event;
|
||||
if(evt.keyCode == 13){
|
||||
editor.execCommand('anchor', anchorInput.value);
|
||||
dialog.close();
|
||||
domUtils.preventDefault(evt)
|
||||
}
|
||||
};
|
||||
dialog.onok = function (){
|
||||
editor.execCommand('anchor', anchorInput.value);
|
||||
dialog.close();
|
||||
};
|
||||
$focus(anchorInput);
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
File diff suppressed because it is too large
Load Diff
|
|
@ -1,60 +1,60 @@
|
|||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>ueditor图片对话框</title>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
|
||||
<!-- jquery -->
|
||||
<script type="text/javascript" src="../../third-party/jquery-1.10.2.min.js"></script>
|
||||
|
||||
<!-- webuploader -->
|
||||
<script src="../../third-party/webuploader/webuploader.min.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="../../third-party/webuploader/webuploader.css">
|
||||
|
||||
<!-- attachment dialog -->
|
||||
<link rel="stylesheet" href="attachment.css" type="text/css" />
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="wrapper">
|
||||
<div id="tabhead" class="tabhead">
|
||||
<span class="tab focus" data-content-id="upload"><var id="lang_tab_upload"></var></span>
|
||||
<span class="tab" data-content-id="online"><var id="lang_tab_online"></var></span>
|
||||
</div>
|
||||
<div id="tabbody" class="tabbody">
|
||||
<!-- 上传图片 -->
|
||||
<div id="upload" class="panel focus">
|
||||
<div id="queueList" class="queueList">
|
||||
<div class="statusBar element-invisible">
|
||||
<div class="progress">
|
||||
<span class="text">0%</span>
|
||||
<span class="percentage"></span>
|
||||
</div><div class="info"></div>
|
||||
<div class="btns">
|
||||
<div id="filePickerBtn"></div>
|
||||
<div class="uploadBtn"><var id="lang_start_upload"></var></div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="dndArea" class="placeholder">
|
||||
<div class="filePickerContainer">
|
||||
<div id="filePickerReady"></div>
|
||||
</div>
|
||||
</div>
|
||||
<ul class="filelist element-invisible">
|
||||
<li id="filePickerBlock" class="filePickerBlock"></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 在线图片 -->
|
||||
<div id="online" class="panel">
|
||||
<div id="fileList"><var id="lang_imgLoading"></var></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/javascript" src="attachment.js"></script>
|
||||
|
||||
</body>
|
||||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>ueditor图片对话框</title>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
|
||||
<!-- jquery -->
|
||||
<script type="text/javascript" src="../../third-party/jquery-1.10.2.min.js"></script>
|
||||
|
||||
<!-- webuploader -->
|
||||
<script src="../../third-party/webuploader/webuploader.min.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="../../third-party/webuploader/webuploader.css">
|
||||
|
||||
<!-- attachment dialog -->
|
||||
<link rel="stylesheet" href="attachment.css" type="text/css" />
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="wrapper">
|
||||
<div id="tabhead" class="tabhead">
|
||||
<span class="tab focus" data-content-id="upload"><var id="lang_tab_upload"></var></span>
|
||||
<span class="tab" data-content-id="online"><var id="lang_tab_online"></var></span>
|
||||
</div>
|
||||
<div id="tabbody" class="tabbody">
|
||||
<!-- 上传图片 -->
|
||||
<div id="upload" class="panel focus">
|
||||
<div id="queueList" class="queueList">
|
||||
<div class="statusBar element-invisible">
|
||||
<div class="progress">
|
||||
<span class="text">0%</span>
|
||||
<span class="percentage"></span>
|
||||
</div><div class="info"></div>
|
||||
<div class="btns">
|
||||
<div id="filePickerBtn"></div>
|
||||
<div class="uploadBtn"><var id="lang_start_upload"></var></div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="dndArea" class="placeholder">
|
||||
<div class="filePickerContainer">
|
||||
<div id="filePickerReady"></div>
|
||||
</div>
|
||||
</div>
|
||||
<ul class="filelist element-invisible">
|
||||
<li id="filePickerBlock" class="filePickerBlock"></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 在线图片 -->
|
||||
<div id="online" class="panel">
|
||||
<div id="fileList"><var id="lang_imgLoading"></var></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/javascript" src="attachment.js"></script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,94 +1,94 @@
|
|||
.wrapper{ width: 424px;margin: 10px auto; zoom:1;position: relative}
|
||||
.tabbody{height:225px;}
|
||||
.tabbody .panel { position: absolute;width:100%; height:100%;background: #fff; display: none;}
|
||||
.tabbody .focus { display: block;}
|
||||
|
||||
body{font-size: 12px;color: #888;overflow: hidden;}
|
||||
input,label{vertical-align:middle}
|
||||
.clear{clear: both;}
|
||||
.pl{padding-left: 18px;padding-left: 23px\9;}
|
||||
|
||||
#imageList {width: 420px;height: 215px;margin-top: 10px;overflow: hidden;overflow-y: auto;}
|
||||
#imageList div {float: left;width: 100px;height: 95px;margin: 5px 10px;}
|
||||
#imageList img {cursor: pointer;border: 2px solid white;}
|
||||
|
||||
.bgarea{margin: 10px;padding: 5px;height: 84%;border: 1px solid #A8A297;}
|
||||
.content div{margin: 10px 0 10px 5px;}
|
||||
.content .iptradio{margin: 0px 5px 5px 0px;}
|
||||
.txt{width:280px;}
|
||||
|
||||
.wrapcolor{height: 19px;}
|
||||
div.color{float: left;margin: 0;}
|
||||
#colorPicker{width: 17px;height: 17px;border: 1px solid #CCC;display: inline-block;border-radius: 3px;box-shadow: 2px 2px 5px #D3D6DA;margin: 0;float: left;}
|
||||
div.alignment,#custom{margin-left: 23px;margin-left: 28px\9;}
|
||||
#custom input{height: 15px;min-height: 15px;width:20px;}
|
||||
#repeatType{width:100px;}
|
||||
|
||||
|
||||
/* 图片管理样式 */
|
||||
#imgManager {
|
||||
width: 100%;
|
||||
height: 225px;
|
||||
}
|
||||
#imgManager #imageList{
|
||||
width: 100%;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
}
|
||||
#imgManager ul {
|
||||
display: block;
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
#imgManager li {
|
||||
float: left;
|
||||
display: block;
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
width: 113px;
|
||||
height: 113px;
|
||||
margin: 9px 0 0 19px;
|
||||
background-color: #eee;
|
||||
overflow: hidden;
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
}
|
||||
#imgManager li.clearFloat {
|
||||
float: none;
|
||||
clear: both;
|
||||
display: block;
|
||||
width:0;
|
||||
height:0;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
#imgManager li img {
|
||||
cursor: pointer;
|
||||
}
|
||||
#imgManager li .icon {
|
||||
cursor: pointer;
|
||||
width: 113px;
|
||||
height: 113px;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 2;
|
||||
border: 0;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
#imgManager li .icon:hover {
|
||||
width: 107px;
|
||||
height: 107px;
|
||||
border: 3px solid #1094fa;
|
||||
}
|
||||
#imgManager li.selected .icon {
|
||||
background-image: url(images/success.png);
|
||||
background-position: 75px 75px;
|
||||
}
|
||||
#imgManager li.selected .icon:hover {
|
||||
width: 107px;
|
||||
height: 107px;
|
||||
border: 3px solid #1094fa;
|
||||
background-position: 72px 72px;
|
||||
.wrapper{ width: 424px;margin: 10px auto; zoom:1;position: relative}
|
||||
.tabbody{height:225px;}
|
||||
.tabbody .panel { position: absolute;width:100%; height:100%;background: #fff; display: none;}
|
||||
.tabbody .focus { display: block;}
|
||||
|
||||
body{font-size: 12px;color: #888;overflow: hidden;}
|
||||
input,label{vertical-align:middle}
|
||||
.clear{clear: both;}
|
||||
.pl{padding-left: 18px;padding-left: 23px\9;}
|
||||
|
||||
#imageList {width: 420px;height: 215px;margin-top: 10px;overflow: hidden;overflow-y: auto;}
|
||||
#imageList div {float: left;width: 100px;height: 95px;margin: 5px 10px;}
|
||||
#imageList img {cursor: pointer;border: 2px solid white;}
|
||||
|
||||
.bgarea{margin: 10px;padding: 5px;height: 84%;border: 1px solid #A8A297;}
|
||||
.content div{margin: 10px 0 10px 5px;}
|
||||
.content .iptradio{margin: 0px 5px 5px 0px;}
|
||||
.txt{width:280px;}
|
||||
|
||||
.wrapcolor{height: 19px;}
|
||||
div.color{float: left;margin: 0;}
|
||||
#colorPicker{width: 17px;height: 17px;border: 1px solid #CCC;display: inline-block;border-radius: 3px;box-shadow: 2px 2px 5px #D3D6DA;margin: 0;float: left;}
|
||||
div.alignment,#custom{margin-left: 23px;margin-left: 28px\9;}
|
||||
#custom input{height: 15px;min-height: 15px;width:20px;}
|
||||
#repeatType{width:100px;}
|
||||
|
||||
|
||||
/* 图片管理样式 */
|
||||
#imgManager {
|
||||
width: 100%;
|
||||
height: 225px;
|
||||
}
|
||||
#imgManager #imageList{
|
||||
width: 100%;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
}
|
||||
#imgManager ul {
|
||||
display: block;
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
#imgManager li {
|
||||
float: left;
|
||||
display: block;
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
width: 113px;
|
||||
height: 113px;
|
||||
margin: 9px 0 0 19px;
|
||||
background-color: #eee;
|
||||
overflow: hidden;
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
}
|
||||
#imgManager li.clearFloat {
|
||||
float: none;
|
||||
clear: both;
|
||||
display: block;
|
||||
width:0;
|
||||
height:0;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
#imgManager li img {
|
||||
cursor: pointer;
|
||||
}
|
||||
#imgManager li .icon {
|
||||
cursor: pointer;
|
||||
width: 113px;
|
||||
height: 113px;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 2;
|
||||
border: 0;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
#imgManager li .icon:hover {
|
||||
width: 107px;
|
||||
height: 107px;
|
||||
border: 3px solid #1094fa;
|
||||
}
|
||||
#imgManager li.selected .icon {
|
||||
background-image: url(images/success.png);
|
||||
background-position: 75px 75px;
|
||||
}
|
||||
#imgManager li.selected .icon:hover {
|
||||
width: 107px;
|
||||
height: 107px;
|
||||
border: 3px solid #1094fa;
|
||||
background-position: 72px 72px;
|
||||
}
|
||||
|
|
@ -1,56 +1,56 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="background.css">
|
||||
</head>
|
||||
<body>
|
||||
<div id="bg_container" class="wrapper">
|
||||
<div id="tabHeads" class="tabhead">
|
||||
<span class="focus" data-content-id="normal"><var id="lang_background_normal"></var></span>
|
||||
<span class="" data-content-id="imgManager"><var id="lang_background_local"></var></span>
|
||||
</div>
|
||||
<div id="tabBodys" class="tabbody">
|
||||
<div id="normal" class="panel focus">
|
||||
<fieldset class="bgarea">
|
||||
<legend><var id="lang_background_set"></var></legend>
|
||||
<div class="content">
|
||||
<div>
|
||||
<label><input id="nocolorRadio" class="iptradio" type="radio" name="t" value="none" checked="checked"><var id="lang_background_none"></var></label>
|
||||
<label><input id="coloredRadio" class="iptradio" type="radio" name="t" value="color"><var id="lang_background_colored"></var></label>
|
||||
</div>
|
||||
<div class="wrapcolor pl">
|
||||
<div class="color">
|
||||
<var id="lang_background_color"></var>:
|
||||
</div>
|
||||
<div id="colorPicker"></div>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
<div class="wrapcolor pl">
|
||||
<label><var id="lang_background_netimg"></var>:</label><input class="txt" type="text" id="url">
|
||||
</div>
|
||||
<div id="alignment" class="alignment">
|
||||
<var id="lang_background_align"></var>:<select id="repeatType">
|
||||
<option value="center"></option>
|
||||
<option value="repeat-x"></option>
|
||||
<option value="repeat-y"></option>
|
||||
<option value="repeat"></option>
|
||||
<option value="self"></option>
|
||||
</select>
|
||||
</div>
|
||||
<div id="custom" >
|
||||
<var id="lang_background_position"></var>:x:<input type="text" size="1" id="x" maxlength="4" value="0">px y:<input type="text" size="1" id="y" maxlength="4" value="0">px
|
||||
</div>
|
||||
</div>
|
||||
</fieldset>
|
||||
|
||||
</div>
|
||||
<div id="imgManager" class="panel">
|
||||
<div id="imageList" style=""></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/javascript" src="background.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="background.css">
|
||||
</head>
|
||||
<body>
|
||||
<div id="bg_container" class="wrapper">
|
||||
<div id="tabHeads" class="tabhead">
|
||||
<span class="focus" data-content-id="normal"><var id="lang_background_normal"></var></span>
|
||||
<span class="" data-content-id="imgManager"><var id="lang_background_local"></var></span>
|
||||
</div>
|
||||
<div id="tabBodys" class="tabbody">
|
||||
<div id="normal" class="panel focus">
|
||||
<fieldset class="bgarea">
|
||||
<legend><var id="lang_background_set"></var></legend>
|
||||
<div class="content">
|
||||
<div>
|
||||
<label><input id="nocolorRadio" class="iptradio" type="radio" name="t" value="none" checked="checked"><var id="lang_background_none"></var></label>
|
||||
<label><input id="coloredRadio" class="iptradio" type="radio" name="t" value="color"><var id="lang_background_colored"></var></label>
|
||||
</div>
|
||||
<div class="wrapcolor pl">
|
||||
<div class="color">
|
||||
<var id="lang_background_color"></var>:
|
||||
</div>
|
||||
<div id="colorPicker"></div>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
<div class="wrapcolor pl">
|
||||
<label><var id="lang_background_netimg"></var>:</label><input class="txt" type="text" id="url">
|
||||
</div>
|
||||
<div id="alignment" class="alignment">
|
||||
<var id="lang_background_align"></var>:<select id="repeatType">
|
||||
<option value="center"></option>
|
||||
<option value="repeat-x"></option>
|
||||
<option value="repeat-y"></option>
|
||||
<option value="repeat"></option>
|
||||
<option value="self"></option>
|
||||
</select>
|
||||
</div>
|
||||
<div id="custom" >
|
||||
<var id="lang_background_position"></var>:x:<input type="text" size="1" id="x" maxlength="4" value="0">px y:<input type="text" size="1" id="y" maxlength="4" value="0">px
|
||||
</div>
|
||||
</div>
|
||||
</fieldset>
|
||||
|
||||
</div>
|
||||
<div id="imgManager" class="panel">
|
||||
<div id="imageList" style=""></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/javascript" src="background.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -1,376 +1,376 @@
|
|||
(function () {
|
||||
|
||||
var onlineImage,
|
||||
backupStyle = editor.queryCommandValue('background');
|
||||
|
||||
window.onload = function () {
|
||||
initTabs();
|
||||
initColorSelector();
|
||||
};
|
||||
|
||||
/* 初始化tab标签 */
|
||||
function initTabs(){
|
||||
var tabs = $G('tabHeads').children;
|
||||
for (var i = 0; i < tabs.length; i++) {
|
||||
domUtils.on(tabs[i], "click", function (e) {
|
||||
var target = e.target || e.srcElement;
|
||||
for (var j = 0; j < tabs.length; j++) {
|
||||
if(tabs[j] == target){
|
||||
tabs[j].className = "focus";
|
||||
var contentId = tabs[j].getAttribute('data-content-id');
|
||||
$G(contentId).style.display = "block";
|
||||
if(contentId == 'imgManager') {
|
||||
initImagePanel();
|
||||
}
|
||||
}else {
|
||||
tabs[j].className = "";
|
||||
$G(tabs[j].getAttribute('data-content-id')).style.display = "none";
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
/* 初始化颜色设置 */
|
||||
function initColorSelector () {
|
||||
var obj = editor.queryCommandValue('background');
|
||||
if (obj) {
|
||||
var color = obj['background-color'],
|
||||
repeat = obj['background-repeat'] || 'repeat',
|
||||
image = obj['background-image'] || '',
|
||||
position = obj['background-position'] || 'center center',
|
||||
pos = position.split(' '),
|
||||
x = parseInt(pos[0]) || 0,
|
||||
y = parseInt(pos[1]) || 0;
|
||||
|
||||
if(repeat == 'no-repeat' && (x || y)) repeat = 'self';
|
||||
|
||||
image = image.match(/url[\s]*\(([^\)]*)\)/);
|
||||
image = image ? image[1]:'';
|
||||
updateFormState('colored', color, image, repeat, x, y);
|
||||
} else {
|
||||
updateFormState();
|
||||
}
|
||||
|
||||
var updateHandler = function () {
|
||||
updateFormState();
|
||||
updateBackground();
|
||||
}
|
||||
domUtils.on($G('nocolorRadio'), 'click', updateBackground);
|
||||
domUtils.on($G('coloredRadio'), 'click', updateHandler);
|
||||
domUtils.on($G('url'), 'keyup', function(){
|
||||
if($G('url').value && $G('alignment').style.display == "none") {
|
||||
utils.each($G('repeatType').children, function(item){
|
||||
item.selected = ('repeat' == item.getAttribute('value') ? 'selected':false);
|
||||
});
|
||||
}
|
||||
updateHandler();
|
||||
});
|
||||
domUtils.on($G('repeatType'), 'change', updateHandler);
|
||||
domUtils.on($G('x'), 'keyup', updateBackground);
|
||||
domUtils.on($G('y'), 'keyup', updateBackground);
|
||||
|
||||
initColorPicker();
|
||||
}
|
||||
|
||||
/* 初始化颜色选择器 */
|
||||
function initColorPicker() {
|
||||
var me = editor,
|
||||
cp = $G("colorPicker");
|
||||
|
||||
/* 生成颜色选择器ui对象 */
|
||||
var popup = new UE.ui.Popup({
|
||||
content: new UE.ui.ColorPicker({
|
||||
noColorText: me.getLang("clearColor"),
|
||||
editor: me,
|
||||
onpickcolor: function (t, color) {
|
||||
updateFormState('colored', color);
|
||||
updateBackground();
|
||||
UE.ui.Popup.postHide();
|
||||
},
|
||||
onpicknocolor: function (t, color) {
|
||||
updateFormState('colored', 'transparent');
|
||||
updateBackground();
|
||||
UE.ui.Popup.postHide();
|
||||
}
|
||||
}),
|
||||
editor: me,
|
||||
onhide: function () {
|
||||
}
|
||||
});
|
||||
|
||||
/* 设置颜色选择器 */
|
||||
domUtils.on(cp, "click", function () {
|
||||
popup.showAnchor(this);
|
||||
});
|
||||
domUtils.on(document, 'mousedown', function (evt) {
|
||||
var el = evt.target || evt.srcElement;
|
||||
UE.ui.Popup.postHide(el);
|
||||
});
|
||||
domUtils.on(window, 'scroll', function () {
|
||||
UE.ui.Popup.postHide();
|
||||
});
|
||||
}
|
||||
|
||||
/* 初始化在线图片列表 */
|
||||
function initImagePanel() {
|
||||
onlineImage = onlineImage || new OnlineImage('imageList');
|
||||
}
|
||||
|
||||
/* 更新背景色设置面板 */
|
||||
function updateFormState (radio, color, url, align, x, y) {
|
||||
var nocolorRadio = $G('nocolorRadio'),
|
||||
coloredRadio = $G('coloredRadio');
|
||||
|
||||
if(radio) {
|
||||
nocolorRadio.checked = (radio == 'colored' ? false:'checked');
|
||||
coloredRadio.checked = (radio == 'colored' ? 'checked':false);
|
||||
}
|
||||
if(color) {
|
||||
domUtils.setStyle($G("colorPicker"), "background-color", color);
|
||||
}
|
||||
|
||||
if(url && /^\//.test(url)) {
|
||||
var a = document.createElement('a');
|
||||
a.href = url;
|
||||
browser.ie && (a.href = a.href);
|
||||
url = browser.ie ? a.href:(a.protocol + '//' + a.host + a.pathname + a.search + a.hash);
|
||||
}
|
||||
|
||||
if(url || url === '') {
|
||||
$G('url').value = url;
|
||||
}
|
||||
if(align) {
|
||||
utils.each($G('repeatType').children, function(item){
|
||||
item.selected = (align == item.getAttribute('value') ? 'selected':false);
|
||||
});
|
||||
}
|
||||
if(x || y) {
|
||||
$G('x').value = parseInt(x) || 0;
|
||||
$G('y').value = parseInt(y) || 0;
|
||||
}
|
||||
|
||||
$G('alignment').style.display = coloredRadio.checked && $G('url').value ? '':'none';
|
||||
$G('custom').style.display = coloredRadio.checked && $G('url').value && $G('repeatType').value == 'self' ? '':'none';
|
||||
}
|
||||
|
||||
/* 更新背景颜色 */
|
||||
function updateBackground () {
|
||||
if ($G('coloredRadio').checked) {
|
||||
var color = domUtils.getStyle($G("colorPicker"), "background-color"),
|
||||
bgimg = $G("url").value,
|
||||
align = $G("repeatType").value,
|
||||
backgroundObj = {
|
||||
"background-repeat": "no-repeat",
|
||||
"background-position": "center center"
|
||||
};
|
||||
|
||||
if (color) backgroundObj["background-color"] = color;
|
||||
if (bgimg) backgroundObj["background-image"] = 'url(' + bgimg + ')';
|
||||
if (align == 'self') {
|
||||
backgroundObj["background-position"] = $G("x").value + "px " + $G("y").value + "px";
|
||||
} else if (align == 'repeat-x' || align == 'repeat-y' || align == 'repeat') {
|
||||
backgroundObj["background-repeat"] = align;
|
||||
}
|
||||
|
||||
editor.execCommand('background', backgroundObj);
|
||||
} else {
|
||||
editor.execCommand('background', null);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* 在线图片 */
|
||||
function OnlineImage(target) {
|
||||
this.container = utils.isString(target) ? document.getElementById(target) : target;
|
||||
this.init();
|
||||
}
|
||||
OnlineImage.prototype = {
|
||||
init: function () {
|
||||
this.reset();
|
||||
this.initEvents();
|
||||
},
|
||||
/* 初始化容器 */
|
||||
initContainer: function () {
|
||||
this.container.innerHTML = '';
|
||||
this.list = document.createElement('ul');
|
||||
this.clearFloat = document.createElement('li');
|
||||
|
||||
domUtils.addClass(this.list, 'list');
|
||||
domUtils.addClass(this.clearFloat, 'clearFloat');
|
||||
|
||||
this.list.id = 'imageListUl';
|
||||
this.list.appendChild(this.clearFloat);
|
||||
this.container.appendChild(this.list);
|
||||
},
|
||||
/* 初始化滚动事件,滚动到地步自动拉取数据 */
|
||||
initEvents: function () {
|
||||
var _this = this;
|
||||
|
||||
/* 滚动拉取图片 */
|
||||
domUtils.on($G('imageList'), 'scroll', function(e){
|
||||
var panel = this;
|
||||
if (panel.scrollHeight - (panel.offsetHeight + panel.scrollTop) < 10) {
|
||||
_this.getImageData();
|
||||
}
|
||||
});
|
||||
/* 选中图片 */
|
||||
domUtils.on(this.container, 'click', function (e) {
|
||||
var target = e.target || e.srcElement,
|
||||
li = target.parentNode,
|
||||
nodes = $G('imageListUl').childNodes;
|
||||
|
||||
if (li.tagName.toLowerCase() == 'li') {
|
||||
updateFormState('nocolor', null, '');
|
||||
for (var i = 0, node; node = nodes[i++];) {
|
||||
if (node == li && !domUtils.hasClass(node, 'selected')) {
|
||||
domUtils.addClass(node, 'selected');
|
||||
updateFormState('colored', null, li.firstChild.getAttribute("_src"), 'repeat');
|
||||
} else {
|
||||
domUtils.removeClasses(node, 'selected');
|
||||
}
|
||||
}
|
||||
updateBackground();
|
||||
}
|
||||
});
|
||||
},
|
||||
/* 初始化第一次的数据 */
|
||||
initData: function () {
|
||||
|
||||
/* 拉取数据需要使用的值 */
|
||||
this.state = 0;
|
||||
this.listSize = editor.getOpt('imageManagerListSize');
|
||||
this.listIndex = 0;
|
||||
this.listEnd = false;
|
||||
|
||||
/* 第一次拉取数据 */
|
||||
this.getImageData();
|
||||
},
|
||||
/* 重置界面 */
|
||||
reset: function() {
|
||||
this.initContainer();
|
||||
this.initData();
|
||||
},
|
||||
/* 向后台拉取图片列表数据 */
|
||||
getImageData: function () {
|
||||
var _this = this;
|
||||
|
||||
if(!_this.listEnd && !this.isLoadingData) {
|
||||
this.isLoadingData = true;
|
||||
var url = editor.getActionUrl(editor.getOpt('imageManagerActionName')),
|
||||
isJsonp = utils.isCrossDomainUrl(url);
|
||||
ajax.request(url, {
|
||||
'timeout': 100000,
|
||||
'dataType': isJsonp ? 'jsonp':'',
|
||||
'data': utils.extend({
|
||||
start: this.listIndex,
|
||||
size: this.listSize
|
||||
}, editor.queryCommandValue('serverparam')),
|
||||
'method': 'get',
|
||||
'onsuccess': function (r) {
|
||||
try {
|
||||
var json = isJsonp ? r:eval('(' + r.responseText + ')');
|
||||
if (json.state == 'SUCCESS') {
|
||||
_this.pushData(json.list);
|
||||
_this.listIndex = parseInt(json.start) + parseInt(json.list.length);
|
||||
if(_this.listIndex >= json.total) {
|
||||
_this.listEnd = true;
|
||||
}
|
||||
_this.isLoadingData = false;
|
||||
}
|
||||
} catch (e) {
|
||||
if(r.responseText.indexOf('ue_separate_ue') != -1) {
|
||||
var list = r.responseText.split(r.responseText);
|
||||
_this.pushData(list);
|
||||
_this.listIndex = parseInt(list.length);
|
||||
_this.listEnd = true;
|
||||
_this.isLoadingData = false;
|
||||
}
|
||||
}
|
||||
},
|
||||
'onerror': function () {
|
||||
_this.isLoadingData = false;
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
/* 添加图片到列表界面上 */
|
||||
pushData: function (list) {
|
||||
var i, item, img, icon, _this = this,
|
||||
urlPrefix = editor.getOpt('imageManagerUrlPrefix');
|
||||
for (i = 0; i < list.length; i++) {
|
||||
if(list[i] && list[i].url) {
|
||||
item = document.createElement('li');
|
||||
img = document.createElement('img');
|
||||
icon = document.createElement('span');
|
||||
|
||||
domUtils.on(img, 'load', (function(image){
|
||||
return function(){
|
||||
_this.scale(image, image.parentNode.offsetWidth, image.parentNode.offsetHeight);
|
||||
}
|
||||
})(img));
|
||||
img.width = 113;
|
||||
img.setAttribute('src', urlPrefix + list[i].url + (list[i].url.indexOf('?') == -1 ? '?noCache=':'&noCache=') + (+new Date()).toString(36) );
|
||||
img.setAttribute('_src', urlPrefix + list[i].url);
|
||||
domUtils.addClass(icon, 'icon');
|
||||
|
||||
item.appendChild(img);
|
||||
item.appendChild(icon);
|
||||
this.list.insertBefore(item, this.clearFloat);
|
||||
}
|
||||
}
|
||||
},
|
||||
/* 改变图片大小 */
|
||||
scale: function (img, w, h, type) {
|
||||
var ow = img.width,
|
||||
oh = img.height;
|
||||
|
||||
if (type == 'justify') {
|
||||
if (ow >= oh) {
|
||||
img.width = w;
|
||||
img.height = h * oh / ow;
|
||||
img.style.marginLeft = '-' + parseInt((img.width - w) / 2) + 'px';
|
||||
} else {
|
||||
img.width = w * ow / oh;
|
||||
img.height = h;
|
||||
img.style.marginTop = '-' + parseInt((img.height - h) / 2) + 'px';
|
||||
}
|
||||
} else {
|
||||
if (ow >= oh) {
|
||||
img.width = w * ow / oh;
|
||||
img.height = h;
|
||||
img.style.marginLeft = '-' + parseInt((img.width - w) / 2) + 'px';
|
||||
} else {
|
||||
img.width = w;
|
||||
img.height = h * oh / ow;
|
||||
img.style.marginTop = '-' + parseInt((img.height - h) / 2) + 'px';
|
||||
}
|
||||
}
|
||||
},
|
||||
getInsertList: function () {
|
||||
var i, lis = this.list.children, list = [], align = getAlign();
|
||||
for (i = 0; i < lis.length; i++) {
|
||||
if (domUtils.hasClass(lis[i], 'selected')) {
|
||||
var img = lis[i].firstChild,
|
||||
src = img.getAttribute('_src');
|
||||
list.push({
|
||||
src: src,
|
||||
_src: src,
|
||||
floatStyle: align
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
return list;
|
||||
}
|
||||
};
|
||||
|
||||
dialog.onok = function () {
|
||||
updateBackground();
|
||||
editor.fireEvent('saveScene');
|
||||
};
|
||||
dialog.oncancel = function () {
|
||||
editor.execCommand('background', backupStyle);
|
||||
};
|
||||
|
||||
(function () {
|
||||
|
||||
var onlineImage,
|
||||
backupStyle = editor.queryCommandValue('background');
|
||||
|
||||
window.onload = function () {
|
||||
initTabs();
|
||||
initColorSelector();
|
||||
};
|
||||
|
||||
/* 初始化tab标签 */
|
||||
function initTabs(){
|
||||
var tabs = $G('tabHeads').children;
|
||||
for (var i = 0; i < tabs.length; i++) {
|
||||
domUtils.on(tabs[i], "click", function (e) {
|
||||
var target = e.target || e.srcElement;
|
||||
for (var j = 0; j < tabs.length; j++) {
|
||||
if(tabs[j] == target){
|
||||
tabs[j].className = "focus";
|
||||
var contentId = tabs[j].getAttribute('data-content-id');
|
||||
$G(contentId).style.display = "block";
|
||||
if(contentId == 'imgManager') {
|
||||
initImagePanel();
|
||||
}
|
||||
}else {
|
||||
tabs[j].className = "";
|
||||
$G(tabs[j].getAttribute('data-content-id')).style.display = "none";
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
/* 初始化颜色设置 */
|
||||
function initColorSelector () {
|
||||
var obj = editor.queryCommandValue('background');
|
||||
if (obj) {
|
||||
var color = obj['background-color'],
|
||||
repeat = obj['background-repeat'] || 'repeat',
|
||||
image = obj['background-image'] || '',
|
||||
position = obj['background-position'] || 'center center',
|
||||
pos = position.split(' '),
|
||||
x = parseInt(pos[0]) || 0,
|
||||
y = parseInt(pos[1]) || 0;
|
||||
|
||||
if(repeat == 'no-repeat' && (x || y)) repeat = 'self';
|
||||
|
||||
image = image.match(/url[\s]*\(([^\)]*)\)/);
|
||||
image = image ? image[1]:'';
|
||||
updateFormState('colored', color, image, repeat, x, y);
|
||||
} else {
|
||||
updateFormState();
|
||||
}
|
||||
|
||||
var updateHandler = function () {
|
||||
updateFormState();
|
||||
updateBackground();
|
||||
}
|
||||
domUtils.on($G('nocolorRadio'), 'click', updateBackground);
|
||||
domUtils.on($G('coloredRadio'), 'click', updateHandler);
|
||||
domUtils.on($G('url'), 'keyup', function(){
|
||||
if($G('url').value && $G('alignment').style.display == "none") {
|
||||
utils.each($G('repeatType').children, function(item){
|
||||
item.selected = ('repeat' == item.getAttribute('value') ? 'selected':false);
|
||||
});
|
||||
}
|
||||
updateHandler();
|
||||
});
|
||||
domUtils.on($G('repeatType'), 'change', updateHandler);
|
||||
domUtils.on($G('x'), 'keyup', updateBackground);
|
||||
domUtils.on($G('y'), 'keyup', updateBackground);
|
||||
|
||||
initColorPicker();
|
||||
}
|
||||
|
||||
/* 初始化颜色选择器 */
|
||||
function initColorPicker() {
|
||||
var me = editor,
|
||||
cp = $G("colorPicker");
|
||||
|
||||
/* 生成颜色选择器ui对象 */
|
||||
var popup = new UE.ui.Popup({
|
||||
content: new UE.ui.ColorPicker({
|
||||
noColorText: me.getLang("clearColor"),
|
||||
editor: me,
|
||||
onpickcolor: function (t, color) {
|
||||
updateFormState('colored', color);
|
||||
updateBackground();
|
||||
UE.ui.Popup.postHide();
|
||||
},
|
||||
onpicknocolor: function (t, color) {
|
||||
updateFormState('colored', 'transparent');
|
||||
updateBackground();
|
||||
UE.ui.Popup.postHide();
|
||||
}
|
||||
}),
|
||||
editor: me,
|
||||
onhide: function () {
|
||||
}
|
||||
});
|
||||
|
||||
/* 设置颜色选择器 */
|
||||
domUtils.on(cp, "click", function () {
|
||||
popup.showAnchor(this);
|
||||
});
|
||||
domUtils.on(document, 'mousedown', function (evt) {
|
||||
var el = evt.target || evt.srcElement;
|
||||
UE.ui.Popup.postHide(el);
|
||||
});
|
||||
domUtils.on(window, 'scroll', function () {
|
||||
UE.ui.Popup.postHide();
|
||||
});
|
||||
}
|
||||
|
||||
/* 初始化在线图片列表 */
|
||||
function initImagePanel() {
|
||||
onlineImage = onlineImage || new OnlineImage('imageList');
|
||||
}
|
||||
|
||||
/* 更新背景色设置面板 */
|
||||
function updateFormState (radio, color, url, align, x, y) {
|
||||
var nocolorRadio = $G('nocolorRadio'),
|
||||
coloredRadio = $G('coloredRadio');
|
||||
|
||||
if(radio) {
|
||||
nocolorRadio.checked = (radio == 'colored' ? false:'checked');
|
||||
coloredRadio.checked = (radio == 'colored' ? 'checked':false);
|
||||
}
|
||||
if(color) {
|
||||
domUtils.setStyle($G("colorPicker"), "background-color", color);
|
||||
}
|
||||
|
||||
if(url && /^\//.test(url)) {
|
||||
var a = document.createElement('a');
|
||||
a.href = url;
|
||||
browser.ie && (a.href = a.href);
|
||||
url = browser.ie ? a.href:(a.protocol + '//' + a.host + a.pathname + a.search + a.hash);
|
||||
}
|
||||
|
||||
if(url || url === '') {
|
||||
$G('url').value = url;
|
||||
}
|
||||
if(align) {
|
||||
utils.each($G('repeatType').children, function(item){
|
||||
item.selected = (align == item.getAttribute('value') ? 'selected':false);
|
||||
});
|
||||
}
|
||||
if(x || y) {
|
||||
$G('x').value = parseInt(x) || 0;
|
||||
$G('y').value = parseInt(y) || 0;
|
||||
}
|
||||
|
||||
$G('alignment').style.display = coloredRadio.checked && $G('url').value ? '':'none';
|
||||
$G('custom').style.display = coloredRadio.checked && $G('url').value && $G('repeatType').value == 'self' ? '':'none';
|
||||
}
|
||||
|
||||
/* 更新背景颜色 */
|
||||
function updateBackground () {
|
||||
if ($G('coloredRadio').checked) {
|
||||
var color = domUtils.getStyle($G("colorPicker"), "background-color"),
|
||||
bgimg = $G("url").value,
|
||||
align = $G("repeatType").value,
|
||||
backgroundObj = {
|
||||
"background-repeat": "no-repeat",
|
||||
"background-position": "center center"
|
||||
};
|
||||
|
||||
if (color) backgroundObj["background-color"] = color;
|
||||
if (bgimg) backgroundObj["background-image"] = 'url(' + bgimg + ')';
|
||||
if (align == 'self') {
|
||||
backgroundObj["background-position"] = $G("x").value + "px " + $G("y").value + "px";
|
||||
} else if (align == 'repeat-x' || align == 'repeat-y' || align == 'repeat') {
|
||||
backgroundObj["background-repeat"] = align;
|
||||
}
|
||||
|
||||
editor.execCommand('background', backgroundObj);
|
||||
} else {
|
||||
editor.execCommand('background', null);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* 在线图片 */
|
||||
function OnlineImage(target) {
|
||||
this.container = utils.isString(target) ? document.getElementById(target) : target;
|
||||
this.init();
|
||||
}
|
||||
OnlineImage.prototype = {
|
||||
init: function () {
|
||||
this.reset();
|
||||
this.initEvents();
|
||||
},
|
||||
/* 初始化容器 */
|
||||
initContainer: function () {
|
||||
this.container.innerHTML = '';
|
||||
this.list = document.createElement('ul');
|
||||
this.clearFloat = document.createElement('li');
|
||||
|
||||
domUtils.addClass(this.list, 'list');
|
||||
domUtils.addClass(this.clearFloat, 'clearFloat');
|
||||
|
||||
this.list.id = 'imageListUl';
|
||||
this.list.appendChild(this.clearFloat);
|
||||
this.container.appendChild(this.list);
|
||||
},
|
||||
/* 初始化滚动事件,滚动到地步自动拉取数据 */
|
||||
initEvents: function () {
|
||||
var _this = this;
|
||||
|
||||
/* 滚动拉取图片 */
|
||||
domUtils.on($G('imageList'), 'scroll', function(e){
|
||||
var panel = this;
|
||||
if (panel.scrollHeight - (panel.offsetHeight + panel.scrollTop) < 10) {
|
||||
_this.getImageData();
|
||||
}
|
||||
});
|
||||
/* 选中图片 */
|
||||
domUtils.on(this.container, 'click', function (e) {
|
||||
var target = e.target || e.srcElement,
|
||||
li = target.parentNode,
|
||||
nodes = $G('imageListUl').childNodes;
|
||||
|
||||
if (li.tagName.toLowerCase() == 'li') {
|
||||
updateFormState('nocolor', null, '');
|
||||
for (var i = 0, node; node = nodes[i++];) {
|
||||
if (node == li && !domUtils.hasClass(node, 'selected')) {
|
||||
domUtils.addClass(node, 'selected');
|
||||
updateFormState('colored', null, li.firstChild.getAttribute("_src"), 'repeat');
|
||||
} else {
|
||||
domUtils.removeClasses(node, 'selected');
|
||||
}
|
||||
}
|
||||
updateBackground();
|
||||
}
|
||||
});
|
||||
},
|
||||
/* 初始化第一次的数据 */
|
||||
initData: function () {
|
||||
|
||||
/* 拉取数据需要使用的值 */
|
||||
this.state = 0;
|
||||
this.listSize = editor.getOpt('imageManagerListSize');
|
||||
this.listIndex = 0;
|
||||
this.listEnd = false;
|
||||
|
||||
/* 第一次拉取数据 */
|
||||
this.getImageData();
|
||||
},
|
||||
/* 重置界面 */
|
||||
reset: function() {
|
||||
this.initContainer();
|
||||
this.initData();
|
||||
},
|
||||
/* 向后台拉取图片列表数据 */
|
||||
getImageData: function () {
|
||||
var _this = this;
|
||||
|
||||
if(!_this.listEnd && !this.isLoadingData) {
|
||||
this.isLoadingData = true;
|
||||
var url = editor.getActionUrl(editor.getOpt('imageManagerActionName')),
|
||||
isJsonp = utils.isCrossDomainUrl(url);
|
||||
ajax.request(url, {
|
||||
'timeout': 100000,
|
||||
'dataType': isJsonp ? 'jsonp':'',
|
||||
'data': utils.extend({
|
||||
start: this.listIndex,
|
||||
size: this.listSize
|
||||
}, editor.queryCommandValue('serverparam')),
|
||||
'method': 'get',
|
||||
'onsuccess': function (r) {
|
||||
try {
|
||||
var json = isJsonp ? r:eval('(' + r.responseText + ')');
|
||||
if (json.state == 'SUCCESS') {
|
||||
_this.pushData(json.list);
|
||||
_this.listIndex = parseInt(json.start) + parseInt(json.list.length);
|
||||
if(_this.listIndex >= json.total) {
|
||||
_this.listEnd = true;
|
||||
}
|
||||
_this.isLoadingData = false;
|
||||
}
|
||||
} catch (e) {
|
||||
if(r.responseText.indexOf('ue_separate_ue') != -1) {
|
||||
var list = r.responseText.split(r.responseText);
|
||||
_this.pushData(list);
|
||||
_this.listIndex = parseInt(list.length);
|
||||
_this.listEnd = true;
|
||||
_this.isLoadingData = false;
|
||||
}
|
||||
}
|
||||
},
|
||||
'onerror': function () {
|
||||
_this.isLoadingData = false;
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
/* 添加图片到列表界面上 */
|
||||
pushData: function (list) {
|
||||
var i, item, img, icon, _this = this,
|
||||
urlPrefix = editor.getOpt('imageManagerUrlPrefix');
|
||||
for (i = 0; i < list.length; i++) {
|
||||
if(list[i] && list[i].url) {
|
||||
item = document.createElement('li');
|
||||
img = document.createElement('img');
|
||||
icon = document.createElement('span');
|
||||
|
||||
domUtils.on(img, 'load', (function(image){
|
||||
return function(){
|
||||
_this.scale(image, image.parentNode.offsetWidth, image.parentNode.offsetHeight);
|
||||
}
|
||||
})(img));
|
||||
img.width = 113;
|
||||
img.setAttribute('src', urlPrefix + list[i].url + (list[i].url.indexOf('?') == -1 ? '?noCache=':'&noCache=') + (+new Date()).toString(36) );
|
||||
img.setAttribute('_src', urlPrefix + list[i].url);
|
||||
domUtils.addClass(icon, 'icon');
|
||||
|
||||
item.appendChild(img);
|
||||
item.appendChild(icon);
|
||||
this.list.insertBefore(item, this.clearFloat);
|
||||
}
|
||||
}
|
||||
},
|
||||
/* 改变图片大小 */
|
||||
scale: function (img, w, h, type) {
|
||||
var ow = img.width,
|
||||
oh = img.height;
|
||||
|
||||
if (type == 'justify') {
|
||||
if (ow >= oh) {
|
||||
img.width = w;
|
||||
img.height = h * oh / ow;
|
||||
img.style.marginLeft = '-' + parseInt((img.width - w) / 2) + 'px';
|
||||
} else {
|
||||
img.width = w * ow / oh;
|
||||
img.height = h;
|
||||
img.style.marginTop = '-' + parseInt((img.height - h) / 2) + 'px';
|
||||
}
|
||||
} else {
|
||||
if (ow >= oh) {
|
||||
img.width = w * ow / oh;
|
||||
img.height = h;
|
||||
img.style.marginLeft = '-' + parseInt((img.width - w) / 2) + 'px';
|
||||
} else {
|
||||
img.width = w;
|
||||
img.height = h * oh / ow;
|
||||
img.style.marginTop = '-' + parseInt((img.height - h) / 2) + 'px';
|
||||
}
|
||||
}
|
||||
},
|
||||
getInsertList: function () {
|
||||
var i, lis = this.list.children, list = [], align = getAlign();
|
||||
for (i = 0; i < lis.length; i++) {
|
||||
if (domUtils.hasClass(lis[i], 'selected')) {
|
||||
var img = lis[i].firstChild,
|
||||
src = img.getAttribute('_src');
|
||||
list.push({
|
||||
src: src,
|
||||
_src: src,
|
||||
floatStyle: align
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
return list;
|
||||
}
|
||||
};
|
||||
|
||||
dialog.onok = function () {
|
||||
updateBackground();
|
||||
editor.fireEvent('saveScene');
|
||||
};
|
||||
dialog.oncancel = function () {
|
||||
editor.execCommand('background', backupStyle);
|
||||
};
|
||||
|
||||
})();
|
||||
|
|
@ -1,89 +1,89 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>chart</title>
|
||||
<meta chartset="utf-8">
|
||||
<link rel="stylesheet" type="text/css" href="charts.css">
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="main">
|
||||
<div class="table-view">
|
||||
<h3><var id="lang_data_source"></var></h3>
|
||||
<div id="tableContainer" class="table-container"></div>
|
||||
<h3><var id="lang_chart_format"></var></h3>
|
||||
<form name="data-form">
|
||||
<div class="charts-format">
|
||||
<fieldset>
|
||||
<legend><var id="lang_data_align"></var></legend>
|
||||
<div class="format-item-container">
|
||||
<label>
|
||||
<input type="radio" class="format-ctrl not-pie-item" name="charts-format" value="1" checked="checked">
|
||||
<var id="lang_chart_align_same"></var>
|
||||
</label>
|
||||
<label>
|
||||
<input type="radio" class="format-ctrl not-pie-item" name="charts-format" value="-1">
|
||||
<var id="lang_chart_align_reverse"></var>
|
||||
</label>
|
||||
<br>
|
||||
</div>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend><var id="lang_chart_title"></var></legend>
|
||||
<div class="format-item-container">
|
||||
<label>
|
||||
<var id="lang_chart_main_title"></var><input type="text" name="title" class="data-item">
|
||||
</label>
|
||||
<label>
|
||||
<var id="lang_chart_sub_title"></var><input type="text" name="sub-title" class="data-item not-pie-item">
|
||||
</label>
|
||||
<label>
|
||||
<var id="lang_chart_x_title"></var><input type="text" name="x-title" class="data-item not-pie-item">
|
||||
</label>
|
||||
<label>
|
||||
<var id="lang_chart_y_title"></var><input type="text" name="y-title" class="data-item not-pie-item">
|
||||
</label>
|
||||
</div>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend><var id="lang_chart_tip"></var></legend>
|
||||
<div class="format-item-container">
|
||||
<label>
|
||||
<var id="lang_cahrt_tip_prefix"></var>
|
||||
<input type="text" id="tipInput" name="tip" class="data-item" disabled="disabled">
|
||||
</label>
|
||||
<p><var id="lang_cahrt_tip_description"></var></p>
|
||||
</div>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend><var id="lang_chart_data_unit"></var></legend>
|
||||
<div class="format-item-container">
|
||||
<label><var id="lang_chart_data_unit_title"></var><input type="text" name="unit" class="data-item"></label>
|
||||
<p><var id="lang_chart_data_unit_description"></var></p>
|
||||
</div>
|
||||
</fieldset>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="charts-view">
|
||||
<div id="chartsContainer" class="charts-container"></div>
|
||||
<div id="chartsType" class="charts-type">
|
||||
<h3><var id="lang_chart_type"></var></h3>
|
||||
<div class="scroll-view">
|
||||
<div class="scroll-container">
|
||||
<div id="scrollBed" class="scroll-bed"></div>
|
||||
</div>
|
||||
<div id="buttonContainer" class="button-container">
|
||||
<a href="#" data-title="prev"><var id="lang_prev_btn"></var></a>
|
||||
<a href="#" data-title="next"><var id="lang_next_btn"></var></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script src="../../third-party/jquery-1.10.2.min.js"></script>
|
||||
<script src="../../third-party/highcharts/highcharts.js"></script>
|
||||
<script src="chart.config.js"></script>
|
||||
<script src="charts.js"></script>
|
||||
</body>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>chart</title>
|
||||
<meta chartset="utf-8">
|
||||
<link rel="stylesheet" type="text/css" href="charts.css">
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="main">
|
||||
<div class="table-view">
|
||||
<h3><var id="lang_data_source"></var></h3>
|
||||
<div id="tableContainer" class="table-container"></div>
|
||||
<h3><var id="lang_chart_format"></var></h3>
|
||||
<form name="data-form">
|
||||
<div class="charts-format">
|
||||
<fieldset>
|
||||
<legend><var id="lang_data_align"></var></legend>
|
||||
<div class="format-item-container">
|
||||
<label>
|
||||
<input type="radio" class="format-ctrl not-pie-item" name="charts-format" value="1" checked="checked">
|
||||
<var id="lang_chart_align_same"></var>
|
||||
</label>
|
||||
<label>
|
||||
<input type="radio" class="format-ctrl not-pie-item" name="charts-format" value="-1">
|
||||
<var id="lang_chart_align_reverse"></var>
|
||||
</label>
|
||||
<br>
|
||||
</div>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend><var id="lang_chart_title"></var></legend>
|
||||
<div class="format-item-container">
|
||||
<label>
|
||||
<var id="lang_chart_main_title"></var><input type="text" name="title" class="data-item">
|
||||
</label>
|
||||
<label>
|
||||
<var id="lang_chart_sub_title"></var><input type="text" name="sub-title" class="data-item not-pie-item">
|
||||
</label>
|
||||
<label>
|
||||
<var id="lang_chart_x_title"></var><input type="text" name="x-title" class="data-item not-pie-item">
|
||||
</label>
|
||||
<label>
|
||||
<var id="lang_chart_y_title"></var><input type="text" name="y-title" class="data-item not-pie-item">
|
||||
</label>
|
||||
</div>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend><var id="lang_chart_tip"></var></legend>
|
||||
<div class="format-item-container">
|
||||
<label>
|
||||
<var id="lang_cahrt_tip_prefix"></var>
|
||||
<input type="text" id="tipInput" name="tip" class="data-item" disabled="disabled">
|
||||
</label>
|
||||
<p><var id="lang_cahrt_tip_description"></var></p>
|
||||
</div>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend><var id="lang_chart_data_unit"></var></legend>
|
||||
<div class="format-item-container">
|
||||
<label><var id="lang_chart_data_unit_title"></var><input type="text" name="unit" class="data-item"></label>
|
||||
<p><var id="lang_chart_data_unit_description"></var></p>
|
||||
</div>
|
||||
</fieldset>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="charts-view">
|
||||
<div id="chartsContainer" class="charts-container"></div>
|
||||
<div id="chartsType" class="charts-type">
|
||||
<h3><var id="lang_chart_type"></var></h3>
|
||||
<div class="scroll-view">
|
||||
<div class="scroll-container">
|
||||
<div id="scrollBed" class="scroll-bed"></div>
|
||||
</div>
|
||||
<div id="buttonContainer" class="button-container">
|
||||
<a href="#" data-title="prev"><var id="lang_prev_btn"></var></a>
|
||||
<a href="#" data-title="next"><var id="lang_next_btn"></var></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script src="../../third-party/jquery-1.10.2.min.js"></script>
|
||||
<script src="../../third-party/highcharts/highcharts.js"></script>
|
||||
<script src="chart.config.js"></script>
|
||||
<script src="charts.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,43 +1,43 @@
|
|||
.jd img{
|
||||
background:transparent url(images/jxface2.gif?v=1.1) no-repeat scroll left top;
|
||||
cursor:pointer;width:35px;height:35px;display:block;
|
||||
}
|
||||
.pp img{
|
||||
background:transparent url(images/fface.gif?v=1.1) no-repeat scroll left top;
|
||||
cursor:pointer;width:25px;height:25px;display:block;
|
||||
}
|
||||
.ldw img{
|
||||
background:transparent url(images/wface.gif?v=1.1) no-repeat scroll left top;
|
||||
cursor:pointer;width:35px;height:35px;display:block;
|
||||
}
|
||||
.tsj img{
|
||||
background:transparent url(images/tface.gif?v=1.1) no-repeat scroll left top;
|
||||
cursor:pointer;width:35px;height:35px;display:block;
|
||||
}
|
||||
.cat img{
|
||||
background:transparent url(images/cface.gif?v=1.1) no-repeat scroll left top;
|
||||
cursor:pointer;width:35px;height:35px;display:block;
|
||||
}
|
||||
.bb img{
|
||||
background:transparent url(images/bface.gif?v=1.1) no-repeat scroll left top;
|
||||
cursor:pointer;width:35px;height:35px;display:block;
|
||||
}
|
||||
.youa img{
|
||||
background:transparent url(images/yface.gif?v=1.1) no-repeat scroll left top;
|
||||
cursor:pointer;width:35px;height:35px;display:block;
|
||||
}
|
||||
|
||||
.smileytable td {height: 37px;}
|
||||
#tabPanel{margin-left:5px;overflow: hidden;}
|
||||
#tabContent {float:left;background:#FFFFFF;}
|
||||
#tabContent div{display: none;width:480px;overflow:hidden;}
|
||||
#tabIconReview.show{left:17px;display:block;}
|
||||
.menuFocus{background:#ACCD3C;}
|
||||
.menuDefault{background:#FFFFFF;}
|
||||
#tabIconReview{position:absolute;left:406px;left:398px \9;top:41px;z-index:65533;width:90px;height:76px;}
|
||||
img.review{width:90px;height:76px;border:2px solid #9cb945;background:#FFFFFF;background-position:center;background-repeat:no-repeat;}
|
||||
|
||||
.wrapper .tabbody{position:relative;float:left;clear:both;padding:10px;width: 95%;}
|
||||
.tabbody table{width: 100%;}
|
||||
.tabbody td{border:1px solid #BAC498;}
|
||||
.jd img{
|
||||
background:transparent url(images/jxface2.gif?v=1.1) no-repeat scroll left top;
|
||||
cursor:pointer;width:35px;height:35px;display:block;
|
||||
}
|
||||
.pp img{
|
||||
background:transparent url(images/fface.gif?v=1.1) no-repeat scroll left top;
|
||||
cursor:pointer;width:25px;height:25px;display:block;
|
||||
}
|
||||
.ldw img{
|
||||
background:transparent url(images/wface.gif?v=1.1) no-repeat scroll left top;
|
||||
cursor:pointer;width:35px;height:35px;display:block;
|
||||
}
|
||||
.tsj img{
|
||||
background:transparent url(images/tface.gif?v=1.1) no-repeat scroll left top;
|
||||
cursor:pointer;width:35px;height:35px;display:block;
|
||||
}
|
||||
.cat img{
|
||||
background:transparent url(images/cface.gif?v=1.1) no-repeat scroll left top;
|
||||
cursor:pointer;width:35px;height:35px;display:block;
|
||||
}
|
||||
.bb img{
|
||||
background:transparent url(images/bface.gif?v=1.1) no-repeat scroll left top;
|
||||
cursor:pointer;width:35px;height:35px;display:block;
|
||||
}
|
||||
.youa img{
|
||||
background:transparent url(images/yface.gif?v=1.1) no-repeat scroll left top;
|
||||
cursor:pointer;width:35px;height:35px;display:block;
|
||||
}
|
||||
|
||||
.smileytable td {height: 37px;}
|
||||
#tabPanel{margin-left:5px;overflow: hidden;}
|
||||
#tabContent {float:left;background:#FFFFFF;}
|
||||
#tabContent div{display: none;width:480px;overflow:hidden;}
|
||||
#tabIconReview.show{left:17px;display:block;}
|
||||
.menuFocus{background:#ACCD3C;}
|
||||
.menuDefault{background:#FFFFFF;}
|
||||
#tabIconReview{position:absolute;left:406px;left:398px \9;top:41px;z-index:65533;width:90px;height:76px;}
|
||||
img.review{width:90px;height:76px;border:2px solid #9cb945;background:#FFFFFF;background-position:center;background-repeat:no-repeat;}
|
||||
|
||||
.wrapper .tabbody{position:relative;float:left;clear:both;padding:10px;width: 95%;}
|
||||
.tabbody table{width: 100%;}
|
||||
.tabbody td{border:1px solid #BAC498;}
|
||||
.tabbody td span{display: block;zoom:1;padding:0 4px;}
|
||||
|
|
@ -1,54 +1,54 @@
|
|||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title></title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<meta name="robots" content="noindex, nofollow"/>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="emotion.css">
|
||||
</head>
|
||||
<body>
|
||||
<div id="tabPanel" class="wrapper">
|
||||
<div id="tabHeads" class="tabhead">
|
||||
<span><var id="lang_input_choice"></var></span>
|
||||
<span><var id="lang_input_Tuzki"></var></span>
|
||||
<span><var id="lang_input_lvdouwa"></var></span>
|
||||
<span><var id="lang_input_BOBO"></var></span>
|
||||
<span><var id="lang_input_babyCat"></var></span>
|
||||
<span><var id="lang_input_bubble"></var></span>
|
||||
<span><var id="lang_input_youa"></var></span>
|
||||
</div>
|
||||
<div id="tabBodys" class="tabbody">
|
||||
<div id="tab0"></div>
|
||||
<div id="tab1"></div>
|
||||
<div id="tab2"></div>
|
||||
<div id="tab3"></div>
|
||||
<div id="tab4"></div>
|
||||
<div id="tab5"></div>
|
||||
<div id="tab6"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="tabIconReview">
|
||||
<img id='faceReview' class='review' src="../../themes/default/images/spacer.gif"/>
|
||||
</div>
|
||||
<script type="text/javascript" src="emotion.js"></script>
|
||||
<script type="text/javascript">
|
||||
var emotion = {
|
||||
tabNum:7, //切换面板数量
|
||||
SmilmgName:{ tab0:['j_00', 84], tab1:['t_00', 40], tab2:['w_00', 52], tab3:['B_00', 63], tab4:['C_00', 20], tab5:['i_f', 50], tab6:['y_00', 40] }, //图片前缀名
|
||||
imageFolders:{ tab0:'jx2/', tab1:'tsj/', tab2:'ldw/', tab3:'bobo/', tab4:'babycat/', tab5:'face/', tab6:'youa/'}, //图片对应文件夹路径
|
||||
imageCss:{tab0:'jd', tab1:'tsj', tab2:'ldw', tab3:'bb', tab4:'cat', tab5:'pp', tab6:'youa'}, //图片css类名
|
||||
imageCssOffset:{tab0:35, tab1:35, tab2:35, tab3:35, tab4:35, tab5:25, tab6:35}, //图片偏移
|
||||
SmileyInfor:{
|
||||
tab0:['Kiss', 'Love', 'Yeah', '啊！', '背扭', '顶', '抖胸', '88', '汗', '瞌睡', '鲁拉', '拍砖', '揉脸', '生日快乐', '大笑', '瀑布汗~', '惊讶', '臭美', '傻笑', '抛媚眼', '发怒', '打酱油', '俯卧撑', '气愤', '?', '吻', '怒', '胜利', 'HI', 'KISS', '不说', '不要', '扯花', '大心', '顶', '大惊', '飞吻', '鬼脸', '害羞', '口水', '狂哭', '来', '发财了', '吃西瓜', '套牢', '害羞', '庆祝', '我来了', '敲打', '晕了', '胜利', '臭美', '被打了', '贪吃', '迎接', '酷', '微笑', '亲吻', '调皮', '惊恐', '耍酷', '发火', '害羞', '汗水', '大哭', '', '加油', '困', '你NB', '晕倒', '开心', '偷笑', '大哭', '滴汗', '叹气', '超赞', '??', '飞吻', '天使', '撒花', '生气', '被砸', '吓傻', '随意吐'],
|
||||
tab1:['Kiss', 'Love', 'Yeah', '啊！', '背扭', '顶', '抖胸', '88', '汗', '瞌睡', '鲁拉', '拍砖', '揉脸', '生日快乐', '摊手', '睡觉', '瘫坐', '无聊', '星星闪', '旋转', '也不行', '郁闷', '正Music', '抓墙', '撞墙至死', '歪头', '戳眼', '飘过', '互相拍砖', '砍死你', '扔桌子', '少林寺', '什么？', '转头', '我爱牛奶', '我踢', '摇晃', '晕厥', '在笼子里', '震荡'],
|
||||
tab2:['大笑', '瀑布汗~', '惊讶', '臭美', '傻笑', '抛媚眼', '发怒', '我错了', 'money', '气愤', '挑逗', '吻', '怒', '胜利', '委屈', '受伤', '说啥呢？', '闭嘴', '不', '逗你玩儿', '飞吻', '眩晕', '魔法', '我来了', '睡了', '我打', '闭嘴', '打', '打晕了', '刷牙', '爆揍', '炸弹', '倒立', '刮胡子', '邪恶的笑', '不要不要', '爱恋中', '放大仔细看', '偷窥', '超高兴', '晕', '松口气', '我跑', '享受', '修养', '哭', '汗', '啊~', '热烈欢迎', '打酱油', '俯卧撑', '?'],
|
||||
tab3:['HI', 'KISS', '不说', '不要', '扯花', '大心', '顶', '大惊', '飞吻', '鬼脸', '害羞', '口水', '狂哭', '来', '泪眼', '流泪', '生气', '吐舌', '喜欢', '旋转', '再见', '抓狂', '汗', '鄙视', '拜', '吐血', '嘘', '打人', '蹦跳', '变脸', '扯肉', '吃To', '吃花', '吹泡泡糖', '大变身', '飞天舞', '回眸', '可怜', '猛抽', '泡泡', '苹果', '亲', '', '骚舞', '烧香', '睡', '套娃娃', '捅捅', '舞倒', '西红柿', '爱慕', '摇', '摇摆', '杂耍', '招财', '被殴', '被球闷', '大惊', '理想', '欧打', '呕吐', '碎', '吐痰'],
|
||||
tab4:['发财了', '吃西瓜', '套牢', '害羞', '庆祝', '我来了', '敲打', '晕了', '胜利', '臭美', '被打了', '贪吃', '迎接', '酷', '顶', '幸运', '爱心', '躲', '送花', '选择'],
|
||||
tab5:['微笑', '亲吻', '调皮', '惊讶', '耍酷', '发火', '害羞', '汗水', '大哭', '得意', '鄙视', '困', '夸奖', '晕倒', '疑问', '媒婆', '狂吐', '青蛙', '发愁', '亲吻', '', '爱心', '心碎', '玫瑰', '礼物', '哭', '奸笑', '可爱', '得意', '呲牙', '暴汗', '楚楚可怜', '困', '哭', '生气', '惊讶', '口水', '彩虹', '夜空', '太阳', '钱钱', '灯泡', '咖啡', '蛋糕', '音乐', '爱', '胜利', '赞', '鄙视', 'OK'],
|
||||
tab6:['男兜', '女兜', '开心', '乖乖', '偷笑', '大笑', '抽泣', '大哭', '无奈', '滴汗', '叹气', '狂晕', '委屈', '超赞', '??', '疑问', '飞吻', '天使', '撒花', '生气', '被砸', '口水', '泪奔', '吓傻', '吐舌头', '点头', '随意吐', '旋转', '困困', '鄙视', '狂顶', '篮球', '再见', '欢迎光临', '恭喜发财', '稍等', '我在线', '恕不议价', '库房有货', '货在路上']
|
||||
}
|
||||
};
|
||||
</script>
|
||||
</body>
|
||||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title></title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<meta name="robots" content="noindex, nofollow"/>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="emotion.css">
|
||||
</head>
|
||||
<body>
|
||||
<div id="tabPanel" class="wrapper">
|
||||
<div id="tabHeads" class="tabhead">
|
||||
<span><var id="lang_input_choice"></var></span>
|
||||
<span><var id="lang_input_Tuzki"></var></span>
|
||||
<span><var id="lang_input_lvdouwa"></var></span>
|
||||
<span><var id="lang_input_BOBO"></var></span>
|
||||
<span><var id="lang_input_babyCat"></var></span>
|
||||
<span><var id="lang_input_bubble"></var></span>
|
||||
<span><var id="lang_input_youa"></var></span>
|
||||
</div>
|
||||
<div id="tabBodys" class="tabbody">
|
||||
<div id="tab0"></div>
|
||||
<div id="tab1"></div>
|
||||
<div id="tab2"></div>
|
||||
<div id="tab3"></div>
|
||||
<div id="tab4"></div>
|
||||
<div id="tab5"></div>
|
||||
<div id="tab6"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="tabIconReview">
|
||||
<img id='faceReview' class='review' src="../../themes/default/images/spacer.gif"/>
|
||||
</div>
|
||||
<script type="text/javascript" src="emotion.js"></script>
|
||||
<script type="text/javascript">
|
||||
var emotion = {
|
||||
tabNum:7, //切换面板数量
|
||||
SmilmgName:{ tab0:['j_00', 84], tab1:['t_00', 40], tab2:['w_00', 52], tab3:['B_00', 63], tab4:['C_00', 20], tab5:['i_f', 50], tab6:['y_00', 40] }, //图片前缀名
|
||||
imageFolders:{ tab0:'jx2/', tab1:'tsj/', tab2:'ldw/', tab3:'bobo/', tab4:'babycat/', tab5:'face/', tab6:'youa/'}, //图片对应文件夹路径
|
||||
imageCss:{tab0:'jd', tab1:'tsj', tab2:'ldw', tab3:'bb', tab4:'cat', tab5:'pp', tab6:'youa'}, //图片css类名
|
||||
imageCssOffset:{tab0:35, tab1:35, tab2:35, tab3:35, tab4:35, tab5:25, tab6:35}, //图片偏移
|
||||
SmileyInfor:{
|
||||
tab0:['Kiss', 'Love', 'Yeah', '啊！', '背扭', '顶', '抖胸', '88', '汗', '瞌睡', '鲁拉', '拍砖', '揉脸', '生日快乐', '大笑', '瀑布汗~', '惊讶', '臭美', '傻笑', '抛媚眼', '发怒', '打酱油', '俯卧撑', '气愤', '?', '吻', '怒', '胜利', 'HI', 'KISS', '不说', '不要', '扯花', '大心', '顶', '大惊', '飞吻', '鬼脸', '害羞', '口水', '狂哭', '来', '发财了', '吃西瓜', '套牢', '害羞', '庆祝', '我来了', '敲打', '晕了', '胜利', '臭美', '被打了', '贪吃', '迎接', '酷', '微笑', '亲吻', '调皮', '惊恐', '耍酷', '发火', '害羞', '汗水', '大哭', '', '加油', '困', '你NB', '晕倒', '开心', '偷笑', '大哭', '滴汗', '叹气', '超赞', '??', '飞吻', '天使', '撒花', '生气', '被砸', '吓傻', '随意吐'],
|
||||
tab1:['Kiss', 'Love', 'Yeah', '啊！', '背扭', '顶', '抖胸', '88', '汗', '瞌睡', '鲁拉', '拍砖', '揉脸', '生日快乐', '摊手', '睡觉', '瘫坐', '无聊', '星星闪', '旋转', '也不行', '郁闷', '正Music', '抓墙', '撞墙至死', '歪头', '戳眼', '飘过', '互相拍砖', '砍死你', '扔桌子', '少林寺', '什么？', '转头', '我爱牛奶', '我踢', '摇晃', '晕厥', '在笼子里', '震荡'],
|
||||
tab2:['大笑', '瀑布汗~', '惊讶', '臭美', '傻笑', '抛媚眼', '发怒', '我错了', 'money', '气愤', '挑逗', '吻', '怒', '胜利', '委屈', '受伤', '说啥呢？', '闭嘴', '不', '逗你玩儿', '飞吻', '眩晕', '魔法', '我来了', '睡了', '我打', '闭嘴', '打', '打晕了', '刷牙', '爆揍', '炸弹', '倒立', '刮胡子', '邪恶的笑', '不要不要', '爱恋中', '放大仔细看', '偷窥', '超高兴', '晕', '松口气', '我跑', '享受', '修养', '哭', '汗', '啊~', '热烈欢迎', '打酱油', '俯卧撑', '?'],
|
||||
tab3:['HI', 'KISS', '不说', '不要', '扯花', '大心', '顶', '大惊', '飞吻', '鬼脸', '害羞', '口水', '狂哭', '来', '泪眼', '流泪', '生气', '吐舌', '喜欢', '旋转', '再见', '抓狂', '汗', '鄙视', '拜', '吐血', '嘘', '打人', '蹦跳', '变脸', '扯肉', '吃To', '吃花', '吹泡泡糖', '大变身', '飞天舞', '回眸', '可怜', '猛抽', '泡泡', '苹果', '亲', '', '骚舞', '烧香', '睡', '套娃娃', '捅捅', '舞倒', '西红柿', '爱慕', '摇', '摇摆', '杂耍', '招财', '被殴', '被球闷', '大惊', '理想', '欧打', '呕吐', '碎', '吐痰'],
|
||||
tab4:['发财了', '吃西瓜', '套牢', '害羞', '庆祝', '我来了', '敲打', '晕了', '胜利', '臭美', '被打了', '贪吃', '迎接', '酷', '顶', '幸运', '爱心', '躲', '送花', '选择'],
|
||||
tab5:['微笑', '亲吻', '调皮', '惊讶', '耍酷', '发火', '害羞', '汗水', '大哭', '得意', '鄙视', '困', '夸奖', '晕倒', '疑问', '媒婆', '狂吐', '青蛙', '发愁', '亲吻', '', '爱心', '心碎', '玫瑰', '礼物', '哭', '奸笑', '可爱', '得意', '呲牙', '暴汗', '楚楚可怜', '困', '哭', '生气', '惊讶', '口水', '彩虹', '夜空', '太阳', '钱钱', '灯泡', '咖啡', '蛋糕', '音乐', '爱', '胜利', '赞', '鄙视', 'OK'],
|
||||
tab6:['男兜', '女兜', '开心', '乖乖', '偷笑', '大笑', '抽泣', '大哭', '无奈', '滴汗', '叹气', '狂晕', '委屈', '超赞', '??', '疑问', '飞吻', '天使', '撒花', '生气', '被砸', '口水', '泪奔', '吓傻', '吐舌头', '点头', '随意吐', '旋转', '困困', '鄙视', '狂顶', '篮球', '再见', '欢迎光临', '恭喜发财', '稍等', '我在线', '恕不议价', '库房有货', '货在路上']
|
||||
}
|
||||
};
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,186 +1,186 @@
|
|||
window.onload = function () {
|
||||
editor.setOpt({
|
||||
emotionLocalization:false
|
||||
});
|
||||
|
||||
emotion.SmileyPath = editor.options.emotionLocalization === true ? 'images/' : "http://img.baidu.com/hi/";
|
||||
emotion.SmileyBox = createTabList( emotion.tabNum );
|
||||
emotion.tabExist = createArr( emotion.tabNum );
|
||||
|
||||
initImgName();
|
||||
initEvtHandler( "tabHeads" );
|
||||
};
|
||||
|
||||
function initImgName() {
|
||||
for ( var pro in emotion.SmilmgName ) {
|
||||
var tempName = emotion.SmilmgName[pro],
|
||||
tempBox = emotion.SmileyBox[pro],
|
||||
tempStr = "";
|
||||
|
||||
if ( tempBox.length ) return;
|
||||
for ( var i = 1; i <= tempName[1]; i++ ) {
|
||||
tempStr = tempName[0];
|
||||
if ( i < 10 ) tempStr = tempStr + '0';
|
||||
tempStr = tempStr + i + '.gif';
|
||||
tempBox.push( tempStr );
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function initEvtHandler( conId ) {
|
||||
var tabHeads = $G( conId );
|
||||
for ( var i = 0, j = 0; i < tabHeads.childNodes.length; i++ ) {
|
||||
var tabObj = tabHeads.childNodes[i];
|
||||
if ( tabObj.nodeType == 1 ) {
|
||||
domUtils.on( tabObj, "click", (function ( index ) {
|
||||
return function () {
|
||||
switchTab( index );
|
||||
};
|
||||
})( j ) );
|
||||
j++;
|
||||
}
|
||||
}
|
||||
switchTab( 0 );
|
||||
$G( "tabIconReview" ).style.display = 'none';
|
||||
}
|
||||
|
||||
function InsertSmiley( url, evt ) {
|
||||
var obj = {
|
||||
src:editor.options.emotionLocalization ? editor.options.UEDITOR_HOME_URL + "dialogs/emotion/" + url : url
|
||||
};
|
||||
obj._src = obj.src;
|
||||
editor.execCommand( 'insertimage', obj );
|
||||
if ( !evt.ctrlKey ) {
|
||||
dialog.popup.hide();
|
||||
}
|
||||
}
|
||||
|
||||
function switchTab( index ) {
|
||||
|
||||
autoHeight( index );
|
||||
if ( emotion.tabExist[index] == 0 ) {
|
||||
emotion.tabExist[index] = 1;
|
||||
createTab( 'tab' + index );
|
||||
}
|
||||
//获取呈现元素句柄数组
|
||||
var tabHeads = $G( "tabHeads" ).getElementsByTagName( "span" ),
|
||||
tabBodys = $G( "tabBodys" ).getElementsByTagName( "div" ),
|
||||
i = 0, L = tabHeads.length;
|
||||
//隐藏所有呈现元素
|
||||
for ( ; i < L; i++ ) {
|
||||
tabHeads[i].className = "";
|
||||
tabBodys[i].style.display = "none";
|
||||
}
|
||||
//显示对应呈现元素
|
||||
tabHeads[index].className = "focus";
|
||||
tabBodys[index].style.display = "block";
|
||||
}
|
||||
|
||||
function autoHeight( index ) {
|
||||
var iframe = dialog.getDom( "iframe" ),
|
||||
parent = iframe.parentNode.parentNode;
|
||||
switch ( index ) {
|
||||
case 0:
|
||||
iframe.style.height = "380px";
|
||||
parent.style.height = "392px";
|
||||
break;
|
||||
case 1:
|
||||
iframe.style.height = "220px";
|
||||
parent.style.height = "232px";
|
||||
break;
|
||||
case 2:
|
||||
iframe.style.height = "260px";
|
||||
parent.style.height = "272px";
|
||||
break;
|
||||
case 3:
|
||||
iframe.style.height = "300px";
|
||||
parent.style.height = "312px";
|
||||
break;
|
||||
case 4:
|
||||
iframe.style.height = "140px";
|
||||
parent.style.height = "152px";
|
||||
break;
|
||||
case 5:
|
||||
iframe.style.height = "260px";
|
||||
parent.style.height = "272px";
|
||||
break;
|
||||
case 6:
|
||||
iframe.style.height = "230px";
|
||||
parent.style.height = "242px";
|
||||
break;
|
||||
default:
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
function createTab( tabName ) {
|
||||
var faceVersion = "?v=1.1", //版本号
|
||||
tab = $G( tabName ), //获取将要生成的Div句柄
|
||||
imagePath = emotion.SmileyPath + emotion.imageFolders[tabName], //获取显示表情和预览表情的路径
|
||||
positionLine = 11 / 2, //中间数
|
||||
iWidth = iHeight = 35, //图片长宽
|
||||
iColWidth = 3, //表格剩余空间的显示比例
|
||||
tableCss = emotion.imageCss[tabName],
|
||||
cssOffset = emotion.imageCssOffset[tabName],
|
||||
textHTML = ['<table class="smileytable">'],
|
||||
i = 0, imgNum = emotion.SmileyBox[tabName].length, imgColNum = 11, faceImage,
|
||||
sUrl, realUrl, posflag, offset, infor;
|
||||
|
||||
for ( ; i < imgNum; ) {
|
||||
textHTML.push( '<tr>' );
|
||||
for ( var j = 0; j < imgColNum; j++, i++ ) {
|
||||
faceImage = emotion.SmileyBox[tabName][i];
|
||||
if ( faceImage ) {
|
||||
sUrl = imagePath + faceImage + faceVersion;
|
||||
realUrl = imagePath + faceImage;
|
||||
posflag = j < positionLine ? 0 : 1;
|
||||
offset = cssOffset * i * (-1) - 1;
|
||||
infor = emotion.SmileyInfor[tabName][i];
|
||||
|
||||
textHTML.push( '<td class="' + tableCss + '" border="1" width="' + iColWidth + '%" style="border-collapse:collapse;" align="center" bgcolor="transparent" onclick="InsertSmiley(\'' + realUrl.replace( /'/g, "\\'" ) + '\',event)" onmouseover="over(this,\'' + sUrl + '\',\'' + posflag + '\')" onmouseout="out(this)">' );
|
||||
textHTML.push( '<span>' );
|
||||
textHTML.push( '<img style="background-position:left ' + offset + 'px;" title="' + infor + '" src="' + emotion.SmileyPath + (editor.options.emotionLocalization ? '0.gif" width="' : 'default/0.gif" width="') + iWidth + '" height="' + iHeight + '"></img>' );
|
||||
textHTML.push( '</span>' );
|
||||
} else {
|
||||
textHTML.push( '<td width="' + iColWidth + '%" bgcolor="#FFFFFF">' );
|
||||
}
|
||||
textHTML.push( '</td>' );
|
||||
}
|
||||
textHTML.push( '</tr>' );
|
||||
}
|
||||
textHTML.push( '</table>' );
|
||||
textHTML = textHTML.join( "" );
|
||||
tab.innerHTML = textHTML;
|
||||
}
|
||||
|
||||
function over( td, srcPath, posFlag ) {
|
||||
td.style.backgroundColor = "#ACCD3C";
|
||||
$G( 'faceReview' ).style.backgroundImage = "url(" + srcPath + ")";
|
||||
if ( posFlag == 1 ) $G( "tabIconReview" ).className = "show";
|
||||
$G( "tabIconReview" ).style.display = 'block';
|
||||
}
|
||||
|
||||
function out( td ) {
|
||||
td.style.backgroundColor = "transparent";
|
||||
var tabIconRevew = $G( "tabIconReview" );
|
||||
tabIconRevew.className = "";
|
||||
tabIconRevew.style.display = 'none';
|
||||
}
|
||||
|
||||
function createTabList( tabNum ) {
|
||||
var obj = {};
|
||||
for ( var i = 0; i < tabNum; i++ ) {
|
||||
obj["tab" + i] = [];
|
||||
}
|
||||
return obj;
|
||||
}
|
||||
|
||||
function createArr( tabNum ) {
|
||||
var arr = [];
|
||||
for ( var i = 0; i < tabNum; i++ ) {
|
||||
arr[i] = 0;
|
||||
}
|
||||
return arr;
|
||||
}
|
||||
|
||||
window.onload = function () {
|
||||
editor.setOpt({
|
||||
emotionLocalization:false
|
||||
});
|
||||
|
||||
emotion.SmileyPath = editor.options.emotionLocalization === true ? 'images/' : "http://img.baidu.com/hi/";
|
||||
emotion.SmileyBox = createTabList( emotion.tabNum );
|
||||
emotion.tabExist = createArr( emotion.tabNum );
|
||||
|
||||
initImgName();
|
||||
initEvtHandler( "tabHeads" );
|
||||
};
|
||||
|
||||
function initImgName() {
|
||||
for ( var pro in emotion.SmilmgName ) {
|
||||
var tempName = emotion.SmilmgName[pro],
|
||||
tempBox = emotion.SmileyBox[pro],
|
||||
tempStr = "";
|
||||
|
||||
if ( tempBox.length ) return;
|
||||
for ( var i = 1; i <= tempName[1]; i++ ) {
|
||||
tempStr = tempName[0];
|
||||
if ( i < 10 ) tempStr = tempStr + '0';
|
||||
tempStr = tempStr + i + '.gif';
|
||||
tempBox.push( tempStr );
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function initEvtHandler( conId ) {
|
||||
var tabHeads = $G( conId );
|
||||
for ( var i = 0, j = 0; i < tabHeads.childNodes.length; i++ ) {
|
||||
var tabObj = tabHeads.childNodes[i];
|
||||
if ( tabObj.nodeType == 1 ) {
|
||||
domUtils.on( tabObj, "click", (function ( index ) {
|
||||
return function () {
|
||||
switchTab( index );
|
||||
};
|
||||
})( j ) );
|
||||
j++;
|
||||
}
|
||||
}
|
||||
switchTab( 0 );
|
||||
$G( "tabIconReview" ).style.display = 'none';
|
||||
}
|
||||
|
||||
function InsertSmiley( url, evt ) {
|
||||
var obj = {
|
||||
src:editor.options.emotionLocalization ? editor.options.UEDITOR_HOME_URL + "dialogs/emotion/" + url : url
|
||||
};
|
||||
obj._src = obj.src;
|
||||
editor.execCommand( 'insertimage', obj );
|
||||
if ( !evt.ctrlKey ) {
|
||||
dialog.popup.hide();
|
||||
}
|
||||
}
|
||||
|
||||
function switchTab( index ) {
|
||||
|
||||
autoHeight( index );
|
||||
if ( emotion.tabExist[index] == 0 ) {
|
||||
emotion.tabExist[index] = 1;
|
||||
createTab( 'tab' + index );
|
||||
}
|
||||
//获取呈现元素句柄数组
|
||||
var tabHeads = $G( "tabHeads" ).getElementsByTagName( "span" ),
|
||||
tabBodys = $G( "tabBodys" ).getElementsByTagName( "div" ),
|
||||
i = 0, L = tabHeads.length;
|
||||
//隐藏所有呈现元素
|
||||
for ( ; i < L; i++ ) {
|
||||
tabHeads[i].className = "";
|
||||
tabBodys[i].style.display = "none";
|
||||
}
|
||||
//显示对应呈现元素
|
||||
tabHeads[index].className = "focus";
|
||||
tabBodys[index].style.display = "block";
|
||||
}
|
||||
|
||||
function autoHeight( index ) {
|
||||
var iframe = dialog.getDom( "iframe" ),
|
||||
parent = iframe.parentNode.parentNode;
|
||||
switch ( index ) {
|
||||
case 0:
|
||||
iframe.style.height = "380px";
|
||||
parent.style.height = "392px";
|
||||
break;
|
||||
case 1:
|
||||
iframe.style.height = "220px";
|
||||
parent.style.height = "232px";
|
||||
break;
|
||||
case 2:
|
||||
iframe.style.height = "260px";
|
||||
parent.style.height = "272px";
|
||||
break;
|
||||
case 3:
|
||||
iframe.style.height = "300px";
|
||||
parent.style.height = "312px";
|
||||
break;
|
||||
case 4:
|
||||
iframe.style.height = "140px";
|
||||
parent.style.height = "152px";
|
||||
break;
|
||||
case 5:
|
||||
iframe.style.height = "260px";
|
||||
parent.style.height = "272px";
|
||||
break;
|
||||
case 6:
|
||||
iframe.style.height = "230px";
|
||||
parent.style.height = "242px";
|
||||
break;
|
||||
default:
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
function createTab( tabName ) {
|
||||
var faceVersion = "?v=1.1", //版本号
|
||||
tab = $G( tabName ), //获取将要生成的Div句柄
|
||||
imagePath = emotion.SmileyPath + emotion.imageFolders[tabName], //获取显示表情和预览表情的路径
|
||||
positionLine = 11 / 2, //中间数
|
||||
iWidth = iHeight = 35, //图片长宽
|
||||
iColWidth = 3, //表格剩余空间的显示比例
|
||||
tableCss = emotion.imageCss[tabName],
|
||||
cssOffset = emotion.imageCssOffset[tabName],
|
||||
textHTML = ['<table class="smileytable">'],
|
||||
i = 0, imgNum = emotion.SmileyBox[tabName].length, imgColNum = 11, faceImage,
|
||||
sUrl, realUrl, posflag, offset, infor;
|
||||
|
||||
for ( ; i < imgNum; ) {
|
||||
textHTML.push( '<tr>' );
|
||||
for ( var j = 0; j < imgColNum; j++, i++ ) {
|
||||
faceImage = emotion.SmileyBox[tabName][i];
|
||||
if ( faceImage ) {
|
||||
sUrl = imagePath + faceImage + faceVersion;
|
||||
realUrl = imagePath + faceImage;
|
||||
posflag = j < positionLine ? 0 : 1;
|
||||
offset = cssOffset * i * (-1) - 1;
|
||||
infor = emotion.SmileyInfor[tabName][i];
|
||||
|
||||
textHTML.push( '<td class="' + tableCss + '" border="1" width="' + iColWidth + '%" style="border-collapse:collapse;" align="center" bgcolor="transparent" onclick="InsertSmiley(\'' + realUrl.replace( /'/g, "\\'" ) + '\',event)" onmouseover="over(this,\'' + sUrl + '\',\'' + posflag + '\')" onmouseout="out(this)">' );
|
||||
textHTML.push( '<span>' );
|
||||
textHTML.push( '<img style="background-position:left ' + offset + 'px;" title="' + infor + '" src="' + emotion.SmileyPath + (editor.options.emotionLocalization ? '0.gif" width="' : 'default/0.gif" width="') + iWidth + '" height="' + iHeight + '"></img>' );
|
||||
textHTML.push( '</span>' );
|
||||
} else {
|
||||
textHTML.push( '<td width="' + iColWidth + '%" bgcolor="#FFFFFF">' );
|
||||
}
|
||||
textHTML.push( '</td>' );
|
||||
}
|
||||
textHTML.push( '</tr>' );
|
||||
}
|
||||
textHTML.push( '</table>' );
|
||||
textHTML = textHTML.join( "" );
|
||||
tab.innerHTML = textHTML;
|
||||
}
|
||||
|
||||
function over( td, srcPath, posFlag ) {
|
||||
td.style.backgroundColor = "#ACCD3C";
|
||||
$G( 'faceReview' ).style.backgroundImage = "url(" + srcPath + ")";
|
||||
if ( posFlag == 1 ) $G( "tabIconReview" ).className = "show";
|
||||
$G( "tabIconReview" ).style.display = 'block';
|
||||
}
|
||||
|
||||
function out( td ) {
|
||||
td.style.backgroundColor = "transparent";
|
||||
var tabIconRevew = $G( "tabIconReview" );
|
||||
tabIconRevew.className = "";
|
||||
tabIconRevew.style.display = 'none';
|
||||
}
|
||||
|
||||
function createTabList( tabNum ) {
|
||||
var obj = {};
|
||||
for ( var i = 0; i < tabNum; i++ ) {
|
||||
obj["tab" + i] = [];
|
||||
}
|
||||
return obj;
|
||||
}
|
||||
|
||||
function createArr( tabNum ) {
|
||||
var arr = [];
|
||||
for ( var i = 0; i < tabNum; i++ ) {
|
||||
arr[i] = 0;
|
||||
}
|
||||
return arr;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,89 +1,89 @@
|
|||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
|
||||
"http://www.w3.org/TR/html4/loose.dtd">
|
||||
<html>
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
||||
<title></title>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
<style type="text/css">
|
||||
.content{width:530px; height: 350px;margin: 10px auto;}
|
||||
.content table{width: 100%}
|
||||
.content table td{vertical-align: middle;}
|
||||
#address{width:220px;height:21px;background: #FFF;border:1px solid #d7d7d7; line-height: 21px;}
|
||||
</style>
|
||||
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="content">
|
||||
<table>
|
||||
<tr>
|
||||
<td><label for="address"><var id="lang_input_address"></var></label></td>
|
||||
<td><input id="address" type="text" /></td>
|
||||
<td><a id="doSearch" href="javascript:void(0)" class="button"><var id="lang_input_search"></var></a></td>
|
||||
</tr>
|
||||
</table>
|
||||
<div id="container" style="width: 100%; height: 340px;margin: 5px auto; border: 1px solid gray;"></div>
|
||||
</div>
|
||||
<script type="text/javascript">
|
||||
domUtils.on(window,"load",function(){
|
||||
var map = new google.maps.Map(document.getElementById('container'), {
|
||||
zoom: 3,
|
||||
streetViewControl: false,
|
||||
scaleControl: true,
|
||||
mapTypeId: google.maps.MapTypeId.ROADMAP
|
||||
});
|
||||
var imgcss;
|
||||
var marker = new google.maps.Marker({
|
||||
map: map,
|
||||
draggable: true
|
||||
});
|
||||
function doSearch(){
|
||||
var address = document.getElementById('address').value;
|
||||
var geocoder = new google.maps.Geocoder();
|
||||
geocoder.geocode( { 'address': address}, function (results, status) {
|
||||
if (status == google.maps.GeocoderStatus.OK) {
|
||||
var bounds = results[0].geometry.viewport;
|
||||
map.fitBounds(bounds);
|
||||
marker.setPosition(results[0].geometry.location);
|
||||
marker.setTitle(address);
|
||||
} else alert(lang.searchError);
|
||||
});
|
||||
}
|
||||
$G('address').onkeydown = function (evt){
|
||||
evt = evt || event;
|
||||
if (evt.keyCode == 13) {
|
||||
doSearch();
|
||||
}
|
||||
};
|
||||
$G("doSearch").onclick = doSearch;
|
||||
dialog.onok = function (){
|
||||
var center = map.getCenter();
|
||||
var point = marker.getPosition();
|
||||
var url = "http://maps.googleapis.com/maps/api/staticmap?center=" + center.lat() + ',' + center.lng() + "&zoom=" + map.zoom + "&size=520x340&maptype=" + map.getMapTypeId() + "&markers=" + point.lat() + ',' + point.lng() + "&sensor=false";
|
||||
editor.execCommand('inserthtml', '<img width="520" height="340" src="' + url + '"' + (imgcss ? ' style="' + imgcss + '"' :'') + '/>');
|
||||
};
|
||||
|
||||
function getPars(str,par){
|
||||
var reg = new RegExp(par+"=((\\d+|[.,])*)","g");
|
||||
return reg.exec(str)[1];
|
||||
}
|
||||
var img = editor.selection.getRange().getClosedNode();
|
||||
if(img && img.src.indexOf("http://maps.googleapis.com/maps/api/staticmap")!=-1){
|
||||
var url = img.getAttribute("src");
|
||||
var centers = getPars(url,"center").split(",");
|
||||
point = new google.maps.LatLng(Number(centers[0]),Number(centers[1]));
|
||||
map.setCenter(point);
|
||||
map.setZoom(Number(getPars(url,"zoom")));
|
||||
centers = getPars(url,"markers").split(",");
|
||||
marker.setPosition(new google.maps.LatLng(Number(centers[0]),Number(centers[1])));
|
||||
imgcss = img.style.cssText;
|
||||
}else{
|
||||
setTimeout(function(){
|
||||
doSearch();
|
||||
},30)
|
||||
}
|
||||
});
|
||||
|
||||
</script>
|
||||
</body>
|
||||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
|
||||
"http://www.w3.org/TR/html4/loose.dtd">
|
||||
<html>
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
||||
<title></title>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
<style type="text/css">
|
||||
.content{width:530px; height: 350px;margin: 10px auto;}
|
||||
.content table{width: 100%}
|
||||
.content table td{vertical-align: middle;}
|
||||
#address{width:220px;height:21px;background: #FFF;border:1px solid #d7d7d7; line-height: 21px;}
|
||||
</style>
|
||||
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="content">
|
||||
<table>
|
||||
<tr>
|
||||
<td><label for="address"><var id="lang_input_address"></var></label></td>
|
||||
<td><input id="address" type="text" /></td>
|
||||
<td><a id="doSearch" href="javascript:void(0)" class="button"><var id="lang_input_search"></var></a></td>
|
||||
</tr>
|
||||
</table>
|
||||
<div id="container" style="width: 100%; height: 340px;margin: 5px auto; border: 1px solid gray;"></div>
|
||||
</div>
|
||||
<script type="text/javascript">
|
||||
domUtils.on(window,"load",function(){
|
||||
var map = new google.maps.Map(document.getElementById('container'), {
|
||||
zoom: 3,
|
||||
streetViewControl: false,
|
||||
scaleControl: true,
|
||||
mapTypeId: google.maps.MapTypeId.ROADMAP
|
||||
});
|
||||
var imgcss;
|
||||
var marker = new google.maps.Marker({
|
||||
map: map,
|
||||
draggable: true
|
||||
});
|
||||
function doSearch(){
|
||||
var address = document.getElementById('address').value;
|
||||
var geocoder = new google.maps.Geocoder();
|
||||
geocoder.geocode( { 'address': address}, function (results, status) {
|
||||
if (status == google.maps.GeocoderStatus.OK) {
|
||||
var bounds = results[0].geometry.viewport;
|
||||
map.fitBounds(bounds);
|
||||
marker.setPosition(results[0].geometry.location);
|
||||
marker.setTitle(address);
|
||||
} else alert(lang.searchError);
|
||||
});
|
||||
}
|
||||
$G('address').onkeydown = function (evt){
|
||||
evt = evt || event;
|
||||
if (evt.keyCode == 13) {
|
||||
doSearch();
|
||||
}
|
||||
};
|
||||
$G("doSearch").onclick = doSearch;
|
||||
dialog.onok = function (){
|
||||
var center = map.getCenter();
|
||||
var point = marker.getPosition();
|
||||
var url = "http://maps.googleapis.com/maps/api/staticmap?center=" + center.lat() + ',' + center.lng() + "&zoom=" + map.zoom + "&size=520x340&maptype=" + map.getMapTypeId() + "&markers=" + point.lat() + ',' + point.lng() + "&sensor=false";
|
||||
editor.execCommand('inserthtml', '<img width="520" height="340" src="' + url + '"' + (imgcss ? ' style="' + imgcss + '"' :'') + '/>');
|
||||
};
|
||||
|
||||
function getPars(str,par){
|
||||
var reg = new RegExp(par+"=((\\d+|[.,])*)","g");
|
||||
return reg.exec(str)[1];
|
||||
}
|
||||
var img = editor.selection.getRange().getClosedNode();
|
||||
if(img && img.src.indexOf("http://maps.googleapis.com/maps/api/staticmap")!=-1){
|
||||
var url = img.getAttribute("src");
|
||||
var centers = getPars(url,"center").split(",");
|
||||
point = new google.maps.LatLng(Number(centers[0]),Number(centers[1]));
|
||||
map.setCenter(point);
|
||||
map.setZoom(Number(getPars(url,"zoom")));
|
||||
centers = getPars(url,"markers").split(",");
|
||||
marker.setPosition(new google.maps.LatLng(Number(centers[0]),Number(centers[1])));
|
||||
imgcss = img.style.cssText;
|
||||
}else{
|
||||
setTimeout(function(){
|
||||
doSearch();
|
||||
},30)
|
||||
}
|
||||
});
|
||||
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,7 +1,7 @@
|
|||
.wrapper{width: 370px;margin: 10px auto;zoom: 1;}
|
||||
.tabbody{height: 360px;}
|
||||
.tabbody .panel{width:100%;height: 360px;position: absolute;background: #fff;}
|
||||
.tabbody .panel h1{font-size:26px;margin: 5px 0 0 5px;}
|
||||
.tabbody .panel p{font-size:12px;margin: 5px 0 0 5px;}
|
||||
.tabbody table{width:90%;line-height: 20px;margin: 5px 0 0 5px;;}
|
||||
.wrapper{width: 370px;margin: 10px auto;zoom: 1;}
|
||||
.tabbody{height: 360px;}
|
||||
.tabbody .panel{width:100%;height: 360px;position: absolute;background: #fff;}
|
||||
.tabbody .panel h1{font-size:26px;margin: 5px 0 0 5px;}
|
||||
.tabbody .panel p{font-size:12px;margin: 5px 0 0 5px;}
|
||||
.tabbody table{width:90%;line-height: 20px;margin: 5px 0 0 5px;;}
|
||||
.tabbody table thead{font-weight: bold;line-height: 25px;}
|
||||
|
|
@ -1,82 +1,82 @@
|
|||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
|
||||
"http://www.w3.org/TR/html4/loose.dtd">
|
||||
<html>
|
||||
<head>
|
||||
<title>帮助</title>
|
||||
<meta content="text/html; charset=utf-8" http-equiv="Content-Type"/>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="help.css">
|
||||
</head>
|
||||
<body>
|
||||
<div class="wrapper" id="helptab">
|
||||
<div id="tabHeads" class="tabhead">
|
||||
<span class="focus" tabsrc="about"><var id="lang_input_about"></var></span>
|
||||
<span tabsrc="shortcuts"><var id="lang_input_shortcuts"></var></span>
|
||||
</div>
|
||||
<div id="tabBodys" class="tabbody">
|
||||
<div id="about" class="panel">
|
||||
<h1>UEditor</h1>
|
||||
<p id="version"></p>
|
||||
<p><var id="lang_input_introduction"></var></p>
|
||||
</div>
|
||||
<div id="shortcuts" class="panel">
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<td><var id="lang_Txt_shortcuts"></var></td>
|
||||
<td><var id="lang_Txt_func"></var></td>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>ctrl+b</td>
|
||||
<td><var id="lang_Txt_bold"></var></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>ctrl+c</td>
|
||||
<td><var id="lang_Txt_copy"></var></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>ctrl+x</td>
|
||||
<td><var id="lang_Txt_cut"></var></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>ctrl+v</td>
|
||||
<td><var id="lang_Txt_Paste"></var></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>ctrl+y</td>
|
||||
<td><var id="lang_Txt_undo"></var></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>ctrl+z</td>
|
||||
<td><var id="lang_Txt_redo"></var></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>ctrl+i</td>
|
||||
<td><var id="lang_Txt_italic"></var></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>ctrl+u</td>
|
||||
<td><var id="lang_Txt_underline"></var></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>ctrl+a</td>
|
||||
<td><var id="lang_Txt_selectAll"></var></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>shift+enter</td>
|
||||
<td><var id="lang_Txt_visualEnter"></var></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>alt+z</td>
|
||||
<td><var id="lang_Txt_fullscreen"></var></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/javascript" src="help.js"></script>
|
||||
</body>
|
||||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
|
||||
"http://www.w3.org/TR/html4/loose.dtd">
|
||||
<html>
|
||||
<head>
|
||||
<title>帮助</title>
|
||||
<meta content="text/html; charset=utf-8" http-equiv="Content-Type"/>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="help.css">
|
||||
</head>
|
||||
<body>
|
||||
<div class="wrapper" id="helptab">
|
||||
<div id="tabHeads" class="tabhead">
|
||||
<span class="focus" tabsrc="about"><var id="lang_input_about"></var></span>
|
||||
<span tabsrc="shortcuts"><var id="lang_input_shortcuts"></var></span>
|
||||
</div>
|
||||
<div id="tabBodys" class="tabbody">
|
||||
<div id="about" class="panel">
|
||||
<h1>UEditor</h1>
|
||||
<p id="version"></p>
|
||||
<p><var id="lang_input_introduction"></var></p>
|
||||
</div>
|
||||
<div id="shortcuts" class="panel">
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<td><var id="lang_Txt_shortcuts"></var></td>
|
||||
<td><var id="lang_Txt_func"></var></td>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>ctrl+b</td>
|
||||
<td><var id="lang_Txt_bold"></var></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>ctrl+c</td>
|
||||
<td><var id="lang_Txt_copy"></var></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>ctrl+x</td>
|
||||
<td><var id="lang_Txt_cut"></var></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>ctrl+v</td>
|
||||
<td><var id="lang_Txt_Paste"></var></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>ctrl+y</td>
|
||||
<td><var id="lang_Txt_undo"></var></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>ctrl+z</td>
|
||||
<td><var id="lang_Txt_redo"></var></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>ctrl+i</td>
|
||||
<td><var id="lang_Txt_italic"></var></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>ctrl+u</td>
|
||||
<td><var id="lang_Txt_underline"></var></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>ctrl+a</td>
|
||||
<td><var id="lang_Txt_selectAll"></var></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>shift+enter</td>
|
||||
<td><var id="lang_Txt_visualEnter"></var></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>alt+z</td>
|
||||
<td><var id="lang_Txt_fullscreen"></var></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/javascript" src="help.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,56 +1,56 @@
|
|||
/**
|
||||
* Created with JetBrains PhpStorm.
|
||||
* User: xuheng
|
||||
* Date: 12-9-26
|
||||
* Time: 下午1:06
|
||||
* To change this template use File | Settings | File Templates.
|
||||
*/
|
||||
/**
|
||||
* tab点击处理事件
|
||||
* @param tabHeads
|
||||
* @param tabBodys
|
||||
* @param obj
|
||||
*/
|
||||
function clickHandler( tabHeads,tabBodys,obj ) {
|
||||
//head样式更改
|
||||
for ( var k = 0, len = tabHeads.length; k < len; k++ ) {
|
||||
tabHeads[k].className = "";
|
||||
}
|
||||
obj.className = "focus";
|
||||
//body显隐
|
||||
var tabSrc = obj.getAttribute( "tabSrc" );
|
||||
for ( var j = 0, length = tabBodys.length; j < length; j++ ) {
|
||||
var body = tabBodys[j],
|
||||
id = body.getAttribute( "id" );
|
||||
body.onclick = function(){
|
||||
this.style.zoom = 1;
|
||||
};
|
||||
if ( id != tabSrc ) {
|
||||
body.style.zIndex = 1;
|
||||
} else {
|
||||
body.style.zIndex = 200;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* TAB切换
|
||||
* @param tabParentId tab的父节点ID或者对象本身
|
||||
*/
|
||||
function switchTab( tabParentId ) {
|
||||
var tabElements = $G( tabParentId ).children,
|
||||
tabHeads = tabElements[0].children,
|
||||
tabBodys = tabElements[1].children;
|
||||
|
||||
for ( var i = 0, length = tabHeads.length; i < length; i++ ) {
|
||||
var head = tabHeads[i];
|
||||
if ( head.className === "focus" )clickHandler(tabHeads,tabBodys, head );
|
||||
head.onclick = function () {
|
||||
clickHandler(tabHeads,tabBodys,this);
|
||||
}
|
||||
}
|
||||
}
|
||||
switchTab("helptab");
|
||||
|
||||
/**
|
||||
* Created with JetBrains PhpStorm.
|
||||
* User: xuheng
|
||||
* Date: 12-9-26
|
||||
* Time: 下午1:06
|
||||
* To change this template use File | Settings | File Templates.
|
||||
*/
|
||||
/**
|
||||
* tab点击处理事件
|
||||
* @param tabHeads
|
||||
* @param tabBodys
|
||||
* @param obj
|
||||
*/
|
||||
function clickHandler( tabHeads,tabBodys,obj ) {
|
||||
//head样式更改
|
||||
for ( var k = 0, len = tabHeads.length; k < len; k++ ) {
|
||||
tabHeads[k].className = "";
|
||||
}
|
||||
obj.className = "focus";
|
||||
//body显隐
|
||||
var tabSrc = obj.getAttribute( "tabSrc" );
|
||||
for ( var j = 0, length = tabBodys.length; j < length; j++ ) {
|
||||
var body = tabBodys[j],
|
||||
id = body.getAttribute( "id" );
|
||||
body.onclick = function(){
|
||||
this.style.zoom = 1;
|
||||
};
|
||||
if ( id != tabSrc ) {
|
||||
body.style.zIndex = 1;
|
||||
} else {
|
||||
body.style.zIndex = 200;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* TAB切换
|
||||
* @param tabParentId tab的父节点ID或者对象本身
|
||||
*/
|
||||
function switchTab( tabParentId ) {
|
||||
var tabElements = $G( tabParentId ).children,
|
||||
tabHeads = tabElements[0].children,
|
||||
tabBodys = tabElements[1].children;
|
||||
|
||||
for ( var i = 0, length = tabHeads.length; i < length; i++ ) {
|
||||
var head = tabHeads[i];
|
||||
if ( head.className === "focus" )clickHandler(tabHeads,tabBodys, head );
|
||||
head.onclick = function () {
|
||||
clickHandler(tabHeads,tabBodys,this);
|
||||
}
|
||||
}
|
||||
}
|
||||
switchTab("helptab");
|
||||
|
||||
document.getElementById('version').innerHTML = parent.UE.version;
|
||||
File diff suppressed because it is too large
Load Diff
|
|
@ -1,120 +1,120 @@
|
|||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>ueditor图片对话框</title>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
|
||||
<!-- jquery -->
|
||||
<script type="text/javascript" src="../../third-party/jquery-1.10.2.min.js"></script>
|
||||
|
||||
<!-- webuploader -->
|
||||
<script src="../../third-party/webuploader/webuploader.min.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="../../third-party/webuploader/webuploader.css">
|
||||
|
||||
<!-- image dialog -->
|
||||
<link rel="stylesheet" href="image.css" type="text/css" />
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="wrapper">
|
||||
<div id="tabhead" class="tabhead">
|
||||
<span class="tab" data-content-id="remote"><var id="lang_tab_remote"></var></span>
|
||||
<span class="tab focus" data-content-id="upload"><var id="lang_tab_upload"></var></span>
|
||||
<span class="tab" data-content-id="online"><var id="lang_tab_online"></var></span>
|
||||
<span class="tab" data-content-id="search"><var id="lang_tab_search"></var></span>
|
||||
</div>
|
||||
<div class="alignBar">
|
||||
<label class="algnLabel"><var id="lang_input_align"></var></label>
|
||||
<span id="alignIcon">
|
||||
<span id="noneAlign" class="none-align focus" data-align="none"></span>
|
||||
<span id="leftAlign" class="left-align" data-align="left"></span>
|
||||
<span id="rightAlign" class="right-align" data-align="right"></span>
|
||||
<span id="centerAlign" class="center-align" data-align="center"></span>
|
||||
</span>
|
||||
<input id="align" name="align" type="hidden" value="none"/>
|
||||
</div>
|
||||
<div id="tabbody" class="tabbody">
|
||||
|
||||
<!-- 远程图片 -->
|
||||
<div id="remote" class="panel">
|
||||
<div class="top">
|
||||
<div class="row">
|
||||
<label for="url"><var id="lang_input_url"></var></label>
|
||||
<span><input class="text" id="url" type="text"/></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="left">
|
||||
<div class="row">
|
||||
<label><var id="lang_input_size"></var></label>
|
||||
<span><var id="lang_input_width"> </var><input class="text" type="text" id="width"/>px </span>
|
||||
<span><var id="lang_input_height"> </var><input class="text" type="text" id="height"/>px </span>
|
||||
<span><input id="lock" type="checkbox" disabled="disabled"><span id="lockicon"></span></span>
|
||||
</div>
|
||||
<div class="row">
|
||||
<label><var id="lang_input_border"></var></label>
|
||||
<span><input class="text" type="text" id="border"/>px </span>
|
||||
</div>
|
||||
<div class="row">
|
||||
<label><var id="lang_input_vhspace"></var></label>
|
||||
<span><input class="text" type="text" id="vhSpace"/>px </span>
|
||||
</div>
|
||||
<div class="row">
|
||||
<label><var id="lang_input_title"></var></label>
|
||||
<span><input class="text" type="text" id="title"/></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right"><div id="preview"></div></div>
|
||||
</div>
|
||||
|
||||
<!-- 上传图片 -->
|
||||
<div id="upload" class="panel focus">
|
||||
<div id="queueList" class="queueList">
|
||||
<div class="statusBar element-invisible">
|
||||
<div class="progress">
|
||||
<span class="text">0%</span>
|
||||
<span class="percentage"></span>
|
||||
</div><div class="info"></div>
|
||||
<div class="btns">
|
||||
<div id="filePickerBtn"></div>
|
||||
<div class="uploadBtn"><var id="lang_start_upload"></var></div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="dndArea" class="placeholder">
|
||||
<div class="filePickerContainer">
|
||||
<div id="filePickerReady"></div>
|
||||
</div>
|
||||
</div>
|
||||
<ul class="filelist element-invisible">
|
||||
<li id="filePickerBlock" class="filePickerBlock"></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 在线图片 -->
|
||||
<div id="online" class="panel">
|
||||
<div id="imageList"><var id="lang_imgLoading"></var></div>
|
||||
</div>
|
||||
|
||||
<!-- 搜索图片 -->
|
||||
<div id="search" class="panel">
|
||||
<div class="searchBar">
|
||||
<input id="searchTxt" class="searchTxt text" type="text" />
|
||||
<select id="searchType" class="searchType">
|
||||
<option value="&s=4&z=0"></option>
|
||||
<option value="&s=1&z=19"></option>
|
||||
<option value="&s=2&z=0"></option>
|
||||
<option value="&s=3&z=0"></option>
|
||||
</select>
|
||||
<input id="searchReset" type="button" />
|
||||
<input id="searchBtn" type="button" />
|
||||
</div>
|
||||
<div id="searchList" class="searchList"><ul id="searchListUl"></ul></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/javascript" src="image.js"></script>
|
||||
|
||||
</body>
|
||||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>ueditor图片对话框</title>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
|
||||
<!-- jquery -->
|
||||
<script type="text/javascript" src="../../third-party/jquery-1.10.2.min.js"></script>
|
||||
|
||||
<!-- webuploader -->
|
||||
<script src="../../third-party/webuploader/webuploader.min.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="../../third-party/webuploader/webuploader.css">
|
||||
|
||||
<!-- image dialog -->
|
||||
<link rel="stylesheet" href="image.css" type="text/css" />
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="wrapper">
|
||||
<div id="tabhead" class="tabhead">
|
||||
<span class="tab" data-content-id="remote"><var id="lang_tab_remote"></var></span>
|
||||
<span class="tab focus" data-content-id="upload"><var id="lang_tab_upload"></var></span>
|
||||
<span class="tab" data-content-id="online"><var id="lang_tab_online"></var></span>
|
||||
<span class="tab" data-content-id="search"><var id="lang_tab_search"></var></span>
|
||||
</div>
|
||||
<div class="alignBar">
|
||||
<label class="algnLabel"><var id="lang_input_align"></var></label>
|
||||
<span id="alignIcon">
|
||||
<span id="noneAlign" class="none-align focus" data-align="none"></span>
|
||||
<span id="leftAlign" class="left-align" data-align="left"></span>
|
||||
<span id="rightAlign" class="right-align" data-align="right"></span>
|
||||
<span id="centerAlign" class="center-align" data-align="center"></span>
|
||||
</span>
|
||||
<input id="align" name="align" type="hidden" value="none"/>
|
||||
</div>
|
||||
<div id="tabbody" class="tabbody">
|
||||
|
||||
<!-- 远程图片 -->
|
||||
<div id="remote" class="panel">
|
||||
<div class="top">
|
||||
<div class="row">
|
||||
<label for="url"><var id="lang_input_url"></var></label>
|
||||
<span><input class="text" id="url" type="text"/></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="left">
|
||||
<div class="row">
|
||||
<label><var id="lang_input_size"></var></label>
|
||||
<span><var id="lang_input_width"> </var><input class="text" type="text" id="width"/>px </span>
|
||||
<span><var id="lang_input_height"> </var><input class="text" type="text" id="height"/>px </span>
|
||||
<span><input id="lock" type="checkbox" disabled="disabled"><span id="lockicon"></span></span>
|
||||
</div>
|
||||
<div class="row">
|
||||
<label><var id="lang_input_border"></var></label>
|
||||
<span><input class="text" type="text" id="border"/>px </span>
|
||||
</div>
|
||||
<div class="row">
|
||||
<label><var id="lang_input_vhspace"></var></label>
|
||||
<span><input class="text" type="text" id="vhSpace"/>px </span>
|
||||
</div>
|
||||
<div class="row">
|
||||
<label><var id="lang_input_title"></var></label>
|
||||
<span><input class="text" type="text" id="title"/></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right"><div id="preview"></div></div>
|
||||
</div>
|
||||
|
||||
<!-- 上传图片 -->
|
||||
<div id="upload" class="panel focus">
|
||||
<div id="queueList" class="queueList">
|
||||
<div class="statusBar element-invisible">
|
||||
<div class="progress">
|
||||
<span class="text">0%</span>
|
||||
<span class="percentage"></span>
|
||||
</div><div class="info"></div>
|
||||
<div class="btns">
|
||||
<div id="filePickerBtn"></div>
|
||||
<div class="uploadBtn"><var id="lang_start_upload"></var></div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="dndArea" class="placeholder">
|
||||
<div class="filePickerContainer">
|
||||
<div id="filePickerReady"></div>
|
||||
</div>
|
||||
</div>
|
||||
<ul class="filelist element-invisible">
|
||||
<li id="filePickerBlock" class="filePickerBlock"></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 在线图片 -->
|
||||
<div id="online" class="panel">
|
||||
<div id="imageList"><var id="lang_imgLoading"></var></div>
|
||||
</div>
|
||||
|
||||
<!-- 搜索图片 -->
|
||||
<div id="search" class="panel">
|
||||
<div class="searchBar">
|
||||
<input id="searchTxt" class="searchTxt text" type="text" />
|
||||
<select id="searchType" class="searchType">
|
||||
<option value="&s=4&z=0"></option>
|
||||
<option value="&s=1&z=19"></option>
|
||||
<option value="&s=2&z=0"></option>
|
||||
<option value="&s=3&z=0"></option>
|
||||
</select>
|
||||
<input id="searchReset" type="button" />
|
||||
<input id="searchBtn" type="button" />
|
||||
</div>
|
||||
<div id="searchList" class="searchList"><ul id="searchListUl"></ul></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/javascript" src="image.js"></script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
File diff suppressed because one or more lines are too long
|
|
@ -1,98 +1,98 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<title></title>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
<style type="text/css">
|
||||
.warp {width: 320px;height: 153px;margin-left:5px;padding: 20px 0 0 15px;position: relative;}
|
||||
#url {width: 290px; margin-bottom: 2px; margin-left: -6px; margin-left: -2px\9;*margin-left:0;_margin-left:0; }
|
||||
.format span{display: inline-block; width: 58px;text-align: center; zoom:1;}
|
||||
table td{padding:5px 0;}
|
||||
#align{width: 65px;height: 23px;line-height: 22px;}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="warp">
|
||||
<table width="300" cellpadding="0" cellspacing="0">
|
||||
<tr>
|
||||
<td colspan="2" class="format">
|
||||
<span><var id="lang_input_address"></var></span>
|
||||
<input style="width:200px" id="url" type="text" value=""/>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2" class="format"><span><var id="lang_input_width"></var></span><input style="width:200px" type="text" id="width"/> px</td>
|
||||
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2" class="format"><span><var id="lang_input_height"></var></span><input style="width:200px" type="text" id="height"/> px</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><span><var id="lang_input_isScroll"></var></span><input type="checkbox" id="scroll"/> </td>
|
||||
<td><span><var id="lang_input_frameborder"></var></span><input type="checkbox" id="frameborder"/> </td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td colspan="2"><span><var id="lang_input_alignMode"></var></span>
|
||||
<select id="align">
|
||||
<option value=""></option>
|
||||
<option value="left"></option>
|
||||
<option value="right"></option>
|
||||
</select>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
<script type="text/javascript">
|
||||
var iframe = editor._iframe;
|
||||
if(iframe){
|
||||
$G("url").value = iframe.getAttribute("src")||"";
|
||||
$G("width").value = iframe.getAttribute("width")||iframe.style.width.replace("px","")||"";
|
||||
$G("height").value = iframe.getAttribute("height") || iframe.style.height.replace("px","") ||"";
|
||||
$G("scroll").checked = (iframe.getAttribute("scrolling") == "yes") ? true : false;
|
||||
$G("frameborder").checked = (iframe.getAttribute("frameborder") == "1") ? true : false;
|
||||
$G("align").value = iframe.align ? iframe.align : "";
|
||||
}
|
||||
function queding(){
|
||||
var url = $G("url").value.replace(/^\s*|\s*$/ig,""),
|
||||
width = $G("width").value,
|
||||
height = $G("height").value,
|
||||
scroll = $G("scroll"),
|
||||
frameborder = $G("frameborder"),
|
||||
float = $G("align").value,
|
||||
newIframe = editor.document.createElement("iframe"),
|
||||
div;
|
||||
if(!url){
|
||||
alert(lang.enterAddress);
|
||||
return false;
|
||||
}
|
||||
newIframe.setAttribute("src",/http:\/\/|https:\/\//ig.test(url) ? url : "http://"+url);
|
||||
/^[1-9]+[.]?\d*$/g.test( width ) ? newIframe.setAttribute("width",width) : "";
|
||||
/^[1-9]+[.]?\d*$/g.test( height ) ? newIframe.setAttribute("height",height) : "";
|
||||
scroll.checked ? newIframe.setAttribute("scrolling","yes") : newIframe.setAttribute("scrolling","no");
|
||||
frameborder.checked ? newIframe.setAttribute("frameborder","1",0) : newIframe.setAttribute("frameborder","0",0);
|
||||
float ? newIframe.setAttribute("align",float) : newIframe.setAttribute("align","");
|
||||
if(iframe){
|
||||
iframe.parentNode.insertBefore(newIframe,iframe);
|
||||
domUtils.remove(iframe);
|
||||
}else{
|
||||
div = editor.document.createElement("div");
|
||||
div.appendChild(newIframe);
|
||||
editor.execCommand("inserthtml",div.innerHTML);
|
||||
}
|
||||
editor._iframe = null;
|
||||
dialog.close();
|
||||
}
|
||||
dialog.onok = queding;
|
||||
$G("url").onkeydown = function(evt){
|
||||
evt = evt || event;
|
||||
if(evt.keyCode == 13){
|
||||
queding();
|
||||
}
|
||||
};
|
||||
$focus($G( "url" ));
|
||||
|
||||
</script>
|
||||
</body>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<title></title>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
<style type="text/css">
|
||||
.warp {width: 320px;height: 153px;margin-left:5px;padding: 20px 0 0 15px;position: relative;}
|
||||
#url {width: 290px; margin-bottom: 2px; margin-left: -6px; margin-left: -2px\9;*margin-left:0;_margin-left:0; }
|
||||
.format span{display: inline-block; width: 58px;text-align: center; zoom:1;}
|
||||
table td{padding:5px 0;}
|
||||
#align{width: 65px;height: 23px;line-height: 22px;}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="warp">
|
||||
<table width="300" cellpadding="0" cellspacing="0">
|
||||
<tr>
|
||||
<td colspan="2" class="format">
|
||||
<span><var id="lang_input_address"></var></span>
|
||||
<input style="width:200px" id="url" type="text" value=""/>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2" class="format"><span><var id="lang_input_width"></var></span><input style="width:200px" type="text" id="width"/> px</td>
|
||||
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2" class="format"><span><var id="lang_input_height"></var></span><input style="width:200px" type="text" id="height"/> px</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><span><var id="lang_input_isScroll"></var></span><input type="checkbox" id="scroll"/> </td>
|
||||
<td><span><var id="lang_input_frameborder"></var></span><input type="checkbox" id="frameborder"/> </td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td colspan="2"><span><var id="lang_input_alignMode"></var></span>
|
||||
<select id="align">
|
||||
<option value=""></option>
|
||||
<option value="left"></option>
|
||||
<option value="right"></option>
|
||||
</select>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
<script type="text/javascript">
|
||||
var iframe = editor._iframe;
|
||||
if(iframe){
|
||||
$G("url").value = iframe.getAttribute("src")||"";
|
||||
$G("width").value = iframe.getAttribute("width")||iframe.style.width.replace("px","")||"";
|
||||
$G("height").value = iframe.getAttribute("height") || iframe.style.height.replace("px","") ||"";
|
||||
$G("scroll").checked = (iframe.getAttribute("scrolling") == "yes") ? true : false;
|
||||
$G("frameborder").checked = (iframe.getAttribute("frameborder") == "1") ? true : false;
|
||||
$G("align").value = iframe.align ? iframe.align : "";
|
||||
}
|
||||
function queding(){
|
||||
var url = $G("url").value.replace(/^\s*|\s*$/ig,""),
|
||||
width = $G("width").value,
|
||||
height = $G("height").value,
|
||||
scroll = $G("scroll"),
|
||||
frameborder = $G("frameborder"),
|
||||
float = $G("align").value,
|
||||
newIframe = editor.document.createElement("iframe"),
|
||||
div;
|
||||
if(!url){
|
||||
alert(lang.enterAddress);
|
||||
return false;
|
||||
}
|
||||
newIframe.setAttribute("src",/http:\/\/|https:\/\//ig.test(url) ? url : "http://"+url);
|
||||
/^[1-9]+[.]?\d*$/g.test( width ) ? newIframe.setAttribute("width",width) : "";
|
||||
/^[1-9]+[.]?\d*$/g.test( height ) ? newIframe.setAttribute("height",height) : "";
|
||||
scroll.checked ? newIframe.setAttribute("scrolling","yes") : newIframe.setAttribute("scrolling","no");
|
||||
frameborder.checked ? newIframe.setAttribute("frameborder","1",0) : newIframe.setAttribute("frameborder","0",0);
|
||||
float ? newIframe.setAttribute("align",float) : newIframe.setAttribute("align","");
|
||||
if(iframe){
|
||||
iframe.parentNode.insertBefore(newIframe,iframe);
|
||||
domUtils.remove(iframe);
|
||||
}else{
|
||||
div = editor.document.createElement("div");
|
||||
div.appendChild(newIframe);
|
||||
editor.execCommand("inserthtml",div.innerHTML);
|
||||
}
|
||||
editor._iframe = null;
|
||||
dialog.close();
|
||||
}
|
||||
dialog.onok = queding;
|
||||
$G("url").onkeydown = function(evt){
|
||||
evt = evt || event;
|
||||
if(evt.keyCode == 13){
|
||||
queding();
|
||||
}
|
||||
};
|
||||
$focus($G( "url" ));
|
||||
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,81 +1,81 @@
|
|||
(function () {
|
||||
var parent = window.parent;
|
||||
//dialog对象
|
||||
dialog = parent.$EDITORUI[window.frameElement.id.replace( /_iframe$/, '' )];
|
||||
//当前打开dialog的编辑器实例
|
||||
editor = dialog.editor;
|
||||
|
||||
UE = parent.UE;
|
||||
|
||||
domUtils = UE.dom.domUtils;
|
||||
|
||||
utils = UE.utils;
|
||||
|
||||
browser = UE.browser;
|
||||
|
||||
ajax = UE.ajax;
|
||||
|
||||
$G = function ( id ) {
|
||||
return document.getElementById( id )
|
||||
};
|
||||
//focus元素
|
||||
$focus = function ( node ) {
|
||||
setTimeout( function () {
|
||||
if ( browser.ie ) {
|
||||
var r = node.createTextRange();
|
||||
r.collapse( false );
|
||||
r.select();
|
||||
} else {
|
||||
node.focus()
|
||||
}
|
||||
}, 0 )
|
||||
};
|
||||
utils.loadFile(document,{
|
||||
href:editor.options.themePath + editor.options.theme + "/dialogbase.css?cache="+Math.random(),
|
||||
tag:"link",
|
||||
type:"text/css",
|
||||
rel:"stylesheet"
|
||||
});
|
||||
lang = editor.getLang(dialog.className.split( "-" )[2]);
|
||||
if(lang){
|
||||
domUtils.on(window,'load',function () {
|
||||
|
||||
var langImgPath = editor.options.langPath + editor.options.lang + "/images/";
|
||||
//针对静态资源
|
||||
for ( var i in lang["static"] ) {
|
||||
var dom = $G( i );
|
||||
if(!dom) continue;
|
||||
var tagName = dom.tagName,
|
||||
content = lang["static"][i];
|
||||
if(content.src){
|
||||
//clone
|
||||
content = utils.extend({},content,false);
|
||||
content.src = langImgPath + content.src;
|
||||
}
|
||||
if(content.style){
|
||||
content = utils.extend({},content,false);
|
||||
content.style = content.style.replace(/url\s*\(/g,"url(" + langImgPath)
|
||||
}
|
||||
switch ( tagName.toLowerCase() ) {
|
||||
case "var":
|
||||
dom.parentNode.replaceChild( document.createTextNode( content ), dom );
|
||||
break;
|
||||
case "select":
|
||||
var ops = dom.options;
|
||||
for ( var j = 0, oj; oj = ops[j]; ) {
|
||||
oj.innerHTML = content.options[j++];
|
||||
}
|
||||
for ( var p in content ) {
|
||||
p != "options" && dom.setAttribute( p, content[p] );
|
||||
}
|
||||
break;
|
||||
default :
|
||||
domUtils.setAttributes( dom, content);
|
||||
}
|
||||
}
|
||||
} );
|
||||
}
|
||||
|
||||
|
||||
})();
|
||||
|
||||
(function () {
|
||||
var parent = window.parent;
|
||||
//dialog对象
|
||||
dialog = parent.$EDITORUI[window.frameElement.id.replace( /_iframe$/, '' )];
|
||||
//当前打开dialog的编辑器实例
|
||||
editor = dialog.editor;
|
||||
|
||||
UE = parent.UE;
|
||||
|
||||
domUtils = UE.dom.domUtils;
|
||||
|
||||
utils = UE.utils;
|
||||
|
||||
browser = UE.browser;
|
||||
|
||||
ajax = UE.ajax;
|
||||
|
||||
$G = function ( id ) {
|
||||
return document.getElementById( id )
|
||||
};
|
||||
//focus元素
|
||||
$focus = function ( node ) {
|
||||
setTimeout( function () {
|
||||
if ( browser.ie ) {
|
||||
var r = node.createTextRange();
|
||||
r.collapse( false );
|
||||
r.select();
|
||||
} else {
|
||||
node.focus()
|
||||
}
|
||||
}, 0 )
|
||||
};
|
||||
utils.loadFile(document,{
|
||||
href:editor.options.themePath + editor.options.theme + "/dialogbase.css?cache="+Math.random(),
|
||||
tag:"link",
|
||||
type:"text/css",
|
||||
rel:"stylesheet"
|
||||
});
|
||||
lang = editor.getLang(dialog.className.split( "-" )[2]);
|
||||
if(lang){
|
||||
domUtils.on(window,'load',function () {
|
||||
|
||||
var langImgPath = editor.options.langPath + editor.options.lang + "/images/";
|
||||
//针对静态资源
|
||||
for ( var i in lang["static"] ) {
|
||||
var dom = $G( i );
|
||||
if(!dom) continue;
|
||||
var tagName = dom.tagName,
|
||||
content = lang["static"][i];
|
||||
if(content.src){
|
||||
//clone
|
||||
content = utils.extend({},content,false);
|
||||
content.src = langImgPath + content.src;
|
||||
}
|
||||
if(content.style){
|
||||
content = utils.extend({},content,false);
|
||||
content.style = content.style.replace(/url\s*\(/g,"url(" + langImgPath)
|
||||
}
|
||||
switch ( tagName.toLowerCase() ) {
|
||||
case "var":
|
||||
dom.parentNode.replaceChild( document.createTextNode( content ), dom );
|
||||
break;
|
||||
case "select":
|
||||
var ops = dom.options;
|
||||
for ( var j = 0, oj; oj = ops[j]; ) {
|
||||
oj.innerHTML = content.options[j++];
|
||||
}
|
||||
for ( var p in content ) {
|
||||
p != "options" && dom.setAttribute( p, content[p] );
|
||||
}
|
||||
break;
|
||||
default :
|
||||
domUtils.setAttributes( dom, content);
|
||||
}
|
||||
}
|
||||
} );
|
||||
}
|
||||
|
||||
|
||||
})();
|
||||
|
||||
|
|
|
|||
|
|
@ -1,126 +1,126 @@
|
|||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
|
||||
"http://www.w3.org/TR/html4/loose.dtd">
|
||||
<html>
|
||||
<head>
|
||||
<title></title>
|
||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
<style type="text/css">
|
||||
*{margin:0;padding:0;color: #838383;}
|
||||
table{font-size: 12px;margin: 10px;line-height: 30px}
|
||||
.txt{width:300px;height:21px;line-height:21px;border:1px solid #d7d7d7;}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<table>
|
||||
<tr>
|
||||
<td><label for="text"> <var id="lang_input_text"></var></label></td>
|
||||
<td><input class="txt" id="text" type="text" disabled="true"/></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><label for="href"> <var id="lang_input_url"></var></label></td>
|
||||
<td><input class="txt" id="href" type="text" /></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><label for="title"> <var id="lang_input_title"></var></label></td>
|
||||
<td><input class="txt" id="title" type="text"/></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2">
|
||||
<label for="target"><var id="lang_input_target"></var></label>
|
||||
<input id="target" type="checkbox"/>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2" id="msg"></td>
|
||||
</tr>
|
||||
</table>
|
||||
<script type="text/javascript">
|
||||
var range = editor.selection.getRange(),
|
||||
link = range.collapsed ? editor.queryCommandValue( "link" ) : editor.selection.getStart(),
|
||||
url,
|
||||
text = $G('text'),
|
||||
rangeLink = domUtils.findParentByTagName(range.getCommonAncestor(),'a',true),
|
||||
orgText;
|
||||
link = domUtils.findParentByTagName( link, "a", true );
|
||||
if(link){
|
||||
url = utils.html(link.getAttribute( '_href' ) || link.getAttribute( 'href', 2 ));
|
||||
|
||||
if(rangeLink === link && !link.getElementsByTagName('img').length){
|
||||
text.removeAttribute('disabled');
|
||||
orgText = text.value = link[browser.ie ? 'innerText':'textContent'];
|
||||
}else{
|
||||
text.setAttribute('disabled','true');
|
||||
text.value = lang.validLink;
|
||||
}
|
||||
|
||||
}else{
|
||||
if(range.collapsed){
|
||||
text.removeAttribute('disabled');
|
||||
text.value = '';
|
||||
}else{
|
||||
text.setAttribute('disabled','true');
|
||||
text.value = lang.validLink;
|
||||
}
|
||||
|
||||
}
|
||||
$G("title").value = url ? link.title : "";
|
||||
$G("href").value = url ? url: '';
|
||||
$G("target").checked = url && link.target == "_blank" ? true : false;
|
||||
$focus($G("href"));
|
||||
|
||||
function handleDialogOk(){
|
||||
var href =$G('href').value.replace(/^\s+|\s+$/g, '');
|
||||
if(href){
|
||||
if(!hrefStartWith(href,["http","/","ftp://",'#'])) {
|
||||
href = "http://" + href;
|
||||
}
|
||||
var obj = {
|
||||
'href' : href,
|
||||
'target' : $G("target").checked ? "_blank" : '_self',
|
||||
'title' : $G("title").value.replace(/^\s+|\s+$/g, ''),
|
||||
'_href':href
|
||||
};
|
||||
//修改链接内容的情况太特殊了，所以先做到这里了
|
||||
//todo:情况多的时候，做到command里
|
||||
if(orgText && text.value != orgText){
|
||||
link[browser.ie ? 'innerText' : 'textContent'] = obj.textValue = text.value;
|
||||
range.selectNode(link).select()
|
||||
}
|
||||
if(range.collapsed){
|
||||
obj.textValue = text.value;
|
||||
}
|
||||
editor.execCommand('link',utils.clearEmptyAttrs(obj) );
|
||||
dialog.close();
|
||||
}
|
||||
}
|
||||
dialog.onok = handleDialogOk;
|
||||
$G('href').onkeydown = $G('title').onkeydown = function(evt){
|
||||
evt = evt || window.event;
|
||||
if (evt.keyCode == 13) {
|
||||
handleDialogOk();
|
||||
return false;
|
||||
}
|
||||
};
|
||||
$G('href').onblur = function(){
|
||||
if(!hrefStartWith(this.value,["http","/","ftp://",'#'])){
|
||||
$G("msg").innerHTML = "<span style='color: red'>"+lang.httpPrompt+"</span>";
|
||||
}else{
|
||||
$G("msg").innerHTML = "";
|
||||
}
|
||||
};
|
||||
|
||||
function hrefStartWith(href,arr){
|
||||
href = href.replace(/^\s+|\s+$/g, '');
|
||||
for(var i=0,ai;ai=arr[i++];){
|
||||
if(href.indexOf(ai)==0){
|
||||
return true;
|
||||
}
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
|
||||
"http://www.w3.org/TR/html4/loose.dtd">
|
||||
<html>
|
||||
<head>
|
||||
<title></title>
|
||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
<style type="text/css">
|
||||
*{margin:0;padding:0;color: #838383;}
|
||||
table{font-size: 12px;margin: 10px;line-height: 30px}
|
||||
.txt{width:300px;height:21px;line-height:21px;border:1px solid #d7d7d7;}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<table>
|
||||
<tr>
|
||||
<td><label for="text"> <var id="lang_input_text"></var></label></td>
|
||||
<td><input class="txt" id="text" type="text" disabled="true"/></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><label for="href"> <var id="lang_input_url"></var></label></td>
|
||||
<td><input class="txt" id="href" type="text" /></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><label for="title"> <var id="lang_input_title"></var></label></td>
|
||||
<td><input class="txt" id="title" type="text"/></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2">
|
||||
<label for="target"><var id="lang_input_target"></var></label>
|
||||
<input id="target" type="checkbox"/>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2" id="msg"></td>
|
||||
</tr>
|
||||
</table>
|
||||
<script type="text/javascript">
|
||||
var range = editor.selection.getRange(),
|
||||
link = range.collapsed ? editor.queryCommandValue( "link" ) : editor.selection.getStart(),
|
||||
url,
|
||||
text = $G('text'),
|
||||
rangeLink = domUtils.findParentByTagName(range.getCommonAncestor(),'a',true),
|
||||
orgText;
|
||||
link = domUtils.findParentByTagName( link, "a", true );
|
||||
if(link){
|
||||
url = utils.html(link.getAttribute( '_href' ) || link.getAttribute( 'href', 2 ));
|
||||
|
||||
if(rangeLink === link && !link.getElementsByTagName('img').length){
|
||||
text.removeAttribute('disabled');
|
||||
orgText = text.value = link[browser.ie ? 'innerText':'textContent'];
|
||||
}else{
|
||||
text.setAttribute('disabled','true');
|
||||
text.value = lang.validLink;
|
||||
}
|
||||
|
||||
}else{
|
||||
if(range.collapsed){
|
||||
text.removeAttribute('disabled');
|
||||
text.value = '';
|
||||
}else{
|
||||
text.setAttribute('disabled','true');
|
||||
text.value = lang.validLink;
|
||||
}
|
||||
|
||||
}
|
||||
$G("title").value = url ? link.title : "";
|
||||
$G("href").value = url ? url: '';
|
||||
$G("target").checked = url && link.target == "_blank" ? true : false;
|
||||
$focus($G("href"));
|
||||
|
||||
function handleDialogOk(){
|
||||
var href =$G('href').value.replace(/^\s+|\s+$/g, '');
|
||||
if(href){
|
||||
if(!hrefStartWith(href,["http","/","ftp://",'#'])) {
|
||||
href = "http://" + href;
|
||||
}
|
||||
var obj = {
|
||||
'href' : href,
|
||||
'target' : $G("target").checked ? "_blank" : '_self',
|
||||
'title' : $G("title").value.replace(/^\s+|\s+$/g, ''),
|
||||
'_href':href
|
||||
};
|
||||
//修改链接内容的情况太特殊了，所以先做到这里了
|
||||
//todo:情况多的时候，做到command里
|
||||
if(orgText && text.value != orgText){
|
||||
link[browser.ie ? 'innerText' : 'textContent'] = obj.textValue = text.value;
|
||||
range.selectNode(link).select()
|
||||
}
|
||||
if(range.collapsed){
|
||||
obj.textValue = text.value;
|
||||
}
|
||||
editor.execCommand('link',utils.clearEmptyAttrs(obj) );
|
||||
dialog.close();
|
||||
}
|
||||
}
|
||||
dialog.onok = handleDialogOk;
|
||||
$G('href').onkeydown = $G('title').onkeydown = function(evt){
|
||||
evt = evt || window.event;
|
||||
if (evt.keyCode == 13) {
|
||||
handleDialogOk();
|
||||
return false;
|
||||
}
|
||||
};
|
||||
$G('href').onblur = function(){
|
||||
if(!hrefStartWith(this.value,["http","/","ftp://",'#'])){
|
||||
$G("msg").innerHTML = "<span style='color: red'>"+lang.httpPrompt+"</span>";
|
||||
}else{
|
||||
$G("msg").innerHTML = "";
|
||||
}
|
||||
};
|
||||
|
||||
function hrefStartWith(href,arr){
|
||||
href = href.replace(/^\s+|\s+$/g, '');
|
||||
for(var i=0,ai;ai=arr[i++];){
|
||||
if(href.indexOf(ai)==0){
|
||||
return true;
|
||||
}
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -1,135 +1,135 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
||||
<title></title>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.1&services=true"></script>
|
||||
<style type="text/css">
|
||||
.content{width:530px; height: 350px;margin: 10px auto;}
|
||||
.content table{width: 100%}
|
||||
.content table td{vertical-align: middle;}
|
||||
#city,#address{height:21px;background: #FFF;border:1px solid #d7d7d7; line-height: 21px;}
|
||||
#city{width:60px}
|
||||
#address{width:130px}
|
||||
#is_dynamic_label span{vertical-align:middle;margin: 3px 0px 3px 3px;}
|
||||
#is_dynamic_label input{vertical-align:middle;margin: 3px 3px 3px 50px;}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="content">
|
||||
<table>
|
||||
<tr>
|
||||
<td><var id="lang_city"></var>:</td>
|
||||
<td><input id="city" type="text" /></td>
|
||||
<td><var id="lang_address"></var>:</td>
|
||||
<td><input id="address" type="text" value="" /></td>
|
||||
<td><a href="javascript:doSearch()" class="button"><var id="lang_search"></var></a></td>
|
||||
<td><label id="is_dynamic_label" for="is_dynamic"><input id="is_dynamic" type="checkbox" name="is_dynamic" /><span><var id="lang_dynamicmap"></var></span></label></td>
|
||||
</tr>
|
||||
</table>
|
||||
<div style="width:100%;height:340px;margin:5px auto;border:1px solid gray" id="container"></div>
|
||||
|
||||
</div>
|
||||
<script type="text/javascript">
|
||||
var map = new BMap.Map("container"),marker,point,styleStr;
|
||||
map.enableScrollWheelZoom();
|
||||
map.enableContinuousZoom();
|
||||
function doSearch(){
|
||||
if (!document.getElementById('city').value) {
|
||||
alert(lang.cityMsg);
|
||||
return;
|
||||
}
|
||||
var search = new BMap.LocalSearch(document.getElementById('city').value, {
|
||||
onSearchComplete: function (results){
|
||||
if (results && results.getNumPois()) {
|
||||
var points = [];
|
||||
for (var i=0; i<results.getCurrentNumPois(); i++) {
|
||||
points.push(results.getPoi(i).point);
|
||||
}
|
||||
if (points.length > 1) {
|
||||
map.setViewport(points);
|
||||
} else {
|
||||
map.centerAndZoom(points[0], 13);
|
||||
}
|
||||
point = map.getCenter();
|
||||
marker.setPoint(point);
|
||||
} else {
|
||||
alert(lang.errorMsg);
|
||||
}
|
||||
}
|
||||
});
|
||||
search.search(document.getElementById('address').value || document.getElementById('city').value);
|
||||
}
|
||||
//获得参数
|
||||
function getPars(str,par){
|
||||
var reg = new RegExp(par+"=((\\d+|[.,])*)","g");
|
||||
return reg.exec(str)[1];
|
||||
}
|
||||
function init(){
|
||||
var mapNode = editor.selection.getRange().getClosedNode(),
|
||||
isMapImg = mapNode && /api[.]map[.]baidu[.]com/ig.test(mapNode.getAttribute("src")),
|
||||
isMapIframe = mapNode && domUtils.hasClass(mapNode, 'ueditor_baidumap');
|
||||
if(isMapImg || isMapIframe){
|
||||
var url, centerPos, markerPos;
|
||||
if(isMapIframe) {
|
||||
url = decodeURIComponent(mapNode.getAttribute("src"));
|
||||
$G('is_dynamic').checked = true;
|
||||
styleStr = mapNode.style.cssText;
|
||||
} else {
|
||||
url = mapNode.getAttribute("src");
|
||||
styleStr = mapNode.style.cssText;
|
||||
}
|
||||
|
||||
centerPos = getPars(url,"center").split(",");
|
||||
markerPos = getPars(url, "markers").split(",");
|
||||
point = new BMap.Point(Number(centerPos[0]),Number(centerPos[1]));
|
||||
marker = new BMap.Marker(new BMap.Point(Number(markerPos[0]), Number(markerPos[1])));
|
||||
map.addControl(new BMap.NavigationControl());
|
||||
map.centerAndZoom(point, Number(getPars(url,"zoom")));
|
||||
}else{
|
||||
point = new BMap.Point(116.404, 39.915); // 创建点坐标
|
||||
marker = new BMap.Marker(point);
|
||||
map.addControl(new BMap.NavigationControl());
|
||||
map.centerAndZoom(point, 10); // 初始化地图,设置中心点坐标和地图级别。
|
||||
}
|
||||
marker.enableDragging();
|
||||
map.addOverlay(marker);
|
||||
}
|
||||
init();
|
||||
document.getElementById('address').onkeydown = function (evt){
|
||||
evt = evt || event;
|
||||
if (evt.keyCode == 13) {
|
||||
doSearch();
|
||||
}
|
||||
};
|
||||
dialog.onok = function (){
|
||||
var center = map.getCenter();
|
||||
var zoom = map.zoomLevel;
|
||||
var size = map.getSize();
|
||||
var mapWidth = size.width;
|
||||
var mapHeight = size.height;
|
||||
var point = marker.getPoint();
|
||||
|
||||
if($G('is_dynamic').checked) {
|
||||
var URL = editor.options.UEDITOR_HOME_URL,
|
||||
url = [URL + (/\/$/.test(URL) ? '':'/') + "dialogs/map/show.html" +
|
||||
'#center=' + center.lng + ',' + center.lat,
|
||||
'&zoom=' + zoom,
|
||||
'&width=' + mapWidth,
|
||||
'&height=' + mapHeight,
|
||||
'&markers=' + point.lng + ',' + point.lat,
|
||||
'&markerStyles=' + 'l,A'].join('');
|
||||
editor.execCommand('inserthtml', '<iframe class="ueditor_baidumap" src="' + url + '"' + (styleStr ? ' style="' + styleStr + '"' :'') + ' frameborder="0" width="' + (mapWidth+4) + '" height="' + (mapHeight+4) + '"></iframe>');
|
||||
} else {
|
||||
var url = "http://api.map.baidu.com/staticimage?center=" + center.lng + ',' + center.lat +
|
||||
"&zoom=" + zoom + "&width=" + size.width + '&height=' + size.height + "&markers=" + point.lng + ',' + point.lat;
|
||||
editor.execCommand('inserthtml', '<img width="'+ size.width +'"height="'+ size.height +'" src="' + url + '"' + (styleStr ? ' style="' + styleStr + '"' :'') + '/>');
|
||||
}
|
||||
};
|
||||
document.getElementById("address").focus();
|
||||
</script>
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
||||
<title></title>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.1&services=true"></script>
|
||||
<style type="text/css">
|
||||
.content{width:530px; height: 350px;margin: 10px auto;}
|
||||
.content table{width: 100%}
|
||||
.content table td{vertical-align: middle;}
|
||||
#city,#address{height:21px;background: #FFF;border:1px solid #d7d7d7; line-height: 21px;}
|
||||
#city{width:60px}
|
||||
#address{width:130px}
|
||||
#is_dynamic_label span{vertical-align:middle;margin: 3px 0px 3px 3px;}
|
||||
#is_dynamic_label input{vertical-align:middle;margin: 3px 3px 3px 50px;}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="content">
|
||||
<table>
|
||||
<tr>
|
||||
<td><var id="lang_city"></var>:</td>
|
||||
<td><input id="city" type="text" /></td>
|
||||
<td><var id="lang_address"></var>:</td>
|
||||
<td><input id="address" type="text" value="" /></td>
|
||||
<td><a href="javascript:doSearch()" class="button"><var id="lang_search"></var></a></td>
|
||||
<td><label id="is_dynamic_label" for="is_dynamic"><input id="is_dynamic" type="checkbox" name="is_dynamic" /><span><var id="lang_dynamicmap"></var></span></label></td>
|
||||
</tr>
|
||||
</table>
|
||||
<div style="width:100%;height:340px;margin:5px auto;border:1px solid gray" id="container"></div>
|
||||
|
||||
</div>
|
||||
<script type="text/javascript">
|
||||
var map = new BMap.Map("container"),marker,point,styleStr;
|
||||
map.enableScrollWheelZoom();
|
||||
map.enableContinuousZoom();
|
||||
function doSearch(){
|
||||
if (!document.getElementById('city').value) {
|
||||
alert(lang.cityMsg);
|
||||
return;
|
||||
}
|
||||
var search = new BMap.LocalSearch(document.getElementById('city').value, {
|
||||
onSearchComplete: function (results){
|
||||
if (results && results.getNumPois()) {
|
||||
var points = [];
|
||||
for (var i=0; i<results.getCurrentNumPois(); i++) {
|
||||
points.push(results.getPoi(i).point);
|
||||
}
|
||||
if (points.length > 1) {
|
||||
map.setViewport(points);
|
||||
} else {
|
||||
map.centerAndZoom(points[0], 13);
|
||||
}
|
||||
point = map.getCenter();
|
||||
marker.setPoint(point);
|
||||
} else {
|
||||
alert(lang.errorMsg);
|
||||
}
|
||||
}
|
||||
});
|
||||
search.search(document.getElementById('address').value || document.getElementById('city').value);
|
||||
}
|
||||
//获得参数
|
||||
function getPars(str,par){
|
||||
var reg = new RegExp(par+"=((\\d+|[.,])*)","g");
|
||||
return reg.exec(str)[1];
|
||||
}
|
||||
function init(){
|
||||
var mapNode = editor.selection.getRange().getClosedNode(),
|
||||
isMapImg = mapNode && /api[.]map[.]baidu[.]com/ig.test(mapNode.getAttribute("src")),
|
||||
isMapIframe = mapNode && domUtils.hasClass(mapNode, 'ueditor_baidumap');
|
||||
if(isMapImg || isMapIframe){
|
||||
var url, centerPos, markerPos;
|
||||
if(isMapIframe) {
|
||||
url = decodeURIComponent(mapNode.getAttribute("src"));
|
||||
$G('is_dynamic').checked = true;
|
||||
styleStr = mapNode.style.cssText;
|
||||
} else {
|
||||
url = mapNode.getAttribute("src");
|
||||
styleStr = mapNode.style.cssText;
|
||||
}
|
||||
|
||||
centerPos = getPars(url,"center").split(",");
|
||||
markerPos = getPars(url, "markers").split(",");
|
||||
point = new BMap.Point(Number(centerPos[0]),Number(centerPos[1]));
|
||||
marker = new BMap.Marker(new BMap.Point(Number(markerPos[0]), Number(markerPos[1])));
|
||||
map.addControl(new BMap.NavigationControl());
|
||||
map.centerAndZoom(point, Number(getPars(url,"zoom")));
|
||||
}else{
|
||||
point = new BMap.Point(116.404, 39.915); // 创建点坐标
|
||||
marker = new BMap.Marker(point);
|
||||
map.addControl(new BMap.NavigationControl());
|
||||
map.centerAndZoom(point, 10); // 初始化地图,设置中心点坐标和地图级别。
|
||||
}
|
||||
marker.enableDragging();
|
||||
map.addOverlay(marker);
|
||||
}
|
||||
init();
|
||||
document.getElementById('address').onkeydown = function (evt){
|
||||
evt = evt || event;
|
||||
if (evt.keyCode == 13) {
|
||||
doSearch();
|
||||
}
|
||||
};
|
||||
dialog.onok = function (){
|
||||
var center = map.getCenter();
|
||||
var zoom = map.zoomLevel;
|
||||
var size = map.getSize();
|
||||
var mapWidth = size.width;
|
||||
var mapHeight = size.height;
|
||||
var point = marker.getPoint();
|
||||
|
||||
if($G('is_dynamic').checked) {
|
||||
var URL = editor.options.UEDITOR_HOME_URL,
|
||||
url = [URL + (/\/$/.test(URL) ? '':'/') + "dialogs/map/show.html" +
|
||||
'#center=' + center.lng + ',' + center.lat,
|
||||
'&zoom=' + zoom,
|
||||
'&width=' + mapWidth,
|
||||
'&height=' + mapHeight,
|
||||
'&markers=' + point.lng + ',' + point.lat,
|
||||
'&markerStyles=' + 'l,A'].join('');
|
||||
editor.execCommand('inserthtml', '<iframe class="ueditor_baidumap" src="' + url + '"' + (styleStr ? ' style="' + styleStr + '"' :'') + ' frameborder="0" width="' + (mapWidth+4) + '" height="' + (mapHeight+4) + '"></iframe>');
|
||||
} else {
|
||||
var url = "http://api.map.baidu.com/staticimage?center=" + center.lng + ',' + center.lat +
|
||||
"&zoom=" + zoom + "&width=" + size.width + '&height=' + size.height + "&markers=" + point.lng + ',' + point.lat;
|
||||
editor.execCommand('inserthtml', '<img width="'+ size.width +'"height="'+ size.height +'" src="' + url + '"' + (styleStr ? ' style="' + styleStr + '"' :'') + '/>');
|
||||
}
|
||||
};
|
||||
document.getElementById("address").focus();
|
||||
</script>
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -1,30 +1,30 @@
|
|||
.wrapper{margin: 5px 10px;}
|
||||
|
||||
.searchBar{height:30px;padding:7px 0 3px;text-align:center;}
|
||||
.searchBtn{font-size:13px;height:24px;}
|
||||
|
||||
.resultBar{width:460px;margin:5px auto;border: 1px solid #CCC;border-radius: 5px;box-shadow: 2px 2px 5px #D3D6DA;overflow: hidden;}
|
||||
|
||||
.listPanel{overflow: hidden;}
|
||||
.panelon{display:block;}
|
||||
.paneloff{display:none}
|
||||
|
||||
.page{width:220px;margin:20px auto;overflow: hidden;}
|
||||
.pageon{float:right;width:24px;line-height:24px;height:24px;margin-right: 5px;background: none;border: none;color: #000;font-weight: bold;text-align:center}
|
||||
.pageoff{float:right;width:24px;line-height:24px;height:24px;cursor:pointer;background-color: #fff;
|
||||
border: 1px solid #E7ECF0;color: #2D64B3;margin-right: 5px;text-decoration: none;text-align:center;}
|
||||
|
||||
.m-box{width:460px;}
|
||||
.m-m{float: left;line-height: 20px;height: 20px;}
|
||||
.m-h{height:24px;line-height:24px;padding-left: 46px;background-color:#FAFAFA;border-bottom: 1px solid #DAD8D8;font-weight: bold;font-size: 12px;color: #333;}
|
||||
.m-l{float:left;width:40px; }
|
||||
.m-t{float:left;width:140px;}
|
||||
.m-s{float:left;width:110px;}
|
||||
.m-z{float:left;width:100px;}
|
||||
.m-try-t{float: left;width: 60px;;}
|
||||
|
||||
.m-try{float:left;width:20px;height:20px;background:url('http://static.tieba.baidu.com/tb/editor/images/try_music.gif') no-repeat ;}
|
||||
.m-trying{float:left;width:20px;height:20px;background:url('http://static.tieba.baidu.com/tb/editor/images/stop_music.gif') no-repeat ;}
|
||||
|
||||
.loading{width:95px;height:7px;font-size:7px;margin:60px auto;background:url(http://static.tieba.baidu.com/tb/editor/images/loading.gif) no-repeat}
|
||||
.wrapper{margin: 5px 10px;}
|
||||
|
||||
.searchBar{height:30px;padding:7px 0 3px;text-align:center;}
|
||||
.searchBtn{font-size:13px;height:24px;}
|
||||
|
||||
.resultBar{width:460px;margin:5px auto;border: 1px solid #CCC;border-radius: 5px;box-shadow: 2px 2px 5px #D3D6DA;overflow: hidden;}
|
||||
|
||||
.listPanel{overflow: hidden;}
|
||||
.panelon{display:block;}
|
||||
.paneloff{display:none}
|
||||
|
||||
.page{width:220px;margin:20px auto;overflow: hidden;}
|
||||
.pageon{float:right;width:24px;line-height:24px;height:24px;margin-right: 5px;background: none;border: none;color: #000;font-weight: bold;text-align:center}
|
||||
.pageoff{float:right;width:24px;line-height:24px;height:24px;cursor:pointer;background-color: #fff;
|
||||
border: 1px solid #E7ECF0;color: #2D64B3;margin-right: 5px;text-decoration: none;text-align:center;}
|
||||
|
||||
.m-box{width:460px;}
|
||||
.m-m{float: left;line-height: 20px;height: 20px;}
|
||||
.m-h{height:24px;line-height:24px;padding-left: 46px;background-color:#FAFAFA;border-bottom: 1px solid #DAD8D8;font-weight: bold;font-size: 12px;color: #333;}
|
||||
.m-l{float:left;width:40px; }
|
||||
.m-t{float:left;width:140px;}
|
||||
.m-s{float:left;width:110px;}
|
||||
.m-z{float:left;width:100px;}
|
||||
.m-try-t{float: left;width: 60px;;}
|
||||
|
||||
.m-try{float:left;width:20px;height:20px;background:url('http://static.tieba.baidu.com/tb/editor/images/try_music.gif') no-repeat ;}
|
||||
.m-trying{float:left;width:20px;height:20px;background:url('http://static.tieba.baidu.com/tb/editor/images/stop_music.gif') no-repeat ;}
|
||||
|
||||
.loading{width:95px;height:7px;font-size:7px;margin:60px auto;background:url(http://static.tieba.baidu.com/tb/editor/images/loading.gif) no-repeat}
|
||||
.empty{width:300px;height:40px;padding:2px;margin:50px auto;line-height:40px; color:#006699;text-align:center;}
|
||||
|
|
@ -1,32 +1,32 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta http-equiv="content-type" content="text/html; charset=utf-8">
|
||||
<title>插入音乐</title>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="music.css">
|
||||
</head>
|
||||
<body>
|
||||
<div class="wrapper">
|
||||
<div class="searchBar">
|
||||
<input id="J_searchName" type="text"/>
|
||||
<input type="button" class="searchBtn" id="J_searchBtn">
|
||||
</div>
|
||||
<div class="resultBar" id="J_resultBar">
|
||||
<div class="loading" style="display:none"></div>
|
||||
<div class="empty"><var id="lang_input_tips"></var></div>
|
||||
</div>
|
||||
<div id="J_preview"></div>
|
||||
</div>
|
||||
<script type="text/javascript" src="music.js"></script>
|
||||
<script type="text/javascript">
|
||||
var music = new Music;
|
||||
dialog.onok = function () {
|
||||
music.exec();
|
||||
};
|
||||
dialog.oncancel = function () {
|
||||
$G('J_preview').innerHTML = "";
|
||||
};
|
||||
</script>
|
||||
</body>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta http-equiv="content-type" content="text/html; charset=utf-8">
|
||||
<title>插入音乐</title>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="music.css">
|
||||
</head>
|
||||
<body>
|
||||
<div class="wrapper">
|
||||
<div class="searchBar">
|
||||
<input id="J_searchName" type="text"/>
|
||||
<input type="button" class="searchBtn" id="J_searchBtn">
|
||||
</div>
|
||||
<div class="resultBar" id="J_resultBar">
|
||||
<div class="loading" style="display:none"></div>
|
||||
<div class="empty"><var id="lang_input_tips"></var></div>
|
||||
</div>
|
||||
<div id="J_preview"></div>
|
||||
</div>
|
||||
<script type="text/javascript" src="music.js"></script>
|
||||
<script type="text/javascript">
|
||||
var music = new Music;
|
||||
dialog.onok = function () {
|
||||
music.exec();
|
||||
};
|
||||
dialog.oncancel = function () {
|
||||
$G('J_preview').innerHTML = "";
|
||||
};
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,192 +1,192 @@
|
|||
function Music() {
|
||||
this.init();
|
||||
}
|
||||
(function () {
|
||||
var pages = [],
|
||||
panels = [],
|
||||
selectedItem = null;
|
||||
Music.prototype = {
|
||||
total:70,
|
||||
pageSize:10,
|
||||
dataUrl:"http://tingapi.ting.baidu.com/v1/restserver/ting?method=baidu.ting.search.common",
|
||||
playerUrl:"http://box.baidu.com/widget/flash/bdspacesong.swf",
|
||||
|
||||
init:function () {
|
||||
var me = this;
|
||||
domUtils.on($G("J_searchName"), "keyup", function (event) {
|
||||
var e = window.event || event;
|
||||
if (e.keyCode == 13) {
|
||||
me.dosearch();
|
||||
}
|
||||
});
|
||||
domUtils.on($G("J_searchBtn"), "click", function () {
|
||||
me.dosearch();
|
||||
});
|
||||
},
|
||||
callback:function (data) {
|
||||
var me = this;
|
||||
me.data = data.song_list;
|
||||
setTimeout(function () {
|
||||
$G('J_resultBar').innerHTML = me._renderTemplate(data.song_list);
|
||||
}, 300);
|
||||
},
|
||||
dosearch:function () {
|
||||
var me = this;
|
||||
selectedItem = null;
|
||||
var key = $G('J_searchName').value;
|
||||
if (utils.trim(key) == "")return false;
|
||||
key = encodeURIComponent(key);
|
||||
me._sent(key);
|
||||
},
|
||||
doselect:function (i) {
|
||||
var me = this;
|
||||
if (typeof i == 'object') {
|
||||
selectedItem = i;
|
||||
} else if (typeof i == 'number') {
|
||||
selectedItem = me.data[i];
|
||||
}
|
||||
},
|
||||
onpageclick:function (id) {
|
||||
var me = this;
|
||||
for (var i = 0; i < pages.length; i++) {
|
||||
$G(pages[i]).className = 'pageoff';
|
||||
$G(panels[i]).className = 'paneloff';
|
||||
}
|
||||
$G('page' + id).className = 'pageon';
|
||||
$G('panel' + id).className = 'panelon';
|
||||
},
|
||||
listenTest:function (elem) {
|
||||
var me = this,
|
||||
view = $G('J_preview'),
|
||||
is_play_action = (elem.className == 'm-try'),
|
||||
old_trying = me._getTryingElem();
|
||||
|
||||
if (old_trying) {
|
||||
old_trying.className = 'm-try';
|
||||
view.innerHTML = '';
|
||||
}
|
||||
if (is_play_action) {
|
||||
elem.className = 'm-trying';
|
||||
view.innerHTML = me._buildMusicHtml(me._getUrl(true));
|
||||
}
|
||||
},
|
||||
_sent:function (param) {
|
||||
var me = this;
|
||||
$G('J_resultBar').innerHTML = '<div class="loading"></div>';
|
||||
|
||||
utils.loadFile(document, {
|
||||
src:me.dataUrl + '&query=' + param + '&page_size=' + me.total + '&callback=music.callback&.r=' + Math.random(),
|
||||
tag:"script",
|
||||
type:"text/javascript",
|
||||
defer:"defer"
|
||||
});
|
||||
},
|
||||
_removeHtml:function (str) {
|
||||
var reg = /<\s*\/?\s*[^>]*\s*>/gi;
|
||||
return str.replace(reg, "");
|
||||
},
|
||||
_getUrl:function (isTryListen) {
|
||||
var me = this;
|
||||
var param = 'from=tiebasongwidget&url=&name=' + encodeURIComponent(me._removeHtml(selectedItem.title)) + '&artist='
|
||||
+ encodeURIComponent(me._removeHtml(selectedItem.author)) + '&extra='
|
||||
+ encodeURIComponent(me._removeHtml(selectedItem.album_title))
|
||||
+ '&autoPlay='+isTryListen+'' + '&loop=true';
|
||||
return me.playerUrl + "?" + param;
|
||||
},
|
||||
_getTryingElem:function () {
|
||||
var s = $G('J_listPanel').getElementsByTagName('span');
|
||||
|
||||
for (var i = 0; i < s.length; i++) {
|
||||
if (s[i].className == 'm-trying')
|
||||
return s[i];
|
||||
}
|
||||
return null;
|
||||
},
|
||||
_buildMusicHtml:function (playerUrl) {
|
||||
var html = '<embed class="BDE_try_Music" allowfullscreen="false" pluginspage="http://www.macromedia.com/go/getflashplayer"';
|
||||
html += ' src="' + playerUrl + '"';
|
||||
html += ' width="1" height="1" style="position:absolute;left:-2000px;"';
|
||||
html += ' type="application/x-shockwave-flash" wmode="transparent" play="true" loop="false"';
|
||||
html += ' menu="false" allowscriptaccess="never" scale="noborder">';
|
||||
return html;
|
||||
},
|
||||
_byteLength:function (str) {
|
||||
return str.replace(/[^\u0000-\u007f]/g, "\u0061\u0061").length;
|
||||
},
|
||||
_getMaxText:function (s) {
|
||||
var me = this;
|
||||
s = me._removeHtml(s);
|
||||
if (me._byteLength(s) > 12)
|
||||
return s.substring(0, 5) + '...';
|
||||
if (!s) s = " ";
|
||||
return s;
|
||||
},
|
||||
_rebuildData:function (data) {
|
||||
var me = this,
|
||||
newData = [],
|
||||
d = me.pageSize,
|
||||
itembox;
|
||||
for (var i = 0; i < data.length; i++) {
|
||||
if ((i + d) % d == 0) {
|
||||
itembox = [];
|
||||
newData.push(itembox)
|
||||
}
|
||||
itembox.push(data[i]);
|
||||
}
|
||||
return newData;
|
||||
},
|
||||
_renderTemplate:function (data) {
|
||||
var me = this;
|
||||
if (data.length == 0)return '<div class="empty">' + lang.emptyTxt + '</div>';
|
||||
data = me._rebuildData(data);
|
||||
var s = [], p = [], t = [];
|
||||
s.push('<div id="J_listPanel" class="listPanel">');
|
||||
p.push('<div class="page">');
|
||||
for (var i = 0, tmpList; tmpList = data[i++];) {
|
||||
panels.push('panel' + i);
|
||||
pages.push('page' + i);
|
||||
if (i == 1) {
|
||||
s.push('<div id="panel' + i + '" class="panelon">');
|
||||
if (data.length != 1) {
|
||||
t.push('<div id="page' + i + '" onclick="music.onpageclick(' + i + ')" class="pageon">' + (i ) + '</div>');
|
||||
}
|
||||
} else {
|
||||
s.push('<div id="panel' + i + '" class="paneloff">');
|
||||
t.push('<div id="page' + i + '" onclick="music.onpageclick(' + i + ')" class="pageoff">' + (i ) + '</div>');
|
||||
}
|
||||
s.push('<div class="m-box">');
|
||||
s.push('<div class="m-h"><span class="m-t">' + lang.chapter + '</span><span class="m-s">' + lang.singer
|
||||
+ '</span><span class="m-z">' + lang.special + '</span><span class="m-try-t">' + lang.listenTest + '</span></div>');
|
||||
for (var j = 0, tmpObj; tmpObj = tmpList[j++];) {
|
||||
s.push('<label for="radio-' + i + '-' + j + '" class="m-m">');
|
||||
s.push('<input type="radio" id="radio-' + i + '-' + j + '" name="musicId" class="m-l" onclick="music.doselect(' + (me.pageSize * (i-1) + (j-1)) + ')"/>');
|
||||
s.push('<span class="m-t">' + me._getMaxText(tmpObj.title) + '</span>');
|
||||
s.push('<span class="m-s">' + me._getMaxText(tmpObj.author) + '</span>');
|
||||
s.push('<span class="m-z">' + me._getMaxText(tmpObj.album_title) + '</span>');
|
||||
s.push('<span class="m-try" onclick="music.doselect(' + (me.pageSize * (i-1) + (j-1)) + ');music.listenTest(this)"></span>');
|
||||
s.push('</label>');
|
||||
}
|
||||
s.push('</div>');
|
||||
s.push('</div>');
|
||||
}
|
||||
t.reverse();
|
||||
p.push(t.join(''));
|
||||
s.push('</div>');
|
||||
p.push('</div>');
|
||||
return s.join('') + p.join('');
|
||||
},
|
||||
exec:function () {
|
||||
var me = this;
|
||||
if (selectedItem == null) return;
|
||||
$G('J_preview').innerHTML = "";
|
||||
editor.execCommand('music', {
|
||||
url:me._getUrl(false),
|
||||
width:400,
|
||||
height:95
|
||||
});
|
||||
}
|
||||
};
|
||||
})();
|
||||
|
||||
|
||||
|
||||
function Music() {
|
||||
this.init();
|
||||
}
|
||||
(function () {
|
||||
var pages = [],
|
||||
panels = [],
|
||||
selectedItem = null;
|
||||
Music.prototype = {
|
||||
total:70,
|
||||
pageSize:10,
|
||||
dataUrl:"http://tingapi.ting.baidu.com/v1/restserver/ting?method=baidu.ting.search.common",
|
||||
playerUrl:"http://box.baidu.com/widget/flash/bdspacesong.swf",
|
||||
|
||||
init:function () {
|
||||
var me = this;
|
||||
domUtils.on($G("J_searchName"), "keyup", function (event) {
|
||||
var e = window.event || event;
|
||||
if (e.keyCode == 13) {
|
||||
me.dosearch();
|
||||
}
|
||||
});
|
||||
domUtils.on($G("J_searchBtn"), "click", function () {
|
||||
me.dosearch();
|
||||
});
|
||||
},
|
||||
callback:function (data) {
|
||||
var me = this;
|
||||
me.data = data.song_list;
|
||||
setTimeout(function () {
|
||||
$G('J_resultBar').innerHTML = me._renderTemplate(data.song_list);
|
||||
}, 300);
|
||||
},
|
||||
dosearch:function () {
|
||||
var me = this;
|
||||
selectedItem = null;
|
||||
var key = $G('J_searchName').value;
|
||||
if (utils.trim(key) == "")return false;
|
||||
key = encodeURIComponent(key);
|
||||
me._sent(key);
|
||||
},
|
||||
doselect:function (i) {
|
||||
var me = this;
|
||||
if (typeof i == 'object') {
|
||||
selectedItem = i;
|
||||
} else if (typeof i == 'number') {
|
||||
selectedItem = me.data[i];
|
||||
}
|
||||
},
|
||||
onpageclick:function (id) {
|
||||
var me = this;
|
||||
for (var i = 0; i < pages.length; i++) {
|
||||
$G(pages[i]).className = 'pageoff';
|
||||
$G(panels[i]).className = 'paneloff';
|
||||
}
|
||||
$G('page' + id).className = 'pageon';
|
||||
$G('panel' + id).className = 'panelon';
|
||||
},
|
||||
listenTest:function (elem) {
|
||||
var me = this,
|
||||
view = $G('J_preview'),
|
||||
is_play_action = (elem.className == 'm-try'),
|
||||
old_trying = me._getTryingElem();
|
||||
|
||||
if (old_trying) {
|
||||
old_trying.className = 'm-try';
|
||||
view.innerHTML = '';
|
||||
}
|
||||
if (is_play_action) {
|
||||
elem.className = 'm-trying';
|
||||
view.innerHTML = me._buildMusicHtml(me._getUrl(true));
|
||||
}
|
||||
},
|
||||
_sent:function (param) {
|
||||
var me = this;
|
||||
$G('J_resultBar').innerHTML = '<div class="loading"></div>';
|
||||
|
||||
utils.loadFile(document, {
|
||||
src:me.dataUrl + '&query=' + param + '&page_size=' + me.total + '&callback=music.callback&.r=' + Math.random(),
|
||||
tag:"script",
|
||||
type:"text/javascript",
|
||||
defer:"defer"
|
||||
});
|
||||
},
|
||||
_removeHtml:function (str) {
|
||||
var reg = /<\s*\/?\s*[^>]*\s*>/gi;
|
||||
return str.replace(reg, "");
|
||||
},
|
||||
_getUrl:function (isTryListen) {
|
||||
var me = this;
|
||||
var param = 'from=tiebasongwidget&url=&name=' + encodeURIComponent(me._removeHtml(selectedItem.title)) + '&artist='
|
||||
+ encodeURIComponent(me._removeHtml(selectedItem.author)) + '&extra='
|
||||
+ encodeURIComponent(me._removeHtml(selectedItem.album_title))
|
||||
+ '&autoPlay='+isTryListen+'' + '&loop=true';
|
||||
return me.playerUrl + "?" + param;
|
||||
},
|
||||
_getTryingElem:function () {
|
||||
var s = $G('J_listPanel').getElementsByTagName('span');
|
||||
|
||||
for (var i = 0; i < s.length; i++) {
|
||||
if (s[i].className == 'm-trying')
|
||||
return s[i];
|
||||
}
|
||||
return null;
|
||||
},
|
||||
_buildMusicHtml:function (playerUrl) {
|
||||
var html = '<embed class="BDE_try_Music" allowfullscreen="false" pluginspage="http://www.macromedia.com/go/getflashplayer"';
|
||||
html += ' src="' + playerUrl + '"';
|
||||
html += ' width="1" height="1" style="position:absolute;left:-2000px;"';
|
||||
html += ' type="application/x-shockwave-flash" wmode="transparent" play="true" loop="false"';
|
||||
html += ' menu="false" allowscriptaccess="never" scale="noborder">';
|
||||
return html;
|
||||
},
|
||||
_byteLength:function (str) {
|
||||
return str.replace(/[^\u0000-\u007f]/g, "\u0061\u0061").length;
|
||||
},
|
||||
_getMaxText:function (s) {
|
||||
var me = this;
|
||||
s = me._removeHtml(s);
|
||||
if (me._byteLength(s) > 12)
|
||||
return s.substring(0, 5) + '...';
|
||||
if (!s) s = " ";
|
||||
return s;
|
||||
},
|
||||
_rebuildData:function (data) {
|
||||
var me = this,
|
||||
newData = [],
|
||||
d = me.pageSize,
|
||||
itembox;
|
||||
for (var i = 0; i < data.length; i++) {
|
||||
if ((i + d) % d == 0) {
|
||||
itembox = [];
|
||||
newData.push(itembox)
|
||||
}
|
||||
itembox.push(data[i]);
|
||||
}
|
||||
return newData;
|
||||
},
|
||||
_renderTemplate:function (data) {
|
||||
var me = this;
|
||||
if (data.length == 0)return '<div class="empty">' + lang.emptyTxt + '</div>';
|
||||
data = me._rebuildData(data);
|
||||
var s = [], p = [], t = [];
|
||||
s.push('<div id="J_listPanel" class="listPanel">');
|
||||
p.push('<div class="page">');
|
||||
for (var i = 0, tmpList; tmpList = data[i++];) {
|
||||
panels.push('panel' + i);
|
||||
pages.push('page' + i);
|
||||
if (i == 1) {
|
||||
s.push('<div id="panel' + i + '" class="panelon">');
|
||||
if (data.length != 1) {
|
||||
t.push('<div id="page' + i + '" onclick="music.onpageclick(' + i + ')" class="pageon">' + (i ) + '</div>');
|
||||
}
|
||||
} else {
|
||||
s.push('<div id="panel' + i + '" class="paneloff">');
|
||||
t.push('<div id="page' + i + '" onclick="music.onpageclick(' + i + ')" class="pageoff">' + (i ) + '</div>');
|
||||
}
|
||||
s.push('<div class="m-box">');
|
||||
s.push('<div class="m-h"><span class="m-t">' + lang.chapter + '</span><span class="m-s">' + lang.singer
|
||||
+ '</span><span class="m-z">' + lang.special + '</span><span class="m-try-t">' + lang.listenTest + '</span></div>');
|
||||
for (var j = 0, tmpObj; tmpObj = tmpList[j++];) {
|
||||
s.push('<label for="radio-' + i + '-' + j + '" class="m-m">');
|
||||
s.push('<input type="radio" id="radio-' + i + '-' + j + '" name="musicId" class="m-l" onclick="music.doselect(' + (me.pageSize * (i-1) + (j-1)) + ')"/>');
|
||||
s.push('<span class="m-t">' + me._getMaxText(tmpObj.title) + '</span>');
|
||||
s.push('<span class="m-s">' + me._getMaxText(tmpObj.author) + '</span>');
|
||||
s.push('<span class="m-z">' + me._getMaxText(tmpObj.album_title) + '</span>');
|
||||
s.push('<span class="m-try" onclick="music.doselect(' + (me.pageSize * (i-1) + (j-1)) + ');music.listenTest(this)"></span>');
|
||||
s.push('</label>');
|
||||
}
|
||||
s.push('</div>');
|
||||
s.push('</div>');
|
||||
}
|
||||
t.reverse();
|
||||
p.push(t.join(''));
|
||||
s.push('</div>');
|
||||
p.push('</div>');
|
||||
return s.join('') + p.join('');
|
||||
},
|
||||
exec:function () {
|
||||
var me = this;
|
||||
if (selectedItem == null) return;
|
||||
$G('J_preview').innerHTML = "";
|
||||
editor.execCommand('music', {
|
||||
url:me._getUrl(false),
|
||||
width:400,
|
||||
height:95
|
||||
});
|
||||
}
|
||||
};
|
||||
})();
|
||||
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -1,72 +1,72 @@
|
|||
/*common
|
||||
*/
|
||||
body{margin: 0;}
|
||||
table{width:100%;}
|
||||
table td{padding:2px 4px;vertical-align: middle;}
|
||||
a{text-decoration: none;}
|
||||
em{font-style: normal;}
|
||||
.border_style1{border: 1px solid #ccc;border-radius: 5px;box-shadow:2px 2px 5px #d3d6da;}
|
||||
/*module
|
||||
*/
|
||||
.main{margin: 8px;overflow: hidden;}
|
||||
|
||||
.hot{float:left;height:335px;}
|
||||
.drawBoard{position: relative; cursor: crosshair;}
|
||||
.brushBorad{position: absolute;left:0;top:0;z-index: 998;}
|
||||
.picBoard{border: none;text-align: center;line-height: 300px;cursor: default;}
|
||||
.operateBar{margin-top:10px;font-size:12px;text-align: center;}
|
||||
.operateBar span{margin-left: 10px;}
|
||||
|
||||
.drawToolbar{float:right;width:110px;height:300px;overflow: hidden;}
|
||||
.colorBar{margin-top:10px;font-size: 12px;text-align: center;}
|
||||
.colorBar a{display:block;width: 10px;height: 10px;border:1px solid #1006F1;border-radius: 3px; box-shadow:2px 2px 5px #d3d6da;opacity: 0.3}
|
||||
.sectionBar{margin-top:15px;font-size: 12px;text-align: center;}
|
||||
.sectionBar a{display:inline-block;width:10px;height:12px;color: #888;text-indent: -999px;opacity: 0.3}
|
||||
.size1{background: url('images/size.png') 1px center no-repeat ;}
|
||||
.size2{background: url('images/size.png') -10px center no-repeat;}
|
||||
.size3{background: url('images/size.png') -22px center no-repeat;}
|
||||
.size4{background: url('images/size.png') -35px center no-repeat;}
|
||||
|
||||
.addImgH{position: relative;}
|
||||
.addImgH_form{position: absolute;left: 18px;top: -1px;width: 75px;height: 21px;opacity: 0;cursor: pointer;}
|
||||
.addImgH_form input{width: 100%;}
|
||||
/*scrawl遮罩层
|
||||
*/
|
||||
.maskLayerNull{display: none;}
|
||||
.maskLayer{position: absolute;top:0;left:0;width: 100%; height: 100%;opacity: 0.7;
|
||||
background-color: #fff;text-align:center;font-weight:bold;line-height:300px;z-index: 1000;}
|
||||
/*btn state
|
||||
*/
|
||||
.previousStepH .icon{display: inline-block;width:16px;height:16px;background-image: url('images/undoH.png');cursor: pointer;}
|
||||
.previousStepH .text{color:#888;cursor:pointer;}
|
||||
.previousStep .icon{display: inline-block;width:16px;height:16px;background-image: url('images/undo.png');cursor:default;}
|
||||
.previousStep .text{color:#ccc;cursor:default;}
|
||||
|
||||
.nextStepH .icon{display: inline-block;width:16px;height:16px;background-image: url('images/redoH.png');cursor: pointer;}
|
||||
.nextStepH .text{color:#888;cursor:pointer;}
|
||||
.nextStep .icon{display: inline-block;width:16px;height:16px;background-image: url('images/redo.png');cursor:default;}
|
||||
.nextStep .text{color:#ccc;cursor:default;}
|
||||
|
||||
.clearBoardH .icon{display: inline-block;width:16px;height:16px;background-image: url('images/emptyH.png');cursor: pointer;}
|
||||
.clearBoardH .text{color:#888;cursor:pointer;}
|
||||
.clearBoard .icon{display: inline-block;width:16px;height:16px;background-image: url('images/empty.png');cursor:default;}
|
||||
.clearBoard .text{color:#ccc;cursor:default;}
|
||||
|
||||
.scaleBoardH .icon{display: inline-block;width:16px;height:16px;background-image: url('images/scaleH.png');cursor: pointer;}
|
||||
.scaleBoardH .text{color:#888;cursor:pointer;}
|
||||
.scaleBoard .icon{display: inline-block;width:16px;height:16px;background-image: url('images/scale.png');cursor:default;}
|
||||
.scaleBoard .text{color:#ccc;cursor:default;}
|
||||
|
||||
.removeImgH .icon{display: inline-block;width:16px;height:16px;background-image: url('images/delimgH.png');cursor: pointer;}
|
||||
.removeImgH .text{color:#888;cursor:pointer;}
|
||||
.removeImg .icon{display: inline-block;width:16px;height:16px;background-image: url('images/delimg.png');cursor:default;}
|
||||
.removeImg .text{color:#ccc;cursor:default;}
|
||||
|
||||
.addImgH .icon{vertical-align:top;display: inline-block;width:16px;height:16px;background-image: url('images/addimg.png')}
|
||||
.addImgH .text{color:#888;cursor:pointer;}
|
||||
/*icon
|
||||
*/
|
||||
.brushIcon{display: inline-block;width:16px;height:16px;background-image: url('images/brush.png')}
|
||||
.eraserIcon{display: inline-block;width:16px;height:16px;background-image: url('images/eraser.png')}
|
||||
|
||||
|
||||
/*common
|
||||
*/
|
||||
body{margin: 0;}
|
||||
table{width:100%;}
|
||||
table td{padding:2px 4px;vertical-align: middle;}
|
||||
a{text-decoration: none;}
|
||||
em{font-style: normal;}
|
||||
.border_style1{border: 1px solid #ccc;border-radius: 5px;box-shadow:2px 2px 5px #d3d6da;}
|
||||
/*module
|
||||
*/
|
||||
.main{margin: 8px;overflow: hidden;}
|
||||
|
||||
.hot{float:left;height:335px;}
|
||||
.drawBoard{position: relative; cursor: crosshair;}
|
||||
.brushBorad{position: absolute;left:0;top:0;z-index: 998;}
|
||||
.picBoard{border: none;text-align: center;line-height: 300px;cursor: default;}
|
||||
.operateBar{margin-top:10px;font-size:12px;text-align: center;}
|
||||
.operateBar span{margin-left: 10px;}
|
||||
|
||||
.drawToolbar{float:right;width:110px;height:300px;overflow: hidden;}
|
||||
.colorBar{margin-top:10px;font-size: 12px;text-align: center;}
|
||||
.colorBar a{display:block;width: 10px;height: 10px;border:1px solid #1006F1;border-radius: 3px; box-shadow:2px 2px 5px #d3d6da;opacity: 0.3}
|
||||
.sectionBar{margin-top:15px;font-size: 12px;text-align: center;}
|
||||
.sectionBar a{display:inline-block;width:10px;height:12px;color: #888;text-indent: -999px;opacity: 0.3}
|
||||
.size1{background: url('images/size.png') 1px center no-repeat ;}
|
||||
.size2{background: url('images/size.png') -10px center no-repeat;}
|
||||
.size3{background: url('images/size.png') -22px center no-repeat;}
|
||||
.size4{background: url('images/size.png') -35px center no-repeat;}
|
||||
|
||||
.addImgH{position: relative;}
|
||||
.addImgH_form{position: absolute;left: 18px;top: -1px;width: 75px;height: 21px;opacity: 0;cursor: pointer;}
|
||||
.addImgH_form input{width: 100%;}
|
||||
/*scrawl遮罩层
|
||||
*/
|
||||
.maskLayerNull{display: none;}
|
||||
.maskLayer{position: absolute;top:0;left:0;width: 100%; height: 100%;opacity: 0.7;
|
||||
background-color: #fff;text-align:center;font-weight:bold;line-height:300px;z-index: 1000;}
|
||||
/*btn state
|
||||
*/
|
||||
.previousStepH .icon{display: inline-block;width:16px;height:16px;background-image: url('images/undoH.png');cursor: pointer;}
|
||||
.previousStepH .text{color:#888;cursor:pointer;}
|
||||
.previousStep .icon{display: inline-block;width:16px;height:16px;background-image: url('images/undo.png');cursor:default;}
|
||||
.previousStep .text{color:#ccc;cursor:default;}
|
||||
|
||||
.nextStepH .icon{display: inline-block;width:16px;height:16px;background-image: url('images/redoH.png');cursor: pointer;}
|
||||
.nextStepH .text{color:#888;cursor:pointer;}
|
||||
.nextStep .icon{display: inline-block;width:16px;height:16px;background-image: url('images/redo.png');cursor:default;}
|
||||
.nextStep .text{color:#ccc;cursor:default;}
|
||||
|
||||
.clearBoardH .icon{display: inline-block;width:16px;height:16px;background-image: url('images/emptyH.png');cursor: pointer;}
|
||||
.clearBoardH .text{color:#888;cursor:pointer;}
|
||||
.clearBoard .icon{display: inline-block;width:16px;height:16px;background-image: url('images/empty.png');cursor:default;}
|
||||
.clearBoard .text{color:#ccc;cursor:default;}
|
||||
|
||||
.scaleBoardH .icon{display: inline-block;width:16px;height:16px;background-image: url('images/scaleH.png');cursor: pointer;}
|
||||
.scaleBoardH .text{color:#888;cursor:pointer;}
|
||||
.scaleBoard .icon{display: inline-block;width:16px;height:16px;background-image: url('images/scale.png');cursor:default;}
|
||||
.scaleBoard .text{color:#ccc;cursor:default;}
|
||||
|
||||
.removeImgH .icon{display: inline-block;width:16px;height:16px;background-image: url('images/delimgH.png');cursor: pointer;}
|
||||
.removeImgH .text{color:#888;cursor:pointer;}
|
||||
.removeImg .icon{display: inline-block;width:16px;height:16px;background-image: url('images/delimg.png');cursor:default;}
|
||||
.removeImg .text{color:#ccc;cursor:default;}
|
||||
|
||||
.addImgH .icon{vertical-align:top;display: inline-block;width:16px;height:16px;background-image: url('images/addimg.png')}
|
||||
.addImgH .text{color:#888;cursor:pointer;}
|
||||
/*icon
|
||||
*/
|
||||
.brushIcon{display: inline-block;width:16px;height:16px;background-image: url('images/brush.png')}
|
||||
.eraserIcon{display: inline-block;width:16px;height:16px;background-image: url('images/eraser.png')}
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -1,95 +1,95 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title></title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<meta name="robots" content="noindex, nofollow"/>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="scrawl.css">
|
||||
</head>
|
||||
<body>
|
||||
<div class="main" id="J_wrap">
|
||||
<div class="hot">
|
||||
<div class="drawBoard border_style1">
|
||||
<canvas id="J_brushBoard" class="brushBorad" width="360" height="300"></canvas>
|
||||
<div id="J_picBoard" class="picBoard" style="width: 360px;height: 300px"></div>
|
||||
</div>
|
||||
<div id="J_operateBar" class="operateBar">
|
||||
<span id="J_previousStep" class="previousStep">
|
||||
<em class="icon"></em>
|
||||
<em class="text"><var id="lang_input_previousStep"></var></em>
|
||||
</span>
|
||||
<span id="J_nextStep" class="nextStep">
|
||||
<em class="icon"></em>
|
||||
<em class="text"><var id="lang_input_nextsStep"></var></em>
|
||||
</span>
|
||||
<span id="J_clearBoard" class="clearBoard">
|
||||
<em class="icon"></em>
|
||||
<em class="text"><var id="lang_input_clear"></var></em>
|
||||
</span>
|
||||
<span id="J_sacleBoard" class="scaleBoard">
|
||||
<em class="icon"></em>
|
||||
<em class="text"><var id="lang_input_ScalePic"></var></em>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="drawToolbar border_style1">
|
||||
<div id="J_colorBar" class="colorBar"></div>
|
||||
<div id="J_brushBar" class="sectionBar">
|
||||
<em class="brushIcon"></em>
|
||||
<a href="javascript:void(0)" class="size1">1</a>
|
||||
<a href="javascript:void(0)" class="size2">3</a>
|
||||
<a href="javascript:void(0)" class="size3">5</a>
|
||||
<a href="javascript:void(0)" class="size4">7</a>
|
||||
</div>
|
||||
<div id="J_eraserBar" class="sectionBar">
|
||||
<em class="eraserIcon"></em>
|
||||
<a href="javascript:void(0)" class="size1">1</a>
|
||||
<a href="javascript:void(0)" class="size2">3</a>
|
||||
<a href="javascript:void(0)" class="size3">5</a>
|
||||
<a href="javascript:void(0)" class="size4">7</a>
|
||||
</div>
|
||||
<div class="sectionBar">
|
||||
<div id="J_addImg" class="addImgH">
|
||||
<em class="icon"></em>
|
||||
<em class="text"><var id="lang_input_addPic"></var></em>
|
||||
<form method="post" id="fileForm" enctype="multipart/form-data" class="addImgH_form" target="up">
|
||||
<input type="file" name="upfile" id="J_imgTxt"
|
||||
accept="image/gif,image/jpeg,image/png,image/jpg,image/bmp"/>
|
||||
</form>
|
||||
<iframe name="up" style="display: none"></iframe>
|
||||
</div>
|
||||
</div>
|
||||
<div class="sectionBar">
|
||||
<span id="J_removeImg" class="removeImg">
|
||||
<em class="icon"></em>
|
||||
<em class="text"><var id="lang_input_removePic"></var></em>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="J_maskLayer" class="maskLayerNull"></div>
|
||||
|
||||
<script type="text/javascript" src="scrawl.js"></script>
|
||||
<script type="text/javascript">
|
||||
var settings = {
|
||||
drawBrushSize:3, //画笔初始大小
|
||||
drawBrushColor:"#4bacc6", //画笔初始颜色
|
||||
colorList:['c00000', 'ff0000', 'ffc000', 'ffff00', '92d050', '00b050', '00b0f0', '0070c0', '002060', '7030a0', 'ffffff',
|
||||
'000000', 'eeece1', '1f497d', '4f81bd', 'c0504d', '9bbb59', '8064a2', '4bacc6', 'f79646'], //画笔选择颜色
|
||||
saveNum:10 //撤销次数
|
||||
};
|
||||
|
||||
var scrawlObj = new scrawl( settings );
|
||||
scrawlObj.isCancelScrawl = false;
|
||||
|
||||
dialog.onok = function () {
|
||||
exec( scrawlObj );
|
||||
return false;
|
||||
};
|
||||
dialog.oncancel = function () {
|
||||
scrawlObj.isCancelScrawl = true;
|
||||
};
|
||||
</script>
|
||||
</body>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title></title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<meta name="robots" content="noindex, nofollow"/>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="scrawl.css">
|
||||
</head>
|
||||
<body>
|
||||
<div class="main" id="J_wrap">
|
||||
<div class="hot">
|
||||
<div class="drawBoard border_style1">
|
||||
<canvas id="J_brushBoard" class="brushBorad" width="360" height="300"></canvas>
|
||||
<div id="J_picBoard" class="picBoard" style="width: 360px;height: 300px"></div>
|
||||
</div>
|
||||
<div id="J_operateBar" class="operateBar">
|
||||
<span id="J_previousStep" class="previousStep">
|
||||
<em class="icon"></em>
|
||||
<em class="text"><var id="lang_input_previousStep"></var></em>
|
||||
</span>
|
||||
<span id="J_nextStep" class="nextStep">
|
||||
<em class="icon"></em>
|
||||
<em class="text"><var id="lang_input_nextsStep"></var></em>
|
||||
</span>
|
||||
<span id="J_clearBoard" class="clearBoard">
|
||||
<em class="icon"></em>
|
||||
<em class="text"><var id="lang_input_clear"></var></em>
|
||||
</span>
|
||||
<span id="J_sacleBoard" class="scaleBoard">
|
||||
<em class="icon"></em>
|
||||
<em class="text"><var id="lang_input_ScalePic"></var></em>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="drawToolbar border_style1">
|
||||
<div id="J_colorBar" class="colorBar"></div>
|
||||
<div id="J_brushBar" class="sectionBar">
|
||||
<em class="brushIcon"></em>
|
||||
<a href="javascript:void(0)" class="size1">1</a>
|
||||
<a href="javascript:void(0)" class="size2">3</a>
|
||||
<a href="javascript:void(0)" class="size3">5</a>
|
||||
<a href="javascript:void(0)" class="size4">7</a>
|
||||
</div>
|
||||
<div id="J_eraserBar" class="sectionBar">
|
||||
<em class="eraserIcon"></em>
|
||||
<a href="javascript:void(0)" class="size1">1</a>
|
||||
<a href="javascript:void(0)" class="size2">3</a>
|
||||
<a href="javascript:void(0)" class="size3">5</a>
|
||||
<a href="javascript:void(0)" class="size4">7</a>
|
||||
</div>
|
||||
<div class="sectionBar">
|
||||
<div id="J_addImg" class="addImgH">
|
||||
<em class="icon"></em>
|
||||
<em class="text"><var id="lang_input_addPic"></var></em>
|
||||
<form method="post" id="fileForm" enctype="multipart/form-data" class="addImgH_form" target="up">
|
||||
<input type="file" name="upfile" id="J_imgTxt"
|
||||
accept="image/gif,image/jpeg,image/png,image/jpg,image/bmp"/>
|
||||
</form>
|
||||
<iframe name="up" style="display: none"></iframe>
|
||||
</div>
|
||||
</div>
|
||||
<div class="sectionBar">
|
||||
<span id="J_removeImg" class="removeImg">
|
||||
<em class="icon"></em>
|
||||
<em class="text"><var id="lang_input_removePic"></var></em>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="J_maskLayer" class="maskLayerNull"></div>
|
||||
|
||||
<script type="text/javascript" src="scrawl.js"></script>
|
||||
<script type="text/javascript">
|
||||
var settings = {
|
||||
drawBrushSize:3, //画笔初始大小
|
||||
drawBrushColor:"#4bacc6", //画笔初始颜色
|
||||
colorList:['c00000', 'ff0000', 'ffc000', 'ffff00', '92d050', '00b050', '00b0f0', '0070c0', '002060', '7030a0', 'ffffff',
|
||||
'000000', 'eeece1', '1f497d', '4f81bd', 'c0504d', '9bbb59', '8064a2', '4bacc6', 'f79646'], //画笔选择颜色
|
||||
saveNum:10 //撤销次数
|
||||
};
|
||||
|
||||
var scrawlObj = new scrawl( settings );
|
||||
scrawlObj.isCancelScrawl = false;
|
||||
|
||||
dialog.onok = function () {
|
||||
exec( scrawlObj );
|
||||
return false;
|
||||
};
|
||||
dialog.oncancel = function () {
|
||||
scrawlObj.isCancelScrawl = true;
|
||||
};
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
File diff suppressed because it is too large
Load Diff
|
|
@ -1,102 +1,102 @@
|
|||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
|
||||
"http://www.w3.org/TR/html4/loose.dtd">
|
||||
<html>
|
||||
<head>
|
||||
<title></title>
|
||||
<meta content="text/html; charset=utf-8" http-equiv="Content-Type"/>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
<style type="text/css">
|
||||
.warpper{ position:relative;width: 380px; height: 100%; margin: 10px auto;}
|
||||
.tabbody{height: 160px;}
|
||||
.tabbody table{width:100%;border-collapse: separate;border-spacing: 3px;}
|
||||
.tabbody .panel{width:373px;height:100%;padding-left: 5px;position: absolute;background-color: #fff;}
|
||||
.tabbody input.int{ width:190px;height:21px;border:1px solid #d7d7d7;line-height:21px;}
|
||||
.tabbody input.btn{padding: 0 5px; text-align:center;line-height:24px; text-decoration: none;height:24px;background:url("../../themes/default/images/dialog-title-bg.png") repeat-x;border:1px solid #ccc; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="warpper" id="searchtab">
|
||||
<div id="head" class="tabhead">
|
||||
<span tabsrc="find" class="focus"><var id="lang_tab_search"></var></span>
|
||||
<span tabsrc="replace" ><var id="lang_tab_replace"></var></span>
|
||||
</div>
|
||||
<div class="tabbody">
|
||||
<div class="panel" id="find">
|
||||
<table>
|
||||
<tr>
|
||||
<td width="80"><var id="lang_search1"></var>: </td>
|
||||
<td><input id="findtxt" type="text" class="int" /></td>
|
||||
</tr>
|
||||
<!--<tr>-->
|
||||
|
||||
<!--<td colspan="2"><span style="color:red"><var id="lang_searchReg"></var></span></td>-->
|
||||
<!--</tr>-->
|
||||
<tr>
|
||||
<td><var id="lang_case_sensitive1"></var></td>
|
||||
<td>
|
||||
<input id="matchCase" type="checkbox" />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2">
|
||||
<input id="nextFindBtn" type="button" class="btn" />
|
||||
<input id="preFindBtn" type="button" class="btn" />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2">
|
||||
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2">
|
||||
<span id="search-msg" style="color:red"></span>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
<div class="panel" id="replace">
|
||||
<table>
|
||||
<tr>
|
||||
<td width="80"><var id="lang_search2"></var>: </td>
|
||||
<td><input id="findtxt1" type="text" class="int" /></td>
|
||||
</tr>
|
||||
<!--<tr>-->
|
||||
|
||||
<!--<td colspan="2"><span style="color:red"><var id="lang_searchReg1"></var></span></td>-->
|
||||
<!--</tr>-->
|
||||
<tr>
|
||||
<td><var id="lang_replace"></var>: </td>
|
||||
<td><input id="replacetxt" type="text" class="int" /></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><var id="lang_case_sensitive2"></var></td>
|
||||
<td>
|
||||
<input id="matchCase1" type="checkbox" />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2">
|
||||
<input id="nextReplaceBtn" type="button" class="btn" />
|
||||
<input id="preReplaceBtn" type="button" class="btn" />
|
||||
<input id="repalceBtn" type="button" class="btn" />
|
||||
<input id="repalceAllBtn" type="button" class="btn" />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2">
|
||||
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2">
|
||||
<span id="replace-msg" style="color:red"></span>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/javascript" src="searchreplace.js"></script>
|
||||
</body>
|
||||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
|
||||
"http://www.w3.org/TR/html4/loose.dtd">
|
||||
<html>
|
||||
<head>
|
||||
<title></title>
|
||||
<meta content="text/html; charset=utf-8" http-equiv="Content-Type"/>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
<style type="text/css">
|
||||
.warpper{ position:relative;width: 380px; height: 100%; margin: 10px auto;}
|
||||
.tabbody{height: 160px;}
|
||||
.tabbody table{width:100%;border-collapse: separate;border-spacing: 3px;}
|
||||
.tabbody .panel{width:373px;height:100%;padding-left: 5px;position: absolute;background-color: #fff;}
|
||||
.tabbody input.int{ width:190px;height:21px;border:1px solid #d7d7d7;line-height:21px;}
|
||||
.tabbody input.btn{padding: 0 5px; text-align:center;line-height:24px; text-decoration: none;height:24px;background:url("../../themes/default/images/dialog-title-bg.png") repeat-x;border:1px solid #ccc; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="warpper" id="searchtab">
|
||||
<div id="head" class="tabhead">
|
||||
<span tabsrc="find" class="focus"><var id="lang_tab_search"></var></span>
|
||||
<span tabsrc="replace" ><var id="lang_tab_replace"></var></span>
|
||||
</div>
|
||||
<div class="tabbody">
|
||||
<div class="panel" id="find">
|
||||
<table>
|
||||
<tr>
|
||||
<td width="80"><var id="lang_search1"></var>: </td>
|
||||
<td><input id="findtxt" type="text" class="int" /></td>
|
||||
</tr>
|
||||
<!--<tr>-->
|
||||
|
||||
<!--<td colspan="2"><span style="color:red"><var id="lang_searchReg"></var></span></td>-->
|
||||
<!--</tr>-->
|
||||
<tr>
|
||||
<td><var id="lang_case_sensitive1"></var></td>
|
||||
<td>
|
||||
<input id="matchCase" type="checkbox" />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2">
|
||||
<input id="nextFindBtn" type="button" class="btn" />
|
||||
<input id="preFindBtn" type="button" class="btn" />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2">
|
||||
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2">
|
||||
<span id="search-msg" style="color:red"></span>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
<div class="panel" id="replace">
|
||||
<table>
|
||||
<tr>
|
||||
<td width="80"><var id="lang_search2"></var>: </td>
|
||||
<td><input id="findtxt1" type="text" class="int" /></td>
|
||||
</tr>
|
||||
<!--<tr>-->
|
||||
|
||||
<!--<td colspan="2"><span style="color:red"><var id="lang_searchReg1"></var></span></td>-->
|
||||
<!--</tr>-->
|
||||
<tr>
|
||||
<td><var id="lang_replace"></var>: </td>
|
||||
<td><input id="replacetxt" type="text" class="int" /></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><var id="lang_case_sensitive2"></var></td>
|
||||
<td>
|
||||
<input id="matchCase1" type="checkbox" />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2">
|
||||
<input id="nextReplaceBtn" type="button" class="btn" />
|
||||
<input id="preReplaceBtn" type="button" class="btn" />
|
||||
<input id="repalceBtn" type="button" class="btn" />
|
||||
<input id="repalceAllBtn" type="button" class="btn" />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2">
|
||||
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2">
|
||||
<span id="replace-msg" style="color:red"></span>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/javascript" src="searchreplace.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,164 +1,164 @@
|
|||
/**
|
||||
* Created with JetBrains PhpStorm.
|
||||
* User: xuheng
|
||||
* Date: 12-9-26
|
||||
* Time: 下午12:29
|
||||
* To change this template use File | Settings | File Templates.
|
||||
*/
|
||||
|
||||
//清空上次查选的痕迹
|
||||
editor.firstForSR = 0;
|
||||
editor.currentRangeForSR = null;
|
||||
//给tab注册切换事件
|
||||
/**
|
||||
* tab点击处理事件
|
||||
* @param tabHeads
|
||||
* @param tabBodys
|
||||
* @param obj
|
||||
*/
|
||||
function clickHandler( tabHeads,tabBodys,obj ) {
|
||||
//head样式更改
|
||||
for ( var k = 0, len = tabHeads.length; k < len; k++ ) {
|
||||
tabHeads[k].className = "";
|
||||
}
|
||||
obj.className = "focus";
|
||||
//body显隐
|
||||
var tabSrc = obj.getAttribute( "tabSrc" );
|
||||
for ( var j = 0, length = tabBodys.length; j < length; j++ ) {
|
||||
var body = tabBodys[j],
|
||||
id = body.getAttribute( "id" );
|
||||
if ( id != tabSrc ) {
|
||||
body.style.zIndex = 1;
|
||||
} else {
|
||||
body.style.zIndex = 200;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* TAB切换
|
||||
* @param tabParentId tab的父节点ID或者对象本身
|
||||
*/
|
||||
function switchTab( tabParentId ) {
|
||||
var tabElements = $G( tabParentId ).children,
|
||||
tabHeads = tabElements[0].children,
|
||||
tabBodys = tabElements[1].children;
|
||||
|
||||
for ( var i = 0, length = tabHeads.length; i < length; i++ ) {
|
||||
var head = tabHeads[i];
|
||||
if ( head.className === "focus" )clickHandler(tabHeads,tabBodys, head );
|
||||
head.onclick = function () {
|
||||
clickHandler(tabHeads,tabBodys,this);
|
||||
}
|
||||
}
|
||||
}
|
||||
$G('searchtab').onmousedown = function(){
|
||||
$G('search-msg').innerHTML = '';
|
||||
$G('replace-msg').innerHTML = ''
|
||||
}
|
||||
//是否区分大小写
|
||||
function getMatchCase(id) {
|
||||
return $G(id).checked ? true : false;
|
||||
}
|
||||
//查找
|
||||
$G("nextFindBtn").onclick = function (txt, dir, mcase) {
|
||||
var findtxt = $G("findtxt").value, obj;
|
||||
if (!findtxt) {
|
||||
return false;
|
||||
}
|
||||
obj = {
|
||||
searchStr:findtxt,
|
||||
dir:1,
|
||||
casesensitive:getMatchCase("matchCase")
|
||||
};
|
||||
if (!frCommond(obj)) {
|
||||
var bk = editor.selection.getRange().createBookmark();
|
||||
$G('search-msg').innerHTML = lang.getEnd;
|
||||
editor.selection.getRange().moveToBookmark(bk).select();
|
||||
|
||||
|
||||
}
|
||||
};
|
||||
$G("nextReplaceBtn").onclick = function (txt, dir, mcase) {
|
||||
var findtxt = $G("findtxt1").value, obj;
|
||||
if (!findtxt) {
|
||||
return false;
|
||||
}
|
||||
obj = {
|
||||
searchStr:findtxt,
|
||||
dir:1,
|
||||
casesensitive:getMatchCase("matchCase1")
|
||||
};
|
||||
frCommond(obj);
|
||||
};
|
||||
$G("preFindBtn").onclick = function (txt, dir, mcase) {
|
||||
var findtxt = $G("findtxt").value, obj;
|
||||
if (!findtxt) {
|
||||
return false;
|
||||
}
|
||||
obj = {
|
||||
searchStr:findtxt,
|
||||
dir:-1,
|
||||
casesensitive:getMatchCase("matchCase")
|
||||
};
|
||||
if (!frCommond(obj)) {
|
||||
$G('search-msg').innerHTML = lang.getStart;
|
||||
}
|
||||
};
|
||||
$G("preReplaceBtn").onclick = function (txt, dir, mcase) {
|
||||
var findtxt = $G("findtxt1").value, obj;
|
||||
if (!findtxt) {
|
||||
return false;
|
||||
}
|
||||
obj = {
|
||||
searchStr:findtxt,
|
||||
dir:-1,
|
||||
casesensitive:getMatchCase("matchCase1")
|
||||
};
|
||||
frCommond(obj);
|
||||
};
|
||||
//替换
|
||||
$G("repalceBtn").onclick = function () {
|
||||
var findtxt = $G("findtxt1").value.replace(/^\s|\s$/g, ""), obj,
|
||||
replacetxt = $G("replacetxt").value.replace(/^\s|\s$/g, "");
|
||||
if (!findtxt) {
|
||||
return false;
|
||||
}
|
||||
if (findtxt == replacetxt || (!getMatchCase("matchCase1") && findtxt.toLowerCase() == replacetxt.toLowerCase())) {
|
||||
return false;
|
||||
}
|
||||
obj = {
|
||||
searchStr:findtxt,
|
||||
dir:1,
|
||||
casesensitive:getMatchCase("matchCase1"),
|
||||
replaceStr:replacetxt
|
||||
};
|
||||
frCommond(obj);
|
||||
};
|
||||
//全部替换
|
||||
$G("repalceAllBtn").onclick = function () {
|
||||
var findtxt = $G("findtxt1").value.replace(/^\s|\s$/g, ""), obj,
|
||||
replacetxt = $G("replacetxt").value.replace(/^\s|\s$/g, "");
|
||||
if (!findtxt) {
|
||||
return false;
|
||||
}
|
||||
if (findtxt == replacetxt || (!getMatchCase("matchCase1") && findtxt.toLowerCase() == replacetxt.toLowerCase())) {
|
||||
return false;
|
||||
}
|
||||
obj = {
|
||||
searchStr:findtxt,
|
||||
casesensitive:getMatchCase("matchCase1"),
|
||||
replaceStr:replacetxt,
|
||||
all:true
|
||||
};
|
||||
var num = frCommond(obj);
|
||||
if (num) {
|
||||
$G('replace-msg').innerHTML = lang.countMsg.replace("{#count}", num);
|
||||
}
|
||||
};
|
||||
//执行
|
||||
var frCommond = function (obj) {
|
||||
return editor.execCommand("searchreplace", obj);
|
||||
};
|
||||
/**
|
||||
* Created with JetBrains PhpStorm.
|
||||
* User: xuheng
|
||||
* Date: 12-9-26
|
||||
* Time: 下午12:29
|
||||
* To change this template use File | Settings | File Templates.
|
||||
*/
|
||||
|
||||
//清空上次查选的痕迹
|
||||
editor.firstForSR = 0;
|
||||
editor.currentRangeForSR = null;
|
||||
//给tab注册切换事件
|
||||
/**
|
||||
* tab点击处理事件
|
||||
* @param tabHeads
|
||||
* @param tabBodys
|
||||
* @param obj
|
||||
*/
|
||||
function clickHandler( tabHeads,tabBodys,obj ) {
|
||||
//head样式更改
|
||||
for ( var k = 0, len = tabHeads.length; k < len; k++ ) {
|
||||
tabHeads[k].className = "";
|
||||
}
|
||||
obj.className = "focus";
|
||||
//body显隐
|
||||
var tabSrc = obj.getAttribute( "tabSrc" );
|
||||
for ( var j = 0, length = tabBodys.length; j < length; j++ ) {
|
||||
var body = tabBodys[j],
|
||||
id = body.getAttribute( "id" );
|
||||
if ( id != tabSrc ) {
|
||||
body.style.zIndex = 1;
|
||||
} else {
|
||||
body.style.zIndex = 200;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* TAB切换
|
||||
* @param tabParentId tab的父节点ID或者对象本身
|
||||
*/
|
||||
function switchTab( tabParentId ) {
|
||||
var tabElements = $G( tabParentId ).children,
|
||||
tabHeads = tabElements[0].children,
|
||||
tabBodys = tabElements[1].children;
|
||||
|
||||
for ( var i = 0, length = tabHeads.length; i < length; i++ ) {
|
||||
var head = tabHeads[i];
|
||||
if ( head.className === "focus" )clickHandler(tabHeads,tabBodys, head );
|
||||
head.onclick = function () {
|
||||
clickHandler(tabHeads,tabBodys,this);
|
||||
}
|
||||
}
|
||||
}
|
||||
$G('searchtab').onmousedown = function(){
|
||||
$G('search-msg').innerHTML = '';
|
||||
$G('replace-msg').innerHTML = ''
|
||||
}
|
||||
//是否区分大小写
|
||||
function getMatchCase(id) {
|
||||
return $G(id).checked ? true : false;
|
||||
}
|
||||
//查找
|
||||
$G("nextFindBtn").onclick = function (txt, dir, mcase) {
|
||||
var findtxt = $G("findtxt").value, obj;
|
||||
if (!findtxt) {
|
||||
return false;
|
||||
}
|
||||
obj = {
|
||||
searchStr:findtxt,
|
||||
dir:1,
|
||||
casesensitive:getMatchCase("matchCase")
|
||||
};
|
||||
if (!frCommond(obj)) {
|
||||
var bk = editor.selection.getRange().createBookmark();
|
||||
$G('search-msg').innerHTML = lang.getEnd;
|
||||
editor.selection.getRange().moveToBookmark(bk).select();
|
||||
|
||||
|
||||
}
|
||||
};
|
||||
$G("nextReplaceBtn").onclick = function (txt, dir, mcase) {
|
||||
var findtxt = $G("findtxt1").value, obj;
|
||||
if (!findtxt) {
|
||||
return false;
|
||||
}
|
||||
obj = {
|
||||
searchStr:findtxt,
|
||||
dir:1,
|
||||
casesensitive:getMatchCase("matchCase1")
|
||||
};
|
||||
frCommond(obj);
|
||||
};
|
||||
$G("preFindBtn").onclick = function (txt, dir, mcase) {
|
||||
var findtxt = $G("findtxt").value, obj;
|
||||
if (!findtxt) {
|
||||
return false;
|
||||
}
|
||||
obj = {
|
||||
searchStr:findtxt,
|
||||
dir:-1,
|
||||
casesensitive:getMatchCase("matchCase")
|
||||
};
|
||||
if (!frCommond(obj)) {
|
||||
$G('search-msg').innerHTML = lang.getStart;
|
||||
}
|
||||
};
|
||||
$G("preReplaceBtn").onclick = function (txt, dir, mcase) {
|
||||
var findtxt = $G("findtxt1").value, obj;
|
||||
if (!findtxt) {
|
||||
return false;
|
||||
}
|
||||
obj = {
|
||||
searchStr:findtxt,
|
||||
dir:-1,
|
||||
casesensitive:getMatchCase("matchCase1")
|
||||
};
|
||||
frCommond(obj);
|
||||
};
|
||||
//替换
|
||||
$G("repalceBtn").onclick = function () {
|
||||
var findtxt = $G("findtxt1").value.replace(/^\s|\s$/g, ""), obj,
|
||||
replacetxt = $G("replacetxt").value.replace(/^\s|\s$/g, "");
|
||||
if (!findtxt) {
|
||||
return false;
|
||||
}
|
||||
if (findtxt == replacetxt || (!getMatchCase("matchCase1") && findtxt.toLowerCase() == replacetxt.toLowerCase())) {
|
||||
return false;
|
||||
}
|
||||
obj = {
|
||||
searchStr:findtxt,
|
||||
dir:1,
|
||||
casesensitive:getMatchCase("matchCase1"),
|
||||
replaceStr:replacetxt
|
||||
};
|
||||
frCommond(obj);
|
||||
};
|
||||
//全部替换
|
||||
$G("repalceAllBtn").onclick = function () {
|
||||
var findtxt = $G("findtxt1").value.replace(/^\s|\s$/g, ""), obj,
|
||||
replacetxt = $G("replacetxt").value.replace(/^\s|\s$/g, "");
|
||||
if (!findtxt) {
|
||||
return false;
|
||||
}
|
||||
if (findtxt == replacetxt || (!getMatchCase("matchCase1") && findtxt.toLowerCase() == replacetxt.toLowerCase())) {
|
||||
return false;
|
||||
}
|
||||
obj = {
|
||||
searchStr:findtxt,
|
||||
casesensitive:getMatchCase("matchCase1"),
|
||||
replaceStr:replacetxt,
|
||||
all:true
|
||||
};
|
||||
var num = frCommond(obj);
|
||||
if (num) {
|
||||
$G('replace-msg').innerHTML = lang.countMsg.replace("{#count}", num);
|
||||
}
|
||||
};
|
||||
//执行
|
||||
var frCommond = function (obj) {
|
||||
return editor.execCommand("searchreplace", obj);
|
||||
};
|
||||
switchTab("searchtab");
|
||||
|
|
@ -1,58 +1,58 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<title></title>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
<style type="text/css">
|
||||
*{color: #838383}
|
||||
html,body {
|
||||
font-size: 12px;
|
||||
width:100%;
|
||||
height:100%;
|
||||
overflow: hidden;
|
||||
margin:0px;
|
||||
padding:0px;
|
||||
}
|
||||
h2 { font-size: 16px; margin: 20px auto;}
|
||||
.content{
|
||||
padding:5px 15px 0 15px;
|
||||
height:100%;
|
||||
}
|
||||
dt,dd { margin-left: 0; padding-left: 0;}
|
||||
dt a { display: block;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
width: 55px;
|
||||
background: #EFEFEF;
|
||||
border: 1px solid #CCC;
|
||||
padding: 0 10px;
|
||||
text-decoration: none;
|
||||
}
|
||||
dt a:hover{
|
||||
background: #e0e0e0;
|
||||
border-color: #999
|
||||
}
|
||||
dt a:active{
|
||||
background: #ccc;
|
||||
border-color: #999;
|
||||
color: #666;
|
||||
}
|
||||
dd { line-height:20px;margin-top: 10px;}
|
||||
span{ padding-right:4px;}
|
||||
input{width:210px;height:21px;background: #FFF;border:1px solid #d7d7d7;padding: 0px; margin: 0px; }
|
||||
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="content">
|
||||
<h2><var id="lang_showMsg"></var></h2>
|
||||
<dl>
|
||||
<dt><a href="../../third-party/snapscreen/UEditorSnapscreen.exe" target="_blank" id="downlink"><var id="lang_download"></var></a></dt>
|
||||
<dd><var id="lang_step1"></var></dd>
|
||||
<dd><var id="lang_step2"></var></dd>
|
||||
</dl>
|
||||
</div>
|
||||
</body>
|
||||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<title></title>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
<style type="text/css">
|
||||
*{color: #838383}
|
||||
html,body {
|
||||
font-size: 12px;
|
||||
width:100%;
|
||||
height:100%;
|
||||
overflow: hidden;
|
||||
margin:0px;
|
||||
padding:0px;
|
||||
}
|
||||
h2 { font-size: 16px; margin: 20px auto;}
|
||||
.content{
|
||||
padding:5px 15px 0 15px;
|
||||
height:100%;
|
||||
}
|
||||
dt,dd { margin-left: 0; padding-left: 0;}
|
||||
dt a { display: block;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
width: 55px;
|
||||
background: #EFEFEF;
|
||||
border: 1px solid #CCC;
|
||||
padding: 0 10px;
|
||||
text-decoration: none;
|
||||
}
|
||||
dt a:hover{
|
||||
background: #e0e0e0;
|
||||
border-color: #999
|
||||
}
|
||||
dt a:active{
|
||||
background: #ccc;
|
||||
border-color: #999;
|
||||
color: #666;
|
||||
}
|
||||
dd { line-height:20px;margin-top: 10px;}
|
||||
span{ padding-right:4px;}
|
||||
input{width:210px;height:21px;background: #FFF;border:1px solid #d7d7d7;padding: 0px; margin: 0px; }
|
||||
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="content">
|
||||
<h2><var id="lang_showMsg"></var></h2>
|
||||
<dl>
|
||||
<dt><a href="../../third-party/snapscreen/UEditorSnapscreen.exe" target="_blank" id="downlink"><var id="lang_download"></var></a></dt>
|
||||
<dd><var id="lang_step1"></var></dd>
|
||||
<dd><var id="lang_step2"></var></dd>
|
||||
</dl>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,21 +1,21 @@
|
|||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
|
||||
"http://www.w3.org/TR/html4/loose.dtd">
|
||||
<html>
|
||||
<head>
|
||||
<title></title>
|
||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
<style type="text/css">
|
||||
html,body{overflow:hidden;}
|
||||
#specharsTab{width: 97%;margin: 10px auto; zoom:1;position: relative}
|
||||
.tabbody {height:447px;}
|
||||
.tabbody span{ margin: 5px 3px;text-align: center;display:inline-block;width: 40px;height:16px;line-height: 16px;cursor: pointer; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="specharsTab">
|
||||
<div id="tabHeads" class="tabhead"></div><div id="tabBodys" class="tabbody"></div>
|
||||
</div>
|
||||
<script type="text/javascript" src="spechars.js"></script>
|
||||
</body>
|
||||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
|
||||
"http://www.w3.org/TR/html4/loose.dtd">
|
||||
<html>
|
||||
<head>
|
||||
<title></title>
|
||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
<style type="text/css">
|
||||
html,body{overflow:hidden;}
|
||||
#specharsTab{width: 97%;margin: 10px auto; zoom:1;position: relative}
|
||||
.tabbody {height:447px;}
|
||||
.tabbody span{ margin: 5px 3px;text-align: center;display:inline-block;width: 40px;height:16px;line-height: 16px;cursor: pointer; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="specharsTab">
|
||||
<div id="tabHeads" class="tabhead"></div><div id="tabBodys" class="tabbody"></div>
|
||||
</div>
|
||||
<script type="text/javascript" src="spechars.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,57 +1,57 @@
|
|||
/**
|
||||
* Created with JetBrains PhpStorm.
|
||||
* User: xuheng
|
||||
* Date: 12-9-26
|
||||
* Time: 下午1:09
|
||||
* To change this template use File | Settings | File Templates.
|
||||
*/
|
||||
var charsContent = [
|
||||
{ name:"tsfh", title:lang.tsfh, content:toArray("、,。,·,ˉ,ˇ,¨,〃,々,—,～,‖,…,‘,’,“,”,〔,〕,〈,〉,《,》,「,」,『,』,〖,〗,【,】,±,×,÷,∶,∧,∨,∑,∏,∪,∩,∈,∷,√,⊥,∥,∠,⌒,⊙,∫,∮,≡,≌,≈,∽,∝,≠,≮,≯,≤,≥,∞,∵,∴,♂,♀,°,′,″,℃,＄,¤,￠,￡,‰,§,№,☆,★,○,●,◎,◇,◆,□,■,△,▲,※,→,←,↑,↓,〓,〡,〢,〣,〤,〥,〦,〧,〨,〩,㊣,㎎,㎏,㎜,㎝,㎞,㎡,㏄,㏎,㏑,㏒,㏕,︰,￢,￤,℡,ˊ,ˋ,˙,–,―,‥,‵,℅,℉,↖,↗,↘,↙,∕,∟,∣,≒,≦,≧,⊿,═,║,╒,╓,╔,╕,╖,╗,╘,╙,╚,╛,╜,╝,╞,╟,╠,╡,╢,╣,╤,╥,╦,╧,╨,╩,╪,╫,╬,╭,╮,╯,╰,╱,╲,╳,▁,▂,▃,▄,▅,▆,▇,<2C>,█,▉,▊,▋,▌,▍,▎,▏,▓,▔,▕,▼,▽,◢,◣,◤,◥,☉,⊕,〒,〝,〞")},
|
||||
{ name:"lmsz", title:lang.lmsz, content:toArray("ⅰ,ⅱ,ⅲ,ⅳ,ⅴ,ⅵ,ⅶ,ⅷ,ⅸ,ⅹ,Ⅰ,Ⅱ,Ⅲ,Ⅳ,Ⅴ,Ⅵ,Ⅶ,Ⅷ,Ⅸ,Ⅹ,Ⅺ,Ⅻ")},
|
||||
{ name:"szfh", title:lang.szfh, content:toArray("⒈,⒉,⒊,⒋,⒌,⒍,⒎,⒏,⒐,⒑,⒒,⒓,⒔,⒕,⒖,⒗,⒘,⒙,⒚,⒛,⑴,⑵,⑶,⑷,⑸,⑹,⑺,⑻,⑼,⑽,⑾,⑿,⒀,⒁,⒂,⒃,⒄,⒅,⒆,⒇,①,②,③,④,⑤,⑥,⑦,⑧,⑨,⑩,㈠,㈡,㈢,㈣,㈤,㈥,㈦,㈧,㈨,㈩")},
|
||||
{ name:"rwfh", title:lang.rwfh, content:toArray("ぁ,あ,ぃ,い,ぅ,う,ぇ,え,ぉ,お,か,が,き,ぎ,く,ぐ,け,げ,こ,ご,さ,ざ,し,じ,す,ず,せ,ぜ,そ,ぞ,た,だ,ち,ぢ,っ,つ,づ,て,で,と,ど,な,に,ぬ,ね,の,は,ば,ぱ,ひ,び,ぴ,ふ,ぶ,ぷ,へ,べ,ぺ,ほ,ぼ,ぽ,ま,み,む,め,も,ゃ,や,ゅ,ゆ,ょ,よ,ら,り,る,れ,ろ,ゎ,わ,ゐ,ゑ,を,ん,ァ,ア,ィ,イ,ゥ,ウ,ェ,エ,ォ,オ,カ,ガ,キ,ギ,ク,グ,ケ,ゲ,コ,ゴ,サ,ザ,シ,ジ,ス,ズ,セ,ゼ,ソ,ゾ,タ,ダ,チ,ヂ,ッ,ツ,ヅ,テ,デ,ト,ド,ナ,ニ,ヌ,ネ,ノ,ハ,バ,パ,ヒ,ビ,ピ,フ,ブ,プ,ヘ,ベ,ペ,ホ,ボ,ポ,マ,ミ,ム,メ,モ,ャ,ヤ,ュ,ユ,ョ,ヨ,ラ,リ,ル,レ,ロ,ヮ,ワ,ヰ,ヱ,ヲ,ン,ヴ,ヵ,ヶ")},
|
||||
{ name:"xlzm", title:lang.xlzm, content:toArray("Α,Β,Γ,Δ,Ε,Ζ,Η,Θ,Ι,Κ,Λ,Μ,Ν,Ξ,Ο,Π,Ρ,Σ,Τ,Υ,Φ,Χ,Ψ,Ω,α,β,γ,δ,ε,ζ,η,θ,ι,κ,λ,μ,ν,ξ,ο,π,ρ,σ,τ,υ,φ,χ,ψ,ω")},
|
||||
{ name:"ewzm", title:lang.ewzm, content:toArray("А,Б,В,Г,Д,Е,Ё,Ж,З,И,Й,К,Л,М,Н,О,П,Р,С,Т,У,Ф,Х,Ц,Ч,Ш,Щ,Ъ,Ы,Ь,Э,Ю,Я,а,б,в,г,д,е,ё,ж,з,и,й,к,л,м,н,о,п,р,с,т,у,ф,х,ц,ч,ш,щ,ъ,ы,ь,э,ю,я")},
|
||||
{ name:"pyzm", title:lang.pyzm, content:toArray("ā,á,ǎ,à,ē,é,ě,è,ī,í,ǐ,ì,ō,ó,ǒ,ò,ū,ú,ǔ,ù,ǖ,ǘ,ǚ,ǜ,ü")},
|
||||
{ name:"yyyb", title:lang.yyyb, content:toArray("i:,i,e,æ,ʌ,ə:,ə,u:,u,ɔ:,ɔ,a:,ei,ai,ɔi,əu,au,iə,εə,uə,p,t,k,b,d,g,f,s,ʃ,θ,h,v,z,ʒ,ð,tʃ,tr,ts,dʒ,dr,dz,m,n,ŋ,l,r,w,j,")},
|
||||
{ name:"zyzf", title:lang.zyzf, content:toArray("ㄅ,ㄆ,ㄇ,ㄈ,ㄉ,ㄊ,ㄋ,ㄌ,ㄍ,ㄎ,ㄏ,ㄐ,ㄑ,ㄒ,ㄓ,ㄔ,ㄕ,ㄖ,ㄗ,ㄘ,ㄙ,ㄚ,ㄛ,ㄜ,ㄝ,ㄞ,ㄟ,ㄠ,ㄡ,ㄢ,ㄣ,ㄤ,ㄥ,ㄦ,ㄧ,ㄨ")}
|
||||
];
|
||||
(function createTab(content) {
|
||||
for (var i = 0, ci; ci = content[i++];) {
|
||||
var span = document.createElement("span");
|
||||
span.setAttribute("tabSrc", ci.name);
|
||||
span.innerHTML = ci.title;
|
||||
if (i == 1)span.className = "focus";
|
||||
domUtils.on(span, "click", function () {
|
||||
var tmps = $G("tabHeads").children;
|
||||
for (var k = 0, sk; sk = tmps[k++];) {
|
||||
sk.className = "";
|
||||
}
|
||||
tmps = $G("tabBodys").children;
|
||||
for (var k = 0, sk; sk = tmps[k++];) {
|
||||
sk.style.display = "none";
|
||||
}
|
||||
this.className = "focus";
|
||||
$G(this.getAttribute("tabSrc")).style.display = "";
|
||||
});
|
||||
$G("tabHeads").appendChild(span);
|
||||
domUtils.insertAfter(span, document.createTextNode("\n"));
|
||||
var div = document.createElement("div");
|
||||
div.id = ci.name;
|
||||
div.style.display = (i == 1) ? "" : "none";
|
||||
var cons = ci.content;
|
||||
for (var j = 0, con; con = cons[j++];) {
|
||||
var charSpan = document.createElement("span");
|
||||
charSpan.innerHTML = con;
|
||||
domUtils.on(charSpan, "click", function () {
|
||||
editor.execCommand("insertHTML", this.innerHTML);
|
||||
dialog.close();
|
||||
});
|
||||
div.appendChild(charSpan);
|
||||
}
|
||||
$G("tabBodys").appendChild(div);
|
||||
}
|
||||
})(charsContent);
|
||||
function toArray(str) {
|
||||
return str.split(",");
|
||||
}
|
||||
/**
|
||||
* Created with JetBrains PhpStorm.
|
||||
* User: xuheng
|
||||
* Date: 12-9-26
|
||||
* Time: 下午1:09
|
||||
* To change this template use File | Settings | File Templates.
|
||||
*/
|
||||
var charsContent = [
|
||||
{ name:"tsfh", title:lang.tsfh, content:toArray("、,。,·,ˉ,ˇ,¨,〃,々,—,～,‖,…,‘,’,“,”,〔,〕,〈,〉,《,》,「,」,『,』,〖,〗,【,】,±,×,÷,∶,∧,∨,∑,∏,∪,∩,∈,∷,√,⊥,∥,∠,⌒,⊙,∫,∮,≡,≌,≈,∽,∝,≠,≮,≯,≤,≥,∞,∵,∴,♂,♀,°,′,″,℃,＄,¤,￠,￡,‰,§,№,☆,★,○,●,◎,◇,◆,□,■,△,▲,※,→,←,↑,↓,〓,〡,〢,〣,〤,〥,〦,〧,〨,〩,㊣,㎎,㎏,㎜,㎝,㎞,㎡,㏄,㏎,㏑,㏒,㏕,︰,￢,￤,℡,ˊ,ˋ,˙,–,―,‥,‵,℅,℉,↖,↗,↘,↙,∕,∟,∣,≒,≦,≧,⊿,═,║,╒,╓,╔,╕,╖,╗,╘,╙,╚,╛,╜,╝,╞,╟,╠,╡,╢,╣,╤,╥,╦,╧,╨,╩,╪,╫,╬,╭,╮,╯,╰,╱,╲,╳,▁,▂,▃,▄,▅,▆,▇,<2C>,█,▉,▊,▋,▌,▍,▎,▏,▓,▔,▕,▼,▽,◢,◣,◤,◥,☉,⊕,〒,〝,〞")},
|
||||
{ name:"lmsz", title:lang.lmsz, content:toArray("ⅰ,ⅱ,ⅲ,ⅳ,ⅴ,ⅵ,ⅶ,ⅷ,ⅸ,ⅹ,Ⅰ,Ⅱ,Ⅲ,Ⅳ,Ⅴ,Ⅵ,Ⅶ,Ⅷ,Ⅸ,Ⅹ,Ⅺ,Ⅻ")},
|
||||
{ name:"szfh", title:lang.szfh, content:toArray("⒈,⒉,⒊,⒋,⒌,⒍,⒎,⒏,⒐,⒑,⒒,⒓,⒔,⒕,⒖,⒗,⒘,⒙,⒚,⒛,⑴,⑵,⑶,⑷,⑸,⑹,⑺,⑻,⑼,⑽,⑾,⑿,⒀,⒁,⒂,⒃,⒄,⒅,⒆,⒇,①,②,③,④,⑤,⑥,⑦,⑧,⑨,⑩,㈠,㈡,㈢,㈣,㈤,㈥,㈦,㈧,㈨,㈩")},
|
||||
{ name:"rwfh", title:lang.rwfh, content:toArray("ぁ,あ,ぃ,い,ぅ,う,ぇ,え,ぉ,お,か,が,き,ぎ,く,ぐ,け,げ,こ,ご,さ,ざ,し,じ,す,ず,せ,ぜ,そ,ぞ,た,だ,ち,ぢ,っ,つ,づ,て,で,と,ど,な,に,ぬ,ね,の,は,ば,ぱ,ひ,び,ぴ,ふ,ぶ,ぷ,へ,べ,ぺ,ほ,ぼ,ぽ,ま,み,む,め,も,ゃ,や,ゅ,ゆ,ょ,よ,ら,り,る,れ,ろ,ゎ,わ,ゐ,ゑ,を,ん,ァ,ア,ィ,イ,ゥ,ウ,ェ,エ,ォ,オ,カ,ガ,キ,ギ,ク,グ,ケ,ゲ,コ,ゴ,サ,ザ,シ,ジ,ス,ズ,セ,ゼ,ソ,ゾ,タ,ダ,チ,ヂ,ッ,ツ,ヅ,テ,デ,ト,ド,ナ,ニ,ヌ,ネ,ノ,ハ,バ,パ,ヒ,ビ,ピ,フ,ブ,プ,ヘ,ベ,ペ,ホ,ボ,ポ,マ,ミ,ム,メ,モ,ャ,ヤ,ュ,ユ,ョ,ヨ,ラ,リ,ル,レ,ロ,ヮ,ワ,ヰ,ヱ,ヲ,ン,ヴ,ヵ,ヶ")},
|
||||
{ name:"xlzm", title:lang.xlzm, content:toArray("Α,Β,Γ,Δ,Ε,Ζ,Η,Θ,Ι,Κ,Λ,Μ,Ν,Ξ,Ο,Π,Ρ,Σ,Τ,Υ,Φ,Χ,Ψ,Ω,α,β,γ,δ,ε,ζ,η,θ,ι,κ,λ,μ,ν,ξ,ο,π,ρ,σ,τ,υ,φ,χ,ψ,ω")},
|
||||
{ name:"ewzm", title:lang.ewzm, content:toArray("А,Б,В,Г,Д,Е,Ё,Ж,З,И,Й,К,Л,М,Н,О,П,Р,С,Т,У,Ф,Х,Ц,Ч,Ш,Щ,Ъ,Ы,Ь,Э,Ю,Я,а,б,в,г,д,е,ё,ж,з,и,й,к,л,м,н,о,п,р,с,т,у,ф,х,ц,ч,ш,щ,ъ,ы,ь,э,ю,я")},
|
||||
{ name:"pyzm", title:lang.pyzm, content:toArray("ā,á,ǎ,à,ē,é,ě,è,ī,í,ǐ,ì,ō,ó,ǒ,ò,ū,ú,ǔ,ù,ǖ,ǘ,ǚ,ǜ,ü")},
|
||||
{ name:"yyyb", title:lang.yyyb, content:toArray("i:,i,e,æ,ʌ,ə:,ə,u:,u,ɔ:,ɔ,a:,ei,ai,ɔi,əu,au,iə,εə,uə,p,t,k,b,d,g,f,s,ʃ,θ,h,v,z,ʒ,ð,tʃ,tr,ts,dʒ,dr,dz,m,n,ŋ,l,r,w,j,")},
|
||||
{ name:"zyzf", title:lang.zyzf, content:toArray("ㄅ,ㄆ,ㄇ,ㄈ,ㄉ,ㄊ,ㄋ,ㄌ,ㄍ,ㄎ,ㄏ,ㄐ,ㄑ,ㄒ,ㄓ,ㄔ,ㄕ,ㄖ,ㄗ,ㄘ,ㄙ,ㄚ,ㄛ,ㄜ,ㄝ,ㄞ,ㄟ,ㄠ,ㄡ,ㄢ,ㄣ,ㄤ,ㄥ,ㄦ,ㄧ,ㄨ")}
|
||||
];
|
||||
(function createTab(content) {
|
||||
for (var i = 0, ci; ci = content[i++];) {
|
||||
var span = document.createElement("span");
|
||||
span.setAttribute("tabSrc", ci.name);
|
||||
span.innerHTML = ci.title;
|
||||
if (i == 1)span.className = "focus";
|
||||
domUtils.on(span, "click", function () {
|
||||
var tmps = $G("tabHeads").children;
|
||||
for (var k = 0, sk; sk = tmps[k++];) {
|
||||
sk.className = "";
|
||||
}
|
||||
tmps = $G("tabBodys").children;
|
||||
for (var k = 0, sk; sk = tmps[k++];) {
|
||||
sk.style.display = "none";
|
||||
}
|
||||
this.className = "focus";
|
||||
$G(this.getAttribute("tabSrc")).style.display = "";
|
||||
});
|
||||
$G("tabHeads").appendChild(span);
|
||||
domUtils.insertAfter(span, document.createTextNode("\n"));
|
||||
var div = document.createElement("div");
|
||||
div.id = ci.name;
|
||||
div.style.display = (i == 1) ? "" : "none";
|
||||
var cons = ci.content;
|
||||
for (var j = 0, con; con = cons[j++];) {
|
||||
var charSpan = document.createElement("span");
|
||||
charSpan.innerHTML = con;
|
||||
domUtils.on(charSpan, "click", function () {
|
||||
editor.execCommand("insertHTML", this.innerHTML);
|
||||
dialog.close();
|
||||
});
|
||||
div.appendChild(charSpan);
|
||||
}
|
||||
$G("tabBodys").appendChild(div);
|
||||
}
|
||||
})(charsContent);
|
||||
function toArray(str) {
|
||||
return str.split(",");
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,42 +1,42 @@
|
|||
/**
|
||||
* Created with JetBrains PhpStorm.
|
||||
* User: xuheng
|
||||
* Date: 12-8-8
|
||||
* Time: 下午2:00
|
||||
* To change this template use File | Settings | File Templates.
|
||||
*/
|
||||
var templates = [
|
||||
{
|
||||
"pre":"pre0.png",
|
||||
'title':lang.blank,
|
||||
'preHtml':'<p class="ue_t"> 欢迎使用UEditor！</p>',
|
||||
"html":'<p class="ue_t">欢迎使用UEditor！</p>'
|
||||
|
||||
},
|
||||
{
|
||||
"pre":"pre1.png",
|
||||
'title':lang.blog,
|
||||
'preHtml':'<h1 label="Title center" name="tc" style="border-bottom-color:#cccccc;border-bottom-width:2px;border-bottom-style:solid;padding:0px 4px 0px 0px;text-align:center;margin:0px 0px 20px;"><span style="color:#c0504d;">深入理解Range</span></h1><p style="text-align:center;"><strong class=" ">UEditor二次开发</strong></p><h3><span class=" " style="font-family:幼圆">什么是Range</span></h3><p style="text-indent:2em;">对于“插入”选项卡上的库，在设计时都充分考虑了其中的项与文档整体外观的协调性。 </p><br /><h3><span class=" " style="font-family:幼圆">Range能干什么</span></h3><p style="text-indent:2em;">在“开始”选项卡上，通过从快速样式库中为所选文本选择一种外观，您可以方便地更改文档中所选文本的格式。</p>',
|
||||
"html":'<h1 class="ue_t" label="Title center" name="tc" style="border-bottom-color:#cccccc;border-bottom-width:2px;border-bottom-style:solid;padding:0px 4px 0px 0px;text-align:center;margin:0px 0px 20px;"><span style="color:#c0504d;">[键入文档标题]</span></h1><p style="text-align:center;"><strong class="ue_t">[键入文档副标题]</strong></p><h3><span class="ue_t" style="font-family:幼圆">[标题 1]</span></h3><p class="ue_t" style="text-indent:2em;">对于“插入”选项卡上的库，在设计时都充分考虑了其中的项与文档整体外观的协调性。 您可以使用这些库来插入表格、页眉、页脚、列表、封面以及其他文档构建基块。 您创建的图片、图表或关系图也将与当前的文档外观协调一致。</p><h3><span class="ue_t" style="font-family:幼圆">[标题 2]</span></h3><p class="ue_t" style="text-indent:2em;">在“开始”选项卡上，通过从快速样式库中为所选文本选择一种外观，您可以方便地更改文档中所选文本的格式。 您还可以使用“开始”选项卡上的其他控件来直接设置文本格式。大多数控件都允许您选择是使用当前主题外观，还是使用某种直接指定的格式。 </p><h3><span class="ue_t" style="font-family:幼圆">[标题 3]</span></h3><p class="ue_t">对于“插入”选项卡上的库，在设计时都充分考虑了其中的项与文档整体外观的协调性。 您可以使用这些库来插入表格、页眉、页脚、列表、封面以及其他文档构建基块。 您创建的图片、图表或关系图也将与当前的文档外观协调一致。</p><p class="ue_t"><br /></p>'
|
||||
|
||||
},
|
||||
{
|
||||
"pre":"pre2.png",
|
||||
'title':lang.resume,
|
||||
'preHtml':'<h1 label="Title left" name="tl" style="border-bottom-color:#cccccc;border-bottom-width:2px;border-bottom-style:solid;padding:0px 4px 0px 0px;margin:0px 0px 10px;"><span style="color:#e36c09;" class=" ">WEB前端开发简历</span></h1><table width="100%" border="1" bordercolor="#95B3D7" style="border-collapse:collapse;"><tbody><tr><td width="100" style="text-align:center;"><p><span style="background-color:transparent;">插</span><br /></p><p>入</p><p>照</p><p>片</p></td><td><p><span style="background-color:transparent;"> 联系电话：</span><span class="ue_t" style="background-color:transparent;">[键入您的电话]</span><br /></p><p><span style="background-color:transparent;"> 电子邮件：</span><span class="ue_t" style="background-color:transparent;">[键入您的电子邮件地址]</span><br /></p><p><span style="background-color:transparent;"> 家庭住址：</span><span class="ue_t" style="background-color:transparent;">[键入您的地址]</span><br /></p></td></tr></tbody></table><h3><span style="color:#E36C09;font-size:20px;">目标职位</span></h3><p style="text-indent:2em;" class=" ">WEB前端研发工程师</p><h3><span style="color:#e36c09;font-size:20px;">学历</span></h3><p><span style="display:none;line-height:0px;" id="_baidu_bookmark_start_26"></span></p><ol style="list-style-type:decimal;"><li><p><span class="ue_t">[起止时间]</span> <span class="ue_t">[学校名称] </span> <span class="ue_t">[所学专业]</span> <span class="ue_t">[所获学位]</span></p></li></ol><h3><span style="color:#e36c09;font-size:20px;" class="ue_t">工作经验</span></h3><p><br /></p>',
|
||||
"html":'<h1 label="Title left" name="tl" style="border-bottom-color:#cccccc;border-bottom-width:2px;border-bottom-style:solid;padding:0px 4px 0px 0px;margin:0px 0px 10px;"><span style="color:#e36c09;" class="ue_t">[此处键入简历标题]</span></h1><p><span style="color:#e36c09;"><br /></span></p><table width="100%" border="1" bordercolor="#95B3D7" style="border-collapse:collapse;"><tbody><tr><td width="200" style="text-align:center;" class="ue_t">【此处插入照片】</td><td><p><br /></p><p> 联系电话：<span class="ue_t">[键入您的电话]</span></p><p><br /></p><p> 电子邮件：<span class="ue_t">[键入您的电子邮件地址]</span></p><p><br /></p><p> 家庭住址：<span class="ue_t">[键入您的地址]</span></p><p><br /></p></td></tr></tbody></table><h3><span style="color:#e36c09;font-size:20px;">目标职位</span></h3><p style="text-indent:2em;" class="ue_t">[此处键入您的期望职位]</p><h3><span style="color:#e36c09;font-size:20px;">学历</span></h3><p><span style="display:none;line-height:0px;" id="_baidu_bookmark_start_26"></span></p><ol style="list-style-type:decimal;"><li><p><span class="ue_t">[键入起止时间]</span> <span class="ue_t">[键入学校名称] </span> <span class="ue_t">[键入所学专业]</span> <span class="ue_t">[键入所获学位]</span></p></li><li><p><span class="ue_t">[键入起止时间]</span> <span class="ue_t">[键入学校名称]</span> <span class="ue_t">[键入所学专业]</span> <span class="ue_t">[键入所获学位]</span></p></li></ol><h3><span style="color:#e36c09;font-size:20px;" class="ue_t">工作经验</span></h3><ol style="list-style-type:decimal;"><li><p><span class="ue_t">[键入起止时间]</span> <span class="ue_t">[键入公司名称]</span> <span class="ue_t">[键入职位名称]</span> </p></li><ol style="list-style-type:lower-alpha;"><li><p><span class="ue_t">[键入负责项目]</span> <span class="ue_t">[键入项目简介]</span></p></li><li><p><span class="ue_t">[键入负责项目]</span> <span class="ue_t">[键入项目简介]</span></p></li></ol><li><p><span class="ue_t">[键入起止时间]</span> <span class="ue_t">[键入公司名称]</span> <span class="ue_t">[键入职位名称]</span> </p></li><ol style="list-style-type:lower-alpha;"><li><p><span class="ue_t">[键入负责项目]</span> <span class="ue_t">[键入项目简介]</span></p></li></ol></ol><p><span style="color:#e36c09;font-size:20px;">掌握技能</span></p><p style="text-indent:2em;"> <span class="ue_t">[这里可以键入您所掌握的技能]</span><br /></p>'
|
||||
|
||||
},
|
||||
{
|
||||
"pre":"pre3.png",
|
||||
'title':lang.richText,
|
||||
'preHtml':'<h1 label="Title center" name="tc" style="border-bottom-color:#cccccc;border-bottom-width:2px;border-bottom-style:solid;padding:0px 4px 0px 0px;text-align:center;margin:0px 0px 20px;" class="ue_t">[此处键入文章标题]</h1><p><img src="http://img.baidu.com/hi/youa/y_0034.gif" width="150" height="100" border="0" hspace="0" vspace="0" style="width:150px;height:100px;float:left;" />图文混排方法</p><p>图片居左，文字围绕图片排版</p><p>方法：在文字前面插入图片，设置居左对齐，然后即可在右边输入多行文</p><p><br /></p><p><img src="http://img.baidu.com/hi/youa/y_0040.gif" width="100" height="100" border="0" hspace="0" vspace="0" style="width:100px;height:100px;float:right;" /></p><p>还有没有什么其他的环绕方式呢？这里是居右环绕</p><p><br /></p><p>欢迎大家多多尝试，为UEditor提供更多高质量模板！</p>',
|
||||
"html":'<p><br /></p><h1 label="Title center" name="tc" style="border-bottom-color:#cccccc;border-bottom-width:2px;border-bottom-style:solid;padding:0px 4px 0px 0px;text-align:center;margin:0px 0px 20px;" class="ue_t">[此处键入文章标题]</h1><p><img src="http://img.baidu.com/hi/youa/y_0034.gif" width="300" height="200" border="0" hspace="0" vspace="0" style="width:300px;height:200px;float:left;" />图文混排方法</p><p>1. 图片居左，文字围绕图片排版</p><p>方法：在文字前面插入图片，设置居左对齐，然后即可在右边输入多行文本</p><p><br /></p><p>2. 图片居右，文字围绕图片排版</p><p>方法：在文字前面插入图片，设置居右对齐，然后即可在左边输入多行文本</p><p><br /></p><p>3. 图片居中环绕排版</p><p>方法：亲，这个真心没有办法。。。</p><p><br /></p><p><br /></p><p><img src="http://img.baidu.com/hi/youa/y_0040.gif" width="300" height="300" border="0" hspace="0" vspace="0" style="width:300px;height:300px;float:right;" /></p><p>还有没有什么其他的环绕方式呢？这里是居右环绕</p><p><br /></p><p>欢迎大家多多尝试，为UEditor提供更多高质量模板！</p><p><br /></p><p>占位</p><p><br /></p><p>占位</p><p><br /></p><p>占位</p><p><br /></p><p>占位</p><p><br /></p><p>占位</p><p><br /></p><p><br /></p>'
|
||||
},
|
||||
{
|
||||
"pre":"pre4.png",
|
||||
'title':lang.sciPapers,
|
||||
'preHtml':'<h2 style="border-bottom-color:#cccccc;border-bottom-width:2px;border-bottom-style:solid;padding:0px 4px 0px 0px;margin:0px 0px 10px;text-align:center;" class="ue_t">[键入文章标题]</h2><p><strong><span style="font-size:12px;">摘要</span></strong><span style="font-size:12px;" class="ue_t">：这里可以输入很长很长很长很长很长很长很长很长很差的摘要</span></p><p style="line-height:1.5em;"><strong>标题 1</strong></p><p style="text-indent:2em;"><span style="font-size:14px;" class="ue_t">这里可以输入很多内容，可以图文混排，可以有列表等。</span></p><p style="line-height:1.5em;"><strong>标题 2</strong></p><ol style="list-style-type:lower-alpha;"><li><p class="ue_t">列表 1</p></li><li><p class="ue_t">列表 2</p></li><ol style="list-style-type:lower-roman;"><li><p class="ue_t">多级列表 1</p></li><li><p class="ue_t">多级列表 2</p></li></ol><li><p class="ue_t">列表 3<br /></p></li></ol><p style="line-height:1.5em;"><strong>标题 3</strong></p><p style="text-indent:2em;"><span style="font-size:14px;" class="ue_t">来个文字图文混排的</span></p><p style="text-indent:2em;"><br /></p>',
|
||||
'html':'<h2 style="border-bottom-color:#cccccc;border-bottom-width:2px;border-bottom-style:solid;padding:0px 4px 0px 0px;margin:0px 0px 10px;text-align:center;" class="ue_t">[键入文章标题]</h2><p><strong><span style="font-size:12px;">摘要</span></strong><span style="font-size:12px;" class="ue_t">：这里可以输入很长很长很长很长很长很长很长很长很差的摘要</span></p><p style="line-height:1.5em;"><strong>标题 1</strong></p><p style="text-indent:2em;"><span style="font-size:14px;" class="ue_t">这里可以输入很多内容，可以图文混排，可以有列表等。</span></p><p style="line-height:1.5em;"><strong>标题 2</strong></p><p style="text-indent:2em;"><span style="font-size:14px;" class="ue_t">来个列表瞅瞅：</span></p><ol style="list-style-type:lower-alpha;"><li><p class="ue_t">列表 1</p></li><li><p class="ue_t">列表 2</p></li><ol style="list-style-type:lower-roman;"><li><p class="ue_t">多级列表 1</p></li><li><p class="ue_t">多级列表 2</p></li></ol><li><p class="ue_t">列表 3<br /></p></li></ol><p style="line-height:1.5em;"><strong>标题 3</strong></p><p style="text-indent:2em;"><span style="font-size:14px;" class="ue_t">来个文字图文混排的</span></p><p style="text-indent:2em;"><span style="font-size:14px;" class="ue_t">这里可以多行</span></p><p style="text-indent:2em;"><span style="font-size:14px;" class="ue_t">右边是图片</span></p><p style="text-indent:2em;"><span style="font-size:14px;" class="ue_t">绝对没有问题的，不信你也可以试试看</span></p><p><br /></p>'
|
||||
}
|
||||
/**
|
||||
* Created with JetBrains PhpStorm.
|
||||
* User: xuheng
|
||||
* Date: 12-8-8
|
||||
* Time: 下午2:00
|
||||
* To change this template use File | Settings | File Templates.
|
||||
*/
|
||||
var templates = [
|
||||
{
|
||||
"pre":"pre0.png",
|
||||
'title':lang.blank,
|
||||
'preHtml':'<p class="ue_t"> 欢迎使用UEditor！</p>',
|
||||
"html":'<p class="ue_t">欢迎使用UEditor！</p>'
|
||||
|
||||
},
|
||||
{
|
||||
"pre":"pre1.png",
|
||||
'title':lang.blog,
|
||||
'preHtml':'<h1 label="Title center" name="tc" style="border-bottom-color:#cccccc;border-bottom-width:2px;border-bottom-style:solid;padding:0px 4px 0px 0px;text-align:center;margin:0px 0px 20px;"><span style="color:#c0504d;">深入理解Range</span></h1><p style="text-align:center;"><strong class=" ">UEditor二次开发</strong></p><h3><span class=" " style="font-family:幼圆">什么是Range</span></h3><p style="text-indent:2em;">对于“插入”选项卡上的库，在设计时都充分考虑了其中的项与文档整体外观的协调性。 </p><br /><h3><span class=" " style="font-family:幼圆">Range能干什么</span></h3><p style="text-indent:2em;">在“开始”选项卡上，通过从快速样式库中为所选文本选择一种外观，您可以方便地更改文档中所选文本的格式。</p>',
|
||||
"html":'<h1 class="ue_t" label="Title center" name="tc" style="border-bottom-color:#cccccc;border-bottom-width:2px;border-bottom-style:solid;padding:0px 4px 0px 0px;text-align:center;margin:0px 0px 20px;"><span style="color:#c0504d;">[键入文档标题]</span></h1><p style="text-align:center;"><strong class="ue_t">[键入文档副标题]</strong></p><h3><span class="ue_t" style="font-family:幼圆">[标题 1]</span></h3><p class="ue_t" style="text-indent:2em;">对于“插入”选项卡上的库，在设计时都充分考虑了其中的项与文档整体外观的协调性。 您可以使用这些库来插入表格、页眉、页脚、列表、封面以及其他文档构建基块。 您创建的图片、图表或关系图也将与当前的文档外观协调一致。</p><h3><span class="ue_t" style="font-family:幼圆">[标题 2]</span></h3><p class="ue_t" style="text-indent:2em;">在“开始”选项卡上，通过从快速样式库中为所选文本选择一种外观，您可以方便地更改文档中所选文本的格式。 您还可以使用“开始”选项卡上的其他控件来直接设置文本格式。大多数控件都允许您选择是使用当前主题外观，还是使用某种直接指定的格式。 </p><h3><span class="ue_t" style="font-family:幼圆">[标题 3]</span></h3><p class="ue_t">对于“插入”选项卡上的库，在设计时都充分考虑了其中的项与文档整体外观的协调性。 您可以使用这些库来插入表格、页眉、页脚、列表、封面以及其他文档构建基块。 您创建的图片、图表或关系图也将与当前的文档外观协调一致。</p><p class="ue_t"><br /></p>'
|
||||
|
||||
},
|
||||
{
|
||||
"pre":"pre2.png",
|
||||
'title':lang.resume,
|
||||
'preHtml':'<h1 label="Title left" name="tl" style="border-bottom-color:#cccccc;border-bottom-width:2px;border-bottom-style:solid;padding:0px 4px 0px 0px;margin:0px 0px 10px;"><span style="color:#e36c09;" class=" ">WEB前端开发简历</span></h1><table width="100%" border="1" bordercolor="#95B3D7" style="border-collapse:collapse;"><tbody><tr><td width="100" style="text-align:center;"><p><span style="background-color:transparent;">插</span><br /></p><p>入</p><p>照</p><p>片</p></td><td><p><span style="background-color:transparent;"> 联系电话：</span><span class="ue_t" style="background-color:transparent;">[键入您的电话]</span><br /></p><p><span style="background-color:transparent;"> 电子邮件：</span><span class="ue_t" style="background-color:transparent;">[键入您的电子邮件地址]</span><br /></p><p><span style="background-color:transparent;"> 家庭住址：</span><span class="ue_t" style="background-color:transparent;">[键入您的地址]</span><br /></p></td></tr></tbody></table><h3><span style="color:#E36C09;font-size:20px;">目标职位</span></h3><p style="text-indent:2em;" class=" ">WEB前端研发工程师</p><h3><span style="color:#e36c09;font-size:20px;">学历</span></h3><p><span style="display:none;line-height:0px;" id="_baidu_bookmark_start_26"></span></p><ol style="list-style-type:decimal;"><li><p><span class="ue_t">[起止时间]</span> <span class="ue_t">[学校名称] </span> <span class="ue_t">[所学专业]</span> <span class="ue_t">[所获学位]</span></p></li></ol><h3><span style="color:#e36c09;font-size:20px;" class="ue_t">工作经验</span></h3><p><br /></p>',
|
||||
"html":'<h1 label="Title left" name="tl" style="border-bottom-color:#cccccc;border-bottom-width:2px;border-bottom-style:solid;padding:0px 4px 0px 0px;margin:0px 0px 10px;"><span style="color:#e36c09;" class="ue_t">[此处键入简历标题]</span></h1><p><span style="color:#e36c09;"><br /></span></p><table width="100%" border="1" bordercolor="#95B3D7" style="border-collapse:collapse;"><tbody><tr><td width="200" style="text-align:center;" class="ue_t">【此处插入照片】</td><td><p><br /></p><p> 联系电话：<span class="ue_t">[键入您的电话]</span></p><p><br /></p><p> 电子邮件：<span class="ue_t">[键入您的电子邮件地址]</span></p><p><br /></p><p> 家庭住址：<span class="ue_t">[键入您的地址]</span></p><p><br /></p></td></tr></tbody></table><h3><span style="color:#e36c09;font-size:20px;">目标职位</span></h3><p style="text-indent:2em;" class="ue_t">[此处键入您的期望职位]</p><h3><span style="color:#e36c09;font-size:20px;">学历</span></h3><p><span style="display:none;line-height:0px;" id="_baidu_bookmark_start_26"></span></p><ol style="list-style-type:decimal;"><li><p><span class="ue_t">[键入起止时间]</span> <span class="ue_t">[键入学校名称] </span> <span class="ue_t">[键入所学专业]</span> <span class="ue_t">[键入所获学位]</span></p></li><li><p><span class="ue_t">[键入起止时间]</span> <span class="ue_t">[键入学校名称]</span> <span class="ue_t">[键入所学专业]</span> <span class="ue_t">[键入所获学位]</span></p></li></ol><h3><span style="color:#e36c09;font-size:20px;" class="ue_t">工作经验</span></h3><ol style="list-style-type:decimal;"><li><p><span class="ue_t">[键入起止时间]</span> <span class="ue_t">[键入公司名称]</span> <span class="ue_t">[键入职位名称]</span> </p></li><ol style="list-style-type:lower-alpha;"><li><p><span class="ue_t">[键入负责项目]</span> <span class="ue_t">[键入项目简介]</span></p></li><li><p><span class="ue_t">[键入负责项目]</span> <span class="ue_t">[键入项目简介]</span></p></li></ol><li><p><span class="ue_t">[键入起止时间]</span> <span class="ue_t">[键入公司名称]</span> <span class="ue_t">[键入职位名称]</span> </p></li><ol style="list-style-type:lower-alpha;"><li><p><span class="ue_t">[键入负责项目]</span> <span class="ue_t">[键入项目简介]</span></p></li></ol></ol><p><span style="color:#e36c09;font-size:20px;">掌握技能</span></p><p style="text-indent:2em;"> <span class="ue_t">[这里可以键入您所掌握的技能]</span><br /></p>'
|
||||
|
||||
},
|
||||
{
|
||||
"pre":"pre3.png",
|
||||
'title':lang.richText,
|
||||
'preHtml':'<h1 label="Title center" name="tc" style="border-bottom-color:#cccccc;border-bottom-width:2px;border-bottom-style:solid;padding:0px 4px 0px 0px;text-align:center;margin:0px 0px 20px;" class="ue_t">[此处键入文章标题]</h1><p><img src="http://img.baidu.com/hi/youa/y_0034.gif" width="150" height="100" border="0" hspace="0" vspace="0" style="width:150px;height:100px;float:left;" />图文混排方法</p><p>图片居左，文字围绕图片排版</p><p>方法：在文字前面插入图片，设置居左对齐，然后即可在右边输入多行文</p><p><br /></p><p><img src="http://img.baidu.com/hi/youa/y_0040.gif" width="100" height="100" border="0" hspace="0" vspace="0" style="width:100px;height:100px;float:right;" /></p><p>还有没有什么其他的环绕方式呢？这里是居右环绕</p><p><br /></p><p>欢迎大家多多尝试，为UEditor提供更多高质量模板！</p>',
|
||||
"html":'<p><br /></p><h1 label="Title center" name="tc" style="border-bottom-color:#cccccc;border-bottom-width:2px;border-bottom-style:solid;padding:0px 4px 0px 0px;text-align:center;margin:0px 0px 20px;" class="ue_t">[此处键入文章标题]</h1><p><img src="http://img.baidu.com/hi/youa/y_0034.gif" width="300" height="200" border="0" hspace="0" vspace="0" style="width:300px;height:200px;float:left;" />图文混排方法</p><p>1. 图片居左，文字围绕图片排版</p><p>方法：在文字前面插入图片，设置居左对齐，然后即可在右边输入多行文本</p><p><br /></p><p>2. 图片居右，文字围绕图片排版</p><p>方法：在文字前面插入图片，设置居右对齐，然后即可在左边输入多行文本</p><p><br /></p><p>3. 图片居中环绕排版</p><p>方法：亲，这个真心没有办法。。。</p><p><br /></p><p><br /></p><p><img src="http://img.baidu.com/hi/youa/y_0040.gif" width="300" height="300" border="0" hspace="0" vspace="0" style="width:300px;height:300px;float:right;" /></p><p>还有没有什么其他的环绕方式呢？这里是居右环绕</p><p><br /></p><p>欢迎大家多多尝试，为UEditor提供更多高质量模板！</p><p><br /></p><p>占位</p><p><br /></p><p>占位</p><p><br /></p><p>占位</p><p><br /></p><p>占位</p><p><br /></p><p>占位</p><p><br /></p><p><br /></p>'
|
||||
},
|
||||
{
|
||||
"pre":"pre4.png",
|
||||
'title':lang.sciPapers,
|
||||
'preHtml':'<h2 style="border-bottom-color:#cccccc;border-bottom-width:2px;border-bottom-style:solid;padding:0px 4px 0px 0px;margin:0px 0px 10px;text-align:center;" class="ue_t">[键入文章标题]</h2><p><strong><span style="font-size:12px;">摘要</span></strong><span style="font-size:12px;" class="ue_t">：这里可以输入很长很长很长很长很长很长很长很长很差的摘要</span></p><p style="line-height:1.5em;"><strong>标题 1</strong></p><p style="text-indent:2em;"><span style="font-size:14px;" class="ue_t">这里可以输入很多内容，可以图文混排，可以有列表等。</span></p><p style="line-height:1.5em;"><strong>标题 2</strong></p><ol style="list-style-type:lower-alpha;"><li><p class="ue_t">列表 1</p></li><li><p class="ue_t">列表 2</p></li><ol style="list-style-type:lower-roman;"><li><p class="ue_t">多级列表 1</p></li><li><p class="ue_t">多级列表 2</p></li></ol><li><p class="ue_t">列表 3<br /></p></li></ol><p style="line-height:1.5em;"><strong>标题 3</strong></p><p style="text-indent:2em;"><span style="font-size:14px;" class="ue_t">来个文字图文混排的</span></p><p style="text-indent:2em;"><br /></p>',
|
||||
'html':'<h2 style="border-bottom-color:#cccccc;border-bottom-width:2px;border-bottom-style:solid;padding:0px 4px 0px 0px;margin:0px 0px 10px;text-align:center;" class="ue_t">[键入文章标题]</h2><p><strong><span style="font-size:12px;">摘要</span></strong><span style="font-size:12px;" class="ue_t">：这里可以输入很长很长很长很长很长很长很长很长很差的摘要</span></p><p style="line-height:1.5em;"><strong>标题 1</strong></p><p style="text-indent:2em;"><span style="font-size:14px;" class="ue_t">这里可以输入很多内容，可以图文混排，可以有列表等。</span></p><p style="line-height:1.5em;"><strong>标题 2</strong></p><p style="text-indent:2em;"><span style="font-size:14px;" class="ue_t">来个列表瞅瞅：</span></p><ol style="list-style-type:lower-alpha;"><li><p class="ue_t">列表 1</p></li><li><p class="ue_t">列表 2</p></li><ol style="list-style-type:lower-roman;"><li><p class="ue_t">多级列表 1</p></li><li><p class="ue_t">多级列表 2</p></li></ol><li><p class="ue_t">列表 3<br /></p></li></ol><p style="line-height:1.5em;"><strong>标题 3</strong></p><p style="text-indent:2em;"><span style="font-size:14px;" class="ue_t">来个文字图文混排的</span></p><p style="text-indent:2em;"><span style="font-size:14px;" class="ue_t">这里可以多行</span></p><p style="text-indent:2em;"><span style="font-size:14px;" class="ue_t">右边是图片</span></p><p style="text-indent:2em;"><span style="font-size:14px;" class="ue_t">绝对没有问题的，不信你也可以试试看</span></p><p><br /></p>'
|
||||
}
|
||||
];
|
||||
|
|
@ -1,18 +1,18 @@
|
|||
.wrap{ padding: 5px;font-size: 14px;}
|
||||
.left{width:425px;float: left;}
|
||||
.right{width:160px;border: 1px solid #ccc;float: right;padding: 5px;margin-right: 5px;}
|
||||
.right .pre{height: 332px;overflow-y: auto;}
|
||||
.right .preitem{border: white 1px solid;margin: 5px 0;padding: 2px 0;}
|
||||
.right .preitem:hover{background-color: lemonChiffon;cursor: pointer;border: #ccc 1px solid;}
|
||||
.right .preitem img{display: block;margin: 0 auto;width:100px;}
|
||||
.clear{clear: both;}
|
||||
.top{height:26px;line-height: 26px;padding: 5px;}
|
||||
.bottom{height:320px;width:100%;margin: 0 auto;}
|
||||
.transparent{ background: url("images/bg.gif") repeat;}
|
||||
.bottom table tr td{border:1px dashed #ccc;}
|
||||
#colorPicker{width: 17px;height: 17px;border: 1px solid #CCC;display: inline-block;border-radius: 3px;box-shadow: 2px 2px 5px #D3D6DA;}
|
||||
.border_style1{padding:2px;border: 1px solid #ccc;border-radius: 5px;box-shadow:2px 2px 5px #d3d6da;}
|
||||
p{margin: 5px 0}
|
||||
table{clear:both;margin-bottom:10px;border-collapse:collapse;word-break:break-all;}
|
||||
li{clear:both}
|
||||
.wrap{ padding: 5px;font-size: 14px;}
|
||||
.left{width:425px;float: left;}
|
||||
.right{width:160px;border: 1px solid #ccc;float: right;padding: 5px;margin-right: 5px;}
|
||||
.right .pre{height: 332px;overflow-y: auto;}
|
||||
.right .preitem{border: white 1px solid;margin: 5px 0;padding: 2px 0;}
|
||||
.right .preitem:hover{background-color: lemonChiffon;cursor: pointer;border: #ccc 1px solid;}
|
||||
.right .preitem img{display: block;margin: 0 auto;width:100px;}
|
||||
.clear{clear: both;}
|
||||
.top{height:26px;line-height: 26px;padding: 5px;}
|
||||
.bottom{height:320px;width:100%;margin: 0 auto;}
|
||||
.transparent{ background: url("images/bg.gif") repeat;}
|
||||
.bottom table tr td{border:1px dashed #ccc;}
|
||||
#colorPicker{width: 17px;height: 17px;border: 1px solid #CCC;display: inline-block;border-radius: 3px;box-shadow: 2px 2px 5px #D3D6DA;}
|
||||
.border_style1{padding:2px;border: 1px solid #ccc;border-radius: 5px;box-shadow:2px 2px 5px #d3d6da;}
|
||||
p{margin: 5px 0}
|
||||
table{clear:both;margin-bottom:10px;border-collapse:collapse;word-break:break-all;}
|
||||
li{clear:both}
|
||||
ol{padding-left:40px; }
|
||||
|
|
@ -1,26 +1,26 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title></title>
|
||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="template.css">
|
||||
</head>
|
||||
<body>
|
||||
<div class="wrap">
|
||||
<div class="left">
|
||||
<div class="top">
|
||||
<label><var id="lang_template_clear"></var>：<input id="issave" type="checkbox"></label>
|
||||
</div>
|
||||
<div class="bottom border_style1" id="preview"></div>
|
||||
</div>
|
||||
<fieldset class="right border_style1">
|
||||
<legend><var id="lang_template_select"></var></legend>
|
||||
<div class="pre" id="preitem"></div>
|
||||
</fieldset>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
<script type="text/javascript" src="config.js"></script>
|
||||
<script type="text/javascript" src="template.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title></title>
|
||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="template.css">
|
||||
</head>
|
||||
<body>
|
||||
<div class="wrap">
|
||||
<div class="left">
|
||||
<div class="top">
|
||||
<label><var id="lang_template_clear"></var>：<input id="issave" type="checkbox"></label>
|
||||
</div>
|
||||
<div class="bottom border_style1" id="preview"></div>
|
||||
</div>
|
||||
<fieldset class="right border_style1">
|
||||
<legend><var id="lang_template_select"></var></legend>
|
||||
<div class="pre" id="preitem"></div>
|
||||
</fieldset>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
<script type="text/javascript" src="config.js"></script>
|
||||
<script type="text/javascript" src="template.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -1,53 +1,53 @@
|
|||
/**
|
||||
* Created with JetBrains PhpStorm.
|
||||
* User: xuheng
|
||||
* Date: 12-8-8
|
||||
* Time: 下午2:09
|
||||
* To change this template use File | Settings | File Templates.
|
||||
*/
|
||||
(function () {
|
||||
var me = editor,
|
||||
preview = $G( "preview" ),
|
||||
preitem = $G( "preitem" ),
|
||||
tmps = templates,
|
||||
currentTmp;
|
||||
var initPre = function () {
|
||||
var str = "";
|
||||
for ( var i = 0, tmp; tmp = tmps[i++]; ) {
|
||||
str += '<div class="preitem" onclick="pre(' + i + ')"><img src="' + "images/" + tmp.pre + '" ' + (tmp.title ? "alt=" + tmp.title + " title=" + tmp.title + "" : "") + '></div>';
|
||||
}
|
||||
preitem.innerHTML = str;
|
||||
};
|
||||
var pre = function ( n ) {
|
||||
var tmp = tmps[n - 1];
|
||||
currentTmp = tmp;
|
||||
clearItem();
|
||||
domUtils.setStyles( preitem.childNodes[n - 1], {
|
||||
"background-color":"lemonChiffon",
|
||||
"border":"#ccc 1px solid"
|
||||
} );
|
||||
preview.innerHTML = tmp.preHtml ? tmp.preHtml : "";
|
||||
};
|
||||
var clearItem = function () {
|
||||
var items = preitem.children;
|
||||
for ( var i = 0, item; item = items[i++]; ) {
|
||||
domUtils.setStyles( item, {
|
||||
"background-color":"",
|
||||
"border":"white 1px solid"
|
||||
} );
|
||||
}
|
||||
};
|
||||
dialog.onok = function () {
|
||||
if ( !$G( "issave" ).checked ){
|
||||
me.execCommand( "cleardoc" );
|
||||
}
|
||||
var obj = {
|
||||
html:currentTmp && currentTmp.html
|
||||
};
|
||||
me.execCommand( "template", obj );
|
||||
};
|
||||
initPre();
|
||||
window.pre = pre;
|
||||
pre(2)
|
||||
|
||||
/**
|
||||
* Created with JetBrains PhpStorm.
|
||||
* User: xuheng
|
||||
* Date: 12-8-8
|
||||
* Time: 下午2:09
|
||||
* To change this template use File | Settings | File Templates.
|
||||
*/
|
||||
(function () {
|
||||
var me = editor,
|
||||
preview = $G( "preview" ),
|
||||
preitem = $G( "preitem" ),
|
||||
tmps = templates,
|
||||
currentTmp;
|
||||
var initPre = function () {
|
||||
var str = "";
|
||||
for ( var i = 0, tmp; tmp = tmps[i++]; ) {
|
||||
str += '<div class="preitem" onclick="pre(' + i + ')"><img src="' + "images/" + tmp.pre + '" ' + (tmp.title ? "alt=" + tmp.title + " title=" + tmp.title + "" : "") + '></div>';
|
||||
}
|
||||
preitem.innerHTML = str;
|
||||
};
|
||||
var pre = function ( n ) {
|
||||
var tmp = tmps[n - 1];
|
||||
currentTmp = tmp;
|
||||
clearItem();
|
||||
domUtils.setStyles( preitem.childNodes[n - 1], {
|
||||
"background-color":"lemonChiffon",
|
||||
"border":"#ccc 1px solid"
|
||||
} );
|
||||
preview.innerHTML = tmp.preHtml ? tmp.preHtml : "";
|
||||
};
|
||||
var clearItem = function () {
|
||||
var items = preitem.children;
|
||||
for ( var i = 0, item; item = items[i++]; ) {
|
||||
domUtils.setStyles( item, {
|
||||
"background-color":"",
|
||||
"border":"white 1px solid"
|
||||
} );
|
||||
}
|
||||
};
|
||||
dialog.onok = function () {
|
||||
if ( !$G( "issave" ).checked ){
|
||||
me.execCommand( "cleardoc" );
|
||||
}
|
||||
var obj = {
|
||||
html:currentTmp && currentTmp.html
|
||||
};
|
||||
me.execCommand( "template", obj );
|
||||
};
|
||||
initPre();
|
||||
window.pre = pre;
|
||||
pre(2)
|
||||
|
||||
})();
|
||||
File diff suppressed because it is too large
Load Diff
|
|
@ -1,86 +1,86 @@
|
|||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
|
||||
"http://www.w3.org/TR/html4/loose.dtd">
|
||||
<html>
|
||||
<head>
|
||||
<title></title>
|
||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="video.css" />
|
||||
</head>
|
||||
<body>
|
||||
<div class="wrapper">
|
||||
<div id="videoTab">
|
||||
<div id="tabHeads" class="tabhead">
|
||||
<span tabSrc="video" class="focus" data-content-id="video"><var id="lang_tab_insertV"></var></span>
|
||||
<span tabSrc="upload" data-content-id="upload"><var id="lang_tab_uploadV"></var></span>
|
||||
</div>
|
||||
<div id="tabBodys" class="tabbody">
|
||||
<div id="video" class="panel focus">
|
||||
<table><tr><td><label for="videoUrl" class="url"><var id="lang_video_url"></var></label></td><td><input id="videoUrl" type="text"></td></tr></table>
|
||||
<div id="preview"></div>
|
||||
<div id="videoInfo">
|
||||
<fieldset>
|
||||
<legend><var id="lang_video_size"></var></legend>
|
||||
<table>
|
||||
<tr><td><label for="videoWidth"><var id="lang_videoW"></var></label></td><td><input class="txt" id="videoWidth" type="text"/></td></tr>
|
||||
<tr><td><label for="videoHeight"><var id="lang_videoH"></var></label></td><td><input class="txt" id="videoHeight" type="text"/></td></tr>
|
||||
</table>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend><var id="lang_alignment"></var></legend>
|
||||
<div id="videoFloat"></div>
|
||||
</fieldset>
|
||||
</div>
|
||||
</div>
|
||||
<div id="upload" class="panel">
|
||||
<div id="upload_left">
|
||||
<div id="queueList" class="queueList">
|
||||
<div class="statusBar element-invisible">
|
||||
<div class="progress">
|
||||
<span class="text">0%</span>
|
||||
<span class="percentage"></span>
|
||||
</div><div class="info"></div>
|
||||
<div class="btns">
|
||||
<div id="filePickerBtn"></div>
|
||||
<div class="uploadBtn"><var id="lang_start_upload"></var></div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="dndArea" class="placeholder">
|
||||
<div class="filePickerContainer">
|
||||
<div id="filePickerReady"></div>
|
||||
</div>
|
||||
</div>
|
||||
<ul class="filelist element-invisible">
|
||||
<li id="filePickerBlock" class="filePickerBlock"></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div id="uploadVideoInfo">
|
||||
<fieldset>
|
||||
<legend><var id="lang_upload_size"></var></legend>
|
||||
<table>
|
||||
<tr><td><label><var id="lang_upload_width"></var></label></td><td><input class="txt" id="upload_width" type="text"/></td></tr>
|
||||
<tr><td><label><var id="lang_upload_height"></var></label></td><td><input class="txt" id="upload_height" type="text"/></td></tr>
|
||||
</table>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend><var id="lang_upload_alignment"></var></legend>
|
||||
<div id="upload_alignment"></div>
|
||||
</fieldset>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- jquery -->
|
||||
<script type="text/javascript" src="../../third-party/jquery-1.10.2.min.js"></script>
|
||||
|
||||
<!-- webuploader -->
|
||||
<script type="text/javascript" src="../../third-party/webuploader/webuploader.min.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="../../third-party/webuploader/webuploader.css">
|
||||
|
||||
<!-- video -->
|
||||
<script type="text/javascript" src="video.js"></script>
|
||||
</body>
|
||||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
|
||||
"http://www.w3.org/TR/html4/loose.dtd">
|
||||
<html>
|
||||
<head>
|
||||
<title></title>
|
||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="video.css" />
|
||||
</head>
|
||||
<body>
|
||||
<div class="wrapper">
|
||||
<div id="videoTab">
|
||||
<div id="tabHeads" class="tabhead">
|
||||
<span tabSrc="video" class="focus" data-content-id="video"><var id="lang_tab_insertV"></var></span>
|
||||
<span tabSrc="upload" data-content-id="upload"><var id="lang_tab_uploadV"></var></span>
|
||||
</div>
|
||||
<div id="tabBodys" class="tabbody">
|
||||
<div id="video" class="panel focus">
|
||||
<table><tr><td><label for="videoUrl" class="url"><var id="lang_video_url"></var></label></td><td><input id="videoUrl" type="text"></td></tr></table>
|
||||
<div id="preview"></div>
|
||||
<div id="videoInfo">
|
||||
<fieldset>
|
||||
<legend><var id="lang_video_size"></var></legend>
|
||||
<table>
|
||||
<tr><td><label for="videoWidth"><var id="lang_videoW"></var></label></td><td><input class="txt" id="videoWidth" type="text"/></td></tr>
|
||||
<tr><td><label for="videoHeight"><var id="lang_videoH"></var></label></td><td><input class="txt" id="videoHeight" type="text"/></td></tr>
|
||||
</table>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend><var id="lang_alignment"></var></legend>
|
||||
<div id="videoFloat"></div>
|
||||
</fieldset>
|
||||
</div>
|
||||
</div>
|
||||
<div id="upload" class="panel">
|
||||
<div id="upload_left">
|
||||
<div id="queueList" class="queueList">
|
||||
<div class="statusBar element-invisible">
|
||||
<div class="progress">
|
||||
<span class="text">0%</span>
|
||||
<span class="percentage"></span>
|
||||
</div><div class="info"></div>
|
||||
<div class="btns">
|
||||
<div id="filePickerBtn"></div>
|
||||
<div class="uploadBtn"><var id="lang_start_upload"></var></div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="dndArea" class="placeholder">
|
||||
<div class="filePickerContainer">
|
||||
<div id="filePickerReady"></div>
|
||||
</div>
|
||||
</div>
|
||||
<ul class="filelist element-invisible">
|
||||
<li id="filePickerBlock" class="filePickerBlock"></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div id="uploadVideoInfo">
|
||||
<fieldset>
|
||||
<legend><var id="lang_upload_size"></var></legend>
|
||||
<table>
|
||||
<tr><td><label><var id="lang_upload_width"></var></label></td><td><input class="txt" id="upload_width" type="text"/></td></tr>
|
||||
<tr><td><label><var id="lang_upload_height"></var></label></td><td><input class="txt" id="upload_height" type="text"/></td></tr>
|
||||
</table>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend><var id="lang_upload_alignment"></var></legend>
|
||||
<div id="upload_alignment"></div>
|
||||
</fieldset>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- jquery -->
|
||||
<script type="text/javascript" src="../../third-party/jquery-1.10.2.min.js"></script>
|
||||
|
||||
<!-- webuploader -->
|
||||
<script type="text/javascript" src="../../third-party/webuploader/webuploader.min.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="../../third-party/webuploader/webuploader.css">
|
||||
|
||||
<!-- video -->
|
||||
<script type="text/javascript" src="video.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
File diff suppressed because it is too large
Load Diff
|
|
@ -1,53 +1,53 @@
|
|||
<!DOCTYPE>
|
||||
<html>
|
||||
<head>
|
||||
<title></title>
|
||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
<style type="text/css">
|
||||
.wrapper{width: 540px; margin: 10px auto;}
|
||||
#appShow {border: 1px solid #ddd;}
|
||||
.errorMsg{font-size: 13px;margin: 10px;color: #dd0000}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="wrapper">
|
||||
<div id="appShow"></div>
|
||||
</div>
|
||||
<script type="text/javascript">
|
||||
//此处配置您在百度上申请到的appkey。
|
||||
var apikey = editor.options.webAppKey;
|
||||
if ( apikey && apikey.length == 24 ) {
|
||||
var searchConfig = {
|
||||
container:'appShow', //容器ID
|
||||
tips:"", //该值用于自动清空
|
||||
search:1, //是否显示搜索框
|
||||
ps:12, //每页显示的条数
|
||||
suggest:1, //是否开启搜索自动完成
|
||||
limit:0, //搜索结果显示条数，0表示无限制
|
||||
searchNow:0, //是否在初始化完成时立即搜索
|
||||
apikey:apikey, //每人得
|
||||
pager:1,
|
||||
cid:7134562,
|
||||
outputHTML:1
|
||||
},baiduApp;
|
||||
|
||||
function clickCallback() {
|
||||
baiduApp.addEventListener( 'getAppHTML', function ( e, data ) {
|
||||
var url = 'http://app.baidu.com/app/enter?appid='+data.data['app_id'] +'&tn=app_canvas&app_spce_id=1&apikey='+apikey+'&api_key=' + apikey;
|
||||
editor.execCommand( "webapp", {url:url,width:data.uniWidth,height:data.uniHeight+60,logo:data.data['app_logo'],title:data.data['app_name']});
|
||||
dialog.close();
|
||||
} );
|
||||
}
|
||||
|
||||
var script = document.createElement( "script" );
|
||||
script.type = "text/javascript";
|
||||
script.src = "http://app.baidu.com/appweb/api/search?auto=yes&container=container&apikey=" + apikey + "&instanceName=baiduApp&callback=clickCallback&config=searchConfig";
|
||||
document.body.appendChild( script );
|
||||
} else {
|
||||
$G( "appShow" ).innerHTML = "<p class='errorMsg'>"+lang.tip1+"<a title='"+lang.anthorApi+"' href='http://app.baidu.com/static/cms/getapikey.html' target='_blank'>"+lang.applyFor+"</a></p><p class='errorMsg'>"+lang.tip2+"</p>" ;
|
||||
}
|
||||
|
||||
</script>
|
||||
</body>
|
||||
<!DOCTYPE>
|
||||
<html>
|
||||
<head>
|
||||
<title></title>
|
||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
<style type="text/css">
|
||||
.wrapper{width: 540px; margin: 10px auto;}
|
||||
#appShow {border: 1px solid #ddd;}
|
||||
.errorMsg{font-size: 13px;margin: 10px;color: #dd0000}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="wrapper">
|
||||
<div id="appShow"></div>
|
||||
</div>
|
||||
<script type="text/javascript">
|
||||
//此处配置您在百度上申请到的appkey。
|
||||
var apikey = editor.options.webAppKey;
|
||||
if ( apikey && apikey.length == 24 ) {
|
||||
var searchConfig = {
|
||||
container:'appShow', //容器ID
|
||||
tips:"", //该值用于自动清空
|
||||
search:1, //是否显示搜索框
|
||||
ps:12, //每页显示的条数
|
||||
suggest:1, //是否开启搜索自动完成
|
||||
limit:0, //搜索结果显示条数，0表示无限制
|
||||
searchNow:0, //是否在初始化完成时立即搜索
|
||||
apikey:apikey, //每人得
|
||||
pager:1,
|
||||
cid:7134562,
|
||||
outputHTML:1
|
||||
},baiduApp;
|
||||
|
||||
function clickCallback() {
|
||||
baiduApp.addEventListener( 'getAppHTML', function ( e, data ) {
|
||||
var url = 'http://app.baidu.com/app/enter?appid='+data.data['app_id'] +'&tn=app_canvas&app_spce_id=1&apikey='+apikey+'&api_key=' + apikey;
|
||||
editor.execCommand( "webapp", {url:url,width:data.uniWidth,height:data.uniHeight+60,logo:data.data['app_logo'],title:data.data['app_name']});
|
||||
dialog.close();
|
||||
} );
|
||||
}
|
||||
|
||||
var script = document.createElement( "script" );
|
||||
script.type = "text/javascript";
|
||||
script.src = "http://app.baidu.com/appweb/api/search?auto=yes&container=container&apikey=" + apikey + "&instanceName=baiduApp&callback=clickCallback&config=searchConfig";
|
||||
document.body.appendChild( script );
|
||||
} else {
|
||||
$G( "appShow" ).innerHTML = "<p class='errorMsg'>"+lang.tip1+"<a title='"+lang.anthorApi+"' href='http://app.baidu.com/static/cms/getapikey.html' target='_blank'>"+lang.applyFor+"</a></p><p class='errorMsg'>"+lang.tip2+"</p>" ;
|
||||
}
|
||||
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,111 +1,111 @@
|
|||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
|
||||
"http://www.w3.org/TR/html4/loose.dtd">
|
||||
<html>
|
||||
<head>
|
||||
<title></title>
|
||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
<style type="text/css">
|
||||
.wrapper{width: 600px;padding: 10px;height: 352px;overflow: hidden;position: relative;border-bottom: 1px solid #d7d7d7}
|
||||
.localPath input{float: left;width: 350px;line-height: 20px;height: 20px;}
|
||||
#clipboard{float:left;width: 70px;height: 30px; }
|
||||
.description{ color: #0066cc; margin-top: 2px; width: 450px; height: 45px;float: left;line-height: 22px}
|
||||
#upload{width: 100px;height: 30px;float: right; margin:10px 2px 0 0;cursor: pointer;}
|
||||
#msg{ width: 140px; height: 30px; line-height:25px;float: left;color: red}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="wrapper">
|
||||
<div class="localPath">
|
||||
<input id="localPath" type="text" readonly />
|
||||
<div id="clipboard"></div>
|
||||
<div id="msg"></div>
|
||||
</div>
|
||||
<div id="flashContainer"></div>
|
||||
<div>
|
||||
<div id="upload" style="display: none" ><img id="uploadBtn"></div>
|
||||
<div class="description">
|
||||
<span style="color: red"><var id="lang_resave"></var>: </span><var id="lang_step"></var>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/javascript" src="tangram.js"></script>
|
||||
<script type="text/javascript" src="wordimage.js"></script>
|
||||
<script type="text/javascript">
|
||||
editor.setOpt({
|
||||
wordImageFieldName:"upfile",
|
||||
compressSide:0,
|
||||
maxImageSideLength:900
|
||||
});
|
||||
|
||||
//全局变量
|
||||
var imageUrls = [], //用于保存从服务器返回的图片信息数组
|
||||
selectedImageCount = 0, //当前已选择的但未上传的图片数量
|
||||
optImageUrl = editor.getActionUrl(editor.getOpt('imageActionName')),
|
||||
optImageFieldName = editor.getOpt('imageFieldName'),
|
||||
optImageCompressBorder = editor.getOpt('imageCompressEnable') ? editor.getOpt('imageCompressBorder'):null,
|
||||
maxSize = editor.getOpt('imageMaxSize') / 1024,
|
||||
extension = editor.getOpt('imageAllowFiles').join(';').replace(/\./g, '*.');
|
||||
|
||||
/* 添加额外的GET参数 */
|
||||
var params = utils.serializeParam(editor.queryCommandValue('serverparam')) || '',
|
||||
urlWidthParams = optImageUrl + (optImageUrl.indexOf('?') == -1 ? '?':'&') + params;
|
||||
|
||||
utils.domReady(function(){
|
||||
//创建Flash相关的参数集合
|
||||
var flashOptions = {
|
||||
container:"flashContainer", //flash容器id
|
||||
url:urlWidthParams, // 上传处理页面的url地址
|
||||
ext:editor.queryCommandValue('serverParam') || {}, //可向服务器提交的自定义参数列表
|
||||
fileType:'{"description":"'+lang.fileType+'", "extension":"' + extension + '"}', //上传文件格式限制
|
||||
flashUrl:'imageUploader.swf', //上传用的flash组件地址
|
||||
width:600, //flash的宽度
|
||||
height:272, //flash的高度
|
||||
gridWidth:120, // 每一个预览图片所占的宽度
|
||||
gridHeight:120, // 每一个预览图片所占的高度
|
||||
picWidth:100, // 单张预览图片的宽度
|
||||
picHeight:100, // 单张预览图片的高度
|
||||
uploadDataFieldName: optImageFieldName, // POST请求中图片数据的key
|
||||
picDescFieldName:'pictitle', // POST请求中图片描述的key
|
||||
maxSize: maxSize, // 文件的最大体积,单位M
|
||||
compressSize:1, // 上传前如果图片体积超过该值，会先压缩,单位M
|
||||
maxNum:32, // 单次最大可上传多少个文件
|
||||
compressSide: 0, //等比压缩的基准，0为按照最长边，1为按照宽度，2为按照高度
|
||||
compressLength: optImageCompressBorder //能接受的最大边长，超过该值Flash会自动等比压缩
|
||||
};
|
||||
//回调函数集合，支持传递函数名的字符串、函数句柄以及函数本身三种类型
|
||||
var callbacks={
|
||||
selectFileCallback: function(selectFiles){ // 选择文件的回调
|
||||
selectedImageCount += selectFiles.length;
|
||||
if(selectedImageCount) baidu.g("upload").style.display = "";
|
||||
dialog.buttons[0].setDisabled(true); //初始化时置灰确定按钮
|
||||
},
|
||||
deleteFileCallback: function(delFiles){ // 删除文件的回调
|
||||
selectedImageCount -= delFiles.length;
|
||||
if (!selectedImageCount) {
|
||||
baidu.g("upload").style.display = "none";
|
||||
dialog.buttons[0].setDisabled(false); //没有选择图片时重新点亮按钮
|
||||
}
|
||||
},
|
||||
uploadCompleteCallback: function(data){ // 单个文件上传完成的回调
|
||||
try{var info = eval("(" + data.info + ")");
|
||||
info && imageUrls.push(info);
|
||||
selectedImageCount--;
|
||||
}catch(e){}
|
||||
},
|
||||
uploadErrorCallback: function (data){ // 单个文件上传失败的回调,
|
||||
console && console.log(data);
|
||||
},
|
||||
allCompleteCallback: function(){ // 全部上传完成时的回调
|
||||
dialog.buttons[0].setDisabled(false); //上传完毕后点亮按钮
|
||||
}
|
||||
//exceedFileCallback: 'exceedFileCallback', // 文件超出限制的最大体积时的回调
|
||||
//startUploadCallback: startUploadCallback // 开始上传某个文件时的回调
|
||||
};
|
||||
wordImage.init(flashOptions,callbacks);
|
||||
});
|
||||
|
||||
</script>
|
||||
|
||||
</body>
|
||||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
|
||||
"http://www.w3.org/TR/html4/loose.dtd">
|
||||
<html>
|
||||
<head>
|
||||
<title></title>
|
||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
<style type="text/css">
|
||||
.wrapper{width: 600px;padding: 10px;height: 352px;overflow: hidden;position: relative;border-bottom: 1px solid #d7d7d7}
|
||||
.localPath input{float: left;width: 350px;line-height: 20px;height: 20px;}
|
||||
#clipboard{float:left;width: 70px;height: 30px; }
|
||||
.description{ color: #0066cc; margin-top: 2px; width: 450px; height: 45px;float: left;line-height: 22px}
|
||||
#upload{width: 100px;height: 30px;float: right; margin:10px 2px 0 0;cursor: pointer;}
|
||||
#msg{ width: 140px; height: 30px; line-height:25px;float: left;color: red}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="wrapper">
|
||||
<div class="localPath">
|
||||
<input id="localPath" type="text" readonly />
|
||||
<div id="clipboard"></div>
|
||||
<div id="msg"></div>
|
||||
</div>
|
||||
<div id="flashContainer"></div>
|
||||
<div>
|
||||
<div id="upload" style="display: none" ><img id="uploadBtn"></div>
|
||||
<div class="description">
|
||||
<span style="color: red"><var id="lang_resave"></var>: </span><var id="lang_step"></var>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/javascript" src="tangram.js"></script>
|
||||
<script type="text/javascript" src="wordimage.js"></script>
|
||||
<script type="text/javascript">
|
||||
editor.setOpt({
|
||||
wordImageFieldName:"upfile",
|
||||
compressSide:0,
|
||||
maxImageSideLength:900
|
||||
});
|
||||
|
||||
//全局变量
|
||||
var imageUrls = [], //用于保存从服务器返回的图片信息数组
|
||||
selectedImageCount = 0, //当前已选择的但未上传的图片数量
|
||||
optImageUrl = editor.getActionUrl(editor.getOpt('imageActionName')),
|
||||
optImageFieldName = editor.getOpt('imageFieldName'),
|
||||
optImageCompressBorder = editor.getOpt('imageCompressEnable') ? editor.getOpt('imageCompressBorder'):null,
|
||||
maxSize = editor.getOpt('imageMaxSize') / 1024,
|
||||
extension = editor.getOpt('imageAllowFiles').join(';').replace(/\./g, '*.');
|
||||
|
||||
/* 添加额外的GET参数 */
|
||||
var params = utils.serializeParam(editor.queryCommandValue('serverparam')) || '',
|
||||
urlWidthParams = optImageUrl + (optImageUrl.indexOf('?') == -1 ? '?':'&') + params;
|
||||
|
||||
utils.domReady(function(){
|
||||
//创建Flash相关的参数集合
|
||||
var flashOptions = {
|
||||
container:"flashContainer", //flash容器id
|
||||
url:urlWidthParams, // 上传处理页面的url地址
|
||||
ext:editor.queryCommandValue('serverParam') || {}, //可向服务器提交的自定义参数列表
|
||||
fileType:'{"description":"'+lang.fileType+'", "extension":"' + extension + '"}', //上传文件格式限制
|
||||
flashUrl:'imageUploader.swf', //上传用的flash组件地址
|
||||
width:600, //flash的宽度
|
||||
height:272, //flash的高度
|
||||
gridWidth:120, // 每一个预览图片所占的宽度
|
||||
gridHeight:120, // 每一个预览图片所占的高度
|
||||
picWidth:100, // 单张预览图片的宽度
|
||||
picHeight:100, // 单张预览图片的高度
|
||||
uploadDataFieldName: optImageFieldName, // POST请求中图片数据的key
|
||||
picDescFieldName:'pictitle', // POST请求中图片描述的key
|
||||
maxSize: maxSize, // 文件的最大体积,单位M
|
||||
compressSize:1, // 上传前如果图片体积超过该值，会先压缩,单位M
|
||||
maxNum:32, // 单次最大可上传多少个文件
|
||||
compressSide: 0, //等比压缩的基准，0为按照最长边，1为按照宽度，2为按照高度
|
||||
compressLength: optImageCompressBorder //能接受的最大边长，超过该值Flash会自动等比压缩
|
||||
};
|
||||
//回调函数集合，支持传递函数名的字符串、函数句柄以及函数本身三种类型
|
||||
var callbacks={
|
||||
selectFileCallback: function(selectFiles){ // 选择文件的回调
|
||||
selectedImageCount += selectFiles.length;
|
||||
if(selectedImageCount) baidu.g("upload").style.display = "";
|
||||
dialog.buttons[0].setDisabled(true); //初始化时置灰确定按钮
|
||||
},
|
||||
deleteFileCallback: function(delFiles){ // 删除文件的回调
|
||||
selectedImageCount -= delFiles.length;
|
||||
if (!selectedImageCount) {
|
||||
baidu.g("upload").style.display = "none";
|
||||
dialog.buttons[0].setDisabled(false); //没有选择图片时重新点亮按钮
|
||||
}
|
||||
},
|
||||
uploadCompleteCallback: function(data){ // 单个文件上传完成的回调
|
||||
try{var info = eval("(" + data.info + ")");
|
||||
info && imageUrls.push(info);
|
||||
selectedImageCount--;
|
||||
}catch(e){}
|
||||
},
|
||||
uploadErrorCallback: function (data){ // 单个文件上传失败的回调,
|
||||
console && console.log(data);
|
||||
},
|
||||
allCompleteCallback: function(){ // 全部上传完成时的回调
|
||||
dialog.buttons[0].setDisabled(false); //上传完毕后点亮按钮
|
||||
}
|
||||
//exceedFileCallback: 'exceedFileCallback', // 文件超出限制的最大体积时的回调
|
||||
//startUploadCallback: startUploadCallback // 开始上传某个文件时的回调
|
||||
};
|
||||
wordImage.init(flashOptions,callbacks);
|
||||
});
|
||||
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,157 +1,157 @@
|
|||
/**
|
||||
* Created by JetBrains PhpStorm.
|
||||
* User: taoqili
|
||||
* Date: 12-1-30
|
||||
* Time: 下午12:50
|
||||
* To change this template use File | Settings | File Templates.
|
||||
*/
|
||||
|
||||
|
||||
|
||||
var wordImage = {};
|
||||
//(function(){
|
||||
var g = baidu.g,
|
||||
flashObj,flashContainer;
|
||||
|
||||
wordImage.init = function(opt, callbacks) {
|
||||
showLocalPath("localPath");
|
||||
//createCopyButton("clipboard","localPath");
|
||||
createFlashUploader(opt, callbacks);
|
||||
addUploadListener();
|
||||
addOkListener();
|
||||
};
|
||||
|
||||
function hideFlash(){
|
||||
flashObj = null;
|
||||
flashContainer.innerHTML = "";
|
||||
}
|
||||
function addOkListener() {
|
||||
dialog.onok = function() {
|
||||
if (!imageUrls.length) return;
|
||||
var urlPrefix = editor.getOpt('imageUrlPrefix'),
|
||||
images = domUtils.getElementsByTagName(editor.document,"img");
|
||||
editor.fireEvent('saveScene');
|
||||
for (var i = 0,img; img = images[i++];) {
|
||||
var src = img.getAttribute("word_img");
|
||||
if (!src) continue;
|
||||
for (var j = 0,url; url = imageUrls[j++];) {
|
||||
if (src.indexOf(url.original.replace(" ","")) != -1) {
|
||||
img.src = urlPrefix + url.url;
|
||||
img.setAttribute("_src", urlPrefix + url.url); //同时修改"_src"属性
|
||||
img.setAttribute("title",url.title);
|
||||
domUtils.removeAttributes(img, ["word_img","style","width","height"]);
|
||||
editor.fireEvent("selectionchange");
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
editor.fireEvent('saveScene');
|
||||
hideFlash();
|
||||
};
|
||||
dialog.oncancel = function(){
|
||||
hideFlash();
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 绑定开始上传事件
|
||||
*/
|
||||
function addUploadListener() {
|
||||
g("upload").onclick = function () {
|
||||
flashObj.upload();
|
||||
this.style.display = "none";
|
||||
};
|
||||
}
|
||||
|
||||
function showLocalPath(id) {
|
||||
//单张编辑
|
||||
var img = editor.selection.getRange().getClosedNode();
|
||||
var images = editor.execCommand('wordimage');
|
||||
if(images.length==1 || img && img.tagName == 'IMG'){
|
||||
g(id).value = images[0];
|
||||
return;
|
||||
}
|
||||
var path = images[0];
|
||||
var leftSlashIndex = path.lastIndexOf("/")||0, //不同版本的doc和浏览器都可能影响到这个符号，故直接判断两种
|
||||
rightSlashIndex = path.lastIndexOf("\\")||0,
|
||||
separater = leftSlashIndex > rightSlashIndex ? "/":"\\" ;
|
||||
|
||||
path = path.substring(0, path.lastIndexOf(separater)+1);
|
||||
g(id).value = path;
|
||||
}
|
||||
|
||||
function createFlashUploader(opt, callbacks) {
|
||||
//由于lang.flashI18n是静态属性，不可以直接进行修改，否则会影响到后续内容
|
||||
var i18n = utils.extend({},lang.flashI18n);
|
||||
//处理图片资源地址的编码，补全等问题
|
||||
for(var i in i18n){
|
||||
if(!(i in {"lang":1,"uploadingTF":1,"imageTF":1,"textEncoding":1}) && i18n[i]){
|
||||
i18n[i] = encodeURIComponent(editor.options.langPath + editor.options.lang + "/images/" + i18n[i]);
|
||||
}
|
||||
}
|
||||
opt = utils.extend(opt,i18n,false);
|
||||
var option = {
|
||||
createOptions:{
|
||||
id:'flash',
|
||||
url:opt.flashUrl,
|
||||
width:opt.width,
|
||||
height:opt.height,
|
||||
errorMessage:lang.flashError,
|
||||
wmode:browser.safari ? 'transparent' : 'window',
|
||||
ver:'10.0.0',
|
||||
vars:opt,
|
||||
container:opt.container
|
||||
}
|
||||
};
|
||||
|
||||
option = extendProperty(callbacks, option);
|
||||
flashObj = new baidu.flash.imageUploader(option);
|
||||
flashContainer = $G(opt.container);
|
||||
}
|
||||
|
||||
function extendProperty(fromObj, toObj) {
|
||||
for (var i in fromObj) {
|
||||
if (!toObj[i]) {
|
||||
toObj[i] = fromObj[i];
|
||||
}
|
||||
}
|
||||
return toObj;
|
||||
}
|
||||
|
||||
//})();
|
||||
|
||||
function getPasteData(id) {
|
||||
baidu.g("msg").innerHTML = lang.copySuccess + "</br>";
|
||||
setTimeout(function() {
|
||||
baidu.g("msg").innerHTML = "";
|
||||
}, 5000);
|
||||
return baidu.g(id).value;
|
||||
}
|
||||
|
||||
function createCopyButton(id, dataFrom) {
|
||||
baidu.swf.create({
|
||||
id:"copyFlash",
|
||||
url:"fClipboard_ueditor.swf",
|
||||
width:"58",
|
||||
height:"25",
|
||||
errorMessage:"",
|
||||
bgColor:"#CBCBCB",
|
||||
wmode:"transparent",
|
||||
ver:"10.0.0",
|
||||
vars:{
|
||||
tid:dataFrom
|
||||
}
|
||||
}, id
|
||||
);
|
||||
|
||||
var clipboard = baidu.swf.getMovie("copyFlash");
|
||||
var clipinterval = setInterval(function() {
|
||||
if (clipboard && clipboard.flashInit) {
|
||||
clearInterval(clipinterval);
|
||||
clipboard.setHandCursor(true);
|
||||
clipboard.setContentFuncName("getPasteData");
|
||||
//clipboard.setMEFuncName("mouseEventHandler");
|
||||
}
|
||||
}, 500);
|
||||
}
|
||||
/**
|
||||
* Created by JetBrains PhpStorm.
|
||||
* User: taoqili
|
||||
* Date: 12-1-30
|
||||
* Time: 下午12:50
|
||||
* To change this template use File | Settings | File Templates.
|
||||
*/
|
||||
|
||||
|
||||
|
||||
var wordImage = {};
|
||||
//(function(){
|
||||
var g = baidu.g,
|
||||
flashObj,flashContainer;
|
||||
|
||||
wordImage.init = function(opt, callbacks) {
|
||||
showLocalPath("localPath");
|
||||
//createCopyButton("clipboard","localPath");
|
||||
createFlashUploader(opt, callbacks);
|
||||
addUploadListener();
|
||||
addOkListener();
|
||||
};
|
||||
|
||||
function hideFlash(){
|
||||
flashObj = null;
|
||||
flashContainer.innerHTML = "";
|
||||
}
|
||||
function addOkListener() {
|
||||
dialog.onok = function() {
|
||||
if (!imageUrls.length) return;
|
||||
var urlPrefix = editor.getOpt('imageUrlPrefix'),
|
||||
images = domUtils.getElementsByTagName(editor.document,"img");
|
||||
editor.fireEvent('saveScene');
|
||||
for (var i = 0,img; img = images[i++];) {
|
||||
var src = img.getAttribute("word_img");
|
||||
if (!src) continue;
|
||||
for (var j = 0,url; url = imageUrls[j++];) {
|
||||
if (src.indexOf(url.original.replace(" ","")) != -1) {
|
||||
img.src = urlPrefix + url.url;
|
||||
img.setAttribute("_src", urlPrefix + url.url); //同时修改"_src"属性
|
||||
img.setAttribute("title",url.title);
|
||||
domUtils.removeAttributes(img, ["word_img","style","width","height"]);
|
||||
editor.fireEvent("selectionchange");
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
editor.fireEvent('saveScene');
|
||||
hideFlash();
|
||||
};
|
||||
dialog.oncancel = function(){
|
||||
hideFlash();
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 绑定开始上传事件
|
||||
*/
|
||||
function addUploadListener() {
|
||||
g("upload").onclick = function () {
|
||||
flashObj.upload();
|
||||
this.style.display = "none";
|
||||
};
|
||||
}
|
||||
|
||||
function showLocalPath(id) {
|
||||
//单张编辑
|
||||
var img = editor.selection.getRange().getClosedNode();
|
||||
var images = editor.execCommand('wordimage');
|
||||
if(images.length==1 || img && img.tagName == 'IMG'){
|
||||
g(id).value = images[0];
|
||||
return;
|
||||
}
|
||||
var path = images[0];
|
||||
var leftSlashIndex = path.lastIndexOf("/")||0, //不同版本的doc和浏览器都可能影响到这个符号，故直接判断两种
|
||||
rightSlashIndex = path.lastIndexOf("\\")||0,
|
||||
separater = leftSlashIndex > rightSlashIndex ? "/":"\\" ;
|
||||
|
||||
path = path.substring(0, path.lastIndexOf(separater)+1);
|
||||
g(id).value = path;
|
||||
}
|
||||
|
||||
function createFlashUploader(opt, callbacks) {
|
||||
//由于lang.flashI18n是静态属性，不可以直接进行修改，否则会影响到后续内容
|
||||
var i18n = utils.extend({},lang.flashI18n);
|
||||
//处理图片资源地址的编码，补全等问题
|
||||
for(var i in i18n){
|
||||
if(!(i in {"lang":1,"uploadingTF":1,"imageTF":1,"textEncoding":1}) && i18n[i]){
|
||||
i18n[i] = encodeURIComponent(editor.options.langPath + editor.options.lang + "/images/" + i18n[i]);
|
||||
}
|
||||
}
|
||||
opt = utils.extend(opt,i18n,false);
|
||||
var option = {
|
||||
createOptions:{
|
||||
id:'flash',
|
||||
url:opt.flashUrl,
|
||||
width:opt.width,
|
||||
height:opt.height,
|
||||
errorMessage:lang.flashError,
|
||||
wmode:browser.safari ? 'transparent' : 'window',
|
||||
ver:'10.0.0',
|
||||
vars:opt,
|
||||
container:opt.container
|
||||
}
|
||||
};
|
||||
|
||||
option = extendProperty(callbacks, option);
|
||||
flashObj = new baidu.flash.imageUploader(option);
|
||||
flashContainer = $G(opt.container);
|
||||
}
|
||||
|
||||
function extendProperty(fromObj, toObj) {
|
||||
for (var i in fromObj) {
|
||||
if (!toObj[i]) {
|
||||
toObj[i] = fromObj[i];
|
||||
}
|
||||
}
|
||||
return toObj;
|
||||
}
|
||||
|
||||
//})();
|
||||
|
||||
function getPasteData(id) {
|
||||
baidu.g("msg").innerHTML = lang.copySuccess + "</br>";
|
||||
setTimeout(function() {
|
||||
baidu.g("msg").innerHTML = "";
|
||||
}, 5000);
|
||||
return baidu.g(id).value;
|
||||
}
|
||||
|
||||
function createCopyButton(id, dataFrom) {
|
||||
baidu.swf.create({
|
||||
id:"copyFlash",
|
||||
url:"fClipboard_ueditor.swf",
|
||||
width:"58",
|
||||
height:"25",
|
||||
errorMessage:"",
|
||||
bgColor:"#CBCBCB",
|
||||
wmode:"transparent",
|
||||
ver:"10.0.0",
|
||||
vars:{
|
||||
tid:dataFrom
|
||||
}
|
||||
}, id
|
||||
);
|
||||
|
||||
var clipboard = baidu.swf.getMovie("copyFlash");
|
||||
var clipinterval = setInterval(function() {
|
||||
if (clipboard && clipboard.flashInit) {
|
||||
clearInterval(clipinterval);
|
||||
clipboard.setHandCursor(true);
|
||||
clipboard.setContentFuncName("getPasteData");
|
||||
//clipboard.setMEFuncName("mouseEventHandler");
|
||||
}
|
||||
}, 500);
|
||||
}
|
||||
createCopyButton("clipboard", "localPath");
|
||||
|
|
@ -1,175 +1,175 @@
|
|||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
|
||||
"http://www.w3.org/TR/html4/loose.dtd">
|
||||
<html>
|
||||
<head>
|
||||
<title>完整demo</title>
|
||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
|
||||
<script type="text/javascript" charset="utf-8" src="ueditor.config.js"></script>
|
||||
<script type="text/javascript" charset="utf-8" src="ueditor.all.min.js"> </script>
|
||||
<!--建议手动加在语言，避免在ie下有时因为加载语言失败导致编辑器加载失败-->
|
||||
<!--这里加载的语言文件会覆盖你在配置项目里添加的语言类型，比如你在配置项目里配置的是英文，这里加载的中文，那最后就是中文-->
|
||||
<script type="text/javascript" charset="utf-8" src="lang/zh-cn/zh-cn.js"></script>
|
||||
|
||||
<style type="text/css">
|
||||
div{
|
||||
width:100%;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div>
|
||||
<h1>完整demo</h1>
|
||||
<script id="editor" type="text/plain" style="width:1024px;height:500px;"></script>
|
||||
</div>
|
||||
<div id="btns">
|
||||
<div>
|
||||
<button onclick="getAllHtml()">获得整个html的内容</button>
|
||||
<button onclick="getContent()">获得内容</button>
|
||||
<button onclick="setContent()">写入内容</button>
|
||||
<button onclick="setContent(true)">追加内容</button>
|
||||
<button onclick="getContentTxt()">获得纯文本</button>
|
||||
<button onclick="getPlainTxt()">获得带格式的纯文本</button>
|
||||
<button onclick="hasContent()">判断是否有内容</button>
|
||||
<button onclick="setFocus()">使编辑器获得焦点</button>
|
||||
<button onmousedown="isFocus(event)">编辑器是否获得焦点</button>
|
||||
<button onmousedown="setblur(event)" >编辑器失去焦点</button>
|
||||
|
||||
</div>
|
||||
<div>
|
||||
<button onclick="getText()">获得当前选中的文本</button>
|
||||
<button onclick="insertHtml()">插入给定的内容</button>
|
||||
<button id="enable" onclick="setEnabled()">可以编辑</button>
|
||||
<button onclick="setDisabled()">不可编辑</button>
|
||||
<button onclick=" UE.getEditor('editor').setHide()">隐藏编辑器</button>
|
||||
<button onclick=" UE.getEditor('editor').setShow()">显示编辑器</button>
|
||||
<button onclick=" UE.getEditor('editor').setHeight(300)">设置高度为300默认关闭了自动长高</button>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<button onclick="getLocalData()" >获取草稿箱内容</button>
|
||||
<button onclick="clearLocalData()" >清空草稿箱</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div>
|
||||
<button onclick="createEditor()">
|
||||
创建编辑器</button>
|
||||
<button onclick="deleteEditor()">
|
||||
删除编辑器</button>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
|
||||
//实例化编辑器
|
||||
//建议使用工厂方法getEditor创建和引用编辑器实例，如果在某个闭包下引用该编辑器，直接调用UE.getEditor('editor')就能拿到相关的实例
|
||||
var ue = UE.getEditor('editor');
|
||||
|
||||
|
||||
function isFocus(e){
|
||||
alert(UE.getEditor('editor').isFocus());
|
||||
UE.dom.domUtils.preventDefault(e)
|
||||
}
|
||||
function setblur(e){
|
||||
UE.getEditor('editor').blur();
|
||||
UE.dom.domUtils.preventDefault(e)
|
||||
}
|
||||
function insertHtml() {
|
||||
var value = prompt('插入html代码', '');
|
||||
UE.getEditor('editor').execCommand('insertHtml', value)
|
||||
}
|
||||
function createEditor() {
|
||||
enableBtn();
|
||||
UE.getEditor('editor');
|
||||
}
|
||||
function getAllHtml() {
|
||||
alert(UE.getEditor('editor').getAllHtml())
|
||||
}
|
||||
function getContent() {
|
||||
var arr = [];
|
||||
arr.push("使用editor.getContent()方法可以获得编辑器的内容");
|
||||
arr.push("内容为：");
|
||||
arr.push(UE.getEditor('editor').getContent());
|
||||
alert(arr.join("\n"));
|
||||
}
|
||||
function getPlainTxt() {
|
||||
var arr = [];
|
||||
arr.push("使用editor.getPlainTxt()方法可以获得编辑器的带格式的纯文本内容");
|
||||
arr.push("内容为：");
|
||||
arr.push(UE.getEditor('editor').getPlainTxt());
|
||||
alert(arr.join('\n'))
|
||||
}
|
||||
function setContent(isAppendTo) {
|
||||
var arr = [];
|
||||
arr.push("使用editor.setContent('欢迎使用ueditor')方法可以设置编辑器的内容");
|
||||
UE.getEditor('editor').setContent('欢迎使用ueditor', isAppendTo);
|
||||
alert(arr.join("\n"));
|
||||
}
|
||||
function setDisabled() {
|
||||
UE.getEditor('editor').setDisabled('fullscreen');
|
||||
disableBtn("enable");
|
||||
}
|
||||
|
||||
function setEnabled() {
|
||||
UE.getEditor('editor').setEnabled();
|
||||
enableBtn();
|
||||
}
|
||||
|
||||
function getText() {
|
||||
//当你点击按钮时编辑区域已经失去了焦点，如果直接用getText将不会得到内容，所以要在选回来，然后取得内容
|
||||
var range = UE.getEditor('editor').selection.getRange();
|
||||
range.select();
|
||||
var txt = UE.getEditor('editor').selection.getText();
|
||||
alert(txt)
|
||||
}
|
||||
|
||||
function getContentTxt() {
|
||||
var arr = [];
|
||||
arr.push("使用editor.getContentTxt()方法可以获得编辑器的纯文本内容");
|
||||
arr.push("编辑器的纯文本内容为：");
|
||||
arr.push(UE.getEditor('editor').getContentTxt());
|
||||
alert(arr.join("\n"));
|
||||
}
|
||||
function hasContent() {
|
||||
var arr = [];
|
||||
arr.push("使用editor.hasContents()方法判断编辑器里是否有内容");
|
||||
arr.push("判断结果为：");
|
||||
arr.push(UE.getEditor('editor').hasContents());
|
||||
alert(arr.join("\n"));
|
||||
}
|
||||
function setFocus() {
|
||||
UE.getEditor('editor').focus();
|
||||
}
|
||||
function deleteEditor() {
|
||||
disableBtn();
|
||||
UE.getEditor('editor').destroy();
|
||||
}
|
||||
function disableBtn(str) {
|
||||
var div = document.getElementById('btns');
|
||||
var btns = UE.dom.domUtils.getElementsByTagName(div, "button");
|
||||
for (var i = 0, btn; btn = btns[i++];) {
|
||||
if (btn.id == str) {
|
||||
UE.dom.domUtils.removeAttributes(btn, ["disabled"]);
|
||||
} else {
|
||||
btn.setAttribute("disabled", "true");
|
||||
}
|
||||
}
|
||||
}
|
||||
function enableBtn() {
|
||||
var div = document.getElementById('btns');
|
||||
var btns = UE.dom.domUtils.getElementsByTagName(div, "button");
|
||||
for (var i = 0, btn; btn = btns[i++];) {
|
||||
UE.dom.domUtils.removeAttributes(btn, ["disabled"]);
|
||||
}
|
||||
}
|
||||
|
||||
function getLocalData () {
|
||||
alert(UE.getEditor('editor').execCommand( "getlocaldata" ));
|
||||
}
|
||||
|
||||
function clearLocalData () {
|
||||
UE.getEditor('editor').execCommand( "clearlocaldata" );
|
||||
alert("已清空草稿箱")
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
|
||||
"http://www.w3.org/TR/html4/loose.dtd">
|
||||
<html>
|
||||
<head>
|
||||
<title>完整demo</title>
|
||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
|
||||
<script type="text/javascript" charset="utf-8" src="ueditor.config.js"></script>
|
||||
<script type="text/javascript" charset="utf-8" src="ueditor.all.min.js"> </script>
|
||||
<!--建议手动加在语言，避免在ie下有时因为加载语言失败导致编辑器加载失败-->
|
||||
<!--这里加载的语言文件会覆盖你在配置项目里添加的语言类型，比如你在配置项目里配置的是英文，这里加载的中文，那最后就是中文-->
|
||||
<script type="text/javascript" charset="utf-8" src="lang/zh-cn/zh-cn.js"></script>
|
||||
|
||||
<style type="text/css">
|
||||
div{
|
||||
width:100%;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div>
|
||||
<h1>完整demo</h1>
|
||||
<script id="editor" type="text/plain" style="width:1024px;height:500px;"></script>
|
||||
</div>
|
||||
<div id="btns">
|
||||
<div>
|
||||
<button onclick="getAllHtml()">获得整个html的内容</button>
|
||||
<button onclick="getContent()">获得内容</button>
|
||||
<button onclick="setContent()">写入内容</button>
|
||||
<button onclick="setContent(true)">追加内容</button>
|
||||
<button onclick="getContentTxt()">获得纯文本</button>
|
||||
<button onclick="getPlainTxt()">获得带格式的纯文本</button>
|
||||
<button onclick="hasContent()">判断是否有内容</button>
|
||||
<button onclick="setFocus()">使编辑器获得焦点</button>
|
||||
<button onmousedown="isFocus(event)">编辑器是否获得焦点</button>
|
||||
<button onmousedown="setblur(event)" >编辑器失去焦点</button>
|
||||
|
||||
</div>
|
||||
<div>
|
||||
<button onclick="getText()">获得当前选中的文本</button>
|
||||
<button onclick="insertHtml()">插入给定的内容</button>
|
||||
<button id="enable" onclick="setEnabled()">可以编辑</button>
|
||||
<button onclick="setDisabled()">不可编辑</button>
|
||||
<button onclick=" UE.getEditor('editor').setHide()">隐藏编辑器</button>
|
||||
<button onclick=" UE.getEditor('editor').setShow()">显示编辑器</button>
|
||||
<button onclick=" UE.getEditor('editor').setHeight(300)">设置高度为300默认关闭了自动长高</button>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<button onclick="getLocalData()" >获取草稿箱内容</button>
|
||||
<button onclick="clearLocalData()" >清空草稿箱</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div>
|
||||
<button onclick="createEditor()">
|
||||
创建编辑器</button>
|
||||
<button onclick="deleteEditor()">
|
||||
删除编辑器</button>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
|
||||
//实例化编辑器
|
||||
//建议使用工厂方法getEditor创建和引用编辑器实例，如果在某个闭包下引用该编辑器，直接调用UE.getEditor('editor')就能拿到相关的实例
|
||||
var ue = UE.getEditor('editor');
|
||||
|
||||
|
||||
function isFocus(e){
|
||||
alert(UE.getEditor('editor').isFocus());
|
||||
UE.dom.domUtils.preventDefault(e)
|
||||
}
|
||||
function setblur(e){
|
||||
UE.getEditor('editor').blur();
|
||||
UE.dom.domUtils.preventDefault(e)
|
||||
}
|
||||
function insertHtml() {
|
||||
var value = prompt('插入html代码', '');
|
||||
UE.getEditor('editor').execCommand('insertHtml', value)
|
||||
}
|
||||
function createEditor() {
|
||||
enableBtn();
|
||||
UE.getEditor('editor');
|
||||
}
|
||||
function getAllHtml() {
|
||||
alert(UE.getEditor('editor').getAllHtml())
|
||||
}
|
||||
function getContent() {
|
||||
var arr = [];
|
||||
arr.push("使用editor.getContent()方法可以获得编辑器的内容");
|
||||
arr.push("内容为：");
|
||||
arr.push(UE.getEditor('editor').getContent());
|
||||
alert(arr.join("\n"));
|
||||
}
|
||||
function getPlainTxt() {
|
||||
var arr = [];
|
||||
arr.push("使用editor.getPlainTxt()方法可以获得编辑器的带格式的纯文本内容");
|
||||
arr.push("内容为：");
|
||||
arr.push(UE.getEditor('editor').getPlainTxt());
|
||||
alert(arr.join('\n'))
|
||||
}
|
||||
function setContent(isAppendTo) {
|
||||
var arr = [];
|
||||
arr.push("使用editor.setContent('欢迎使用ueditor')方法可以设置编辑器的内容");
|
||||
UE.getEditor('editor').setContent('欢迎使用ueditor', isAppendTo);
|
||||
alert(arr.join("\n"));
|
||||
}
|
||||
function setDisabled() {
|
||||
UE.getEditor('editor').setDisabled('fullscreen');
|
||||
disableBtn("enable");
|
||||
}
|
||||
|
||||
function setEnabled() {
|
||||
UE.getEditor('editor').setEnabled();
|
||||
enableBtn();
|
||||
}
|
||||
|
||||
function getText() {
|
||||
//当你点击按钮时编辑区域已经失去了焦点，如果直接用getText将不会得到内容，所以要在选回来，然后取得内容
|
||||
var range = UE.getEditor('editor').selection.getRange();
|
||||
range.select();
|
||||
var txt = UE.getEditor('editor').selection.getText();
|
||||
alert(txt)
|
||||
}
|
||||
|
||||
function getContentTxt() {
|
||||
var arr = [];
|
||||
arr.push("使用editor.getContentTxt()方法可以获得编辑器的纯文本内容");
|
||||
arr.push("编辑器的纯文本内容为：");
|
||||
arr.push(UE.getEditor('editor').getContentTxt());
|
||||
alert(arr.join("\n"));
|
||||
}
|
||||
function hasContent() {
|
||||
var arr = [];
|
||||
arr.push("使用editor.hasContents()方法判断编辑器里是否有内容");
|
||||
arr.push("判断结果为：");
|
||||
arr.push(UE.getEditor('editor').hasContents());
|
||||
alert(arr.join("\n"));
|
||||
}
|
||||
function setFocus() {
|
||||
UE.getEditor('editor').focus();
|
||||
}
|
||||
function deleteEditor() {
|
||||
disableBtn();
|
||||
UE.getEditor('editor').destroy();
|
||||
}
|
||||
function disableBtn(str) {
|
||||
var div = document.getElementById('btns');
|
||||
var btns = UE.dom.domUtils.getElementsByTagName(div, "button");
|
||||
for (var i = 0, btn; btn = btns[i++];) {
|
||||
if (btn.id == str) {
|
||||
UE.dom.domUtils.removeAttributes(btn, ["disabled"]);
|
||||
} else {
|
||||
btn.setAttribute("disabled", "true");
|
||||
}
|
||||
}
|
||||
}
|
||||
function enableBtn() {
|
||||
var div = document.getElementById('btns');
|
||||
var btns = UE.dom.domUtils.getElementsByTagName(div, "button");
|
||||
for (var i = 0, btn; btn = btns[i++];) {
|
||||
UE.dom.domUtils.removeAttributes(btn, ["disabled"]);
|
||||
}
|
||||
}
|
||||
|
||||
function getLocalData () {
|
||||
alert(UE.getEditor('editor').execCommand( "getlocaldata" ));
|
||||
}
|
||||
|
||||
function clearLocalData () {
|
||||
UE.getEditor('editor').execCommand( "clearlocaldata" );
|
||||
alert("已清空草稿箱")
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
|
|
@ -1,100 +1,100 @@
|
|||
/*弹出对话框页面样式组件
|
||||
*/
|
||||
|
||||
/*reset
|
||||
*/
|
||||
html, body, div, span, applet, object, iframe,
|
||||
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
|
||||
a, abbr, acronym, address, big, cite, code,
|
||||
del, dfn, em, font, img, ins, kbd, q, s, samp,
|
||||
small, strike, strong, sub, sup, tt, var,
|
||||
b, u, i, center,
|
||||
dl, dt, dd, ol, ul, li,
|
||||
fieldset, form, label, legend,
|
||||
table, caption, tbody, tfoot, thead, tr, th, td {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
outline: 0;
|
||||
font-size: 100%;
|
||||
}
|
||||
|
||||
body {
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
ol, ul {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
blockquote, q {
|
||||
quotes: none;
|
||||
}
|
||||
|
||||
ins {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
del {
|
||||
text-decoration: line-through;
|
||||
}
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0;
|
||||
}
|
||||
|
||||
/*module
|
||||
*/
|
||||
body {
|
||||
background-color: #fff;
|
||||
font: 12px/1.5 sans-serif, "宋体", "Arial Narrow", HELVETICA;
|
||||
color: #646464;
|
||||
}
|
||||
|
||||
/*tab*/
|
||||
.tabhead {
|
||||
position: relative;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.tabhead span {
|
||||
display: inline-block;
|
||||
padding: 0 5px;
|
||||
height: 30px;
|
||||
border: 1px solid #ccc;
|
||||
background: url("images/dialog-title-bg.png") repeat-x;
|
||||
text-align: center;
|
||||
line-height: 30px;
|
||||
cursor: pointer;
|
||||
*margin-right: 5px;
|
||||
}
|
||||
|
||||
.tabhead span.focus {
|
||||
height: 31px;
|
||||
border-bottom: none;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.tabbody {
|
||||
position: relative;
|
||||
top: -1px;
|
||||
margin: 0 auto;
|
||||
border: 1px solid #ccc;
|
||||
}
|
||||
|
||||
/*button*/
|
||||
a.button {
|
||||
display: block;
|
||||
text-align: center;
|
||||
line-height: 24px;
|
||||
text-decoration: none;
|
||||
height: 24px;
|
||||
width: 95px;
|
||||
border: 0;
|
||||
color: #838383;
|
||||
background: url(../../themes/default/images/icons-all.gif) no-repeat;
|
||||
}
|
||||
|
||||
a.button:hover {
|
||||
background-position: 0 -30px;
|
||||
/*弹出对话框页面样式组件
|
||||
*/
|
||||
|
||||
/*reset
|
||||
*/
|
||||
html, body, div, span, applet, object, iframe,
|
||||
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
|
||||
a, abbr, acronym, address, big, cite, code,
|
||||
del, dfn, em, font, img, ins, kbd, q, s, samp,
|
||||
small, strike, strong, sub, sup, tt, var,
|
||||
b, u, i, center,
|
||||
dl, dt, dd, ol, ul, li,
|
||||
fieldset, form, label, legend,
|
||||
table, caption, tbody, tfoot, thead, tr, th, td {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
outline: 0;
|
||||
font-size: 100%;
|
||||
}
|
||||
|
||||
body {
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
ol, ul {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
blockquote, q {
|
||||
quotes: none;
|
||||
}
|
||||
|
||||
ins {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
del {
|
||||
text-decoration: line-through;
|
||||
}
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0;
|
||||
}
|
||||
|
||||
/*module
|
||||
*/
|
||||
body {
|
||||
background-color: #fff;
|
||||
font: 12px/1.5 sans-serif, "宋体", "Arial Narrow", HELVETICA;
|
||||
color: #646464;
|
||||
}
|
||||
|
||||
/*tab*/
|
||||
.tabhead {
|
||||
position: relative;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.tabhead span {
|
||||
display: inline-block;
|
||||
padding: 0 5px;
|
||||
height: 30px;
|
||||
border: 1px solid #ccc;
|
||||
background: url("images/dialog-title-bg.png") repeat-x;
|
||||
text-align: center;
|
||||
line-height: 30px;
|
||||
cursor: pointer;
|
||||
*margin-right: 5px;
|
||||
}
|
||||
|
||||
.tabhead span.focus {
|
||||
height: 31px;
|
||||
border-bottom: none;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.tabbody {
|
||||
position: relative;
|
||||
top: -1px;
|
||||
margin: 0 auto;
|
||||
border: 1px solid #ccc;
|
||||
}
|
||||
|
||||
/*button*/
|
||||
a.button {
|
||||
display: block;
|
||||
text-align: center;
|
||||
line-height: 24px;
|
||||
text-decoration: none;
|
||||
height: 24px;
|
||||
width: 95px;
|
||||
border: 0;
|
||||
color: #838383;
|
||||
background: url(../../themes/default/images/icons-all.gif) no-repeat;
|
||||
}
|
||||
|
||||
a.button:hover {
|
||||
background-position: 0 -30px;
|
||||
}
|
||||
|
|
@ -1 +1 @@
|
|||
/*可以在这里添加你自己的css*/
|
||||
/*可以在这里添加你自己的css*/
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -19,7 +19,7 @@
|
|||
* 因此，UEditor提供了针对不同页面的编辑器可单独配置的根路径，具体来说，在需要实例化编辑器的页面最顶部写上如下代码即可。当然，需要令此处的URL等于对应的配置。
|
||||
* window.UEDITOR_HOME_URL = "/xxxx/xxxx/";
|
||||
*/
|
||||
var URL = window.UEDITOR_HOME_URL || getUEBasePath()
|
||||
var URL = window.UEDITOR_HOME_URL || getUEBasePath();
|
||||
|
||||
/**
|
||||
* 配置项主体。注意，此处所有涉及到路径的配置别遗漏URL变量。
|
||||
|
|
@ -34,17 +34,17 @@
|
|||
|
||||
//工具栏上的所有的功能按钮和下拉框，可以在new编辑器的实例时选择自己需要的重新定义
|
||||
, toolbars: [[
|
||||
'fullscreen', 'undo', 'redo', '|',
|
||||
'fullscreen', 'source', '|', 'undo', 'redo', '|',
|
||||
'bold', 'italic', 'underline', 'fontborder', 'strikethrough', 'superscript', 'subscript', 'removeformat', 'formatmatch', 'autotypeset', 'blockquote', 'pasteplain', '|', 'forecolor', 'backcolor', 'insertorderedlist', 'insertunorderedlist', 'selectall', 'cleardoc', '|',
|
||||
'rowspacingtop', 'rowspacingbottom', 'lineheight', '|',
|
||||
'customstyle', 'paragraph', 'fontfamily', 'fontsize', '|',
|
||||
'directionalityltr', 'directionalityrtl', 'indent', '|',
|
||||
'justifyleft', 'justifycenter', 'justifyright', 'justifyjustify', '|', 'touppercase', 'tolowercase', '|',
|
||||
'link', 'unlink', 'anchor', '|', 'imagenone', 'imageleft', 'imageright', 'imagecenter', '|',
|
||||
'simpleupload', 'insertimage', 'emotion', '|',
|
||||
'simpleupload', 'insertimage', 'emotion', 'scrawl', 'insertvideo', 'music', 'attachment', 'map', 'gmap', 'insertframe', 'insertcode', 'webapp', 'pagebreak', 'template', 'background', '|',
|
||||
'horizontal', 'date', 'time', 'spechars', 'snapscreen', 'wordimage', '|',
|
||||
'inserttable', 'deletetable', 'insertparagraphbeforetable', 'insertrow', 'deleterow', 'insertcol', 'deletecol', 'mergecells', 'mergeright', 'mergedown', 'splittocells', 'splittorows', 'splittocols', 'charts', '|',
|
||||
'print', 'preview', 'drafts'
|
||||
'print', 'preview', 'searchreplace', 'drafts', 'help'
|
||||
]]
|
||||
//当鼠标放在工具栏上时显示的tooltip提示,留空支持自动多语言配置，否则以配置值为准
|
||||
//,labelMap:{
|
||||
|
|
@ -89,17 +89,17 @@
|
|||
//首行缩进距离,默认是2em
|
||||
//,indentValue:'2em'
|
||||
|
||||
,initialFrameWidth:'100%' //初始化编辑器宽度,默认1000
|
||||
,initialFrameHeight:240 //初始化编辑器高度,默认320
|
||||
//,initialFrameWidth:1000 //初始化编辑器宽度,默认1000
|
||||
//,initialFrameHeight:320 //初始化编辑器高度,默认320
|
||||
|
||||
//,readonly : false //编辑器初始化结束后,编辑区域是否是只读的，默认是false
|
||||
|
||||
//,autoClearEmptyNode : true //getContent时，是否删除空的inlineElement节点（包括嵌套的情况）
|
||||
|
||||
//启用自动保存
|
||||
,enableAutoSave: false
|
||||
//,enableAutoSave: true
|
||||
//自动保存间隔时间， 单位ms
|
||||
,saveInterval: 0
|
||||
//,saveInterval: 500
|
||||
|
||||
//,fullscreen : false //是否开启初始化时即全屏，默认关闭
|
||||
|
||||
|
|
@ -247,7 +247,7 @@
|
|||
|
||||
//elementPathEnabled
|
||||
//是否启用元素路径，默认是显示
|
||||
,elementPathEnabled : false
|
||||
//,elementPathEnabled : true
|
||||
|
||||
//wordCount
|
||||
//,wordCount:true //是否开启字数统计
|
||||
|
|
@ -277,7 +277,7 @@
|
|||
|
||||
//autoHeightEnabled
|
||||
// 是否自动长高,默认true
|
||||
,autoHeightEnabled:false
|
||||
//,autoHeightEnabled:true
|
||||
|
||||
//scaleEnabled
|
||||
//是否可以拉伸长高,默认true(当开启时，自动长高失效)
|
||||
|
|
|
|||
|
|
@ -0,0 +1,40 @@
|
|||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
|
||||
"http://www.w3.org/TR/html4/loose.dtd">
|
||||
<html>
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<title></title>
|
||||
<style type="text/css">
|
||||
*{color: #838383;margin: 0;padding: 0}
|
||||
html,body {font-size: 12px;overflow: hidden; }
|
||||
.content{padding:5px 0 0 15px;}
|
||||
input{width:210px;height:21px;line-height:21px;margin-left: 4px;}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="content">
|
||||
<span><var id="lang_input_anchorName"></var></span><input id="anchorName" value="" />
|
||||
</div>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
<script type="text/javascript">
|
||||
var anchorInput = $G('anchorName'),
|
||||
node = editor.selection.getRange().getClosedNode();
|
||||
if(node && node.tagName == 'IMG' && (node = node.getAttribute('anchorname'))){
|
||||
anchorInput.value = node;
|
||||
}
|
||||
anchorInput.onkeydown = function(evt){
|
||||
evt = evt || window.event;
|
||||
if(evt.keyCode == 13){
|
||||
editor.execCommand('anchor', anchorInput.value);
|
||||
dialog.close();
|
||||
domUtils.preventDefault(evt)
|
||||
}
|
||||
};
|
||||
dialog.onok = function (){
|
||||
editor.execCommand('anchor', anchorInput.value);
|
||||
dialog.close();
|
||||
};
|
||||
$focus(anchorInput);
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,681 @@
|
|||
@charset "utf-8";
|
||||
/* dialog样式 */
|
||||
.wrapper {
|
||||
zoom: 1;
|
||||
width: 630px;
|
||||
*width: 626px;
|
||||
height: 380px;
|
||||
margin: 0 auto;
|
||||
padding: 10px;
|
||||
position: relative;
|
||||
font-family: sans-serif;
|
||||
}
|
||||
|
||||
/*tab样式框大小*/
|
||||
.tabhead {
|
||||
float:left;
|
||||
}
|
||||
.tabbody {
|
||||
width: 100%;
|
||||
height: 346px;
|
||||
position: relative;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.tabbody .panel {
|
||||
position: absolute;
|
||||
width: 0;
|
||||
height: 0;
|
||||
background: #fff;
|
||||
overflow: hidden;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.tabbody .panel.focus {
|
||||
width: 100%;
|
||||
height: 346px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* 上传附件 */
|
||||
.tabbody #upload.panel {
|
||||
width: 0;
|
||||
height: 0;
|
||||
overflow: hidden;
|
||||
position: absolute !important;
|
||||
clip: rect(1px, 1px, 1px, 1px);
|
||||
background: #fff;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.tabbody #upload.panel.focus {
|
||||
width: 100%;
|
||||
height: 346px;
|
||||
display: block;
|
||||
clip: auto;
|
||||
}
|
||||
|
||||
#upload .queueList {
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#upload p {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.element-invisible {
|
||||
width: 0 !important;
|
||||
height: 0 !important;
|
||||
border: 0;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
position: absolute !important;
|
||||
clip: rect(1px, 1px, 1px, 1px);
|
||||
}
|
||||
|
||||
#upload .placeholder {
|
||||
margin: 10px;
|
||||
border: 2px dashed #e6e6e6;
|
||||
*border: 0px dashed #e6e6e6;
|
||||
height: 172px;
|
||||
padding-top: 150px;
|
||||
text-align: center;
|
||||
background: url(./images/image.png) center 70px no-repeat;
|
||||
color: #cccccc;
|
||||
font-size: 18px;
|
||||
position: relative;
|
||||
top:0;
|
||||
*top: 10px;
|
||||
}
|
||||
|
||||
#upload .placeholder .webuploader-pick {
|
||||
font-size: 18px;
|
||||
background: #00b7ee;
|
||||
border-radius: 3px;
|
||||
line-height: 44px;
|
||||
padding: 0 30px;
|
||||
*width: 120px;
|
||||
color: #fff;
|
||||
display: inline-block;
|
||||
margin: 0 auto 20px auto;
|
||||
cursor: pointer;
|
||||
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
#upload .placeholder .webuploader-pick-hover {
|
||||
background: #00a2d4;
|
||||
}
|
||||
|
||||
|
||||
#filePickerContainer {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#upload .placeholder .flashTip {
|
||||
color: #666666;
|
||||
font-size: 12px;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
bottom: 20px;
|
||||
}
|
||||
|
||||
#upload .placeholder .flashTip a {
|
||||
color: #0785d1;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
#upload .placeholder .flashTip a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
#upload .placeholder.webuploader-dnd-over {
|
||||
border-color: #999999;
|
||||
}
|
||||
|
||||
#upload .filelist {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
position: relative;
|
||||
height: 300px;
|
||||
}
|
||||
|
||||
#upload .filelist:after {
|
||||
content: '';
|
||||
display: block;
|
||||
width: 0;
|
||||
height: 0;
|
||||
overflow: hidden;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
#upload .filelist li {
|
||||
width: 113px;
|
||||
height: 113px;
|
||||
background: url(./images/bg.png);
|
||||
text-align: center;
|
||||
margin: 9px 0 0 9px;
|
||||
*margin: 6px 0 0 6px;
|
||||
position: relative;
|
||||
display: block;
|
||||
float: left;
|
||||
overflow: hidden;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
#upload .filelist li p.log {
|
||||
position: relative;
|
||||
top: -45px;
|
||||
}
|
||||
|
||||
#upload .filelist li p.title {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
top: 5px;
|
||||
text-indent: 5px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
#upload .filelist li p.progress {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
height: 8px;
|
||||
overflow: hidden;
|
||||
z-index: 50;
|
||||
margin: 0;
|
||||
border-radius: 0;
|
||||
background: none;
|
||||
-webkit-box-shadow: 0 0 0;
|
||||
}
|
||||
|
||||
#upload .filelist li p.progress span {
|
||||
display: none;
|
||||
overflow: hidden;
|
||||
width: 0;
|
||||
height: 100%;
|
||||
background: #1483d8 url(./images/progress.png) repeat-x;
|
||||
|
||||
-webit-transition: width 200ms linear;
|
||||
-moz-transition: width 200ms linear;
|
||||
-o-transition: width 200ms linear;
|
||||
-ms-transition: width 200ms linear;
|
||||
transition: width 200ms linear;
|
||||
|
||||
-webkit-animation: progressmove 2s linear infinite;
|
||||
-moz-animation: progressmove 2s linear infinite;
|
||||
-o-animation: progressmove 2s linear infinite;
|
||||
-ms-animation: progressmove 2s linear infinite;
|
||||
animation: progressmove 2s linear infinite;
|
||||
|
||||
-webkit-transform: translateZ(0);
|
||||
}
|
||||
|
||||
@-webkit-keyframes progressmove {
|
||||
0% {
|
||||
background-position: 0 0;
|
||||
}
|
||||
100% {
|
||||
background-position: 17px 0;
|
||||
}
|
||||
}
|
||||
|
||||
@-moz-keyframes progressmove {
|
||||
0% {
|
||||
background-position: 0 0;
|
||||
}
|
||||
100% {
|
||||
background-position: 17px 0;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes progressmove {
|
||||
0% {
|
||||
background-position: 0 0;
|
||||
}
|
||||
100% {
|
||||
background-position: 17px 0;
|
||||
}
|
||||
}
|
||||
|
||||
#upload .filelist li p.imgWrap {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
line-height: 113px;
|
||||
vertical-align: middle;
|
||||
overflow: hidden;
|
||||
width: 113px;
|
||||
height: 113px;
|
||||
|
||||
-webkit-transform-origin: 50% 50%;
|
||||
-moz-transform-origin: 50% 50%;
|
||||
-o-transform-origin: 50% 50%;
|
||||
-ms-transform-origin: 50% 50%;
|
||||
transform-origin: 50% 50%;
|
||||
|
||||
-webit-transition: 200ms ease-out;
|
||||
-moz-transition: 200ms ease-out;
|
||||
-o-transition: 200ms ease-out;
|
||||
-ms-transition: 200ms ease-out;
|
||||
transition: 200ms ease-out;
|
||||
}
|
||||
#upload .filelist li p.imgWrap.notimage {
|
||||
margin-top: 0;
|
||||
width: 111px;
|
||||
height: 111px;
|
||||
border: 1px #eeeeee solid;
|
||||
}
|
||||
#upload .filelist li p.imgWrap.notimage i.file-preview {
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
#upload .filelist li img {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#upload .filelist li p.error {
|
||||
background: #f43838;
|
||||
color: #fff;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
height: 28px;
|
||||
line-height: 28px;
|
||||
width: 100%;
|
||||
z-index: 100;
|
||||
display:none;
|
||||
}
|
||||
|
||||
#upload .filelist li .success {
|
||||
display: block;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
height: 40px;
|
||||
width: 100%;
|
||||
z-index: 200;
|
||||
background: url(./images/success.png) no-repeat right bottom;
|
||||
background-image: url(./images/success.gif) \9;
|
||||
}
|
||||
|
||||
#upload .filelist li.filePickerBlock {
|
||||
width: 113px;
|
||||
height: 113px;
|
||||
background: url(./images/image.png) no-repeat center 12px;
|
||||
border: 1px solid #eeeeee;
|
||||
border-radius: 0;
|
||||
}
|
||||
#upload .filelist li.filePickerBlock div.webuploader-pick {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
opacity: 0;
|
||||
background: none;
|
||||
font-size: 0;
|
||||
}
|
||||
|
||||
#upload .filelist div.file-panel {
|
||||
position: absolute;
|
||||
height: 0;
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#80000000', endColorstr='#80000000') \0;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
width: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
overflow: hidden;
|
||||
z-index: 300;
|
||||
}
|
||||
|
||||
#upload .filelist div.file-panel span {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
display: inline;
|
||||
float: right;
|
||||
text-indent: -9999px;
|
||||
overflow: hidden;
|
||||
background: url(./images/icons.png) no-repeat;
|
||||
background: url(./images/icons.gif) no-repeat \9;
|
||||
margin: 5px 1px 1px;
|
||||
cursor: pointer;
|
||||
-webkit-tap-highlight-color: rgba(0,0,0,0);
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
#upload .filelist div.file-panel span.rotateLeft {
|
||||
display:none;
|
||||
background-position: 0 -24px;
|
||||
}
|
||||
|
||||
#upload .filelist div.file-panel span.rotateLeft:hover {
|
||||
background-position: 0 0;
|
||||
}
|
||||
|
||||
#upload .filelist div.file-panel span.rotateRight {
|
||||
display:none;
|
||||
background-position: -24px -24px;
|
||||
}
|
||||
|
||||
#upload .filelist div.file-panel span.rotateRight:hover {
|
||||
background-position: -24px 0;
|
||||
}
|
||||
|
||||
#upload .filelist div.file-panel span.cancel {
|
||||
background-position: -48px -24px;
|
||||
}
|
||||
|
||||
#upload .filelist div.file-panel span.cancel:hover {
|
||||
background-position: -48px 0;
|
||||
}
|
||||
|
||||
#upload .statusBar {
|
||||
height: 45px;
|
||||
border-bottom: 1px solid #dadada;
|
||||
margin: 0 10px;
|
||||
padding: 0;
|
||||
line-height: 45px;
|
||||
vertical-align: middle;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#upload .statusBar .progress {
|
||||
border: 1px solid #1483d8;
|
||||
width: 198px;
|
||||
background: #fff;
|
||||
height: 18px;
|
||||
position: absolute;
|
||||
top: 12px;
|
||||
display: none;
|
||||
text-align: center;
|
||||
line-height: 18px;
|
||||
color: #6dbfff;
|
||||
margin: 0 10px 0 0;
|
||||
}
|
||||
#upload .statusBar .progress span.percentage {
|
||||
width: 0;
|
||||
height: 100%;
|
||||
left: 0;
|
||||
top: 0;
|
||||
background: #1483d8;
|
||||
position: absolute;
|
||||
}
|
||||
#upload .statusBar .progress span.text {
|
||||
position: relative;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
#upload .statusBar .info {
|
||||
display: inline-block;
|
||||
font-size: 14px;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
#upload .statusBar .btns {
|
||||
position: absolute;
|
||||
top: 7px;
|
||||
right: 0;
|
||||
line-height: 30px;
|
||||
}
|
||||
|
||||
#filePickerBtn {
|
||||
display: inline-block;
|
||||
float: left;
|
||||
}
|
||||
#upload .statusBar .btns .webuploader-pick,
|
||||
#upload .statusBar .btns .uploadBtn,
|
||||
#upload .statusBar .btns .uploadBtn.state-uploading,
|
||||
#upload .statusBar .btns .uploadBtn.state-paused {
|
||||
background: #ffffff;
|
||||
border: 1px solid #cfcfcf;
|
||||
color: #565656;
|
||||
padding: 0 18px;
|
||||
display: inline-block;
|
||||
border-radius: 3px;
|
||||
margin-left: 10px;
|
||||
cursor: pointer;
|
||||
font-size: 14px;
|
||||
float: left;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
#upload .statusBar .btns .webuploader-pick-hover,
|
||||
#upload .statusBar .btns .uploadBtn:hover,
|
||||
#upload .statusBar .btns .uploadBtn.state-uploading:hover,
|
||||
#upload .statusBar .btns .uploadBtn.state-paused:hover {
|
||||
background: #f0f0f0;
|
||||
}
|
||||
|
||||
#upload .statusBar .btns .uploadBtn,
|
||||
#upload .statusBar .btns .uploadBtn.state-paused{
|
||||
background: #00b7ee;
|
||||
color: #fff;
|
||||
border-color: transparent;
|
||||
}
|
||||
#upload .statusBar .btns .uploadBtn:hover,
|
||||
#upload .statusBar .btns .uploadBtn.state-paused:hover{
|
||||
background: #00a2d4;
|
||||
}
|
||||
|
||||
#upload .statusBar .btns .uploadBtn.disabled {
|
||||
pointer-events: none;
|
||||
filter:alpha(opacity=60);
|
||||
-moz-opacity:0.6;
|
||||
-khtml-opacity: 0.6;
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* 图片管理样式 */
|
||||
#online {
|
||||
width: 100%;
|
||||
height: 336px;
|
||||
padding: 10px 0 0 0;
|
||||
}
|
||||
#online #fileList{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
position: relative;
|
||||
}
|
||||
#online ul {
|
||||
display: block;
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
#online li {
|
||||
float: left;
|
||||
display: block;
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
width: 113px;
|
||||
height: 113px;
|
||||
margin: 0 0 9px 9px;
|
||||
*margin: 0 0 6px 6px;
|
||||
background-color: #eee;
|
||||
overflow: hidden;
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
}
|
||||
#online li.clearFloat {
|
||||
float: none;
|
||||
clear: both;
|
||||
display: block;
|
||||
width:0;
|
||||
height:0;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
#online li img {
|
||||
cursor: pointer;
|
||||
}
|
||||
#online li div.file-wrapper {
|
||||
cursor: pointer;
|
||||
position: absolute;
|
||||
display: block;
|
||||
width: 111px;
|
||||
height: 111px;
|
||||
border: 1px solid #eee;
|
||||
background: url("./images/bg.png") repeat;
|
||||
}
|
||||
#online li div span.file-title{
|
||||
display: block;
|
||||
padding: 0 3px;
|
||||
margin: 3px 0 0 0;
|
||||
font-size: 12px;
|
||||
height: 13px;
|
||||
color: #555555;
|
||||
text-align: center;
|
||||
width: 107px;
|
||||
white-space: nowrap;
|
||||
word-break: break-all;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
#online li .icon {
|
||||
cursor: pointer;
|
||||
width: 113px;
|
||||
height: 113px;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 2;
|
||||
border: 0;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
#online li .icon:hover {
|
||||
width: 107px;
|
||||
height: 107px;
|
||||
border: 3px solid #1094fa;
|
||||
}
|
||||
#online li.selected .icon {
|
||||
background-image: url(images/success.png);
|
||||
background-image: url(images/success.gif) \9;
|
||||
background-position: 75px 75px;
|
||||
}
|
||||
#online li.selected .icon:hover {
|
||||
width: 107px;
|
||||
height: 107px;
|
||||
border: 3px solid #1094fa;
|
||||
background-position: 72px 72px;
|
||||
}
|
||||
|
||||
|
||||
/* 在线文件的文件预览图标 */
|
||||
i.file-preview {
|
||||
display: block;
|
||||
margin: 10px auto;
|
||||
width: 70px;
|
||||
height: 70px;
|
||||
background-image: url("./images/file-icons.png");
|
||||
background-image: url("./images/file-icons.gif") \9;
|
||||
background-position: -140px center;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
i.file-preview.file-type-dir{
|
||||
background-position: 0 center;
|
||||
}
|
||||
i.file-preview.file-type-file{
|
||||
background-position: -140px center;
|
||||
}
|
||||
i.file-preview.file-type-filelist{
|
||||
background-position: -210px center;
|
||||
}
|
||||
i.file-preview.file-type-zip,
|
||||
i.file-preview.file-type-rar,
|
||||
i.file-preview.file-type-7z,
|
||||
i.file-preview.file-type-tar,
|
||||
i.file-preview.file-type-gz,
|
||||
i.file-preview.file-type-bz2{
|
||||
background-position: -280px center;
|
||||
}
|
||||
i.file-preview.file-type-xls,
|
||||
i.file-preview.file-type-xlsx{
|
||||
background-position: -350px center;
|
||||
}
|
||||
i.file-preview.file-type-doc,
|
||||
i.file-preview.file-type-docx{
|
||||
background-position: -420px center;
|
||||
}
|
||||
i.file-preview.file-type-ppt,
|
||||
i.file-preview.file-type-pptx{
|
||||
background-position: -490px center;
|
||||
}
|
||||
i.file-preview.file-type-vsd{
|
||||
background-position: -560px center;
|
||||
}
|
||||
i.file-preview.file-type-pdf{
|
||||
background-position: -630px center;
|
||||
}
|
||||
i.file-preview.file-type-txt,
|
||||
i.file-preview.file-type-md,
|
||||
i.file-preview.file-type-json,
|
||||
i.file-preview.file-type-htm,
|
||||
i.file-preview.file-type-xml,
|
||||
i.file-preview.file-type-html,
|
||||
i.file-preview.file-type-js,
|
||||
i.file-preview.file-type-css,
|
||||
i.file-preview.file-type-php,
|
||||
i.file-preview.file-type-jsp,
|
||||
i.file-preview.file-type-asp{
|
||||
background-position: -700px center;
|
||||
}
|
||||
i.file-preview.file-type-apk{
|
||||
background-position: -770px center;
|
||||
}
|
||||
i.file-preview.file-type-exe{
|
||||
background-position: -840px center;
|
||||
}
|
||||
i.file-preview.file-type-ipa{
|
||||
background-position: -910px center;
|
||||
}
|
||||
i.file-preview.file-type-mp4,
|
||||
i.file-preview.file-type-swf,
|
||||
i.file-preview.file-type-mkv,
|
||||
i.file-preview.file-type-avi,
|
||||
i.file-preview.file-type-flv,
|
||||
i.file-preview.file-type-mov,
|
||||
i.file-preview.file-type-mpg,
|
||||
i.file-preview.file-type-mpeg,
|
||||
i.file-preview.file-type-ogv,
|
||||
i.file-preview.file-type-webm,
|
||||
i.file-preview.file-type-rm,
|
||||
i.file-preview.file-type-rmvb{
|
||||
background-position: -980px center;
|
||||
}
|
||||
i.file-preview.file-type-ogg,
|
||||
i.file-preview.file-type-wav,
|
||||
i.file-preview.file-type-wmv,
|
||||
i.file-preview.file-type-mid,
|
||||
i.file-preview.file-type-mp3{
|
||||
background-position: -1050px center;
|
||||
}
|
||||
i.file-preview.file-type-jpg,
|
||||
i.file-preview.file-type-jpeg,
|
||||
i.file-preview.file-type-gif,
|
||||
i.file-preview.file-type-bmp,
|
||||
i.file-preview.file-type-png,
|
||||
i.file-preview.file-type-psd{
|
||||
background-position: -140px center;
|
||||
}
|
||||
|
|
@ -0,0 +1,60 @@
|
|||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>ueditor图片对话框</title>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
|
||||
<!-- jquery -->
|
||||
<script type="text/javascript" src="../../third-party/jquery-1.10.2.min.js"></script>
|
||||
|
||||
<!-- webuploader -->
|
||||
<script src="../../third-party/webuploader/webuploader.min.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="../../third-party/webuploader/webuploader.css">
|
||||
|
||||
<!-- attachment dialog -->
|
||||
<link rel="stylesheet" href="attachment.css" type="text/css" />
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="wrapper">
|
||||
<div id="tabhead" class="tabhead">
|
||||
<span class="tab focus" data-content-id="upload"><var id="lang_tab_upload"></var></span>
|
||||
<span class="tab" data-content-id="online"><var id="lang_tab_online"></var></span>
|
||||
</div>
|
||||
<div id="tabbody" class="tabbody">
|
||||
<!-- 上传图片 -->
|
||||
<div id="upload" class="panel focus">
|
||||
<div id="queueList" class="queueList">
|
||||
<div class="statusBar element-invisible">
|
||||
<div class="progress">
|
||||
<span class="text">0%</span>
|
||||
<span class="percentage"></span>
|
||||
</div><div class="info"></div>
|
||||
<div class="btns">
|
||||
<div id="filePickerBtn"></div>
|
||||
<div class="uploadBtn"><var id="lang_start_upload"></var></div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="dndArea" class="placeholder">
|
||||
<div class="filePickerContainer">
|
||||
<div id="filePickerReady"></div>
|
||||
</div>
|
||||
</div>
|
||||
<ul class="filelist element-invisible">
|
||||
<li id="filePickerBlock" class="filePickerBlock"></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 在线图片 -->
|
||||
<div id="online" class="panel">
|
||||
<div id="fileList"><var id="lang_imgLoading"></var></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/javascript" src="attachment.js"></script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,760 @@
|
|||
/**
|
||||
* User: Jinqn
|
||||
* Date: 14-04-08
|
||||
* Time: 下午16:34
|
||||
* 上传图片对话框逻辑代码,包括tab: 远程图片/上传图片/在线图片/搜索图片
|
||||
*/
|
||||
|
||||
(function () {
|
||||
|
||||
var uploadFile,
|
||||
onlineFile;
|
||||
|
||||
window.onload = function () {
|
||||
initTabs();
|
||||
initButtons();
|
||||
};
|
||||
|
||||
/* 初始化tab标签 */
|
||||
function initTabs() {
|
||||
var tabs = $G('tabhead').children;
|
||||
for (var i = 0; i < tabs.length; i++) {
|
||||
domUtils.on(tabs[i], "click", function (e) {
|
||||
var target = e.target || e.srcElement;
|
||||
setTabFocus(target.getAttribute('data-content-id'));
|
||||
});
|
||||
}
|
||||
|
||||
setTabFocus('upload');
|
||||
}
|
||||
|
||||
/* 初始化tabbody */
|
||||
function setTabFocus(id) {
|
||||
if(!id) return;
|
||||
var i, bodyId, tabs = $G('tabhead').children;
|
||||
for (i = 0; i < tabs.length; i++) {
|
||||
bodyId = tabs[i].getAttribute('data-content-id')
|
||||
if (bodyId == id) {
|
||||
domUtils.addClass(tabs[i], 'focus');
|
||||
domUtils.addClass($G(bodyId), 'focus');
|
||||
} else {
|
||||
domUtils.removeClasses(tabs[i], 'focus');
|
||||
domUtils.removeClasses($G(bodyId), 'focus');
|
||||
}
|
||||
}
|
||||
switch (id) {
|
||||
case 'upload':
|
||||
uploadFile = uploadFile || new UploadFile('queueList');
|
||||
break;
|
||||
case 'online':
|
||||
onlineFile = onlineFile || new OnlineFile('fileList');
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
/* 初始化onok事件 */
|
||||
function initButtons() {
|
||||
|
||||
dialog.onok = function () {
|
||||
var list = [], id, tabs = $G('tabhead').children;
|
||||
for (var i = 0; i < tabs.length; i++) {
|
||||
if (domUtils.hasClass(tabs[i], 'focus')) {
|
||||
id = tabs[i].getAttribute('data-content-id');
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
switch (id) {
|
||||
case 'upload':
|
||||
list = uploadFile.getInsertList();
|
||||
var count = uploadFile.getQueueCount();
|
||||
if (count) {
|
||||
$('.info', '#queueList').html('<span style="color:red;">' + '还有2个未上传文件'.replace(/[\d]/, count) + '</span>');
|
||||
return false;
|
||||
}
|
||||
break;
|
||||
case 'online':
|
||||
list = onlineFile.getInsertList();
|
||||
break;
|
||||
}
|
||||
|
||||
editor.execCommand('insertfile', list);
|
||||
};
|
||||
}
|
||||
|
||||
|
||||
/* 上传附件 */
|
||||
function UploadFile(target) {
|
||||
this.$wrap = target.constructor == String ? $('#' + target) : $(target);
|
||||
this.init();
|
||||
}
|
||||
UploadFile.prototype = {
|
||||
init: function () {
|
||||
this.fileList = [];
|
||||
this.initContainer();
|
||||
this.initUploader();
|
||||
},
|
||||
initContainer: function () {
|
||||
this.$queue = this.$wrap.find('.filelist');
|
||||
},
|
||||
/* 初始化容器 */
|
||||
initUploader: function () {
|
||||
var _this = this,
|
||||
$ = jQuery, // just in case. Make sure it's not an other libaray.
|
||||
$wrap = _this.$wrap,
|
||||
// 图片容器
|
||||
$queue = $wrap.find('.filelist'),
|
||||
// 状态栏，包括进度和控制按钮
|
||||
$statusBar = $wrap.find('.statusBar'),
|
||||
// 文件总体选择信息。
|
||||
$info = $statusBar.find('.info'),
|
||||
// 上传按钮
|
||||
$upload = $wrap.find('.uploadBtn'),
|
||||
// 上传按钮
|
||||
$filePickerBtn = $wrap.find('.filePickerBtn'),
|
||||
// 上传按钮
|
||||
$filePickerBlock = $wrap.find('.filePickerBlock'),
|
||||
// 没选择文件之前的内容。
|
||||
$placeHolder = $wrap.find('.placeholder'),
|
||||
// 总体进度条
|
||||
$progress = $statusBar.find('.progress').hide(),
|
||||
// 添加的文件数量
|
||||
fileCount = 0,
|
||||
// 添加的文件总大小
|
||||
fileSize = 0,
|
||||
// 优化retina, 在retina下这个值是2
|
||||
ratio = window.devicePixelRatio || 1,
|
||||
// 缩略图大小
|
||||
thumbnailWidth = 113 * ratio,
|
||||
thumbnailHeight = 113 * ratio,
|
||||
// 可能有pedding, ready, uploading, confirm, done.
|
||||
state = '',
|
||||
// 所有文件的进度信息，key为file id
|
||||
percentages = {},
|
||||
supportTransition = (function () {
|
||||
var s = document.createElement('p').style,
|
||||
r = 'transition' in s ||
|
||||
'WebkitTransition' in s ||
|
||||
'MozTransition' in s ||
|
||||
'msTransition' in s ||
|
||||
'OTransition' in s;
|
||||
s = null;
|
||||
return r;
|
||||
})(),
|
||||
// WebUploader实例
|
||||
uploader,
|
||||
actionUrl = editor.getActionUrl(editor.getOpt('fileActionName')),
|
||||
fileMaxSize = editor.getOpt('fileMaxSize'),
|
||||
acceptExtensions = (editor.getOpt('fileAllowFiles') || []).join('').replace(/\./g, ',').replace(/^[,]/, '');;
|
||||
|
||||
if (!WebUploader.Uploader.support()) {
|
||||
$('#filePickerReady').after($('<div>').html(lang.errorNotSupport)).hide();
|
||||
return;
|
||||
} else if (!editor.getOpt('fileActionName')) {
|
||||
$('#filePickerReady').after($('<div>').html(lang.errorLoadConfig)).hide();
|
||||
return;
|
||||
}
|
||||
|
||||
uploader = _this.uploader = WebUploader.create({
|
||||
pick: {
|
||||
id: '#filePickerReady',
|
||||
label: lang.uploadSelectFile
|
||||
},
|
||||
swf: '../../third-party/webuploader/Uploader.swf',
|
||||
server: actionUrl,
|
||||
fileVal: editor.getOpt('fileFieldName'),
|
||||
duplicate: true,
|
||||
fileSingleSizeLimit: fileMaxSize,
|
||||
compress: false
|
||||
});
|
||||
uploader.addButton({
|
||||
id: '#filePickerBlock'
|
||||
});
|
||||
uploader.addButton({
|
||||
id: '#filePickerBtn',
|
||||
label: lang.uploadAddFile
|
||||
});
|
||||
|
||||
setState('pedding');
|
||||
|
||||
// 当有文件添加进来时执行，负责view的创建
|
||||
function addFile(file) {
|
||||
var $li = $('<li id="' + file.id + '">' +
|
||||
'<p class="title">' + file.name + '</p>' +
|
||||
'<p class="imgWrap"></p>' +
|
||||
'<p class="progress"><span></span></p>' +
|
||||
'</li>'),
|
||||
|
||||
$btns = $('<div class="file-panel">' +
|
||||
'<span class="cancel">' + lang.uploadDelete + '</span>' +
|
||||
'<span class="rotateRight">' + lang.uploadTurnRight + '</span>' +
|
||||
'<span class="rotateLeft">' + lang.uploadTurnLeft + '</span></div>').appendTo($li),
|
||||
$prgress = $li.find('p.progress span'),
|
||||
$wrap = $li.find('p.imgWrap'),
|
||||
$info = $('<p class="error"></p>').hide().appendTo($li),
|
||||
|
||||
showError = function (code) {
|
||||
switch (code) {
|
||||
case 'exceed_size':
|
||||
text = lang.errorExceedSize;
|
||||
break;
|
||||
case 'interrupt':
|
||||
text = lang.errorInterrupt;
|
||||
break;
|
||||
case 'http':
|
||||
text = lang.errorHttp;
|
||||
break;
|
||||
case 'not_allow_type':
|
||||
text = lang.errorFileType;
|
||||
break;
|
||||
default:
|
||||
text = lang.errorUploadRetry;
|
||||
break;
|
||||
}
|
||||
$info.text(text).show();
|
||||
};
|
||||
|
||||
if (file.getStatus() === 'invalid') {
|
||||
showError(file.statusText);
|
||||
} else {
|
||||
$wrap.text(lang.uploadPreview);
|
||||
if ('|png|jpg|jpeg|bmp|gif|'.indexOf('|'+file.ext.toLowerCase()+'|') == -1) {
|
||||
$wrap.empty().addClass('notimage').append('<i class="file-preview file-type-' + file.ext.toLowerCase() + '"></i>' +
|
||||
'<span class="file-title" title="' + file.name + '">' + file.name + '</span>');
|
||||
} else {
|
||||
if (browser.ie && browser.version <= 7) {
|
||||
$wrap.text(lang.uploadNoPreview);
|
||||
} else {
|
||||
uploader.makeThumb(file, function (error, src) {
|
||||
if (error || !src) {
|
||||
$wrap.text(lang.uploadNoPreview);
|
||||
} else {
|
||||
var $img = $('<img src="' + src + '">');
|
||||
$wrap.empty().append($img);
|
||||
$img.on('error', function () {
|
||||
$wrap.text(lang.uploadNoPreview);
|
||||
});
|
||||
}
|
||||
}, thumbnailWidth, thumbnailHeight);
|
||||
}
|
||||
}
|
||||
percentages[ file.id ] = [ file.size, 0 ];
|
||||
file.rotation = 0;
|
||||
|
||||
/* 检查文件格式 */
|
||||
if (!file.ext || acceptExtensions.indexOf(file.ext.toLowerCase()) == -1) {
|
||||
showError('not_allow_type');
|
||||
uploader.removeFile(file);
|
||||
}
|
||||
}
|
||||
|
||||
file.on('statuschange', function (cur, prev) {
|
||||
if (prev === 'progress') {
|
||||
$prgress.hide().width(0);
|
||||
} else if (prev === 'queued') {
|
||||
$li.off('mouseenter mouseleave');
|
||||
$btns.remove();
|
||||
}
|
||||
// 成功
|
||||
if (cur === 'error' || cur === 'invalid') {
|
||||
showError(file.statusText);
|
||||
percentages[ file.id ][ 1 ] = 1;
|
||||
} else if (cur === 'interrupt') {
|
||||
showError('interrupt');
|
||||
} else if (cur === 'queued') {
|
||||
percentages[ file.id ][ 1 ] = 0;
|
||||
} else if (cur === 'progress') {
|
||||
$info.hide();
|
||||
$prgress.css('display', 'block');
|
||||
} else if (cur === 'complete') {
|
||||
}
|
||||
|
||||
$li.removeClass('state-' + prev).addClass('state-' + cur);
|
||||
});
|
||||
|
||||
$li.on('mouseenter', function () {
|
||||
$btns.stop().animate({height: 30});
|
||||
});
|
||||
$li.on('mouseleave', function () {
|
||||
$btns.stop().animate({height: 0});
|
||||
});
|
||||
|
||||
$btns.on('click', 'span', function () {
|
||||
var index = $(this).index(),
|
||||
deg;
|
||||
|
||||
switch (index) {
|
||||
case 0:
|
||||
uploader.removeFile(file);
|
||||
return;
|
||||
case 1:
|
||||
file.rotation += 90;
|
||||
break;
|
||||
case 2:
|
||||
file.rotation -= 90;
|
||||
break;
|
||||
}
|
||||
|
||||
if (supportTransition) {
|
||||
deg = 'rotate(' + file.rotation + 'deg)';
|
||||
$wrap.css({
|
||||
'-webkit-transform': deg,
|
||||
'-mos-transform': deg,
|
||||
'-o-transform': deg,
|
||||
'transform': deg
|
||||
});
|
||||
} else {
|
||||
$wrap.css('filter', 'progid:DXImageTransform.Microsoft.BasicImage(rotation=' + (~~((file.rotation / 90) % 4 + 4) % 4) + ')');
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
$li.insertBefore($filePickerBlock);
|
||||
}
|
||||
|
||||
// 负责view的销毁
|
||||
function removeFile(file) {
|
||||
var $li = $('#' + file.id);
|
||||
delete percentages[ file.id ];
|
||||
updateTotalProgress();
|
||||
$li.off().find('.file-panel').off().end().remove();
|
||||
}
|
||||
|
||||
function updateTotalProgress() {
|
||||
var loaded = 0,
|
||||
total = 0,
|
||||
spans = $progress.children(),
|
||||
percent;
|
||||
|
||||
$.each(percentages, function (k, v) {
|
||||
total += v[ 0 ];
|
||||
loaded += v[ 0 ] * v[ 1 ];
|
||||
});
|
||||
|
||||
percent = total ? loaded / total : 0;
|
||||
|
||||
spans.eq(0).text(Math.round(percent * 100) + '%');
|
||||
spans.eq(1).css('width', Math.round(percent * 100) + '%');
|
||||
updateStatus();
|
||||
}
|
||||
|
||||
function setState(val, files) {
|
||||
|
||||
if (val != state) {
|
||||
|
||||
var stats = uploader.getStats();
|
||||
|
||||
$upload.removeClass('state-' + state);
|
||||
$upload.addClass('state-' + val);
|
||||
|
||||
switch (val) {
|
||||
|
||||
/* 未选择文件 */
|
||||
case 'pedding':
|
||||
$queue.addClass('element-invisible');
|
||||
$statusBar.addClass('element-invisible');
|
||||
$placeHolder.removeClass('element-invisible');
|
||||
$progress.hide(); $info.hide();
|
||||
uploader.refresh();
|
||||
break;
|
||||
|
||||
/* 可以开始上传 */
|
||||
case 'ready':
|
||||
$placeHolder.addClass('element-invisible');
|
||||
$queue.removeClass('element-invisible');
|
||||
$statusBar.removeClass('element-invisible');
|
||||
$progress.hide(); $info.show();
|
||||
$upload.text(lang.uploadStart);
|
||||
uploader.refresh();
|
||||
break;
|
||||
|
||||
/* 上传中 */
|
||||
case 'uploading':
|
||||
$progress.show(); $info.hide();
|
||||
$upload.text(lang.uploadPause);
|
||||
break;
|
||||
|
||||
/* 暂停上传 */
|
||||
case 'paused':
|
||||
$progress.show(); $info.hide();
|
||||
$upload.text(lang.uploadContinue);
|
||||
break;
|
||||
|
||||
case 'confirm':
|
||||
$progress.show(); $info.hide();
|
||||
$upload.text(lang.uploadStart);
|
||||
|
||||
stats = uploader.getStats();
|
||||
if (stats.successNum && !stats.uploadFailNum) {
|
||||
setState('finish');
|
||||
return;
|
||||
}
|
||||
break;
|
||||
|
||||
case 'finish':
|
||||
$progress.hide(); $info.show();
|
||||
if (stats.uploadFailNum) {
|
||||
$upload.text(lang.uploadRetry);
|
||||
} else {
|
||||
$upload.text(lang.uploadStart);
|
||||
}
|
||||
break;
|
||||
}
|
||||
|
||||
state = val;
|
||||
updateStatus();
|
||||
|
||||
}
|
||||
|
||||
if (!_this.getQueueCount()) {
|
||||
$upload.addClass('disabled')
|
||||
} else {
|
||||
$upload.removeClass('disabled')
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function updateStatus() {
|
||||
var text = '', stats;
|
||||
|
||||
if (state === 'ready') {
|
||||
text = lang.updateStatusReady.replace('_', fileCount).replace('_KB', WebUploader.formatSize(fileSize));
|
||||
} else if (state === 'confirm') {
|
||||
stats = uploader.getStats();
|
||||
if (stats.uploadFailNum) {
|
||||
text = lang.updateStatusConfirm.replace('_', stats.successNum).replace('_', stats.successNum);
|
||||
}
|
||||
} else {
|
||||
stats = uploader.getStats();
|
||||
text = lang.updateStatusFinish.replace('_', fileCount).
|
||||
replace('_KB', WebUploader.formatSize(fileSize)).
|
||||
replace('_', stats.successNum);
|
||||
|
||||
if (stats.uploadFailNum) {
|
||||
text += lang.updateStatusError.replace('_', stats.uploadFailNum);
|
||||
}
|
||||
}
|
||||
|
||||
$info.html(text);
|
||||
}
|
||||
|
||||
uploader.on('fileQueued', function (file) {
|
||||
fileCount++;
|
||||
fileSize += file.size;
|
||||
|
||||
if (fileCount === 1) {
|
||||
$placeHolder.addClass('element-invisible');
|
||||
$statusBar.show();
|
||||
}
|
||||
|
||||
addFile(file);
|
||||
});
|
||||
|
||||
uploader.on('fileDequeued', function (file) {
|
||||
fileCount--;
|
||||
fileSize -= file.size;
|
||||
|
||||
removeFile(file);
|
||||
updateTotalProgress();
|
||||
});
|
||||
|
||||
uploader.on('filesQueued', function (file) {
|
||||
if (!uploader.isInProgress() && (state == 'pedding' || state == 'finish' || state == 'confirm' || state == 'ready')) {
|
||||
setState('ready');
|
||||
}
|
||||
updateTotalProgress();
|
||||
});
|
||||
|
||||
uploader.on('all', function (type, files) {
|
||||
switch (type) {
|
||||
case 'uploadFinished':
|
||||
setState('confirm', files);
|
||||
break;
|
||||
case 'startUpload':
|
||||
/* 添加额外的GET参数 */
|
||||
var params = utils.serializeParam(editor.queryCommandValue('serverparam')) || '',
|
||||
url = utils.formatUrl(actionUrl + (actionUrl.indexOf('?') == -1 ? '?':'&') + 'encode=utf-8&' + params);
|
||||
uploader.option('server', url);
|
||||
setState('uploading', files);
|
||||
break;
|
||||
case 'stopUpload':
|
||||
setState('paused', files);
|
||||
break;
|
||||
}
|
||||
});
|
||||
|
||||
uploader.on('uploadBeforeSend', function (file, data, header) {
|
||||
//这里可以通过data对象添加POST参数
|
||||
header['X_Requested_With'] = 'XMLHttpRequest';
|
||||
// HaoChuan9421
|
||||
if(editor.options.headers && Object.prototype.toString.apply(editor.options.headers) === "[object Object]"){
|
||||
for(var key in editor.options.headers){
|
||||
header[key] = editor.options.headers[key]
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
uploader.on('uploadProgress', function (file, percentage) {
|
||||
var $li = $('#' + file.id),
|
||||
$percent = $li.find('.progress span');
|
||||
|
||||
$percent.css('width', percentage * 100 + '%');
|
||||
percentages[ file.id ][ 1 ] = percentage;
|
||||
updateTotalProgress();
|
||||
});
|
||||
|
||||
uploader.on('uploadSuccess', function (file, ret) {
|
||||
var $file = $('#' + file.id);
|
||||
try {
|
||||
var responseText = (ret._raw || ret),
|
||||
json = utils.str2json(responseText);
|
||||
if (json.state == 'SUCCESS') {
|
||||
_this.fileList.push(json);
|
||||
$file.append('<span class="success"></span>');
|
||||
} else {
|
||||
$file.find('.error').text(json.state).show();
|
||||
}
|
||||
} catch (e) {
|
||||
$file.find('.error').text(lang.errorServerUpload).show();
|
||||
}
|
||||
});
|
||||
|
||||
uploader.on('uploadError', function (file, code) {
|
||||
});
|
||||
uploader.on('error', function (code, file) {
|
||||
if (code == 'Q_TYPE_DENIED' || code == 'F_EXCEED_SIZE') {
|
||||
addFile(file);
|
||||
}
|
||||
});
|
||||
uploader.on('uploadComplete', function (file, ret) {
|
||||
});
|
||||
|
||||
$upload.on('click', function () {
|
||||
if ($(this).hasClass('disabled')) {
|
||||
return false;
|
||||
}
|
||||
|
||||
if (state === 'ready') {
|
||||
uploader.upload();
|
||||
} else if (state === 'paused') {
|
||||
uploader.upload();
|
||||
} else if (state === 'uploading') {
|
||||
uploader.stop();
|
||||
}
|
||||
});
|
||||
|
||||
$upload.addClass('state-' + state);
|
||||
updateTotalProgress();
|
||||
},
|
||||
getQueueCount: function () {
|
||||
var file, i, status, readyFile = 0, files = this.uploader.getFiles();
|
||||
for (i = 0; file = files[i++]; ) {
|
||||
status = file.getStatus();
|
||||
if (status == 'queued' || status == 'uploading' || status == 'progress') readyFile++;
|
||||
}
|
||||
return readyFile;
|
||||
},
|
||||
getInsertList: function () {
|
||||
var i, link, data, list = [],
|
||||
prefix = editor.getOpt('fileUrlPrefix');
|
||||
for (i = 0; i < this.fileList.length; i++) {
|
||||
data = this.fileList[i];
|
||||
link = data.url;
|
||||
list.push({
|
||||
title: data.original || link.substr(link.lastIndexOf('/') + 1),
|
||||
url: prefix + link
|
||||
});
|
||||
}
|
||||
return list;
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
/* 在线附件 */
|
||||
function OnlineFile(target) {
|
||||
this.container = utils.isString(target) ? document.getElementById(target) : target;
|
||||
this.init();
|
||||
}
|
||||
OnlineFile.prototype = {
|
||||
init: function () {
|
||||
this.initContainer();
|
||||
this.initEvents();
|
||||
this.initData();
|
||||
},
|
||||
/* 初始化容器 */
|
||||
initContainer: function () {
|
||||
this.container.innerHTML = '';
|
||||
this.list = document.createElement('ul');
|
||||
this.clearFloat = document.createElement('li');
|
||||
|
||||
domUtils.addClass(this.list, 'list');
|
||||
domUtils.addClass(this.clearFloat, 'clearFloat');
|
||||
|
||||
this.list.appendChild(this.clearFloat);
|
||||
this.container.appendChild(this.list);
|
||||
},
|
||||
/* 初始化滚动事件,滚动到地步自动拉取数据 */
|
||||
initEvents: function () {
|
||||
var _this = this;
|
||||
|
||||
/* 滚动拉取图片 */
|
||||
domUtils.on($G('fileList'), 'scroll', function(e){
|
||||
var panel = this;
|
||||
if (panel.scrollHeight - (panel.offsetHeight + panel.scrollTop) < 10) {
|
||||
_this.getFileData();
|
||||
}
|
||||
});
|
||||
/* 选中图片 */
|
||||
domUtils.on(this.list, 'click', function (e) {
|
||||
var target = e.target || e.srcElement,
|
||||
li = target.parentNode;
|
||||
|
||||
if (li.tagName.toLowerCase() == 'li') {
|
||||
if (domUtils.hasClass(li, 'selected')) {
|
||||
domUtils.removeClasses(li, 'selected');
|
||||
} else {
|
||||
domUtils.addClass(li, 'selected');
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
/* 初始化第一次的数据 */
|
||||
initData: function () {
|
||||
|
||||
/* 拉取数据需要使用的值 */
|
||||
this.state = 0;
|
||||
this.listSize = editor.getOpt('fileManagerListSize');
|
||||
this.listIndex = 0;
|
||||
this.listEnd = false;
|
||||
|
||||
/* 第一次拉取数据 */
|
||||
this.getFileData();
|
||||
},
|
||||
/* 向后台拉取图片列表数据 */
|
||||
getFileData: function () {
|
||||
var _this = this;
|
||||
|
||||
if(!_this.listEnd && !this.isLoadingData) {
|
||||
this.isLoadingData = true;
|
||||
ajax.request(editor.getActionUrl(editor.getOpt('fileManagerActionName')), {
|
||||
timeout: 100000,
|
||||
data: utils.extend({
|
||||
start: this.listIndex,
|
||||
size: this.listSize
|
||||
}, editor.queryCommandValue('serverparam')),
|
||||
method: 'get',
|
||||
onsuccess: function (r) {
|
||||
try {
|
||||
var json = eval('(' + r.responseText + ')');
|
||||
if (json.state == 'SUCCESS') {
|
||||
_this.pushData(json.list);
|
||||
_this.listIndex = parseInt(json.start) + parseInt(json.list.length);
|
||||
if(_this.listIndex >= json.total) {
|
||||
_this.listEnd = true;
|
||||
}
|
||||
_this.isLoadingData = false;
|
||||
}
|
||||
} catch (e) {
|
||||
if(r.responseText.indexOf('ue_separate_ue') != -1) {
|
||||
var list = r.responseText.split(r.responseText);
|
||||
_this.pushData(list);
|
||||
_this.listIndex = parseInt(list.length);
|
||||
_this.listEnd = true;
|
||||
_this.isLoadingData = false;
|
||||
}
|
||||
}
|
||||
},
|
||||
onerror: function () {
|
||||
_this.isLoadingData = false;
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
/* 添加图片到列表界面上 */
|
||||
pushData: function (list) {
|
||||
var i, item, img, filetype, preview, icon, _this = this,
|
||||
urlPrefix = editor.getOpt('fileManagerUrlPrefix');
|
||||
for (i = 0; i < list.length; i++) {
|
||||
if(list[i] && list[i].url) {
|
||||
item = document.createElement('li');
|
||||
icon = document.createElement('span');
|
||||
filetype = list[i].url.substr(list[i].url.lastIndexOf('.') + 1);
|
||||
|
||||
if ( "png|jpg|jpeg|gif|bmp".indexOf(filetype) != -1 ) {
|
||||
preview = document.createElement('img');
|
||||
domUtils.on(preview, 'load', (function(image){
|
||||
return function(){
|
||||
_this.scale(image, image.parentNode.offsetWidth, image.parentNode.offsetHeight);
|
||||
};
|
||||
})(preview));
|
||||
preview.width = 113;
|
||||
preview.setAttribute('src', urlPrefix + list[i].url + (list[i].url.indexOf('?') == -1 ? '?noCache=':'&noCache=') + (+new Date()).toString(36) );
|
||||
} else {
|
||||
var ic = document.createElement('i'),
|
||||
textSpan = document.createElement('span');
|
||||
textSpan.innerHTML = list[i].url.substr(list[i].url.lastIndexOf('/') + 1);
|
||||
preview = document.createElement('div');
|
||||
preview.appendChild(ic);
|
||||
preview.appendChild(textSpan);
|
||||
domUtils.addClass(preview, 'file-wrapper');
|
||||
domUtils.addClass(textSpan, 'file-title');
|
||||
domUtils.addClass(ic, 'file-type-' + filetype);
|
||||
domUtils.addClass(ic, 'file-preview');
|
||||
}
|
||||
domUtils.addClass(icon, 'icon');
|
||||
item.setAttribute('data-url', urlPrefix + list[i].url);
|
||||
if (list[i].original) {
|
||||
item.setAttribute('data-title', list[i].original);
|
||||
}
|
||||
|
||||
item.appendChild(preview);
|
||||
item.appendChild(icon);
|
||||
this.list.insertBefore(item, this.clearFloat);
|
||||
}
|
||||
}
|
||||
},
|
||||
/* 改变图片大小 */
|
||||
scale: function (img, w, h, type) {
|
||||
var ow = img.width,
|
||||
oh = img.height;
|
||||
|
||||
if (type == 'justify') {
|
||||
if (ow >= oh) {
|
||||
img.width = w;
|
||||
img.height = h * oh / ow;
|
||||
img.style.marginLeft = '-' + parseInt((img.width - w) / 2) + 'px';
|
||||
} else {
|
||||
img.width = w * ow / oh;
|
||||
img.height = h;
|
||||
img.style.marginTop = '-' + parseInt((img.height - h) / 2) + 'px';
|
||||
}
|
||||
} else {
|
||||
if (ow >= oh) {
|
||||
img.width = w * ow / oh;
|
||||
img.height = h;
|
||||
img.style.marginLeft = '-' + parseInt((img.width - w) / 2) + 'px';
|
||||
} else {
|
||||
img.width = w;
|
||||
img.height = h * oh / ow;
|
||||
img.style.marginTop = '-' + parseInt((img.height - h) / 2) + 'px';
|
||||
}
|
||||
}
|
||||
},
|
||||
getInsertList: function () {
|
||||
var i, lis = this.list.children, list = [];
|
||||
for (i = 0; i < lis.length; i++) {
|
||||
if (domUtils.hasClass(lis[i], 'selected')) {
|
||||
var url = lis[i].getAttribute('data-url');
|
||||
var title = lis[i].getAttribute('data-title') || url.substr(url.lastIndexOf('/') + 1);
|
||||
list.push({
|
||||
title: title,
|
||||
url: url
|
||||
});
|
||||
}
|
||||
}
|
||||
return list;
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
})();
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 923 B |
Binary file not shown.
|
After Width: | Height: | Size: 841 B |
Binary file not shown.
|
After Width: | Height: | Size: 1012 B |
Binary file not shown.
|
After Width: | Height: | Size: 949 B |
Binary file not shown.
|
After Width: | Height: | Size: 950 B |
Binary file not shown.
|
After Width: | Height: | Size: 986 B |
Binary file not shown.
|
After Width: | Height: | Size: 1001 B |
Binary file not shown.
|
After Width: | Height: | Size: 996 B |
Binary file not shown.
|
After Width: | Height: | Size: 1001 B |
Binary file not shown.
|
After Width: | Height: | Size: 1009 B |
Binary file not shown.
|
After Width: | Height: | Size: 1007 B |
Binary file not shown.
|
After Width: | Height: | Size: 970 B |
Binary file not shown.
|
After Width: | Height: | Size: 1005 B |
Binary file not shown.
|
After Width: | Height: | Size: 1.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.7 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 20 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 43 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 453 B |
Binary file not shown.
|
After Width: | Height: | Size: 2.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 445 B |
Binary file not shown.
|
After Width: | Height: | Size: 1.6 KiB |
|
|
@ -0,0 +1,94 @@
|
|||
.wrapper{ width: 424px;margin: 10px auto; zoom:1;position: relative}
|
||||
.tabbody{height:225px;}
|
||||
.tabbody .panel { position: absolute;width:100%; height:100%;background: #fff; display: none;}
|
||||
.tabbody .focus { display: block;}
|
||||
|
||||
body{font-size: 12px;color: #888;overflow: hidden;}
|
||||
input,label{vertical-align:middle}
|
||||
.clear{clear: both;}
|
||||
.pl{padding-left: 18px;padding-left: 23px\9;}
|
||||
|
||||
#imageList {width: 420px;height: 215px;margin-top: 10px;overflow: hidden;overflow-y: auto;}
|
||||
#imageList div {float: left;width: 100px;height: 95px;margin: 5px 10px;}
|
||||
#imageList img {cursor: pointer;border: 2px solid white;}
|
||||
|
||||
.bgarea{margin: 10px;padding: 5px;height: 84%;border: 1px solid #A8A297;}
|
||||
.content div{margin: 10px 0 10px 5px;}
|
||||
.content .iptradio{margin: 0px 5px 5px 0px;}
|
||||
.txt{width:280px;}
|
||||
|
||||
.wrapcolor{height: 19px;}
|
||||
div.color{float: left;margin: 0;}
|
||||
#colorPicker{width: 17px;height: 17px;border: 1px solid #CCC;display: inline-block;border-radius: 3px;box-shadow: 2px 2px 5px #D3D6DA;margin: 0;float: left;}
|
||||
div.alignment,#custom{margin-left: 23px;margin-left: 28px\9;}
|
||||
#custom input{height: 15px;min-height: 15px;width:20px;}
|
||||
#repeatType{width:100px;}
|
||||
|
||||
|
||||
/* 图片管理样式 */
|
||||
#imgManager {
|
||||
width: 100%;
|
||||
height: 225px;
|
||||
}
|
||||
#imgManager #imageList{
|
||||
width: 100%;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
}
|
||||
#imgManager ul {
|
||||
display: block;
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
#imgManager li {
|
||||
float: left;
|
||||
display: block;
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
width: 113px;
|
||||
height: 113px;
|
||||
margin: 9px 0 0 19px;
|
||||
background-color: #eee;
|
||||
overflow: hidden;
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
}
|
||||
#imgManager li.clearFloat {
|
||||
float: none;
|
||||
clear: both;
|
||||
display: block;
|
||||
width:0;
|
||||
height:0;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
#imgManager li img {
|
||||
cursor: pointer;
|
||||
}
|
||||
#imgManager li .icon {
|
||||
cursor: pointer;
|
||||
width: 113px;
|
||||
height: 113px;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 2;
|
||||
border: 0;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
#imgManager li .icon:hover {
|
||||
width: 107px;
|
||||
height: 107px;
|
||||
border: 3px solid #1094fa;
|
||||
}
|
||||
#imgManager li.selected .icon {
|
||||
background-image: url(images/success.png);
|
||||
background-position: 75px 75px;
|
||||
}
|
||||
#imgManager li.selected .icon:hover {
|
||||
width: 107px;
|
||||
height: 107px;
|
||||
border: 3px solid #1094fa;
|
||||
background-position: 72px 72px;
|
||||
}
|
||||
|
|
@ -0,0 +1,56 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="background.css">
|
||||
</head>
|
||||
<body>
|
||||
<div id="bg_container" class="wrapper">
|
||||
<div id="tabHeads" class="tabhead">
|
||||
<span class="focus" data-content-id="normal"><var id="lang_background_normal"></var></span>
|
||||
<span class="" data-content-id="imgManager"><var id="lang_background_local"></var></span>
|
||||
</div>
|
||||
<div id="tabBodys" class="tabbody">
|
||||
<div id="normal" class="panel focus">
|
||||
<fieldset class="bgarea">
|
||||
<legend><var id="lang_background_set"></var></legend>
|
||||
<div class="content">
|
||||
<div>
|
||||
<label><input id="nocolorRadio" class="iptradio" type="radio" name="t" value="none" checked="checked"><var id="lang_background_none"></var></label>
|
||||
<label><input id="coloredRadio" class="iptradio" type="radio" name="t" value="color"><var id="lang_background_colored"></var></label>
|
||||
</div>
|
||||
<div class="wrapcolor pl">
|
||||
<div class="color">
|
||||
<var id="lang_background_color"></var>:
|
||||
</div>
|
||||
<div id="colorPicker"></div>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
<div class="wrapcolor pl">
|
||||
<label><var id="lang_background_netimg"></var>:</label><input class="txt" type="text" id="url">
|
||||
</div>
|
||||
<div id="alignment" class="alignment">
|
||||
<var id="lang_background_align"></var>:<select id="repeatType">
|
||||
<option value="center"></option>
|
||||
<option value="repeat-x"></option>
|
||||
<option value="repeat-y"></option>
|
||||
<option value="repeat"></option>
|
||||
<option value="self"></option>
|
||||
</select>
|
||||
</div>
|
||||
<div id="custom" >
|
||||
<var id="lang_background_position"></var>:x:<input type="text" size="1" id="x" maxlength="4" value="0">px y:<input type="text" size="1" id="y" maxlength="4" value="0">px
|
||||
</div>
|
||||
</div>
|
||||
</fieldset>
|
||||
|
||||
</div>
|
||||
<div id="imgManager" class="panel">
|
||||
<div id="imageList" style=""></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/javascript" src="background.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,376 @@
|
|||
(function () {
|
||||
|
||||
var onlineImage,
|
||||
backupStyle = editor.queryCommandValue('background');
|
||||
|
||||
window.onload = function () {
|
||||
initTabs();
|
||||
initColorSelector();
|
||||
};
|
||||
|
||||
/* 初始化tab标签 */
|
||||
function initTabs(){
|
||||
var tabs = $G('tabHeads').children;
|
||||
for (var i = 0; i < tabs.length; i++) {
|
||||
domUtils.on(tabs[i], "click", function (e) {
|
||||
var target = e.target || e.srcElement;
|
||||
for (var j = 0; j < tabs.length; j++) {
|
||||
if(tabs[j] == target){
|
||||
tabs[j].className = "focus";
|
||||
var contentId = tabs[j].getAttribute('data-content-id');
|
||||
$G(contentId).style.display = "block";
|
||||
if(contentId == 'imgManager') {
|
||||
initImagePanel();
|
||||
}
|
||||
}else {
|
||||
tabs[j].className = "";
|
||||
$G(tabs[j].getAttribute('data-content-id')).style.display = "none";
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
/* 初始化颜色设置 */
|
||||
function initColorSelector () {
|
||||
var obj = editor.queryCommandValue('background');
|
||||
if (obj) {
|
||||
var color = obj['background-color'],
|
||||
repeat = obj['background-repeat'] || 'repeat',
|
||||
image = obj['background-image'] || '',
|
||||
position = obj['background-position'] || 'center center',
|
||||
pos = position.split(' '),
|
||||
x = parseInt(pos[0]) || 0,
|
||||
y = parseInt(pos[1]) || 0;
|
||||
|
||||
if(repeat == 'no-repeat' && (x || y)) repeat = 'self';
|
||||
|
||||
image = image.match(/url[\s]*\(([^\)]*)\)/);
|
||||
image = image ? image[1]:'';
|
||||
updateFormState('colored', color, image, repeat, x, y);
|
||||
} else {
|
||||
updateFormState();
|
||||
}
|
||||
|
||||
var updateHandler = function () {
|
||||
updateFormState();
|
||||
updateBackground();
|
||||
}
|
||||
domUtils.on($G('nocolorRadio'), 'click', updateBackground);
|
||||
domUtils.on($G('coloredRadio'), 'click', updateHandler);
|
||||
domUtils.on($G('url'), 'keyup', function(){
|
||||
if($G('url').value && $G('alignment').style.display == "none") {
|
||||
utils.each($G('repeatType').children, function(item){
|
||||
item.selected = ('repeat' == item.getAttribute('value') ? 'selected':false);
|
||||
});
|
||||
}
|
||||
updateHandler();
|
||||
});
|
||||
domUtils.on($G('repeatType'), 'change', updateHandler);
|
||||
domUtils.on($G('x'), 'keyup', updateBackground);
|
||||
domUtils.on($G('y'), 'keyup', updateBackground);
|
||||
|
||||
initColorPicker();
|
||||
}
|
||||
|
||||
/* 初始化颜色选择器 */
|
||||
function initColorPicker() {
|
||||
var me = editor,
|
||||
cp = $G("colorPicker");
|
||||
|
||||
/* 生成颜色选择器ui对象 */
|
||||
var popup = new UE.ui.Popup({
|
||||
content: new UE.ui.ColorPicker({
|
||||
noColorText: me.getLang("clearColor"),
|
||||
editor: me,
|
||||
onpickcolor: function (t, color) {
|
||||
updateFormState('colored', color);
|
||||
updateBackground();
|
||||
UE.ui.Popup.postHide();
|
||||
},
|
||||
onpicknocolor: function (t, color) {
|
||||
updateFormState('colored', 'transparent');
|
||||
updateBackground();
|
||||
UE.ui.Popup.postHide();
|
||||
}
|
||||
}),
|
||||
editor: me,
|
||||
onhide: function () {
|
||||
}
|
||||
});
|
||||
|
||||
/* 设置颜色选择器 */
|
||||
domUtils.on(cp, "click", function () {
|
||||
popup.showAnchor(this);
|
||||
});
|
||||
domUtils.on(document, 'mousedown', function (evt) {
|
||||
var el = evt.target || evt.srcElement;
|
||||
UE.ui.Popup.postHide(el);
|
||||
});
|
||||
domUtils.on(window, 'scroll', function () {
|
||||
UE.ui.Popup.postHide();
|
||||
});
|
||||
}
|
||||
|
||||
/* 初始化在线图片列表 */
|
||||
function initImagePanel() {
|
||||
onlineImage = onlineImage || new OnlineImage('imageList');
|
||||
}
|
||||
|
||||
/* 更新背景色设置面板 */
|
||||
function updateFormState (radio, color, url, align, x, y) {
|
||||
var nocolorRadio = $G('nocolorRadio'),
|
||||
coloredRadio = $G('coloredRadio');
|
||||
|
||||
if(radio) {
|
||||
nocolorRadio.checked = (radio == 'colored' ? false:'checked');
|
||||
coloredRadio.checked = (radio == 'colored' ? 'checked':false);
|
||||
}
|
||||
if(color) {
|
||||
domUtils.setStyle($G("colorPicker"), "background-color", color);
|
||||
}
|
||||
|
||||
if(url && /^\//.test(url)) {
|
||||
var a = document.createElement('a');
|
||||
a.href = url;
|
||||
browser.ie && (a.href = a.href);
|
||||
url = browser.ie ? a.href:(a.protocol + '//' + a.host + a.pathname + a.search + a.hash);
|
||||
}
|
||||
|
||||
if(url || url === '') {
|
||||
$G('url').value = url;
|
||||
}
|
||||
if(align) {
|
||||
utils.each($G('repeatType').children, function(item){
|
||||
item.selected = (align == item.getAttribute('value') ? 'selected':false);
|
||||
});
|
||||
}
|
||||
if(x || y) {
|
||||
$G('x').value = parseInt(x) || 0;
|
||||
$G('y').value = parseInt(y) || 0;
|
||||
}
|
||||
|
||||
$G('alignment').style.display = coloredRadio.checked && $G('url').value ? '':'none';
|
||||
$G('custom').style.display = coloredRadio.checked && $G('url').value && $G('repeatType').value == 'self' ? '':'none';
|
||||
}
|
||||
|
||||
/* 更新背景颜色 */
|
||||
function updateBackground () {
|
||||
if ($G('coloredRadio').checked) {
|
||||
var color = domUtils.getStyle($G("colorPicker"), "background-color"),
|
||||
bgimg = $G("url").value,
|
||||
align = $G("repeatType").value,
|
||||
backgroundObj = {
|
||||
"background-repeat": "no-repeat",
|
||||
"background-position": "center center"
|
||||
};
|
||||
|
||||
if (color) backgroundObj["background-color"] = color;
|
||||
if (bgimg) backgroundObj["background-image"] = 'url(' + bgimg + ')';
|
||||
if (align == 'self') {
|
||||
backgroundObj["background-position"] = $G("x").value + "px " + $G("y").value + "px";
|
||||
} else if (align == 'repeat-x' || align == 'repeat-y' || align == 'repeat') {
|
||||
backgroundObj["background-repeat"] = align;
|
||||
}
|
||||
|
||||
editor.execCommand('background', backgroundObj);
|
||||
} else {
|
||||
editor.execCommand('background', null);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* 在线图片 */
|
||||
function OnlineImage(target) {
|
||||
this.container = utils.isString(target) ? document.getElementById(target) : target;
|
||||
this.init();
|
||||
}
|
||||
OnlineImage.prototype = {
|
||||
init: function () {
|
||||
this.reset();
|
||||
this.initEvents();
|
||||
},
|
||||
/* 初始化容器 */
|
||||
initContainer: function () {
|
||||
this.container.innerHTML = '';
|
||||
this.list = document.createElement('ul');
|
||||
this.clearFloat = document.createElement('li');
|
||||
|
||||
domUtils.addClass(this.list, 'list');
|
||||
domUtils.addClass(this.clearFloat, 'clearFloat');
|
||||
|
||||
this.list.id = 'imageListUl';
|
||||
this.list.appendChild(this.clearFloat);
|
||||
this.container.appendChild(this.list);
|
||||
},
|
||||
/* 初始化滚动事件,滚动到地步自动拉取数据 */
|
||||
initEvents: function () {
|
||||
var _this = this;
|
||||
|
||||
/* 滚动拉取图片 */
|
||||
domUtils.on($G('imageList'), 'scroll', function(e){
|
||||
var panel = this;
|
||||
if (panel.scrollHeight - (panel.offsetHeight + panel.scrollTop) < 10) {
|
||||
_this.getImageData();
|
||||
}
|
||||
});
|
||||
/* 选中图片 */
|
||||
domUtils.on(this.container, 'click', function (e) {
|
||||
var target = e.target || e.srcElement,
|
||||
li = target.parentNode,
|
||||
nodes = $G('imageListUl').childNodes;
|
||||
|
||||
if (li.tagName.toLowerCase() == 'li') {
|
||||
updateFormState('nocolor', null, '');
|
||||
for (var i = 0, node; node = nodes[i++];) {
|
||||
if (node == li && !domUtils.hasClass(node, 'selected')) {
|
||||
domUtils.addClass(node, 'selected');
|
||||
updateFormState('colored', null, li.firstChild.getAttribute("_src"), 'repeat');
|
||||
} else {
|
||||
domUtils.removeClasses(node, 'selected');
|
||||
}
|
||||
}
|
||||
updateBackground();
|
||||
}
|
||||
});
|
||||
},
|
||||
/* 初始化第一次的数据 */
|
||||
initData: function () {
|
||||
|
||||
/* 拉取数据需要使用的值 */
|
||||
this.state = 0;
|
||||
this.listSize = editor.getOpt('imageManagerListSize');
|
||||
this.listIndex = 0;
|
||||
this.listEnd = false;
|
||||
|
||||
/* 第一次拉取数据 */
|
||||
this.getImageData();
|
||||
},
|
||||
/* 重置界面 */
|
||||
reset: function() {
|
||||
this.initContainer();
|
||||
this.initData();
|
||||
},
|
||||
/* 向后台拉取图片列表数据 */
|
||||
getImageData: function () {
|
||||
var _this = this;
|
||||
|
||||
if(!_this.listEnd && !this.isLoadingData) {
|
||||
this.isLoadingData = true;
|
||||
var url = editor.getActionUrl(editor.getOpt('imageManagerActionName')),
|
||||
isJsonp = utils.isCrossDomainUrl(url);
|
||||
ajax.request(url, {
|
||||
'timeout': 100000,
|
||||
'dataType': isJsonp ? 'jsonp':'',
|
||||
'data': utils.extend({
|
||||
start: this.listIndex,
|
||||
size: this.listSize
|
||||
}, editor.queryCommandValue('serverparam')),
|
||||
'method': 'get',
|
||||
'onsuccess': function (r) {
|
||||
try {
|
||||
var json = isJsonp ? r:eval('(' + r.responseText + ')');
|
||||
if (json.state == 'SUCCESS') {
|
||||
_this.pushData(json.list);
|
||||
_this.listIndex = parseInt(json.start) + parseInt(json.list.length);
|
||||
if(_this.listIndex >= json.total) {
|
||||
_this.listEnd = true;
|
||||
}
|
||||
_this.isLoadingData = false;
|
||||
}
|
||||
} catch (e) {
|
||||
if(r.responseText.indexOf('ue_separate_ue') != -1) {
|
||||
var list = r.responseText.split(r.responseText);
|
||||
_this.pushData(list);
|
||||
_this.listIndex = parseInt(list.length);
|
||||
_this.listEnd = true;
|
||||
_this.isLoadingData = false;
|
||||
}
|
||||
}
|
||||
},
|
||||
'onerror': function () {
|
||||
_this.isLoadingData = false;
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
/* 添加图片到列表界面上 */
|
||||
pushData: function (list) {
|
||||
var i, item, img, icon, _this = this,
|
||||
urlPrefix = editor.getOpt('imageManagerUrlPrefix');
|
||||
for (i = 0; i < list.length; i++) {
|
||||
if(list[i] && list[i].url) {
|
||||
item = document.createElement('li');
|
||||
img = document.createElement('img');
|
||||
icon = document.createElement('span');
|
||||
|
||||
domUtils.on(img, 'load', (function(image){
|
||||
return function(){
|
||||
_this.scale(image, image.parentNode.offsetWidth, image.parentNode.offsetHeight);
|
||||
}
|
||||
})(img));
|
||||
img.width = 113;
|
||||
img.setAttribute('src', urlPrefix + list[i].url + (list[i].url.indexOf('?') == -1 ? '?noCache=':'&noCache=') + (+new Date()).toString(36) );
|
||||
img.setAttribute('_src', urlPrefix + list[i].url);
|
||||
domUtils.addClass(icon, 'icon');
|
||||
|
||||
item.appendChild(img);
|
||||
item.appendChild(icon);
|
||||
this.list.insertBefore(item, this.clearFloat);
|
||||
}
|
||||
}
|
||||
},
|
||||
/* 改变图片大小 */
|
||||
scale: function (img, w, h, type) {
|
||||
var ow = img.width,
|
||||
oh = img.height;
|
||||
|
||||
if (type == 'justify') {
|
||||
if (ow >= oh) {
|
||||
img.width = w;
|
||||
img.height = h * oh / ow;
|
||||
img.style.marginLeft = '-' + parseInt((img.width - w) / 2) + 'px';
|
||||
} else {
|
||||
img.width = w * ow / oh;
|
||||
img.height = h;
|
||||
img.style.marginTop = '-' + parseInt((img.height - h) / 2) + 'px';
|
||||
}
|
||||
} else {
|
||||
if (ow >= oh) {
|
||||
img.width = w * ow / oh;
|
||||
img.height = h;
|
||||
img.style.marginLeft = '-' + parseInt((img.width - w) / 2) + 'px';
|
||||
} else {
|
||||
img.width = w;
|
||||
img.height = h * oh / ow;
|
||||
img.style.marginTop = '-' + parseInt((img.height - h) / 2) + 'px';
|
||||
}
|
||||
}
|
||||
},
|
||||
getInsertList: function () {
|
||||
var i, lis = this.list.children, list = [], align = getAlign();
|
||||
for (i = 0; i < lis.length; i++) {
|
||||
if (domUtils.hasClass(lis[i], 'selected')) {
|
||||
var img = lis[i].firstChild,
|
||||
src = img.getAttribute('_src');
|
||||
list.push({
|
||||
src: src,
|
||||
_src: src,
|
||||
floatStyle: align
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
return list;
|
||||
}
|
||||
};
|
||||
|
||||
dialog.onok = function () {
|
||||
updateBackground();
|
||||
editor.fireEvent('saveScene');
|
||||
};
|
||||
dialog.oncancel = function () {
|
||||
editor.execCommand('background', backupStyle);
|
||||
};
|
||||
|
||||
})();
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 2.7 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.6 KiB |
|
|
@ -0,0 +1,65 @@
|
|||
/*
|
||||
* 图表配置文件
|
||||
* */
|
||||
|
||||
|
||||
//不同类型的配置
|
||||
var typeConfig = [
|
||||
{
|
||||
chart: {
|
||||
type: 'line'
|
||||
},
|
||||
plotOptions: {
|
||||
line: {
|
||||
dataLabels: {
|
||||
enabled: false
|
||||
},
|
||||
enableMouseTracking: true
|
||||
}
|
||||
}
|
||||
}, {
|
||||
chart: {
|
||||
type: 'line'
|
||||
},
|
||||
plotOptions: {
|
||||
line: {
|
||||
dataLabels: {
|
||||
enabled: true
|
||||
},
|
||||
enableMouseTracking: false
|
||||
}
|
||||
}
|
||||
}, {
|
||||
chart: {
|
||||
type: 'area'
|
||||
}
|
||||
}, {
|
||||
chart: {
|
||||
type: 'bar'
|
||||
}
|
||||
}, {
|
||||
chart: {
|
||||
type: 'column'
|
||||
}
|
||||
}, {
|
||||
chart: {
|
||||
plotBackgroundColor: null,
|
||||
plotBorderWidth: null,
|
||||
plotShadow: false
|
||||
},
|
||||
plotOptions: {
|
||||
pie: {
|
||||
allowPointSelect: true,
|
||||
cursor: 'pointer',
|
||||
dataLabels: {
|
||||
enabled: true,
|
||||
color: '#000000',
|
||||
connectorColor: '#000000',
|
||||
formatter: function() {
|
||||
return '<b>'+ this.point.name +'</b>: '+ ( Math.round( this.point.percentage*100 ) / 100 ) +' %';
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
];
|
||||
|
|
@ -0,0 +1,165 @@
|
|||
html, body {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
.main {
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.table-view {
|
||||
height: 100%;
|
||||
float: left;
|
||||
margin: 20px;
|
||||
width: 40%;
|
||||
}
|
||||
|
||||
.table-view .table-container {
|
||||
width: 100%;
|
||||
margin-bottom: 50px;
|
||||
overflow: scroll;
|
||||
}
|
||||
|
||||
.table-view th {
|
||||
padding: 5px 10px;
|
||||
background-color: #F7F7F7;
|
||||
}
|
||||
|
||||
.table-view td {
|
||||
width: 50px;
|
||||
text-align: center;
|
||||
padding:0;
|
||||
}
|
||||
|
||||
.table-container input {
|
||||
width: 40px;
|
||||
padding: 5px;
|
||||
border: none;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.table-view caption {
|
||||
font-size: 18px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.charts-view {
|
||||
/*margin-left: 49%!important;*/
|
||||
width: 50%;
|
||||
margin-left: 49%;
|
||||
height: 400px;
|
||||
}
|
||||
|
||||
.charts-container {
|
||||
border-left: 1px solid #c3c3c3;
|
||||
}
|
||||
|
||||
.charts-format fieldset {
|
||||
padding-left: 20px;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
|
||||
.charts-format legend {
|
||||
padding-left: 10px;
|
||||
padding-right: 10px;
|
||||
}
|
||||
|
||||
.format-item-container {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.format-item-container label {
|
||||
display: block;
|
||||
margin: 10px 0;
|
||||
}
|
||||
|
||||
.charts-format .data-item {
|
||||
border: 1px solid black;
|
||||
outline: none;
|
||||
padding: 2px 3px;
|
||||
}
|
||||
|
||||
/* 图表类型 */
|
||||
|
||||
.charts-type {
|
||||
margin-top: 50px;
|
||||
height: 300px;
|
||||
}
|
||||
|
||||
.scroll-view {
|
||||
border: 1px solid #c3c3c3;
|
||||
border-left: none;
|
||||
border-right: none;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.scroll-container {
|
||||
margin: 20px;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.scroll-bed {
|
||||
width: 10000px;
|
||||
_margin-top: 20px;
|
||||
-webkit-transition: margin-left .5s ease;
|
||||
-moz-transition: margin-left .5s ease;
|
||||
transition: margin-left .5s ease;
|
||||
}
|
||||
|
||||
.view-box {
|
||||
display: inline-block;
|
||||
*display: inline;
|
||||
*zoom: 1;
|
||||
margin-right: 20px;
|
||||
border: 2px solid white;
|
||||
line-height: 0;
|
||||
overflow: hidden;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.view-box img {
|
||||
border: 1px solid #cecece;
|
||||
}
|
||||
|
||||
.view-box.selected {
|
||||
border-color: #7274A7;
|
||||
}
|
||||
|
||||
.button-container {
|
||||
margin-bottom: 20px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.button-container a {
|
||||
display: inline-block;
|
||||
width: 100px;
|
||||
height: 25px;
|
||||
line-height: 25px;
|
||||
border: 1px solid #c2ccd1;
|
||||
margin-right: 30px;
|
||||
text-decoration: none;
|
||||
color: black;
|
||||
-webkit-border-radius: 2px;
|
||||
-moz-border-radius: 2px;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
.button-container a:HOVER {
|
||||
background: #fcfcfc;
|
||||
}
|
||||
|
||||
.button-container a:ACTIVE {
|
||||
border-top-color: #c2ccd1;
|
||||
box-shadow:inset 0 5px 4px -4px rgba(49, 49, 64, 0.1);
|
||||
}
|
||||
|
||||
.edui-charts-not-data {
|
||||
height: 100px;
|
||||
line-height: 100px;
|
||||
text-align: center;
|
||||
}
|
||||
|
|
@ -0,0 +1,89 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>chart</title>
|
||||
<meta chartset="utf-8">
|
||||
<link rel="stylesheet" type="text/css" href="charts.css">
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="main">
|
||||
<div class="table-view">
|
||||
<h3><var id="lang_data_source"></var></h3>
|
||||
<div id="tableContainer" class="table-container"></div>
|
||||
<h3><var id="lang_chart_format"></var></h3>
|
||||
<form name="data-form">
|
||||
<div class="charts-format">
|
||||
<fieldset>
|
||||
<legend><var id="lang_data_align"></var></legend>
|
||||
<div class="format-item-container">
|
||||
<label>
|
||||
<input type="radio" class="format-ctrl not-pie-item" name="charts-format" value="1" checked="checked">
|
||||
<var id="lang_chart_align_same"></var>
|
||||
</label>
|
||||
<label>
|
||||
<input type="radio" class="format-ctrl not-pie-item" name="charts-format" value="-1">
|
||||
<var id="lang_chart_align_reverse"></var>
|
||||
</label>
|
||||
<br>
|
||||
</div>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend><var id="lang_chart_title"></var></legend>
|
||||
<div class="format-item-container">
|
||||
<label>
|
||||
<var id="lang_chart_main_title"></var><input type="text" name="title" class="data-item">
|
||||
</label>
|
||||
<label>
|
||||
<var id="lang_chart_sub_title"></var><input type="text" name="sub-title" class="data-item not-pie-item">
|
||||
</label>
|
||||
<label>
|
||||
<var id="lang_chart_x_title"></var><input type="text" name="x-title" class="data-item not-pie-item">
|
||||
</label>
|
||||
<label>
|
||||
<var id="lang_chart_y_title"></var><input type="text" name="y-title" class="data-item not-pie-item">
|
||||
</label>
|
||||
</div>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend><var id="lang_chart_tip"></var></legend>
|
||||
<div class="format-item-container">
|
||||
<label>
|
||||
<var id="lang_cahrt_tip_prefix"></var>
|
||||
<input type="text" id="tipInput" name="tip" class="data-item" disabled="disabled">
|
||||
</label>
|
||||
<p><var id="lang_cahrt_tip_description"></var></p>
|
||||
</div>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend><var id="lang_chart_data_unit"></var></legend>
|
||||
<div class="format-item-container">
|
||||
<label><var id="lang_chart_data_unit_title"></var><input type="text" name="unit" class="data-item"></label>
|
||||
<p><var id="lang_chart_data_unit_description"></var></p>
|
||||
</div>
|
||||
</fieldset>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="charts-view">
|
||||
<div id="chartsContainer" class="charts-container"></div>
|
||||
<div id="chartsType" class="charts-type">
|
||||
<h3><var id="lang_chart_type"></var></h3>
|
||||
<div class="scroll-view">
|
||||
<div class="scroll-container">
|
||||
<div id="scrollBed" class="scroll-bed"></div>
|
||||
</div>
|
||||
<div id="buttonContainer" class="button-container">
|
||||
<a href="#" data-title="prev"><var id="lang_prev_btn"></var></a>
|
||||
<a href="#" data-title="next"><var id="lang_next_btn"></var></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script src="../../third-party/jquery-1.10.2.min.js"></script>
|
||||
<script src="../../third-party/highcharts/highcharts.js"></script>
|
||||
<script src="chart.config.js"></script>
|
||||
<script src="charts.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,519 @@
|
|||
/*
|
||||
* 图片转换对话框脚本
|
||||
**/
|
||||
|
||||
var tableData = [],
|
||||
//编辑器页面table
|
||||
editorTable = null,
|
||||
chartsConfig = window.typeConfig,
|
||||
resizeTimer = null,
|
||||
//初始默认图表类型
|
||||
currentChartType = 0;
|
||||
|
||||
window.onload = function () {
|
||||
|
||||
editorTable = domUtils.findParentByTagName( editor.selection.getRange().startContainer, 'table', true);
|
||||
|
||||
//未找到表格， 显示错误页面
|
||||
if ( !editorTable ) {
|
||||
document.body.innerHTML = "<div class='edui-charts-not-data'>未找到数据</div>";
|
||||
return;
|
||||
}
|
||||
|
||||
//初始化图表类型选择
|
||||
initChartsTypeView();
|
||||
renderTable( editorTable );
|
||||
initEvent();
|
||||
initUserConfig( editorTable.getAttribute( "data-chart" ) );
|
||||
$( "#scrollBed .view-box:eq("+ currentChartType +")" ).trigger( "click" );
|
||||
updateViewType( currentChartType );
|
||||
|
||||
dialog.addListener( "resize", function () {
|
||||
|
||||
if ( resizeTimer != null ) {
|
||||
window.clearTimeout( resizeTimer );
|
||||
}
|
||||
|
||||
resizeTimer = window.setTimeout( function () {
|
||||
|
||||
resizeTimer = null;
|
||||
|
||||
renderCharts();
|
||||
|
||||
}, 500 );
|
||||
|
||||
} );
|
||||
|
||||
};
|
||||
|
||||
function initChartsTypeView () {
|
||||
|
||||
var contents = [];
|
||||
|
||||
for ( var i = 0, len = chartsConfig.length; i<len; i++ ) {
|
||||
|
||||
contents.push( '<div class="view-box" data-chart-type="'+ i +'"><img width="300" src="images/charts'+ i +'.png"></div>' );
|
||||
|
||||
}
|
||||
|
||||
$( "#scrollBed" ).html( contents.join( "" ) );
|
||||
|
||||
}
|
||||
|
||||
//渲染table， 以便用户修改数据
|
||||
function renderTable ( table ) {
|
||||
|
||||
var tableHtml = [];
|
||||
|
||||
//构造数据
|
||||
for ( var i = 0, row; row = table.rows[ i ]; i++ ) {
|
||||
|
||||
tableData[ i ] = [];
|
||||
tableHtml[ i ] = [];
|
||||
|
||||
for ( var j = 0, cell; cell = row.cells[ j ]; j++ ) {
|
||||
|
||||
var value = getCellValue( cell );
|
||||
|
||||
if ( i > 0 && j > 0 ) {
|
||||
value = +value;
|
||||
}
|
||||
|
||||
if ( i === 0 || j === 0 ) {
|
||||
tableHtml[ i ].push( '<th>'+ value +'</th>' );
|
||||
} else {
|
||||
tableHtml[ i ].push( '<td><input type="text" class="data-item" value="'+ value +'"></td>' );
|
||||
}
|
||||
|
||||
tableData[ i ][ j ] = value;
|
||||
|
||||
}
|
||||
|
||||
tableHtml[ i ] = tableHtml[ i ].join( "" );
|
||||
|
||||
}
|
||||
|
||||
//draw 表格
|
||||
$( "#tableContainer" ).html( '<table id="showTable" border="1"><tbody><tr>'+ tableHtml.join( "</tr><tr>" ) +'</tr></tbody></table>' );
|
||||
|
||||
}
|
||||
|
||||
/*
|
||||
* 根据表格已有的图表属性初始化当前图表属性
|
||||
*/
|
||||
function initUserConfig ( config ) {
|
||||
|
||||
var parsedConfig = {};
|
||||
|
||||
if ( !config ) {
|
||||
return;
|
||||
}
|
||||
|
||||
config = config.split( ";" );
|
||||
|
||||
$.each( config, function ( index, item ) {
|
||||
|
||||
item = item.split( ":" );
|
||||
parsedConfig[ item[ 0 ] ] = item[ 1 ];
|
||||
|
||||
} );
|
||||
|
||||
setUserConfig( parsedConfig );
|
||||
|
||||
}
|
||||
|
||||
function initEvent () {
|
||||
|
||||
var cacheValue = null,
|
||||
//图表类型数
|
||||
typeViewCount = chartsConfig.length- 1,
|
||||
$chartsTypeViewBox = $( '#scrollBed .view-box' );
|
||||
|
||||
$( ".charts-format" ).delegate( ".format-ctrl", "change", function () {
|
||||
|
||||
renderCharts();
|
||||
|
||||
} )
|
||||
|
||||
$( ".table-view" ).delegate( ".data-item", "focus", function () {
|
||||
|
||||
cacheValue = this.value;
|
||||
|
||||
} ).delegate( ".data-item", "blur", function () {
|
||||
|
||||
if ( this.value !== cacheValue ) {
|
||||
renderCharts();
|
||||
}
|
||||
|
||||
cacheValue = null;
|
||||
|
||||
} );
|
||||
|
||||
$( "#buttonContainer" ).delegate( "a", "click", function (e) {
|
||||
|
||||
e.preventDefault();
|
||||
|
||||
if ( this.getAttribute( "data-title" ) === 'prev' ) {
|
||||
|
||||
if ( currentChartType > 0 ) {
|
||||
currentChartType--;
|
||||
updateViewType( currentChartType );
|
||||
}
|
||||
|
||||
} else {
|
||||
|
||||
if ( currentChartType < typeViewCount ) {
|
||||
currentChartType++;
|
||||
updateViewType( currentChartType );
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
} );
|
||||
|
||||
//图表类型变化
|
||||
$( '#scrollBed' ).delegate( ".view-box", "click", function (e) {
|
||||
|
||||
var index = $( this ).attr( "data-chart-type" );
|
||||
$chartsTypeViewBox.removeClass( "selected" );
|
||||
$( $chartsTypeViewBox[ index ] ).addClass( "selected" );
|
||||
|
||||
currentChartType = index | 0;
|
||||
|
||||
//饼图， 禁用部分配置
|
||||
if ( currentChartType === chartsConfig.length - 1 ) {
|
||||
|
||||
disableNotPieConfig();
|
||||
|
||||
//启用完整配置
|
||||
} else {
|
||||
|
||||
enableNotPieConfig();
|
||||
|
||||
}
|
||||
|
||||
renderCharts();
|
||||
|
||||
} );
|
||||
|
||||
}
|
||||
|
||||
function renderCharts () {
|
||||
|
||||
var data = collectData();
|
||||
|
||||
$('#chartsContainer').highcharts( $.extend( {}, chartsConfig[ currentChartType ], {
|
||||
|
||||
credits: {
|
||||
enabled: false
|
||||
},
|
||||
exporting: {
|
||||
enabled: false
|
||||
},
|
||||
title: {
|
||||
text: data.title,
|
||||
x: -20 //center
|
||||
},
|
||||
subtitle: {
|
||||
text: data.subTitle,
|
||||
x: -20
|
||||
},
|
||||
xAxis: {
|
||||
title: {
|
||||
text: data.xTitle
|
||||
},
|
||||
categories: data.categories
|
||||
},
|
||||
yAxis: {
|
||||
title: {
|
||||
text: data.yTitle
|
||||
},
|
||||
plotLines: [{
|
||||
value: 0,
|
||||
width: 1,
|
||||
color: '#808080'
|
||||
}]
|
||||
},
|
||||
tooltip: {
|
||||
enabled: true,
|
||||
valueSuffix: data.suffix
|
||||
},
|
||||
legend: {
|
||||
layout: 'vertical',
|
||||
align: 'right',
|
||||
verticalAlign: 'middle',
|
||||
borderWidth: 1
|
||||
},
|
||||
series: data.series
|
||||
|
||||
} ));
|
||||
|
||||
}
|
||||
|
||||
function updateViewType ( index ) {
|
||||
|
||||
$( "#scrollBed" ).css( 'marginLeft', -index*324+'px' );
|
||||
|
||||
}
|
||||
|
||||
function collectData () {
|
||||
|
||||
var form = document.forms[ 'data-form' ],
|
||||
data = null;
|
||||
|
||||
if ( currentChartType !== chartsConfig.length - 1 ) {
|
||||
|
||||
data = getSeriesAndCategories();
|
||||
$.extend( data, getUserConfig() );
|
||||
|
||||
//饼图数据格式
|
||||
} else {
|
||||
data = getSeriesForPieChart();
|
||||
data.title = form[ 'title' ].value;
|
||||
data.suffix = form[ 'unit' ].value;
|
||||
}
|
||||
|
||||
return data;
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取用户配置信息
|
||||
*/
|
||||
function getUserConfig () {
|
||||
|
||||
var form = document.forms[ 'data-form' ],
|
||||
info = {
|
||||
title: form[ 'title' ].value,
|
||||
subTitle: form[ 'sub-title' ].value,
|
||||
xTitle: form[ 'x-title' ].value,
|
||||
yTitle: form[ 'y-title' ].value,
|
||||
suffix: form[ 'unit' ].value,
|
||||
//数据对齐方式
|
||||
tableDataFormat: getTableDataFormat (),
|
||||
//饼图提示文字
|
||||
tip: $( "#tipInput" ).val()
|
||||
};
|
||||
|
||||
return info;
|
||||
|
||||
}
|
||||
|
||||
function setUserConfig ( config ) {
|
||||
|
||||
var form = document.forms[ 'data-form' ];
|
||||
|
||||
config.title && ( form[ 'title' ].value = config.title );
|
||||
config.subTitle && ( form[ 'sub-title' ].value = config.subTitle );
|
||||
config.xTitle && ( form[ 'x-title' ].value = config.xTitle );
|
||||
config.yTitle && ( form[ 'y-title' ].value = config.yTitle );
|
||||
config.suffix && ( form[ 'unit' ].value = config.suffix );
|
||||
config.dataFormat == "-1" && ( form[ 'charts-format' ][ 1 ].checked = true );
|
||||
config.tip && ( form[ 'tip' ].value = config.tip );
|
||||
currentChartType = config.chartType || 0;
|
||||
|
||||
}
|
||||
|
||||
function getSeriesAndCategories () {
|
||||
|
||||
var form = document.forms[ 'data-form' ],
|
||||
series = [],
|
||||
categories = [],
|
||||
tmp = [],
|
||||
tableData = getTableData();
|
||||
|
||||
//反转数据
|
||||
if ( getTableDataFormat() === "-1" ) {
|
||||
|
||||
for ( var i = 0, len = tableData.length; i < len; i++ ) {
|
||||
|
||||
for ( var j = 0, jlen = tableData[ i ].length; j < jlen; j++ ) {
|
||||
|
||||
if ( !tmp[ j ] ) {
|
||||
tmp[ j ] = [];
|
||||
}
|
||||
|
||||
tmp[ j ][ i ] = tableData[ i ][ j ];
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
tableData = tmp;
|
||||
|
||||
}
|
||||
|
||||
categories = tableData[0].slice( 1 );
|
||||
|
||||
for ( var i = 1, data; data = tableData[ i ]; i++ ) {
|
||||
|
||||
series.push( {
|
||||
name: data[ 0 ],
|
||||
data: data.slice( 1 )
|
||||
} );
|
||||
|
||||
}
|
||||
|
||||
return {
|
||||
series: series,
|
||||
categories: categories
|
||||
};
|
||||
|
||||
}
|
||||
|
||||
/*
|
||||
* 获取数据源数据对齐方式
|
||||
*/
|
||||
function getTableDataFormat () {
|
||||
|
||||
var form = document.forms[ 'data-form' ],
|
||||
items = form['charts-format'];
|
||||
|
||||
return items[ 0 ].checked ? items[ 0 ].value : items[ 1 ].value;
|
||||
|
||||
}
|
||||
|
||||
/*
|
||||
* 禁用非饼图类型的配置项
|
||||
*/
|
||||
function disableNotPieConfig() {
|
||||
|
||||
updateConfigItem( 'disable' );
|
||||
|
||||
}
|
||||
|
||||
/*
|
||||
* 启用非饼图类型的配置项
|
||||
*/
|
||||
function enableNotPieConfig() {
|
||||
|
||||
updateConfigItem( 'enable' );
|
||||
|
||||
}
|
||||
|
||||
function updateConfigItem ( value ) {
|
||||
|
||||
var table = $( "#showTable" )[ 0 ],
|
||||
isDisable = value === 'disable' ? true : false;
|
||||
|
||||
//table中的input处理
|
||||
for ( var i = 2 , row; row = table.rows[ i ]; i++ ) {
|
||||
|
||||
for ( var j = 1, cell; cell = row.cells[ j ]; j++ ) {
|
||||
|
||||
$( "input", cell ).attr( "disabled", isDisable );
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
//其他项处理
|
||||
$( "input.not-pie-item" ).attr( "disabled", isDisable );
|
||||
$( "#tipInput" ).attr( "disabled", !isDisable )
|
||||
|
||||
}
|
||||
|
||||
/*
|
||||
* 获取饼图数据
|
||||
* 饼图的数据只取第一行的
|
||||
**/
|
||||
function getSeriesForPieChart () {
|
||||
|
||||
var series = {
|
||||
type: 'pie',
|
||||
name: $("#tipInput").val(),
|
||||
data: []
|
||||
},
|
||||
tableData = getTableData();
|
||||
|
||||
|
||||
for ( var j = 1, jlen = tableData[ 0 ].length; j < jlen; j++ ) {
|
||||
|
||||
var title = tableData[ 0 ][ j ],
|
||||
val = tableData[ 1 ][ j ];
|
||||
|
||||
series.data.push( [ title, val ] );
|
||||
|
||||
}
|
||||
|
||||
return {
|
||||
series: [ series ]
|
||||
};
|
||||
|
||||
}
|
||||
|
||||
function getTableData () {
|
||||
|
||||
var table = document.getElementById( "showTable" ),
|
||||
xCount = table.rows[0].cells.length - 1,
|
||||
values = getTableInputValue();
|
||||
|
||||
for ( var i = 0, value; value = values[ i ]; i++ ) {
|
||||
|
||||
tableData[ Math.floor( i / xCount ) + 1 ][ i % xCount + 1 ] = values[ i ];
|
||||
|
||||
}
|
||||
|
||||
return tableData;
|
||||
|
||||
}
|
||||
|
||||
function getTableInputValue () {
|
||||
|
||||
var table = document.getElementById( "showTable" ),
|
||||
inputs = table.getElementsByTagName( "input" ),
|
||||
values = [];
|
||||
|
||||
for ( var i = 0, input; input = inputs[ i ]; i++ ) {
|
||||
values.push( input.value | 0 );
|
||||
}
|
||||
|
||||
return values;
|
||||
|
||||
}
|
||||
|
||||
function getCellValue ( cell ) {
|
||||
|
||||
var value = utils.trim( ( cell.innerText || cell.textContent || '' ) );
|
||||
|
||||
return value.replace( new RegExp( UE.dom.domUtils.fillChar, 'g' ), '' ).replace( /^\s+|\s+$/g, '' );
|
||||
|
||||
}
|
||||
|
||||
|
||||
//dialog确认事件
|
||||
dialog.onok = function () {
|
||||
|
||||
//收集信息
|
||||
var form = document.forms[ 'data-form' ],
|
||||
info = getUserConfig();
|
||||
|
||||
//添加图表类型
|
||||
info.chartType = currentChartType;
|
||||
|
||||
//同步表格数据到编辑器
|
||||
syncTableData();
|
||||
|
||||
//执行图表命令
|
||||
editor.execCommand( 'charts', info );
|
||||
|
||||
};
|
||||
|
||||
/*
|
||||
* 同步图表编辑视图的表格数据到编辑器里的原始表格
|
||||
*/
|
||||
function syncTableData () {
|
||||
|
||||
var tableData = getTableData();
|
||||
|
||||
for ( var i = 1, row; row = editorTable.rows[ i ]; i++ ) {
|
||||
|
||||
for ( var j = 1, cell; cell = row.cells[ j ]; j++ ) {
|
||||
|
||||
cell.innerHTML = tableData[ i ] [ j ];
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 25 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 19 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 22 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 7.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 8.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 46 KiB |
|
|
@ -0,0 +1,43 @@
|
|||
.jd img{
|
||||
background:transparent url(images/jxface2.gif?v=1.1) no-repeat scroll left top;
|
||||
cursor:pointer;width:35px;height:35px;display:block;
|
||||
}
|
||||
.pp img{
|
||||
background:transparent url(images/fface.gif?v=1.1) no-repeat scroll left top;
|
||||
cursor:pointer;width:25px;height:25px;display:block;
|
||||
}
|
||||
.ldw img{
|
||||
background:transparent url(images/wface.gif?v=1.1) no-repeat scroll left top;
|
||||
cursor:pointer;width:35px;height:35px;display:block;
|
||||
}
|
||||
.tsj img{
|
||||
background:transparent url(images/tface.gif?v=1.1) no-repeat scroll left top;
|
||||
cursor:pointer;width:35px;height:35px;display:block;
|
||||
}
|
||||
.cat img{
|
||||
background:transparent url(images/cface.gif?v=1.1) no-repeat scroll left top;
|
||||
cursor:pointer;width:35px;height:35px;display:block;
|
||||
}
|
||||
.bb img{
|
||||
background:transparent url(images/bface.gif?v=1.1) no-repeat scroll left top;
|
||||
cursor:pointer;width:35px;height:35px;display:block;
|
||||
}
|
||||
.youa img{
|
||||
background:transparent url(images/yface.gif?v=1.1) no-repeat scroll left top;
|
||||
cursor:pointer;width:35px;height:35px;display:block;
|
||||
}
|
||||
|
||||
.smileytable td {height: 37px;}
|
||||
#tabPanel{margin-left:5px;overflow: hidden;}
|
||||
#tabContent {float:left;background:#FFFFFF;}
|
||||
#tabContent div{display: none;width:480px;overflow:hidden;}
|
||||
#tabIconReview.show{left:17px;display:block;}
|
||||
.menuFocus{background:#ACCD3C;}
|
||||
.menuDefault{background:#FFFFFF;}
|
||||
#tabIconReview{position:absolute;left:406px;left:398px \9;top:41px;z-index:65533;width:90px;height:76px;}
|
||||
img.review{width:90px;height:76px;border:2px solid #9cb945;background:#FFFFFF;background-position:center;background-repeat:no-repeat;}
|
||||
|
||||
.wrapper .tabbody{position:relative;float:left;clear:both;padding:10px;width: 95%;}
|
||||
.tabbody table{width: 100%;}
|
||||
.tabbody td{border:1px solid #BAC498;}
|
||||
.tabbody td span{display: block;zoom:1;padding:0 4px;}
|
||||
|
|
@ -0,0 +1,54 @@
|
|||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title></title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<meta name="robots" content="noindex, nofollow"/>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="emotion.css">
|
||||
</head>
|
||||
<body>
|
||||
<div id="tabPanel" class="wrapper">
|
||||
<div id="tabHeads" class="tabhead">
|
||||
<span><var id="lang_input_choice"></var></span>
|
||||
<span><var id="lang_input_Tuzki"></var></span>
|
||||
<span><var id="lang_input_lvdouwa"></var></span>
|
||||
<span><var id="lang_input_BOBO"></var></span>
|
||||
<span><var id="lang_input_babyCat"></var></span>
|
||||
<span><var id="lang_input_bubble"></var></span>
|
||||
<span><var id="lang_input_youa"></var></span>
|
||||
</div>
|
||||
<div id="tabBodys" class="tabbody">
|
||||
<div id="tab0"></div>
|
||||
<div id="tab1"></div>
|
||||
<div id="tab2"></div>
|
||||
<div id="tab3"></div>
|
||||
<div id="tab4"></div>
|
||||
<div id="tab5"></div>
|
||||
<div id="tab6"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="tabIconReview">
|
||||
<img id='faceReview' class='review' src="../../themes/default/images/spacer.gif"/>
|
||||
</div>
|
||||
<script type="text/javascript" src="emotion.js"></script>
|
||||
<script type="text/javascript">
|
||||
var emotion = {
|
||||
tabNum:7, //切换面板数量
|
||||
SmilmgName:{ tab0:['j_00', 84], tab1:['t_00', 40], tab2:['w_00', 52], tab3:['B_00', 63], tab4:['C_00', 20], tab5:['i_f', 50], tab6:['y_00', 40] }, //图片前缀名
|
||||
imageFolders:{ tab0:'jx2/', tab1:'tsj/', tab2:'ldw/', tab3:'bobo/', tab4:'babycat/', tab5:'face/', tab6:'youa/'}, //图片对应文件夹路径
|
||||
imageCss:{tab0:'jd', tab1:'tsj', tab2:'ldw', tab3:'bb', tab4:'cat', tab5:'pp', tab6:'youa'}, //图片css类名
|
||||
imageCssOffset:{tab0:35, tab1:35, tab2:35, tab3:35, tab4:35, tab5:25, tab6:35}, //图片偏移
|
||||
SmileyInfor:{
|
||||
tab0:['Kiss', 'Love', 'Yeah', '啊！', '背扭', '顶', '抖胸', '88', '汗', '瞌睡', '鲁拉', '拍砖', '揉脸', '生日快乐', '大笑', '瀑布汗~', '惊讶', '臭美', '傻笑', '抛媚眼', '发怒', '打酱油', '俯卧撑', '气愤', '?', '吻', '怒', '胜利', 'HI', 'KISS', '不说', '不要', '扯花', '大心', '顶', '大惊', '飞吻', '鬼脸', '害羞', '口水', '狂哭', '来', '发财了', '吃西瓜', '套牢', '害羞', '庆祝', '我来了', '敲打', '晕了', '胜利', '臭美', '被打了', '贪吃', '迎接', '酷', '微笑', '亲吻', '调皮', '惊恐', '耍酷', '发火', '害羞', '汗水', '大哭', '', '加油', '困', '你NB', '晕倒', '开心', '偷笑', '大哭', '滴汗', '叹气', '超赞', '??', '飞吻', '天使', '撒花', '生气', '被砸', '吓傻', '随意吐'],
|
||||
tab1:['Kiss', 'Love', 'Yeah', '啊！', '背扭', '顶', '抖胸', '88', '汗', '瞌睡', '鲁拉', '拍砖', '揉脸', '生日快乐', '摊手', '睡觉', '瘫坐', '无聊', '星星闪', '旋转', '也不行', '郁闷', '正Music', '抓墙', '撞墙至死', '歪头', '戳眼', '飘过', '互相拍砖', '砍死你', '扔桌子', '少林寺', '什么？', '转头', '我爱牛奶', '我踢', '摇晃', '晕厥', '在笼子里', '震荡'],
|
||||
tab2:['大笑', '瀑布汗~', '惊讶', '臭美', '傻笑', '抛媚眼', '发怒', '我错了', 'money', '气愤', '挑逗', '吻', '怒', '胜利', '委屈', '受伤', '说啥呢？', '闭嘴', '不', '逗你玩儿', '飞吻', '眩晕', '魔法', '我来了', '睡了', '我打', '闭嘴', '打', '打晕了', '刷牙', '爆揍', '炸弹', '倒立', '刮胡子', '邪恶的笑', '不要不要', '爱恋中', '放大仔细看', '偷窥', '超高兴', '晕', '松口气', '我跑', '享受', '修养', '哭', '汗', '啊~', '热烈欢迎', '打酱油', '俯卧撑', '?'],
|
||||
tab3:['HI', 'KISS', '不说', '不要', '扯花', '大心', '顶', '大惊', '飞吻', '鬼脸', '害羞', '口水', '狂哭', '来', '泪眼', '流泪', '生气', '吐舌', '喜欢', '旋转', '再见', '抓狂', '汗', '鄙视', '拜', '吐血', '嘘', '打人', '蹦跳', '变脸', '扯肉', '吃To', '吃花', '吹泡泡糖', '大变身', '飞天舞', '回眸', '可怜', '猛抽', '泡泡', '苹果', '亲', '', '骚舞', '烧香', '睡', '套娃娃', '捅捅', '舞倒', '西红柿', '爱慕', '摇', '摇摆', '杂耍', '招财', '被殴', '被球闷', '大惊', '理想', '欧打', '呕吐', '碎', '吐痰'],
|
||||
tab4:['发财了', '吃西瓜', '套牢', '害羞', '庆祝', '我来了', '敲打', '晕了', '胜利', '臭美', '被打了', '贪吃', '迎接', '酷', '顶', '幸运', '爱心', '躲', '送花', '选择'],
|
||||
tab5:['微笑', '亲吻', '调皮', '惊讶', '耍酷', '发火', '害羞', '汗水', '大哭', '得意', '鄙视', '困', '夸奖', '晕倒', '疑问', '媒婆', '狂吐', '青蛙', '发愁', '亲吻', '', '爱心', '心碎', '玫瑰', '礼物', '哭', '奸笑', '可爱', '得意', '呲牙', '暴汗', '楚楚可怜', '困', '哭', '生气', '惊讶', '口水', '彩虹', '夜空', '太阳', '钱钱', '灯泡', '咖啡', '蛋糕', '音乐', '爱', '胜利', '赞', '鄙视', 'OK'],
|
||||
tab6:['男兜', '女兜', '开心', '乖乖', '偷笑', '大笑', '抽泣', '大哭', '无奈', '滴汗', '叹气', '狂晕', '委屈', '超赞', '??', '疑问', '飞吻', '天使', '撒花', '生气', '被砸', '口水', '泪奔', '吓傻', '吐舌头', '点头', '随意吐', '旋转', '困困', '鄙视', '狂顶', '篮球', '再见', '欢迎光临', '恭喜发财', '稍等', '我在线', '恕不议价', '库房有货', '货在路上']
|
||||
}
|
||||
};
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,186 @@
|
|||
window.onload = function () {
|
||||
editor.setOpt({
|
||||
emotionLocalization:false
|
||||
});
|
||||
|
||||
emotion.SmileyPath = editor.options.emotionLocalization === true ? 'images/' : "http://img.baidu.com/hi/";
|
||||
emotion.SmileyBox = createTabList( emotion.tabNum );
|
||||
emotion.tabExist = createArr( emotion.tabNum );
|
||||
|
||||
initImgName();
|
||||
initEvtHandler( "tabHeads" );
|
||||
};
|
||||
|
||||
function initImgName() {
|
||||
for ( var pro in emotion.SmilmgName ) {
|
||||
var tempName = emotion.SmilmgName[pro],
|
||||
tempBox = emotion.SmileyBox[pro],
|
||||
tempStr = "";
|
||||
|
||||
if ( tempBox.length ) return;
|
||||
for ( var i = 1; i <= tempName[1]; i++ ) {
|
||||
tempStr = tempName[0];
|
||||
if ( i < 10 ) tempStr = tempStr + '0';
|
||||
tempStr = tempStr + i + '.gif';
|
||||
tempBox.push( tempStr );
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function initEvtHandler( conId ) {
|
||||
var tabHeads = $G( conId );
|
||||
for ( var i = 0, j = 0; i < tabHeads.childNodes.length; i++ ) {
|
||||
var tabObj = tabHeads.childNodes[i];
|
||||
if ( tabObj.nodeType == 1 ) {
|
||||
domUtils.on( tabObj, "click", (function ( index ) {
|
||||
return function () {
|
||||
switchTab( index );
|
||||
};
|
||||
})( j ) );
|
||||
j++;
|
||||
}
|
||||
}
|
||||
switchTab( 0 );
|
||||
$G( "tabIconReview" ).style.display = 'none';
|
||||
}
|
||||
|
||||
function InsertSmiley( url, evt ) {
|
||||
var obj = {
|
||||
src:editor.options.emotionLocalization ? editor.options.UEDITOR_HOME_URL + "dialogs/emotion/" + url : url
|
||||
};
|
||||
obj._src = obj.src;
|
||||
editor.execCommand( 'insertimage', obj );
|
||||
if ( !evt.ctrlKey ) {
|
||||
dialog.popup.hide();
|
||||
}
|
||||
}
|
||||
|
||||
function switchTab( index ) {
|
||||
|
||||
autoHeight( index );
|
||||
if ( emotion.tabExist[index] == 0 ) {
|
||||
emotion.tabExist[index] = 1;
|
||||
createTab( 'tab' + index );
|
||||
}
|
||||
//获取呈现元素句柄数组
|
||||
var tabHeads = $G( "tabHeads" ).getElementsByTagName( "span" ),
|
||||
tabBodys = $G( "tabBodys" ).getElementsByTagName( "div" ),
|
||||
i = 0, L = tabHeads.length;
|
||||
//隐藏所有呈现元素
|
||||
for ( ; i < L; i++ ) {
|
||||
tabHeads[i].className = "";
|
||||
tabBodys[i].style.display = "none";
|
||||
}
|
||||
//显示对应呈现元素
|
||||
tabHeads[index].className = "focus";
|
||||
tabBodys[index].style.display = "block";
|
||||
}
|
||||
|
||||
function autoHeight( index ) {
|
||||
var iframe = dialog.getDom( "iframe" ),
|
||||
parent = iframe.parentNode.parentNode;
|
||||
switch ( index ) {
|
||||
case 0:
|
||||
iframe.style.height = "380px";
|
||||
parent.style.height = "392px";
|
||||
break;
|
||||
case 1:
|
||||
iframe.style.height = "220px";
|
||||
parent.style.height = "232px";
|
||||
break;
|
||||
case 2:
|
||||
iframe.style.height = "260px";
|
||||
parent.style.height = "272px";
|
||||
break;
|
||||
case 3:
|
||||
iframe.style.height = "300px";
|
||||
parent.style.height = "312px";
|
||||
break;
|
||||
case 4:
|
||||
iframe.style.height = "140px";
|
||||
parent.style.height = "152px";
|
||||
break;
|
||||
case 5:
|
||||
iframe.style.height = "260px";
|
||||
parent.style.height = "272px";
|
||||
break;
|
||||
case 6:
|
||||
iframe.style.height = "230px";
|
||||
parent.style.height = "242px";
|
||||
break;
|
||||
default:
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
function createTab( tabName ) {
|
||||
var faceVersion = "?v=1.1", //版本号
|
||||
tab = $G( tabName ), //获取将要生成的Div句柄
|
||||
imagePath = emotion.SmileyPath + emotion.imageFolders[tabName], //获取显示表情和预览表情的路径
|
||||
positionLine = 11 / 2, //中间数
|
||||
iWidth = iHeight = 35, //图片长宽
|
||||
iColWidth = 3, //表格剩余空间的显示比例
|
||||
tableCss = emotion.imageCss[tabName],
|
||||
cssOffset = emotion.imageCssOffset[tabName],
|
||||
textHTML = ['<table class="smileytable">'],
|
||||
i = 0, imgNum = emotion.SmileyBox[tabName].length, imgColNum = 11, faceImage,
|
||||
sUrl, realUrl, posflag, offset, infor;
|
||||
|
||||
for ( ; i < imgNum; ) {
|
||||
textHTML.push( '<tr>' );
|
||||
for ( var j = 0; j < imgColNum; j++, i++ ) {
|
||||
faceImage = emotion.SmileyBox[tabName][i];
|
||||
if ( faceImage ) {
|
||||
sUrl = imagePath + faceImage + faceVersion;
|
||||
realUrl = imagePath + faceImage;
|
||||
posflag = j < positionLine ? 0 : 1;
|
||||
offset = cssOffset * i * (-1) - 1;
|
||||
infor = emotion.SmileyInfor[tabName][i];
|
||||
|
||||
textHTML.push( '<td class="' + tableCss + '" border="1" width="' + iColWidth + '%" style="border-collapse:collapse;" align="center" bgcolor="transparent" onclick="InsertSmiley(\'' + realUrl.replace( /'/g, "\\'" ) + '\',event)" onmouseover="over(this,\'' + sUrl + '\',\'' + posflag + '\')" onmouseout="out(this)">' );
|
||||
textHTML.push( '<span>' );
|
||||
textHTML.push( '<img style="background-position:left ' + offset + 'px;" title="' + infor + '" src="' + emotion.SmileyPath + (editor.options.emotionLocalization ? '0.gif" width="' : 'default/0.gif" width="') + iWidth + '" height="' + iHeight + '"></img>' );
|
||||
textHTML.push( '</span>' );
|
||||
} else {
|
||||
textHTML.push( '<td width="' + iColWidth + '%" bgcolor="#FFFFFF">' );
|
||||
}
|
||||
textHTML.push( '</td>' );
|
||||
}
|
||||
textHTML.push( '</tr>' );
|
||||
}
|
||||
textHTML.push( '</table>' );
|
||||
textHTML = textHTML.join( "" );
|
||||
tab.innerHTML = textHTML;
|
||||
}
|
||||
|
||||
function over( td, srcPath, posFlag ) {
|
||||
td.style.backgroundColor = "#ACCD3C";
|
||||
$G( 'faceReview' ).style.backgroundImage = "url(" + srcPath + ")";
|
||||
if ( posFlag == 1 ) $G( "tabIconReview" ).className = "show";
|
||||
$G( "tabIconReview" ).style.display = 'block';
|
||||
}
|
||||
|
||||
function out( td ) {
|
||||
td.style.backgroundColor = "transparent";
|
||||
var tabIconRevew = $G( "tabIconReview" );
|
||||
tabIconRevew.className = "";
|
||||
tabIconRevew.style.display = 'none';
|
||||
}
|
||||
|
||||
function createTabList( tabNum ) {
|
||||
var obj = {};
|
||||
for ( var i = 0; i < tabNum; i++ ) {
|
||||
obj["tab" + i] = [];
|
||||
}
|
||||
return obj;
|
||||
}
|
||||
|
||||
function createArr( tabNum ) {
|
||||
var arr = [];
|
||||
for ( var i = 0; i < tabNum; i++ ) {
|
||||
arr[i] = 0;
|
||||
}
|
||||
return arr;
|
||||
}
|
||||
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 43 B |
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue