https://www.picup.ai/static/init.js

1var oAd = $('.oA'),
2    oBd = $('.btnte'),
3    toUrl = 'currencyBatch.html',
4    urlhref = '<%= VUE_APP_NAME %>' === 'formal' ? 'http://www.picup.shop' : 'http://wwwdev.picup.shop',
5    taskFlag;
6var oFile = $('#loadIn'),
7    timer = null;
8let oLoop = document.querySelectorAll('.headers .item .cu')
9let oLoopImg = document.querySelectorAll('.headers .rel .b_content')
10// var oBt = document.querySelectorAll( '.bgchange .bt div' )
11// var oBgImg = document.querySelectorAll( '.bgchange .first img:first-child' )[0]
12var idx = 1,
13    closeTimer = false;
14var qrcode = new QRCode(document.getElementById("qrcode"), {
15    text: urlhref + "/uploadBymobile.html",
16    width: 128,
17    height: 128,
18    colorDark: "#000000",
19    colorLight: "#ffffff",
20    correctLevel: QRCode.CorrectLevel.H
21});
22let lunBoList = document.querySelectorAll('.lunbo')
23let lunBoItem = document.querySelectorAll('.lunbo1')
24let xmSlideList = ['#xmSlide1', '#xmSlide2', '#xmSlide3', '#xmSlide4', '#xmSlide5', '#xmSlide6', '#xmSlide7']
25let xmSlide = ''
26let cjingLis = document.querySelectorAll('.cjingLi')
27let cjingImgs = document.querySelectorAll('.cjingImg')
28let partnerList = document.querySelector('.lunbokuang')
29let partnerBox = document.querySelector('.lunboBox')
30let slideItems = document.querySelectorAll('.slideItem')
31let tipLis = document.querySelectorAll('.fourGoodTips>li')
32
33lunBoList.forEach((item, index) => {
34    item.addEventListener('mouseenter', () => {
35        xmSlide = xmSlideList[index]
36        $(xmSlide).xmSlide({
37            width: 1800,
38            height: 240,
39            responsiveWidth: 710,
40            pagination: {
41                effect: "fade"
42            },
43            effect: {
44                fade: {
45                    speed: 1000
46                }
47            },
48            play: {
49                effect: "fade",
50                interval: 0,
51                auto: true,
52                pauseOnLeave: true,
53                restartDelay: 100,
54                delay: 100
55            }
56        });
57    })
58})
59
60$("#xmSlide7").xmSlide({
61    width: 1800,
62    height: 240,
63    responsiveWidth: 710,
64    pagination: {
65        effect: "fade"
66    },
67    effect: {
68        fade: {
69            speed: 1000
70        }
71    },
72    play: {
73        effect: "fade",
74        interval: 0,
75        auto: true,
76        pauseOnLeave: true,
77        restartDelay: 100,
78        delay: 0
79    }
80});
81$("#xmSlide3", "#xmSlide4", "#xmSlide5").xmSlide({
82    width: 1800,
83    height: 140,
84    responsiveWidth: 710,
85    pagination: {
86        effect: "fade"
87    },
88    effect: {
89        fade: {
90            speed: 1000
91        }
92    },
93    play: {
94        effect: "fade",
95        interval: 0,
96        auto: true,
97        pauseOnLeave: true,
98        restartDelay: 100,
99        delay: 0
100    }
101});
102var countCXArr;
103var countCX=function (){
104    if(countCXArr && countCXArr === true){
105        return;
106    }
107    var id,decimals, startVal, endVal, duration;
108    id=$('.numCX').attr('id');
109    decimals = $('.numCX').attr('data-decimals'),
110    startVal = $('.numCX').attr('data-startVal'),
111    endVal = $('.numCX').attr('data-endVal'),
112    duration = $('.numCX').attr('data-speed');
113    new CountUp(id, startVal, endVal, decimals, duration, {
114        useEasing: true,//效果
115        separator: ''//数字分隔符
116    }).start();// target：目标元素id, startVal：你想要开始的值, endVal：你想要到达的值, decimals：小数位数，默认值为0, duration：动画持续时间为秒，默认值为2, options：选项的可选对象
117    countCXArr = true;
118}
119
120$(function () {
121    $("img.lazy").lazyload({
122        effect: "fadeIn"
123    });
124    var timer = setInterval(() => {
125        if(partnerList.style.marginLeft.slice(0,partnerList.style.marginLeft.length-2) <= -3427) {
126            partnerList.style.marginLeft = 0+'px'
127        }
128        else {
129            partnerList.style.marginLeft = partnerList.style.marginLeft.slice(0,partnerList.style.marginLeft.length-2) - 2 +'px'
130        }
131    }, 25)
132    partnerBox.addEventListener('mouseenter', () => {
133        window.clearInterval(timer)
134    })
135    partnerBox.addEventListener('mouseleave', () => {
136        timer = setInterval(() => {
137            if(partnerList.style.marginLeft.slice(0,partnerList.style.marginLeft.length-2) <= -3427) {
138                partnerList.style.marginLeft = 0+'px'
139            }
140            else {
141                partnerList.style.marginLeft = partnerList.style.marginLeft.slice(0,partnerList.style.marginLeft.length-2) - 2 +'px'
142            }
143        }, 25)
144    })
145    setInterval(()=> {

146        slideItems.forEach((item,i) => {
147        if($(item).offset().top + 50 < $(window).scrollTop() + $(window).height()) {
148            $(item).css({'visibility':'visible','opacity':1,'transform':'translateY(50px) translateY(-50px)'});
149        }
150        else if($(item).offset().top - 50 < $(window).scrollTop() + $(window).height()){
151            $(item).css({'visibility':'hidden','opacity':0,'transform':'translateY(50px)'})
152        }
153    })
154    },25)
155
156});
157let scrollTimer = setInterval(() => {
158    if($('.title').offset().top > 2000) {
159        countCX()
160    }
161}, 25);
162if(countCXArr) {
163    window.clearInterval(scrollTimer)
164}
165
166for (let i = 0; i < oLoop.length; i++) {
167    oLoop[i].addEventListener('mouseover', function () {
168        Array.prototype.slice.call(oLoop).map(function (v, i) {
169            v.className = 'flex a-i cu'
170        })
171        Array.prototype.slice.call(oLoopImg).map(function (v, i) {
172            v.style.zIndex = '0'
173            v.style.opacity = '0'
174            
175        })
176        this.className = 'flex a-i cu active'
177        oLoopImg[i].style.zIndex = '1000'
178        oLoopImg[i].style.opacity= '1'
179    })
180}
181
182for (let i = 0; i < cjingLis.length; i++) {
183    cjingLis[i].addEventListener('mouseover', function () {
184        Array.prototype.slice.call(cjingLis).map(function (v, i) {
185            v.className = 'cjingLi'
186        })
187        Array.prototype.slice.call(cjingImgs).map(function (v, i) {
188            v.style.display = 'none'
189        })
190        this.className = "activeLi cjingLi"
191        cjingImgs[i].style.display = 'block'
192    })
193}
194
195tipLis.forEach((item, index) => {
196    console.log(item);
197    item.addEventListener('mouseenter',function(){
198        $(this).css({'border':'1px solid transparent','box-shadow':'0px 0px 5px 4px #e5e5e5','transform':'translateY(-5px)','transition':'all .5s ease'})
199    })
200    item.addEventListener('mouseleave',function(){
201        $(this).css({'border':'1px solid transparent','box-shadow':'none','transform':'translateY(5px)','transition':'all .5s ease'})
202    })
203})
204
205oAd.click(function () {
206    toUrl = 'currencyBatch.html';
207    oFile.val('');
208    oFile.click();
209    // window.location.href='transitionPage.html'
210})
211
212function uploadByCom(k) {
213    toUrl = ['idPhoto.html', 'imagePhoto.html', 'onlineImage.html'][k];
214    oFile.val('');
215    oFile.click();
216    // window.location.href='transitionPage.html'
217}
218
219// devbase = '//restapi.picup.shop';
220function changeImg(e) {
221    fileMsg = e.target.files[0];
222    if (fileMsg.type == "image/gif") {
223        Notification("仅支持PNG、JPG、JPEG、BMP格式")
224        return
225    }
226    if (fileMsg) dreepByFile(fileMsg);
227}
228
229
230// 首图移动
231var currentX = '';
232var movementConstant = .010;
233$('.titleHeader').mousemove(function (e) {
234    if (currentX == '') currentX = e.pageX;
235    var xdiff = e.pageX - currentX;
236    currentX = e.pageX;
237    $('.titleHeader .moveItem').each(function (i, el) {
238        var movement = ((i == 2 ? .3 : (i == 3 ? .3 : (i == 1 ? 4 : (i == 0 ? 1 : 10)))) + 1) * (
239            xdiff * movementConstant);
240        var newX = $(el).position().left + movement;
241        var newW = i == 3 ? $(el).width() + 10 * movement : ''
242        $(el).css({
243            'left': newX + 'px',
244            'transition': 'none'
245        });
246        if (i == 3) {
247            $(el).css('width', newW + 'px');
248        }
249    });
250});
251$('.titleHeader').mouseleave(function (e) {
252    $('.titleHeader .moveItem:nth-child(1)').css({
253        'left': 300 + 'px',
254        'transition': 'all .3s ease'
255    });
256    $('.titleHeader .moveItem:nth-child(2)').css({
257        'left': 220 + 'px',
258        'transition': 'all .3s ease'
259    });
260    $('.titleHeader .moveItem:nth-child(3)').css({
261        'left': 380 + 'px',
262        'transition': 'all .3s ease'
263    });
264    $('.titleHeader .moveItem:nth-child(4)').css({
265        'left': 380 + 'px',
266        'transition': 'all .3s ease',
267        'width': 280 + 'px'
268    });
269    $('.titleHeader .moveItem:nth-child(5)').css({
270        'left': 525 + 'px',
271        'transition': 'all .3s ease'
272    })
273    currentX = ''
274});
275
276function stopPrevent() { //阻止游览器默认打开图片
277    document.addEventListener("drop", function (e) { //拖离
278        e.preventDefault();
279    });
280    document.addEventListener("dragleave", function (e) { //拖后放
281        e.preventDefault();
282    });
283    document.addEventListener("dragenter", function (e) { //拖进
284        e.preventDefault();
285    });

286    document.addEventListener("dragover", function (e) { //拖来拖去
287        e.preventDefault();
288    });
289    // var oDrops = document.getElementsByClassName( 'upLoad' );
290    // for (var i = 0; i < oDrops.length; i++) {
291    document.addEventListener("drop", function (e) {
292        e.preventDefault();
293        e.stopPropagation();
294        var files = e.dataTransfer.files;
295        if (!files.length) {
296            let htmlData = e.dataTransfer.getData('text/html');
297            if (htmlData) {
298                let htmlDataUrl = htmlData.match(/src\s*=\s*"(.+?)"/);
299                if (!htmlDataUrl) {
300                    htmlDataUrl = htmlData.match(/href\s*=\s*"(.+?)"/);
301                }
302                if (htmlDataUrl) {
303                    console.log('htmlDataUrl-1', htmlDataUrl)
304                    if (htmlDataUrl[1].substr(0, 4) != 'http') {
305                        document.querySelector(".file-dropzone").style.display = 'none'
306                        Notification("拖动图片地址不是http开头")
307                        return
308                    }
309                    toUrl = 'currencyBatch.html';
310                    toPostEdior(htmlDataUrl[1].replace(new RegExp("&amp;", 'g'), "&"))
311                }
312            }
313            return;
314        }
315        if (files.length > 1) {
316            document.querySelector(".file-dropzone").style.display = 'none'
317            Notification("请每次处理一张图片")
318            return
319        }
320        if (files[0].type == "image/gif") {
321            document.querySelector(".file-dropzone").style.display = 'none'
322            Notification('仅支持PNG、JPG、JPEG、BMP格式')
323            return
324        }
325        fileMsg = files[0];
326        toUrl = 'currencyBatch.html';
327        dreepByFile(files[0])
328    })
329    // }
330}
331
332document.addEventListener('paste', function (e) {
333    // console.log( e )
334    var clipboardData = e.clipboardData, //谷歌
335        i = 0,
336        items, item, types;
337    if (clipboardData) {
338        items = clipboardData.items;
339        if (!items) {
340            return;
341        }
342        item = items[0];
343        types = clipboardData.types || [];
344        for (; i < types.length; i++) {
345            if (types[i] === 'Files') {
346                item = items[i];
347                break;
348            }
349        }
350        if (item && item.kind === 'string' && item.type.match(/^text\//i)) {
351            fileMsg = {
352                name: clipboardData.getData("Text")
353            }
354            toPostEdior(clipboardData.getData("Text"))
355        }
356        if (item && item.kind === 'file' && item.type.match(/^image\//i)) {
357            fileMsg = item.getAsFile();
358            toUrl = 'currencyBatch.html';
359            dreepByFile(item.getAsFile())
360        }
361    }
362})
363
364
365function dreepByFile(file) {
366    let _self = this;
367    if (file.size && file.size / 1024 / 1024 > 15) {
368        oFile.val('');
369        document.querySelector(".file-dropzone").style.display = 'none'
370        photoCompress(file, {
371            quality: 0.2
372        }, (base64Codes) => {
373            let compressFile = convertBase64UrlToBlob(base64Codes);
374            console.log("dreepByFile-0", compressFile);
375            new Notification("您的图片超过15m，我们已压缩处理")
376            setTimeout(function () {
377               dreepByFileTwo(compressFile)
378            }, 1000)
379        });
380        //Notification("图片过大，请选择不大于15M的图片")
381        /*$message({
382            type:'warning',
383            message:"图片过大，请选择不大于15M的图片"
384        })*/
385        return
386    } else {
387        console.log('dreepByFile-1', file)
388        dreepByFileTwo(file)
389    }
390}
391
392function dreepByFileTwo(file) {
393    /*$message({
394        type: 'success',
395        message: '图片上传中...'
396    })*/
397    // setLoading( 1 )
398    //console.log('dreepByFile-1', file)
399    var formData = new FormData();
400    formData.append('file', file);
401    // formData.set( 'mattingType', 6 );
402    $.ajax({
403        // url: devbase+'/webMatting/matting2',
404        url: devbase + '/oss/upload',
405        type: 'post',
406        dataType: 'json',
407        processData: false,
408        contentType: false,
409        xhrFields: {
410            withCredentials: true
411        },
412        headers: {
413            token: token
414        },
415        data: formData,
416        success: function (res) {
417            if (!res.code) {
418                if (file.name) {
419                    localStorage.setItem('initImgName', file.name)
420                }
421                toPostEdior(res.data)
422            } else if (res.code === 4003) {
423                localStorage.setItem('backUrl', window.location.href);
424                window.location.href = 'loginOrRegister.html';
425            } else if(res.code === 5013) {
426                console.log('文件类型不支持');
427
428                $('.message span').text('文件类型不支持')
429                $('.message').css('display', 'flex')
430                setTimeout(() => {
431                    $('.message').css('display', 'none')
432                }, 3000)
433                // new Notification('文件类型不支持')
434                // Message({
435                //     type: 'error',
436                //     message: '图片上传失败'
437                // })
438            }else {
439                // $message({
440                //     type: 'error',
441                //     message: '图片上传失败'
442                // })
443                // new Notification('图片上传失败')
444                //loading( res.msg )
445                $('.message span').text('图片上传失败')
446                $('.message').css('display', 'flex')
447                setTimeout(() => {
448                    $('.message').css('display', 'none')
449                }, 3000)
450            }
451        },
452        error: function (res) {
453            // $message({
454            //     type: 'error',
455            //     message: '图片上传失败'
456            // })
457            $('.message span').text('图片上传失败')
458            $('.message').css('display', 'flex')
459            setTimeout(() => {
460                $('.message').css('display', 'none')
461            }, 3000)
462            //console.log('dreepByFile-error', res)
463        },
464    })
465}
466
467function photoCompress(file, w, objDiv) {
468    let ready = new FileReader(), _this = this;
469    /*开始读取指定的Blob对象或File对象中的内容. 当读取操作完成时,readyState属性的值会成为DONE,如果设置了onloadend事件处理程序,则调用之.同时,result属性中将包含一个data: URL格式的字符串以表示所读取文件的内容.*/
470    ready.readAsDataURL(file);
471    ready.onloadend = function(ev) {
472        let re = ev.target.result
473        //console.log('photoCompress-1', re)
474        canvasDataURL(re, w, objDiv)
475    }
476}
477function canvasDataURL(path, obj, callback) {
478  let img = new Image();
479  img.src = path;
480  img.onload = function() {
481      // 默认按比例压缩
482      let w = img.width,

483          h = img.height,
484          scale = w / h;
485      w = obj.width || w;
486      h = obj.height || (w / scale);
487      let quality = 0.7;  // 默认图片质量为0.7
488      //生成canvas
489      let canvas = document.createElement('canvas');
490      let ctx = canvas.getContext('2d');
491      // 创建属性节点
492      let anw = document.createAttribute("width");
493      anw.nodeValue = w;
494      let anh = document.createAttribute("height");
495      anh.nodeValue = h;
496      canvas.setAttributeNode(anw);
497      canvas.setAttributeNode(anh);
498      ctx.drawImage(img, 0, 0, w, h);
499      // 图像质量
500      if (obj.quality && obj.quality <= 1 && obj.quality > 0) {
501          quality = obj.quality;
502      }
503      // quality值越小，所绘制出的图像越模糊
504      let base64 = canvas.toDataURL('image/jpeg', quality);
505      // 回调函数返回base64的值
506      callback(base64);
507  }
508}
509function convertBase64UrlToBlob(urlData) {
510  let arr = urlData.split(','), mime = arr[0].match(/:(.*?);/)[1],
511      bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n);
512  while (n--) {
513      u8arr[n] = bstr.charCodeAt(n);
514  }
515  return new Blob([u8arr], {type:mime});
516}
517function loading(str) {
518    $('.loading').text(str);
519    $('.loading').css('display', 'block');
520    setTimeout(function () {
521        $('.loading').text('处理中...');
522        $('.loading').css('display', 'none');
523        $('.zhezhao').css('display', 'none');
524    }, 2000)
525
526}
527
528function setLoading(k) {
529    if (k) {
530        $('.loading').text('处理中...');
531        $('.loading').css('display', 'block');
532        $('.zhezhao').css('display', 'block');
533    } else {
534        $('.loading').css('display', 'none');
535        $('.zhezhao').css('display', 'none');
536    }
537}
538
539function toPostEdior(url) {
540    let lastPos = url.lastIndexOf('.gif')
541    if (lastPos > -1) {
542        document.querySelector(".file-dropzone").style.display = 'none'
543        Notification('仅支持PNG、JPG、JPEG、BMP格式')
544        return
545    }
546    localStorage.setItem('initImg', url)
547    oFile.val('');
548    // setLoading()
549    window.location.href = toUrl;
550}
551
552$('.photoHisList .itmes').on('click', function () {
553    toUrl = 'currencyBatch.html';
554    var url = $(this).attr('imgsrc');
555    // console.log(url)
556    toPostEdior(url)
557})
558
559function upbymobile(k) {
560    toUrl = ['idPhoto.html', 'imagePhoto.html', 'onlineImage.html'][k];
561    $.ajax({
562        url: devbase + '/oss/newUploadTask',
563        type: 'get',
564        dataType: 'json',
565        xhrFields: {
566            withCredentials: true
567        },
568        headers: {
569            token: token
570        },
571        data: {},
572        success: function (res) {
573            if (!res.code) {
574                taskFlag = res.data;
575                qrcode.makeCode(urlhref + "/uploadBymobile.html?taskFlag=" + res.data);
576                setDiog(1);
577                lunxun()
578            } else loading(res.msg)
579        }
580    })
581}
582
583function lunxun() {
584    $.ajax({
585        url: devbase + '/oss/getUploadTask',
586        type: 'get',
587        dataType: 'json',
588        xhrFields: {
589            withCredentials: true
590        },
591        headers: {
592            token: token
593        },
594        data: {
595            taskFlag: taskFlag
596        },
597        success: function (res) {
598            if (!res.code) {
599                if (res.data.status === 2) {
600                    setDiog();
601                    toPostEdior(res.data.url)
602                } else timer = setTimeout(lunxun, 2000)
603            } else loading(res.msg)
604        }
605    })
606}
607
608function setDiog(k) {
609    clearTimeout(timer)
610    if (k) {
611        $('.diglog').css('display', 'block');
612        $('.zhezhao').css('display', 'block');
613    } else {
614        $('.diglog').css('display', 'none');
615        $('.zhezhao').css('display', 'none');
616    }
617}
618stopPrevent()
619
620function setWindeom() {
621    let sc = document.documentElement.clientWidth / 1920;
622    let md = document.getElementById('view')
623    md.setAttribute('content', "width=device-width,initial-scale=" + sc.toFixed(2))
624}
625
626setWindeom()