mayi_cms/m/template/js/slide.js

function imageInit() {
    if ($(".image_area").length && $(".bigimg_box").length) {
        $(".image_area").carousel({
            imgType:"thumb"
        });
        var thumbImg = $(".image_area").find("img");
        thumbImg.each(function (i) {
            $(this).bind("click", function () {
                if ($(".bigimg_box").find("img").size() == 0) {
                    thumbImg.each(function () {
                        var _bigSrc = $(this).attr("ref").replace("tiny", "big");
                        var _bigImg = document.createElement("img");
                        var _li = document.createElement("li");
                        _bigImg.src = "template/images/noimg.gif";
                        _bigImg.setAttribute("ref", _bigSrc);
                        _li.appendChild(_bigImg);
                        document.querySelector(".bigimg_box ul").appendChild(_li);
                    });
                }
                setTimeout(function () {
                    window.scrollTo(0, 1);
                    $(".bigimg_box").carousel({
                        imgType:"big",
                        scrollTo:i
                    });
                }, 0);
				$(".header").hide();
                $("#viewBigImagebg").show().css("height", document.body.clientHeight + "px");
                $("#viewBigImage").show();
                var path = "/" + ____json4fe.locallist[0].listname + "/" + ____json4fe.rootcatentry.listname + "/" + ____json4fe.catentry.listname + "/detail/click/photo/";
                googleAnalytices(path, document.referer);
            });
        });
        $(".btn_back").bind("click", function () {
            $("#viewBigImagebg").hide();
            $("#viewBigImage").hide();
			$(".header").show();
        });
    }
}
function FastClick(layer) {
    'use strict';
    var oldOnClick, self = this;
    this.trackingClick = false;
    this.trackingClickStart = 0;
    this.targetElement = null;
    this.touchStartX = 0;
    this.touchStartY = 0;
    this.lastTouchIdentifier = 0;
    this.touchBoundary = 10;
    this.layer = layer;
    if (!layer || !layer.nodeType) {
        throw new TypeError('Layer must be a document node');
    }
    this.onClick = function() {
        return FastClick.prototype.onClick.apply(self, arguments)
    };
    this.onMouse = function() {
        return FastClick.prototype.onMouse.apply(self, arguments)
    };
    this.onTouchStart = function() {
        return FastClick.prototype.onTouchStart.apply(self, arguments)
    };
    this.onTouchMove = function() {
        return FastClick.prototype.onTouchMove.apply(self, arguments)
    };
    this.onTouchEnd = function() {
        return FastClick.prototype.onTouchEnd.apply(self, arguments)
    };
    this.onTouchCancel = function() {
        return FastClick.prototype.onTouchCancel.apply(self, arguments)
    };
    if (FastClick.notNeeded(layer)) {
        return
    }
    if (this.deviceIsAndroid) {
        layer.addEventListener('mouseover', this.onMouse, true);
        layer.addEventListener('mousedown', this.onMouse, true);
        layer.addEventListener('mouseup', this.onMouse, true)
    }
    layer.addEventListener('click', this.onClick, true);
    layer.addEventListener('touchstart', this.onTouchStart, false);
    layer.addEventListener('touchmove', this.onTouchMove, false);
    layer.addEventListener('touchend', this.onTouchEnd, false);
    layer.addEventListener('touchcancel', this.onTouchCancel, false);
    if (!Event.prototype.stopImmediatePropagation) {
        layer.removeEventListener = function(type, callback, capture) {
            var rmv = Node.prototype.removeEventListener;
            if (type === 'click') {
                rmv.call(layer, type, callback.hijacked || callback, capture)
            } else {
                rmv.call(layer, type, callback, capture)
            }
        };
        layer.addEventListener = function(type, callback, capture) {
            var adv = Node.prototype.addEventListener;
            if (type === 'click') {
                adv.call(layer, type, callback.hijacked || (callback.hijacked = function(event) {
                    if (!event.propagationStopped) {
                        callback(event)
                    }
                }), capture)
            } else {
                adv.call(layer, type, callback, capture)
            }
        }
    }
    if (typeof layer.onclick === 'function') {
        oldOnClick = layer.onclick;
        layer.addEventListener('click',
        function(event) {
            oldOnClick(event)
        },
        false);
        layer.onclick = null
    }
}
FastClick.prototype.deviceIsAndroid = navigator.userAgent.indexOf('Android') > 0;
FastClick.prototype.deviceIsIOS = /iP(ad|hone|od)/.test(navigator.userAgent);
FastClick.prototype.deviceIsIOS4 = FastClick.prototype.deviceIsIOS && (/OS 4_\d(_\d)?/).test(navigator.userAgent);
FastClick.prototype.deviceIsIOSWithBadTarget = FastClick.prototype.deviceIsIOS && (/OS ([6-9]|\d{2})_\d/).test(navigator.userAgent);
FastClick.prototype.needsClick = function(target) {
    'use strict';
    switch (target.nodeName.toLowerCase()) {
    case 'button':
    case 'select':
    case 'textarea':
        if (target.disabled) {
            return true
        }
        break;
    case 'input':
        if ((this.deviceIsIOS && target.type === 'file') || target.disabled) {
            return true
        }
        break;
    case 'label':
    case 'video':
        return true
    }
    return (/\bneedsclick\b/).test(target.className)
};
FastClick.prototype.needsFocus = function(target) {
    'use strict';
    switch (target.nodeName.toLowerCase()) {
    case 'textarea':
        return true;
    case 'select':
        return ! this.deviceIsAndroid;
    case 'input':
        switch (target.type) {
        case 'button':
        case 'checkbox':
        case 'file':
        case 'image':
        case 'radio':
        case 'submit':
            return false
        }
        return ! target.disabled && !target.readOnly;
    default:
        return (/\bneedsfocus\b/).test(target.className)
    }
};
FastClick.prototype.sendClick = function(targetElement, event) {
    'use strict';
    var clickEvent, touch;
    if (document.activeElement && document.activeElement !== targetElement) {
        document.activeElement.blur()
    }
    touch = event.changedTouches[0];
    clickEvent = document.createEvent('MouseEvents');
    clickEvent.initMouseEvent(this.determineEventType(targetElement), true, true, window, 1, touch.screenX, touch.screenY, touch.clientX, touch.clientY, false, false, false, false, 0, null);
    clickEvent.forwardedTouchEvent = true;
    targetElement.dispatchEvent(clickEvent)
};
FastClick.prototype.determineEventType = function(targetElement) {
    'use strict';
    if (this.deviceIsAndroid && targetElement.tagName.toLowerCase() === 'select') {
        return 'mousedown'
    }
    return 'click'
};
FastClick.prototype.focus = function(targetElement) {
    'use strict';
    var length;
    if (this.deviceIsIOS && targetElement.setSelectionRange && targetElement.type.indexOf('date') !== 0 && targetElement.type !== 'time') {
        length = targetElement.value.length;
        targetElement.setSelectionRange(length, length)
    } else {
        targetElement.focus()
    }
};
FastClick.prototype.updateScrollParent = function(targetElement) {
    'use strict';
    var scrollParent, parentElement;
    scrollParent = targetElement.fastClickScrollParent;
    if (!scrollParent || !scrollParent.contains(targetElement)) {
        parentElement = targetElement;
        do {
            if (parentElement.scrollHeight > parentElement.offsetHeight) {
                scrollParent = parentElement;
                targetElement.fastClickScrollParent = parentElement;
                break
            }
            parentElement = parentElement.parentElement
        } while ( parentElement )
    }
    if (scrollParent) {
        scrollParent.fastClickLastScrollTop = scrollParent.scrollTop
    }
};
FastClick.prototype.getTargetElementFromEventTarget = function(eventTarget) {
    'use strict';
    if (eventTarget.nodeType === Node.TEXT_NODE) {
        return eventTarget.parentNode
    }
    return eventTarget
};
FastClick.prototype.onTouchStart = function(event) {
    'use strict';
    var targetElement, touch, selection;
    if (event.targetTouches.length > 1) {
        return true
    }
    targetElement = this.getTargetElementFromEventTarget(event.target);
    touch = event.targetTouches[0];
    if (this.deviceIsIOS) {
        selection = window.getSelection();
        if (selection.rangeCount && !selection.isCollapsed) {
            return true
        }
    }
    this.trackingClick = true;
    this.trackingClickStart = event.timeStamp;
    this.targetElement = targetElement;
    this.touchStartX = touch.pageX;
    this.touchStartY = touch.pageY;
    if ((event.timeStamp - this.lastClickTime) < 200) {
        event.preventDefault()
    }
    return true
};
FastClick.prototype.touchHasMoved = function(event) {
    'use strict';
    var touch = event.changedTouches[0],
    boundary = this.touchBoundary;
    if (Math.abs(touch.pageX - this.touchStartX) > boundary || Math.abs(touch.pageY - this.touchStartY) > boundary) {
        return true
    }
    return false
};
FastClick.prototype.onTouchMove = function(event) {
    'use strict';
    if (!this.trackingClick) {
        return true
    }
    if (this.targetElement !== this.getTargetElementFromEventTarget(event.target) || this.touchHasMoved(event)) {
        this.trackingClick = false;
        this.targetElement = null
    }
    return true
};
FastClick.prototype.findControl = function(labelElement) {
    'use strict';
    if (labelElement.control !== undefined) {
        return labelElement.control
    }
    if (labelElement.htmlFor) {
        return document.getElementById(labelElement.htmlFor)
    }
    return labelElement.querySelector('button, input:not([type=hidden]), keygen, meter, output, progress, select, textarea')
};
FastClick.prototype.onTouchEnd = function(event) {
    'use strict';
    var forElement, trackingClickStart, targetTagName, scrollParent, touch, targetElement = this.targetElement;
    if (!this.trackingClick) {
        return true
    }
    if ((event.timeStamp - this.lastClickTime) < 200) {
        this.cancelNextClick = true;
        return true
    }
    this.cancelNextClick = false;
    this.lastClickTime = event.timeStamp;
    trackingClickStart = this.trackingClickStart;
    this.trackingClick = false;
    this.trackingClickStart = 0;
    if (this.deviceIsIOSWithBadTarget) {
        touch = event.changedTouches[0];
        targetElement = document.elementFromPoint(touch.pageX - window.pageXOffset, touch.pageY - window.pageYOffset) || targetElement;
        targetElement.fastClickScrollParent = this.targetElement.fastClickScrollParent
    }
    targetTagName = targetElement.tagName.toLowerCase();
    if (targetTagName === 'label') {
        forElement = this.findControl(targetElement);
        if (forElement) {
            this.focus(targetElement);
            if (this.deviceIsAndroid) {
                return false
            }
            targetElement = forElement
        }
    } else if (this.needsFocus(targetElement)) {
        if ((event.timeStamp - trackingClickStart) > 100 || (this.deviceIsIOS && window.top !== window && targetTagName === 'input')) {
            this.targetElement = null;
            return false
        }
        this.focus(targetElement);
        if (!this.deviceIsIOS4 || targetTagName !== 'select') {
            this.targetElement = null;
            event.preventDefault()
        }
        return false
    }
    if (this.deviceIsIOS && !this.deviceIsIOS4) {
        scrollParent = targetElement.fastClickScrollParent;
        if (scrollParent && scrollParent.fastClickLastScrollTop !== scrollParent.scrollTop) {
            return true
        }
    }
    if (!this.needsClick(targetElement)) {
        event.preventDefault();
        this.sendClick(targetElement, event)
    }
    return false
};
FastClick.prototype.onTouchCancel = function() {
    'use strict';
    this.trackingClick = false;
    this.targetElement = null
};
FastClick.prototype.onMouse = function(event) {
    'use strict';
    if (!this.targetElement) {
        return true
    }
    if (event.forwardedTouchEvent) {
        return true
    }
    if (!event.cancelable) {
        return true
    }
    if (!this.needsClick(this.targetElement) || this.cancelNextClick) {
        if (event.stopImmediatePropagation) {
            event.stopImmediatePropagation()
        } else {
            event.propagationStopped = true
        }
        event.stopPropagation();
        event.preventDefault();
        return false
    }
    return true
};
FastClick.prototype.onClick = function(event) {
    'use strict';
    var permitted;
    if (this.trackingClick) {
        this.targetElement = null;
        this.trackingClick = false;
        return true
    }
    if (event.target.type === 'submit' && event.detail === 0) {
        return true
    }
    permitted = this.onMouse(event);
    if (!permitted) {
        this.targetElement = null
    }
    return permitted
};
FastClick.prototype.destroy = function() {
    'use strict';
    var layer = this.layer;
    if (this.deviceIsAndroid) {
        layer.removeEventListener('mouseover', this.onMouse, true);
        layer.removeEventListener('mousedown', this.onMouse, true);
        layer.removeEventListener('mouseup', this.onMouse, true)
    }
    layer.removeEventListener('click', this.onClick, true);
    layer.removeEventListener('touchstart', this.onTouchStart, false);
    layer.removeEventListener('touchmove', this.onTouchMove, false);
    layer.removeEventListener('touchend', this.onTouchEnd, false);
    layer.removeEventListener('touchcancel', this.onTouchCancel, false)
};
FastClick.notNeeded = function(layer) {
    'use strict';
    var metaViewport;
    var chromeVersion;
    if (typeof window.ontouchstart === 'undefined') {
        return true
    }
    chromeVersion = +(/Chrome\/([0-9]+)/.exec(navigator.userAgent) || [, 0])[1];
    if (chromeVersion) {
        if (FastClick.prototype.deviceIsAndroid) {
            metaViewport = document.querySelector('meta[name=viewport]');
            if (metaViewport) {
                if (metaViewport.content.indexOf('user-scalable=no') !== -1) {
                    return true
                }
                if (chromeVersion > 31 && window.innerWidth <= window.screen.width) {
                    return true
                }
            }
        } else {
            return true
        }
    }
    if (layer.style.msTouchAction === 'none') {
        return true
    }
    return false
};
FastClick.attach = function(layer) {
    'use strict';
    return new FastClick(layer)
};
if (typeof define !== 'undefined' && define.amd) {
    define(function() {
        'use strict';
        return FastClick
    })
} else if (typeof module !== 'undefined' && module.exports) {
    module.exports = FastClick.attach;
    module.exports.FastClick = FastClick
} else {
    window.FastClick = FastClick
}
FastClick.attach(document.body); (function() {
    if ($('.image_area ul').length > 0) {
        $('.bigimg_box ul').html($('.image_area ul').html().replace(/small/g, 'big').replace(/220/g, 300).replace(/155/g, 415))
    }
    var slideX = (function() {
        var _slide = function(node, duration, width, left, clickable) {
            this._eleX = 0;
            this._index = 0;
            this._length = node.children('li').length;
            this._main = node;
            this._startX = 0;
            this._startY = 0;
            this._duration = duration;
            this._width = width;
            this._left = left;
            this._clickable = clickable;
            $('.total_img').text(this._length)
        };
        _slide.prototype = {
            _bindEvents: function() {
                var _this = this;
                this._main.bind("touchstart",
                function(e) {
                    _this._touchStart(e, _this)
                });
                this._main.bind("touchmove",
                function(e) {
                    _this._touchMove(e, _this)
                });
                this._main.bind("touchend",
                function(e) {
                    _this._touchEnd(e, _this)
                })
            },
            _click: function() {
                if (this._clickable) {
                    var img = $(this._main.find('li img').get(this._index));
                    this._showImage(this._index);
                    $('.bigimg_box ul').css('-webkit-transform', 'translateX(-' + this._index * 320 + 'px)');
                    if (typeof bigimage !== 'undefined') {
                        bigimage._index = this._index;
                        bigimage._showImage(this._index);
                        bigimage._showImage(this._index + 1)
                    }
                    $('#viewBigImagebg').css('height', document.body.offsetHeight + 50 + 'px');
                    $('#viewBigImagebg, #viewBigImage').show();
					$(".header").hide();
                }
            },
            _showImage: function(index) {
                var img = $(this._main.find('li img').get(index));
                var ref = img.attr('ref');
                if (ref) {
                    img.attr('src', ref);
                    img.removeAttr('ref')
                }
            },
            _moveTo: function(x) {
                this._main.css({
                    '-webkit-transform': 'translateX(' + x + 'px)'
                })
            },
            _touchStart: function(e, _this) {
                e.stopPropagation();
                var finger0 = e.targetTouches[0];
                _this._startX = finger0.pageX;
                _this._startY = finger0.screenY;
                var transform = _this._main.css('-webkit-transform');
                var pattern = /\(|, {0,}|\)/;
                _this._eleX = (transform.indexOf('translate') >= 0) ? +transform.split(pattern)[1].replace('px', '') : +transform.split(pattern)[5]
            },
            _touchMove: function(e, _this) {
                var finger0 = e.targetTouches[0];
                var endX = finger0.pageX;
                var offsetX = endX - _this._startX + _this._eleX;
                if (Math.abs(endX - _this._startX) > 10) {
                    e.preventDefault();
                    e.stopPropagation();
                    _this._main.css('-webkit-transition', '0');
                    _this._moveTo(offsetX)
                }
            },
            _touchEnd: function(e, _this) {
                var finger0 = e.changedTouches[0];
                var endX = finger0.pageX;
                var endY = finger0.screenY;
                var offsetX = endX - _this._startX;
                var offsetY = endY - _this._startY;
                if (Math.abs(offsetX) <= 10) {
                    if (Math.abs(offsetY) <= 20) {
                        _this._click()
                    }
                } else {
                    var index = (offsetX > 0) ? --_this._index: ++_this._index;
                    if (index < 0) {
                        index = 0;
                        _this._index = 0
                    }
                    if (index >= _this._length) {
                        index = _this._length - 1;
                        _this._index = _this._length - 1
                    }
                    _this._showImage(index);
                    _this._showImage(index + 1);
                    $('.curr_img').text(index + 1);
                    _this._main.css('-webkit-transition', '150ms');
                    _this._moveTo( - index * _this._width + _this._left)
                }
            },
            init: function() {
                this._bindEvents();
                this._showImage(0);
                this._showImage(1)
            }
        };
        _slide.bind = function(node, duration, width, left, clickable) {
            var obj = new m58.slideX(node, duration, width, left, clickable);
            obj.init();
            return obj
        };
        return _slide
    })();
    window.m58 = window.m58 || {};
    window.m58.slideX = slideX;
    if ($('.image_area').length > 0) {
        m58.slideX.bind($('.image_area ul'), '300ms', 230, 50, true);
        var bigimage = m58.slideX.bind($('.bigimg_box ul'), '300ms', 320, 0, false)
    }
    $('.btn_back span').bind('click',
    function(e) {
        $('#viewBigImagebg, #viewBigImage').hide();
		$(".header").show();
    })
} ());