diff --git a/assets/css/style.css b/assets/css/style.css
new file mode 100644
index 0000000..736091d
--- /dev/null
+++ b/assets/css/style.css
@@ -0,0 +1,27 @@
+body {
+ margin: 0;
+}
+
+.hero {
+ background: #84DCCF;
+ text-align: center;
+ box-shadow: 0 0 7px #555;
+}
+
+.title {
+ padding-top: 2.5rem;
+}
+
+.tagline {
+ padding-bottom: 2.5rem;
+}
+
+.content {
+ margin: auto;
+ max-width: 800px;
+}
+
+.error {
+ color: #cc0000;
+ font-size: 2rem;
+}
diff --git a/index.html b/index.html
index a84ac6a..9e52846 100644
--- a/index.html
+++ b/index.html
@@ -16,11 +16,13 @@
-
+
-
-
-
+
+
+
+
+
diff --git a/package.json b/package.json
index 5d842a6..d6b9b57 100644
--- a/package.json
+++ b/package.json
@@ -4,7 +4,7 @@
"description": "",
"scripts": {
"dev": "node serverdev.js",
- "build": "webpack --config ./webpack.production.config.js --progress --profile --colors",
+ "build": "webpack --config ./webpack.production.config.js --progress --profile --colors",
"start": "npm run build && node server.js",
"lint": "eslint src"
},
@@ -20,9 +20,11 @@
"webpack-dev-server": "^1.8.2"
},
"dependencies": {
- "body-parser": "^1.15.2",
+ "body-parser": "^1.15.2",
"freezer-js": "^0.6.0",
"react": "^0.13.0",
- "react-router": "^0.13.3"
+ "react-router": "^0.13.3",
+ "shortid": "^2.2.6",
+ "socket.io": "^1.7.2"
}
}
diff --git a/src/App.js b/src/App.js
index aea7047..c793b37 100644
--- a/src/App.js
+++ b/src/App.js
@@ -7,8 +7,9 @@ class App extends React.Component {
this.publishRouter( context.router );
}
render() {
+ let params = this.context.router.getCurrentParams();
return (
-
+
);
}
publishRouter( router ){
diff --git a/src/routes.js b/src/routes.js
index 671b4d5..c6c4c63 100644
--- a/src/routes.js
+++ b/src/routes.js
@@ -2,11 +2,11 @@
import React from 'react';
import Router, {Route, NotFoundRoute, DefaultRoute} from 'react-router';
import App from './App';
-import Home from './ui/Home';
+import Site from './ui/Site';
var routes = (
-
-
+
+
);
diff --git a/src/ui/Error.js b/src/ui/Error.js
new file mode 100644
index 0000000..a981a6c
--- /dev/null
+++ b/src/ui/Error.js
@@ -0,0 +1,12 @@
+'use strict';
+import React from 'react';
+
+export default class Error extends React.Component {
+ render(){
+ return (
+
+ Error page.
+
+ );
+ }
+}
diff --git a/src/ui/Home.js b/src/ui/Home.js
index 5407a2f..acaa942 100644
--- a/src/ui/Home.js
+++ b/src/ui/Home.js
@@ -1,11 +1,56 @@
'use strict';
import React from 'react';
+import Shortid from 'shortid';
export default class Home extends React.Component {
render(){
+ let id = Shortid.generate();
+
return (
-
- Hello world!
+
+
+
+
Usage
+
+ Notify is a Bash function / alias that will send a notification to a tab in your browser when it's ran:
+
+
+
+
+
+
$ make all; notify Code is done compiling!
+
+ This will wait until the first command completes before running Notify. That way you can go do other things while your long task runs.
+
+
+
+
+
+
+
+
+
Setup
+
Curl is required to use Notify.
+
Add this line to your .bashrc
file:
+
+
+ notify() { curl --data "$@" https://notify.com/{id} }
+
+
+
Source your .bashrc
file to apply the changes:
+
$ source .bashrc
+
Now, open this link in a new tab:
+
https://notify.com/{id}
+
All done! Bookmark that link so you can find it later since it's unique to you.
+
+
One-Line Setup
+
+
+ $ echo 'notify() { curl --data "$@" https://notify.com/{id} }' >> ~/.bashrc && source ~/.bashrc
+
+
+
+
);
}
diff --git a/src/ui/NotifPage.js b/src/ui/NotifPage.js
new file mode 100644
index 0000000..f606dba
--- /dev/null
+++ b/src/ui/NotifPage.js
@@ -0,0 +1,52 @@
+'use strict';
+import React from 'react';
+
+export default class NotifPage extends React.Component {
+ constructor(props) {
+ super(props);
+
+ this.state = {
+ haveperm: false
+ }
+ }
+
+ checkperm(permission) {
+ if (permission === 'granted') {
+ this.setState({haveperm: true});
+ }
+ }
+
+ render(){
+ let supported = ("Notification" in window);
+
+ if (supported) {
+ Notification.requestPermission(permission => {
+ this.checkperm(permission);
+ }.bind(this));
+ }
+
+ return (
+
+
+
+
Notification Page
+ { supported ||
+ Error: This browser does not support desktop notifications :(
+
}
+ { !this.state.haveperm && supported &&
}
+ { this.state.haveperm && supported &&
+ This page is now monitoring for notifications.
+
}
+
+
+
+ );
+ }
+}
diff --git a/src/ui/Site.js b/src/ui/Site.js
new file mode 100644
index 0000000..42c0bb1
--- /dev/null
+++ b/src/ui/Site.js
@@ -0,0 +1,37 @@
+'use strict';
+import React from 'react';
+import Home from './Home';
+import NotifPage from './NotifPage';
+import Error from './Error';
+import Shortid from 'shortid';
+
+export default class Site extends React.Component {
+ render(){
+ let urlid = this.props.splat;
+ let page = null;
+
+ if (urlid == '') {
+ page =
;
+ }
+ else if (Shortid.isValid(urlid)) {
+ page =
;
+ }
+ else {
+ page =
;
+ }
+
+ return (
+
+
+
+
Notify
+
+
+ Send a browser notification from your terminal. No installation.
+
+
+ {page}
+
+ );
+ }
+}