BIN 是一个简单、轻量、易用、跨平台的 Web APP开源框架，提供了对于APP开发的核心框架，通用的UI组件，能够快速的开发移动APP，并表现出和 Native APP 一样的操作体验。BIN采用Cordova和Native进行衔接，在Android端采用CrossWalk WebKit内核，使用JQuery、RequireJS、Backbone、Underscore、FastClick等通用稳定的第三方库。从开发角度来说，BIN是一个纯Web，非Hybrid的APP框架，但是基于框架提供的开发模式，你可以像Native一样开发UI View。当前支持IOS和Android平台，可以通过Online Tutorials Online Demo(通过手机访问，效果更逼真)来体验BIN开源框架。
点击Tutorials APK下载安装。
##功能
- View抽象，模拟原生开发模式
- 一般页面 Pageview
- 导航栏页面 NaviPageView
- 下拉刷新页面 RefreshView
- 列表页面 ListView
- 指示器 IndicatorView
- Alert框 AlertView
- Tab栏 TabBarView
- Swipe页面 Swipeview
- Tab页面 TabView
- 图片延迟加载
- 网络API模块
- 网络缓存模块
- 数据中心模块，支持本地存储和会话存储
- 本地API测试框架，支持完全无依赖服务器进行开发
- bin : BIN 框架代码
- config : 配置模板文件
- index.html : BIN框架Web引导页面
bin是整个框架的命名空间，包含了可配置的Class结构(classConfig)，包含了全局的单件实例app,netManager,hudManager,debugManager,naviController,dataCenter。
bin中的配置文件有globalConfig, requireConfig, classConfig, netLocalConfig。在bin/config中包含了这些配置文件的模板，实际应用中使用的是config目录下的。详细信息参见文件。
- globalConfig.js
对应用的整体配置，包含global和runtime两类配置数据。
global : 全局配置，通过bin.globalConfig获取，这里面是整个globalConfig里的内容
runtime : 运行时配置，应用启动后，会根据global中runtime来选择对应的运行时配置，以方便我们不同版本的切换。 - requireConfig.js
对requirejs的整体配置 - classConfig.js
对bin类结构的配置，在这里面可以修改框架内部实际使用的类，已达到定制自己的类，比如Application，DataCenter...
注意 : 该结构定义中不存在没有依赖关系，仅仅是一个结构关系，所以在requirejs的define中不要直接使用，而是在运行时使用。 - netLocalConfig.js
网络API本地数据测试配置
Application是bin的应用基类，可通过classConfig中定制。
- init()
应用初始化，可添加自己的初始化操作。bin.Application会自动初始化debugManager,hudManager,netManager,naviController,dataCenter。 - run()
应用开始执行，可添加应用显示第一个页面的代码。 - onDeviceBack()
针对Android Device返回键点击回调，在PC上可通过悬浮Debug按钮模拟。 - onPause()
应用进程被Pause回调。 - onResume()
应用进程被Resume回调。
bin中的所有ajax http请求由netManager封装，netManager提供API抽象。netManager中提供四种策略(Policy)来定制网络处理的行为，bin提供了默认实现。
CachePolicy : 网络缓存策略,配置网络请求的数据在客户端如何缓存
+ NORMAL : 一直缓存在本地,直到超过maxCacheDuration(Config中配置)
+ DURATION : 指定缓存的时间，过期后无效
+ SESSION : APP期间一直有效，关闭后缓存失效
+ USER_SESSION : 用户登陆期间有效，退出后失效
CallbackPolicy : 网络回调策略，可在这里面添加在框架层面对请求的统一处理
DebugPolicy : 网络本地数据测试策略
SendCheckPolicy : 网络发送策略，处理网络请求在发送前的过滤逻辑
+ ABORT_ON_REQUESTING : 同一个api请求，当已经存在请求，再次发送将会abort前一次请求
+ REJECT_ON_REQUESTING : 同一个api请求，当已经存在请求，再次发送将会被reject，不能请求
-
doAPI(params)
进行一次api操作,params为ajax的参数,同时包含bin定义的参数
params.options : bin api选项- loading : 网络加载选项 默认为MODEL, true/false加载效果, MODEL表示同时添加模态效果, 网络请求同时，用户将不能进行UI操作。
- cache : 网络缓存选项 默认无, NORMAL/DURATION/SESSION/USER_SESSION
- cacheDuration : 指定缓存的时间(ms), 当cache为DURATION时有效
- sendCheck : 网络发送选项 默认无, ABORT_ON_REQUESTING/REJECT_ON_REQUESTING
- loading : 网络加载选项 默认为MODEL, true/false加载效果, MODEL表示同时添加模态效果, 网络请求同时，用户将不能进行UI操作。
-
setDebugPolicy(policy)
设置网络本地测试策略 -
setCallbackPolicy(policy)
设置网络回调策略 -
setCachePolicy(policy)
设置网络缓存策略 -
setSendCheckPolicy(policy)
设置网络发送策略 -
ajax(params)
发送ajax请求
bin中所有hud显示由hudManager提供，比如Alert，Status，Indicator。
- startIndicator(options)
开始菊花图。
options.model : 是否模态 true/false
返回本次菊花图ID，供stopIndicator使用 - stopIndicator(indicatorID)
停止indicatorID指定的菊花图，如果没有指定，则完全取消菊花图。
注意 : bin对于菊花图支持计数机制。 - showStatus(message)
显示悬浮信息 - alert(options)
显示对话框
bin中提供了页面栈概念，由naviController完成。
-
push(name, pushData, options)
跳转到name指定页面
name : 页面名字 pushData : 向新页面传递的数据，新页面可通过onViewPush获取
options : 跳转效果参数，可选 -
pop(count, popData, options)
返回指定级数(count)页面
count : 返回的级数
popData : 向返回的页面传递的数据，返回页面可通过onViewBack获取
options : 跳转效果参数，可选 -
popTo(name, popData, options)
返回到指定页面
参数参照pop操作 -
current()
获取当前页面的栈数据，返回为{name, view}
name : 页面名字
view : 页面对象 -
getView(name)
获取指定页面的栈数据，返回结构同current() -
startWith(name)
以name指定的新页面作为根页面，原来的页面栈将被清空
提供数据中心封装，包含了本地持久化和本地会话，用户持久化和用户会话这几种数据库抽象。提供用户数据分离功能。
在框架上提供调试功能，可参见应用中悬浮调试按钮，可在应用中直接查看console.log, console.info, console.error信息，方便调试。
View是BIN中最基本的UI Controller，包含了HTML中某一个Element对应的逻辑，在ios中类似View Controller。
- constructor(options)
构造函数
options.html : 从html构造view,html应该包含一个根Element
options.elem : 从已有Element构造view,elem可以是DOM或者JQuery节点
options.el : 从已有Element构造view,elem可以是DOM或者JQuery节点，这种方式不会触发render和show的调用
注意：BIN中的view只能通过这几种方式来构造，三种方式是互斥的 - genHTML()
为view动态构造HTML结构函数 - preGenHTML()
genHTML的前事件函数 - posGenHTML()
genHTML的后事件函数 - asyncPosGenHTML()
posGenHTML的异步版本，对于需要依赖layout过后的属性(比如width,height)，在该函数中处理 - show()
显示该view - hide()
隐藏该view - remove()
移除该view,移除后，view在html中对一个的节点也会被移除 - onShow()
view在显示时被调用 - onHide()
view在隐藏时被调用 - onRemove()
view在移除时被调用，一些清理的逻辑在这里处理 - isShow()
返回view当前是否显示中 - $(sel, fromSel)
在view中从fromSel节点查询sel节点，并返回该节点，sel和fromSel为JQuery selector。如果fromSel为空，则从当前view的根节点查询；如果sel为空，返回view的根节点 - $html(sel, html)
如果html不为空，对sel节点设置html；如果html为空，则返回sel节点的html；如果sel为空，则对根节点操作 - $text(sel, html)
参照$html，不同点在于调用节点的text - $append(sel, elem)
将elem插入到sel节点的最后 - $fragment(sel, fromSel)
对$(sel, fromSel)创建一个Fragment，对Fragment操作完后需要调用setup将实际内容append到$(sel, fromSel)节点
PageView代表一个主页面，可具有过场动画；PageView从View继承
- goBack()
返回上一层页面 - onViewBack(backFrom, backData)
页面返回时回调
backFrom : 所返回页面的名字
backData : 所返回页面传递给该页面的参数 - onViewPush(pushFrom, pushData, queryParams)
页面跳转时回调
pushFrom : 该页面所跳转页面的名字
pushData : 所跳转页面传递给该页面的参数
queryParams : 所跳转页面在url中传递的参数，建议不要使用该种方式传递，而是采用pushData来传递
注意 : onViewPush在render之前被调用 - onInAnimationBeg()
页面进入过场动画开始时回调 - onInAnimationEnd()
页面进入过场动画结束时回调 - onDeviceBack()
针对Android手机返回键点击事件回调，如果要处理该事件，不再传递该事件，请返回true
NaviPageView代表一个具有导航栏的主页面；NaviPageView从Page继承
- onLeft()
导航栏左按钮点击回调 - onRight()
导航栏右按钮点击回调 - setLeftImage(img)
设置左按钮的图片 - setRightImage(img)
设置右按钮的图片 - setLeftText(text)
设置左按钮的文本 - setRightText(text)
设置右按钮的文本
注意 : 导航按钮不支持同时设置图片和文字 - setLeftVisible(v)
设置左按钮是否显示 - setRightVisible(v)
设置右按钮是否显示 - setTitle(text)
设置导航栏Title - setTitleVisible(v)
设置导航栏是否显示
- 使用自己熟悉的一个编辑器，比如: Sublime，Notepad++，vim ...
- 使用Chrome做模拟器和调试器。
- 由于PC和手机WebKit的差异，需要在手机端进行测试。
- 在Android手机上，为了避开不同手机在WebKit上的兼容性，BIN使用了Crosswalk内核，优点是：Crosswalk性能更好，不存在兼容性问题；缺点是：编译的APK会大10几MB；Crosswalk有lite版本，但是lite版本不稳定。
MIT