知识点链接:https://blog.csdn.net/lilele12211104/article/details/85011877

https://blog.csdn.net/lilele12211104/article/details/85078357

(持续更新中……)

Chamelon新添项目简略分析:

HTML文件:

1.将以前的control.html页面分开成hardware.html,runtime.html,algorithm.html,timeandspace.html,network_topology.html五个页面。

2.shutdown.html控制模态框。slave.html是runtime.html界面的cpu,mem.disk等资源利用率的饼状图展示。

JS文件:

  • app.js

4-30行,为module “Chameleon” 注入routeProvider,定义路由规则

使用立即执行函数(function(){})(), 具体请参考 https://www.cnblogs.com/yanzp/p/6371292.html

“use strict”,好处和坏处 https://blog.csdn.net/weixin_40387601/article/details/80514358

  • controllers.js

1.第5行,定义了chameleon_app 变量,代表app.js 中angularJS 定义的app。

2.HardwareCtrl控制hardware.html里的元素。RuntimeCtrl,SlaveCtrl,TopologyCtrl其他以此类推,对应相应的html文件。

3.ShutdownCtrl,ShutdownInstanceCtrlClusterOperationCtrl 控制   模态框(关闭所有slave节点)

1.3.2 webui static 界面代码分析

工具介绍:npm

npm的全称是Node Package Manager 是世界上最大的软件注册表,是随同NodeJS一起安装的包管理工具,能解决NodeJS代码部署上的很多问题,常见的使用场景有以下几种:

允许用户从NPM服务器下载别人编写的第三方包到本地使用。
允许用户从NPM服务器下载并安装别人编写的命令行程序到本地使用。
允许用户将自己编写的包或命令行程序上传到NPM服务器供别人使用

https://www.npmjs.cn/     中文网
https://www.npmjs.com/
http://www.runoob.com/nodejs/nodejs-npm.html     菜鸟教程

app.js代码分析:

1.filter :'truncateMesosID'

/**
      * Removes elements from an array and, if necessary, inserts new elements in their place, returning the deleted elements.
      * @param start The zero-based location in the array from which to start removing elements.
      * @param deleteCount The number of elements to remove.
      * @param items Elements to insert into the array in place of the deleted elements.
      */
    splice(start: number, deleteCount: number, ...items: T[]): T[];

/**
      * Adds all the elements of an array separated by the specified separator string.
      * @param separator A string used to separate one element of an array from the next in the resulting String. If omitted, the array elements are separated with a comma.
      */
    join(separator?: string): string;

2..filter :'truncateMesosState'

subString (int beginIndex)  返回一个新的字符串,它是此字符串的一个子字符串。该子字符串始于指定索引处的字符,一直到此字符串末尾。

TASK_struct结构体成员详解
https://blog.csdn.net/bit_clearoff/article/details/54292300

3..filter :'isoDate‘

// Is the given value `NaN`? (NaN is the only number which does not equal itself).
  _.isNaN = function(obj) {
    return _.isNumber(obj) && obj != +obj;
  };

// Add some isType methods: isArguments, isFunction, isString, isNumber, isDate, isRegExp.
each(['Arguments', 'Function', 'String', 'Number', 'Date', 'RegExp'], function(name) {_['is' + name] = function(obj) {return toString.call(obj) == '[object ' + name + ']';};
});

http://www.it1352.com/611622.html   基于ISODate格式的时间查询(Mongodb : Query based on time in ISODate format)

3..filter :'relativeDate‘

/**
  * Converts A string to an integer.
  * @param s A string to convert into a number.
  * @param radix A value between 2 and 36 that specifies the base of the number in numString.       radix介于2和36之间的         值,用于指定numString中数字的基数
  * If this argument is not supplied, strings with a prefix of '0x' are considered hexadecimal. All other strings are considered               decimal.    如果未提供此参数,则前缀为“0x”的字符串将被视为十六进制。所有其他字符串都被视为十进制。

*/
declare function parseInt(s: string, radix?: number): number;

Mesos | 1.3.2 webui static 界面代码分析相关推荐

  1. C语言项目 电话查询系统 哈希表实现(项目要求 + 运行界面 + 代码分析 + 完整代码)

    电话查询系统 1. 项目要求 2. 数据样例 3. 运行界面 4. 代码分析 5. 完整代码 6. 项目报告 关注博主不迷路,博主带你码代码! 1. 项目要求 设每个记录有以下数据项:用户名.电话.地 ...

  2. java主界面设置背景图片_java 窗体设置背景图片问题?(附上登陆界面代码,我想加个背景图片,求大神帮忙改改)...

    java 窗体设置背景图片问题?(附上登陆界面代码,我想加个背景图片,求大神帮忙改改) 关注:223  答案:4  mip版 解决时间 2021-01-26 22:09 提问者非莪莫属 2021-01 ...

  3. android仿微信聊天功能,Android高仿微信聊天界面代码分享

    微信聊天现在非常火,是因其界面漂亮吗,哈哈,也许吧.微信每条消息都带有一个气泡,非常迷人,看起来感觉实现起来非常难,其实并不难.下面小编给大家分享实现代码. 先给大家展示下实现效果图: OK,下面我们 ...

  4. php写的微信聊天界面,Android_Android高仿微信聊天界面代码分享,微信聊天现在非常火,是因其 - phpStudy...

    Android高仿微信聊天界面代码分享 微信聊天现在非常火,是因其界面漂亮吗,哈哈,也许吧.微信每条消息都带有一个气泡,非常迷人,看起来感觉实现起来非常难,其实并不难.下面小编给大家分享实现代码. 先 ...

  5. android 微信高仿,Android高仿微信聊天界面代码分享

    微信聊天现在非常火,是因其界面漂亮吗,哈哈,也许吧.微信每条消息都带有一个气泡,非常迷人,看起来感觉实现起来非常难,其实并不难.下面小编给大家分享实现代码. 先给大家展示下实现效果图: OK,下面我们 ...

  6. # java swing,awt图形化界面代码案例合集

    文章目录 java awt,swing图形化界面代码案例合集 java awt,swing图形化界面代码案例合集 package Demo1; import java.awt.*; public cl ...

  7. java窗体背景图片_java 窗体设置背景图片问题 (附上登陆界面代码,我想加个背景图...

    该楼层疑似违规已被系统折叠 隐藏此楼查看此楼 java 窗体设置背景图片问题 (附上登陆界面代码,我想加个背景图片,求大神帮忙改改) package com.qx; import java.awt.D ...

  8. (转)flex中使用swc实现更好的界面代码分离

    flex中使用swc实现更好的界面代码分离 转自:http://www.cnblogs.com/yjmyzz/archive/2010/07/26/1785265.html 前几天写过一篇" ...

  9. static{}静态代码块与{}普通代码块和构造代码块之间的区别

    public class TestStatic {{System.out.println("构造代码块");}TestStatic() {System.out.println(&q ...

最新文章

  1. linux 打印函数宏,linux内核中的嵌入式汇编宏函数
  2. 关于按键消抖以及LED灯控制的一个实例
  3. c在linux中怎样执行文件,如何在Linux中编译和运行C/C+程序,简单示例教懂你
  4. 使用工具远程连接服务器 顺便抛个砖
  5. exadata磁盘组无法mount恢复---惜分飞
  6. Equipment download - No data contained in BDoc
  7. cdatabase读取excel第一行数据_pandas读取excel数据并对重复数据进行标记或者删除
  8. PostgreSQL的Checkpoint 发生的时机
  9. 【转】进阶 JavaScript 必知的 33 个点【进阶必备】
  10. C++ 类的知识 | 构造函数再探、匿名对象、友元函数、内部类、类的const成员、类的static成员
  11. NAT与DHCP协议
  12. [连载型] Neutron 系列 (15): OpenStack 是如何实现 Neutron 网络 和 Nova虚机 防火墙的...
  13. CAN总线技术 | 物理层02 - CAN总线的异步串行通讯
  14. 带滤镜拍照的app_自拍也有大讲究,选对滤镜才能美美美!
  15. python内置对象是什么_Python的内置对象类型——元组、文件,python
  16. Python+OpenCV:特征匹配(Feature Matching)
  17. 方维出现 Fatal error: Class 'Session' not found
  18. fanuc服务器显示8,FANUC伺服驱动器报故障数字8的维修一看就懂
  19. win10专业版开机画面模糊_怎么解决win10专业版字体模糊发虚的教程
  20. linux bonding技术,Linux主机bonding的配置-采用主备模式-服务器系统-开发文档

热门文章

  1. Vue项目中ico问题
  2. 通信总线协议五 :CAN
  3. MySQL数据库创建用户及授权
  4. 算法导论中LCS的C++实现程序
  5. CISCO服务器配置RAID步骤
  6. laravel 手动创建分页器LengthAwarePaginator
  7. synchronized同步锁原理详解
  8. 程序员转行能做什么?
  9. win10计算机联接多个网络,如何设置win10电脑连接两个显示器?
  10. 某游戏公司测试工程师面试题