* finish task #2678.
This commit is contained in:
wangyidong
@@ -0,0 +1,46 @@
|
||||
<?php if($extView = $this->getExtViewFile(__FILE__)){include $extView; return helper::cd();}?>
|
||||
<?php
|
||||
$module = $this->moduleName;
|
||||
$method = $this->methodName;
|
||||
if(!isset($config->$module->markdown->$method)) return;
|
||||
$editor = $config->$module->markdown->$method;
|
||||
$editor['id'] = explode(',', $editor['id']);
|
||||
?>
|
||||
<link rel="stylesheet" href="<?php echo $jsRoot?>markdown/simplemde.min.css" type='text/css' media='screen' />
|
||||
<script type="text/javascript" charset="utf-8" src="<?php echo $jsRoot?>markdown/simplemde.min.js"></script>
|
||||
<style>
|
||||
.CodeMirror{min-height: 150px; height:150px;}
|
||||
</style>
|
||||
|
||||
<script language='javascript'>
|
||||
var markdownEditor = <?php echo json_encode($editor);?>;
|
||||
$(document).ready(initMarkdown);
|
||||
function initMarkdown(afterInit)
|
||||
{
|
||||
$.each(markdownEditor.id, function(key, markdownEditorID)
|
||||
{
|
||||
var options =
|
||||
{
|
||||
element:document.getElementById(markdownEditorID),
|
||||
status: false
|
||||
};
|
||||
if(!window.markdownEditor) window.markdownEditor = {};
|
||||
markdown = new SimpleMDE(options);
|
||||
window.markdownEditor['#'] = window.markdownEditor[markdownEditorID] = markdown;
|
||||
console.log(markdown);
|
||||
markdown.codemirror.on("focus", function()
|
||||
{
|
||||
window.markdownEditor[markdownEditorID].toggleSideBySide();
|
||||
});
|
||||
markdown.codemirror.on("change", function()
|
||||
{
|
||||
if($('#' + markdownEditorID).parent().find('.editor-preview-active-side').size() == 0)
|
||||
{
|
||||
window.markdownEditor[markdownEditorID].toggleSideBySide();
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
if($.isFunction(afterInit)) afterInit();
|
||||
}
|
||||
</script>
|
||||
@@ -16,6 +16,9 @@ $config->doc->editor = new stdclass();
|
||||
$config->doc->editor->create = array('id' => 'content,digest', 'tools' => 'fullTools');
|
||||
$config->doc->editor->edit = array('id' => 'content,digest,comment', 'tools' => 'fullTools');
|
||||
|
||||
$config->doc->markdown = new stdclass();
|
||||
$config->doc->markdown->create = array('id' => 'contentMarkdown,digestMarkdown');
|
||||
|
||||
$config->doc->search['module'] = 'doc';
|
||||
$config->doc->search['fields']['title'] = $lang->doc->title;
|
||||
$config->doc->search['fields']['id'] = $lang->doc->id;
|
||||
|
||||
@@ -336,6 +336,12 @@ class doc extends control
|
||||
$doc = $this->doc->getById($docID);
|
||||
$libID = $doc->lib;
|
||||
|
||||
if($doc->type == 'markdown')
|
||||
{
|
||||
$this->config->doc->markdown->edit = array('id' => 'content,digest');
|
||||
$this->config->doc->editor->edit['id'] = 'comment';
|
||||
}
|
||||
|
||||
$lib = $this->doc->getLibByID($libID);
|
||||
$type = $lib->product ? 'product' : ($lib->project ? 'project' : 'custom');
|
||||
$this->libs = $this->doc->getLibs($type);
|
||||
|
||||
@@ -5,4 +5,18 @@ $(function()
|
||||
{
|
||||
this.ui.setFullScreen(true);
|
||||
});
|
||||
$('#type').change(function()
|
||||
{
|
||||
var type = $(this).val();
|
||||
if(type == 'html')
|
||||
{
|
||||
$('.contenthtml').removeClass('hidden');
|
||||
$('.contentmarkdown').addClass('hidden');
|
||||
}
|
||||
else if(type == 'markdown')
|
||||
{
|
||||
$('.contenthtml').addClass('hidden');
|
||||
$('.contentmarkdown').removeClass('hidden');
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
@@ -1,8 +1,11 @@
|
||||
$(function()
|
||||
{
|
||||
toggleAcl($('#acl').val());
|
||||
window.editor['content'].addListener('focus', function()
|
||||
if(typeof(window.editor['content']) != 'undefined')
|
||||
{
|
||||
this.ui.setFullScreen(true);
|
||||
});
|
||||
window.editor['content'].addListener('focus', function()
|
||||
{
|
||||
this.ui.setFullScreen(true);
|
||||
});
|
||||
}
|
||||
})
|
||||
|
||||
@@ -33,6 +33,7 @@ $lang->doc->basicInfo = '基本信息';
|
||||
$lang->doc->deleted = '已删除';
|
||||
$lang->doc->fileObject = '所属对象';
|
||||
$lang->doc->whiteList = '白名单';
|
||||
$lang->doc->contentType = '文档格式';
|
||||
|
||||
$lang->doc->moduleDoc = '按模块浏览';
|
||||
$lang->doc->searchDoc = '搜索';
|
||||
@@ -71,6 +72,9 @@ $lang->doc->aclList['public'] = '公开';
|
||||
$lang->doc->aclList['custom'] = '自定义';
|
||||
$lang->doc->aclList['private'] = '私有';
|
||||
|
||||
$lang->doc->contentTypeList['html'] = 'HTML';
|
||||
$lang->doc->contentTypeList['markdown'] = 'MarkDown';
|
||||
|
||||
$lang->doc->confirmDelete = "您确定删除该文档吗？";
|
||||
$lang->doc->confirmDeleteLib = "您确定删除该文档库吗？";
|
||||
$lang->doc->errorEditSystemDoc = "系统文档库无需修改。";
|
||||
|
||||
@@ -295,6 +295,7 @@ class docModel extends model
|
||||
->add('version', 1)
|
||||
->setDefault('product,project,module', 0)
|
||||
->stripTags($this->config->doc->editor->create['id'], $this->config->allowedTags)
|
||||
->stripTags($this->config->doc->markdown->create['id'], $this->config->allowedTags)
|
||||
->cleanInt('product,project,module')
|
||||
->join('groups', ',')
|
||||
->join('users', ',')
|
||||
@@ -313,12 +314,15 @@ class docModel extends model
|
||||
|
||||
$docContent = new stdclass();
|
||||
$docContent->title = $doc->title;
|
||||
$docContent->digest = $doc->digest;
|
||||
$docContent->content = $doc->content;
|
||||
$docContent->digest = $doc->type == 'html' ? $doc->digest : $doc->digestMarkdown;
|
||||
$docContent->content = $doc->type == 'html' ? $doc->content : $doc->contentMarkdown;
|
||||
$docContent->type = $doc->type;
|
||||
$docContent->version = 1;
|
||||
$docContent->type = 'html';
|
||||
unset($doc->digest);
|
||||
unset($doc->digestMarkdown);
|
||||
unset($doc->content);
|
||||
unset($doc->contentMarkdown);
|
||||
unset($doc->type);
|
||||
|
||||
$this->dao->insert(TABLE_DOC)->data($doc)->autoCheck()
|
||||
->batchCheck($this->config->doc->create->requiredFields, 'notempty')
|
||||
|
||||
@@ -12,6 +12,7 @@
|
||||
?>
|
||||
<?php include '../../common/view/header.html.php';?>
|
||||
<?php include '../../common/view/ueditor.html.php';?>
|
||||
<?php include '../../common/view/markdown.html.php';?>
|
||||
<?php js::set('holders', $lang->doc->placeholder);?>
|
||||
<?php js::set('type', $type);?>
|
||||
<div class='container mw-1400px'>
|
||||
@@ -25,23 +26,33 @@
|
||||
<table class='table table-form'>
|
||||
<tr>
|
||||
<th class='w-80px'><?php echo $lang->doc->lib;?></th>
|
||||
<td class='w-p25-f'><?php echo html::select('lib', $libs, $libID, "class='form-control chosen' onchange='loadModules(this.value)'");?></td><td></td>
|
||||
<td class='w-400px'><?php echo html::select('lib', $libs, $libID, "class='form-control chosen' onchange='loadModules(this.value)'");?></td><td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th class='w-80px'><?php echo $lang->doc->module;?></th>
|
||||
<td class='w-p25-f'><span id='moduleBox'><?php echo html::select('module', $moduleOptionMenu, $moduleID, "class='form-control chosen'");?></span></td><td></td>
|
||||
<td><span id='moduleBox'><?php echo html::select('module', $moduleOptionMenu, $moduleID, "class='form-control chosen'");?></span></td><td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th><?php echo $lang->doc->title;?></th>
|
||||
<td colspan='2'><?php echo html::input('title', '', "class='form-control'");?></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th><?php echo $lang->doc->contentType;?></th>
|
||||
<td><?php echo html::select('type', $lang->doc->contentTypeList, 'html', "class='form-control'");?></td>
|
||||
</tr>
|
||||
<tr id='contentBox'>
|
||||
<th><?php echo $lang->doc->content;?></th>
|
||||
<td colspan='2'><?php echo html::textarea('content', '', "style='width:100%;height:200px'");?></td>
|
||||
<td colspan='2'>
|
||||
<div class='contenthtml'><?php echo html::textarea('content', '', "style='width:100%;height:200px'");?></div>
|
||||
<div class='contentmarkdown hidden'><?php echo html::textarea('contentMarkdown', '', "style='width:100%;height:200px'");?></div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th><?php echo $lang->doc->digest;?></th>
|
||||
<td colspan='2'><?php echo html::textarea('digest', '', "style='width:100%' rows=3");?></td>
|
||||
<td colspan='2'>
|
||||
<div class='contenthtml'><?php echo html::textarea('digest', '', "style='width:100%' rows=3");?></div>
|
||||
<div class='contentmarkdown hidden'><?php echo html::textarea('digestMarkdown', '', "style='width:100%' rows=3");?></div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th><?php echo $lang->doc->keywords;?></th>
|
||||
|
||||
@@ -12,6 +12,7 @@
|
||||
?>
|
||||
<?php include '../../common/view/header.html.php';?>
|
||||
<?php include '../../common/view/ueditor.html.php';?>
|
||||
<?php if($doc->type == 'markdown') include '../../common/view/markdown.html.php';?>
|
||||
<?php js::set('type', $type)?>
|
||||
<div class='container mw-1400px'>
|
||||
<div id='titlebar'>
|
||||
@@ -25,11 +26,11 @@
|
||||
<table class='table table-form'>
|
||||
<tr>
|
||||
<th class='w-80px'><?php echo $lang->doc->lib;?></th>
|
||||
<td class='w-p25-f'><?php echo html::select('lib', $libs, $doc->lib, "class='form-control chosen' onchange='loadModules(this.value)'");?></td><td></td>
|
||||
<td class='w-400px'><?php echo html::select('lib', $libs, $doc->lib, "class='form-control chosen' onchange='loadModules(this.value)'");?></td><td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th class='w-80px'><?php echo $lang->doc->module;?></th>
|
||||
<td class='w-p25-f'><span id='moduleBox'><?php echo html::select('module', $moduleOptionMenu, $doc->module, "class='form-control chosen'");?></span></td><td></td>
|
||||
<th><?php echo $lang->doc->module;?></th>
|
||||
<td><span id='moduleBox'><?php echo html::select('module', $moduleOptionMenu, $doc->module, "class='form-control chosen'");?></span></td><td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th><?php echo $lang->doc->title;?></th>
|
||||
|
||||
Vendored
+7
File diff suppressed because one or more lines are too long
Vendored
+15
File diff suppressed because one or more lines are too long
@@ -1,681 +0,0 @@
|
||||
@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;
|
||||
}
|
||||
@@ -1,60 +0,0 @@
|
||||
<!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,754 +0,0 @@
|
||||
/**
|
||||
* 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';
|
||||
});
|
||||
|
||||
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.
|
Before Width: | Height: | Size: 923 B |
Binary file not shown.
|
Before Width: | Height: | Size: 841 B |
Binary file not shown.
|
Before Width: | Height: | Size: 1012 B |
Binary file not shown.
|
Before Width: | Height: | Size: 949 B |
Binary file not shown.
|
Before Width: | Height: | Size: 950 B |
Binary file not shown.
|
Before Width: | Height: | Size: 986 B |
Binary file not shown.
|
Before Width: | Height: | Size: 1001 B |
Binary file not shown.
|
Before Width: | Height: | Size: 996 B |
Binary file not shown.
|
Before Width: | Height: | Size: 1001 B |
Binary file not shown.
|
Before Width: | Height: | Size: 1009 B |
Binary file not shown.
|
Before Width: | Height: | Size: 1007 B |
Binary file not shown.
|
Before Width: | Height: | Size: 970 B |
Binary file not shown.
|
Before Width: | Height: | Size: 1005 B |
Binary file not shown.
|
Before Width: | Height: | Size: 1.0 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 3.6 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.7 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 20 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 43 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 453 B |
Binary file not shown.
|
Before Width: | Height: | Size: 2.6 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.6 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.2 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 445 B |
Binary file not shown.
|
Before Width: | Height: | Size: 1.6 KiB |
@@ -1,65 +0,0 @@
|
||||
/*
|
||||
* 图表配置文件
|
||||
* */
|
||||
|
||||
|
||||
//不同类型的配置
|
||||
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 ) +' %';
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
];
|
||||
@@ -1,165 +0,0 @@
|
||||
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;
|
||||
}
|
||||
@@ -1,89 +0,0 @@
|
||||
<!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,519 +0,0 @@
|
||||
/*
|
||||
* 图片转换对话框脚本
|
||||
**/
|
||||
|
||||
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.
|
Before Width: | Height: | Size: 25 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 19 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 22 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 7.6 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 8.1 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 46 KiB |
@@ -1,30 +0,0 @@
|
||||
.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 +0,0 @@
|
||||
<!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 +0,0 @@
|
||||
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,42 +0,0 @@
|
||||
/**
|
||||
* 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>'
|
||||
}
|
||||
];
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 84 B |
Binary file not shown.
|
Before Width: | Height: | Size: 250 B |
Binary file not shown.
|
Before Width: | Height: | Size: 291 B |
Binary file not shown.
|
Before Width: | Height: | Size: 394 B |
Binary file not shown.
|
Before Width: | Height: | Size: 485 B |
Binary file not shown.
|
Before Width: | Height: | Size: 393 B |
@@ -1,18 +0,0 @@
|
||||
.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 +0,0 @@
|
||||
<!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 +0,0 @@
|
||||
/**
|
||||
* 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)
|
||||
|
||||
})();
|
||||
Binary file not shown.
Binary file not shown.
File diff suppressed because it is too large
Load Diff
@@ -1,111 +0,0 @@
|
||||
<!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 +0,0 @@
|
||||
/**
|
||||
* 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");
|
||||
@@ -0,0 +1,104 @@
|
||||
.CodeMirror {
|
||||
line-height: 1em;
|
||||
font-family: monospace;
|
||||
}
|
||||
|
||||
.CodeMirror-scroll {
|
||||
overflow: auto;
|
||||
height: 300px;
|
||||
/* This is needed to prevent an IE[67] bug where the scrolled content
|
||||
is visible outside of the scrolling box. */
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.CodeMirror-gutter {
|
||||
position: absolute; left: 0; top: 0;
|
||||
z-index: 10;
|
||||
background-color: #f7f7f7;
|
||||
border-right: 1px solid #eee;
|
||||
min-width: 2em;
|
||||
height: 100%;
|
||||
}
|
||||
.CodeMirror-gutter-text {
|
||||
color: #aaa;
|
||||
text-align: right;
|
||||
padding: .4em .2em .4em .4em;
|
||||
white-space: pre !important;
|
||||
}
|
||||
.CodeMirror-lines {
|
||||
padding: .4em;
|
||||
}
|
||||
|
||||
.CodeMirror pre {
|
||||
-moz-border-radius: 0;
|
||||
-webkit-border-radius: 0;
|
||||
-o-border-radius: 0;
|
||||
border-radius: 0;
|
||||
border-width: 0; margin: 0; padding: 0; background: transparent;
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
padding: 0; margin: 0;
|
||||
white-space: pre;
|
||||
word-wrap: normal;
|
||||
}
|
||||
|
||||
.CodeMirror-wrap pre {
|
||||
word-wrap: break-word;
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
.CodeMirror-wrap .CodeMirror-scroll {
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
.CodeMirror textarea {
|
||||
outline: none !important;
|
||||
}
|
||||
|
||||
.CodeMirror pre.CodeMirror-cursor {
|
||||
z-index: 10;
|
||||
position: absolute;
|
||||
visibility: hidden;
|
||||
border-left: 1px solid black;
|
||||
}
|
||||
.CodeMirror-focused pre.CodeMirror-cursor {
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
span.CodeMirror-selected { background: #d9d9d9; }
|
||||
.CodeMirror-focused span.CodeMirror-selected { background: #d2dcf8; }
|
||||
|
||||
.CodeMirror-searching {background: #ffa;}
|
||||
|
||||
/* Default theme */
|
||||
|
||||
.cm-s-default span.cm-keyword {color: #708;}
|
||||
.cm-s-default span.cm-atom {color: #219;}
|
||||
.cm-s-default span.cm-number {color: #164;}
|
||||
.cm-s-default span.cm-def {color: #00f;}
|
||||
.cm-s-default span.cm-variable {color: black;}
|
||||
.cm-s-default span.cm-variable-2 {color: #05a;}
|
||||
.cm-s-default span.cm-variable-3 {color: #085;}
|
||||
.cm-s-default span.cm-property {color: black;}
|
||||
.cm-s-default span.cm-operator {color: black;}
|
||||
.cm-s-default span.cm-comment {color: #a50;}
|
||||
.cm-s-default span.cm-string {color: #a11;}
|
||||
.cm-s-default span.cm-string-2 {color: #f50;}
|
||||
.cm-s-default span.cm-meta {color: #555;}
|
||||
.cm-s-default span.cm-error {color: #f00;}
|
||||
.cm-s-default span.cm-qualifier {color: #555;}
|
||||
.cm-s-default span.cm-builtin {color: #30a;}
|
||||
.cm-s-default span.cm-bracket {color: #cc7;}
|
||||
.cm-s-default span.cm-tag {color: #170;}
|
||||
.cm-s-default span.cm-attribute {color: #00c;}
|
||||
.cm-s-default span.cm-header {color: #a0a;}
|
||||
.cm-s-default span.cm-quote {color: #090;}
|
||||
.cm-s-default span.cm-hr {color: #999;}
|
||||
.cm-s-default span.cm-link {color: #00c;}
|
||||
|
||||
span.cm-header, span.cm-strong {font-weight: bold;}
|
||||
span.cm-em {font-style: italic;}
|
||||
span.cm-emstrong {font-style: italic; font-weight: bold;}
|
||||
span.cm-link {text-decoration: underline;}
|
||||
|
||||
div.CodeMirror span.CodeMirror-matchingbracket {color: #0f0;}
|
||||
div.CodeMirror span.CodeMirror-nonmatchingbracket {color: #f22;}
|
||||
+3581
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
Binary file not shown.
@@ -0,0 +1,28 @@
|
||||
.webuploader-container {
|
||||
position: relative;
|
||||
}
|
||||
.webuploader-element-invisible {
|
||||
position: absolute !important;
|
||||
clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
|
||||
clip: rect(1px,1px,1px,1px);
|
||||
}
|
||||
.webuploader-pick {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
background: #00b7ee;
|
||||
padding: 10px 15px;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
border-radius: 3px;
|
||||
overflow: hidden;
|
||||
}
|
||||
.webuploader-pick-hover {
|
||||
background: #00a2d4;
|
||||
}
|
||||
|
||||
.webuploader-pick-disable {
|
||||
opacity: 0.6;
|
||||
pointer-events:none;
|
||||
}
|
||||
|
||||
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 it is too large
Load Diff
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
+6733
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 it is too large
Load Diff
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
Binary file not shown.
Reference in New Issue
Block a user