私人用途，没有发布到任何专题，偶然看到的那几位朋友直接忽略就可以了
[新增] dialog组件
dialog-alert
- 自适应布局
- 动画效果
- 参数容错机制(默认参数与重要参数缺失提示)
- 多行内容输出
- 可选样式
可选样式包括：danger | warning | info | primary | success
- 相比原来的多模板类的原型设计，dialog的模板方法使用返回对象的方式更干净简单
- 极限高度限制
警示：Congratulations on the success of calling this plugin, but you forgot the necessary content!
没有传递内容主体
[追加] SCSS颜色
onlineEditor/css/var/_color.scss
新增单独的bootstrap颜色设置
$globalColorBsDanger: #d75452;
$globalColorBsWarning: #eeac57;
$globalColorBsInfo: #3ab0d3;
$globalColorBsPrimary: #377bb5;
$globalColorBsSuccess: #5fb760;
新增btn-default类，为淡灰色背景深色文字颜色
[新增] dialog组件
dialog-alert
单字符串参数API，无需其他参数，默认为alert类型，primary样式
// 测试一个字符串参数
new dialog('your text here');
[新增] view组件
新参数 autoHideToolBar
默认值 true
实例化view的时候使用autoHideToolBar参数控制工具栏的自动隐藏功能开关
//关闭自动隐藏工具栏功能
var editorView = new view({
autoHideToolBar: false
});
[新增] dialog组件
dialog-alert 新参数 autoClose
默认值 false
打开新的dialog时设置autoClose为true或者一个延时，可以让这个dialog自动关闭
autoClose的值为true时，默认延时为3000ms
// 打开自动关闭功能
new dialog({
info:['hi'],
autoClose: true
});
// 下面的写法和上面相比是等效的
new dialog({
info:['hi'],
autoClose: 3000
});
警示：You have set the wrong delay closing parameters,Modal boxes will not be automatically closed!
没有设置合法的延时参数
[新增] dialog组件
dialog-alert 参数info 更宽松的规则
之前为了可以支持多行内容，info的值需要写成这样：
new dialog({
info:['dialog','Hello','123']
});
但是大部分时间可能仅仅是需要一行内容的显示，那么就需要传递一个只有单个元素的数组
new dialog({
info:['dialog']
});
本次改进后，可以直接传递字符串或者数字作为主体内容
new dialog('dialog');
new dialog(123456);
[新增] dialog组件
dialog-alert 自动关闭的动画计时效果
打开自动关闭功能后，标题部分会自动展现一个进度条表示剩余进度
这个进度条是真实的，根据你设置的延时控制速度
[改进] dialog组件
info 参数问题
在 “dialog-alert 参数info 更宽松的规则” 中，介绍了一次使 info 参数更自由的设计
之前的情况：
// 下面这两种方式都是可以的
new dialog('dialog');
new dialog(123456);
// 下面的方式会发生错误
new dialog({
info: 'onlineEditor'
})
上面的情况在嵌套使用 dialog 时候尤其严重，但是现在经过改进可以正常使用了，无论哪种方式
[新增] dialog组件
dialog-confirm
通过 type: 'confirm' 调用，同时至少要传递一个按钮标题和对应的回调函数
其它设置属性和 type: 'alert' 相同，支持不同种类的 info 参数，以及自动关闭
confirm 类型的 dialog 可以和 alert 类型的互相嵌套调用
示例：
new dialog({
type: 'confirm',
info: 'OnlineEditor',
action: [
{
title: 'btn1',
fn: function () {
console.log(1);
}
},{
title: 'btn2',
fn: function () {
console.log(2);
}
}
]
});
嵌套示例：
new dialog({
type: 'confirm',
style: 'warning',
info: '给你三个选项',
action: [
{
title:'一句话',
fn:function(){
new dialog({
style: 'info',
autoClose: true,
info: 'helloWorld'
});
}
},{
title:'《玉阶怨》',
fn:function(){
new dialog({
type: 'confirm',
autoClose: 12345,
info: ['玉阶生白露，','夜久侵罗袜。','却下水晶帘，','玲珑望秋月。'],
action: [
{
title: '不好',
fn: function () {
new dialog({
style: 'danger',
autoClose: true,
info: '再接再厉'
})
}
},{
title: '好诗!',
fn: function () {
new dialog({
style: 'success',
autoClose: true,
info: 'thank you'
})
}
}
]
});
}
},{
title:'ignore',
fn:function(){
new dialog({
autoClose: 1000,
info: '正在关闭...'
})
}
}
]
});
[改进] dialog组件
SCSS 抽象模块化
dialog 组件所需要的 SCSS 文件拆分为
- _dialog.scss
- _dialog-public.scss
- _dialog-alert.scss
- _dialog-confirm.scss
_dialog.scss 为主要文件，_dialog-public.scss 内包含组件共用设置参数以及通用CSS部件
所有的SCSS文件最后还是会被编译为一个 style.css 文件并被引入到主页
经过这些处理后，alert 和 confirm 类型对应的 SCSS 文件每个仅需30+行即可(并不代表最后编译出的CSS也是30多行)，精简的同时也保证了全局设置的方便
[改进] 文字分割算法
优化log输出，方便测试
使用console的分组输出，格式更明了
从此以后新的组件调试都会使用这样的形式
[新增] toast组件
弹出自动消失的气泡提示
调用方法：
new toast('Hello');
即可显示一个自动消失的气泡
可选参数：
- info 显示的主体内容 string
- position 位置 string | 'top' 'bottom'
- closeDelay 关闭延时 number
示例：
new toast({
position:'top',
info: 'helloWorld'
});
效果：
你如果愿意的话可以同时在屏幕上实例化多个toast，它们是互相独立的
[改进] 文字分割算法调用
writeReplaceCheckLimit
解决在writeReplaceCheckLimit类型的按钮按下时，触发的断句检查算法由于传值为空导致的错误
[新增] dialog组件
dialog-input
输入框形式的dialog
调用方式：
new dialog({
type:'input',
title:'请输入你的名字',
info:'输入名字进行下一步',
val:'李杨',
fn0:function () {
new toast('取消了')
},
fn1:function (val) {
new toast('你输入的是：'+val)
}
})
同样可以和其它类型的dialog互相调用，因为在设计之中它们之间是方法共享数据独立的
参数：
- type = 'input'
- title 显示的标题
- info 输入框的placeholder
- val 默认值
- fn0 点击"取消"后触发的事件
- fn1 点击"确定"后触发的事件
fn1对应的函数可以接收一个参数，其值为用户提交的内容
[改进] modal组件
modal.scss
修改了输入型modal的尺寸设置，尽量减少手机上弹出键盘遮挡的情况
[改进] fastclick.js
调试优化
修改了fastclick.js库，解决了在PC调试时dialog-input的输入框无法获得焦点的问题
接下来要做什么
目前能想到的问题主要是文件读取和保存的逻辑，计划重写local-data.js和loader.js，重新设计文件载入时的传参规则和保存文件的逻辑。