RoadMap讨论

[jinzhubaofu]

整理以下需求供大家讨论。优先级不分先后。

近期需求

(1) 新控件 - 表单、数据校验

由于中间页项目中有大量的表单需求，moye需要给予支持。

主要功能可能包含：

1. 数据字段校验
2. 提交事件处理

针对这两项功能，我们需要完成以下工作：

1. 设计InputControl基类（接口）
2. 整理目前已有的输入类型控件进行一次重构，使其继承InputControl基类（或实现InputControl接口）
3. 补充一些输入控件，例如Text, TextArea；

具体的设计/实现问题另开issue讨论。

(2) 通用 - 控件状态与皮肤

控件状态

常用的控件状态有禁用 只读，因此我们计划为Control添加以下方法来支持

• addState(state) 自动添加样式state-${state}
• removeState(state) 自动移除样式state-${state}

控件皮肤

目前moye控件只能通过覆盖less预定义变量重新生成样式，来生成自定义样式。这种方式会造成样式冗余。我们通过配置字段skin来添加自定义皮肤。

options: {
    skin: [ 'custom-skin-1', 'custom-skin-2' ]
}

如果按上边示例添加skin参数，控件自动获得样式skin-${skin}

(3) 通用 - 控件插件

由于moye自身定位是 轻 小 快 的小清新控件库，我们不能像esui一样集成大量功能到控件中。因此，考虑是否可以控件功能细化，以插件形式提供。例如：

var placeHolder = require('moye/text-placeholder');
var passwordStrength = require('moye/text-password-strength');
var text = new Text({
    onChange: function () { ... }
});
text.use(placeHolder( ... )).use(passwordStrength( ... ));

以上代码可以提供一个输入框控件，带有placeholder兼容功能以及密码强度验证功能

var validate = require('moye/validate');
var form = new Form({
    onSubmit: function () { ... }
});

form.use(validate({ ... }));

以上代码可以提供一个表单，带有校验功能

插件化既可以保持控件本身功能精简，又利用于扩展功能。

(4) 通用 - jQuery化

由于大搜索卡片全面使用jQuery，因此我们的lib绝大部分的功能都是冗余的。因此，我们需要开发一个基于jQuery的moye版本。

(5) lib.observable的事件对象规范化

现在observable对象在fire事件时，传入的事件对象不支持这些方法或对象：

• preventDefault() 阻止默认行为
• isPeventDefault() 是否已经阻止了默认行为
• stopImmediatePropagation() 立即阻止后续监听者的回调
• stopPropagation() 停止事件冒泡
• target对象

这些方法或对象在构建复杂逻辑时是必要的，特别是preventDefault()。

中远期需求

中间页控件规范化

在中间页项目使用标准样式、标准交互的控件

可以与中间页栅格化一同进行

控件库

对于中间页项目，我们推荐大家使用统一、标准的控件。当然，在某些情况下我们的标准库不能满足需求。我们希望可以形成一套机制，在满足基于统一接口的条件下，收录多种多样的控件。

欢迎大家讨论，有遗漏的问题欢迎大家补充

[chriswong]

需要区分 Control 和 InputControl 基类了，目前很多和表单输入有关的状态和方法可以挪到 InputControl， API 实现上尽量与 ESUI 的规范一致，理想状态是可作为一个子集

validate 是动词，控件应使用 validator/validater/validation 为名

[jinzhubaofu]

皮肤不能再等了，必须要马上弄出来。

[jinzhubaofu]

@chriswong 最近我完成了(2)(3)的开发，想合并到jquery分支上，可好？

[jinzhubaofu]

添加了(5)事件规范化相关问题

[chriswong]

@chriswong 最近我完成了(2)(3)的开发，想合并到jquery分支上，可好？

代码在哪？提交个分支上来看看

[jinzhubaofu]

提交个分支上来看看

好，我整理一下

[jinzhubaofu]

@chriswong 关于(5)可否依赖于mini-event?

或者是不再提供lib.observable直接依赖mini-event?

或者直接依赖jQuery？经不完整测试这样貌似是可以的。

var a = $('<div>');
var event = $.Event('a');
a.on('a', function (e) {
    console.log(1);
    console.log(e);
    e.preventDefault();
});

a.trigger(event);
console.log(event.isDefaultPrevented());

[jinzhubaofu]

@chriswong 我把最近(2)(3)的改动放到了feature/ng上了。这个分支基于jquery分支，只改动了两个文件Control.js和lib.js。Control除了状态、皮肤和插件之外，还引入了生命周期stage。基本上是与esui的管理机制一致，做了部分的简化，保持简单。

[jinzhubaofu]

以上功能在feature/ng上基本完成了开发.