Authored by 周少峰

Merge branch 'feature/editor' into test6.9.7

... ... @@ -11,6 +11,7 @@
<!--建议手动加在语言,避免在ie下有时因为加载语言失败导致编辑器加载失败-->
<!--这里加载的语言文件会覆盖你在配置项目里添加的语言类型,比如你在配置项目里配置的是英文,这里加载的中文,那最后就是中文-->
<script type="text/javascript" charset="utf-8" src="/pfcms/ueditor/lang/zh-cn/zh-cn.js"></script>
<script charset="utf-8" src="/pfcms/ueditor/ueditor.yoho.js"></script>
<style>
.btn-long {
width: 120px;
... ... @@ -217,7 +218,7 @@
autoFloatEnabled: false,
initialFrameWidth : "90%",
initialFrameHeight : 400,
removeFormatTags:'b,big,code,del,dfn,em,font,i,ins,kbd,q,samp,small,span,strike,strong,sub,sup,tt,u,var,h1,h2,h3,h4,h5',
removeFormatTags:'b,big,code,del,dfn,em,font,i,ins,kbd,q,samp,small,span,strike,sub,sup,tt,u,var',
toolbars: [[
'source', '|', 'undo', 'redo', '|','formatmatch','removeformat',
'bold', 'italic', 'underline','strikethrough','horizontal','|','paragraph', 'rowspacingtop',
... ... @@ -233,6 +234,64 @@
retainOnlyLabelPasted:true,
pasteplain:true,
maximumWords:100000,
filterTxtRules: function () {
function transP(node) {
node.tagName = 'p';
// node.setStyle();
}
return {
//直接删除及其字节点内容
'-': 'script style object iframe embed input select',
'p': {
$: {}
},
'br': {
$: {}
},
'div': {
'$': {}
},
'ol': {
'$': {}
},
'ul': {
'$': {}
},
'li': {
'$': {}
},
'h1': {
'$': {}
},
'h2': {
'$': {}
},
'h3': {
'$': {}
},
'h4': {
'$': {}
},
'h5': {
'$': {}
},
'h6': {
'$': {}
},
'caption': transP,
'th': transP,
'tr': transP,
'td': function(node) {
//没有内容的td直接删掉
var txt = !! node.innerText();
if (txt) {
node.parentNode.insertAfter(UE.uNode.createText(' '), node);
}
node.parentNode.removeChild(node, node.innerText())
}
}
}
});
UE.Editor.prototype._bkGetActionUrl = UE.Editor.prototype.getActionUrl;
UE.Editor.prototype.getActionUrl = function(action) {
... ...
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
</head>
<body>
<table>
<tr>
<td><label for="text"> 文本内容</label></td>
<td><input class="txt" id="text" type="text" disabled="true"/></td>
</tr>
<tr>
<td><label for="href"> 链接类型</var></label></td>
<td>
<select class="form-control observe" id="action" name="action" value="">
<option value="">请选择跳转列表</option>
<option value="go.brand">品牌列表页</option>
<option value="go.productDetail">商品详情页</option>
<option value="go.coupon">优惠券页</option>
<option value="go.fav">收藏列表页</option>
<option value="go.mine">我的页面</option>
<option value="go.list">列表或搜索页</option>
<option value="go.attention">关注页</option>
<option value="go.plus">plus页</option>
<option value="go.star">star页</option>
<option value="go.new">新品到着页</option>
<option value="go.sale">折扣页</option>
<option value="go.share">分享</option>
<option value="go.h5">h5网页</option>
<option value="go.weblogin">h5网页调用本地登录</option>
<option value="go.gender">男女首页</option>
<option value="go.activity">app活动页</option>
<option value="go.home">频道首页</option>
<option value="go.yohood">YOHOOD</option>
<option value="go.top100">热销排行</option>
<option value="go.activitytemplate">活动模板</option>
<option value="go.globalpurchase">全球购</option>
<option value="go.subchannel">二级频道</option>
<option value="go.showgoods">去晒单</option>
<option value="go.limitpurchase">尖货频道</option>
<option value="go.vippro">会员商品</option>
<option value="go.shortsize">断码页</option>
<option value="go.discountmarket">折扣专区</option>
<option value="go.discountmarketpro">折扣专区详情页</option>
<option value="go.signin">签到页</option>
<option value="go.playvideo">视频播放</option>
<option value="go.shop">店铺</option>
<option value="go.outletactivity">奥莱活动详情页</option>
<option value="go.newoutlet">奥莱频道页</option>
<option value="go.category">选择一级品类</option>
<option value="go.comm.postdetail">社区帖子详情页</option>
<option value="go.comm.forum">社区版块首页</option>
<option value="go.comm.h5">社区H5</option>
<option value="go.comm.productDetail">社区商品详情页</option>
<option value="go.videolive">直播详情页</option>
<option value="go.videoreplay">重播详情页</option>
<option value="go.newyohood">new YOHOOD</option>
<option value="go.myInstalment">分期</option>
<option value="go.blkbrandcategory">BLK品牌品类页</option>
<option value="go.findgoodgoods">发现好货</option>
<option value="go.poollist">商品列表页</option>
<option value="go.gallay">xx馆落地页</option>
<option value="go.shopactivity">店铺活动页</option>
<option value="go.newarrivalsingleshop">新品到着单品</option>
<option value="go.blkhome">有货BLK首页</option>
<option value="go.family">有货 !family</option>
<option value="go.vipInfo">会员中心页</option>
<option value="go.vipexclusivepro">会员专享列表</option>
<option value="go.minealliance">联盟</option>
<option value="go.miniapp">跳转到小程序</option>
<option value="go.collagehome">拼团首页</option>
<option value="go.switchchannel">频道切换</option>
<option value="go.mineredpackage">我的红包</option>
<option value="go.ufo">UFO落地页</option>
<option value="go.bargainlist">砍价商品列表</option>
<option value="go.searchlist">搜索结果页</option>
<option value="go.guangchannel">社区</option>
</select>
</td>
</tr>
<tr>
<td><label for="href"> 链接地址</var></label></td>
<td><input class="txt" id="href" type="text" /></td>
</tr>
<tr>
<td><label for="title"> 标题</label></td>
<td><input class="txt" id="title" type="text"/></td>
</tr>
<tr>
<td colspan="2">
<label for="target">新窗口打开</label>
<input id="target" type="checkbox"/>
</td>
</tr>
<tr>
<td colspan="2" id="msg"></td>
</tr>
</table>
<!--页面中一定要引入internal.js为了能直接使用当前打开dialog的实例变量-->
<!--internal.js默认是放到dialogs目录下的-->
<script type="text/javascript" src="../../third-party/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="../internal.js"></script>
<script>
$(function () {
var lang = editor.getLang('link');
var action = $("#action");
var range = editor.selection.getRange(),
link = range.collapsed ? editor.queryCommandValue( "link" ) : editor.selection.getStart(),
url,
trueUrl,
text = $G('text'),
rangeLink = domUtils.findParentByTagName(range.getCommonAncestor(),'a',true),
orgText;
link = domUtils.findParentByTagName( link, "a", true );
if(link){
url = utils.html(link.getAttribute( '_href' ) || link.getAttribute( 'href', 2 ));
if(rangeLink === link && !link.getElementsByTagName('img').length){
text.removeAttribute('disabled');
orgText = text.value = link[browser.ie ? 'innerText':'textContent'];
}else{
text.setAttribute('disabled','true');
text.value = lang.validLink;
}
}else{
if(range.collapsed){
text.removeAttribute('disabled');
text.value = '';
}else{
text.setAttribute('disabled','true');
text.value = lang.validLink;
}
}
console.log("url", url, "action", action);
// url = url+'?openby:yohobuy=' + JSON.stringify({action: action, params: {url: url}});
// yoholink
if (url) {
var urlPart = url.split('?openby:yohobuy=');
if (urlPart.length == 2) {
try {
action.val(JSON.parse(urlPart[1]).action);
trueUrl = urlPart[0];
} catch (err) {
console.log("yoho link err", err);
}
}
}
$G("title").value = url ? link.title : "";
$G("href").value = url && trueUrl ? trueUrl : '';
$G("target").checked = url && link.target == "_blank" ? true : false;
$focus($G("href"));
function handleDialogOk(){
var href =$G('href').value.replace(/^\s+|\s+$/g, '');
if(href){
if(!hrefStartWith(href,["http","/","ftp://",'#'])) {
href = "http://" + href;
}
var obj = {
'href' : href,
'target' : $G("target").checked ? "_blank" : '_self',
'title' : $G("title").value.replace(/^\s+|\s+$/g, ''),
'_href':href
};
//修改链接内容的情况太特殊了,所以先做到这里了
//todo:情况多的时候,做到command里
if(orgText && text.value != orgText){
link[browser.ie ? 'innerText' : 'textContent'] = obj.textValue = text.value;
range.selectNode(link).select()
}
if(range.collapsed){
obj.textValue = text.value;
}
obj._href = obj.href = href+'?openby:yohobuy=' + JSON.stringify({action: action.val(), params: {url: href}});
editor.execCommand('link',utils.clearEmptyAttrs(obj) );
dialog.close();
}
}
dialog.onok = handleDialogOk;
function hrefStartWith(href,arr){
href = href.replace(/^\s+|\s+$/g, '');
for(var i=0,ai;ai=arr[i++];){
if(href.indexOf(ai)==0){
return true;
}
}
return false;
}
})
</script>
</body>
</html>
\ No newline at end of file
... ...
... ... @@ -55,7 +55,7 @@
//语言配置项,默认是zh-cn。有需要的话也可以使用如下这样的方式来自动多语言切换,当然,前提条件是lang文件夹下存在对应的语言文件:
//lang值也可以通过自动获取 (navigator.language||navigator.browserLanguage ||navigator.userLanguage).toLowerCase()
//,lang:"zh-cn"
,lang:"zh-cn"
//,langPath:URL +"lang/"
//主题配置项,默认是default。有需要的话也可以使用如下这样的方式来自动多主题切换,当然,前提条件是themes文件夹下存在对应的主题文件:
... ...
UE.registerUI('yohoLink',function(editor,uiName){
//注册按钮执行时的command命令,使用命令默认就会带有回退操作
editor.registerCommand(uiName,{
execCommand:function(value){
editor.insert(value);
console.log("exeCommand", uiName, "value", value);
}
});
//创建dialog
var dialog = new UE.ui.Dialog({
//指定弹出层中页面的路径,这里只能支持页面,因为跟addCustomizeDialog.js相同目录,所以无需加路径
iframeUrl: UEDITOR_CONFIG.UEDITOR_HOME_URL + 'dialogs/yohoLink/dialogPage.html',
//需要指定当前的编辑器实例
editor:editor,
//指定dialog的名字
name:uiName,
//dialog的标题
title:"yohoLink",
//指定dialog的外围样式
cssRules:"width:600px;height:300px;",
//如果给出了buttons就代表dialog有确定和取消
buttons:[
{
className:'edui-okbutton',
label:'确定',
onclick:function () {
editor.execCommand(uiName);
dialog.close(true);
editor.execCommand(uiName);
}
},
{
className:'edui-cancelbutton',
label:'取消',
onclick:function () {
dialog.close(false);
}
}
]});
var btn = new UE.ui.Button({
name:'dialogbutton' + uiName,
title:'dialogbutton' + uiName,
//需要添加的额外样式,指定icon图标,这里默认使用一个重复的icon
cssRules :'background-position: -500px 0;',
onclick:function () {
//渲染dialog
dialog.render();
dialog.open();
}
});
//当点到编辑内容上时,按钮要做的状态反射
editor.addListener('selectionchange', function () {
var start = editor.selection.getStart();
var text = editor.selection.getText();
// 选中文字或者图片
// if (start.tagName == 'IMG' || text.length > 0) {
// btn.setDisabled(false);
// } else {
// btn.setDisabled(true);
// }
});
return btn;
}/*index 指定添加到工具栏上的那个位置,默认时追加到最后,editorId 指定这个UI是那个编辑器实例上的,默认是页面上所有的编辑器都会添加这个按钮*/);
\ No newline at end of file
... ...