wy/wuhu-torn-helper
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

UI调整

Browse Source
This commit is contained in:
Liwanyi 2022-10-11 18:11:53 +08:00
parent 4d287ff83f
commit 0f9bc62039
10 changed files with 194 additions and 135 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
package.json
View File

@ -1,6 +1,6 @@
{
"name": "wuhu-torn-helper",
"version": "0.5.5",
"version": "0.5.6",
"description": "芜湖助手",
"dependencies": {},
"scripts": {

26
src/class/ZhongIcon.ts
View File

@ -26,7 +26,7 @@ import DEV_DETAILS_HTML from "../static/html/zhong/setting/dev_details.html";
import QUICK_FLY_CSS from "../static/css/quick_fly.css";
import QUICK_LINK_CSS from "../static/css/quick_link.css";
import MDUtils from "./utils/MDUtils";
import InfoUtils from "./utils/InfoUtils";
import TornStyleBlock from "./utils/TornStyleBlock";
export default class ZhongIcon extends WuhuBase {
public static ZhongNode: MyHTMLElement = null;
@ -765,29 +765,7 @@ export default class ZhongIcon extends WuhuBase {
clickFunc: async function () {
Log.info('测试开始');
try {
Log.info(ZhongIcon.getPool());
// Log.info(await CommonUtils.ajaxFetch({
// url: window.addRFC('https://www.torn.com/loader.php?sid=lotteryPlay&step=buyTicket&lotteryID=1'),
// method: 'get',
// referrer: '/loader.php?sid=lottery',
// }));
} catch (e) {
Log.error(e);
}
// window.setImmediate(async () => {
let i = 0;
while (i < 10) {
await InfoUtils.getInstance().sleep(5000);
Log.info(performance.now());
i++;
}
// });
new TornStyleBlock('123').insert2Dom();
Log.info('测试结束');
},

28
src/class/action/LotteryHelper.ts
View File

@ -3,12 +3,11 @@ import Log from "../Log";
import InfoUtils from "../utils/InfoUtils";
import MathUtils from "../utils/MathUtils";
import CommonUtils from "../utils/CommonUtils";
import TornStyleBlock from "../utils/TornStyleBlock";
export default class LotteryHelper extends WuhuBase {
private loopFlag = true;
private container: HTMLElement = null;
private title: HTMLElement = null;
private radioDaily: HTMLInputElement = null;
private radioWeekly: HTMLInputElement = null;
private radioMonthly: HTMLInputElement = null;
@ -25,8 +24,6 @@ export default class LotteryHelper extends WuhuBase {
let startTime = performance.now();
Log.info('彩票助手初始化开始');
this.container = document.createElement('div');
this.title = document.createElement('div');
let radioLabelDaily = document.createElement('label');
let radioLabelWeekly = document.createElement('label');
let radioLabelMonthly = document.createElement('label');
@ -40,8 +37,6 @@ export default class LotteryHelper extends WuhuBase {
this.status = document.createElement('div');
this.desc = document.createElement('p');
let {
container,
title,
radioDaily,
radioWeekly,
radioMonthly,
@ -52,11 +47,8 @@ export default class LotteryHelper extends WuhuBase {
status,
desc
} = this;
let progressBarBg = document.createElement('div');
container.classList.add('cont-gray', 'top-round');
title.innerHTML = '彩票助手';
title.classList.add('title-black', 'm-top10', 'top-round');
title.style.marginBottom = '0.5em';
radioDaily.type = 'radio';
radioDaily.name = 'lottery_type';
radioDaily.checked = true;
@ -75,12 +67,19 @@ export default class LotteryHelper extends WuhuBase {
stopBtn.disabled = true;
stopBtn.addEventListener('click', () => this.stop());
stopBtn.classList.add('torn-btn');
progressBarBg.style.width = '100%';
progressBarBg.style.height = '1em';
progressBarBg.style.backgroundColor = '#cecece';
progressBarBg.style.marginTop = '1em';
progressBar.style.width = '0';
progressBar.style.height = '1em';
progressBar.style.backgroundColor = '#00ff00';
progressBar.style.marginTop = '-1em';
progressBar.style.marginBottom = '1em';
status.innerHTML = '0/0';
status.style.marginTop = '-1em';
status.style.marginTop = '-2em';
status.style.textAlign = 'center';
desc.style.marginTop = '1em';
desc.innerHTML = '批量买彩票';
radioLabelDaily.append(radioDaily);
@ -91,12 +90,13 @@ export default class LotteryHelper extends WuhuBase {
radioLabelMonthly.append(radioMonthly);
radioLabelMonthly.append(' 月彩 $1m');
container.append(title,
// container.append(title,
new TornStyleBlock('彩票助手').append(
radioLabelDaily, radioLabelWeekly, radioLabelMonthly, document.createElement('br'),
time, document.createElement('br'),
startBtn, stopBtn,
progressBar, status, desc);
document.querySelector('#websocketConnectionData').after(container);
progressBarBg, progressBar, status, desc).insert2Dom();
// document.querySelector('#websocketConnectionData').after(container);
Log.info('彩票助手初始化结束，耗时：' + (performance.now() - startTime) + 'ms');
}

70
src/class/utils/TornStyleBlock.ts
View File

@ -1,6 +1,70 @@
export default class TornStyleBlock {
private elem: HTMLElement;
import Log from "../Log";
import MathUtils from "./MathUtils";
constructor(title: string) {
export default class TornStyleBlock {
private readonly baseElement: HTMLElement;
private readonly headElement: HTMLElement;
private readonly elem: HTMLElement;
public constructor(title: string) {
this.baseElement = document.createElement('div');
this.headElement = document.createElement('div');
this.elem = document.createElement('div');
this.headElement.classList.add('title-black', 'm-top10', 'top-round');
this.headElement.innerHTML = title;
this.elem.classList.add('cont-gray', 'bottom-round');
this.elem.style.padding = '0.5em';
this.baseElement.append(this.headElement, this.elem);
this.baseElement.id = 'WHTornStyleBlock' + MathUtils.getInstance().getRandomInt(0, 100);
}
public append(...el: Element[]): TornStyleBlock {
this.elem.append(...el);
return this;
}
public appendChild(...el: Element[]): TornStyleBlock {
return this.append(...el)
}
public getBase(): HTMLElement {
return this.baseElement;
}
public getElement(): HTMLElement {
return this.elem;
}
public insert2Dom(after: string = '#websocketConnectionData'): TornStyleBlock {
let anchor = document.querySelector(after);
if (anchor) {
anchor.after(this.baseElement);
} else {
Log.error('[#websocketConnectionData] 不存在，无法将block加入dom树');
throw '芜湖！[#websocketConnectionData] 不存在，无法将block加入dom树';
}
return this;
}
public remove(): void {
this.baseElement.remove();
}
public setTitle(str: string): void {
this.headElement.innerHTML = str;
}
public setContent(html: string): void {
this.elem.innerHTML = html;
}
public querySelector(str: string): HTMLElement {
return this.baseElement.querySelector(str);
}
public querySelectorAll(str: string): NodeListOf<HTMLElement> {
return this.baseElement.querySelectorAll(str);
}
}

99
src/func/module/cityFinder.ts
View File

@ -1,69 +1,29 @@
import toThousands from "../utils/toThousands";
import log from "../utils/@deprecated/log";
import CommonUtils from "../../class/utils/CommonUtils";
import Log from "../../class/Log";
import CITY_FINDER_CSS from "../../static/css/city_finder.css";
import TornStyleBlock from "../../class/utils/TornStyleBlock";
export default function cityFinder(): void {
CommonUtils.addStyle(`
.wh-city-finds .leaflet-marker-pane img[src*="torn.com/images/items/"]{
display: block !important;
box-sizing: border-box;
width: 40px !important;
height: 40px !important;
left: -20px !important;
top: -20px !important;
padding: 10px 0;
border: none;
border-radius: 100%;
background-color:#d2d2d28c;
box-shadow:0 0 10px 5px #000;
z-index: 999 !important;
}
.wh-city-finds .leaflet-marker-pane.leaflet-marker-icon.user-item-pinpoint.leaflet-clickable{display: none !important;}
#wh-city-finder{
box-shadow: 0 0 3px 0px #696969;
border-radius: 4px;
}
#wh-city-finder-header{
background-color: #3f51b5;
color: white;
padding: 8px;
font-size: 15px;
border-radius: 4px 4px 0 0;
text-shadow: 0 0 2px black;
background-image: linear-gradient(90deg,transparent 50%,rgba(0,0,0,.07) 0);
background-size: 4px;
}
#wh-city-finder-cont{
background: #616161;
padding: 8px;
color: #c7c7c7;
border-radius: 0 0 4px 4px;
font-size: 13px;
}
#wh-city-finder-cont span{
margin:2px 4px 2px 0;
padding:2px;
border-radius:2px;
background:green;
color:white;
display:inline-block;
}
`);
CommonUtils.addStyle(CITY_FINDER_CSS);
// 物品名与价格
let items = null;
const base = document.createElement('div');
base.id = 'wh-city-finder';
const container = document.createElement('div');
container.id = 'wh-city-finder-cont';
const header = document.createElement('div');
header.id = 'wh-city-finder-header';
header.innerHTML = '捡垃圾助手';
// const base = document.createElement('div');
// base.id = 'wh-city-finder';
// const container = document.createElement('div');
// container.id = 'wh-city-finder-cont';
// const header = document.createElement('div');
// header.id = 'wh-city-finder-header';
// header.innerHTML = '捡垃圾助手';
const info = document.createElement('div');
info.innerHTML = '已找到物品：';
container.append(info);
base.append(header);
base.append(container);
// container.append(info);
// base.append(header);
// base.append(container);
let _base = new TornStyleBlock('捡垃圾助手').insert2Dom().append(info);
document.body.classList.add('wh-city-finds');
CommonUtils.COFetch('https://jjins.github.io/item_price_raw.json')
.then(r => items = JSON.parse(r))
.catch(err => {
@ -71,8 +31,8 @@ display:inline-block;
items = undefined
});
CommonUtils.elementReady('div.leaflet-marker-pane').then(elem => {
document.querySelector('#map').classList.add('wh-city-finds');
document.querySelector('.content-wrapper').prepend(base);
// document.querySelector('.content-wrapper').prepend(base);
// 发现的物品id与map img node
const founds = [];
elem.querySelectorAll('img.map-user-item-icon').forEach(node => {
@ -81,11 +41,11 @@ display:inline-block;
finder_item.id = 'wh-city-finder-item' + item_id;
finder_item.innerHTML = item_id;
founds.push({ 'id': item_id, 'node': finder_item, 'map_item': node });
container.append(finder_item);
// container.append(finder_item);
_base.append(finder_item);
});
// 未发现物品 返回
if (founds.length === 0) {
// header.innerHTML = '捡垃圾助手';
info.innerHTML = '空空如也，请大佬明天再来';
return;
}
@ -102,13 +62,14 @@ display:inline-block;
else if (value < 1000000) el.node.style.backgroundColor = '#4caf50';
// 蓝色 25m以下
else if (value < 25000000) el.node.style.backgroundColor = '#03a9f4';
// 橙色 500m以下
else if (value < 500000000) el.node.style.backgroundColor = '#ffc107';
// 红色 >500m
else if (value >= 500000000) el.node.style.backgroundColor = '#f44336';
// 橙色 449m以下
else if (value < 449000000) el.node.style.backgroundColor = '#ffc107';
// 红色 >449m
else if (value >= 449000000) el.node.style.backgroundColor = '#f44336';
total += items[el.id]['price'];
});
header.innerHTML = `捡垃圾助手 - ${ founds.length } 个物品，总价值 $${ toThousands(total) }`;
// header.innerHTML = `捡垃圾助手 - ${ founds.length } 个物品，总价值 $${ toThousands(total) }`;
_base.setTitle(`捡垃圾助手 - ${ founds.length } 个物品，总价值 $${ toThousands(total) }`);
};
// 未取到数据时添加循环来调用函数
if (items === null) {
@ -118,11 +79,11 @@ display:inline-block;
timeout--;
if (items !== null) {
displayNamePrice();
clearInterval(interval);
window.clearInterval(interval);
}
if (0 === timeout) {
log.info('获取物品名称与价格信息超时')
clearInterval(interval)
Log.info('获取物品名称与价格信息超时')
window.clearInterval(interval)
}
}, 500);
}

48
src/static/css/city_finder.css Normal file
View File

@ -0,0 +1,48 @@
.wh-city-finds .leaflet-marker-pane img[src*="torn.com/images/items/"] {
display: block !important;
box-sizing: border-box;
width: 40px !important;
height: 40px !important;
left: -20px !important;
top: -20px !important;
padding: 10px 0;
border: none;
border-radius: 100%;
background-color: #d2d2d28c;
box-shadow: 0 0 10px 5px #000;
z-index: 999 !important;
}
.wh-city-finds .leaflet-marker-pane.leaflet-marker-icon.user-item-pinpoint.leaflet-clickable {
display: none !important;
}
/*#wh-city-finder{*/
/* box-shadow: 0 0 3px 0px #696969;*/
/* border-radius: 4px;*/
/*}*/
/*#wh-city-finder-header{*/
/* background-color: #3f51b5;*/
/* color: white;*/
/* padding: 8px;*/
/* font-size: 15px;*/
/* border-radius: 4px 4px 0 0;*/
/* text-shadow: 0 0 2px black;*/
/* background-image: linear-gradient(90deg,transparent 50%,rgba(0,0,0,.07) 0);*/
/* background-size: 4px;*/
/*}*/
/*#wh-city-finder-cont{*/
/* background: #616161;*/
/* padding: 8px;*/
/* color: #c7c7c7;*/
/* border-radius: 0 0 4px 4px;*/
/* font-size: 13px;*/
/*}*/
/*#wh-city-finder-cont span{*/
/* margin:2px 4px 2px 0;*/
/* padding:2px;*/
/* border-radius:2px;*/
/* background:green;*/
/* color:white;*/
/* display:inline-block;*/
/*}*/

42
src/static/css/common.css
View File

@ -99,7 +99,7 @@ div#effectiveness-wrap {
width: 100%;
height: 100%;
background: #00000090;
color: #333;
/*color: #333;*/
}
div#wh-popup::after {
@ -114,14 +114,14 @@ div#wh-popup::after {
#wh-popup-container {
max-width: 568px;
margin: 5em auto 0;
background: #d7d7d7;
/*background: #d7d7d7;*/
min-height: 120px;
box-shadow: 0 0 5px 1px #898989;
border-radius: 4px;
/*border-radius: 4px;*/
}
#wh-popup-title p {
padding: 1em 0;
/*padding: 1em 0;*/
font-size: 16px;
font-weight: bold;
text-align: center;
@ -207,21 +207,25 @@ div#wh-popup::after {
display: none !important;
}
#wh-gym-info-cont {
background-color: #363636;
color: white;
padding: 8px;
font-size: 15px;
border-radius: 4px;
text-shadow: 0 0 2px black;
background-image: linear-gradient(90deg, transparent 50%, rgba(0, 0, 0, .07) 0);
background-size: 4px;
line-height: 20px;
.wh-gym-stack #gymroot {
display: none !important;
}
#wh-gym-info-cont button {
cursor: pointer;
}
/*#wh-gym-info-cont {*/
/* background-color: #363636;*/
/* color: white;*/
/* padding: 8px;*/
/* font-size: 15px;*/
/* border-radius: 4px;*/
/* text-shadow: 0 0 2px black;*/
/* background-image: linear-gradient(90deg, transparent 50%, rgba(0, 0, 0, .07) 0);*/
/* background-size: 4px;*/
/* line-height: 20px;*/
/*}*/
/*#wh-gym-info-cont button {*/
/* cursor: pointer;*/
/*}*/
#wh-notify {
display: inline-block;
@ -268,3 +272,7 @@ div#wh-popup::after {
#wh-notify .wh-notify-item .wh-notify-msg {
padding: 12px;
}
.non-selection {
user-select: none;
}

2
src/static/html/danger_zone.html
View File

@ -1,5 +1,5 @@
<p>即将打开危险功能，使用这些功能可能会造成账号封禁。请自行考虑是否使用。</p>
<p><label><input type="checkbox" {{}}/> 知道了，开启</label></p>
<div>
<button disabled>保存</button>
<button class="torn-btn" disabled>保存</button>
</div>

10
src/static/html/popup.html
View File

@ -1,7 +1,7 @@
<div id="wh-popup-container">
<style>html {
<style>html {
overflow: hidden !important;
}</style>
<div id="wh-popup-title"><p>{{}}</p></div>
<div id="wh-popup-cont">{{}}</div>
}</style>
<div class="border-round" id="wh-popup-container">
<div class="title-black top-round" id="wh-popup-title"><p>{{}}</p></div>
<div class="scroll-area scrollbar-transparent cont-gray bottom-round" id="wh-popup-cont">{{}}</div>
</div>

0
src/static/json/css.json → src/static/json/__css__.json
View File