diff --git a/README.md b/README.md index 7b91245..d2c319e 100644 --- a/README.md +++ b/README.md @@ -1,13 +1,20 @@ # Reddit Text Saver +![banner](reddit-saver-banner.png) + Simple Chrome extension that lets you download a text file with the contents of a Reddit article. -Only works with old.reddit.com right now. +Only works with `old.reddit.com` right now. ## Installation -1. Open chrome://extensions/ -2. Make sure Developer Mode is on -3. Click 'Load Unpacked' +1. Open `chrome://extensions/` +2. Make sure **Developer Mode** is on +3. Click **Load Unpacked** 4. Navigate to this directory and open it. +5. Green button will appear on Reddit pages + +## Bugs +- Doesn't work in normal `reddit.com` - the class names get created dynamically - requires more JavaScript trickery to detect each section of text +- Doesn't work when the author has been `[deleted]` diff --git a/content.js b/content.js index d239422..19ebc19 100644 --- a/content.js +++ b/content.js @@ -1,18 +1,73 @@ -var bodyText = document.querySelector('.expando .usertext-body').innerText; -var title = document.querySelector('div.top-matter > p.title > a').innerText; -var score = document.querySelector('div.score.unvoted').innerText; -var tagline = document.querySelector('div.top-matter > p.tagline').innerText; -var topMatter = document.getElementsByClassName('top-matter')[0]; +// TODO +/* + test whether this is the new or old reddit + - use the old reddit extension to check + +*/ + +var hostname = window.location.hostname; + +if (hostname === "old.reddit.com") + + var elements = { + + bodyText: document.querySelector('.expando .usertext-body').innerText, + title: document.querySelector('div.top-matter > p.title > a').innerText, + score: document.querySelector('div.score.unvoted').innerText, + tagline: document.querySelector('div.top-matter > p.tagline').innerText, + topMatter: document.getElementsByClassName('top-matter')[0], + date: document.querySelector('time').innerText, + author: document.querySelector('.top-matter .tagline .author').innerText +} + + else if (hostname === "www.reddit.com") { + var textElement = document.querySelector('[data-click-id="text"] div'); + + // try { + // title: textElement.parentElement.parentElement.querySelector('h1').innerText + + // } catch(e) { + // try { + // title: textElement.parentElement.parentElement.querySelector('h3').innerText + // } + // } + + var elements = { + + bodyText: textElement.innerText, + title: textElement.parentElement.parentElement.querySelector('h1').innerText, + tagline: textElement.parentElement.parentElement.parentElement.querySelector('div div div').innerText, + + // score: document.querySelector('div.score.unvoted').innerText, + // "Posted byu/girl_from_the_crypt 16 hours ago" + score: textElement.parentElement.parentElement.querySelector('div:nth-child(2) > div div').innerText, + topMatter: document.querySelector("#t3_fxf27u > div > div._2FCtq-QzlfuN-SwVMUZMM3._2v9pwVh0VUYrmhoMv1tHPm.t3_fxf27u > div.y8HYJ-y_lTUHkQIc1mdCq._2INHSNB8V5eaWp4P0rY_mE > div"), + author: "--", + date: "--" + // // tagline: document.querySelector('div.top-matter > p.tagline').innerText, + // topMatter: document.getElementsByClassName('top-matter')[0], + // date: document.querySelector('time').innerText, + // author: document.querySelector('.top-matter .tagline .author').innerText + } + } + + +var bodyText = elements.bodyText; +var title = elements.title; +var score = elements.score; +var tagline = elements.tagline; +var topMatter = elements.topMatter; +var date = elements.date; +var author = elements.author; + var mimeType = 'text/html'; var link = document.createElement('a'); link.innerHTML = 'Download article as .txt'; -link.setAttribute('style', 'border: 1px solid #444; padding: 1px 6px; background: #7BB254; color: white; font-size: 10px; font-weight: bold; line-height: 20px; border-radius: 3px;'); +link.setAttribute('style', 'border: 1px solid #444; padding: 1px 6px; background: #7BB254; color: white; font-size: 10px; font-weight: bold; line-height: 20px; border-radius: 3px; display: inline-block'); link.setAttribute('onclick', "$(this).css('background-color','#FC471E').text('Downloaded')"); link.setAttribute('download', title + '.txt'); -var date = document.querySelector('time').innerText; -var author = document.querySelector('.top-matter .tagline .author').innerText; var newTagline = 'submitted ' + date + ' by ' + author var url = document.location.href; @@ -23,3 +78,5 @@ link.setAttribute('href', 'data:' + mimeType + ';charset=utf-8,' + encodeURIComp // work on new reddit topMatter.appendChild(link); + + diff --git a/manifest.json b/manifest.json index 1d2c36e..7565a25 100644 --- a/manifest.json +++ b/manifest.json @@ -1,8 +1,8 @@ { "manifest_version": 2, "name": "Download Text Version of Reddit Article", - "description": "Puts a little green download button under title of articles and lets you download the text version of Reddit articles. (Only works with old.reddit.com)", - "version": "0.1", + "description": "Puts a little download button under title of articles and lets you download the text version of Reddit articles. (Only works with old.reddit.com)", + "version": "0.11", "browser_action": { "default_icon": { "16": "reddit-saver.png", diff --git a/reddit-saver-banner.png b/reddit-saver-banner.png new file mode 100644 index 0000000..7b7efb9 Binary files /dev/null and b/reddit-saver-banner.png differ