123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156 |
- var $support = {
- transform3d: ('WebKitCSSMatrix' in window),
- touch: ('ontouchstart' in window)
- };
- var $E = {
- start: $support.touch ? 'touchstart' : 'mousedown',
- move: $support.touch ? 'touchmove' : 'mousemove',
- end: $support.touch ? 'touchend' : 'mouseup',
- cancel: $support.touch ? 'touchcancel' : '',
- transEnd:'webkitTransitionEnd'
- };
- function getPage (event, page) {
- return $support.touch ? event.changedTouches[0][page] : event[page];
- }
- var zyClick = function(selector,clickFun,css,longClickFun){
- var self = this;
- self._clickFun = clickFun || null;
- self._longClickFun = longClickFun || null;
- self._click=false;
- self.css = css;
- if(typeof selector == 'object')
- self.element = selector;
- else if(typeof selector == 'string')
- self.element = document.getElementById(selector);
- self.attribute=self.element.getAttribute("onclick");
- self.element.removeAttribute("onclick");
- self.element.addEventListener($E.start, self, false);
- self.element.addEventListener($E.move, self, false);
- self.element.addEventListener($E.end, self, false);
- if($E.cancel!="")
- {
- self.element.addEventListener($E.cancel, self, false);
- document.addEventListener($E.cancel, self, false);
- }
- document.addEventListener($E.end, self, false);
-
- return self;
- }
- zyClick.prototype = {
- handleEvent: function(event) {
- var self = this;
- switch (event.type) {
- case $E.start:
- self._touchStart(event);
- break;
- case $E.move:
- self._touchMove(event);
- break;
- case $E.end:
- case $E.cancel:
- self._touchEnd(event);
- break;
- }
- },
- _touchStart: function(event) {
-
- var self = this;
- self.start = true;
- self._click=true;
- self.startPageX = getPage(event, 'pageX');
- self.startPageY = getPage(event, 'pageY');
- self.startTime = event.timeStamp;
- if (self.css && !self.touchTime) {
- self.touchTime=setTimeout(function(){
- if (self._click && self.element.className.indexOf(self.css)<0)
- self.element.className += (" " + self.css);
- }, 50);
- }
- if (self.css && !self.longtouchTime) {
- self.longtouchTime=setTimeout(function(){
- self.start = false;
- self._click = false;
- clearTimeout(self.touchTime);
- clearTimeout(self.longtouchTime);
- self.touchTime=null;
- self.longtouchTime=null;
- if(self.css)
- self.element.className=self.element.className.replace(" "+self.css,"");
- if (self._longClickFun)
- self._longClickFun(self);
- }, 500);
- }
- },
- _touchMove: function(event) {
-
- var self = this;
- if(!self.start)
- return;
- var pageX = getPage(event, 'pageX'),
- pageY = getPage(event, 'pageY'),
- deltaX = pageX - self.startPageX,
- deltaY = pageY - self.startPageY;
- if((Math.abs(deltaX)>5 || Math.abs(deltaY)>5))
- {
- if (self._click) {
- clearTimeout(self.touchTime);
- clearTimeout(self.longtouchTime);
- self.touchTime = null;
- self.longtouchTime=null;
- self._click = false;
- if (self.css)
- self.element.className = self.element.className.replace(" " + self.css, "");
- }
- }
- else{
- }
- },
- _touchEnd: function(event) {
-
- var self = this;
-
- if(self.start == true)
- {
- if (self.touchTime) {
- clearTimeout(self.touchTime);
- self.touchTime=null;
- }
- if (self.longtouchTime) {
- clearTimeout(self.longtouchTime);
- self.longtouchTime=null;
- }
- self.start = false;
- if(self.css)
- self.element.className=self.element.className.replace(" "+self.css,"");
- if(self._click)
- {
- self._click=false;
- if(event.timeStamp - self.startTime>1000)
- return;
- if(event.type==$E.cancel)
- return;
- if(self._clickFun)
- self._clickFun(self.element);
- if(self.attribute)
- eval(self.attribute);
- }
- }
- },
- destroy: function() {
- var self = this;
- self.element.removeEventListener($E.start, self);
- self.element.removeEventListener($E.move, self);
- self.element.removeEventListener($E.end, self);
- self.element.removeEventListener($E.cancel, self);
- document.removeEventListener($E.end, self);
- document.removeEventListener($E.cancel, self);
- }
- }
|