// ==UserScript==
// @name 扩展设计器网页审核回复模版
// @namespace http://tampermonkey.net/
// @version 0.3
// @description try to take over the world!
// @author You
// @match https://ext.mblock.cc/
// @match https://ext.makeblock.com/
// @grant none
// ==/UserScript==
(function() {
'use strict';
// Your code here...
window.onload = ()=>{
addjQuery(()=>{
allFunction();
});
}
function allFunction(){
//add css
let style = document.createElement('style');
let allData;
let csss = `
.button-reply {
z-index: 1; position: fixed; top: 60px; z-index: 999 !important; right: 20px;
}
.aside {
padding: 105px 0 20px; background: white;
width: 300px; height: 100%; position: fixed; right: 0; top: 0; transform: translateX(100%); transition: transform .4s; z-index: 2; box-shadow: -2px 2px 5px 0 rgba(0,0,0,.4);
overflow-y: auto;
}
.aside.active {transform: translateX(0%);}
.each-rw {padding: 15px 15px; border-bottom: 1px solid rgba(0,0,0,0.1); cursor: pointer;}
.each-rw:hover {background: #f2f8ff;}
.hint {color: #b2b2b2;}
.copiedPrompt {
position: fixed;
left: 50%;
transform: translateX(-50%);
top: 70px;
color: red;
opacity: 0;
padding: 10px;
border-radius: 4px;
background: rgba(255, 255, 255, 0.4);
box-shadow: 0 10px 24px rgba(8, 15, 26, 0.16);
-webkit-backdrop-filter: blur(10px);
backdrop-filter: blur(10px);
}
.copiedPrompt.active {opacity: 1;}
label.filter {display: inline-block;padding: 3px 10px;cursor: pointer;}
.switch-wrap {display:flex; flex-wrap: wrap;}
`
style.innerText = csss;
document.head.appendChild(style);
//mock data
/* let data = [{
text: 'Congrats! You could create demos based on your extension in the community: http://planet.mblock.cc/, and then paste the demo work link into your "extesion homepage" section in the extension builder.',
hint: "当用户扩展审核通过时"
},{
text: "Congrats your extension passed. However, please add more content (like blocks) for your extension to make it better and more interesting for users of mBlock",
hint: "当扩展积木较少,但是没有大问题时"
},{
text: "Congrats your extension passed. However, please choose a meaningful cover that is more related to the functionality of your extension. This will help others know what your extension is about.",
hint: "当扩展没有大问题,但封面图片不相关或者无实际意义时"
},{
text: "Congrats! However, please add more details for your next update. We will release an extension market soon, those description will be important as your extension info.",
hint: "当扩展没有大问题,但更新说明过于简短时"
},];
let zhData = [{
text: '审核通过!如果想让更多人学会使用您的扩展,可以到作品社区使用您的扩展创建作品,展示如何使用您的扩展:http://mblock.makeblock.com/ 然后可以在扩展设计器中将作品主页链接更新到扩展主页一栏,方便使用者查看案例',
hint: "当用户扩展审核通过时"
},{
text: "恭喜您的扩展审核通过,但是内容仍然需要一定程度的完善和丰富,建议您可以多增加一些积木。",
hint: "当扩展积木较少,但是没有大问题时"
},{
text: "恭喜您的扩展审核通过,但是出于扩展展示的目的,请您为自己的扩展更换更合适,更能表现您扩展特色,以及增加扩展吸引力的封面",
hint: "当扩展没有大问题,但封面图片不相关或者无实际意义时"
},];
*/
//
console.log("you‘re using扩展设计器网页脚本")
let aside = document.createElement('div'); /*侧边栏*/
let reviewWrap = document.createElement('div'); /*侧边栏里wrap*/
aside.classList.add('aside');
document.body.appendChild(aside); /*页面插入checkbox*/
fillInCategory(); /*植入checkbox*/
aside.appendChild(reviewWrap); /*植入评论wrap*/
reviewWrap.classList.add('reviews');
let asideState = false /*侧边栏状态*/
let copiedPrompt = document.createElement('p'); /*已复制 提示文字*/
copiedPrompt.classList.add('copiedPrompt');
//copiedPrompt.textContent = '已填充回复!'
copiedPrompt.textContent = '已复制到剪切板!'
let btnEl = document.createElement('button'); /*弹出按钮*/
btnEl.textContent = '回复模版'
btnEl.classList.add('button-reply')
btnEl.classList.add('ant-btn')
btnEl.classList.add('ant-btn-primary')
btnEl.classList.add('ant-btn-lg')
btnEl.setAttribute('id','template')
// console.log(btnEl);
document.body.appendChild(btnEl);
btnEl.addEventListener('click', (e)=>{
switchPopState(asideState);
asideState = !asideState;
e.stopPropagation();
})
document.body.addEventListener('click', ()=>{
if(asideState) switchPopState(true);
asideState = false;
})
aside.addEventListener('click', (e)=>{
e.stopPropagation();
})
//将数据放入侧边栏中
// window.addEventListener('load', ()=>{
fetch('https://hobart.avosapps.us/api/audit/content/query')
.then(e=>e.json())
.then((e)=>{
console.log(e)
let {data} = e;
allData = data;
dataToDOM(data)
aside.parentNode.appendChild(copiedPrompt);
})
// })
showExtensionID();
/*
*评论数据DOM渲染
*/
function dataToDOM(data){
let els = document.createDocumentFragment();
$('.aside .reviews').empty();
data.forEach(e=>{
let el = `
<div class='each-rw' title='点击以填充到评论框'>
<p class='text'>${e.text}</p>
<p class='hint'>${'注: '+e.hint}</p>
</div>
`
let $el = $(el)
els.appendChild($el[0]);
$el.on('click', ()=>{
let $reason = document.querySelector('#reason');
if(!$reason) {
copiedPrompt.textContent = '请先打开评论框'
triggerToast(3000);
return
};
//$reason.value = e.text;
triggerToast(3000);
copyText(e.text, ()=>{
copiedPrompt.textContent = '已复制到剪切板!'
triggerToast(3000);
})
})
})
reviewWrap.appendChild(els);
}
/*
*切换侧边栏弹出方法
*/
function switchPopState(state){
if(!state) {
aside.classList.add('active')
btnEl.innerText = '关闭'
}else{
aside.classList.remove('active')
btnEl.innerText = '回复模版'
}
}
/*复制到剪切板*/
function copyText(text, callback){ // text: 要复制的内容, callback: 回调
var tag = document.createElement('input');
tag.setAttribute('id', 'cp_hgz_input');
tag.value = text;
document.getElementsByTagName('body')[0].appendChild(tag);
document.getElementById('cp_hgz_input').select();
document.execCommand('copy');
document.getElementById('cp_hgz_input').remove();
if(callback) {callback(text)}
}
/*触发提示框*/
function triggerToast(time){
if(!time) time = 3000;
copiedPrompt.classList.add('active');
let id = setTimeout(()=>{
copiedPrompt.classList.remove('active');
window.clearTimeout(id);
},time)
}
/*填充分类选项*/
function fillInCategory(){
let categoryDOM = `
<div class='switch-wrap'>
<label for='ad_Checkbox1' class='filter'>所有
<input name="selector[]" id="ad_Checkbox1" class="ads_Checkbox" type="checkbox" value="all" checked/>
</label>
<label for='ad_Checkbox2' class='filter'>
中文
<input name="selector[]" id="ad_Checkbox2" class="ads_Checkbox" type="checkbox" value="zh" />
</label>
<label for='ad_Checkbox3' class='filter'>
英文
<input name="selector[]" id="ad_Checkbox3" class="ads_Checkbox" type="checkbox" value="en" />
</label>
<label for='ad_Checkbox4' class='filter'>
通过
<input name="selector[]" id="ad_Checkbox4" class="ads_Checkbox" type="checkbox" value="1" />
</label>
<label for='ad_Checkbox5' class='filter'>
不通过
<input name="selector[]" id="ad_Checkbox5" class="ads_Checkbox" type="checkbox" value="0" />
</label>
</div>
`
let $categoryDOM = $(categoryDOM);
$(aside).append($categoryDOM[0]);
$('.ads_Checkbox').on('change', function(){
var val = [];
$(':checkbox:checked').each(function(i){
val[i] = $(this).val();
});
if(val.includes('all')) {
dataToDOM(allData)
}else{
let data = Datafilter(val, allData);
dataToDOM(data);
}
});
}
}
function showExtensionID(){
$('.table-list-item').each((index,e)=>{
let href = $(e).find('.list-cell a').attr('href');
if(href) {
let id = href.split('/');
id = id[id.length-1];
id = id.replace('.mext', "");
$(e).append(`<div>ID: ${id}</div>`)
};
})
}
function Datafilter(val, allData){
console.log(val);
let data = [];
if(val.length && val.length > 0) {
allData.forEach(e=>{
val.forEach(i=>{
if(i === '0' || i === '1') { i = i - 0; console.log(i)}
if(e.lang === i || e.resloveType === i) {
data.push(e)
}
})
})
}
return data
}
/*移动按钮位置*/
// dragElement(document.getElementById("template"));
// function dragElement(elmnt) {
// console.log(elmnt);
// var pos1 = 0, pos2 = 0, pos3 = 0, pos4 = 0;
// elmnt.addEventListener('mousedown', dragMouseDown);
// function dragMouseDown(e) {
// console.log(e)
// e = e || window.event;
// e.preventDefault();
// // get the mouse cursor position at startup:
// pos3 = e.clientX;
// pos4 = e.clientY;
// document.onmouseup = closeDragElement;
// // call a function whenever the cursor moves:
// document.onmousemove = elementDrag;
// }
// function elementDrag(e) {
// e = e || window.event;
// e.preventDefault();
// // calculate the new cursor position:
// pos1 = pos3 - e.clientX;
// pos2 = pos4 - e.clientY;
// pos3 = e.clientX;
// pos4 = e.clientY;
// // set the element's new position:
// elmnt.style.top = (elmnt.offsetTop - pos2) + "px";
// elmnt.style.left = (elmnt.offsetLeft - pos1) + "px";
// }
// function closeDragElement() {
// // stop moving when mouse button is released:
// document.onmouseup = null;
// document.onmousemove = null;
// }
// }
/*添加jQuery*/
function addjQuery(fn){
let location = window.location;
let jQueryURL;
if(location.host === 'ext.mblock.cc') {
jQueryURL = `https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js`
}else {
jQueryURL = `https://code.jquery.com/jquery-3.4.1.min.js`
};
let JQscript = document.createElement('script');
JQscript.type = 'text/javascript';
document.body.appendChild(JQscript);
JQscript.onload = fn;
JQscript.src = jQueryURL;
}
})();