From d940ecb9701c6104124d4f2f9007ae430d00cf76 Mon Sep 17 00:00:00 2001
From: Tanner Collin <git@tannercollin.com>
Date: Tue, 27 Dec 2016 08:05:56 +0000
Subject: [PATCH] Add links back to home with the same ID and a QR code

---
 package.json        |  1 +
 src/ui/Home.js      |  2 +-
 src/ui/NotifPage.js | 13 +++++++++++++
 src/ui/Site.js      | 16 +++++++++++-----
 4 files changed, 26 insertions(+), 6 deletions(-)

diff --git a/package.json b/package.json
index 7acec2b..432109f 100644
--- a/package.json
+++ b/package.json
@@ -22,6 +22,7 @@
   "dependencies": {
     "body-parser": "^1.15.2",
     "freezer-js": "^0.6.0",
+    "qrcode.react": "^0.6.1",
     "react": "^0.13.0",
     "react-router": "^0.13.3",
     "shortid": "^2.2.6",
diff --git a/src/ui/Home.js b/src/ui/Home.js
index b824dc1..d5eab56 100644
--- a/src/ui/Home.js
+++ b/src/ui/Home.js
@@ -5,7 +5,7 @@ import { Router, Route, Link } from 'react-router';
 
 export default class Home extends React.Component {
 	render(){
-		let id = Shortid.generate();
+		let id = this.props.urlid || Shortid.generate();
 
 		return (
 			<div className="container">
diff --git a/src/ui/NotifPage.js b/src/ui/NotifPage.js
index ea98079..745833c 100644
--- a/src/ui/NotifPage.js
+++ b/src/ui/NotifPage.js
@@ -1,6 +1,8 @@
 'use strict';
 import React from 'react';
 import io from 'socket.io-client';
+import { Router, Route, Link } from 'react-router';
+import QRCode from 'qrcode.react';
 
 export default class NotifPage extends React.Component {
 	constructor(props) {
@@ -87,6 +89,7 @@ export default class NotifPage extends React.Component {
 		let supported = this.state.supported;
 		let haveperm = this.state.haveperm;
 		let connected = this.state.connected;
+		let urlid = this.props.urlid;
 
 		return (
 			<div className="container">
@@ -162,6 +165,16 @@ export default class NotifPage extends React.Component {
 								$ notica "This is awesome :)"
 							</code>
 						</p>
+						<p>
+							Need to set Notica up again? <br />
+							<Link to={'/home/' + urlid}>
+								Click here to go back to the instructions.
+							</Link>
+						</p>
+						<p>
+							Open this page on your phone:
+							<center><QRCode value={'https://notica.us/' + urlid} /></center>
+						</p>
 					</div>
 				</div>
 			</div>
diff --git a/src/ui/Site.js b/src/ui/Site.js
index 743eb34..1940005 100644
--- a/src/ui/Site.js
+++ b/src/ui/Site.js
@@ -8,14 +8,20 @@ import { Router, Route, Link } from 'react-router';
 
 export default class Site extends React.Component {
 	render(){
-		let urlid = this.props.splat;
+		let url = this.props.splat;
 		let page = null;
+		let id = '';
 
-		if (urlid == '') {
+		if (url == '') {
 			page = <Home />;
 		}
-		else if (Shortid.isValid(urlid)) {
-			page = <NotifPage urlid={urlid} />;
+		else if (url.substring(0, 4) == 'home') {
+			id = url.substring(5);
+			page = <Home urlid={id} />;
+		}
+		else if (Shortid.isValid(url)) {
+			id = url;
+			page = <NotifPage urlid={url} />;
 		}
 		else {
 			page = <Error />;
@@ -25,7 +31,7 @@ export default class Site extends React.Component {
 			<div>
 				<div className="hero">
 					<div className="title">
-						<Link to={'/'}>
+						<Link to={'/home/' + id}>
 							<img src="/assets/img/logo.svg" />
 							<span className="name">Notica</span>
 						</Link>