userscripts/Quizlet.user.js at main · inVariabl/userscripts · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
// ==UserScript==
// @name        Quizlet JSON
// @namespace   Violentmonkey Scripts
// @include     https://quizlet.com/*/*
// @grant       none
// @version     1.0
// @author      Daniel Crooks
// @description View Quizlets in a clean table, easily searchible
// ==/UserScript==

function getQuizletJSON() {
	const data = document.getElementsByClassName("TermText");
	let term, definition;
	let flashcards = []; // [[term, definition], [term, definition]]
	for (let i = 0; i < data.length; i += 2) {
		term = data[i].innerText.replace("\n-", " ");
		definition = data[i+1].innerText.replace("\n-", " ");
		//console.log({term, definition});
		flashcards.push([term, definition]);
	}
	return flashcards;
}

function displayAsTable(flashcards) {
	const newTab = window.open();
	let content;
	const style = `<style>
	html {
		background: #0a092d;
		color: #f6f7fb;
	}
	table {
		font-family: Atkinson Hyperlegible, sans-serif;
  		border-collapse: collapse;
  		width: 100%;
	}
	td, th {
  		text-align: center;
  		padding: 15px;
	}
	tr:nth-child(even) {
  		background-color: #2e3856;
	}</style>`;

	const tableHeader = `<table><tr><th>Term</th><th>Definition</th></tr>`;

	for (let i = 0; i < flashcards.length; i++) {
		content += `<tr><td>${flashcards[i][0]}</td><td>${flashcards[i][1]}</td></tr>`;
	}

	let html = style + tableHeader + content + `</table>`;

	newTab.document.write(html);
	newTab.document.close();
}

const flashcards = getQuizletJSON();
displayAsTable(flashcards);