天天看点

我自己写的JS类库

以前就想把自己经常用到的JS写成一个类库,不过一直都是断断续续,这几天终于有了时间,所以整理了下。

借此机会发出来,欢迎喜欢研究JS的朋友拍砖!

这个JS类库里面有一些基础部分参考了Prototype(其它的JS框架没有研究过)

不过注释基本都没有去写,以后如果有机会就加上。

主要包括以下部分:

  1. 类库的基础方法
  2. DOM操作
  3. AJAX类
  4. 弹框类(基础)
  5. 拖拽类
  6. 缩放类
  7. 样式渐变类(width,height,opacity,color...只要可以有渐变特性的都行)
  8. 滑动门类(主要是和页面代码分开,而且添加了一个clallback,可以做出更多的特效)

/*********************************************************

/*

/* Danica7773 JavaScript framework, version 1.0

/*

*********************************************************/

var $ = function(id) {

return (typeof(id) == 'string') ? document.getElementById(id) : id;

}

var $Head = function() {

return document.getElementsByTagName('head')[0];

}

var $Body = function() {

return document.getElementsByTagName('body')[0];

}

var $CreateClass = function() {

return function() {

return this.init.apply(this, arguments);

}

}

var $Array = function(list) {

var _array = [];

for(var i = 0; i < list.length; i++) {

_array.push(list[i]);

}

return _array;

}

var $Extend = function(destination, source) {

for(each in source) {

destination[each] = source[each];

}

return destination;

}

var $CreateElement = function(param) {

var _element = document.createElement(param.tag);

if(param.att) {

$Extend(_element, param.att);

}

if(param.style) {

$Extend(_element.style, param.style);

}

if(param.content) {

_element.innerHTML = param.content;

}

if(param.parent) {

param.parent.appendChild(_element);

}

return _element;

}

var $Bind = function(method, handler, flag) {

var _arg = $Array(arguments);

_arg.splice(0,3);

if(flag) {

return function(ev) {

return method.apply(handler, [(window.event || ev)].concat(_arg));

}

} else {

return function() {

return method.apply(handler, _arg);

}

}

}

/**********************************************************/

var $break = new Object();

var $continue = new Object();

var Base = {

each: function(selector) {

var _arg = $Array(arguments);

_arg.shift();

try {

this._each(function(listItem, index) {

try {

selector.apply(this, [listItem, index].concat(_arg));

} catch(e) {

if(e != $continue) {

throw e;

}

}

})

} catch(e) {

if(e != $break) {

throw e;

}

}

},

include: function(compare) {

var _index = -1;

this.each(function(listItem, index) {

if(compare == listItem) {

_index = index;

throw $break;

}

})

return _index;

},

firstCompare: function(selector) {

var _index = -1;

var _result;

this.each(function(listItem, index) {

_result = selector(listItem, index);

if(_result) {

_index = index;

throw $break;

}

})

return _index;

},

result: function(selector) {

var _array = [];

var _result;

this.each(function(listItem, index) {

_result = selector(listItem, index);

if(_result) {

_array.push(_result);

}

})

return _array;

},

compare: function(selector) {

var _array = [];

var _result;

this.each(function(listItem, index) {

_result = selector(listItem, index);

if(_result) {

_array.push(listItem);

}

})

return _array;

},

merge: function(list) {

var _list = this.concat(list);

var _array = [];

var _temp = {};

_list.each(function(listItem, index) {

if(!_temp[listItem]) {

_temp[listItem] = 1;

_array.push(listItem);

}

})

return _array;

},

delSame: function(list)

{

var _array = [];

var _isHave;

this.each(function(listItem, index) {

_isHave = arr.include(listItem);

if(_isHave < 0) {

_array.push(listItem);

}

})

return _array;

},

max: function(selector){

var _compare;

var _temp;

this.each(function(listItem, index) {

_temp = selector(listItem, index);

if(_temp >= (_compare || _temp)) {

_compare = _temp;

}

})

return _compare;

},

min: function(selector){

var _compare;

var _temp;

this.each(function(listItem, index) {

_temp = selector(listItem, index);

if(_temp <= (_compare || _temp)) {

_compare = _temp;

}

})

return _compare;

}

}

/****************************************************************/

var $Browser = {

type: function(name) {

var _v = false;

var _ua = navigator.userAgent.toLowerCase();

var _name = name.toLowerCase();

switch(_name) {

case 'ie':

_v = window.ActiveXObject ? _ua.match(/msie ([/d.]+)/)[1] : false;

break;

case 'ff':

_v = document.getBoxObjectFor ? _ua.match(/firefox//([/d.]+)/)[1] : false;

break;

case 'chrome':

_v = (window.MessageEvent && !document.getBoxObjectFor) ? _ua.match(/chrome//([/d.]+)/)[1] : false;

break;

case 'opera':

_v = window.opera ? _ua.match(/opera.([/d.]+)/)[1] : false;

break;

case 'safari':

_v = window.openDatabase ? _ua.match(/version//([/d.]+)/)[1] : false;

}

return _v;

},

w: window.screen.width,

h: window.screen.height

}

/******************************************************************/

var $Page = {

scrollTop:function() {

var _scrollPos;

_scrollPos = (typeof(window.pageYOffset) != 'undefined') ? window.pageYOffset :

(typeo(document.compatMode) != 'undefined' && document.compatMode != 'BackCompat')? document.documentElement.scrollTop :

(typeof(document.body) != 'undefined')? document.body.scrollTop : 0;

return _scrollPos;

},

size:function() {

var _pw = [document.body.offsetWidth,

document.documentElement.offsetWidth,

document.body.scrollWidth,

document.documentElement.scrollWidth].max(function(listItem) {return (listItem)? listItem : 0;});

var _ph = [document.body.offsetHeight,

document.documentElement.offsetHeight,

document.body.scrollHeight,

document.documentElement.scrollHeight].max(function(listItem) {return (listItem)? listItem : 0;});

var _sw = (document.documentElement && document.documentElement.clientWidth) ? document.documentElement.clientWidth : document.body.clientWidth;

var _sh = (document.documentElement && document.documentElement.clientHeight) ? document.documentElement.clientHeight : document.body.clientHeight;

return {PW: _pw, PH: _ph, VW:_sw, VH: _sh}

}

}

/*************************************************************/

$Extend(Array.prototype, Base);

$Extend(Array.prototype, {

_each: function(selector) {

for(var i = 0; i < this.length; i++) {

selector(this[i], i);

}

},

toQueryString: function() {

var _array = [];

this.each(function(listItem) {

_array.push(encodeURIComponent(listItem[0]) + '=' + encodeURIComponent(listItem[1]));

})

return _array.join('&');

}

})

/**************************************************************/

$Extend(String.prototype, {

rewriteStyleName: function() {

var _name = this.split('-');

if(_name.length == 1) {

return _name[0];

}

var _fristName = _name.shift();

_name.each(function(listItem, index) {

_name[index] = listItem.substr(0, 1).toUpperCase() + listItem.substr(1);

})

_name.unshift(_fristName);

return _name.join('');

},

trim: function() {

return this.replace(/(^/s*)|(/s*$)/g,"");

},

part:function() {

var _temp = this;

var _english = 0; //英文个数

var _chinese = 0; //汉字个数

var _number = 0; //数字个数

var _special = 0; //特殊字符个数

var _total = 0; //字符串总长(中文为两个字长)

if(_temp.length > 0) {

_temp.split('').each(function(listItem) {

if(listItem.match(/[A-Za-z]/) != null) {

_english += 1;

} else if(listItem.match(/[^/x00-/xff]/) != null) {

_chinese += 1;

_total += 1;

} else if(listItem.match(/[0-9]/) != null) {

_number += 1;

} else {

_special += 1;

}

_total += 1;

})

}

return{E: _english, C: _chinese, N: _number, S: _special, T: _total};

},

toQueryParam: function() {

var _param = this.match(/^/??(.*)$/)[1].split('&');

var _subParam;

var _queryParam = {};

_param.each(function(listItem) {

_subParam = listItem.split('=');

_queryParam[_subParam[0]] = _subParam[1];

})

return _queryParam;

}

})

/*****************************************************/

var Element = {

init: function(id) {

this.element = $(id);

return this;

},

pos: function() {

var _x = this.element.offsetLeft;

var _y = this.element.offsetTop;

var _obj = this.element;

while(_obj.offsetParent) {

_obj = _obj.offsetParent;

_x += _obj.offsetLeft;

_y += _obj.offsetTop;

}

return {X: _x, Y: _y};

},

update: function(html) {

this.element.innerHTML = html;

},

insert: function(newNode, oldNode) {

if(typeof(oldNode) == 'undefined') {

this.element.appendChild(newNode);

} else {

this.element.insertBefore(newNode, oldNode);

}

},

remove: function() {

this.removeAllEvents(this.element);

this.element.parentNode.removeChild(this.element);

},

removeAllEvents: function(node) {

this.removeEvents(node);

if(node.firstChild) {

var _node = node.firstChild;

while(_node) {

if(_node.nodeType == 1) {

this.removeAllEvents(_node);

}

_node = _node.nextSibling;

}

}

},

removeEvents: function(node) {

for(var each in node) {

if(typeof(node[each]) === 'function') {

node[each] = null;

}

}

},

att: function(key, value) {

var _key = ($Browser.type('ie') && key == 'class')? 'className' : key;

if(typeof(value) == 'undefined') {

this.element.getAttribute(_key);

} else {

this.element.setAttribute(_key, value);

}

},

haveAtt: function(key, value, vSplit) {

var _value = this.att(key);

var _vSplit = (typeof(vSplit) == 'undefined')? ' ' : vSplit;

if(_value && _value.length > 0) {

var _oldValue = _value.split(_vSplit);

var _newValue = _oldValue.merge(value.split(_vSplit));

if(_oldValue.length == _newValue.length) {

return true;

}

}

return false;

},

addAtt: function(key, value, vSplit) {

var _value = this.att(key);

var _vSplit = (typeof(vSplit) == 'undefined')? ' ' : _vSplit;

var _oldValue = (_value == '' || _value == null) ? [] : _value.split(_vSplit);

this.att(key, _oldValue.merge(value.split(_vSplit)).join(_vSplit));

},

delAtt: function(key, value, vSplit) {

var _value = this.att(key);

var _vSplit = (typeof(vSplit) == 'undefined')? ' ' : _vSplit;

if(_value != '' && _value != null) {

if(typeof(value) == 'undefined') {

this.att(key, '');

} else {

this.att(key, _value.split(_vSplit).delSame(value.split(_vSplit)).join(_vSplit));

}

}

},

getStyle: function(style) {

var _value = this.element.style[style.rewriteStyleName()];

if (!_value) {

if (document.defaultView && document.defaultView.getComputedStyle) {

var _css = document.defaultView.getComputedStyle(this.element, null);

_value = _css ? _css.getPropertyValue(style) : null;

} else if(this.element.currentStyle) {

_value = this.element.currentStyle[style.rewriteStyleName()];

}

}

if(window.opera && ['left', 'top', 'right', 'bottom'].include(style) >= 0) {

if(this.getStyle('position') == 'static') {

_value = 'auto';

}

}

return (_value == 'auto') ? null : _value;

},

setStyle: function(style) {

$Extend(this.element.style, style);

},

getOpacity:function() {

var _temp = 0

if($Browser.type('ie')) {

_temp = this.getStyle("filter");

_temp = (_temp == "" || _temp == null)? 100 :

(_temp.match(/alpha/(opacity=(.*)/)/))? _temp.match(/alpha/(opacity=(.*)/)/)[1] : 100;

} else {

_temp = !isNaN(this.getStyle("opacity")) ? this.getStyle("opacity") * 100 : 100;

}

return parseInt(_temp);

},

setOpacity:function(value) {

var _v = (value > 100)? 100 : (value < 0)? 0 : value;

if($Browser.type('ie')) {

this.setStyle({filter: "alpha(opacity="+_v+")"});

} else {

this.setStyle({opacity: (_v / 100)});

}

},

addEvent: function(type, fun) {

if(this.element.addEventListener) {

this.element.addEventListener(type, fun, false);

} else if(this.element.attachEvent) {

this.element.attachEvent('on' + type, fun);

}

},

removeEvent: function(type, fun) {

if(this.element.removeEventListener) {

this.element.removeEventListener(type, fun, false);

} else if(this.element.detachEvent) {

this.element.detachEvent('on' + type, fun);

}

}

}

/************************************************************/

var $Element = function(id) {

return Element.init(id);

}

/************************************************************/

Element.Form = {

members: function() {

return $Array(this.element.elements);

},

queryString: function() {

var _list = this.members();

var _array = [];

var _name = [];

var _value;

_list.each(function(listItem, index) {

var _itemName = listItem.name;

if(_name.include(_itemName) < 0) {

_name.push(_itemName);

_value = $Element(listItem).getValue()

if(_value) {

_array.push([_itemName, _value]);

}

}

})

return _array.toQueryString();

}

}

$Extend(Element, Element.Form)

/***************************************************************/

Element.Form.Member = {

txtValue: function() {

return this.element.value;

},

downListValue: function() {

var _array = [];

var _list = $Array(this.element.options);

_list.each(function(listItem, index, obj){

if(listItem.selected || (obj.selectedIndex == index)) {

_array.push((listItem.value)? listItem.value : listItem.text);

}

}, this.element)

return _array.join('|');

},

selectValue: function() {

var _list = $Array(document.getElementsByName(this.element.name));

var _array = [];

_list.each(function(listItem, index) {

if(listItem.checked) {

_array.push(listItem.value);

}

})

return _array.join('|');

},

getValue: function(flag) {

var _type = (this.element.type) ? this.element.type : this.element.nodeName.toLowerCase();

if(_type == 'textarea' || _type == 'text' || _type == 'password' || _type == 'hidden') {

return this.txtValue();

} else if((_type == 'submit' || _type == 'button' || _type == 'reset') && flag) {

return this.txtValue();

} else if(_type == 'checkbox' || _type == 'radio') {

return this.selectValue();

} else if(_type == 'select') {

return this.downListValue();

} else {

return null;

}

},

addOption: function(value, text) {

var _option = document.createElement('option');

_option.value = value;

_option.text = text;

this.element.options.add(_option);

},

delOption: function(flag, v)

{

var _v;

if(flag.toLowerCase() == 'index') {

var _len = this.element.options.length;

_v = (v < 1)? 1 : (v > _len)? _len : v;

this.element.remove(v - 1);

} else {

var _list = $Array(this.element.options);

_list.each(function(listItem, index, obj){

_v = (flag.toLowerCase() == 'value') ? listItem.value : listItem.text;

if(_v == v) {

obj.remove(index);

throw $break;

}

}, this.element)

}

},

delAllOptions: function() {

while(this._obj.options.length != 0) {

this.element.remove(0);

}

}

}

$Extend(Element, Element.Form.Member)

/*****************************************************************/

var Event = {

init: function(ev) {

this.ev = ev;

this.isIE = $Browser.type('ie');

return this;

},

target: function() {

return (this.isIE)? this.ev.srcElement : this.ev.target;

},

to: function() {

return (this.isIE)? this.ev.toElement : this.ev.relatedTarget;

},

from: function() {

return (this.isIE)? this.ev.fromElement : this.ev.relatedTarget;

},

pos: function() {

var _x = this.ev.pageX || (this.ev.clientX + (document.documentElement.scrollLeft || document.body.scrollLeft));

var _y = this.ev.pageY || (this.ev.clientY + (document.documentElement.scrollTop || document.body.scrollTop));

return {X: _x, Y: _y};

},

inFstop:function() {

if(this.ev.stopPropagation) {

this.ev.stopPropagation();

} else {

this.ev.cancelBubble = true;

}

},

inFabort:function() {

if(this.ev.preventDefault) {

this.ev.preventDefault();

} else {

this.ev.returnValue = false;

}

}

}

/***********************************************************************/

var $Event = function(ev) {

return Event.init(ev);

}

/***********************************************************************/

var Ajax = $CreateClass();

Ajax.prototype = {

init: function(op) {

this.option = {

url: '',

method: 'get', //[get|post]

postData: null,

postType: 'text', //[text|xml|json]

sendHeader: [], //[["Content-Type","application/x-www-form-urlencoded"], ...]

valueType: 'text', //[text|xml|json]

delayTime: 10, //Timeout(Unit: s)

cache: false, //[true|false]

workState: true, //[true|false]

onLoading: null, //[function|null]

onSuccess: null,

onFailure: null

};

$Extend(this.option, op);

this.xmlHttp = this.createXMLHttp();

this.timeOut = null;

this.sendRequest();

},

createXMLHttp: function() {

var _xmlHttpTemp = null;

try{

if(window.XMLHttpRequest) {

_xmlHttpTemp = new XMLHttpRequest();

} else if(window.ActiveXObject) {

var _activeXObj = ['Microsoft.XMLHTTP', 'MSXML.XMLHTTP', 'Microsoft.XMLHTTP', 'Msxml2.XMLHTTP.7.0', 'Msxml2.XMLHTTP.6.0', 'Msxml2.XMLHTTP.5.0', 'Msxml2.XMLHTTP.4.0', 'MSXML2.XMLHTTP.3.0', 'MSXML2.XMLHTTP'];

_activeXObj.each(function(listItem, index){

_xmlHttpTemp = new ActiveXObject(listItem);

if(_xmlHttpTemp) {

throw $break;

}

})

}

} catch(e) {

this.failure(e);

}

return _xmlHttpTemp;

},

sendHeader: function() {

if(!this.option.cache) {

this.option.sendHeader.push(["Cache-Control","no-cache"]);

}

var _method = this.option.method.toLowerCase();

if(_method == 'post') {

switch(this.option.postType.toLowerCase()) {

case 'text':

this.option.sendHeader.push(['content-length', this.option.postData.length]);

this.option.sendHeader.push(['Content-Type', 'application/x-www-form-urlencoded']);

break;

case 'xml':

this.option.sendHeader.push(['content-length', this.option.postData.length]);

this.option.sendHeader.push(['Content-Type', 'application/xml;text/xml']);

break;

case 'json':

this.option.sendHeader.push(['Content-Type', 'application/json;charset=utf-8']);

break;

}

}

if(this.option.sendHeader.length >= 1) {

for(var i = 0; i < this.option.sendHeader.length; i++) {

this.xmlHttp.setRequestHeader(this.option.sendHeader[i][0], this.option.sendHeader[i][1]);

}

}

},

setDelayTime: function() {

if(this.option.delayTime > 0) {

var _delay = $Bind(this.stopRequest ,this, false);

this.timeOut = setTimeout(_delay, this.option.delayTime*1000);

}

},

getURL: function() {

var _url = this.option.url;

if(!this.option.cache) {

_url += (_url.indexOf("?") == -1)? "/?random=" + Math.random() : "/&random=" + Math.random();

}

return _url;

},

loading: function(v) {

if(this.option.onLoading) {

this.option.onLoading(v);

}

},

success: function(v) {

if(this.option.onSuccess) {

this.option.onSuccess(v);

}

},

failure: function(v) {

if(this.option.onFailure) {

this.option.onFailure(v);

}

},

callBack: function() {

if(this.xmlHttp.readyState < 4) {

this.loading('正在发送请求......');

} else {

clearTimeout(this.timeOut);

if(this.xmlHttp.status == 200 || this.xmlHttp.status == 0) {

this.success(this.getData());

} else {

this.failure(this.xmlHttp.status);

}

}

},

getData: function() {

switch(this.option.valueType.toLowerCase()) {

case 'text':

return this.xmlHttp.responseText;

case 'json':

return eval("("+ this.xmlHttp.responseText +")");

case 'xml':

return this.xmlHttp.responseXML;

default:

return null;

}

},

sendRequest: function() {

try{

var _self = this;

this.xmlHttp.open(this.option.method.toUpperCase(), this.getURL(), this.option.workState);

this.sendHeader();

this.setDelayTime();

this.xmlHttp.onreadystatechange = $Bind(this.callBack, this, false);

this.xmlHttp.send(this.option.postData);

} catch(e) {

this.failure(e);

}

},

stopRequest: function() {

this.xmlHttp.abort();

this.xmlHttp = null;

this.failure("请求超时!");

}

}

/*************************************************************/

var loadScript = $CreateClass();

loadScript.prototype = {

init: function(scriptSrc, scriptID, parent, callBack) {

this.scriptSrc = scriptSrc;

this.scriptID = scriptID;

this.parent = parent;

this.callBack = (typeof(callBack) == 'undefined')? function(){} : callBack;

this.createScript();

},

createScript: function() {

var _self = this;

var _scriptOld = document.getElementById(this.scriptID);

if(_scriptOld) {

_scriptOld.parentNode.removeChild(_scriptOld);

}

var _script = document.createElement('script');

_script.type = 'text/javascript';

_script.id = this.scriptID;

_script.src = this.scriptSrc;

if($Browser.type('ie')) {

_script.onreadystatechange = function() {

if(/(complete|loaded)/.test(this.readyState)) {

_self.callBack(_self.scriptID);

}

}

} else {

_script.onload = function() {

_self.callBack(_self.scriptID);

}

}

this.parent.appendChild(_script);

}

}

/************************************************************/

/*

/*element selector

/*Basic Mode: id, tag, [attKey(=|==|!==|!=)attValue], tag[attKey(=|==|!==|!=)attValue]

/*the connection is [>| ]

/*the > is mean that the back mode is the front mode's childNodes

/*the ' ' is mean that the back mode is the front mode's getElementsByTagName

/*=: include; ==: equal; !==: not equal; !=: not include;

/*set attvalue is empty('') if the attValue is null

/*if (attKey == '') is true, the attribute is not exist

/*if (attKey !== '') is true, the attribute is exist

*/

var Selector = {

init:function(selector) {

this.selector = selector;

this.list = null;

this.flag = -1;

return this.finish();

},

finish: function() {

while(this.selector.length != 0) {

this.itemSelector();

}

return (this.list && this.list.length == 1)? this.list[0] : this.list;

},

itemSelector: function() {

var _Flag1 = this.selector.indexOf(' ');

var _Flag2 = this.selector.indexOf('>');

var selectorItem;

if(_Flag1 == _Flag2) {

_selectorItem = this.selector;

this.selector = '';

this.list = this.selectorType(_selectorItem);

} else if(_Flag1 == 0 || _Flag2 == 0) {

this.flag = (_Flag1 == 0)? 0 : 1; //0是所有子代;1是直接子代

this.selector = this.selector.substr(1);

} else {

var _n = (Math.min(_Flag1, _Flag2) > 0)? Math.min(_Flag1, _Flag2) : Math.max(_Flag1, _Flag2);

_selectorItem = this.selector.substr(0, _n);

this.selector = this.selector.substr(_n);

this.list = this.selectorType(_selectorItem);

}

},

selectorType: function(selectorItem) {

var _matches;

if((/^#/S+$/).test(selectorItem)) {

return this.byID(selectorItem.substr(1));

} else if((/^[A-Za-z]{1,8}[1|2|3|4|5|6|7]{0,1}$/).test(selectorItem)) {

return this.byTag(selectorItem);

} else if((/^/[(/w+)([=|!]{1,2})(/w*)]$/).test(selectorItem)) {

return this.getTagList('*', selectorItem);

} else if((_matches = (selectorItem).match(/^([A-Za-z]{1,8}[1|2|3|4|5|6|7]{0,1})(/[(/w+)([=|!]{1,3})([/w/|]*)])$/)) != null) {

return this.getTagList(_matches[1], _matches[2]);

} else {

return null;

}

},

getTagList: function(tag, sItem) {

_matches = sItem.match(/^/[(/w+)([=|!]{1,3})([/w/|]*)]$/)

var _attKey = _matches[1];

var _attFlag = _matches[2];

var _attValue = _matches[3];

switch(_attFlag) {

case '=':

_attFlag = 2; break; //include

case '==':

_attFlag = 1; break; //equal

case '!==':

_attFlag = -1; break; //not equal

case '!=':

_attFlag = -2; break; //not include

default:

return null;

}

this.list = this.byTag(tag);

return this.byAtt(_attKey, _attFlag, _attValue);

},

byID: function(sItem) {

return (document.getElementById(sItem))? [document.getElementById(sItem)] : null;

},

byTag: function(sItem) {

var _array = null;

if(this.flag == -1) {

this.list = [document];

_array = this.byTag2(sItem);

return _array;

}

if(this.list == null) {

return null;

}

return this.byTag2(sItem);

},

byTag2: function(sItem) {

_array = [];

_temp = [];

this.list.each(function(listItem, index, flag) {

_temp = $Array(listItem.getElementsByTagName(sItem));

if(flag != 0 && flag != -1) {

_temp = _temp.compare(function(listItem2) {

return (listItem2.parentNode == listItem) ? true : false;

})

}

_array = _array.concat(_temp);

}, this.flag)

return (_array.length == 0)? null : _array;

},

byAtt: function(attKey, attFlag, attValue) {

var _array = null;

if(this.list == null) {

return _array;

}

_array = [];

var _attKey = (document.all && attKey == 'class')? 'className' : attKey;

this.list.each(function(listItem){

var _attValueTemp = listItem.getAttribute(_attKey);

if(_attValueTemp == null) {

_attValueTemp = '';

}

if(_attValueTemp.length == 0) {

if(attFlag == 1 && attValue.length == 0) {

_array.push(listItem);

} else if(attFlag == -1 && attValue.length > 0) {

_array.push(listItem);

}

} else {

if(attFlag == 1 && _attValueTemp == attValue) {

_array.push(listItem);

} else if(attFlag == -1 && _attValueTemp != attValue) {

_array.push(listItem);

} else {

var _dArr = _attValueTemp.split(' ');

var _sArr = _dArr.merge(attValue.split('|'));

if(attFlag == -2 && _sArr.length != _dArr.length) {

_array.push(listItem);

} else if(attFlag == 2 && _sArr.length == _dArr.length) {

_array.push(listItem);

}

}

}

})

return (_array.length == 0)? null : _array;

}

}

/****************************************************************************/

var $Selector = function(selector)

{

return Selector.init(selector);

}

/****************************************************************************/

var Tween = {

Linear: function(t,b,c,d){ return c*t/d + b; },

Quad: {

easeIn: function(t,b,c,d){

return c*(t/=d)*t + b;

},

easeOut: function(t,b,c,d){

return -c *(t/=d)*(t-2) + b;

},

easeInOut: function(t,b,c,d){

if ((t/=d/2) < 1) return c/2*t*t + b;

return -c/2 * ((--t)*(t-2) - 1) + b;

}

},

Cubic: {

easeIn: function(t,b,c,d){

return c*(t/=d)*t*t + b;

},

easeOut: function(t,b,c,d){

return c*((t=t/d-1)*t*t + 1) + b;

},

easeInOut: function(t,b,c,d){

if ((t/=d/2) < 1) return c/2*t*t*t + b;

return c/2*((t-=2)*t*t + 2) + b;

}

},

Quart: {

easeIn: function(t,b,c,d){

return c*(t/=d)*t*t*t + b;

},

easeOut: function(t,b,c,d){

return -c * ((t=t/d-1)*t*t*t - 1) + b;

},

easeInOut: function(t,b,c,d){

if ((t/=d/2) < 1) return c/2*t*t*t*t + b;

return -c/2 * ((t-=2)*t*t*t - 2) + b;

}

},

Quint: {

easeIn: function(t,b,c,d){

return c*(t/=d)*t*t*t*t + b;

},

easeOut: function(t,b,c,d){

return c*((t=t/d-1)*t*t*t*t + 1) + b;

},

easeInOut: function(t,b,c,d){

if ((t/=d/2) < 1) return c/2*t*t*t*t*t + b;

return c/2*((t-=2)*t*t*t*t + 2) + b;

}

},

Sine: {

easeIn: function(t,b,c,d){

return -c * Math.cos(t/d * (Math.PI/2)) + c + b;

},

easeOut: function(t,b,c,d){

return c * Math.sin(t/d * (Math.PI/2)) + b;

},

easeInOut: function(t,b,c,d){

return -c/2 * (Math.cos(Math.PI*t/d) - 1) + b;

}

},

Expo: {

easeIn: function(t,b,c,d){

return (t==0) ? b : c * Math.pow(2, 10 * (t/d - 1)) + b;

},

easeOut: function(t,b,c,d){

return (t==d) ? b+c : c * (-Math.pow(2, -10 * t/d) + 1) + b;

},

easeInOut: function(t,b,c,d){

if (t==0) return b;

if (t==d) return b+c;

if ((t/=d/2) < 1) return c/2 * Math.pow(2, 10 * (t - 1)) + b;

return c/2 * (-Math.pow(2, -10 * --t) + 2) + b;

}

},

Circ: {

easeIn: function(t,b,c,d){

return -c * (Math.sqrt(1 - (t/=d)*t) - 1) + b;

},

easeOut: function(t,b,c,d){

return c * Math.sqrt(1 - (t=t/d-1)*t) + b;

},

easeInOut: function(t,b,c,d){

if ((t/=d/2) < 1) return -c/2 * (Math.sqrt(1 - t*t) - 1) + b;

return c/2 * (Math.sqrt(1 - (t-=2)*t) + 1) + b;

}

},

Elastic: {

easeIn: function(t,b,c,d,a,p){

if (t==0) return b; if ((t/=d)==1) return b+c; if (!p) p=d*.3;

if (!a || a < Math.abs(c)) { a=c; var s=p/4; }

else var s = p/(2*Math.PI) * Math.asin (c/a);

return -(a*Math.pow(2,10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )) + b;

},

easeOut: function(t,b,c,d,a,p){

if (t==0) return b; if ((t/=d)==1) return b+c; if (!p) p=d*.3;

if (!a || a < Math.abs(c)) { a=c; var s=p/4; }

else var s = p/(2*Math.PI) * Math.asin (c/a);

return (a*Math.pow(2,-10*t) * Math.sin( (t*d-s)*(2*Math.PI)/p ) + c + b);

},

easeInOut: function(t,b,c,d,a,p){

if (t==0) return b; if ((t/=d/2)==2) return b+c; if (!p) p=d*(.3*1.5);

if (!a || a < Math.abs(c)) { a=c; var s=p/4; }

else var s = p/(2*Math.PI) * Math.asin (c/a);

if (t < 1) return -.5*(a*Math.pow(2,10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )) + b;

return a*Math.pow(2,-10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )*.5 + c + b;

}

},

Back: {

easeIn: function(t,b,c,d,s){

if (s == undefined) s = 1.70158;

return c*(t/=d)*t*((s+1)*t - s) + b;

},

easeOut: function(t,b,c,d,s){

if (s == undefined) s = 1.70158;

return c*((t=t/d-1)*t*((s+1)*t + s) + 1) + b;

},

easeInOut: function(t,b,c,d,s){

if (s == undefined) s = 1.70158;

if ((t/=d/2) < 1) return c/2*(t*t*(((s*=(1.525))+1)*t - s)) + b;

return c/2*((t-=2)*t*(((s*=(1.525))+1)*t + s) + 2) + b;

}

},

Bounce: {

easeIn: function(t,b,c,d){

return c - Tween.Bounce.easeOut(d-t, 0, c, d) + b;

},

easeOut: function(t,b,c,d){

if ((t/=d) < (1/2.75)) {

return c*(7.5625*t*t) + b;

} else if (t < (2/2.75)) {

return c*(7.5625*(t-=(1.5/2.75))*t + .75) + b;

} else if (t < (2.5/2.75)) {

return c*(7.5625*(t-=(2.25/2.75))*t + .9375) + b;

} else {

return c*(7.5625*(t-=(2.625/2.75))*t + .984375) + b;

}

},

easeInOut: function(t,b,c,d){

if (t < d/2) return Tween.Bounce.easeIn(t*2, 0, c, d) * .5 + b;

else return Tween.Bounce.easeOut(t*2-d, 0, c, d) * .5 + c*.5 + b;

}

}

}

/*****************************************************************/

/**

* var op = {

* id: '',

* cName: '',

* size: [0, 0],

* mask: true,

* pos: [0, 0],

* shadow: 5,

* move: true, true | false | [1024, 768]

* resize: {minSize: [], maxSize: [], limit: []}, false | {minSize: [], maxSize: [], limit: []}

* title: '',

* content: '',

* createCallBack: function(){},

* closeCallBack: function(){}

* }

*/

var Dialog = $CreateClass();

Dialog.prototype = {

init: function(op) {

this.id = op.id;

this.cName = op.cName;

this.size = op.size;

this.pos = op.pos;

this.shadow = op.shadow;

this.mask = op.mask;

this.move = op.move;

this.resize = op.resize;

this.title = op.title;

this.content = op.content;

this.createCallBack = (typeof(op.openCallBack) == 'function') ? op.openCallBack : false;

this.closeCallBack = (typeof(op.closeCallBack) == 'function') ? op.closeCallBack : false;

},

create: function() {

if($(this.id + '_container')) {

this.remove();

}

var _pageSize = $Page.size();

if(this.mask) {

var _mask = $CreateElement({

tag: 'div',

att: {id: this.id + '_mask', className: this.cName + '_mask'},

style: {width:_pageSize.PW + 'px', height: _pageSize.PH + 'px',

position: 'absolute', left: '0px', top: '0px'},

parent: $Body()});

}

if(this.shadow) {

var _shadow = $CreateElement({

tag: 'div',

att: {id: this.id + '_shadow', className: this.cName + '_shadow'},

style: {width: this.size[0] + 'px', height: this.size[1] + 'px',

position: 'absolute', left: this.pos[0] + this.shadow + 'px', top: this.pos[1]+ this.shadow + 'px'},

parent: $Body()});

}

var _iframe = $CreateElement({

tag: 'iframe',

att: {id: this.id + '_iframe'},

style: {width: this.size[0] + 'px', height: this.size[1] + 'px',border: '0px',

position: 'absolute', left: this.pos[0] + 'px', top: this.pos[1] + 'px'},

parent: $Body()});

var _container = $CreateElement({

tag: 'div',

att: {id: this.id + '_container', className: this.cName + '_container'},

style: {width: this.size[0] + 'px', height: this.size[1] + 'px',

position: 'absolute', left: this.pos[0] + 'px', top: this.pos[1] + 'px', overflow: 'hidden'},

parent: $Body()});

var _list = (this.shadow)? [_shadow, _iframe, _container] : [_iframe, _container];

var _title = $CreateElement({

tag: 'div',

att: {className: this.cName + '_title'},

parent: _container});

var _tip = $CreateElement({

tag: 'div',

att: {className: this.cName + '_tip'},

content: this.title,

parent: _title});

if(this.move) {

var _size = (typeof(this.move) == 'boolean') ? false : this.move;

new Move({handler: _tip, size: _size, list: _list});

}

var _close = $CreateElement({

tag: 'div',

att: {className: this.cName + '_close'},

content: 'X',

parent: _title});

_close.onclick = $Bind(this.remove, this, false);

var _tHeight = _title.offsetHeight;

var _content = $CreateElement({

tag: 'div',

att: {className: this.cName + '_content'},

//style: {height: this.size[1] - _tHeight + 'px'},

content: this.content,

parent: _container});

if(this.resize) {

var _resize = $CreateElement({

tag: 'div',

att: {id: this.id + '_resize', className: this.cName + '_resize'},

style: {cursor: 'pointer'},

parent: _container});

new Resize({handler: _resize,

minSize: this.resize.minSize, maxSize: this.resize.maxSize,

limit: this.resize.limit, list: _list});

}

if(this.createCallBack) {

this.createCallBack();

}

},

remove: function() {

if(this.closeCallBack) {

this.closeCallBack();

}

var _mask = $(this.id + '_mask');

if(_mask) {

$Body().removeChild(_mask);

}

var _shadow = $(this.id + '_shadow');

if(_shadow) {

$Body().removeChild(_shadow);

}

var _iframe = $(this.id + '_iframe');

if(_iframe) {

$Body().removeChild(_iframe);

}

var _container = $(this.id + '_container');

if(_container) {

$Element(_container).remove();

}

}

}

/******************************************************************************/

/**

* var op = {

* handler: element,

* size: false | [1024, 768],

* list: null | [element1, element2, ...]

* startCallBack: function(){},

* endCallBack: function(){}

* }

**/

var Move = $CreateClass();

Move.prototype = {

init: function(op) {

this.handler = op.handler;

this.handler.style.cursor = 'move';

this.size = op.size;

this.list = op.list;

if(!this.list) {

this.list = [this.handler];

}

this.posList = [];

this.posOver = [false, false];

this.startCallBack = (typeof(op.startCallBack) == 'function') ? op.startCallBack : false;

this.endCallBack = (typeof(op.endCallBack) == 'function') ? op.endCallBack : false;

this.mouseMoveEvent;

this.mouseUpEvent;

$Element(this.handler).addEvent('mousedown', $Bind(this.ready, this, true));

},

ready: function() {

var _pos = $Event(arguments[0]).pos();

var _element;

var _x;

var _y;

this.posList = this.list.result(function(listItem, index) {

_element = $Element(listItem);

_x = parseInt(_element.getStyle('left'));

_y = parseInt(_element.getStyle('top'));

return [_pos.X - _x, _pos.Y - _y];

});

//alert(this.posList)

var _doc = $Element(document);

this.mouseMoveEvent = $Bind(this.action, this, true);

this.mouseUpEvent = $Bind(this.stop, this, false);

_doc.addEvent('mousemove', this.mouseMoveEvent);

_doc.addEvent('mouseup', this.mouseUpEvent);

if(this.startCallBack) {

this.startCallBack();

}

$Event(arguments[0]).inFabort();

},

stop: function() {

this.posList = [];

if(this.endCallBack) {

this.endCallBack();

}

var _doc = $Element(document);

_doc.removeEvent('mousemove', this.mouseMoveEvent);

_doc.removeEvent('mouseup', this.mouseUpEvent);

},

action: function() {

if(this.posList.length <= 0) {

return;

}

var _pos = $Event(arguments[0]).pos();

var _x = _pos.X - this.posList[0][0];

var _y = _pos.Y - this.posList[0][1];

if(this.size) {

this.posOver[0] = (_x <= 0 || _x + this.list[0].offsetWidth >= this.size[0]) ? true : false;

this.posOver[1] = (_y <= 0 || _y + this.list[0].offsetHeight >= this.size[1]) ? true : false;

}

this.list.each(function(listItem, index, pos, over) {

if(!over[0]){

listItem.style.left = _pos.X - pos[index][0] + 'px';

}

if(!over[1]){

listItem.style.top = _pos.Y - pos[index][1] + 'px';

}

}, this.posList, this.posOver)

}

}

/*****************************************************************/

/**

* var op = {

* handlerID: '',

* minSize: [],

* maxSize: [],

* limit: [true, true],

* list: [],

* startCallBack: function(){},

* endCallBack: function(){}

* }

**/

var Resize = $CreateClass();

Resize.prototype = {

init: function(op) {

this.handler = op.handler;

this.minSize = op.minSize;

this.maxSize = op.maxSize;

this.limit = op.limit;

this.list = op.list;

this.sizeList = [];

this.startCallBack = (typeof(op.startCallBack) == 'function') ? op.startCallBack : false;

this.endCallBack = (typeof(op.endCallBack) == 'function') ? op.endCallBack : false;

this.mouseMoveEvent;

this.mouseUpEvent;

$Element(this.handler).addEvent('mousedown', $Bind(this.ready, this, true));

},

ready: function() {

var _pos = $Event(arguments[0]).pos();

var _element;

var _w;

var _h;

this.sizeList = this.list.result(function(listItem, index) {

_element = $Element(listItem);

_w = parseInt(_element.getStyle('width'));

_h = parseInt(_element.getStyle('height'));

return [_pos.X - _w, _pos.Y - _h];

});

if(this.startCallBack) {

this.startCallBack();

}

var _doc = $Element(document);

this.mouseMoveEvent = $Bind(this.action, this, true);

this.mouseUpEvent = $Bind(this.stop, this, false);

_doc.addEvent('mousemove', this.mouseMoveEvent);

_doc.addEvent('mouseup', this.mouseUpEvent);

$Event(arguments[0]).inFabort();

},

stop: function() {

this.sizeList = [];

if(this.endCallBack) {

this.endCallBack();

}

var _doc = $Element(document);

_doc.removeEvent('mousemove', this.mouseMoveEvent);

_doc.removeEvent('mouseup', this.mouseUpEvent);

},

action: function() {

if(this.sizeList.length <= 0) {

return;

}

var _pos = $Event(arguments[0]).pos();

var _w = _pos.X - this.sizeList[0][0];

var _h = _pos.Y - this.sizeList[0][1];

if(_w >= this.minSize[0] && _w <= this.maxSize[0] && this.limit[0]) {

this.resetSize('width', _pos.X, 0);

}

if(_h >= this.minSize[1] && _h <= this.maxSize[1] && this.limit[1]) {

this.resetSize('height', _pos.Y, 1);

}

},

resetSize: function(key, step, flag) {

this.list.each(function(listItem, index, sizeList) {

listItem.style[key] = step - sizeList[index][flag] + 'px';

}, this.sizeList)

}

}

/*****************************************************************/

/**

* var op = {

* element: element,

* endValue: '480',

* effect: 'width',

* step: 100,

* tween: Tween.Elastic.easeInOut || null

* callBack: function(){};

* }

**/

var Effect = $CreateClass();

Effect.prototype = {

init: function(op) {

this.element = $(op.element);

this.effect = op.effect;

this.endValue = op.endValue;

switch(this.effect) {

case 'background-color':

case 'color':

this.startValue = $Element(this.element).getStyle(this.effect);

this.set = this.setColor;

this.effect = this.effect.rewriteStyleName();

break;

case 'opacity':

this.startValue = $Element(this.element).getOpacity();

this.set = this.setOpacity;

break;

case 'scrollTop':

case 'scrollLeft':

this.startValue = this.element[this.effect];

this.set = this.setScroll;

break;

default:

this.startValue = $Element(this.element).getStyle(this.effect);

this.set = this.setNum;

this.effect = this.effect.rewriteStyleName();

}

this.tween = (op.tween)? op.tween : Tween.Linear;

this.step = op.step;

this.map = (this.effect == 'backgroundColor' || this.effect == 'color') ? this.colorMap() : this.numMap();

this.index = 0;

this.flag = true;

this.callBack = (typeof(op.callBack) == 'function') ? op.callBack : false;

},

numMap: function() {

var _startValue = parseInt(this.startValue);

var _endValue = (this.effect != 'opacity') ? this.endValue :

(this.endValue > 100)? 100 :

(this.endValue < 0)? 0 : this.endValue;

var _array = [_startValue];

var _temp;

for(var i = 1; i< this.step - 1; i++){

_temp = this.tween((i + 1), _startValue, (_endValue - _startValue), this.step);

_array.push(parseInt(_temp));

}

_array.push(_endValue);

return _array;

},

colorMap: function() {

var _array = [];

var _startColor = this.getColorList(this.startValue);

var _endColor = this.getColorList(this.endValue);

var _stepTemp = [];

_startColor.each(function(listItem, index, step) {

_stepTemp.push(parseInt((_endColor[index] - listItem) / step));

}, this.step);

for(var i = 0, r = parseInt(_startColor[0]), g = parseInt(_startColor[1]), b = parseInt(_startColor[2]); i < this.step - 1; i++) {

_array.push([r, g, b]);

r += _stepTemp[0];

g += _stepTemp[1];

b += _stepTemp[2];

}

_array.push(_endColor);

return _array;

},

getColorList: function(value) {

var _array = [];

var _match;

if(value.indexOf('#') == 0 && value.length == 7) {

_array.push(parseInt(value.substr(1,2), 16));

_array.push(parseInt(value.substr(3,2), 16));

_array.push(parseInt(value.substr(5,2), 16));

} else if(value.indexOf('#') == 0 && value.length == 4) {

_array.push(parseInt([value.substr(1,1), value.substr(1,1)].join(''), 16));

_array.push(parseInt([value.substr(2,1), value.substr(2,1)].join(''), 16));

_array.push(parseInt([value.substr(3,1), value.substr(3,1)].join(''), 16));

} else if((_match = value.match(/^rgb/((.*),(.*),(.*)/)$/i)) != null) {

_array = [parseInt(_match[1]), parseInt(_match[2]), parseInt(_match[3])];

} else {

_array = (this.effect == 'color')? [0, 0, 0] : [255, 255, 255];

}

return _array;

},

action: function(act) {

if(act == 'up') {

this.flag = true;

this.up();

} else if(act == 'down') {

this.flag = false;

this.down();

}

},

up: function() {

this.index++;

if(this.index < this.map.length) {

this.set(this.index);

} else {

this.flag = false;

if(this.callBack) {

this.callBack();

}

}

var _self = this;

if(this.flag && this.index < this.map.length - 1) {

setTimeout(function(){_self.up()}, 10);

}

},

down: function() {

this.index--;

if(this.index >= 0) {

this.set(this.index);

} else {

this.flag = true;

if(this.callBack) {

this.callBack();

}

}

var _self = this;

if(!this.flag && this.index > 0) {

setTimeout(function(){_self.down()}, 10);

}

},

setColor: function(index) {

_value = this.map[index].result(function(listItem) {

return (listItem.toString(16).length < 2) ? '0' + listItem.toString(16) : listItem.toString(16);

});

_value = '#' + _value.join('');

this.element.style[this.effect] = _value;

},

setOpacity: function(index) {

var _value = this.map[index];

$Element(this.element).setOpacity(_value);

},

setScroll: function(index) {

var _value = this.map[index] + 'px';

this.element[this.effect] = _value;

},

setNum: function(index) {

var _value = this.map[index] + 'px';

this.element.style[this.effect] = _value;

}

}

/***************************************************************/

/**

* var op = {

* titleID: '',

* titleListTag: '',

* titleClass: '',

* contentID: '',

* contentListTag: '',

* contentClass: '',

* callBack: function(titleList, contentList, index){},

* eventType: ''

* }

**/

var TabView = $CreateClass();

TabView.prototype = {

init: function(op) {

this.titleList = $Selector('#' + op.titleID + '>' + op.titleListTag);

this.contentList = $Selector('#' + op.contentID + '>' + op.contentListTag);

if(!this.titleList || !this.contentList || (this.titleList.length != this.contentList.length)) {

return;

}

this.index = -1;

this.titleClass = op.titleClass;

this.contentClass = op.contentClass;

this.callBack = (typeof(op.callBack) === 'function')? op.callBack : false;

this.eventType = op.eventType;

var element;

this.titleList.each(function(listItem, index, self) {

element = $Element(listItem);

element.addEvent(self.eventType, $Bind(self.tabChange, self, false, index), false);

if(element.haveAtt('class', self.titleClass + '_dis')) {

self.index = index;

}

}, this);

if(this.index < 0) {

this.tabChange(0);

}

},

tabChange: function(n) {

if(n == this.index) {

return;

}

var _len = this.titleList.length;

for(var i = 0; i < _len; i++) {

$Element(this.titleList[i]).addAtt('class', ((n == i) ? this.titleClass + '_dis' : this.titleClass + '_undis'));

$Element(this.contentList[i]).addAtt('class', ((n == i) ? this.contentClass + '_dis' : this.contentClass + '_undis'));

}

if(this.callBack) {

this.callBack(this.titleList, this.contentList, this.index, n);

}

this.index = n;

}

}