So recently I was checking out a few resumes for content and came across a promising one which happened to be uploaded on Scribd. Since I didn’t have an account, Scribd only showed me the preview pages which didn’t help a lot. I thought of googling around a bit and came across this blog post by someone who incidentally happened to be a friend of mine. I quickly went and downloaded the chrome extension,but it didn’t seem to work. So I decided to take matters into my own hands and started playing around with the DOM elements.
Now apart from the blurred content on Scribd, there were a few other things which cluttered the page – pesky ads and popups. So I decide to add a few bells and whistles to the entire thing. Apart from un-blurring the content, I thought of removing these popups and ads as well. Thanks to the awesome naming convention followed by people at Scribd, finding the elements to tweak was a piece of cake.
I realised that Scribd has two types of document(not an exhaustive list) – Scanned Upload and Documents which are uploaded with HTML.
In order to blur the scanned documents, Scribd serves them as an image and reduces the opacity of the of the image, so the easy fix is to change the opacity to 1.
As for the pdfs which are not scanned, the fix lies in changing the value of the text-shadow attribute.
So armed with the knowledge of basic jQuery, I decided to use the console and try removing the unnecessary parts and un blurring the document. Following is the step wise approach I followed :
- Removing the ads which come in between pages.
- All that is required is one line of code.
- And Voila, the message box is gone.
- Next up, removing the pesky popup. God they basically hide the majority of the content. It was quintessential to get rid of them.
- Magically, all it takes is one line of jQuery.
- There you go, no more popups.
- Now addressing the elephant in the room – un blurring the pdf. First up I will show how to un blur a non scanned pdf.
- Just change the value of the text-shadow attribute to ‘black 0px 0px 0px ‘ and voila you are good to go.
- Now for removing the blur from the scanned pdf. Again just one line of code. Change the opacity attribute of class absimg to 1.0 by making use of jQuery’s selector function.
- Time to add some bells and whistles to it. I personally found the “Welcome message” at the top quite distracting, so I thought of removing that as well.
Now tying things up, I initially thought of write an extension for it, but it turns out there already exists one, you can find it here. Presently, there are a few bugs with it. I have sent a pull request fixing the errors, I hope it will be incorporated soon.
Incase you do wish to try out the latest extension code, you can clone the latest repo from here. And manually add the extension to your browser, in case you need help with that – you can consult this.
Note : There is a caveat attached with the extension. Scribd loads the pdf pages dynamically, ie as you scroll down it sends a request to the server and page is served to the client as and when needed, it actually loads 5-6 pages in advance to smoothen out the display while scrolling. So this method works for 5-6 pages and in order to un blur the pages, you are required to click the extension button again.