utils.js 6.76 KB
import tip from '../css/featuretip.css'; //eslint-disable-line
import cointip from '../css/featuretip-coin.css'; //eslint-disable-line
import $ from 'jquery';

const isMobile = {
    Android() {
        return navigator.userAgent.match(/Android/i) ? true : false;
    },
    BlackBerry() {
        return navigator.userAgent.match(/BlackBerry/i) ? true : false;
    },
    iOS() {
        return navigator.userAgent.match(/iPhone|iPad|iPod/i) ? true : false;
    },
    Windows() {
        return navigator.userAgent.match(/IEMobile/i) ? true : false;
    },
    any() {
        return (isMobile.Android() || isMobile.BlackBerry() || isMobile.iOS() || isMobile.Windows());
    }
};
const mycurrency = isMobile.any() ? '//m.yohobuy.com/home/mycurrency' : '//www.yohobuy.com/home/currency';
const $tipTmpl = $('<div class="featuretip tip-wrap"><div class="tip"><div class="title"></div><div class="content"></div><a class="button" href="">返回</a></div></div>'); // eslint-disable-line
const $cointipTmpl = $('<div class="feature-coin tip-wrap"><div class="tip"><div class="tip-close">&times;</div><div class="title"></div><div class="content"></div><div class="bottom-button"><a class="button" href="">去逛逛</a><a class="coin" href=\'' + mycurrency + '?openby:yohobuy={"action":"go.mine"}\'>查看有货币</a></div></div></div>'); // eslint-disable-line
const $toastTmpl = $('<div class="feature-toast feature-toast-wrap"><div class="feature-toast-content"></div></div>');

let _queryString = function() {
    if (!window._jssdkQS) {
        let vars = {},
            hash,
            i,
            hashes = window.location.search.slice(1).split('&');

        for (i = 0; i < hashes.length; i++) {
            hash = hashes[i].split('=');
            vars[hash[0]] = hash[1];
        }

        window._jssdkQS = vars;
    }

    return $.extend({}, window._jssdkQS);
};

let _urlParse = function(url) {
    var parser = document.createElement('a');
    parser.href = url;
    return parser;
};

let _sParamByIframe = function() {
    let paramsObj = _queryString();
    let queryArray = [];
    let queryString = '?';

    delete paramsObj['uid'];
    delete paramsObj['app_version'];
    delete paramsObj['client_type'];
    delete paramsObj['session_key'];
    delete paramsObj['client_secret'];

    for(let i in paramsObj) {
        queryArray.push(i + '=' + paramsObj[i]);
    }

    if (!paramsObj['expires']) {
        queryArray.push('expires=' + (7 * 24 * 60 * 60 * 1000));
    }

    queryArray.push('callback=jQueryMktCode');
    queryString += queryArray.join('&');
    $.getScript('//m.yohobuy.com/activity/wechat/1111' + queryString, function(){});
    // $('<iframe style="display:none;" src="//m.yohobuy.com/activity/wechat/1111' + queryString + '"></iframe>').prependTo('body');
};

let _bindEvent = function() {
    let $body = $('body');
    $body.on('click', '.feature-coin .close,.feature-coin .tip-close', function(e) {
        $cointipTmpl.fadeOut();
        e.preventDefault();
    });
    $body.on('click', '.feature-coin.tip-wrap', function(e) {
        if ('feature-coin tip-wrap' === e.target.className) {
            $cointipTmpl.fadeOut();
            e.preventDefault();
        }
    });
    $body.on('click', '.featuretip .close', function(e) {
        $tipTmpl.fadeOut();
        e.preventDefault();
    });
    $body.on('click', '.featuretip .refresh', function() {
        location.reload();
    });
    $body.on('click', '.featuretip.tip-wrap', function(e) {
        if ('featuretip tip-wrap' === e.target.className) {
            $tipTmpl.fadeOut();
            e.preventDefault();
        }
    });
};

export default {
    queryString: _queryString,
    isMobile: isMobile,
    urlParse: _urlParse,
    init() {
        //发送活动页参数
        _sParamByIframe();

        // 绑定事件
        _bindEvent();
    },
    isApp() {
        let qs = _queryString();
        let isApp = !!qs.app_version || (qs.openrefer === 'app' && qs.uid);

        return !!isApp;
    },
    image(url, width, height, mode, quality) {
        mode = !isNaN(Number(mode)) ? mode : 2;
        url = url || '';
        url = url.replace(/{width}/g, width).replace(/{height}/g, height).replace(/{mode}/g, mode);
        if (url.indexOf('imageView2') > 0) {
            quality = quality || 90;
            url += '/q/' + quality;
        }
        return url.replace('quality/80', 'quality/60').replace('http:', '');
    },
    sParamByIframe(params) {
        $.getScript('//m.yohobuy.com/activity/wechat/1111' + params, function(){});
        // $('<iframe style="display:none;" src="//m.yohobuy.com/activity/wechat/1111?' + params + '"></iframe>').prependTo('body');
    },
    showTip(data) {
        data = data || {
            title: '',
            content: '',
            close: true
        };

        $tipTmpl.find('.title').html(data.title);
        $tipTmpl.find('.content').html(data.content);

        if (data.close) {
            $tipTmpl.find('.button').addClass('close');
        } else {
            $tipTmpl.find('.button').addClass('refresh').html('刷新');
        }

        if (data.tipClassName) {
            $tipTmpl.find('.tip').addClass(data.tipClassName);
        }

        $('body').append($tipTmpl);
        $tipTmpl.show();
    },
    showCoinTip(data) {
        data = data || {
            title: '',
            content: '',
            close: true
        };

        $cointipTmpl.find('.title').html(data.title);
        $cointipTmpl.find('.content').html(data.content);

        if (data.close) {
            $cointipTmpl.find('.button').addClass('close');
        }

        if (data.coin) {
            $cointipTmpl.find('.coin').css('display', 'inline-block');
        } else {
            $cointipTmpl.find('.coin').hide();
        }

        if (data.img) {
            $cointipTmpl.find('.tip').css('background-image', 'url(' + data.img + ')');
        }

        $('body').append($cointipTmpl);
        $cointipTmpl.show();
    },
    toast(content, options = {}) {
        if (typeof content === 'undefined') {
            return;
        }

        let {bottom, paddingX, paddingY, radius, duration} = $.extend({
            bottom: '10%',
            paddingX: 6,
            paddingY: 10,
            radius: 3
        }, options);

        $toastTmpl.css('bottom', bottom);
        $toastTmpl.find('.feature-toast-content').html(content).css({
            padding: `${paddingY || 6}px ${paddingX || 10}px`,
            'border-radius': `${radius}px`
        });

        if (!this.toastAppended) {
            this.toastAppended = true;
            $('body').append($toastTmpl);
        }

        $toastTmpl.show();
        this.toastTimer && clearTimeout(this.toastTimer);
        this.toastTimer = setTimeout(function() {
            $toastTmpl.hide();
        }, (duration && duration > 0) ? duration : 2000);
    }
};