扇贝背单词小插件

word_list.js

// usage: open chrome console, paste this and enter

const WORD_PER_PAGE = 10;
const START_PAGE = 1;
const END_PAGE = 10;
const BOOK_ID = 'tvbmg';
// const WORD_LIST_TYPE = 4;  // 今日新词
const WORD_LIST_TYPE = 5;  // 今日复习

function playItHere(e, link) {
  var audio = document.createElement("audio");
  var src = document.createElement("source");
  src.src = link.href;
  audio.appendChild(src);
  audio.play();
  e.preventDefault();
}

class Consumer {
	constructor() {
		this.dict = []
		this.counter = 0;
		this.seperator = Array(5).fill('\t').join('');
	}

	get_ipa_html(sound_url, ipa) {
		return `<a class="Pronounce_phonetic__1bcqt" href="${sound_url}" onclick="playItHere(event, this)" style="color: inherit; text-decoration: inherit;">/${ipa}/</a>`;
	}

	get_chinese_html(chinese, word_url) {
		return `<a class="index_bottom__XLoPQ" style="color: inherit; text-decoration: inherit;" href="${word_url}" target="_blank">${chinese}</a>`
	}

	get_english_html(word) {
		return `<div style="color: inherit; text-decoration: inherit; font-weight: 700">${word}</div>`
	}

	output(word, chinese, ipa_us, sound_us_url, word_url) {
		let args = Array.prototype.slice.call(arguments);
		console.log(args.join(this.seperator));
		let ipa_html = this.get_ipa_html(sound_us_url, ipa_us);
		let chinese_html = this.get_chinese_html(chinese, word_url);
		let english_html = this.get_english_html(word);
		this.dict.push({'index': this.counter++, 'English': word, 'Chinese': chinese, 'US': ipa_html, 'URL': word_url, 'english_html': english_html, 'chinese_html': chinese_html});
	}

	table() {
		return console.table(this.dict);
	}
}

// from learning.ts
// e = 'tvbmg'
// t = 4
async function getWordListData(book_id, status, ipp = 10, page = 1, version = 20190619) {
	let url = `https://apiv3.shanbay.com/wordsapp/user_material_books/${book_id}/learning/words?ipp=${ipp}&page=${page}&status=${status}&version=${version}`
	// return axios({url: url}).then(res => { let obj = window.bays4.d(res.data.data); console.log(obj); return obj; });
	return fetch(url, {
			"credentials": "include",  // this is important
			"headers": {
					"accept": "application/json, text/plain, */*",
					"sec-fetch-mode": "cors",
					"x-csrftoken": "Sw7SZKY77kcw976awlaaEytaBhbh8adD"
			},
			"referrer": "https://web.shanbay.com/wordsweb/",
			"referrerPolicy": "no-referrer-when-downgrade",
			"body": null,
			"method": "GET",
			"mode": "cors"
	}).then(res => {
			return res.json()
	}).then(res => {
			return JSON.parse(window.bays4.d(res.data));
	});
}

// crawl from start_page to end_page inclusive
async function main($, start_page, end_page) {
	let consumer = new Consumer();

	// assume we are at the first page
	for (let page = start_page; page <= end_page; page++) {
		// fetch data
		let data = await getWordListData(BOOK_ID, WORD_LIST_TYPE, WORD_PER_PAGE, page);
		for (let i = 0; i < data.ipp; i++) {
			let item = data.objects[i];
			let word = item.word;
			let chinese = item.senses[0].pos + ' ' + item.senses[0].definition_cn;
			let vocabulary_id = item.senses[0].vocabulary_id;
			let dictionary_id = item.senses[0].dictionary_id;
			let ipa_us = item.sound.ipa_us;
			let sound_us_url = item.sound.audio_us_urls[0];
			let word_url = `https://web.shanbay.com/wordsweb/#/detail/${vocabulary_id}/${dictionary_id}`
			consumer.output(word, chinese, ipa_us, sound_us_url, word_url);
		}
	}

	consumer.table();

	return consumer.dict;
}


let tabledata;
copy(tabledata = await main($, START_PAGE, END_PAGE));

// insert DIY word table at the bottom of the page

const delay = ms => new Promise(res => setTimeout(res, ms));

function htmlToElement(html) {
    var template = document.createElement('template');
    html = html.trim(); // Never return a text node of whitespace as the result
    template.innerHTML = html;
    return template.content.firstChild;
}

function injectScript(source_url) {
	var node = document.createElement('script');
	node.src = source_url;
	document.getElementsByTagName('head')[0].appendChild(node);
}

document.head.appendChild(htmlToElement(`<link href="https://unpkg.com/[email protected]/dist/css/tabulator.min.css" rel="stylesheet">`));
injectScript("https://unpkg.com/[email protected]/dist/js/tabulator.min.js");

await delay(1000)


document.body.appendChild(htmlToElement(`<div id="word-table"></div>`));
var table = new Tabulator("#word-table", {
	data: tabledata,
	layout: "fitDataFill",
	responsiveLayout: "hide",
	tooltips: true,
	addRowPos: "top",
	history: true,
	pagination: "local",       // paginate the data
	paginationSize: 100,       // allow 100 rows per page of data
	movableColumns: true,      // allow column order to be changed
	resizableRows: true,       // allow row order to be changed
	initialSort: [             // set the initial sort order of the data
		{column: "index", dir: "asc"},
	],
	columns: [
		{title: "index", field: "index", align: "left", editor: false, visible: true},
		{title: "Mark", field: "Mark", align: "center", editor: true, formatter: "tickCross", sorter: "boolean"},
		//{title: "English", field: "English", align: "left", editor: false},
		{title: "English", field: "english_html", align: "left", editor: false, formatter: "html"},
		{title: "US", field: "US", align: "left", editor: false, formatter: "html"},
		{title: "Chinese", field: "chinese_html", align: "left", editor: false, formatter: "html"}
		//{title: "Chinese", field: "Chinese", align: "left", editor: false, formatter: "link", formatterParams: {urlField: "URL", target:"_blank"}}
		//{title: "URL", field: "URL", align: "left", editor: false, formatter: "link", formatterParams: {label: "url"}}
	]
});