Merge pull request #8 from EthanHarv/main

Expand functionality to quizlet questions

README.md

@@ -1,28 +1,30 @@
-# Slader Extension!
+# Slader and Quizlet Extension!
 
-* Bypass Slader's 5 solutions limit per month to college books 
-* Remove the paywall about how many solutions left
+- Bypass Slader/Quizlet's 5 solutions limit per month to college books and questions 
+- Remove the paywall about how many solutions left
 - Support Browser:
-  - Chrome : 87.0.4280.141 
-  - Firefox : 84.0.2
-- Test time : 2021/01/18
+  - Chrome : 91.0.4472.124
+  - Firefox : 90.0
+- Test time : 2021/07/14
 
 # Screenshot
 
-* Before install
+## Before install
 
 ![1](https://raw.githubusercontent.com/lebr0nli/slader-extension/main/sample/before1.png)
 ![2](https://raw.githubusercontent.com/lebr0nli/slader-extension/main/sample/before2.png)
+![3](./sample/quizletbefore.png)
 
-* After install
+## After install
 
-![3](https://raw.githubusercontent.com/lebr0nli/slader-extension/main/sample/after.png)
+![4](https://raw.githubusercontent.com/lebr0nli/slader-extension/main/sample/after.png)
+![5](./sample/quizletafter.png)
 
 # Usage
 
 ## For Chrome
 
-1. Clone(Download) slader-extension.zip from github then unzip 
+1. Download `slader-extension.zip` from github then unzip. (Click the green "Code" button at the top of the page and click "Download ZIP")
 
 or use
 
@@ -40,13 +42,13 @@ or use
 
 ## For Firefox
 
-1. Clone(Download) slader-extension.zip from github then unzip 
+1. Download `slader-extension.zip` from github then unzip. (Click the green "Code" button at the top of the page and click "Download ZIP")
 
 or use
 
  	git clone https://github.com/lebr0nli/slader-extension.git
 
-2. Select the file **slader-limit-bypass.xpi** in **slader-extension-main** 
+2. Select the file **slader_bypass-0.3-fx.xpi** in **slader-extension-main** 
 
 3. Drag the file into the URL bar, click "add" when prompted
 
@@ -58,4 +60,4 @@ Educational using only.
 
 Commercial use is not allowed.
 
-Upgrade your slader's account if you can afford :)
+Upgrade your slader/quizlet account if you can afford! :)

slader-limit-bypass/js/katex/autorender.js

@@ -0,0 +1 @@
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("katex")):"function"==typeof define&&define.amd?define(["katex"],t):"object"==typeof exports?exports.renderMathInElement=t(require("katex")):e.renderMathInElement=t(e.katex)}("undefined"!=typeof self?self:this,(function(e){return function(){"use strict";var t={974:function(t){t.exports=e}},r={};function n(e){var a=r[e];if(void 0!==a)return a.exports;var i=r[e]={exports:{}};return t[e](i,i.exports,n),i.exports}n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,{a:t}),t},n.d=function(e,t){for(var r in t)n.o(t,r)&&!n.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:t[r]})},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)};var a={};return function(){n.d(a,{default:function(){return s}});var e=n(974),t=n.n(e),r=function(e,t,r){for(var n=r,a=0,i=e.length;n<t.length;){var o=t[n];if(a<=0&&t.slice(n,n+i)===e)return n;"\\"===o?n++:"{"===o?a++:"}"===o&&a--,n++}return-1},i=/^\\begin{/,o=function(e,t){for(var n,a=[],o=new RegExp("("+t.map((function(e){return e.left.replace(/[-/\\^$*+?.()|[\]{}]/g,"\\$&")})).join("|")+")");-1!==(n=e.search(o));){n>0&&(a.push({type:"text",data:e.slice(0,n)}),e=e.slice(n));var l=t.findIndex((function(t){return e.startsWith(t.left)}));if(-1===(n=r(t[l].right,e,t[l].left.length)))break;var d=e.slice(0,n+t[l].right.length),s=i.test(d)?d:e.slice(t[l].left.length,n);a.push({type:"math",data:s,rawData:d,display:t[l].display}),e=e.slice(n+t[l].right.length)}return""!==e&&a.push({type:"text",data:e}),a},l=function(e,r){var n=o(e,r.delimiters);if(1===n.length&&"text"===n[0].type)return null;for(var a=document.createDocumentFragment(),i=0;i<n.length;i++)if("text"===n[i].type)a.appendChild(document.createTextNode(n[i].data));else{var l=document.createElement("span"),d=n[i].data;r.displayMode=n[i].display;try{r.preProcess&&(d=r.preProcess(d)),t().render(d,l,r)}catch(e){if(!(e instanceof t().ParseError))throw e;r.errorCallback("KaTeX auto-render: Failed to parse `"+n[i].data+"` with ",e),a.appendChild(document.createTextNode(n[i].rawData));continue}a.appendChild(l)}return a},d=function e(t,r){for(var n=0;n<t.childNodes.length;n++){var a=t.childNodes[n];if(3===a.nodeType){var i=l(a.textContent,r);i&&(n+=i.childNodes.length-1,t.replaceChild(i,a))}else 1===a.nodeType&&function(){var t=" "+a.className+" ";-1===r.ignoredTags.indexOf(a.nodeName.toLowerCase())&&r.ignoredClasses.every((function(e){return-1===t.indexOf(" "+e+" ")}))&&e(a,r)}()}},s=function(e,t){if(!e)throw new Error("No element provided to render");var r={};for(var n in t)t.hasOwnProperty(n)&&(r[n]=t[n]);r.delimiters=r.delimiters||[{left:"$$",right:"$$",display:!0},{left:"\\(",right:"\\)",display:!1},{left:"\\begin{equation}",right:"\\end{equation}",display:!0},{left:"\\begin{align}",right:"\\end{align}",display:!0},{left:"\\begin{alignat}",right:"\\end{alignat}",display:!0},{left:"\\begin{gather}",right:"\\end{gather}",display:!0},{left:"\\begin{CD}",right:"\\end{CD}",display:!0},{left:"\\[",right:"\\]",display:!0}],r.ignoredTags=r.ignoredTags||["script","noscript","style","textarea","pre","code","option"],r.ignoredClasses=r.ignoredClasses||[],r.errorCallback=r.errorCallback||console.error,r.macros=r.macros||{},d(e,r)}}(),a=a.default}()}));

slader-limit-bypass/js/quizlet_bypass.js

@@ -0,0 +1,169 @@
+// TODO: Sidestep race condition in a less patchwork manner
+setTimeout(function(){ renderBypass(); /* TODO: Check if it actually went through */ }, 1250);
+
+
+function renderBypass()
+{
+    // Setup page elements
+    
+    //Get Katex CSS
+    var katex_css = document.createElement('link');
+    katex_css.setAttribute('rel','stylesheet');
+    katex_css.setAttribute('href','https://cdn.jsdelivr.net/npm/katex@0.13.11/dist/katex.min.css ');
+    document.head.appendChild(katex_css);
+
+    // Get the webpage data, devoid of any headers or cookies. Acts as if the user is not logged in at all.
+    doFetch(window.location).then(data => { processData(data); })
+
+}
+function processData(data){
+    // Clear the "hidden explanation" out and replace it with a blank explanation area.
+    // The innermost item is ".s1i7awl8"
+    document.querySelector('main .mwhvwas').innerHTML = '<div class="c18oith1 sladerBypass"><div class="s1oluvjw"><h4 class="h1cwp1lk">Explanation</h4><div class="as7m9cv snqbbas"><div data-testid="ExplanationsSolution" class="e1sw891e"><div class="s1i7awl8"></div></div></div></div></div>';
+    var expArea = document.querySelector('.sladerBypass .s1i7awl8')
+
+    // Render new stuff
+
+    // Is this an abomination? Yes.
+    // Does it work? Also yes.
+    //
+    // ...
+    // 
+    // I don't want to talk about it.
+    //
+    var json = data.match(/(?<=window.Quizlet\["questionDetailsPageData"] = ).+?(?=; QLoad\("Quizlet.questionDetailsPageData")/gm);
+    if (!json)
+    {
+        if (window.location.toString().includes('quizlet.com/explanations/textbook-solutions'))
+        {
+            var oldlink = getOldTextbookLink();
+            expArea.innerHTML = `<div style="color: red;"><h1>Textbooks currently only supported by Slader Bypass on the old website.</h1><br>Click <a href="#" class='sladerBypassOldLink'>here</a> to be redirected to the working version of this question. If that doesn't work, try finding it manually on the old site.</div>`;
+            document.querySelector('.sladerBypassOldLink').href = oldlink;
+        }
+        else
+        {
+            // Display ratelimit message
+            expArea.innerHTML = `<div style="color: red;"><h1>You have been ratelimited by Quizlet</h1><br>Try clearing your cookies for Quizlet and reloading this page, this usually fixes it.<br>— Slader Bypass.</div>`;
+        }
+    }
+
+    // TODO: Handle textbookExercisePageData.
+
+
+    // Parse JSON data
+    var qDetails = JSON.parse(json[0]);
+
+    // Display JSON data as answer
+    qDetails.question.solutions.forEach(solution => {
+        const numSteps = solution.steps.length;
+        solution.steps.forEach(step => {
+            const stepNum = step.stepNumber;
+            // Create card element
+            var div = document.createElement('div');
+            // Insert boilerplate card data
+            div.innerHTML = '<div class="r8gl7vf" data-testid="ExplanationsSolutionStep" style="padding-top: 0.8rem;"><div class="AssemblyCard AssemblyMediumCard"><div class="ExplanationsSolutionCard c5ngj6s"><div class="h1ejaztj"><h4 class="s39tzu2"></h4><span class="sb9ch1t"></span></div><div class="s1wwu7g8"><div class="s1x7f4sz"><div class=""><div class="s1xkd811"><div class="mi4ni5d sladerBypassKatex" style="white-space: pre-wrap;"></div></div></div></div></div></div></div></div>';
+            // Step X: .s39tzu2
+            div.querySelector('.s39tzu2').textContent = (numSteps === stepNum) ? "Result" : "Step " + stepNum;
+            // x of x: .sb9ch1t
+            div.querySelector('.sb9ch1t').textContent = stepNum + ' of ' + numSteps;
+            
+            // I'm not 100% on the structure of these, but I'll take a stab at it.
+            // It seems that only one column is ever used. I'll iterate anyways, because I can't trust that.
+            step.columns.forEach(column => {
+                var columnDiv = document.createElement('div');
+                // Insert inner text
+                if (column.text)
+                {
+                    var textDiv = document.createElement('div');
+                    textDiv.classList.add('sladerBypassKatexTextArea')
+                    textDiv.textContent = column.text.replaceAll('\n\n\n', '\n\n'); // The replace call is a bit funky but it works.
+                    columnDiv.appendChild(textDiv);
+                }
+                // Insert image, if applicable
+                if (column.images.additional)
+                {
+                    var image = document.createElement('img');
+                    image.setAttribute('src', column.images.additional.regular.srcUrl);
+                    columnDiv.appendChild(image);
+                }
+
+                // Append server-rendered image src url. Used in errorhandling. (See: handleKatexError())
+                if (column.images.latex.large)
+                {
+                    div.querySelector('.sladerBypassKatex').setAttribute('katexsrc', column.images.latex.large.srcUrl);
+                }
+
+                div.querySelector('.sladerBypassKatex').appendChild(columnDiv);
+            });
+            
+            // Append card to explanation area.
+            expArea.appendChild(div);
+        });
+    });
+
+    // Render Katex for each card
+    expArea.querySelectorAll('.sladerBypassKatex').forEach(textArea => {
+        try {
+            renderMathInElement(textArea, {
+                delimiters: [
+                    {left: "$$", right: "$$", display: true},
+                    {left: "$", right: "$", display: false},
+                    {left: "\\(", right: "\\)", display: false},
+                    {left: "\\begin{equation}", right: "\\end{equation}", display: true},
+                    {left: "\\begin{align}", right: "\\end{align}", display: true},
+                    {left: "\\begin{alignat}", right: "\\end{alignat}", display: true},
+                    {left: "\\begin{gather}", right: "\\end{gather}", display: true},
+                    {left: "\\begin{CD}", right: "\\end{CD}", display: true},
+                    {left: "\\[", right: "\\]", display: true}
+                  ],
+                throwOnError : true,
+                errorCallback : function(a, b){ handleKatexError(a, b, textArea); }
+            });        
+        } catch (error) {
+            console.error('Katex experienced an error. Attempting to load image replacement.');
+        }
+    });
+};
+
+function handleKatexError(a, b, textArea)
+{
+    // Display Katex error
+    console.error(a);
+    console.error(b);
+
+    // Remove broken Katex
+    textArea.querySelector('.sladerBypassKatexTextArea').innerHTML = '';
+
+    // Fallback to server-rendered katex (I'm assuming they have better error detection there.)
+    var image = document.createElement('img');
+    image.setAttribute('src', textArea.getAttribute('katexsrc'));
+    textArea.appendChild(image);
+}
+
+async function doFetch(url)
+{
+    const response = await fetch(url, {
+        method: 'GET', // *GET, POST, PUT, DELETE, etc.
+        mode: 'cors', // no-cors, *cors, same-origin
+        cache: 'no-cache', // *default, no-cache, reload, force-cache, only-if-cached
+        credentials: 'omit', // include, *same-origin, omit
+        headers: {
+        },
+        redirect: 'follow', // manual, *follow, error
+        referrerPolicy: 'no-referrer', // no-referrer, *no-referrer-when-downgrade, origin, origin-when-cross-origin, same-origin, strict-origin, strict-origin-when-cross-origin, unsafe-url
+        body: null // body data type must match "Content-Type" header
+    });
+    return response.text();
+}
+
+
+function getOldTextbookLink(url)
+{
+    // This is mostly approximate.
+    const bookTitle = window.location.toString().match(/(?<=quizlet\.com\/explanations\/textbook-solutions\/).+?(?=-\d\d\d\d\d\d\d)/)[0];
+    const bookISBN = window.location.toString().split(bookTitle)[1].split('/')[0].replaceAll('-', '');
+    const page = document.getElementsByClassName('tsqwngb')[0].children[1].innerHTML.slice(5);
+    const problem = document.getElementsByClassName('t1aekklg')[0].innerHTML.slice(9);
+
+    return "https://www.slader.com/textbook/" + bookISBN + '-' + bookTitle + '/' + page + '/problems/' + problem;
+}

slader-limit-bypass/manifest.json

@@ -1,7 +1,7 @@
 {
   "name": "slader bypass",
-  "version": "0.1",
-  "author":"Alan Li",
+  "version": "0.3",
+  "author":"Alan Li & Ethan Harvey",
   "description": "slader 5 solutions limit bypass",
   "permissions": [
     "webRequest",
@@ -18,7 +18,11 @@
     {
         "matches": ["*://*.slader.com/textbook/*"],
         "js": ["js/content_script.js"]
-    }
+    },
+    {
+      "matches": ["*://quizlet.com/explanations/questions/*", "*://quizlet.com/explanations/textbook-solutions/*/*"],
+      "js": ["js/katex/katex.js", "js/katex/autorender.js", "js/quizlet_bypass.js"]
+  }
 ],
   "manifest_version": 2
   }