Skip to content

使用nACommonJS 入门及高级用法(bs.js 和 util.js)

Jump to bottom Edit New page
iansun edited this page Mar 10, 2015 · 2 revisions

使用nACommonJS 入门及高级用法(bs.js 和 util.js)

nACommonJS 的建立是为了方便开发者更好地与底层引擎交互（底层本地化引擎提供javascript形式的API供开发者使用）. 核心部分全部封装到了bs.js 文件中，util.js 更多的是帮助、配置工具。（这两个js唯一依赖的jquery.js, jquery.js 影响力还是蛮大的，我们建议你一直使用）

同步更新的bs.js 和 utils.js 可以通过

https://github.com/Romanysoft/working/tree/master/DebugApp/Mac/Public/nACommonJS

进行查看.

###nACommonJS 入门

使用nACommonJS 最简单的方式，是在index.html 文件中直接引入

<!DOCTYPE html>
<head>
    <meta charset="utf-8"/>
    <link rel="stylesheet" href="styles/style.css"/>
</head>
<body>
<div id="layout">
    <div id="test-editormd">
        <textarea style="display:none;"></textarea>
    </div>
</div>

<script src="common/es6-shim/es6-shim.min.js"></script>
<script src="common/jquery.min.js"></script>
<script src="js/util.js"></script>
<script src="js/bs.js"></script>
<script src="js/app.js"></script>
<script type="text/javascript">
    window.UI.c$.launch()
</script>
</body>
</html>

同时，bs.js 及util.js 完全至此AMD/CMD方式导入，支持require.js方式

###nACommonJS 高级用法说明

#####【1】require.js 导入方式

main.js

require.config({
    "baseUrl": "tjs",
    "paths": {
        "jquery": "../common/jquery/jquery.min",
        "underscore": "../common/underscore/1.7.0/underscore-min.js",
        "react": "../common/react/0.12.2/react.min",
        "JSXTransformer": "../common/react/0.12.2/JSXTransformer",
        "jsx": "../common/react/plugin/jsx",
        "BS.b$": "../js/bs.min",
        "BS.util": "../js/util.min"
    },
    "shim": {
        "jquery": {
            "exports": "$"
        },
        "underscore":{
            "exports" : "_"
        },
        "react":{
            "exports": "React"
        },
        "JSXTransformer": {
            exports: "JSXTransformer"
        },
        "BS.b$":{
            exports: "b$"
        }
    }
});

require(["react", "jsx!List"], function (React, List) {

    alert(typeof react)
    setInterval(function(){
        "use strict";
        React.renderComponent(
            List({date:new Date()}),
            //List(null),
            document.getElementById('example')
        );
    }, 500)

});

require(["BS.b$", "BS.util"], function(b$, u){
    console.log(b$.App.getAppName())
    console.log(u.ConfigClass.domain)
});

#####【2】 bs.js 封装的接口

window.BS.b$ 是访问前缀，简称b$

  1. 本地引擎( b$.pN, b$.pNative ) 获取
  2. 核心插件配置信息 ：b$.pCorePlugin
  3. 内置购买插件IAP配置信息： b$.pIAPPlugin
  4. 内置购买插件IAP的API封装： b$.IAP
  5. 通知（Notice）,调用本地引擎的API接口：b$.Notice
  6. App内容封装，包含了大部分底层API的javascript接口: b$.App
  7. 窗体控制部分javascript API接口: b$.Window
  8. 系统菜单控制部分(包括自定义菜单命令回调)：b$.SystemMenus
  9. 剪贴板的操作：b$.Clipboard
  10. Dock部分的控制: b$.Dock
  11. 二进制扩展部分：b$.Binary
  12. 拖拽功能集成API接口：b$.enablePluginCore
  13. 本地引擎内置的任务队列处理: b$.createTask, b$.sendQueueEvent
  14. 本地引擎提供的打开文件、打开目录，保存文件、定位文件，预览文件的API调用：b$.importFiles，b$.selectOutDir，b$.selectOutFile，b$.revealInFinder，b$.previewFile

**后面，我们将提供简单的例子来说明如何使用

#####【2】util.js 封装的接口

都是些公共方式，bs.js 依赖 util.js 各别函数。

大部分都是历史遗留的功能函数，并不需要过多使用

#**bs.js 及 util.js 开发者完全可以自己再重新组织编写自己的调用底层本地引擎的API **

####示例说明

  1. 系统菜单与javascript的绑定

=== www.romanysoft.com

Add a custom sidebar
Clone this wiki locally