Encapsulate matchgame(web) to a chrome extension

lab/2011/match-game-crx/src/README.md

@@ -0,0 +1 @@
+# MatchGame, my first chrome extension.

lab/2011/match-game-crx/src/assets/js/class/class.js

@@ -0,0 +1,92 @@
+/**
+ * 全局通用接口实现文件
+ */
+(function() {
+  var extflag = {};  // extend flag for avoid init when extending
+  /**
+   * 创建类对象，initialize作为所有类的初始化函数，如果类继承自其他类，
+   * 则初始化函数中可以使用this.superClass([arg0[,arg1...]])调用父类的初始化函数
+   * @return {Function} 返回创建的类对象实体
+   */
+  function Class() {
+    var _class = function() {
+      // avoid call initialize when extending
+      if (arguments[0] != extflag && !!this.initialize)
+        return this.initialize.apply(this, arguments);
+    };
+    _class.extend = extend;
+    _class.implement = implement;
+    return _class;
+  }
+
+  /*
+   * 默认初始化函数
+   * @return {Void}
+   */
+  function initialize() {
+    this.superClass.apply(this, arguments);
+  }
+
+  /*
+   * 模拟实现继承策略，提供子类构造函数调用父类构造函数的接口
+   * @param  {Function} _super  父类对象
+   * @param  {Boolean}  _static 是否继承静态接口
+   * @return {Object}           类的原型对象
+   */
+  function extend(_super, _static) {
+    if (!_super || !isFunction(_super) || !isFunction(this)) return null;
+    // extend static methods
+    if (!!_static)
+      for (var _method in _super)
+        if (isFunction(_super[_method]))
+          this[_method] = _super[_method];
+    // extend instance properties and methods
+    this.superClass = _super;
+    this.supro = _super.prototype;
+    this.prototype = new _super(extflag);
+    this.prototype.constructor = this;
+    this.prototype.initialize = initialize;
+    // for super initialize
+    var _superp = _super;
+    this.prototype.superClass = function() {
+      var _init = _superp.prototype.initialize;
+      _superp = _superp.superClass || _super;
+      return !!_init && _init.apply(this, arguments);
+    };
+    return this.prototype;
+  }
+
+  /*
+   * 模拟实现多继承，将其他类对接口的实现拷贝到当前类
+   * @param  {Function} _args 其他类，参数前面类的实现优先级高
+   * @return {Object}
+   */
+  function implement() {
+    var _this = this.prototype;
+    for (var i = 0, l = arguments.length, _class, _prototype; i < l; i++) {
+      _class = arguments[i];
+      if (!isFunction(_class)) continue;
+      _prototype = _class.prototype;
+      for (var x in _prototype)
+        if (isFunction(_prototype[x]))
+          _this[x] = _prototype[x];
+    }
+    return _this;
+  }
+
+  function isFunction(val) {
+    return Object.prototype.toString.call(val) === '[object Function]';
+  }
+
+  // BAD SMELL
+  if (!Function.prototype.bind) {
+    Function.prototype.bind = function() {
+      var _function = this, _args = arguments, _object = Array.prototype.shift.call(arguments);
+      return function() {
+        Array.prototype.push.apply(arguments, _args);
+        return _function.apply(_object || window, arguments);
+      }
+    }
+  }
+  window.Class = Class;
+})();

lab/2011/match-game-crx/src/assets/js/events/events.js

@@ -0,0 +1,72 @@
+/**
+ * 事件管理接口实现文件
+ */
+var proto;  // class prototype
+// interface
+/**
+ * 事件管理对象
+ * @constructor
+ * @class 事件管理对象
+ */
+var Events = Class();
+proto = Events.prototype;
+/**
+ * 事件管理对象初始化函数
+ * @return {Void}
+ */
+proto.initialize = function() {
+  this.events = {};
+}
+/**
+ * 添加事件
+ * @param  {String}   _type  事件类型，不区分大小写
+ * @param  {Function} _event 事件处理过程
+ * @return {Void}
+ */
+proto.addEvent = function(_type, _event) {
+  if (!_type || !_event || !isFunction(_event)) return null;
+  this.events[_type.toLowerCase()] = _event;
+}
+/**
+ * 批量添加事件
+ * @param  {Object} _event 事件集合
+ * @return {Void}
+ */
+proto.batEvent = function(_event) {
+  if (!_event) return null;
+  for (var p in _event)
+    this.addEvent(p, _event[p]);
+}
+/**
+ * 删除事件
+ * @param  {String} _type 事件类型，不区分大小写
+ * @return {Void}
+ */
+proto.delEvent = function(_type) {
+  if (!_type) return null;
+  delete this.events[_type.toLowerCase()];
+}
+/**
+ * 获取指定类型的事件对象
+ * @param  {String} _type 事件类型，不区分大小写
+ * @return {Function}     事件函数
+ */
+proto.getEvent = function(_type) {
+  return this.events[_type.toLowerCase()] || null;
+}
+/**
+ * 调用事件
+ * @param  {String}   _type 事件类型，不区分大小写
+ * @param  {Variable} [arg0[,arg1...]] 事件可接受参数
+ * @return {Void}
+ */
+proto.dispatchEvent = function() {
+  if (!arguments.length) return null;
+  var _type = Array.prototype.shift.apply(arguments);
+  var _event = this.events[_type.toLowerCase()];
+  if (!!_event) return _event.apply(window, arguments);
+}
+function isFunction(val) {
+  return Object.prototype.toString.call(val) === '[object Function]';
+}
+window.Events = Events;

lab/2011/match-game-crx/src/assets/js/item/item.js

@@ -0,0 +1,121 @@
+/**
+ * 节点项对象基类实现文件
+ */
+var proto;   // class prototype
+/**
+ * 节点项对象基类
+ * @constructor
+ * @class   节点项对象
+ * @param   {String} _tkey 节点模板序列号
+ */
+var Item = Class();
+proto = Item.extend(Events);
+/**
+ * 分配项，如果缓存中有闲置的项则直接取用，否则新建。
+ * @param  {Array|Object} _data    与项个数对应的数据列表
+ * @param  {String|Node}  _parent  父节点ID或者对象
+ * @param  {Object}       _options 可选配置参数，保留参数列表如下
+ *                                 _index_  [Number]  - 如果分配的是列表则该属性用来记录项在当前列表中的索引值，从0开始
+ *                                 _single_ [Boolean] - 强制指定传入的数据作为单项处理
+ *                                 _start_  [Number]  - 指定数据片段的起始位置【包含】
+ *                                 _end_    [Number]  - 指定数据片段的结束位置【不包含】
+ *                                 以上为项分配所需参数，除此之外其他属性为该项重置所需参数
+ * @return {Array|Item}         返回指定数量的项对象,单个数据只返回单个对象
+ */
+Item.allocate = function(_data, _parent, _options) {
+  if (!_data) return null;
+  var _options = _options || {};
+  // single item
+  if (_options._single_ || !$.isArray(_data)) {
+    var _item = !!this.pool
+      && this.pool.shift()
+      || new this();
+    _item._used_ = true;
+    _item.reset(_options);         // reset item param
+    _item.appendToParent(_parent); // append to parent
+    _item.setData(_data);          // reset item data
+    return _item;
+  }
+  // multiple items
+  if (!_data.length) return null;
+  var _arr = [];
+  for (var i = Math.max(0, _options._start_ || 0), k = 0, l = Math.min(
+    _options._end_ != null ? _options._end_ : _data.length, _data.length); i < l; k++, i++) {
+    _options._index_ = k;
+    _arr.push(this.allocate(_data[i], _parent, _options));
+  }
+  return _arr;
+}
+/**
+ * 回收项对象
+ * @param  {Array|Item} _item 项对象或者列表
+ * @return {Void}
+ */
+Item.recycle = function(_item) {
+  if (!_item) return null;
+  // single item
+  if (_item._used_ && (_item instanceof this)) {
+    _item._used_ = false;
+    _item.destroy();
+    this.pool &&
+    this.pool.push(_item);
+    return null;
+  }
+  // multiple items
+  if ($.isArray(_item))
+    for (var i; i = _item.pop(); this.recycle(i));
+  return null;
+}
+/**
+ * 节点项对象基类初始化函数
+ * @param  {String} _tkey 模板序列号
+ * @return {Void}
+ */
+proto.initialize = function(_tkey) {
+  this.superClass();
+  this.body = $(_tkey);
+  this.constructor.pool = this.constructor.pool || [];
+}
+/**
+ * 将节点添加至指定位置
+ * @param  {String|Node} _parent 父节点ID或者对象
+ * @param  {Boolean}     _before 是否在父节点的第一个位置
+ * @return {Void}
+ */
+proto.appendToParent = function(_parent, _before) {
+  this.parent = $(_parent);
+  if (!this.parent || !this.body) return null;
+  !_before ? this.parent.append(this.body)
+    : this.parent.insertBefore(this.body);
+}
+/**
+ * 销毁项
+ * @return {Void}
+ */
+proto.destroy = function() {
+  delete this.data;
+  this.body.detach();
+}
+/**
+ * 获取数据对象
+ * @return {Object} _data 数据对象
+ */
+proto.getData = function() {
+  return this.data || null;
+}
+/**
+ * 设置数据，子类实现具体操作
+ * @param  {Object} _data 数据
+ * @return {Void}
+ */
+proto.setData = function(_data) {
+  this.data = _data || {};
+}
+/**
+ * 项重置，子类实现具体操作
+ * @param  {Object} _options 可选配置参数
+ * @return {Void}
+ */
+proto.reset = function() {
+}
+window.Item = Item;