forked from fanruan/fineui
guy
8 years ago
74 changed files with 16726 additions and 34713 deletions
File diff suppressed because one or more lines are too long
@ -0,0 +1,48 @@ |
|||||||
|
Demo.Bubble = BI.inherit(BI.Widget, { |
||||||
|
props: { |
||||||
|
baseCls: "demo-bubble" |
||||||
|
}, |
||||||
|
render: function () { |
||||||
|
var items = [ |
||||||
|
{ |
||||||
|
el: { |
||||||
|
type: 'bi.button', |
||||||
|
text: 'bubble测试', |
||||||
|
height : 30, |
||||||
|
handler: function(){ |
||||||
|
BI.Bubbles.show("singleBubble1", "bubble测试", this); |
||||||
|
} |
||||||
|
} |
||||||
|
}, { |
||||||
|
el: { |
||||||
|
type: 'bi.button', |
||||||
|
text: 'bubble测试(居中显示)', |
||||||
|
height : 30, |
||||||
|
handler: function(){ |
||||||
|
BI.Bubbles.show("singleBubble2", "bubble测试", this, { |
||||||
|
offsetStyle: "center" |
||||||
|
}); |
||||||
|
} |
||||||
|
} |
||||||
|
}, { |
||||||
|
el: { |
||||||
|
type: 'bi.button', |
||||||
|
text: 'bubble测试(右边显示)', |
||||||
|
height : 30, |
||||||
|
handler: function(){ |
||||||
|
BI.Bubbles.show("singleBubble3", "bubble测试", this, { |
||||||
|
offsetStyle: "right" |
||||||
|
}); |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
]; |
||||||
|
return { |
||||||
|
type: "bi.left", |
||||||
|
vgap : 200, |
||||||
|
hgap : 20, |
||||||
|
items: items |
||||||
|
} |
||||||
|
} |
||||||
|
}); |
||||||
|
$.shortcut("demo.bubble", Demo.Bubble); |
@ -1,10 +1,74 @@ |
|||||||
Demo.Button = BI.inherit(BI.Widget, { |
Demo.Button = BI.inherit(BI.Widget, { |
||||||
props: { |
props: { |
||||||
baseCls: "demo-face" |
baseCls: "demo-button" |
||||||
}, |
}, |
||||||
render: function () { |
render: function () { |
||||||
|
var items = [ |
||||||
|
{ |
||||||
|
el: { |
||||||
|
type: 'bi.button', |
||||||
|
text: '一般按钮', |
||||||
|
level: 'common', |
||||||
|
height: 30 |
||||||
|
} |
||||||
|
}, { |
||||||
|
el: { |
||||||
|
type: 'bi.button', |
||||||
|
text: '表示成功状态按钮', |
||||||
|
level: 'success', |
||||||
|
height: 30 |
||||||
|
} |
||||||
|
}, |
||||||
|
{ |
||||||
|
el: { |
||||||
|
type: 'bi.button', |
||||||
|
text: '表示警告状态的按钮', |
||||||
|
level: 'warning', |
||||||
|
height: 30 |
||||||
|
} |
||||||
|
}, { |
||||||
|
el: { |
||||||
|
type: 'bi.button', |
||||||
|
text: '表示忽略状态的按钮', |
||||||
|
level: 'ignore', |
||||||
|
height: 30 |
||||||
|
} |
||||||
|
}, { |
||||||
|
el: { |
||||||
|
type: 'bi.button', |
||||||
|
text: '普通灰化按钮', |
||||||
|
disabled: true, |
||||||
|
level: 'success', |
||||||
|
height: 30 |
||||||
|
} |
||||||
|
}, { |
||||||
|
el: { |
||||||
|
type: 'bi.button', |
||||||
|
text: '忽略状态灰化按钮', |
||||||
|
disabled: true, |
||||||
|
level: 'ignore', |
||||||
|
height: 30 |
||||||
|
} |
||||||
|
}, { |
||||||
|
el: { |
||||||
|
type: 'bi.button', |
||||||
|
text: '带图标的按钮', |
||||||
|
//level: 'ignore',
|
||||||
|
iconClass: "rename-font", |
||||||
|
height: 30 |
||||||
|
} |
||||||
|
} |
||||||
|
]; |
||||||
|
BI.each(items, function (i, item) { |
||||||
|
item.el.handler = function () { |
||||||
|
BI.Msg.alert('按钮', this.options.text); |
||||||
|
} |
||||||
|
}); |
||||||
return { |
return { |
||||||
type: "bi.vertical", |
type: "bi.left", |
||||||
|
vgap: 200, |
||||||
|
hgap: 20, |
||||||
|
items: items |
||||||
} |
} |
||||||
} |
} |
||||||
}); |
}); |
||||||
|
@ -0,0 +1,33 @@ |
|||||||
|
Demo.CodeEditor = BI.inherit(BI.Widget, { |
||||||
|
props: { |
||||||
|
baseCls: "demo-editor" |
||||||
|
}, |
||||||
|
render: function () { |
||||||
|
var editor = BI.createWidget({ |
||||||
|
type: "bi.code_editor", |
||||||
|
cls: "mvc-border", |
||||||
|
width: 600, |
||||||
|
height: 400 |
||||||
|
}); |
||||||
|
BI.createWidget({ |
||||||
|
type: "bi.vertical", |
||||||
|
element: this, |
||||||
|
hgap: 30, |
||||||
|
vgap: 20, |
||||||
|
items: [editor, { |
||||||
|
type: "bi.button", |
||||||
|
text: "getValue", |
||||||
|
handler: function () { |
||||||
|
BI.Msg.toast(JSON.stringify(editor.getValue())); |
||||||
|
} |
||||||
|
}, { |
||||||
|
type: "bi.button", |
||||||
|
text: "setValue", |
||||||
|
handler: function () { |
||||||
|
editor.setValue("测试数据"); |
||||||
|
} |
||||||
|
}] |
||||||
|
}) |
||||||
|
} |
||||||
|
}); |
||||||
|
$.shortcut("demo.code_editor", Demo.CodeEditor); |
@ -0,0 +1,96 @@ |
|||||||
|
Demo.Editor = BI.inherit(BI.Widget, { |
||||||
|
props: { |
||||||
|
baseCls: "demo-editor" |
||||||
|
}, |
||||||
|
render: function () { |
||||||
|
var editor1 = BI.createWidget({ |
||||||
|
type: "bi.editor", |
||||||
|
cls: "mvc-border", |
||||||
|
watermark: "alert信息显示在下面", |
||||||
|
errorText: "字段不可重名!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!", |
||||||
|
width: 200, |
||||||
|
height: 30 |
||||||
|
}); |
||||||
|
editor1.on(BI.Editor.EVENT_ENTER, function () { |
||||||
|
editor1.blur(); |
||||||
|
}); |
||||||
|
var editor2 = BI.createWidget({ |
||||||
|
type: "bi.editor", |
||||||
|
cls: "mvc-border", |
||||||
|
watermark: "输入'a'会有错误信息", |
||||||
|
disabled: true, |
||||||
|
errorText: "字段不可重名", |
||||||
|
validationChecker: function (v) { |
||||||
|
if (v == "a") { |
||||||
|
return false; |
||||||
|
} |
||||||
|
return true; |
||||||
|
}, |
||||||
|
allowBlank: true, |
||||||
|
width: 200, |
||||||
|
height: 30 |
||||||
|
}); |
||||||
|
var editor3 = BI.createWidget({ |
||||||
|
type: "bi.editor", |
||||||
|
cls: "mvc-border", |
||||||
|
watermark: "输入'a'会有错误信息且回车键不能退出编辑", |
||||||
|
errorText: "字段不可重名", |
||||||
|
validationChecker: function (v) { |
||||||
|
if (v == "a") { |
||||||
|
return false; |
||||||
|
} |
||||||
|
return true; |
||||||
|
}, |
||||||
|
quitChecker: function (v) { |
||||||
|
return false; |
||||||
|
}, |
||||||
|
allowBlank: true, |
||||||
|
width: 300, |
||||||
|
height: 30 |
||||||
|
}); |
||||||
|
BI.createWidget({ |
||||||
|
type: "bi.absolute", |
||||||
|
element: this, |
||||||
|
items: [{ |
||||||
|
el: editor1, |
||||||
|
left: 0, |
||||||
|
top: 0 |
||||||
|
}, { |
||||||
|
el: editor2, |
||||||
|
left: 250, |
||||||
|
top: 30 |
||||||
|
}, { |
||||||
|
el: editor3, |
||||||
|
left: 500, |
||||||
|
top: 60 |
||||||
|
}, { |
||||||
|
el: { |
||||||
|
type: "bi.button", |
||||||
|
text: "disable", |
||||||
|
handler: function () { |
||||||
|
editor1.setEnable(false); |
||||||
|
editor2.setEnable(false); |
||||||
|
editor3.setEnable(false); |
||||||
|
}, |
||||||
|
height: 30 |
||||||
|
}, |
||||||
|
left: 100, |
||||||
|
bottom: 60 |
||||||
|
}, { |
||||||
|
el: { |
||||||
|
type: "bi.button", |
||||||
|
text: "enable", |
||||||
|
handler: function () { |
||||||
|
editor1.setEnable(true); |
||||||
|
editor2.setEnable(true); |
||||||
|
editor3.setEnable(true); |
||||||
|
}, |
||||||
|
height: 30 |
||||||
|
}, |
||||||
|
left: 200, |
||||||
|
bottom: 60 |
||||||
|
}] |
||||||
|
}) |
||||||
|
} |
||||||
|
}); |
||||||
|
$.shortcut("demo.editor", Demo.Editor); |
@ -0,0 +1,21 @@ |
|||||||
|
Demo.CodeEditor = BI.inherit(BI.Widget, { |
||||||
|
props: { |
||||||
|
baseCls: "demo-editor" |
||||||
|
}, |
||||||
|
render: function () { |
||||||
|
this.formula = BI.createWidget({ |
||||||
|
type : 'bi.formula_editor', |
||||||
|
width : 300, |
||||||
|
height : 200, |
||||||
|
value : 'SUM(C5, 16, 26)' |
||||||
|
}); |
||||||
|
BI.createWidget({ |
||||||
|
type: "bi.left", |
||||||
|
element: this, |
||||||
|
items: [this.formula], |
||||||
|
hgap: 20, |
||||||
|
vgap: 20 |
||||||
|
}) |
||||||
|
} |
||||||
|
}); |
||||||
|
$.shortcut("demo.formula_editor", Demo.CodeEditor); |
@ -0,0 +1,24 @@ |
|||||||
|
Demo.Button = BI.inherit(BI.Widget, { |
||||||
|
props: { |
||||||
|
baseCls: "demo-button" |
||||||
|
}, |
||||||
|
render: function () { |
||||||
|
var items = [ |
||||||
|
{ |
||||||
|
el: { |
||||||
|
type: 'bi.icon_button', |
||||||
|
cls: "rename-font", |
||||||
|
width: 20, |
||||||
|
height: 20 |
||||||
|
} |
||||||
|
} |
||||||
|
]; |
||||||
|
return { |
||||||
|
type: "bi.left", |
||||||
|
vgap: 200, |
||||||
|
hgap: 20, |
||||||
|
items: items |
||||||
|
} |
||||||
|
} |
||||||
|
}); |
||||||
|
$.shortcut("demo.icon_button", Demo.Button); |
@ -0,0 +1,24 @@ |
|||||||
|
Demo.Button = BI.inherit(BI.Widget, { |
||||||
|
props: { |
||||||
|
baseCls: "demo-button" |
||||||
|
}, |
||||||
|
render: function () { |
||||||
|
var items = [ |
||||||
|
{ |
||||||
|
el: { |
||||||
|
type: 'bi.image_button', |
||||||
|
src: "http://www.easyicon.net/api/resizeApi.php?id=1206741&size=128", |
||||||
|
width: 100, |
||||||
|
height: 100 |
||||||
|
} |
||||||
|
} |
||||||
|
]; |
||||||
|
return { |
||||||
|
type: "bi.left", |
||||||
|
vgap: 200, |
||||||
|
hgap: 20, |
||||||
|
items: items |
||||||
|
} |
||||||
|
} |
||||||
|
}); |
||||||
|
$.shortcut("demo.image_button", Demo.Button); |
@ -0,0 +1,138 @@ |
|||||||
|
Demo.Label = BI.inherit(BI.Widget, { |
||||||
|
props: { |
||||||
|
baseCls: "demo-label" |
||||||
|
}, |
||||||
|
render: function () { |
||||||
|
return { |
||||||
|
type: "bi.vertical", |
||||||
|
items: [{ |
||||||
|
type: "bi.label", |
||||||
|
cls: "layout-bg6", |
||||||
|
text: "这是一个label控件,默认居中", |
||||||
|
textAlign: "center" |
||||||
|
}, { |
||||||
|
type: "bi.label", |
||||||
|
cls: "layout-bg1", |
||||||
|
text: "这是一个label控件, 高度为30,默认居中", |
||||||
|
textAlign: "center", |
||||||
|
height: 30 |
||||||
|
}, { |
||||||
|
type: "bi.label", |
||||||
|
cls: "layout-bg3", |
||||||
|
text: "这是一个label控件,使用水平居左", |
||||||
|
textAlign: "left", |
||||||
|
height: 30 |
||||||
|
}, { |
||||||
|
type: "bi.label", |
||||||
|
cls: "layout-bg2", |
||||||
|
text: "这是一个label控件,whiteSpace是normal,不设置高度,为了演示这个是真的是normal的,我凑点字数,凑点字数,凑点字数,凑点字数,凑点字数,凑点字数,凑点字数", |
||||||
|
whiteSpace: "normal" |
||||||
|
}, { |
||||||
|
type: "bi.label", |
||||||
|
cls: "layout-bg5", |
||||||
|
text: "这是一个label控件,whiteSpace是默认的nowrap,不设置高度,为了演示这个是真的是nowrap的,我凑点字数,凑点字数,凑点字数,凑点字数,凑点字数,凑点字数,凑点字数" |
||||||
|
}, { |
||||||
|
type: "bi.label", |
||||||
|
cls: "layout-bg7", |
||||||
|
text: "这是一个label控件,whiteSpace是默认的nowrap,高度为30,为了演示这个是真的是nowrap的,我凑点字数,凑点字数,凑点字数,凑点字数,凑点字数,凑点字数,凑点字数", |
||||||
|
height: 30 |
||||||
|
}, { |
||||||
|
type: "bi.label", |
||||||
|
cls: "layout-bg3", |
||||||
|
text: "这是一个label控件,whiteSpace设置为normal,高度为60,为了演示这个是真的是normal的,我凑点字数,凑点字数,凑点字数,凑点字数,凑点字数,凑点字数,凑点字数", |
||||||
|
whiteSpace: "normal", |
||||||
|
height: 60 |
||||||
|
}, { |
||||||
|
type: "bi.label", |
||||||
|
cls: "layout-bg5", |
||||||
|
text: "这是一个label控件,whiteSpace设置为normal,textHeight控制text的lineHeight,这样可以实现换行效果,我凑点字数,凑点字数,凑点字数,凑点字数,凑点字数,凑点字数,凑点字数", |
||||||
|
whiteSpace: "normal", |
||||||
|
textHeight: 30, |
||||||
|
height: 60 |
||||||
|
}, { |
||||||
|
type: "bi.label", |
||||||
|
cls: "layout-bg1", |
||||||
|
text: "这是一个label控件,whiteSpace设置为nowrap,textWidth控制text的width", |
||||||
|
textWidth: 200, |
||||||
|
height: 60 |
||||||
|
}, { |
||||||
|
type: "bi.label", |
||||||
|
cls: "layout-bg8", |
||||||
|
text: "这是一个label控件,whiteSpace设置为normal,textWidth控制text的width,这样可以实现换行效果,我凑点字数,凑点字数,凑点字数,凑点字数,凑点字数,凑点字数,凑点字数", |
||||||
|
whiteSpace: "normal", |
||||||
|
textWidth: 200, |
||||||
|
height: 60 |
||||||
|
}, { |
||||||
|
type: "bi.label", |
||||||
|
cls: "layout-bg7", |
||||||
|
text: "whiteSpace为默认的nowrap,高度设置为60,宽度设置为300", |
||||||
|
height: 60, |
||||||
|
width: 300 |
||||||
|
}, { |
||||||
|
type: "bi.label", |
||||||
|
cls: "layout-bg6", |
||||||
|
text: "设置了宽度300,高度60,whiteSpace设置为normal", |
||||||
|
whiteSpace: "normal", |
||||||
|
width: 300, |
||||||
|
height: 60 |
||||||
|
}, { |
||||||
|
type: "bi.label", |
||||||
|
cls: "layout-bg8", |
||||||
|
text: "textWidth设置为200,textHeight设置为30,width设置300,凑点字数看效果", |
||||||
|
width: 300, |
||||||
|
textWidth: 200, |
||||||
|
textHeight: 30, |
||||||
|
height: 60, |
||||||
|
whiteSpace: "normal" |
||||||
|
}, { |
||||||
|
type: "bi.label", |
||||||
|
cls: "layout-bg1", |
||||||
|
text: "textWidth设置为200,width设置300,看下水平居左的换行效果", |
||||||
|
textAlign: "left", |
||||||
|
width: 300, |
||||||
|
textWidth: 200, |
||||||
|
textHeight: 30, |
||||||
|
height: 60, |
||||||
|
whiteSpace: "normal" |
||||||
|
}, { |
||||||
|
type: "bi.label", |
||||||
|
cls: "layout-bg2", |
||||||
|
text: "使用默认的nowrap,再去设置textHeight,只会有一行的效果", |
||||||
|
textAlign: "left", |
||||||
|
width: 300, |
||||||
|
textWidth: 200, |
||||||
|
textHeight: 30, |
||||||
|
height: 60 |
||||||
|
}, { |
||||||
|
type: "bi.left", |
||||||
|
items: [{ |
||||||
|
type: "bi.label", |
||||||
|
cls: "layout-bg3", |
||||||
|
text: "在float布局中自适应的,不设高度和宽度,文字多长这个就有多长" |
||||||
|
}], |
||||||
|
height: 30 |
||||||
|
}, { |
||||||
|
type: "bi.left", |
||||||
|
items: [{ |
||||||
|
type: "bi.label", |
||||||
|
cls: "layout-bg4", |
||||||
|
text: "在float布局中自适应的,设置了宽度200,后面还有", |
||||||
|
width: 200 |
||||||
|
}], |
||||||
|
height: 30 |
||||||
|
}, { |
||||||
|
type: "bi.left", |
||||||
|
items: [{ |
||||||
|
type: "bi.label", |
||||||
|
text: "在float布局中自适应的,设置了高度,文字多长这个就有多长", |
||||||
|
cls: "layout-bg5", |
||||||
|
height: 30 |
||||||
|
}], |
||||||
|
height: 30 |
||||||
|
}], |
||||||
|
hgap: 300, |
||||||
|
vgap: 20 |
||||||
|
} |
||||||
|
} |
||||||
|
}); |
||||||
|
$.shortcut("demo.label", Demo.Label); |
@ -0,0 +1,23 @@ |
|||||||
|
Demo.Message = BI.inherit(BI.Widget, { |
||||||
|
props: { |
||||||
|
baseCls: "demo-bubble" |
||||||
|
}, |
||||||
|
render: function () { |
||||||
|
return { |
||||||
|
type: "bi.center_adapt", |
||||||
|
items : [ |
||||||
|
{ |
||||||
|
el : { |
||||||
|
type : 'bi.button', |
||||||
|
text : '点击我弹出一个消息框', |
||||||
|
height : 30, |
||||||
|
handler : function() { |
||||||
|
BI.Msg.alert('测试消息框', '我是测试消息框的内容'); |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
] |
||||||
|
} |
||||||
|
} |
||||||
|
}); |
||||||
|
$.shortcut("demo.message", Demo.Message); |
@ -0,0 +1,26 @@ |
|||||||
|
Demo.CodeEditor = BI.inherit(BI.Widget, { |
||||||
|
props: { |
||||||
|
baseCls: "demo-editor" |
||||||
|
}, |
||||||
|
render: function () { |
||||||
|
return { |
||||||
|
type: "bi.absolute", |
||||||
|
items: [{ |
||||||
|
el: { |
||||||
|
type: "bi.adaptive", |
||||||
|
cls: "layout-bg1", |
||||||
|
items: [{ |
||||||
|
type: "bi.multifile_editor", |
||||||
|
width: 400, |
||||||
|
height: 300 |
||||||
|
}], |
||||||
|
width: 400, |
||||||
|
height: 300 |
||||||
|
}, |
||||||
|
top: 50, |
||||||
|
left: 50 |
||||||
|
}] |
||||||
|
} |
||||||
|
} |
||||||
|
}); |
||||||
|
$.shortcut("demo.multifile_editor", Demo.CodeEditor); |
@ -0,0 +1,23 @@ |
|||||||
|
Demo.Button = BI.inherit(BI.Widget, { |
||||||
|
props: { |
||||||
|
baseCls: "demo-button" |
||||||
|
}, |
||||||
|
render: function () { |
||||||
|
var items = [ |
||||||
|
{ |
||||||
|
el: { |
||||||
|
type: 'bi.text_button', |
||||||
|
text: '文字按钮', |
||||||
|
height: 30 |
||||||
|
} |
||||||
|
} |
||||||
|
]; |
||||||
|
return { |
||||||
|
type: "bi.left", |
||||||
|
vgap: 200, |
||||||
|
hgap: 20, |
||||||
|
items: items |
||||||
|
} |
||||||
|
} |
||||||
|
}); |
||||||
|
$.shortcut("demo.text_button", Demo.Button); |
@ -0,0 +1,39 @@ |
|||||||
|
Demo.CodeEditor = BI.inherit(BI.Widget, { |
||||||
|
props: { |
||||||
|
baseCls: "demo-editor" |
||||||
|
}, |
||||||
|
render: function () { |
||||||
|
var editor = BI.createWidget({ |
||||||
|
type: "bi.textarea_editor", |
||||||
|
cls: "mvc-border", |
||||||
|
width: 600, |
||||||
|
height: 400 |
||||||
|
}); |
||||||
|
editor.on(BI.TextAreaEditor.EVENT_FOCUS, function () { |
||||||
|
BI.Msg.toast("Focus"); |
||||||
|
}); |
||||||
|
editor.on(BI.TextAreaEditor.EVENT_BLUR, function () { |
||||||
|
BI.Msg.toast("Blur"); |
||||||
|
}); |
||||||
|
BI.createWidget({ |
||||||
|
type: "bi.vertical", |
||||||
|
element: this, |
||||||
|
hgap: 30, |
||||||
|
vgap: 20, |
||||||
|
items: [editor, { |
||||||
|
type: "bi.button", |
||||||
|
text: "getValue", |
||||||
|
handler: function () { |
||||||
|
BI.Msg.toast(JSON.stringify(editor.getValue())); |
||||||
|
} |
||||||
|
}, { |
||||||
|
type: "bi.button", |
||||||
|
text: "setValue", |
||||||
|
handler: function () { |
||||||
|
editor.setValue("测试数据"); |
||||||
|
} |
||||||
|
}] |
||||||
|
}) |
||||||
|
} |
||||||
|
}); |
||||||
|
$.shortcut("demo.textarea_editor", Demo.CodeEditor); |
@ -0,0 +1,39 @@ |
|||||||
|
Demo.Title = BI.inherit(BI.Widget, { |
||||||
|
props: { |
||||||
|
baseCls: "demo-title" |
||||||
|
}, |
||||||
|
render: function () { |
||||||
|
return { |
||||||
|
type: "bi.vertical", |
||||||
|
items: [{ |
||||||
|
type: "bi.label", |
||||||
|
cls: "layout-bg1", |
||||||
|
height: 50, |
||||||
|
title: "title提示", |
||||||
|
text: "移上去有title提示", |
||||||
|
textAlign: "center" |
||||||
|
}, { |
||||||
|
type: "bi.label", |
||||||
|
cls: "layout-bg6", |
||||||
|
height: 50, |
||||||
|
disabled: true, |
||||||
|
warningTitle: "title错误提示", |
||||||
|
text: "移上去有title错误提示", |
||||||
|
textAlign: "center" |
||||||
|
}, { |
||||||
|
type: "bi.label", |
||||||
|
cls: "layout-bg2", |
||||||
|
height: 50, |
||||||
|
disabled: true, |
||||||
|
tipType: "success", |
||||||
|
title: "自定义title提示效果", |
||||||
|
warningTitle: "自定义title提示效果", |
||||||
|
text: "自定义title提示效果", |
||||||
|
textAlign: "center" |
||||||
|
}], |
||||||
|
hgap: 300, |
||||||
|
vgap: 20 |
||||||
|
} |
||||||
|
} |
||||||
|
}); |
||||||
|
$.shortcut("demo.title", Demo.Title); |
@ -0,0 +1,55 @@ |
|||||||
|
Demo.Toast = BI.inherit(BI.Widget, { |
||||||
|
props: { |
||||||
|
baseCls: "demo-toast" |
||||||
|
}, |
||||||
|
render: function () { |
||||||
|
var items = [ |
||||||
|
{ |
||||||
|
el: { |
||||||
|
type: 'bi.button', |
||||||
|
text: '简单Toast测试', |
||||||
|
height : 30, |
||||||
|
handler: function(){ |
||||||
|
BI.Msg.toast("这是一条简单的数据"); |
||||||
|
} |
||||||
|
} |
||||||
|
}, { |
||||||
|
el: { |
||||||
|
type: 'bi.button', |
||||||
|
text: '很长的Toast测试', |
||||||
|
height : 30, |
||||||
|
handler: function(){ |
||||||
|
BI.Msg.toast("这是一条很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长的数据") |
||||||
|
} |
||||||
|
} |
||||||
|
}, { |
||||||
|
el: { |
||||||
|
type: 'bi.button', |
||||||
|
text: '非常长的Toast测试', |
||||||
|
height : 30, |
||||||
|
handler: function(){ |
||||||
|
BI.Msg.toast("这是一条非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长的数据") |
||||||
|
} |
||||||
|
} |
||||||
|
}, { |
||||||
|
el: { |
||||||
|
type: 'bi.button', |
||||||
|
text: '错误提示Toast测试', |
||||||
|
level: "warning", |
||||||
|
height : 30, |
||||||
|
handler: function(){ |
||||||
|
BI.Msg.toast("错误提示Toast测试", "warning"); |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
]; |
||||||
|
BI.createWidget({ |
||||||
|
type: "bi.left", |
||||||
|
element: this, |
||||||
|
vgap : 200, |
||||||
|
hgap : 20, |
||||||
|
items: items |
||||||
|
}) |
||||||
|
} |
||||||
|
}); |
||||||
|
$.shortcut("demo.toast", Demo.Toast); |
@ -1,176 +1,199 @@ |
|||||||
Demo.BASE_CONFIG = [{ |
Demo.BASE_CONFIG = [{ |
||||||
id: 2, |
id: 2, |
||||||
text: "基础控件" |
text: "基础控件", |
||||||
}, { |
open: true, |
||||||
pId: 2, |
|
||||||
id: 5, |
|
||||||
text: "组合" |
|
||||||
}, { |
|
||||||
pId: 2, |
|
||||||
id: 8, |
|
||||||
text: "tree" |
|
||||||
}, { |
|
||||||
pId: 2, |
|
||||||
id: 7, |
|
||||||
text: "button" |
|
||||||
}, { |
|
||||||
pId: 2, |
|
||||||
id: 9, |
|
||||||
text: "listitem" |
|
||||||
}, { |
|
||||||
pId: 2, |
|
||||||
id: 10, |
|
||||||
text: "editor" |
|
||||||
}, { |
|
||||||
pId: 2, |
|
||||||
text: "bi.canvas", |
|
||||||
value: "demo.canvas" |
|
||||||
}, { |
}, { |
||||||
pId: 2, |
pId: 2, |
||||||
text: "bi.label", |
text: "bi.label", |
||||||
value: "demo.label" |
value: "demo.label" |
||||||
}, { |
}, { |
||||||
pId: 2, |
pId: 2, |
||||||
text: "bi.collection", |
text: "title提示", |
||||||
value: "demo.collection" |
value: "demo.title" |
||||||
}, { |
}, { |
||||||
pId: 2, |
pId: 2, |
||||||
text: "bi.farbtastic", |
text: "气泡提示", |
||||||
value: "demo.farbtastic" |
value: "demo.bubble" |
||||||
}, { |
}, { |
||||||
pId: 2, |
pId: 2, |
||||||
text: "bi.formulaeditor", |
text: "toast提示", |
||||||
value: "demo.formulaeditor" |
value: "demo.toast" |
||||||
}, { |
}, { |
||||||
pId: 2, |
pId: 2, |
||||||
text: "bi.message", |
text: "message提示", |
||||||
value: "demo.message" |
value: "demo.message" |
||||||
}, { |
}, { |
||||||
pId: 2, |
pId: 2, |
||||||
text: "bi.grid_view", |
id: 201, |
||||||
value: "demo.grid_view" |
text: "button" |
||||||
}, { |
|
||||||
pId: 2, |
|
||||||
id: 6, |
|
||||||
text: "弹出层" |
|
||||||
}, { |
|
||||||
pId: 2, |
|
||||||
text: "bi.pager", |
|
||||||
value: "demo.pager" |
|
||||||
}, { |
|
||||||
pId: 2, |
|
||||||
text: "bi.svg", |
|
||||||
value: "demo.svg" |
|
||||||
}, { |
|
||||||
pId: 2, |
|
||||||
text: "bi.table", |
|
||||||
value: "demo.table" |
|
||||||
}, { |
|
||||||
pId: 5, |
|
||||||
text: "bi.combo", |
|
||||||
value: "demo.combo" |
|
||||||
}, { |
|
||||||
pId: 5, |
|
||||||
text: "bi.expander", |
|
||||||
value: "demo.expander" |
|
||||||
}, { |
|
||||||
pId: 5, |
|
||||||
text: "bi.group_button", |
|
||||||
value: "demo.group_button" |
|
||||||
}, { |
|
||||||
pId: 5, |
|
||||||
text: "bi.group_combo", |
|
||||||
value: "demo.group_combo" |
|
||||||
}, { |
|
||||||
pId: 5, |
|
||||||
text: "bi.loader", |
|
||||||
value: "demo.loader" |
|
||||||
}, { |
|
||||||
pId: 5, |
|
||||||
text: "bi.navigation", |
|
||||||
value: "demo.navigation" |
|
||||||
}, { |
|
||||||
pId: 5, |
|
||||||
text: "bi.searcher", |
|
||||||
value: "demo.searcher" |
|
||||||
}, { |
|
||||||
pId: 5, |
|
||||||
text: "bi.switcher", |
|
||||||
value: "demo.switcher" |
|
||||||
}, { |
|
||||||
pId: 5, |
|
||||||
text: "bi.tab", |
|
||||||
value: "demo.tab" |
|
||||||
}, { |
|
||||||
pId: 5, |
|
||||||
text: "bi.tree_button", |
|
||||||
value: "demo.tree_button" |
|
||||||
}, { |
|
||||||
pId: 6, |
|
||||||
text: "bi.layer_float_box", |
|
||||||
value: "demo.layer_float_box" |
|
||||||
}, { |
|
||||||
pId: 6, |
|
||||||
text: "bi.layer_popup", |
|
||||||
value: "demo.layer_popup" |
|
||||||
}, { |
|
||||||
pId: 6, |
|
||||||
text: "bi.layer_scroll", |
|
||||||
value: "demo.layer_scroll" |
|
||||||
}, { |
|
||||||
pId: 6, |
|
||||||
text: "bi.layer_searcher", |
|
||||||
value: "demo.layer_searcher" |
|
||||||
}, { |
|
||||||
pId: 7, |
|
||||||
text: "bi.icon_button", |
|
||||||
value: "demo.icon_button" |
|
||||||
}, { |
|
||||||
pId: 7, |
|
||||||
text: "bi.image_button", |
|
||||||
value: "demo.image_button" |
|
||||||
}, { |
}, { |
||||||
pId: 7, |
pId: 201, |
||||||
text: "bi.button", |
text: "bi.button", |
||||||
value: "demo.button" |
value: "demo.button" |
||||||
}, { |
}, { |
||||||
pId: 7, |
pId: 201, |
||||||
text: "bi.text_button", |
text: "bi.text_button", |
||||||
value: "demo.text_button" |
value: "demo.text_button" |
||||||
}, { |
}, { |
||||||
pId: 8, |
pId: 201, |
||||||
text: "bi.treeview", |
text: "bi.icon_button", |
||||||
value: "demo.treeview" |
value: "demo.icon_button" |
||||||
}, { |
|
||||||
pId: 8, |
|
||||||
text: "bi.synctree", |
|
||||||
value: "demo.synctree" |
|
||||||
}, { |
}, { |
||||||
pId: 8, |
pId: 201, |
||||||
text: "bi.parttree", |
text: "bi.image_button", |
||||||
value: "demo.parttree" |
value: "demo.image_button" |
||||||
}, { |
}, { |
||||||
pId: 8, |
pId: 2, |
||||||
text: "bi.customtree", |
id: 202, |
||||||
value: "demo.customtree" |
text: "editor" |
||||||
}, { |
}, { |
||||||
pId: 9, |
pId: 202, |
||||||
text: "bi.list_items", |
text: "bi.editor", |
||||||
value: "demo.list_items" |
value: "demo.editor" |
||||||
}, { |
}, { |
||||||
pId: 10, |
pId: 202, |
||||||
text: "bi.code_editor", |
text: "bi.code_editor", |
||||||
value: "demo.code_editor" |
value: "demo.code_editor" |
||||||
}, { |
}, { |
||||||
pId: 10, |
pId: 202, |
||||||
text: "bi.editor", |
|
||||||
value: "demo.editor" |
|
||||||
}, { |
|
||||||
pId: 10, |
|
||||||
text: "bi.multifile_editor", |
text: "bi.multifile_editor", |
||||||
value: "demo.multifile_editor" |
value: "demo.multifile_editor" |
||||||
}, { |
}, { |
||||||
pId: 10, |
pId: 202, |
||||||
text: "bi.text_area_editor", |
text: "bi.textarea_editor", |
||||||
value: "demo.text_area_editor" |
value: "demo.textarea_editor" |
||||||
}]; |
}, { |
||||||
|
pId: 202, |
||||||
|
text: "bi.formula_editor", |
||||||
|
value: "demo.formula_editor" |
||||||
|
}, |
||||||
|
|
||||||
|
{ |
||||||
|
pId: 2, |
||||||
|
id: 5, |
||||||
|
text: "组合控件" |
||||||
|
}, { |
||||||
|
pId: 2, |
||||||
|
id: 8, |
||||||
|
text: "树控件" |
||||||
|
}, { |
||||||
|
pId: 2, |
||||||
|
id: 7, |
||||||
|
text: "按钮" |
||||||
|
}, { |
||||||
|
pId: 2, |
||||||
|
id: 9, |
||||||
|
text: "listitem" |
||||||
|
}, { |
||||||
|
pId: 2, |
||||||
|
text: "bi.canvas", |
||||||
|
value: "demo.canvas" |
||||||
|
}, { |
||||||
|
pId: 2, |
||||||
|
text: "bi.collection", |
||||||
|
value: "demo.collection" |
||||||
|
}, { |
||||||
|
pId: 2, |
||||||
|
text: "bi.farbtastic", |
||||||
|
value: "demo.farbtastic" |
||||||
|
}, { |
||||||
|
pId: 2, |
||||||
|
text: "bi.message", |
||||||
|
value: "demo.message" |
||||||
|
}, { |
||||||
|
pId: 2, |
||||||
|
text: "bi.grid_view", |
||||||
|
value: "demo.grid_view" |
||||||
|
}, { |
||||||
|
pId: 2, |
||||||
|
id: 6, |
||||||
|
text: "弹出层" |
||||||
|
}, { |
||||||
|
pId: 2, |
||||||
|
text: "bi.pager", |
||||||
|
value: "demo.pager" |
||||||
|
}, { |
||||||
|
pId: 2, |
||||||
|
text: "bi.svg", |
||||||
|
value: "demo.svg" |
||||||
|
}, { |
||||||
|
pId: 2, |
||||||
|
text: "bi.table", |
||||||
|
value: "demo.table" |
||||||
|
}, { |
||||||
|
pId: 5, |
||||||
|
text: "bi.combo", |
||||||
|
value: "demo.combo" |
||||||
|
}, { |
||||||
|
pId: 5, |
||||||
|
text: "bi.expander", |
||||||
|
value: "demo.expander" |
||||||
|
}, { |
||||||
|
pId: 5, |
||||||
|
text: "bi.group_button", |
||||||
|
value: "demo.group_button" |
||||||
|
}, { |
||||||
|
pId: 5, |
||||||
|
text: "bi.group_combo", |
||||||
|
value: "demo.group_combo" |
||||||
|
}, { |
||||||
|
pId: 5, |
||||||
|
text: "bi.loader", |
||||||
|
value: "demo.loader" |
||||||
|
}, { |
||||||
|
pId: 5, |
||||||
|
text: "bi.navigation", |
||||||
|
value: "demo.navigation" |
||||||
|
}, { |
||||||
|
pId: 5, |
||||||
|
text: "bi.searcher", |
||||||
|
value: "demo.searcher" |
||||||
|
}, { |
||||||
|
pId: 5, |
||||||
|
text: "bi.switcher", |
||||||
|
value: "demo.switcher" |
||||||
|
}, { |
||||||
|
pId: 5, |
||||||
|
text: "bi.tab", |
||||||
|
value: "demo.tab" |
||||||
|
}, { |
||||||
|
pId: 5, |
||||||
|
text: "bi.tree_button", |
||||||
|
value: "demo.tree_button" |
||||||
|
}, { |
||||||
|
pId: 6, |
||||||
|
text: "bi.layer_float_box", |
||||||
|
value: "demo.layer_float_box" |
||||||
|
}, { |
||||||
|
pId: 6, |
||||||
|
text: "bi.layer_popup", |
||||||
|
value: "demo.layer_popup" |
||||||
|
}, { |
||||||
|
pId: 6, |
||||||
|
text: "bi.layer_scroll", |
||||||
|
value: "demo.layer_scroll" |
||||||
|
}, { |
||||||
|
pId: 6, |
||||||
|
text: "bi.layer_searcher", |
||||||
|
value: "demo.layer_searcher" |
||||||
|
}, { |
||||||
|
pId: 8, |
||||||
|
text: "bi.treeview", |
||||||
|
value: "demo.treeview" |
||||||
|
}, { |
||||||
|
pId: 8, |
||||||
|
text: "bi.synctree", |
||||||
|
value: "demo.synctree" |
||||||
|
}, { |
||||||
|
pId: 8, |
||||||
|
text: "bi.parttree", |
||||||
|
value: "demo.parttree" |
||||||
|
}, { |
||||||
|
pId: 8, |
||||||
|
text: "bi.customtree", |
||||||
|
value: "demo.customtree" |
||||||
|
}, { |
||||||
|
pId: 9, |
||||||
|
text: "bi.list_items", |
||||||
|
value: "demo.list_items" |
||||||
|
},]; |
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,4 @@ |
|||||||
|
/** |
||||||
|
* Created by User on 2017/3/21. |
||||||
|
*/ |
||||||
|
BI.FormulaCollections = ["abs","ABS","acos","ACOS","acosh","ACOSH","add2array","ADD2ARRAY","and","AND","array","ARRAY","asin","ASIN","asinh","ASINH","atan","ATAN","atan2","ATAN2","atanh","ATANH","average","AVERAGE","bitnot","BITNOT","bitoperation","BITOPERATION","ceiling","CEILING","char","CHAR","circular","CIRCULAR","class","CLASS","cnmoney","CNMONEY","code","CODE","col","COL","colcount","COLCOUNT","colname","COLNAME","combin","COMBIN","concatenate","CONCATENATE","correl","CORREL","cos","COS","cosh","COSH","count","COUNT","crosslayertotal","CROSSLAYERTOTAL","date","DATE","datedelta","DATEDELTA","datedif","DATEDIF","dateinmonth","DATEINMONTH","dateinquarter","DATEINQUARTER","dateinweek","DATEINWEEK","dateinyear","DATEINYEAR","datesubdate","DATESUBDATE","datetime","DATETIME","datetonumber","DATETONUMBER","day","DAY","days360","DAYS360","daysofmonth","DAYSOFMONTH","daysofquarter","DAYSOFQUARTER","daysofyear","DAYSOFYEAR","dayvalue","DAYVALUE","decimal","DECIMAL","decode","DECODE","degrees","DEGREES","encode","ENCODE","endwith","ENDWITH","enmoney","ENMONEY","ennumber","ENNUMBER","eval","EVAL","even","EVEN","exact","EXACT","exp","EXP","fact","FACT","fields","FIELDS","filename","FILENAME","filesize","FILESIZE","filetype","FILETYPE","find","FIND","floor","FLOOR","format","FORMAT","getuserdepartments","GETUSERDEPARTMENTS","getuserjobtitles","GETUSERJOBTITLES","greparray","GREPARRAY","hierarchy","HIERARCHY","hour","HOUR","i18n","I18N","if","IF","inarray","INARRAY","index","INDEX","indexof","INDEXOF","indexofarray","INDEXOFARRAY","int","INT","isnull","ISNULL","joinarray","JOINARRAY","jvm","JVM","layertotal","LAYERTOTAL","left","LEFT","len","LEN","let","LET","ln","LN","log","LOG","log10","LOG10","lower","LOWER","lunar","LUNAR","map","MAP","maparray","MAPARRAY","max","MAX","median","MEDIAN","mid","MID","min","MIN","minute","MINUTE","mod","MOD","mom","MOM","month","MONTH","monthdelta","MONTHDELTA","now","NOW","numto","NUMTO","nvl","NVL","odd","ODD","or","OR","pi","PI","power","POWER","product","PRODUCT","promotion","PROMOTION","proper","PROPER","proportion","PROPORTION","radians","RADIANS","rand","RAND","randbetween","RANDBETWEEN","range","RANGE","rank","RANK","records","RECORDS","regexp","REGEXP","removearray","REMOVEARRAY","repeat","REPEAT","replace","REPLACE","reverse","REVERSE","reversearray","REVERSEARRAY","right","RIGHT","round","ROUND","round5","ROUND5","rounddown","ROUNDDOWN","roundup","ROUNDUP","row","ROW","rowcount","ROWCOUNT","second","SECOND","seq","SEQ","sign","SIGN","sin","SIN","sinh","SINH","slicearray","SLICEARRAY","sort","SORT","sortarray","SORTARRAY","split","SPLIT","sql","SQL","sqrt","SQRT","startwith","STARTWITH","stdev","STDEV","substitute","SUBSTITUTE","sum","SUM","sumsq","SUMSQ","switch","SWITCH","tabledatafields","TABLEDATAFIELDS","tabledatas","TABLEDATAS","tables","TABLES","tan","TAN","tanh","TANH","time","TIME","tobigdecimal","TOBIGDECIMAL","tobinary","TOBINARY","todate","TODATE","today","TODAY","todouble","TODOUBLE","tohex","TOHEX","toimage","TOIMAGE","tointeger","TOINTEGER","tooctal","TOOCTAL","totext","TOTEXT","treelayer","TREELAYER","trim","TRIM","trunc","TRUNC","uniquearray","UNIQUEARRAY","upper","UPPER","uuid","UUID","value","VALUE","webimage","WEBIMAGE","week","WEEK","weekdate","WEEKDATE","weekday","WEEKDAY","weightedaverage","WEIGHTEDAVERAGE","year","YEAR","yeardelta","YEARDELTA"]; |
@ -1,235 +1,232 @@ |
|||||||
; |
/** |
||||||
(function ($) { |
* 公式编辑控件 |
||||||
/** |
* @class BI.FormulaEditor |
||||||
* 公式编辑控件 |
* @extends BI.Widget |
||||||
* @class BI.FormulaEditor |
*/ |
||||||
* @extends BI.Widget |
BI.FormulaEditor = BI.inherit(BI.Single, { |
||||||
*/ |
_defaultConfig: function () { |
||||||
BI.FormulaEditor = BI.inherit(BI.Single, { |
return $.extend(BI.FormulaEditor.superclass._defaultConfig.apply(), { |
||||||
_defaultConfig: function () { |
baseCls: 'bi-formula-editor', |
||||||
return $.extend(BI.FormulaEditor.superclass._defaultConfig.apply(), { |
watermark: '', |
||||||
baseCls: 'bi-formula-editor', |
value: '', |
||||||
watermark: '', |
fieldTextValueMap: {}, |
||||||
value: '', |
showHint: true |
||||||
fieldTextValueMap: {}, |
}); |
||||||
showHint: true |
}, |
||||||
}); |
_init: function () { |
||||||
}, |
BI.FormulaEditor.superclass._init.apply(this, arguments); |
||||||
_init: function () { |
var o = this.options, self = this; |
||||||
BI.FormulaEditor.superclass._init.apply(this, arguments); |
this.editor = CodeMirror(this.element[0], { |
||||||
var o = this.options, self = this; |
textWrapping: true, |
||||||
this.editor = CodeMirror(this.element[0], { |
lineWrapping: true, |
||||||
textWrapping: true, |
lineNumbers: false, |
||||||
lineWrapping: true, |
mode: 'formula' |
||||||
lineNumbers: false, |
}); |
||||||
mode: 'formula' |
this.editor.on("change", function (cm, change) { |
||||||
}); |
self._checkWaterMark(); |
||||||
this.editor.on("change", function (cm, change) { |
if (o.showHint) { |
||||||
self._checkWaterMark(); |
CodeMirror.showHint(cm, CodeMirror.formulaHint, {completeSingle: false}); |
||||||
if(o.showHint){ |
} |
||||||
CodeMirror.showHint(cm, CodeMirror.formulaHint, {completeSingle: false}); |
BI.nextTick(function () { |
||||||
} |
self.fireEvent(BI.FormulaEditor.EVENT_CHANGE) |
||||||
BI.nextTick(function () { |
|
||||||
self.fireEvent(BI.FormulaEditor.EVENT_CHANGE) |
|
||||||
}); |
|
||||||
}); |
}); |
||||||
|
}); |
||||||
|
|
||||||
this.editor.on("focus", function () { |
this.editor.on("focus", function () { |
||||||
self._checkWaterMark(); |
self._checkWaterMark(); |
||||||
self.fireEvent(BI.FormulaEditor.EVENT_FOCUS); |
self.fireEvent(BI.FormulaEditor.EVENT_FOCUS); |
||||||
}); |
}); |
||||||
|
|
||||||
this.editor.on("blur", function () { |
this.editor.on("blur", function () { |
||||||
self.fireEvent(BI.FormulaEditor.EVENT_BLUR); |
self.fireEvent(BI.FormulaEditor.EVENT_BLUR); |
||||||
}); |
}); |
||||||
|
|
||||||
|
|
||||||
if (BI.isKey(o.value)) { |
if (BI.isKey(o.value)) { |
||||||
self.setValue(o.value); |
self.setValue(o.value); |
||||||
} |
} |
||||||
|
|
||||||
|
if (BI.isKey(this.options.watermark)) { |
||||||
|
var self = this; |
||||||
|
this.watermark = BI.createWidget({ |
||||||
|
type: "bi.label", |
||||||
|
cls: "bi-water-mark", |
||||||
|
text: this.options.watermark, |
||||||
|
whiteSpace: "nowrap", |
||||||
|
textAlign: "left" |
||||||
|
}); |
||||||
|
BI.createWidget({ |
||||||
|
type: "bi.absolute", |
||||||
|
element: self, |
||||||
|
items: [{ |
||||||
|
el: self.watermark, |
||||||
|
left: 0, |
||||||
|
top: 0 |
||||||
|
}] |
||||||
|
}); |
||||||
|
|
||||||
if (BI.isKey(this.options.watermark)) { |
this.watermark.element.bind( |
||||||
var self = this; |
"mousedown", function (e) { |
||||||
this.watermark = BI.createWidget({ |
self.insertString(""); |
||||||
type: "bi.label", |
|
||||||
cls: "bi-water-mark", |
|
||||||
text: this.options.watermark, |
|
||||||
whiteSpace: "nowrap", |
|
||||||
textAlign: "left" |
|
||||||
}); |
|
||||||
BI.createWidget({ |
|
||||||
type: "bi.absolute", |
|
||||||
element: self, |
|
||||||
items: [{ |
|
||||||
el: self.watermark, |
|
||||||
left: 0, |
|
||||||
top: 0 |
|
||||||
}] |
|
||||||
}); |
|
||||||
|
|
||||||
this.watermark.element.bind( |
|
||||||
"mousedown", function (e) { |
|
||||||
self.insertString(""); |
|
||||||
self.editor.focus(); |
|
||||||
e.stopEvent(); |
|
||||||
} |
|
||||||
); |
|
||||||
this.watermark.element.bind("click", function (e) { |
|
||||||
self.editor.focus(); |
self.editor.focus(); |
||||||
e.stopEvent(); |
e.stopEvent(); |
||||||
}); |
} |
||||||
this.watermark.element.css({ |
); |
||||||
position: "absolute", |
this.watermark.element.bind("click", function (e) { |
||||||
left: 3, |
self.editor.focus(); |
||||||
right: 3, |
e.stopEvent(); |
||||||
top: 6, |
|
||||||
bottom: 0 |
|
||||||
}); |
|
||||||
} |
|
||||||
}, |
|
||||||
|
|
||||||
_checkWaterMark: function () { |
|
||||||
var o = this.options; |
|
||||||
if (!this.disabledWarterMark && BI.isEmptyString(this.editor.getValue()) && BI.isKey(o.watermark)) { |
|
||||||
this.watermark && this.watermark.visible(); |
|
||||||
} else { |
|
||||||
this.watermark && this.watermark.invisible(); |
|
||||||
} |
|
||||||
}, |
|
||||||
|
|
||||||
disableWarterMark: function () { |
|
||||||
this.disabledWarterMark = true; |
|
||||||
this._checkWaterMark(); |
|
||||||
}, |
|
||||||
|
|
||||||
focus: function() { |
|
||||||
this.editor.focus(); |
|
||||||
}, |
|
||||||
|
|
||||||
/** |
|
||||||
* 添加字段 |
|
||||||
* @param field |
|
||||||
*/ |
|
||||||
insertField: function (field) { |
|
||||||
var from = this.editor.getCursor(); |
|
||||||
this.editor.replaceSelection(field); |
|
||||||
var to = this.editor.getCursor(); |
|
||||||
this.editor.markText(from, to, {className: 'fieldName', atomic: true, startStyle : "start", endStyle:"end"}); |
|
||||||
this.editor.replaceSelection(" "); |
|
||||||
this.editor.focus(); |
|
||||||
}, |
|
||||||
|
|
||||||
insertFunction: function (fn) { |
|
||||||
var from = this.editor.getCursor(); |
|
||||||
this.editor.replaceSelection(fn); |
|
||||||
var to = this.editor.getCursor(); |
|
||||||
this.editor.markText(from, to, {className: "#function", atomic: true}); |
|
||||||
this.editor.replaceSelection("() "); |
|
||||||
to = this.editor.getCursor(); |
|
||||||
to.ch = to.ch - 2; |
|
||||||
this.editor.setCursor(to); |
|
||||||
this.editor.focus(); |
|
||||||
}, |
|
||||||
insertOperator: function (op) { |
|
||||||
var from = this.editor.getCursor(); |
|
||||||
this.editor.replaceSelection(op); |
|
||||||
var to = this.editor.getCursor(); |
|
||||||
this.editor.markText(from, to, {className: "%operator", atomic: true}); |
|
||||||
this.editor.replaceSelection(" "); |
|
||||||
this.editor.focus(); |
|
||||||
}, |
|
||||||
|
|
||||||
setFunction: function (v) { |
|
||||||
var from = this.editor.getCursor(); |
|
||||||
this.editor.replaceSelection(v); |
|
||||||
var to = this.editor.getCursor(); |
|
||||||
this.editor.markText(from, to, {className: "#function", atomic: true}); |
|
||||||
}, |
|
||||||
|
|
||||||
insertString: function (str) { |
|
||||||
this.editor.replaceSelection(str); |
|
||||||
this.editor.focus(); |
|
||||||
}, |
|
||||||
|
|
||||||
getFormulaString: function () { |
|
||||||
return this.editor.getValue(); |
|
||||||
}, |
|
||||||
|
|
||||||
getUsedFields: function () { |
|
||||||
var fieldMap = this.options.fieldTextValueMap; |
|
||||||
var fields = []; |
|
||||||
this.editor.getValue(true, function (line) { |
|
||||||
var value = line.text; |
|
||||||
_.forEach(line.markedSpans, function (i, ms) { |
|
||||||
switch (i.marker.className) { |
|
||||||
case "fieldName": |
|
||||||
var dId = fieldMap[value.substr(i.from, i.to - i.from)]; |
|
||||||
if (!fields.contains(dId)) { |
|
||||||
fields.push(dId); |
|
||||||
} |
|
||||||
|
|
||||||
} |
|
||||||
}); |
|
||||||
}); |
|
||||||
return fields; |
|
||||||
}, |
|
||||||
|
|
||||||
getCheckString: function () { |
|
||||||
return this.editor.getValue(true, function (line) { |
|
||||||
var rawText = line.text, value = line.text, num = 0; |
|
||||||
value.text = rawText; |
|
||||||
_.forEach(line.markedSpans, function (i, ms) { |
|
||||||
|
|
||||||
switch (i.marker.className) { |
|
||||||
case "fieldName": |
|
||||||
var fieldNameLength = i.to - i.from; |
|
||||||
value = value.substr(0, i.from + num) + "$a" + value.substr(i.to + num, value.length); |
|
||||||
num = num + 2 - fieldNameLength; |
|
||||||
break; |
|
||||||
} |
|
||||||
|
|
||||||
}); |
|
||||||
return value; |
|
||||||
}); |
}); |
||||||
}, |
this.watermark.element.css({ |
||||||
|
position: "absolute", |
||||||
getValue: function () { |
left: 3, |
||||||
var fieldMap = this.options.fieldTextValueMap; |
right: 3, |
||||||
return this.editor.getValue("\n", function (line) { |
top: 6, |
||||||
var rawText = line.text, value = line.text, num = 0; |
bottom: 0 |
||||||
value.text = rawText; |
|
||||||
_.forEach(line.markedSpans, function (i, ms) { |
|
||||||
switch (i.marker.className) { |
|
||||||
case "fieldName": |
|
||||||
var fieldNameLength = i.to - i.from; |
|
||||||
var fieldId = fieldMap[value.substr(i.from + num, fieldNameLength)]; |
|
||||||
value = value.substr(0, i.from + num) + "$\{" + fieldMap[value.substr(i.from + num, fieldNameLength)] + "\}" + value.substr(i.to + num, value.length); |
|
||||||
num += fieldId.length - fieldNameLength + 3; |
|
||||||
break; |
|
||||||
} |
|
||||||
}); |
|
||||||
return value; |
|
||||||
}); |
}); |
||||||
}, |
} |
||||||
|
}, |
||||||
|
|
||||||
|
_checkWaterMark: function () { |
||||||
|
var o = this.options; |
||||||
|
if (!this.disabledWarterMark && BI.isEmptyString(this.editor.getValue()) && BI.isKey(o.watermark)) { |
||||||
|
this.watermark && this.watermark.visible(); |
||||||
|
} else { |
||||||
|
this.watermark && this.watermark.invisible(); |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
setValue: function (value) { |
disableWarterMark: function () { |
||||||
this.editor.setValue(value); |
this.disabledWarterMark = true; |
||||||
}, |
this._checkWaterMark(); |
||||||
|
}, |
||||||
|
|
||||||
setFieldTextValueMap: function (fieldTextValueMap) { |
focus: function () { |
||||||
this.options.fieldTextValueMap = fieldTextValueMap; |
this.editor.focus(); |
||||||
}, |
}, |
||||||
|
|
||||||
refresh: function () { |
/** |
||||||
var self = this; |
* 添加字段 |
||||||
BI.nextTick(function () { |
* @param field |
||||||
self.editor.refresh(); |
*/ |
||||||
|
insertField: function (field) { |
||||||
|
var from = this.editor.getCursor(); |
||||||
|
this.editor.replaceSelection(field); |
||||||
|
var to = this.editor.getCursor(); |
||||||
|
this.editor.markText(from, to, {className: 'fieldName', atomic: true, startStyle: "start", endStyle: "end"}); |
||||||
|
this.editor.replaceSelection(" "); |
||||||
|
this.editor.focus(); |
||||||
|
}, |
||||||
|
|
||||||
|
insertFunction: function (fn) { |
||||||
|
var from = this.editor.getCursor(); |
||||||
|
this.editor.replaceSelection(fn); |
||||||
|
var to = this.editor.getCursor(); |
||||||
|
this.editor.markText(from, to, {className: "#function", atomic: true}); |
||||||
|
this.editor.replaceSelection("() "); |
||||||
|
to = this.editor.getCursor(); |
||||||
|
to.ch = to.ch - 2; |
||||||
|
this.editor.setCursor(to); |
||||||
|
this.editor.focus(); |
||||||
|
}, |
||||||
|
insertOperator: function (op) { |
||||||
|
var from = this.editor.getCursor(); |
||||||
|
this.editor.replaceSelection(op); |
||||||
|
var to = this.editor.getCursor(); |
||||||
|
this.editor.markText(from, to, {className: "%operator", atomic: true}); |
||||||
|
this.editor.replaceSelection(" "); |
||||||
|
this.editor.focus(); |
||||||
|
}, |
||||||
|
|
||||||
|
setFunction: function (v) { |
||||||
|
var from = this.editor.getCursor(); |
||||||
|
this.editor.replaceSelection(v); |
||||||
|
var to = this.editor.getCursor(); |
||||||
|
this.editor.markText(from, to, {className: "#function", atomic: true}); |
||||||
|
}, |
||||||
|
|
||||||
|
insertString: function (str) { |
||||||
|
this.editor.replaceSelection(str); |
||||||
|
this.editor.focus(); |
||||||
|
}, |
||||||
|
|
||||||
|
getFormulaString: function () { |
||||||
|
return this.editor.getValue(); |
||||||
|
}, |
||||||
|
|
||||||
|
getUsedFields: function () { |
||||||
|
var fieldMap = this.options.fieldTextValueMap; |
||||||
|
var fields = []; |
||||||
|
this.editor.getValue(true, function (line) { |
||||||
|
var value = line.text; |
||||||
|
_.forEach(line.markedSpans, function (i, ms) { |
||||||
|
switch (i.marker.className) { |
||||||
|
case "fieldName": |
||||||
|
var dId = fieldMap[value.substr(i.from, i.to - i.from)]; |
||||||
|
if (!fields.contains(dId)) { |
||||||
|
fields.push(dId); |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
}); |
}); |
||||||
} |
}); |
||||||
|
return fields; |
||||||
|
}, |
||||||
|
|
||||||
|
getCheckString: function () { |
||||||
|
return this.editor.getValue(true, function (line) { |
||||||
|
var rawText = line.text, value = line.text, num = 0; |
||||||
|
value.text = rawText; |
||||||
|
_.forEach(line.markedSpans, function (i, ms) { |
||||||
|
|
||||||
|
switch (i.marker.className) { |
||||||
|
case "fieldName": |
||||||
|
var fieldNameLength = i.to - i.from; |
||||||
|
value = value.substr(0, i.from + num) + "$a" + value.substr(i.to + num, value.length); |
||||||
|
num = num + 2 - fieldNameLength; |
||||||
|
break; |
||||||
|
} |
||||||
|
|
||||||
}); |
}); |
||||||
BI.FormulaEditor.EVENT_CHANGE = "EVENT_CHANGE"; |
return value; |
||||||
BI.FormulaEditor.EVENT_BLUR = "EVENT_BLUR"; |
}); |
||||||
BI.FormulaEditor.EVENT_FOCUS = "EVENT_FOCUS"; |
}, |
||||||
$.shortcut("bi.formula", BI.FormulaEditor); |
|
||||||
})(jQuery); |
getValue: function () { |
||||||
|
var fieldMap = this.options.fieldTextValueMap; |
||||||
|
return this.editor.getValue("\n", function (line) { |
||||||
|
var rawText = line.text, value = line.text, num = 0; |
||||||
|
value.text = rawText; |
||||||
|
_.forEach(line.markedSpans, function (i, ms) { |
||||||
|
switch (i.marker.className) { |
||||||
|
case "fieldName": |
||||||
|
var fieldNameLength = i.to - i.from; |
||||||
|
var fieldId = fieldMap[value.substr(i.from + num, fieldNameLength)]; |
||||||
|
value = value.substr(0, i.from + num) + "$\{" + fieldMap[value.substr(i.from + num, fieldNameLength)] + "\}" + value.substr(i.to + num, value.length); |
||||||
|
num += fieldId.length - fieldNameLength + 3; |
||||||
|
break; |
||||||
|
} |
||||||
|
}); |
||||||
|
return value; |
||||||
|
}); |
||||||
|
}, |
||||||
|
|
||||||
|
setValue: function (value) { |
||||||
|
this.editor.setValue(value); |
||||||
|
}, |
||||||
|
|
||||||
|
setFieldTextValueMap: function (fieldTextValueMap) { |
||||||
|
this.options.fieldTextValueMap = fieldTextValueMap; |
||||||
|
}, |
||||||
|
|
||||||
|
refresh: function () { |
||||||
|
var self = this; |
||||||
|
BI.nextTick(function () { |
||||||
|
self.editor.refresh(); |
||||||
|
}); |
||||||
|
} |
||||||
|
|
||||||
|
}); |
||||||
|
BI.FormulaEditor.EVENT_CHANGE = "EVENT_CHANGE"; |
||||||
|
BI.FormulaEditor.EVENT_BLUR = "EVENT_BLUR"; |
||||||
|
BI.FormulaEditor.EVENT_FOCUS = "EVENT_FOCUS"; |
||||||
|
$.shortcut("bi.formula_editor", BI.FormulaEditor); |
||||||
|
@ -1,88 +0,0 @@ |
|||||||
(function (mod) { |
|
||||||
mod(CodeMirror); |
|
||||||
})(function (CodeMirror) { |
|
||||||
var Pos = CodeMirror.Pos; |
|
||||||
|
|
||||||
function forEach(arr, f) { |
|
||||||
for (var i = 0, e = arr.length; i < e; ++i) f(arr[i]); |
|
||||||
} |
|
||||||
|
|
||||||
function arrayContains(arr, item) { |
|
||||||
if (!Array.prototype.indexOf) { |
|
||||||
var i = arr.length; |
|
||||||
while (i--) { |
|
||||||
if (arr[i] === item) { |
|
||||||
return true; |
|
||||||
} |
|
||||||
} |
|
||||||
return false; |
|
||||||
} |
|
||||||
return arr.indexOf(item) != -1; |
|
||||||
} |
|
||||||
|
|
||||||
function scriptHint(editor, keywords, getToken, options) { |
|
||||||
// Find the token at the cursor
|
|
||||||
var cur = editor.getCursor(), token = getToken(editor, cur); |
|
||||||
if (/\b(?:string)\b/.test(token.type)) { |
|
||||||
return; |
|
||||||
} |
|
||||||
token.state = CodeMirror.innerMode(editor.getMode(), token.state).state; |
|
||||||
|
|
||||||
if (!/^[\w$_]*$/.test(token.string)) { |
|
||||||
token = { |
|
||||||
start: cur.ch, end: cur.ch, string: "", state: token.state, |
|
||||||
type: token.string == "." ? "property" : null |
|
||||||
}; |
|
||||||
} else if (token.end > cur.ch) { |
|
||||||
token.end = cur.ch; |
|
||||||
token.string = token.string.slice(0, cur.ch - token.start); |
|
||||||
} |
|
||||||
|
|
||||||
var tprop = token; |
|
||||||
// If it is a property, find out what it is a property of.
|
|
||||||
while (tprop.type == "property") { |
|
||||||
tprop = getToken(editor, Pos(cur.line, tprop.start)); |
|
||||||
if (tprop.string != ".") return; |
|
||||||
tprop = getToken(editor, Pos(cur.line, tprop.start)); |
|
||||||
if (!context) var context = []; |
|
||||||
context.push(tprop); |
|
||||||
} |
|
||||||
return { |
|
||||||
list: getCompletions(token, context, keywords, options), |
|
||||||
from: Pos(cur.line, token.start), |
|
||||||
to: Pos(cur.line, token.end) |
|
||||||
}; |
|
||||||
} |
|
||||||
|
|
||||||
function getFormulaKeywords() { |
|
||||||
return FormulaCollections; |
|
||||||
} |
|
||||||
|
|
||||||
function formulaHint(editor, options) { |
|
||||||
return scriptHint(editor, getFormulaKeywords(), |
|
||||||
function (e, cur) { |
|
||||||
return e.getTokenAt(cur); |
|
||||||
}, |
|
||||||
options); |
|
||||||
}; |
|
||||||
CodeMirror.registerHelper("hint", "formula", formulaHint); |
|
||||||
|
|
||||||
function getCompletions(token, context, keywords, options) { |
|
||||||
var found = [], start = token.string; |
|
||||||
if (!start) { |
|
||||||
return found; |
|
||||||
} |
|
||||||
function maybeAdd(str) { |
|
||||||
if (str.lastIndexOf(start, 0) == 0 && !arrayContains(found, str)) { |
|
||||||
found.push(str); |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
if (context && context.length) { |
|
||||||
context.pop(); |
|
||||||
} else { |
|
||||||
forEach(keywords, maybeAdd); |
|
||||||
} |
|
||||||
return found; |
|
||||||
} |
|
||||||
}); |
|
@ -1,80 +0,0 @@ |
|||||||
(function (mod) { |
|
||||||
mod(CodeMirror); |
|
||||||
})(function (CodeMirror) { |
|
||||||
"use strict"; |
|
||||||
|
|
||||||
CodeMirror.defineMode('formula', function () { |
|
||||||
function wordObj(words) { |
|
||||||
var o = {}; |
|
||||||
for (var i = 0, e = words.length; i < e; ++i) o[words[i]] = true; |
|
||||||
return o; |
|
||||||
} |
|
||||||
|
|
||||||
var atoms = wordObj(['false', 'true']); |
|
||||||
var keywords = wordObj(FormulaCollections); |
|
||||||
|
|
||||||
function tokenBase(stream, state) { |
|
||||||
if (stream.eatSpace()) { |
|
||||||
return null; |
|
||||||
} |
|
||||||
var ch = stream.next(); |
|
||||||
|
|
||||||
if (ch === '"' || ch === '\'') { |
|
||||||
nextUntilUnescaped(stream, ch); |
|
||||||
return "string"; |
|
||||||
} |
|
||||||
if (/[\[\],\(\)]/.test(ch)) { |
|
||||||
return 'bracket'; |
|
||||||
} |
|
||||||
|
|
||||||
// richie:暂时不需要解析操作符号
|
|
||||||
//if (/[+\-*\/=<>!&|]/.test(ch)) {
|
|
||||||
// return 'operator';
|
|
||||||
//}
|
|
||||||
//if (/\d|\d./.test(ch)) {
|
|
||||||
// stream.eatWhile(/\d|\./);
|
|
||||||
// if (stream.eol() || !/\w/.test(stream.peek())) {
|
|
||||||
// return 'number';
|
|
||||||
// }
|
|
||||||
//}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
stream.eatWhile(/[\w-]/); |
|
||||||
var word = stream.current(); |
|
||||||
if (atoms.hasOwnProperty(word)) { |
|
||||||
return "atom"; |
|
||||||
} |
|
||||||
if (keywords.hasOwnProperty(word)) { |
|
||||||
return "keyword"; |
|
||||||
} |
|
||||||
return null; |
|
||||||
} |
|
||||||
|
|
||||||
function nextUntilUnescaped(stream, end) { |
|
||||||
var escaped = false, next; |
|
||||||
while ((next = stream.next()) != null) { |
|
||||||
if (next === end && !escaped) { |
|
||||||
return false; |
|
||||||
} |
|
||||||
escaped = !escaped && next === "\\"; |
|
||||||
} |
|
||||||
return escaped; |
|
||||||
} |
|
||||||
|
|
||||||
function tokenize(stream, state) { |
|
||||||
return (state.tokens[0] || tokenBase)(stream, state); |
|
||||||
} |
|
||||||
|
|
||||||
return { |
|
||||||
startState: function () { |
|
||||||
return {tokens: []}; |
|
||||||
}, |
|
||||||
token: function (stream, state) { |
|
||||||
return tokenize(stream, state); |
|
||||||
}, |
|
||||||
fold: "brace" |
|
||||||
}; |
|
||||||
}); |
|
||||||
CodeMirror.defineMIME("text/fx-formula", "formula"); |
|
||||||
}); |
|
@ -1,432 +0,0 @@ |
|||||||
// CodeMirror, copyright (c) by Marijn Haverbeke and others
|
|
||||||
// Distributed under an MIT license: http://codemirror.net/LICENSE
|
|
||||||
|
|
||||||
(function (mod) { |
|
||||||
mod(CodeMirror); |
|
||||||
})(function (CodeMirror) { |
|
||||||
"use strict"; |
|
||||||
|
|
||||||
var HINT_ELEMENT_CLASS = "CodeMirror-hint"; |
|
||||||
var ACTIVE_HINT_ELEMENT_CLASS = "CodeMirror-hint-active"; |
|
||||||
|
|
||||||
// This is the old interface, kept around for now to stay
|
|
||||||
// backwards-compatible.
|
|
||||||
CodeMirror.showHint = function (cm, getHints, options) { |
|
||||||
if (!getHints) return cm.showHint(options); |
|
||||||
if (options && options.async) getHints.async = true; |
|
||||||
var newOpts = {hint: getHints}; |
|
||||||
if (options) for (var prop in options) newOpts[prop] = options[prop]; |
|
||||||
return cm.showHint(newOpts); |
|
||||||
}; |
|
||||||
|
|
||||||
CodeMirror.defineExtension("showHint", function (options) { |
|
||||||
// We want a single cursor position.
|
|
||||||
if (this.listSelections().length > 1 || this.somethingSelected()) return; |
|
||||||
|
|
||||||
if (this.state.completionActive) this.state.completionActive.close(); |
|
||||||
var completion = this.state.completionActive = new Completion(this, options); |
|
||||||
if (!completion.options.hint) return; |
|
||||||
|
|
||||||
CodeMirror.signal(this, "startCompletion", this); |
|
||||||
completion.update(true); |
|
||||||
}); |
|
||||||
|
|
||||||
function Completion(cm, options) { |
|
||||||
this.cm = cm; |
|
||||||
this.options = this.buildOptions(options); |
|
||||||
this.widget = null; |
|
||||||
this.debounce = 0; |
|
||||||
this.tick = 0; |
|
||||||
this.startPos = this.cm.getCursor(); |
|
||||||
this.startLen = this.cm.getLine(this.startPos.line).length; |
|
||||||
|
|
||||||
var self = this; |
|
||||||
cm.on("cursorActivity", this.activityFunc = function () { |
|
||||||
self.cursorActivity(); |
|
||||||
}); |
|
||||||
} |
|
||||||
|
|
||||||
var requestAnimationFrame = window.requestAnimationFrame || function (fn) { |
|
||||||
return setTimeout(fn, 1000 / 60); |
|
||||||
}; |
|
||||||
var cancelAnimationFrame = window.cancelAnimationFrame || clearTimeout; |
|
||||||
|
|
||||||
Completion.prototype = { |
|
||||||
close: function () { |
|
||||||
if (!this.active()) return; |
|
||||||
this.cm.state.completionActive = null; |
|
||||||
this.tick = null; |
|
||||||
this.cm.off("cursorActivity", this.activityFunc); |
|
||||||
|
|
||||||
if (this.widget && this.data) CodeMirror.signal(this.data, "close"); |
|
||||||
if (this.widget) this.widget.close(); |
|
||||||
CodeMirror.signal(this.cm, "endCompletion", this.cm); |
|
||||||
}, |
|
||||||
|
|
||||||
active: function () { |
|
||||||
return this.cm.state.completionActive == this; |
|
||||||
}, |
|
||||||
|
|
||||||
pick: function (data, i) { |
|
||||||
var completion = data.list[i]; |
|
||||||
if (completion.hint) completion.hint(this.cm, data, completion); |
|
||||||
else { |
|
||||||
this.cm.replaceRange(getText(completion), completion.from || data.from, |
|
||||||
completion.to || data.to, "complete"); |
|
||||||
var to = this.cm.getCursor(); |
|
||||||
this.cm.markText(completion.from || data.from, to, {className: "#function", atomic: true}); |
|
||||||
this.cm.replaceSelection("() "); |
|
||||||
to = this.cm.getCursor(); |
|
||||||
to.ch = to.ch - 2; |
|
||||||
this.cm.setCursor(to); |
|
||||||
this.cm.focus(); |
|
||||||
} |
|
||||||
CodeMirror.signal(data, "pick", completion); |
|
||||||
this.close(); |
|
||||||
}, |
|
||||||
|
|
||||||
cursorActivity: function () { |
|
||||||
if (this.debounce) { |
|
||||||
cancelAnimationFrame(this.debounce); |
|
||||||
this.debounce = 0; |
|
||||||
} |
|
||||||
|
|
||||||
var pos = this.cm.getCursor(), line = this.cm.getLine(pos.line); |
|
||||||
if (pos.line != this.startPos.line || line.length - pos.ch != this.startLen - this.startPos.ch || |
|
||||||
pos.ch < this.startPos.ch || this.cm.somethingSelected() || |
|
||||||
(pos.ch && this.options.closeCharacters.test(line.charAt(pos.ch - 1)))) { |
|
||||||
this.close(); |
|
||||||
} else { |
|
||||||
var self = this; |
|
||||||
this.debounce = requestAnimationFrame(function () { |
|
||||||
self.update(); |
|
||||||
}); |
|
||||||
if (this.widget) this.widget.disable(); |
|
||||||
} |
|
||||||
}, |
|
||||||
|
|
||||||
update: function (first) { |
|
||||||
if (this.tick == null) return; |
|
||||||
if (this.data) CodeMirror.signal(this.data, "update"); |
|
||||||
if (!this.options.hint.async) { |
|
||||||
this.finishUpdate(this.options.hint(this.cm, this.options), first); |
|
||||||
} else { |
|
||||||
var myTick = ++this.tick, self = this; |
|
||||||
this.options.hint(this.cm, function (data) { |
|
||||||
if (self.tick == myTick) self.finishUpdate(data, first); |
|
||||||
}, this.options); |
|
||||||
} |
|
||||||
}, |
|
||||||
|
|
||||||
finishUpdate: function (data, first) { |
|
||||||
this.data = data; |
|
||||||
|
|
||||||
var picked = (this.widget && this.widget.picked) || (first && this.options.completeSingle); |
|
||||||
if (this.widget) this.widget.close(); |
|
||||||
if (data && data.list.length) { |
|
||||||
if (picked && data.list.length == 1) { |
|
||||||
this.pick(data, 0); |
|
||||||
} else { |
|
||||||
this.widget = new Widget(this, data); |
|
||||||
CodeMirror.signal(data, "shown"); |
|
||||||
} |
|
||||||
} |
|
||||||
}, |
|
||||||
|
|
||||||
buildOptions: function (options) { |
|
||||||
var editor = this.cm.options.hintOptions; |
|
||||||
var out = {}; |
|
||||||
for (var prop in defaultOptions) out[prop] = defaultOptions[prop]; |
|
||||||
if (editor) for (var prop in editor) |
|
||||||
if (editor[prop] !== undefined) out[prop] = editor[prop]; |
|
||||||
if (options) for (var prop in options) |
|
||||||
if (options[prop] !== undefined) out[prop] = options[prop]; |
|
||||||
return out; |
|
||||||
} |
|
||||||
}; |
|
||||||
|
|
||||||
function getText(completion) { |
|
||||||
if (typeof completion == "string") return completion; |
|
||||||
else return completion.text; |
|
||||||
} |
|
||||||
|
|
||||||
function buildKeyMap(completion, handle) { |
|
||||||
var baseMap = { |
|
||||||
Up: function () { |
|
||||||
handle.moveFocus(-1); |
|
||||||
}, |
|
||||||
Down: function () { |
|
||||||
handle.moveFocus(1); |
|
||||||
}, |
|
||||||
PageUp: function () { |
|
||||||
handle.moveFocus(-handle.menuSize() + 1, true); |
|
||||||
}, |
|
||||||
PageDown: function () { |
|
||||||
handle.moveFocus(handle.menuSize() - 1, true); |
|
||||||
}, |
|
||||||
Home: function () { |
|
||||||
handle.setFocus(0); |
|
||||||
}, |
|
||||||
End: function () { |
|
||||||
handle.setFocus(handle.length - 1); |
|
||||||
}, |
|
||||||
Enter: handle.pick, |
|
||||||
Tab: handle.pick, |
|
||||||
Esc: handle.close |
|
||||||
}; |
|
||||||
var custom = completion.options.customKeys; |
|
||||||
var ourMap = custom ? {} : baseMap; |
|
||||||
|
|
||||||
function addBinding(key, val) { |
|
||||||
var bound; |
|
||||||
if (typeof val != "string") |
|
||||||
bound = function (cm) { |
|
||||||
return val(cm, handle); |
|
||||||
}; |
|
||||||
// This mechanism is deprecated
|
|
||||||
else if (baseMap.hasOwnProperty(val)) |
|
||||||
bound = baseMap[val]; |
|
||||||
else |
|
||||||
bound = val; |
|
||||||
ourMap[key] = bound; |
|
||||||
} |
|
||||||
|
|
||||||
if (custom) |
|
||||||
for (var key in custom) if (custom.hasOwnProperty(key)) |
|
||||||
addBinding(key, custom[key]); |
|
||||||
var extra = completion.options.extraKeys; |
|
||||||
if (extra) |
|
||||||
for (var key in extra) if (extra.hasOwnProperty(key)) |
|
||||||
addBinding(key, extra[key]); |
|
||||||
return ourMap; |
|
||||||
} |
|
||||||
|
|
||||||
function getHintElement(hintsElement, el) { |
|
||||||
while (el && el != hintsElement) { |
|
||||||
if (el.nodeName.toUpperCase() === "LI" && el.parentNode == hintsElement) return el; |
|
||||||
el = el.parentNode; |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
function Widget(completion, data) { |
|
||||||
this.completion = completion; |
|
||||||
this.data = data; |
|
||||||
this.picked = false; |
|
||||||
var widget = this, cm = completion.cm; |
|
||||||
|
|
||||||
var hints = this.hints = document.createElement("ul"); |
|
||||||
hints.className = "CodeMirror-hints"; |
|
||||||
this.selectedHint = data.selectedHint || 0; |
|
||||||
|
|
||||||
var completions = data.list; |
|
||||||
for (var i = 0; i < completions.length; ++i) { |
|
||||||
var elt = hints.appendChild(document.createElement("li")), cur = completions[i]; |
|
||||||
var className = HINT_ELEMENT_CLASS + (i != this.selectedHint ? "" : " " + ACTIVE_HINT_ELEMENT_CLASS); |
|
||||||
if (cur.className != null) className = cur.className + " " + className; |
|
||||||
elt.className = className; |
|
||||||
if (cur.render) cur.render(elt, data, cur); |
|
||||||
else elt.appendChild(document.createTextNode(cur.displayText || getText(cur))); |
|
||||||
elt.hintId = i; |
|
||||||
} |
|
||||||
|
|
||||||
var pos = cm.cursorCoords(completion.options.alignWithWord ? data.from : null); |
|
||||||
var left = pos.left, top = pos.bottom, below = true; |
|
||||||
hints.style.left = left + "px"; |
|
||||||
hints.style.top = top + "px"; |
|
||||||
// If we're at the edge of the screen, then we want the menu to appear on the left of the cursor.
|
|
||||||
var winW = window.innerWidth || Math.max(document.body.offsetWidth, document.documentElement.offsetWidth); |
|
||||||
var winH = window.innerHeight || Math.max(document.body.offsetHeight, document.documentElement.offsetHeight); |
|
||||||
(completion.options.container || document.body).appendChild(hints); |
|
||||||
var box = hints.getBoundingClientRect(), overlapY = box.bottom - winH; |
|
||||||
if (overlapY > 0) { |
|
||||||
var height = box.bottom - box.top, curTop = pos.top - (pos.bottom - box.top); |
|
||||||
if (curTop - height > 0) { // Fits above cursor
|
|
||||||
hints.style.top = (top = pos.top - height) + "px"; |
|
||||||
below = false; |
|
||||||
} else if (height > winH) { |
|
||||||
hints.style.height = (winH - 5) + "px"; |
|
||||||
hints.style.top = (top = pos.bottom - box.top) + "px"; |
|
||||||
var cursor = cm.getCursor(); |
|
||||||
if (data.from.ch != cursor.ch) { |
|
||||||
pos = cm.cursorCoords(cursor); |
|
||||||
hints.style.left = (left = pos.left) + "px"; |
|
||||||
box = hints.getBoundingClientRect(); |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
var overlapX = box.right - winW; |
|
||||||
if (overlapX > 0) { |
|
||||||
if (box.right - box.left > winW) { |
|
||||||
hints.style.width = (winW - 5) + "px"; |
|
||||||
overlapX -= (box.right - box.left) - winW; |
|
||||||
} |
|
||||||
hints.style.left = (left = pos.left - overlapX) + "px"; |
|
||||||
} |
|
||||||
|
|
||||||
cm.addKeyMap(this.keyMap = buildKeyMap(completion, { |
|
||||||
moveFocus: function (n, avoidWrap) { |
|
||||||
widget.changeActive(widget.selectedHint + n, avoidWrap); |
|
||||||
}, |
|
||||||
setFocus: function (n) { |
|
||||||
widget.changeActive(n); |
|
||||||
}, |
|
||||||
menuSize: function () { |
|
||||||
return widget.screenAmount(); |
|
||||||
}, |
|
||||||
length: completions.length, |
|
||||||
close: function () { |
|
||||||
completion.close(); |
|
||||||
}, |
|
||||||
pick: function () { |
|
||||||
widget.pick(); |
|
||||||
}, |
|
||||||
data: data |
|
||||||
})); |
|
||||||
|
|
||||||
if (completion.options.closeOnUnfocus) { |
|
||||||
var closingOnBlur; |
|
||||||
cm.on("blur", this.onBlur = function () { |
|
||||||
closingOnBlur = setTimeout(function () { |
|
||||||
completion.close(); |
|
||||||
}, 100); |
|
||||||
}); |
|
||||||
cm.on("focus", this.onFocus = function () { |
|
||||||
clearTimeout(closingOnBlur); |
|
||||||
}); |
|
||||||
} |
|
||||||
|
|
||||||
var startScroll = cm.getScrollInfo(); |
|
||||||
cm.on("scroll", this.onScroll = function () { |
|
||||||
var curScroll = cm.getScrollInfo(), editor = cm.getWrapperElement().getBoundingClientRect(); |
|
||||||
var newTop = top + startScroll.top - curScroll.top; |
|
||||||
var point = newTop - (window.pageYOffset || (document.documentElement || document.body).scrollTop); |
|
||||||
if (!below) point += hints.offsetHeight; |
|
||||||
if (point <= editor.top || point >= editor.bottom) return completion.close(); |
|
||||||
hints.style.top = newTop + "px"; |
|
||||||
hints.style.left = (left + startScroll.left - curScroll.left) + "px"; |
|
||||||
}); |
|
||||||
|
|
||||||
CodeMirror.on(hints, "dblclick", function (e) { |
|
||||||
var t = getHintElement(hints, e.target || e.srcElement); |
|
||||||
if (t && t.hintId != null) { |
|
||||||
widget.changeActive(t.hintId); |
|
||||||
widget.pick(); |
|
||||||
} |
|
||||||
}); |
|
||||||
|
|
||||||
CodeMirror.on(hints, "click", function (e) { |
|
||||||
var t = getHintElement(hints, e.target || e.srcElement); |
|
||||||
if (t && t.hintId != null) { |
|
||||||
widget.changeActive(t.hintId); |
|
||||||
if (completion.options.completeOnSingleClick) widget.pick(); |
|
||||||
} |
|
||||||
}); |
|
||||||
|
|
||||||
CodeMirror.on(hints, "mousedown", function () { |
|
||||||
setTimeout(function () { |
|
||||||
cm.focus(); |
|
||||||
}, 20); |
|
||||||
}); |
|
||||||
|
|
||||||
CodeMirror.signal(data, "select", completions[0], hints.firstChild); |
|
||||||
return true; |
|
||||||
} |
|
||||||
|
|
||||||
Widget.prototype = { |
|
||||||
close: function () { |
|
||||||
if (this.completion.widget != this) return; |
|
||||||
this.completion.widget = null; |
|
||||||
this.hints.parentNode.removeChild(this.hints); |
|
||||||
this.completion.cm.removeKeyMap(this.keyMap); |
|
||||||
|
|
||||||
var cm = this.completion.cm; |
|
||||||
if (this.completion.options.closeOnUnfocus) { |
|
||||||
cm.off("blur", this.onBlur); |
|
||||||
cm.off("focus", this.onFocus); |
|
||||||
} |
|
||||||
cm.off("scroll", this.onScroll); |
|
||||||
}, |
|
||||||
|
|
||||||
disable: function () { |
|
||||||
this.completion.cm.removeKeyMap(this.keyMap); |
|
||||||
var widget = this; |
|
||||||
this.keyMap = { |
|
||||||
Enter: function () { |
|
||||||
widget.picked = true; |
|
||||||
} |
|
||||||
}; |
|
||||||
this.completion.cm.addKeyMap(this.keyMap); |
|
||||||
}, |
|
||||||
|
|
||||||
pick: function () { |
|
||||||
this.completion.pick(this.data, this.selectedHint); |
|
||||||
}, |
|
||||||
|
|
||||||
changeActive: function (i, avoidWrap) { |
|
||||||
if (i >= this.data.list.length) |
|
||||||
i = avoidWrap ? this.data.list.length - 1 : 0; |
|
||||||
else if (i < 0) |
|
||||||
i = avoidWrap ? 0 : this.data.list.length - 1; |
|
||||||
if (this.selectedHint == i) return; |
|
||||||
var node = this.hints.childNodes[this.selectedHint]; |
|
||||||
node.className = node.className.replace(" " + ACTIVE_HINT_ELEMENT_CLASS, ""); |
|
||||||
node = this.hints.childNodes[this.selectedHint = i]; |
|
||||||
node.className += " " + ACTIVE_HINT_ELEMENT_CLASS; |
|
||||||
if (node.offsetTop < this.hints.scrollTop) |
|
||||||
this.hints.scrollTop = node.offsetTop - 3; |
|
||||||
else if (node.offsetTop + node.offsetHeight > this.hints.scrollTop + this.hints.clientHeight) |
|
||||||
this.hints.scrollTop = node.offsetTop + node.offsetHeight - this.hints.clientHeight + 3; |
|
||||||
CodeMirror.signal(this.data, "select", this.data.list[this.selectedHint], node); |
|
||||||
}, |
|
||||||
|
|
||||||
screenAmount: function () { |
|
||||||
return Math.floor(this.hints.clientHeight / this.hints.firstChild.offsetHeight) || 1; |
|
||||||
} |
|
||||||
}; |
|
||||||
|
|
||||||
CodeMirror.registerHelper("hint", "auto", function (cm, options) { |
|
||||||
var helpers = cm.getHelpers(cm.getCursor(), "hint"), words; |
|
||||||
if (helpers.length) { |
|
||||||
for (var i = 0; i < helpers.length; i++) { |
|
||||||
var cur = helpers[i](cm, options); |
|
||||||
if (cur && cur.list.length) return cur; |
|
||||||
} |
|
||||||
} else if (words = cm.getHelper(cm.getCursor(), "hintWords")) { |
|
||||||
if (words) return CodeMirror.hint.fromList(cm, {words: words}); |
|
||||||
} else if (CodeMirror.hint.anyword) { |
|
||||||
return CodeMirror.hint.anyword(cm, options); |
|
||||||
} |
|
||||||
}); |
|
||||||
|
|
||||||
CodeMirror.registerHelper("hint", "fromList", function (cm, options) { |
|
||||||
var cur = cm.getCursor(), token = cm.getTokenAt(cur); |
|
||||||
var found = []; |
|
||||||
for (var i = 0; i < options.words.length; i++) { |
|
||||||
var word = options.words[i]; |
|
||||||
if (word.slice(0, token.string.length) == token.string) |
|
||||||
found.push(word); |
|
||||||
} |
|
||||||
|
|
||||||
if (found.length) return { |
|
||||||
list: found, |
|
||||||
from: CodeMirror.Pos(cur.line, token.start), |
|
||||||
to: CodeMirror.Pos(cur.line, token.end) |
|
||||||
}; |
|
||||||
}); |
|
||||||
|
|
||||||
CodeMirror.commands.autocomplete = CodeMirror.showHint; |
|
||||||
|
|
||||||
var defaultOptions = { |
|
||||||
hint: CodeMirror.hint.auto, |
|
||||||
completeSingle: true, |
|
||||||
alignWithWord: true, |
|
||||||
closeCharacters: /[\s()\[\]{};:>,]/, |
|
||||||
closeOnUnfocus: true, |
|
||||||
completeOnSingleClick: true, |
|
||||||
container: null, |
|
||||||
customKeys: null, |
|
||||||
extraKeys: null |
|
||||||
}; |
|
||||||
|
|
||||||
CodeMirror.defineOption("hintOptions", null); |
|
||||||
}); |
|
Loading…
Reference in new issue