Giter Club home page Giter Club logo

quizletanswers's Introduction

Quizlet Explanations Unlocker

MIT License Size JavaScript HTML5 GreasyFork

Ever since Quizlet bought Slader and locked the community-made answers behind a paywall, thousands of high school students have been unable to access the files they need to complete their homework. In order to remedy this situation, I have created a simple Tampermonkey script that will bypass the paywall in an account that is not logged in.

This is purely for educational purposes (quite literally) and if you want me to take this down I shall. Please contact me through this email.

Installation

For now, this is a Tampermonkey script that will run in the browser. In order to install this script, download and add Tampermonkey to your web browser (script only tested on Chrome).

Installation

After installing Tampermonkey, a new tab will open. You can click out of that.

If you already have Tampermonkey, install this script from Greasyfork.

The easiest way to install the script is to copy and paste the script from this repo into Tampermonkey. You can also drag and drop it if you download it directly from the repo, the file is named "Quizlet Answers.user.js".

// ==UserScript==
// @name         Quizlet Editor
// @match        http*://www.quizlet.com/explanations/textbook-solutions/*
// @match        http*://quizlet.com/explanations/textbook-solutions/*
// @version      0.2
// @description  Remove paywall for Quizlet answers
// @author       troop129 + josephyooo
// @grant        none
// @run-at  document-end
// ==/UserScript==
window.addEventListener('load', function() {
    'use strict';
    var paywall = document.getElementsByClassName('wugyavo');
    if(paywall.length != 0){
        paywall[0].remove();
        document.getElementsByClassName('ExplanationSolutionsContainer hnqbbas s1oluvjw')[0].style.overflow="visible";
        let newHeight = document.getElementsByClassName('ExplanationsSolutionCard c5ngj6s')[0].offsetHeight;
        document.getElementsByClassName('mv7e89c')[0].style.minHeight=newHeight+"px";
    }
}, false);

Do this by opening the extensions menu, then clicking on "Create a new script". You can drag and drop here (after clearing the screen) or select all, delete, and copy-paste.

Then press "Ctrl + S" to save and it should automatically be activated.

Installation p2

Usage

THIS SCRIPT WILL NOT WORK WITH A LOGGED IN ACCOUNT!! Use incognito mode or another chrome profile where you are not logged in. Quizlet does not show the preview for the answers when you are logged in, so we cannot scrape it. You can enable this extension in incognito by right-clicking > "Manage Extensions" > "Allow in Incognito". I would recommend pinning Tampermonkey for easy access.

Enabling Incognito

In order to use this extension, just go to the page you would like the answers for and wait. In order to get the right <div> tags we have to wait for the page to fully load.

Free Answers

How?

If you look at the Chrome Console, the HTML for the Quizlet answers page has two interesting parts for us. <div class="wugyavo"> and <div class="hs7m9cv s1oluvjw">.

wugyyavo This div contains the paywall itself, which we can just delete with the following code:

 var paywall = document.getElementsByClassName('wugyavo');
 paywall[0].remove();

What remains is the snippet of answer (now helpfully unblurred) but most likely cut off, as you can see in the snippet below.

hs7m9cv s1oluvjw

In order to solve this, we can add some styling to the hs7m9cv s1oluvjw tag, which contains the answer. This will allow it to scroll and although it is not visually pleasing, it is functional.

document.getElementsByClassName('ExplanationSolutionsContainer hnqbbas s1oluvjw')[0].style.overflow="visible";

As you can see, the script appends the overflow:visible tag. This makes the box free from being cut off and we can see all of it rendered at once. This does cut off some of the text below it, so it needs a bit of logic to fix that.

let newHeight = document.getElementsByClassName('ExplanationsSolutionCard c5ngj6s')[0].offsetHeight;
document.getElementsByClassName('mv7e89c')[0].style.minHeight=newHeight+"px";

This finds the new height of the box and adds it to the height of the box. Still has a lot of edge case errors, but not a bad band-aid overall.

HTML after edit

Issues

Still cuts off the buttons below the answers some times. Also sometimes has too much space taken up.

Next Steps

I would like to spend more than 5 minutes on reorganizing the page to fit the new visible answer, it does need some reoganizing.

Contributing

Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.

License

MIT

Changelog

  • 10/24/2022: v0.2 - Updating to working again, make overflow visible instead of scroll.

quizletanswers's People

Contributors

troop129 avatar josephyooo avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.