Ignore dead and political stories

See:
fe09e5aa31

apiserver/database.py

@@ -5,7 +5,7 @@ from sqlalchemy.ext.declarative import declarative_base
 from sqlalchemy.orm import sessionmaker
 from sqlalchemy.exc import IntegrityError
 
-engine = create_engine('sqlite:///data/qotnews.sqlite', connect_args={'timeout': 120})
+engine = create_engine('sqlite:///data/qotnews.sqlite', connect_args={'timeout': 360})
 Session = sessionmaker(bind=engine)
 
 Base = declarative_base()
@@ -101,7 +101,22 @@ def del_ref(ref):
     finally:
         session.close()
 
+def count_stories():
+    try:
+        session = Session()
+        return session.query(Story).count()
+    finally:
+        session.close()
+
+def get_story_list():
+    try:
+        session = Session()
+        return session.query(Story.sid).all()
+    finally:
+        session.close()
+
 if __name__ == '__main__':
     init()
 
-    print(get_story_by_ref('hgi3sy'))
+    #print(get_story_by_ref('hgi3sy'))
+    print(len(get_reflist(99999)))

apiserver/feed.py

@@ -9,6 +9,7 @@ from bs4 import BeautifulSoup
 
 import settings
 from feeds import hackernews, reddit, tildes, manual, lobsters
+import utils
 
 INVALID_DOMAINS = ['youtube.com', 'bloomberg.com', 'wsj.com', 'sec.gov']
 TWO_DAYS = 60*60*24*2
@@ -68,16 +69,21 @@ def get_content_type(url):
 def update_story(story, is_manual=False):
     res = {}
 
-    if story['source'] == 'hackernews':
+    try:
-        res = hackernews.story(story['ref'])
+        if story['source'] == 'hackernews':
-    elif story['source'] == 'lobsters':
+            res = hackernews.story(story['ref'])
-        res = lobsters.story(story['ref'])
+        elif story['source'] == 'lobsters':
-    elif story['source'] == 'reddit':
+            res = lobsters.story(story['ref'])
-        res = reddit.story(story['ref'])
+        elif story['source'] == 'reddit':
-    elif story['source'] == 'tildes':
+            res = reddit.story(story['ref'])
-        res = tildes.story(story['ref'])
+        elif story['source'] == 'tildes':
-    elif story['source'] == 'manual':
+            res = tildes.story(story['ref'])
-        res = manual.story(story['ref'])
+        elif story['source'] == 'manual':
+            res = manual.story(story['ref'])
+    except BaseException as e:
+        utils.alert_tanner('Problem updating {} story, ref {}: {}'.format(story['source'], story['ref'], str(e)))
+        logging.exception(e)
+        return False
 
     if res:
         story.update(res) # join dicts
@@ -100,6 +106,12 @@ def update_story(story, is_manual=False):
             logging.info(story['url'])
             return False
 
+        if 'trump' in story['title'].lower() or 'musk' in story['title'].lower():
+            logging.info('Trump / Musk story, skipping')
+            logging.info(story['url'])
+            return False
+
+
         logging.info('Getting article ' + story['url'])
         story['text'] = get_article(story['url'])
         if not story['text']: return False

apiserver/feeds/hackernews.py

@@ -12,7 +12,8 @@ import requests
 from utils import clean
 
 API_TOPSTORIES = lambda x: 'https://hacker-news.firebaseio.com/v0/topstories.json'
-API_ITEM = lambda x : 'https://hn.algolia.com/api/v1/items/{}'.format(x)
+ALG_API_ITEM = lambda x : 'https://hn.algolia.com/api/v1/items/{}'.format(x)
+BHN_API_ITEM = lambda x : 'https://api.hnpwa.com/v0/item/{}.json'.format(x)
 
 SITE_LINK = lambda x : 'https://news.ycombinator.com/item?id={}'.format(x)
 SITE_AUTHOR_LINK = lambda x : 'https://news.ycombinator.com/user?id={}'.format(x)
@@ -42,7 +43,7 @@ def api(route, ref=None):
 def feed():
     return [str(x) for x in api(API_TOPSTORIES) or []]
 
-def comment(i):
+def alg_comment(i):
     if 'author' not in i:
         return False
 
@@ -51,19 +52,19 @@ def comment(i):
     c['score'] = i.get('points', 0)
     c['date'] = i.get('created_at_i', 0)
     c['text'] = clean(i.get('text', '') or '')
-    c['comments'] = [comment(j) for j in i['children']]
+    c['comments'] = [alg_comment(j) for j in i['children']]
     c['comments'] = list(filter(bool, c['comments']))
     return c
 
-def comment_count(i):
+def alg_comment_count(i):
     alive = 1 if i['author'] else 0
-    return sum([comment_count(c) for c in i['comments']]) + alive
+    return sum([alg_comment_count(c) for c in i['comments']]) + alive
 
-def story(ref):
+def alg_story(ref):
-    r = api(API_ITEM, ref)
+    r = api(ALG_API_ITEM, ref)
     if not r:
-        logging.info('Bad Hackernews API response.')
+        logging.info('Bad Algolia Hackernews API response.')
-        return False
+        return None
 
     if 'deleted' in r:
         logging.info('Story was deleted.')
@@ -80,17 +81,85 @@ def story(ref):
     s['title'] = r.get('title', '')
     s['link'] = SITE_LINK(ref)
     s['url'] = r.get('url', '')
-    s['comments'] = [comment(i) for i in r['children']]
+    s['comments'] = [alg_comment(i) for i in r['children']]
     s['comments'] = list(filter(bool, s['comments']))
-    s['num_comments'] = comment_count(s) - 1
+    s['num_comments'] = alg_comment_count(s) - 1
 
     if 'text' in r and r['text']:
         s['text'] = clean(r['text'] or '')
 
     return s
 
+def bhn_comment(i):
+    if 'user' not in i:
+        return False
+
+    c = {}
+    c['author'] = i.get('user', '')
+    c['score'] = 0   # Not present?
+    c['date'] = i.get('time', 0)
+    c['text'] = clean(i.get('content', '') or '')
+    c['comments'] = [bhn_comment(j) for j in i['comments']]
+    c['comments'] = list(filter(bool, c['comments']))
+    return c
+
+def bhn_story(ref):
+    r = api(BHN_API_ITEM, ref)
+    if not r:
+        logging.info('Bad BetterHN Hackernews API response.')
+        return None
+
+    if 'deleted' in r:   # TODO: verify
+        logging.info('Story was deleted.')
+        return False
+    elif r.get('dead', False):
+        logging.info('Story was deleted.')
+        return False
+    elif r.get('type', '') != 'link':
+        logging.info('Type "{}" is not "link".'.format(r.get('type', '')))
+        return False
+
+    s = {}
+    s['author'] = r.get('user', '')
+    s['author_link'] = SITE_AUTHOR_LINK(r.get('user', ''))
+    s['score'] = r.get('points', 0)
+    s['date'] = r.get('time', 0)
+    s['title'] = r.get('title', '')
+    s['link'] = SITE_LINK(ref)
+    s['url'] = r.get('url', '')
+    if s['url'].startswith('item'):
+        s['url'] = SITE_LINK(ref)
+    s['comments'] = [bhn_comment(i) for i in r['comments']]
+    s['comments'] = list(filter(bool, s['comments']))
+    s['num_comments'] = r.get('comments_count', 0)
+
+    if 'content' in r and r['content']:
+        s['text'] = clean(r['content'] or '')
+
+    return s
+
+def story(ref):
+    s = alg_story(ref)
+    if s is None:
+        s = bhn_story(ref)
+    if not s:
+        return False
+
+
+    if s['score'] < 25 and s['num_comments'] < 10:
+        logging.info('Score ({}) or num comments ({}) below threshold.'.format(s['score'], s['num_comments']))
+        return False
+
+    return s
+
 # scratchpad so I can quickly develop the parser
 if __name__ == '__main__':
     print(feed())
     #print(story(20763961))
     #print(story(20802050))
+
+    #print(story(42899834))   # type "job"
+    #print(story(42900076))   # Ask HN
+    #print(story(42898201))   # Show HN
+    #print(story(42899703))   # normal
+    print(story(42902678))   # bad title?

apiserver/feeds/lobsters.py

@@ -50,7 +50,7 @@ def unix(date_str):
 def make_comment(i):
     c = {}
     try:
-        c['author'] = i['commenting_user']['username']
+        c['author'] = i['commenting_user']
     except KeyError:
         c['author'] = ''
     c['score'] = i.get('score', 0)
@@ -67,13 +67,13 @@ def iter_comments(flat_comments):
     parent_stack = []
     for comment in flat_comments:
         c = make_comment(comment)
-        indent = comment['indent_level']
+        indent = comment['depth']
 
-        if indent == 1:
+        if indent == 0:
             nested_comments.append(c)
             parent_stack = [c]
         else:
-            parent_stack = parent_stack[:indent-1]
+            parent_stack = parent_stack[:indent]
             p = parent_stack[-1]
             p['comments'].append(c)
             parent_stack.append(c)
@@ -87,7 +87,7 @@ def story(ref):
 
     s = {}
     try:
-        s['author'] = r['submitter_user']['username']
+        s['author'] = r['submitter_user']
         s['author_link'] = SITE_AUTHOR_LINK(s['author'])
     except KeyError:
         s['author'] = ''
@@ -103,6 +103,10 @@ def story(ref):
     s['comments'] = iter_comments(r['comments'])
     s['num_comments'] = r['comment_count']
 
+    if s['score'] < 15 and s['num_comments'] < 10:
+        logging.info('Score ({}) or num comments ({}) below threshold.'.format(s['score'], s['num_comments']))
+        return False
+
     if 'description' in r and r['description']:
         s['text'] = clean(r['description'] or '')
 
@@ -112,5 +116,5 @@ def story(ref):
 if __name__ == '__main__':
     #print(feed())
     import json
-    print(json.dumps(story('fzvd1v')))
+    print(json.dumps(story('fzvd1v'), indent=4))
-    #print(story(20802050))
+    #print(json.dumps(story('ixyv5u'), indent=4))

apiserver/feeds/reddit.py

@@ -32,10 +32,7 @@ def feed():
         return [x.id for x in reddit.subreddit(subs).hot()]
     except KeyboardInterrupt:
         raise
-    except PRAWException as e:
+    except BaseException as e:
-        logging.critical('Problem hitting reddit API: {}'.format(str(e)))
-        return []
-    except PrawcoreException as e:
         logging.critical('Problem hitting reddit API: {}'.format(str(e)))
         return []
 

apiserver/feeds/tildes.py

@@ -107,7 +107,20 @@ def story(ref):
     ch = a.find('header', class_='topic-comments-header')
     s['num_comments'] = int(ch.h2.string.split(' ')[0]) if ch else 0
 
-    if s['score'] < 8 and s['num_comments'] < 6:
+    if s['group'].split('.')[0] not in [
+        '~arts',
+        '~comp',
+        '~creative',
+        '~design',
+        '~engineering',
+        '~finance',
+        '~science',
+        '~tech',
+    ]:
+        logging.info('Group ({}) not in whitelist.'.format(s['group']))
+        return False
+
+    if s['score'] < 15 and s['num_comments'] < 10:
         logging.info('Score ({}) or num comments ({}) below threshold.'.format(s['score'], s['num_comments']))
         return False
 

apiserver/scripts/delete-story.py

@@ -1,6 +1,8 @@
 import database
 import search
 import sys
+import settings
+import logging
 
 import json
 import requests
@@ -21,7 +23,7 @@ def database_del_story(sid):
 
 def search_del_story(sid):
     try:
-        r = requests.delete(search.MEILI_URL + 'indexes/qotnews/documents/'+sid, timeout=2)
+        r = requests.delete(settings.MEILI_URL + 'indexes/qotnews/documents/'+sid, timeout=2)
         if r.status_code != 202:
             raise Exception('Bad response code ' + str(r.status_code))
         return r.json()

apiserver/scripts/fix-stories.py

@@ -0,0 +1,58 @@
+import time
+import json
+import logging
+
+import feed
+import database
+import search
+
+database.init()
+
+def fix_gzip_bug(story_list):
+    FIX_THRESHOLD = 150
+
+    count = 1
+    for sid in story_list:
+        try:
+            sid = sid[0]
+            story = database.get_story(sid)
+            full_json = json.loads(story.full_json)
+            meta_json = json.loads(story.meta_json)
+            text = full_json.get('text', '')
+
+            count = text.count('<EFBFBD>')
+            if not count: continue
+
+            ratio = count / len(text) * 1000
+            print('Bad story:', sid, 'Num ?:', count, 'Ratio:', ratio)
+            if ratio < FIX_THRESHOLD: continue
+
+            print('Attempting to fix...')
+
+            valid = feed.update_story(meta_json, is_manual=True)
+            if valid:
+                database.put_story(meta_json)
+                search.put_story(meta_json)
+                print('Success')
+            else:
+                print('Story was not valid')
+
+            time.sleep(3)
+
+        except KeyboardInterrupt:
+            raise
+        except BaseException as e:
+            logging.exception(e)
+            breakpoint()
+
+if __name__ == '__main__':
+    num_stories = database.count_stories()
+
+    print('Fix {} stories?'.format(num_stories))
+    print('Press ENTER to continue, ctrl-c to cancel')
+    input()
+
+    story_list = database.get_story_list()
+
+    fix_gzip_bug(story_list)
+

apiserver/scripts/reindex.py

@@ -21,30 +21,16 @@ def put_stories(stories):
     return search.meili_api(requests.post, 'indexes/qotnews/documents', stories)
 
 def get_update(update_id):
-    return search.meili_api(requests.get, 'indexes/qotnews/updates/{}'.format(update_id))
+    return search.meili_api(requests.get, 'tasks/{}'.format(update_id))
-
-def count_stories():
-    try:
-        session = database.Session()
-        return session.query(database.Story).count()
-    finally:
-        session.close()
-
-def get_story_list():
-    try:
-        session = database.Session()
-        return session.query(database.Story.sid).all()
-    finally:
-        session.close()
 
 if __name__ == '__main__':
-    num_stories = count_stories()
+    num_stories = database.count_stories()
 
     print('Reindex {} stories?'.format(num_stories))
     print('Press ENTER to continue, ctrl-c to cancel')
     input()
 
-    story_list = get_story_list()
+    story_list = database.get_story_list()
 
     count = 1
     while len(story_list):
@@ -59,15 +45,14 @@ if __name__ == '__main__':
             story = database.get_story(sid)
             print('Indexing {}/{} id: {} title: {}'.format(count, num_stories, sid[0], story.title))
             story_obj = json.loads(story.meta_json)
-            to_add = dict(title=story_obj['title'], id=story_obj['id'], date=story_obj['date'])
+            stories.append(story_obj)
-            stories.append(to_add)
             count += 1
 
         res = put_stories(stories)
-        update_id = res['updateId']
+        update_id = res['uid']
 
         print('Waiting for processing', end='')
-        while get_update(update_id)['status'] != 'processed':
+        while get_update(update_id)['status'] != 'succeeded':
             time.sleep(0.5)
             print('.', end='', flush=True)
 

apiserver/scripts/tests.py

@@ -0,0 +1,23 @@
+import time
+import requests
+
+def test_search_api():
+    num_tests = 100
+    total_time = 0
+
+    for i in range(num_tests):
+        start = time.time()
+
+        res = requests.get('http://127.0.0.1:33842/api/search?q=iphone')
+        res.raise_for_status()
+
+        duration = time.time() - start
+        total_time += duration
+
+    avg_time = total_time / num_tests
+
+    print('Average search time:', avg_time)
+
+
+if __name__ == '__main__':
+    test_search_api()

apiserver/search.py

@@ -8,12 +8,16 @@ import settings
 
 SEARCH_ENABLED = bool(settings.MEILI_URL)
 
-def meili_api(method, route, json=None, params=None):
+def meili_api(method, route, json=None, params=None, parse_json=True):
     try:
         r = method(settings.MEILI_URL + route, json=json, params=params, timeout=4)
         if r.status_code > 299:
             raise Exception('Bad response code ' + str(r.status_code))
-        return r.json()
+        if parse_json:
+            return r.json()
+        else:
+            r.encoding = 'utf-8'
+            return r.text
     except KeyboardInterrupt:
         raise
     except BaseException as e:
@@ -29,9 +33,9 @@ def update_rankings():
     return meili_api(requests.post, 'indexes/qotnews/settings/ranking-rules', json=json)
 
 def update_attributes():
-    json = ['title']
+    json = ['title', 'url', 'author']
     r = meili_api(requests.post, 'indexes/qotnews/settings/searchable-attributes', json=json)
-    json = ['id']
+    json = ['id', 'ref', 'source', 'author', 'author_link', 'score', 'date', 'title', 'link', 'url', 'num_comments']
     r = meili_api(requests.post, 'indexes/qotnews/settings/displayed-attributes', json=json)
     return r
 
@@ -45,18 +49,17 @@ def init():
 
 def put_story(story):
     if not SEARCH_ENABLED: return
-    to_add = dict(title=story['title'], id=story['id'], date=story['date'])
+    return meili_api(requests.post, 'indexes/qotnews/documents', [story])
-    return meili_api(requests.post, 'indexes/qotnews/documents', [to_add])
 
 def search(q):
     if not SEARCH_ENABLED: return []
-    params = dict(q=q, limit=250)
+    params = dict(q=q, limit=settings.FEED_LENGTH)
-    r = meili_api(requests.get, 'indexes/qotnews/search', params=params)
+    r = meili_api(requests.get, 'indexes/qotnews/search', params=params, parse_json=False)
-    return r['hits']
+    return r
     
 if __name__ == '__main__':
     init()
 
     print(update_rankings())
 
-    print(search('qot'))
+    print(search('facebook'))

apiserver/server.py

@@ -15,6 +15,7 @@ import traceback
 import time
 from urllib.parse import urlparse, parse_qs
 
+import settings
 import database
 import search
 import feed
@@ -27,7 +28,6 @@ from flask_cors import CORS
 database.init()
 search.init()
 
-FEED_LENGTH = 75
 news_index = 0
 
 def new_id():
@@ -43,7 +43,7 @@ cors = CORS(flask_app)
 @flask_app.route('/api')
 def api():
     skip = request.args.get('skip', 0)
-    limit = request.args.get('limit', FEED_LENGTH)
+    limit = request.args.get('limit', settings.FEED_LENGTH)
     stories = database.get_stories(limit, skip)
     # hacky nested json
     res = Response('{"stories":[' + ','.join(stories) + ']}')
@@ -56,10 +56,8 @@ def apisearch():
     if len(q) >= 3:
         results = search.search(q)
     else:
-        results = []
+        results = '[]'
-    story_metas = [database.get_story(x['id']).meta_json for x in results]
+    res = Response(results)
-    # hacky nested json
-    res = Response('{"results":[' + ','.join(story_metas) + ']}')
     res.headers['content-type'] = 'application/json'
     return res
 
@@ -124,9 +122,11 @@ def story(sid):
 @flask_app.route('/search')
 def index():
     return render_template('index.html',
-            title='Feed',
+        title='QotNews',
-            url='news.t0.vc',
+        url='news.t0.vc',
-            description='Hacker News, Reddit, Lobsters, and Tildes articles rendered in reader mode')
+        description='Hacker News, Reddit, Lobsters, and Tildes articles rendered in reader mode',
+        robots='index',
+    )
 
 @flask_app.route('/<sid>', strict_slashes=False)
 @flask_app.route('/<sid>/c', strict_slashes=False)
@@ -151,9 +151,11 @@ def static_story(sid):
     url = url.replace('www.', '')
 
     return render_template('index.html',
-            title=story['title'],
+        title=story['title'] + ' | QotNews',
-            url=url,
+        url=url,
-            description=description)
+        description=description,
+        robots='noindex',
+    )
 
 http_server = WSGIServer(('', 33842), flask_app)
 
@@ -175,7 +177,7 @@ def feed_thread():
                         logging.info('Already have ID / ref, skipping.')
                         continue
 
-            ref_list = database.get_reflist(FEED_LENGTH)
+            ref_list = database.get_reflist(settings.FEED_LENGTH)
 
             # update current stories
             if news_index < len(ref_list):
@@ -202,7 +204,7 @@ def feed_thread():
             gevent.sleep(6)
 
             news_index += 1
-            if news_index == FEED_LENGTH: news_index = 0
+            if news_index == settings.FEED_LENGTH: news_index = 0
 
     except KeyboardInterrupt:
         logging.info('Ending feed thread...')

apiserver/settings.py.example

@@ -4,6 +4,7 @@
 # Feed Lengths
 # Number of top items from each site to pull
 # set to 0 to disable that site
+FEED_LENGTH = 75
 NUM_HACKERNEWS = 15
 NUM_LOBSTERS = 10
 NUM_REDDIT = 15

apiserver/utils.py

@@ -8,6 +8,14 @@ import string
 
 from bleach.sanitizer import Cleaner
 
+def alert_tanner(message):
+    try:
+        logging.info('Alerting Tanner: ' + message)
+        params = dict(qotnews=message)
+        requests.get('https://tbot.tannercollin.com/message', params=params, timeout=4)
+    except BaseException as e:
+        logging.error('Problem alerting Tanner: ' + str(e))
+
 def gen_rand_id():
     return ''.join(random.choice(string.ascii_uppercase) for _ in range(4))
 

readerserver/main.js

@@ -35,6 +35,7 @@ app.post('/', (req, res) => {
 	const url = req.body.url;
 	const requestOptions = {
 		url: url,
+		gzip: true,
 		//headers: {'User-Agent': 'Googlebot/2.1 (+http://www.google.com/bot.html)'},
 		//headers: {'User-Agent': 'Twitterbot/1.0'},
 		headers: {

searchserver/README.md

@@ -3,7 +3,7 @@
 Download MeiliSearch with:
 
 ```
-wget https://github.com/meilisearch/MeiliSearch/releases/download/v0.21.1/meilisearch-linux-amd64
+wget https://github.com/meilisearch/meilisearch/releases/download/v0.27.0/meilisearch-linux-amd64
 chmod +x meilisearch-linux-amd64
 ```
 

webclient/public/index.html

@@ -8,6 +8,8 @@
 			content="{{ description }}"
 		/>
 		<meta content="{{ url }}" name="og:site_name">
+		<meta name="robots" content="{{ robots }}">
+
 
 		<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
 		<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
@@ -26,7 +28,7 @@
 			work correctly both with client-side routing and a non-root public URL.
 			Learn how to configure a non-root public URL by running `npm run build`.
 		-->
-		<title>{{ title }} - QotNews</title>
+		<title>{{ title }}</title>
 
 		<style>
 			html {
@@ -37,13 +39,23 @@
 			}
 			.nojs {
 				color: white;
+				max-width: 32rem;
 			}
 		</style>
 	</head>
 
 	<body>
 		<div class="nojs">
-			<noscript>You need to enable JavaScript to run this app.</noscript>
+			<noscript>
+				You need to enable JavaScript to run this app because it's written in React.
+				I was planning on writing a server-side version, but I've become distracted
+				by other projects -- sorry!
+				<br/>
+				I originally wrote this for myself, and of course I whitelist JavaScript on
+				all my own domains.
+				<br/><br/>
+				Alternatively, try activex.news.t0.vc for an ActiveX™ version.
+			</noscript>
 		</div>
 		<div id="root"></div>
 		<!--

webclient/src/App.js

@@ -3,8 +3,10 @@ import { BrowserRouter as Router, Route, Link, Switch } from 'react-router-dom';
 import localForage from 'localforage';
 import './Style-light.css';
 import './Style-dark.css';
+import './Style-black.css';
+import './Style-red.css';
 import './fonts/Fonts.css';
-import { ForwardDot } from './utils.js';
+import { BackwardDot, ForwardDot } from './utils.js';
 import Feed from './Feed.js';
 import Article from './Article.js';
 import Comments from './Comments.js';
@@ -38,6 +40,16 @@ class App extends React.Component {
 		localStorage.setItem('theme', 'dark');
 	}
 
+	black() {
+		this.setState({ theme: 'black' });
+		localStorage.setItem('theme', 'black');
+	}
+
+	red() {
+		this.setState({ theme: 'red' });
+		localStorage.setItem('theme', 'red');
+	}
+
 	componentDidMount() {
 		if (!this.cache.length) {
 			localForage.iterate((value, key) => {
@@ -47,22 +59,61 @@ class App extends React.Component {
 		}
 	}
 
+	goFullScreen() {
+		if ('wakeLock' in navigator) {
+			navigator.wakeLock.request('screen');
+		}
+
+		document.body.requestFullscreen({ navigationUI: 'hide' }).then(() => {
+			window.addEventListener('resize', () => this.forceUpdate());
+			this.forceUpdate();
+		});
+	};
+
+	exitFullScreen() {
+		document.exitFullscreen().then(() => {
+			this.forceUpdate();
+		});
+	};
+
 	render() {
 		const theme = this.state.theme;
-		document.body.style.backgroundColor = theme === 'dark' ? '#000' : '#eeeeee';
+
+		if (theme === 'dark') {
+			document.body.style.backgroundColor = '#1a1a1a';
+		} else if (theme === 'black') {
+			document.body.style.backgroundColor = '#000';
+		} else if (theme === 'red') {
+			document.body.style.backgroundColor = '#000';
+		} else {
+			document.body.style.backgroundColor = '#eeeeee';
+		}
+
+		const fullScreenAvailable = document.fullscreenEnabled ||
+			document.mozFullscreenEnabled ||
+			document.webkitFullscreenEnabled ||
+			document.msFullscreenEnabled;
 
 		return (
 			<div className={theme}>
 				<Router>
 					<div className='container menu'>
 						<p>
-							<Link to='/'>QotNews - Feed</Link>
+							<Link to='/'>QotNews</Link>
-							<span className='theme'>Theme: <a href='#' onClick={() => this.light()}>Light</a> - <a href='#' onClick={() => this.dark()}>Dark</a></span>
+
+							<span className='theme'><a href='#' onClick={() => this.light()}>Light</a> - <a href='#' onClick={() => this.dark()}>Dark</a> - <a href='#' onClick={() => this.black()}>Black</a> - <a href='#' onClick={() => this.red()}>Red</a></span>
 							<br />
 							<span className='slogan'>Hacker News, Reddit, Lobsters, and Tildes articles rendered in reader mode.</span>
 						</p>
 						<Route path='/(|search)' component={Search} />
 						<Route path='/(|search)' component={Submit} />
+						{fullScreenAvailable &&
+							<Route path='/(|search)' render={() => !document.fullscreenElement ?
+								<button className='fullscreen' onClick={() => this.goFullScreen()}>Enter Fullscreen</button>
+							:
+								<button className='fullscreen' onClick={() => this.exitFullScreen()}>Exit Fullscreen</button>
+							} />
+						}
 					</div>
 
 					<Route path='/' exact render={(props) => <Feed {...props} updateCache={this.updateCache} />} />
@@ -72,6 +123,7 @@ class App extends React.Component {
 					</Switch>
 					<Route path='/:id/c' exact render={(props) => <Comments {...props} cache={this.cache} />} />
 
+					<BackwardDot />
 					<ForwardDot />
 
 					<ScrollToTop />

webclient/src/Article.js

@@ -67,7 +67,8 @@ class Article extends React.Component {
 				{story ?
 					<div className='article'>
 						<Helmet>
-							<title>{story.title} - QotNews</title>
+							<title>{story.title} | QotNews</title>
+							<meta name="robots" content="noindex" />
 						</Helmet>
 
 						<h1>{story.title}</h1>

webclient/src/Comments.js

@@ -115,7 +115,8 @@ class Article extends React.Component {
 				{story ?
 					<div className='article'>
 						<Helmet>
-							<title>{story.title} - QotNews Comments</title>
+							<title>{story.title} | QotNews</title>
+							<meta name="robots" content="noindex" />
 						</Helmet>
 
 						<h1>{story.title}</h1>

webclient/src/Feed.js

@@ -52,7 +52,8 @@ class Feed extends React.Component {
 		return (
 			<div className='container'>
 				<Helmet>
-					<title>Feed - QotNews</title>
+					<title>QotNews</title>
+					<meta name="robots" content="index" />
 				</Helmet>
 				{error && <p>Connection error?</p>}
 				{stories ?

webclient/src/Results.js

@@ -29,7 +29,7 @@ class Results extends React.Component {
 			.then(res => res.json())
 			.then(
 				(result) => {
-					this.setState({ stories: result.results });
+					this.setState({ stories: result.hits });
 				},
 				(error) => {
 					if (error.message !== 'The operation was aborted. ') {
@@ -56,7 +56,7 @@ class Results extends React.Component {
 		return (
 			<div className='container'>
 				<Helmet>
-					<title>Feed - QotNews</title>
+					<title>Search Results | QotNews</title>
 				</Helmet>
 				{error && <p>Connection error?</p>}
 				{stories ?

webclient/src/ScrollToTop.js

@@ -15,6 +15,7 @@ class ScrollToTop extends React.Component {
 		}
 
 		window.scrollTo(0, 0);
+		document.body.scrollTop = 0;
 	}
 
 	render() {

webclient/src/Search.js

@@ -37,7 +37,7 @@ class Search extends Component {
 			<span className='search'>
 				<form onSubmit={this.searchAgain}>
 					<input
-						placeholder='Search... (fixed)'
+						placeholder='Search...'
 						value={search}
 						onChange={this.searchArticles}
 						ref={this.inputRef}

webclient/src/Style-black.css

@@ -0,0 +1,68 @@
+.black {
+	color: #ddd;
+}
+
+.black a {
+	color: #ddd;
+}
+
+.black input {
+	color: #ddd;
+	border: 1px solid #828282;
+}
+
+.black button {
+	background-color: #444444;
+	border-color: #bbb;
+	color: #ddd;
+}
+
+.black .item {
+	color: #828282;
+}
+
+.black .item .source-logo {
+	filter: grayscale(1);
+}
+
+.black .item a {
+	color: #828282;
+}
+
+.black .item a.link {
+	color: #ddd;
+}
+.black .item a.link:visited {
+	color: #828282;
+}
+
+.black .item .info a.hot {
+	color: #cccccc;
+}
+
+.black .article a {
+	border-bottom: 1px solid #aaaaaa;
+}
+
+.black .article u {
+	border-bottom: 1px solid #aaaaaa;
+	text-decoration: none;
+}
+
+.black .story-text video,
+.black .story-text img {
+	filter: brightness(50%);
+}
+
+.black .article .info {
+	color: #828282;
+}
+
+.black .article .info a {
+	border-bottom: none;
+	color: #828282;
+}
+
+.black .comment.lined {
+	border-left: 1px solid #444444;
+}

webclient/src/Style-dark.css

@@ -11,12 +11,14 @@
 	border: 1px solid #828282;
 }
 
-.dark .item {
+.dark button {
-	color: #828282;
+	background-color: #444444;
+	border-color: #bbb;
+	color: #ddd;
 }
 
-.dark .item .source-logo {
+.dark .item {
-	filter: grayscale(1);
+	color: #828282;
 }
 
 .dark .item a {
@@ -43,6 +45,7 @@
 	text-decoration: none;
 }
 
+.dark .story-text video,
 .dark .story-text img {
 	filter: brightness(50%);
 }

webclient/src/Style-light.css

@@ -2,9 +2,30 @@ body {
 	text-rendering: optimizeLegibility;
 	font: 1rem/1.3 sans-serif;
 	color: #000000;
-	margin-bottom: 100vh;
 	word-break: break-word;
 	font-kerning: normal;
+	margin: 0;
+}
+
+::backdrop {
+	background-color: rgba(0,0,0,0);
+}
+
+body:fullscreen {
+	overflow-y: scroll !important;
+}
+body:-ms-fullscreen {
+	overflow-y: scroll !important;
+}
+body:-webkit-full-screen {
+	overflow-y: scroll !important;
+}
+body:-moz-full-screen {
+	overflow-y: scroll !important;
+}
+
+#root {
+	margin: 8px 8px 100vh 8px !important;
 }
 
 a {
@@ -22,6 +43,12 @@ input {
 	border-radius: 4px;
 }
 
+.fullscreen {
+	margin: 0.25rem;
+	padding: 0.25rem;
+}
+
+
 pre {
 	overflow: auto;
 }
@@ -185,16 +212,20 @@ span.source {
 	cursor: pointer;
 }
 
-.toggleDot {
+.dot {
+	cursor: pointer;
 	position: fixed;
-	bottom: 1rem;
-	left: 1rem;
 	height: 3rem;
 	width: 3rem;
 	background-color: #828282;
 	border-radius: 50%;
 }
 
+.toggleDot {
+	bottom: 1rem;
+	left: 1rem;
+}
+
 .toggleDot .button {
 	font: 2rem/1 'icomoon';
 	position: relative;
@@ -203,21 +234,27 @@ span.source {
 }
 
 .forwardDot {
-	cursor: pointer;
-	position: fixed;
 	bottom: 1rem;
 	right: 1rem;
-	height: 3rem;
-	width: 3rem;
-	background-color: #828282;
-	border-radius: 50%;
 }
 
 .forwardDot .button {
-	font: 2.5rem/1 'icomoon';
+	font: 2rem/1 'icomoon';
 	position: relative;
-	top: 0.25rem;
+	top: 0.5rem;
-	left: 0.3rem;
+	left: 0.5rem;
+}
+
+.backwardDot {
+	bottom: 1rem;
+	right: 5rem;
+}
+
+.backwardDot .button {
+	font: 2rem/1 'icomoon';
+	position: relative;
+	top: 0.5rem;
+	left: 0.5rem;
 }
 
 .search form {

webclient/src/Style-red.css

@@ -0,0 +1,82 @@
+.red {
+	color: #b00;
+	scrollbar-color: #b00 #440000;
+}
+
+.red a {
+	color: #b00;
+}
+
+.red input {
+	color: #b00;
+	border: 1px solid #690000;
+}
+
+.red input::placeholder {
+	color: #690000;
+}
+
+.red hr {
+	background-color: #690000;
+}
+
+.red button {
+	background-color: #440000;
+	border-color: #b00;
+	color: #b00;
+}
+
+.red .item,
+.red .slogan {
+	color: #690000;
+}
+
+.red .item .source-logo {
+	display: none;
+}
+
+.red .item a {
+	color: #690000;
+}
+
+.red .item a.link {
+	color: #b00;
+}
+.red .item a.link:visited {
+	color: #690000;
+}
+
+.red .item .info a.hot {
+	color: #cc0000;
+}
+
+.red .article a {
+	border-bottom: 1px solid #aa0000;
+}
+
+.red .article u {
+	border-bottom: 1px solid #aa0000;
+	text-decoration: none;
+}
+
+.red .story-text video,
+.red .story-text img {
+	filter: grayscale(100%) brightness(20%) sepia(100%) hue-rotate(-50deg) saturate(600%) contrast(0.8);
+}
+
+.red .article .info {
+	color: #690000;
+}
+
+.red .article .info a {
+	border-bottom: none;
+	color: #690000;
+}
+
+.red .comment.lined {
+	border-left: 1px solid #440000;
+}
+
+.red .dot {
+	background-color: #440000;
+}

webclient/src/Submit.js

@@ -41,7 +41,7 @@ class Submit extends Component {
 			<span className='search'>
 				<form onSubmit={this.submitArticle}>
 					<input
-						placeholder='Submit Article'
+						placeholder='Submit URL'
 						ref={this.inputRef}
 					/>
 				</form>

webclient/src/utils.js

@@ -25,8 +25,9 @@ export class ToggleDot extends React.Component {
 	render() {
 		const id = this.props.id;
 		const article = this.props.article;
+
 		return (
-			<div className='toggleDot'>
+			<div className='dot toggleDot'>
 				<div className='button'>
 					<Link to={'/' + id + (article ? '' : '/c')}>
 						{article ? '' : ''}
@@ -37,6 +38,27 @@ export class ToggleDot extends React.Component {
 	}
 }
 
+export class BackwardDot extends React.Component {
+	goBackward() {
+		localStorage.setItem('scrollLock', 'True');
+		window.history.back();
+	}
+
+	render() {
+		const isMobile = /iPhone|iPad|iPod|Android/i.test(navigator.userAgent);
+		if (!isMobile) return null;
+		if (!document.fullscreenElement) return null;
+
+		return (
+			<div className='dot backwardDot' onClick={this.goBackward}>
+				<div className='button'>
+					
+				</div>
+			</div>
+		);
+	}
+}
+
 export class ForwardDot extends React.Component {
 	goForward() {
 		localStorage.setItem('scrollLock', 'True');
@@ -48,9 +70,9 @@ export class ForwardDot extends React.Component {
 		if (!isMobile) return null;
 
 		return (
-			<div className='forwardDot' onClick={this.goForward}>
+			<div className='dot forwardDot' onClick={this.goForward}>
 				<div className='button'>
-					
+					
 				</div>
 			</div>
 		);