您需要先安装一个扩展,例如 篡改猴、Greasemonkey 或 暴力猴,之后才能安装此脚本。
您需要先安装一个扩展,例如 篡改猴 或 暴力猴,之后才能安装此脚本。
您需要先安装一个扩展,例如 篡改猴 或 暴力猴,之后才能安装此脚本。
您需要先安装一个扩展,例如 篡改猴 或 Userscripts ,之后才能安装此脚本。
您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey,才能安装此脚本。
您需要先安装用户脚本管理器扩展后才能安装此脚本。
New Face For Dokiitoys
// ==UserScript== // @name NewFaceForDokiitoys // @namespace http://tampermonkey.net/ // @version 1.1 // @description New Face For Dokiitoys // @author Mesak // @match https://www.dokiitoys.com/faq // @match https://www.dokiitoys.com/member/wishlist // @require https://code.jquery.com/jquery-2.1.4.min.js // @require https://cdnjs.cloudflare.com/ajax/libs/template7/1.4.1/template7.min.js // @license MIT // @grant GM_addElement // @grant GM_addStyle // ==/UserScript== (function($) { //'use strict'; const BaseUrl = 'https://www.dokiitoys.com/' $('link[href^="https://hinetcdn.waca.ec"]').remove(); GM_addElement('link', { href: 'https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css', rel: 'stylesheet' }); GM_addElement('link', { href: 'https://cdnjs.cloudflare.com/ajax/libs/admin-lte/3.2.0/css/adminlte.min.css', rel: 'stylesheet' }); const appMainTmpl = ` <aside class="main-sidebar sidebar-dark-primary elevation-4"> <section class="sidebar os-host os-theme-light os-host-overflow os-host-overflow-y os-host-resize-disabled os-host-scrollbar-horizontal-hidden os-host-transition" id="sidebar"> </section> </aside> <div class="content-wrapper"> <section class="content-header"> <div class="container-fluid"> <div class="well well-sm"> <strong>Category Title</strong> <div class="btn-group"> <a href="#" id="list" class="btn btn-default btn-sm"><span class="glyphicon glyphicon-th-list"> </span>List</a> <a href="#" id="grid" class="btn btn-default btn-sm"><span class="glyphicon glyphicon-th"></span>Grid</a> </div> </div> </div> </section> <section class="content" id="content"> <div class="container-fluid"> <div class="card card-solid"> <div class="card-body pb-0"> <div class="row" id="productList"></div> <div id="moreProduct"></div> </div> </div> </div> </section> </div> `; const productListTmpl = ` {{#each list}} <div class="col-12 col-sm-6 col-md-4 d-flex align-items-stretch flex-column"> <div class="card bg-light d-flex flex-fill"> <div class="card-header text-muted border-bottom-0"> {{title}} </div> <div class="card-body pt-0"> <div class="row"> <div class="col"> <img src="{{photo}}" alt="{{title}}" class="img-fluid w-100"> </div> </div> </div> <div class="card-footer"> <div class="text-right"> <p class="lead">{{product_price price}}</p> <a href="{{link}}" class="btn btn-sm btn-primary"> <i class="fas fa-cart"></i> 產品連結 </a> </div> </div> </div> </div> {{/each}} ` const btnMoreProductTmpl = `<button class="btn btn-success" id="btnLoadMore" data-cid="{{cid}}" data-type="{{type}}" data-page="{{page}}">more</button>` GM_addStyle(`.glyphicon { margin-right:5px; } `) Template7.registerHelper('product_price', function (price) { return price.toString() == '0' ? '完售' : price; }); let $sidebarHTML = $('.el_nav_aside_inner').clone().attr('class','nav nav-pills nav-sidebar flex-column'); $sidebarHTML.find('li').attr('class','nav-item'); $sidebarHTML.find('ul').attr('class','nav'); $sidebarHTML.find('a').attr('class','nav-link').removeAttr('style'); $sidebarHTML.find('input').remove(); document.querySelector('body').setAttribute('class','sidebar-mini layout-fixed') document.querySelector('body').setAttribute('style','height: auto;') document.querySelector('body').innerHTML = Template7.compile(`<div id="app" class="wrapper">{{ body }}</div>`)({body:appMainTmpl}); var resource = new Map(); var $eleContent = $('#content') var $eleSidebar = $('#sidebar') var $eleProductList = $('#productList') var $eleMoreProduct = $('#moreProduct') $eleSidebar.append( $sidebarHTML ); $eleSidebar.on('click' , 'a', (e)=>{ let url = $(e.currentTarget).attr('href') getContent( getUrl( url ) ) e.preventDefault() }) $eleMoreProduct.on('click','#btnLoadMore' , ()=>{ if( $('#btnLoadMore').data('type') == 'category'){ runGetCategory( $('#btnLoadMore').data('cid') , $('#btnLoadMore').data('page') ) }else{ runGetNew($('#btnLoadMore').data('page') ) } }) runGetNew( 1 ) function getUrl( url ){ return BaseUrl + url.replace(BaseUrl,''); } function getContent( url ){ let RegExpObject = /category\/(\d+)/ if( url.indexOf( 'category/' ) != -1 && RegExpObject.test(url)){ let categoryId = url.match(RegExpObject)[1]; $eleProductList.empty(); runGetCategory(categoryId,1); } } function runGetNew( page ){ getProductList('newest', null , page).then( (result) => { $.each(result, (index,item) => { resource.set(item.id, item); }) return {list:result} }).then( (data) => { //console.log( data ) if( data.list.length == 20){ $eleMoreProduct.html(Template7.compile(btnMoreProductTmpl)({page : (page+1), 'type':'newest'})) }else{ $eleMoreProduct.empty(); } $eleProductList.append( Template7.compile(productListTmpl)(data)) }) } function runGetCategory(cid, page ){ getProductList('category',cid , page).then( (result) => { $.each(result, (index,item) => { resource.set(item.id, item); }) return {list:result} }).then( (data) => { //console.log( data ) if( data.list.length == 20){ $eleMoreProduct.html(Template7.compile(btnMoreProductTmpl)({cid: cid , page : (page+1) , 'type':'category'})) setTimeout( ()=>{ $('#btnLoadMore').click(); },500) }else{ $eleMoreProduct.empty(); } $eleProductList.append( Template7.compile(productListTmpl)(data)) }) } function getProductList(type = 'category',categoryId = null , page = 1){ return new Promise((resolve, reject) => { $.post( 'https://www.dokiitoys.com/productlist' ,{ type: type, value: categoryId, sort: 'newest', page: page } , (response)=>{ let oFragmeng = $(document.createDocumentFragment()); oFragmeng.append(response); let result = []; $('li.item_block', oFragmeng).each( (key,node) => { let itemPhoto = $('span.item_photo',node); let itemLink = $('a.clearfix:first',node); let itemBtn = $('button.js_wishlist_add',node); let item = { id : itemBtn.attr('data-pid'), link : itemLink.attr('href'), photo : itemPhoto.attr('data-src'), title : itemPhoto.attr('title'), price : 0 , } if( $('span.font_montserrat',node).length ) { item.price = $('span.font_montserrat',node).text() } result.push(item) }) resolve(result); }) }); } })(window.jQuery);