文章目录
1.生成配置项
表格的create从 core.js开始,默认的配置文件是 config.js , 用户也可以在创建前,通过自定义的配置项来复写相关配置参数;
let extendsetting = common_extend(defaultSetting, setting); // core.js Line38
2.参数初始化
接下来是 Store/server/luckysheetConfigsetting参数初始化
core.js - Line 40-89
3.初始化插件
目前看好像只有一个chart的插件类型(在 expendPlugins/chart),未来不排除其他类型插件的扩展
initPlugins(extendsetting.plugins , extendsetting.data); //core.js Line 92
4.加载function
从 function/functionlist.js里面把表格支持到的各色function加载进来,中英文两套array(locale这个方式是否可以改进?)
functionlist(); //core.js Line 95
5.设置屏幕分辨率
core.js - Line97-101
6.(疑似)加载数据的loading界面
$("#" + container).append(luckysheetlodingHTML()); //core.js Line 104
7.从file获取data(json格式),生成dom元素并注册一堆东西
sheetmanage.initialjfFile(menu, title); //core.js Line 108
7.1. 获取当前显示的sheet 放到 Store.currentSheetIndex
_this.getCurSheet(); // sheetmanage.js Line 585
7.2. 把当前的sheet对应的数据从json拉取到 file里面
(这里的json数据是在 index.html data:[] 里面定义的 )
let file = Store.luckysheetfile[_this.getSheetIndex(Store.currentSheetIndex)]; // sheetmanage.js Line 586
7.3. 从file提取 data
let data = _this.buildGridData(file); // sheetmanage.js Line 588
7.4. 从file获取 Store.luckysheet_select_save
(什么用途,还没研究出来,感觉像是记录上次关闭窗口点击的位置)
sheetmanage.js Line 590-598
7.5. 表格的高和宽分别写入 rowheight/colwidth
sheetmanage.js Line 619-627
7.6. 创建表格的dom元素,HTML脚本主要从 /controllers/constant 拼接整理而来,批注部分从 postil.js 而来
luckysheetcreatedom(colwidth, rowheight, data, menu, title); // sheetmanage.js Line 629
7.7. 设置界面上几个dom的 HoverTip
sheetmanage.js Line 632-633
7.8. 内部函数function ini()
sheetmanage.js Line 632-633
值得一提的是,通过localforage这个javascript的storage增强组件执行init(),通过server.clearcachelocaldata() remove掉缓存数据,然后执行初始化动作。init()里面进一步嵌套一个execF() ,cache加载,页面初始化等逻辑都是在这个函数里面实现。
8.几个大模块的显示隐藏hover效果等
luckysheetsizeauto(); //core.js Line 108
9.初始化工作区
initialWorkBook(); //core.js Line 120
9.1. 定义grid区域的各类人机交互
mousewheel/scroll/mousedown/mouseup/click
luckysheetHandler();//Overall dom initialization - handler.js - Line 62 - 4113
9.2. 定义筛选相关的一大堆click事务处理逻辑
initialFilterHandler();//Filter initialization - filter.js - Line 282 - 1769
9.3. 右键menu对应MatrixOperation 的若干矩阵处理事务
initialMatrixOperation();//Right click matrix initialization - matrixOperation.js - Line 11-1241
9.4. 页面最下面的 sheetbar各类事务处理
initialSheetBar();//bottom sheet bar initialization - sheetBar.js - Line 147 - 463
9.5. 公示栏以及 fx按钮 弹出框的各类事务
formulaBarInitial();//top formula bar initialization - formulaBar.js - Line 20 - 293
9.6. 行列的操作 新增、删除、隐藏、宽高等
rowColumnOperationInitial();//row and coloumn operate initialization - rowColumnOperation.js - Line 36 - 1483
9.7. 键盘相关的事件响应初始化注册,包括ctrl和shift的组合
keyboardInitial();//Keyboard operate initialization - keyboard.js - Line 242 - 917
9.8. menu上面的排序按钮,以及customer排序对话框相关事件
orderByInitial();//menu bar orderby function initialization - orderBy.js - Line 25 - 273