|
|
@ -71638,10 +71638,6 @@ BI.RichEditorParamAction = BI.inherit(BI.RichEditorAction, { |
|
|
|
BI.RichEditorParamAction.superclass._init.apply(this, arguments); |
|
|
|
BI.RichEditorParamAction.superclass._init.apply(this, arguments); |
|
|
|
}, |
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
_isParam: function (sel) { |
|
|
|
|
|
|
|
return sel.attr("data-type") === "param"; |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
_createBlankNode: function () { |
|
|
|
_createBlankNode: function () { |
|
|
|
return $("<span>").html(" "); |
|
|
|
return $("<span>").html(" "); |
|
|
|
}, |
|
|
|
}, |
|
|
@ -71650,10 +71646,8 @@ BI.RichEditorParamAction = BI.inherit(BI.RichEditorAction, { |
|
|
|
var o = this.options; |
|
|
|
var o = this.options; |
|
|
|
var instance = o.editor.selectedInstance; |
|
|
|
var instance = o.editor.selectedInstance; |
|
|
|
var next = $param.next(); |
|
|
|
var next = $param.next(); |
|
|
|
if (next.length === 0 || this._isParam(next)) { |
|
|
|
if (next.length === 0) { |
|
|
|
var preNode = this._createBlankNode(); |
|
|
|
|
|
|
|
var nextNode = this._createBlankNode(); |
|
|
|
var nextNode = this._createBlankNode(); |
|
|
|
$param.before(preNode); |
|
|
|
|
|
|
|
$param.after(nextNode); |
|
|
|
$param.after(nextNode); |
|
|
|
instance.setFocus(nextNode[0]); |
|
|
|
instance.setFocus(nextNode[0]); |
|
|
|
} else { |
|
|
|
} else { |
|
|
@ -71661,70 +71655,131 @@ BI.RichEditorParamAction = BI.inherit(BI.RichEditorAction, { |
|
|
|
} |
|
|
|
} |
|
|
|
}, |
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
_get$Sel: function () { |
|
|
|
|
|
|
|
var o = this.options; |
|
|
|
|
|
|
|
var instance = o.editor.selectedInstance; |
|
|
|
|
|
|
|
var sel = $(instance.selElm()); |
|
|
|
|
|
|
|
if (sel[0].nodeType === 3 && this._isParam(sel.parent())) { |
|
|
|
|
|
|
|
sel = sel.parent(); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
return sel; |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
addParam: function (param) { |
|
|
|
addParam: function (param) { |
|
|
|
var o = this.options; |
|
|
|
var o = this.options; |
|
|
|
var sel = this._get$Sel(); |
|
|
|
var instance = o.editor.instance; |
|
|
|
var $param = $("<span>").attr({ |
|
|
|
var image = new Image(); |
|
|
|
"data-type": "param", |
|
|
|
var canvas = document.createElement("canvas"); |
|
|
|
"data-value": param |
|
|
|
$("body").append(canvas); |
|
|
|
}).css({ |
|
|
|
canvas.width = BI.DOM.getTextSizeWidth(param, 14) + 6; |
|
|
|
color: "white", |
|
|
|
canvas.height = 16; |
|
|
|
backgroundColor: "#009de3", |
|
|
|
var ctx = canvas.getContext("2d"); |
|
|
|
padding: "0 5px" |
|
|
|
ctx.font = "14px Georgia"; |
|
|
|
}).text(param).keydown(function (e) { |
|
|
|
ctx.fillStyle = "#ffffff"; |
|
|
|
if (e.keyCode === BI.KeyCode.BACKSPACE || e.keyCode === BI.KeyCode.DELETE) { |
|
|
|
ctx.fillText(param, 3, 14); |
|
|
|
$param.destroy(); |
|
|
|
image.src = canvas.toDataURL("image/png"); |
|
|
|
} |
|
|
|
image.alt = param; |
|
|
|
e.stopEvent(); |
|
|
|
$(image).css({"background-color": "#3f8ce8", "vertical-align": "sub", "margin": "0 3px;"}); |
|
|
|
return false; |
|
|
|
instance.getElm().element.append(image); |
|
|
|
}); |
|
|
|
this._addBlank($(image)); |
|
|
|
var wrapper = o.editor.instance.getElm().element; |
|
|
|
$(canvas).destroy(); |
|
|
|
if (wrapper.find(sel).length <= 0) { |
|
|
|
|
|
|
|
wrapper.append($param); |
|
|
|
|
|
|
|
} else { |
|
|
|
|
|
|
|
sel.after($param); |
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
this._addBlank($param); |
|
|
|
}); |
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
keydown: function (e) { |
|
|
|
// /**
|
|
|
|
var o = this.options; |
|
|
|
// *
|
|
|
|
var sel = this._get$Sel(); |
|
|
|
// * Created by GUY on 2017/09/18.
|
|
|
|
if (e.keyCode === 229) {// 中文输入法
|
|
|
|
// * @class BI.RichEditorParamAction
|
|
|
|
if (this._isParam(sel)) { |
|
|
|
// * @extends BI.Widget
|
|
|
|
this._addBlank(sel); |
|
|
|
// */
|
|
|
|
e.stopEvent(); |
|
|
|
// BI.RichEditorParamAction = BI.inherit(BI.RichEditorAction, {
|
|
|
|
return false; |
|
|
|
// _defaultConfig: function () {
|
|
|
|
} |
|
|
|
// return BI.extend(BI.RichEditorParamAction.superclass._defaultConfig.apply(this, arguments), {});
|
|
|
|
} |
|
|
|
// },
|
|
|
|
if (BI.Key[e.keyCode] || e.keyCode === BI.KeyCode.TAB || e.keyCode === BI.KeyCode.ENTER || e.keyCode === BI.KeyCode.SPACE) { |
|
|
|
//
|
|
|
|
if (this._isParam(sel)) { |
|
|
|
// _init: function () {
|
|
|
|
e.stopEvent(); |
|
|
|
// BI.RichEditorParamAction.superclass._init.apply(this, arguments);
|
|
|
|
return false; |
|
|
|
// },
|
|
|
|
} |
|
|
|
//
|
|
|
|
} |
|
|
|
// _isParam: function (sel) {
|
|
|
|
if (e.keyCode === BI.KeyCode.BACKSPACE || e.keyCode === BI.KeyCode.DELETE) { |
|
|
|
// return sel.attr("data-type") === "param";
|
|
|
|
if (this._isParam(sel)) { |
|
|
|
// },
|
|
|
|
sel.destroy(); |
|
|
|
//
|
|
|
|
e.preventDefault(); |
|
|
|
// _createBlankNode: function () {
|
|
|
|
return false; |
|
|
|
// return $("<span>").html(" ");
|
|
|
|
} |
|
|
|
// },
|
|
|
|
} |
|
|
|
//
|
|
|
|
}, |
|
|
|
// _addBlank: function ($param) {
|
|
|
|
|
|
|
|
// var o = this.options;
|
|
|
|
|
|
|
|
// var instance = o.editor.selectedInstance;
|
|
|
|
|
|
|
|
// var next = $param.next();
|
|
|
|
|
|
|
|
// if (next.length === 0 || this._isParam(next)) {
|
|
|
|
|
|
|
|
// var preNode = this._createBlankNode();
|
|
|
|
|
|
|
|
// var nextNode = this._createBlankNode();
|
|
|
|
|
|
|
|
// $param.before(preNode);
|
|
|
|
|
|
|
|
// $param.after(nextNode);
|
|
|
|
|
|
|
|
// instance.setFocus(nextNode[0]);
|
|
|
|
|
|
|
|
// } else {
|
|
|
|
|
|
|
|
// instance.setFocus(next[0]);
|
|
|
|
|
|
|
|
// }
|
|
|
|
|
|
|
|
// },
|
|
|
|
|
|
|
|
//
|
|
|
|
|
|
|
|
// _get$Sel: function () {
|
|
|
|
|
|
|
|
// var o = this.options;
|
|
|
|
|
|
|
|
// var instance = o.editor.selectedInstance;
|
|
|
|
|
|
|
|
// var sel = $(instance.selElm());
|
|
|
|
|
|
|
|
// if (sel[0].nodeType === 3 && this._isParam(sel.parent())) {
|
|
|
|
|
|
|
|
// sel = sel.parent();
|
|
|
|
|
|
|
|
// }
|
|
|
|
|
|
|
|
// return sel;
|
|
|
|
|
|
|
|
// },
|
|
|
|
|
|
|
|
//
|
|
|
|
|
|
|
|
// addParam: function (param) {
|
|
|
|
|
|
|
|
// var o = this.options;
|
|
|
|
|
|
|
|
// var sel = this._get$Sel();
|
|
|
|
|
|
|
|
// var $param = $("<span>").attr({
|
|
|
|
|
|
|
|
// "data-type": "param",
|
|
|
|
|
|
|
|
// "data-value": param
|
|
|
|
|
|
|
|
// }).css({
|
|
|
|
|
|
|
|
// color: "white",
|
|
|
|
|
|
|
|
// backgroundColor: "#009de3",
|
|
|
|
|
|
|
|
// padding: "0 5px"
|
|
|
|
|
|
|
|
// }).text(param).keydown(function (e) {
|
|
|
|
|
|
|
|
// if (e.keyCode === BI.KeyCode.BACKSPACE || e.keyCode === BI.KeyCode.DELETE) {
|
|
|
|
|
|
|
|
// $param.destroy();
|
|
|
|
|
|
|
|
// }
|
|
|
|
|
|
|
|
// e.stopEvent();
|
|
|
|
|
|
|
|
// return false;
|
|
|
|
|
|
|
|
// });
|
|
|
|
|
|
|
|
// var wrapper = o.editor.instance.getElm().element;
|
|
|
|
|
|
|
|
// if (wrapper.find(sel).length <= 0) {
|
|
|
|
|
|
|
|
// wrapper.append($param);
|
|
|
|
|
|
|
|
// } else {
|
|
|
|
|
|
|
|
// sel.after($param);
|
|
|
|
|
|
|
|
// }
|
|
|
|
|
|
|
|
// this._addBlank($param);
|
|
|
|
|
|
|
|
// },
|
|
|
|
|
|
|
|
//
|
|
|
|
|
|
|
|
// keydown: function (e) {
|
|
|
|
|
|
|
|
// var o = this.options;
|
|
|
|
|
|
|
|
// var sel = this._get$Sel();
|
|
|
|
|
|
|
|
// if (e.keyCode === 229) {// 中文输入法
|
|
|
|
|
|
|
|
// if (this._isParam(sel)) {
|
|
|
|
|
|
|
|
// this._addBlank(sel);
|
|
|
|
|
|
|
|
// e.stopEvent();
|
|
|
|
|
|
|
|
// return false;
|
|
|
|
|
|
|
|
// }
|
|
|
|
|
|
|
|
// }
|
|
|
|
|
|
|
|
// if (BI.Key[e.keyCode] || e.keyCode === BI.KeyCode.TAB || e.keyCode === BI.KeyCode.ENTER || e.keyCode === BI.KeyCode.SPACE) {
|
|
|
|
|
|
|
|
// if (this._isParam(sel)) {
|
|
|
|
|
|
|
|
// e.stopEvent();
|
|
|
|
|
|
|
|
// return false;
|
|
|
|
|
|
|
|
// }
|
|
|
|
|
|
|
|
// }
|
|
|
|
|
|
|
|
// if (e.keyCode === BI.KeyCode.BACKSPACE || e.keyCode === BI.KeyCode.DELETE) {
|
|
|
|
|
|
|
|
// if (this._isParam(sel)) {
|
|
|
|
|
|
|
|
// sel.destroy();
|
|
|
|
|
|
|
|
// e.preventDefault();
|
|
|
|
|
|
|
|
// return false;
|
|
|
|
|
|
|
|
// }
|
|
|
|
|
|
|
|
// }
|
|
|
|
|
|
|
|
// },
|
|
|
|
|
|
|
|
//
|
|
|
|
|
|
|
|
// key: function (e) {
|
|
|
|
|
|
|
|
// }
|
|
|
|
|
|
|
|
// });
|
|
|
|
|
|
|
|
|
|
|
|
key: function (e) { |
|
|
|
/** |
|
|
|
} |
|
|
|
|
|
|
|
});/** |
|
|
|
|
|
|
|
* 颜色选择 |
|
|
|
* 颜色选择 |
|
|
|
* |
|
|
|
* |
|
|
|
* Created by GUY on 2015/11/26. |
|
|
|
* Created by GUY on 2015/11/26. |
|
|
|