initial commit

khyati-k · Aug 21, 2017 · dfc3950 · dfc3950
commit dfc3950
Show file tree

Hide file tree

Showing 27 changed files with 2,670 additions and 0 deletions.
diff --git a/.firebaserc b/.firebaserc
@@ -0,0 +1,6 @@
+{
+  "projects": {
+    "first": "pwa-trial",
+    "default": "pwa-trial"
+  }
+}
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,22 @@
+# See https://help.github.com/ignore-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/Lighthouse-reports
+
+# testing
+/coverage
+
+
+
+# misc
+.DS_Store
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+firebase-debug.log*
diff --git a/README.md b/README.md
diff --git a/build/asset-manifest.json b/build/asset-manifest.json
@@ -0,0 +1,5 @@
+{
+  "main.js": "static/js/main.ce242b9b.js",
+  "main.js.map": "static/js/main.ce242b9b.js.map",
+  "static\\media\\logo.svg": "static/media/logo.5d5d9eef.svg"
+}
diff --git a/build/bootstrap-grid.min.css b/build/bootstrap-grid.min.css
diff --git a/build/favicon.ico b/build/favicon.ico
diff --git a/build/index.html b/build/index.html
@@ -0,0 +1 @@
+<!DOCTYPE html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><meta name="mobile-web-app-capable" content="yes"><meta name="apple-mobile-web-app-capable" content="yes"><meta name="theme-color" content="#536878"><link rel="manifest" href="/manifest.json"><link rel="shortcut icon" href="/favicon.ico"><link rel="stylesheet" href="bootstrap-grid.min.css"><title>On TV tonight..</title><style>body{background-color:#9b59b6!important;font-family:sans-serif}a{text-decoration:none;color:#e0cdcd}h1,h3{display:flex;justify-content:center;color:#e0cdcd!important}.footer,.navbar{background-color:#8e44ad}</style></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"><div class="navbar"><h1>TV SCHEDULE</h1></div><h1>On TV tonight</h1><div class="footer"><h3>created using <a href="https://www.tvmaze.com/">TVMaze API</a></h3></div></div><script>function displayNotification(){"granted"==Notification.permission&&navigator.serviceWorker.getRegistration().then(function(o){var i={body:"Here is a notification body!",icon:"favicon.ico",vibrate:[100,50,100],data:{dateOfArrival:Date.now(),primaryKey:1},actions:[{action:"explore",title:"Explore this new world"},{action:"close",title:"Close notification"}]};o.showNotification("Hello world!",i)})}"serviceWorker"in navigator?window.addEventListener("load",function(){navigator.serviceWorker.register("service-worker.js").then(function(o){console.log("ServiceWorker registration successful with scope: ",o.scope)},function(o){console.log("ServiceWorker registration failed: ",o)}).catch(function(o){console.log(o)})}):console.log("service worker is not supported"),Notification.requestPermission(function(o){console.log("Notification permission status:",o)})</script><script type="text/javascript" src="/static/js/main.ce242b9b.js"></script></body></html>
diff --git a/build/manifest.json b/build/manifest.json
@@ -0,0 +1,15 @@
+{
+  "short_name": "TV Guide",
+  "name": "Add TV Guide to home-screen",
+  "icons": [
+    {
+      "src": "favicon.ico",
+      "sizes": "192x192",
+      "type": "image/png"
+    }
+  ],
+  "start_url": "/?utm_source=homescreen",
+  "display": "standalone",
+  "theme_color": "#fff",
+  "background_color": "#fff"
+}
diff --git a/build/service-worker.js b/build/service-worker.js
diff --git a/build/static/js/main.ce242b9b.js b/build/static/js/main.ce242b9b.js
diff --git a/build/static/js/main.ce242b9b.js.map b/build/static/js/main.ce242b9b.js.map
diff --git a/build/static/media/logo.5d5d9eef.svg b/build/static/media/logo.5d5d9eef.svg
diff --git a/firebase.json b/firebase.json
@@ -0,0 +1,10 @@
+{
+  "hosting": {
+    "public": "build",
+    "ignore": [
+      "firebase.json",
+      "**/.*",
+      "**/node_modules/**"
+    ]
+  }
+}
diff --git a/package.json b/package.json
@@ -0,0 +1,19 @@
+{
+  "name": "pwa",
+  "version": "0.1.0",
+  "private": true,
+  "dependencies": {
+    "axios": "^0.16.2",
+    "react": "^15.6.1",
+    "react-bootstrap": "^0.31.2",
+    "react-dom": "^15.6.1",
+    "react-router": "^3.0.5",
+    "react-scripts": "1.0.11"
+  },
+  "scripts": {
+    "start": "react-scripts start",
+    "build": "react-scripts build",
+    "test": "react-scripts test --env=jsdom",
+    "eject": "react-scripts eject"
+  }
+}
diff --git a/public/bootstrap-grid.min.css b/public/bootstrap-grid.min.css
diff --git a/public/favicon.ico b/public/favicon.ico
diff --git a/public/index.html b/public/index.html
@@ -0,0 +1,129 @@
+<!doctype html>
+<html lang="en">
+
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+
+
+  <meta name="mobile-web-app-capable" content="yes">
+  <meta name="apple-mobile-web-app-capable" content="yes">
+
+  <meta name="theme-color" content="#536878">
+  <!--
+      manifest.json provides metadata used when your web app is added to the
+      homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/
+    -->
+  <link rel="manifest" href="%PUBLIC_URL%/manifest.json">
+  <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
+  <!--
+      Notice the use of %PUBLIC_URL% in the tags above.
+      It will be replaced with the URL of the `public` folder during the build.
+      Only files inside the `public` folder can be referenced from the HTML.
+
+      Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
+      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`.
+    -->
+    <!--    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/latest/css/bootstrap.min.css"> -->
+    <link rel="stylesheet" href="bootstrap-grid.min.css">  
+
+  <title>On TV tonight..</title>
+  <style type="text/css">
+
+    body {
+      background-color: #9b59b6 !important;
+      font-family: sans-serif;
+    }
+    a{
+      text-decoration: none;
+      color: #E0CDCD;
+    }
+
+    h1,
+    h3 {
+      display: flex;
+      justify-content: center;
+      color: #E0CDCD !important;
+    }
+
+    .navbar,
+    .footer {
+      background-color: #8e44ad;
+    }
+
+  </style>
+</head>
+
+<body>
+  <noscript>
+    You need to enable JavaScript to run this app.
+  </noscript>
+
+  <div id="root">
+    <!--for first meaningful paint -->
+    <div class="navbar">
+      <h1>TV SCHEDULE</h1>
+    </div>
+    <h1>On TV tonight</h1>
+    <div class="footer">
+      <h3>
+        created using <a href="https://www.tvmaze.com/">  TVMaze API </a>
+      </h3>
+    </div>
+  </div>
+  <!--
+      This HTML file is a template.
+      If you open it directly in the browser, you will see an empty page.
+
+      You can add webfonts, meta tags, or analytics to this file.
+      The build step will place the bundled scripts into the <body> tag.
+
+      To begin the development, run `npm start` or `yarn start`.
+      To create a production bundle, use `npm run build` or `yarn build`.
+    -->
+  <script>
+    if ('serviceWorker' in navigator) {
+      window.addEventListener('load', function () {
+        navigator.serviceWorker.register('service-worker.js').then(function (registration) {
+          // Registration was successful
+          console.log('ServiceWorker registration successful with scope: ', registration.scope);
+        }, function (err) {
+          // registration failed 
+          console.log('ServiceWorker registration failed: ', err);
+        }).catch(function (err) {
+          console.log(err)
+        });
+      });
+    } else {
+      console.log('service worker is not supported');
+    }
+    //for web notification
+    Notification.requestPermission(function(status) {
+    console.log('Notification permission status:', status);
+});
+//notification
+function displayNotification() {
+  if (Notification.permission == 'granted') {
+    navigator.serviceWorker.getRegistration().then(function(reg) {
+      var options = {
+        body: 'Here is a notification body!',
+        icon: 'favicon.ico',
+        vibrate: [100, 50, 100],
+        data: {
+          dateOfArrival: Date.now(),
+          primaryKey: 1
+        },
+        actions: [
+          {action: 'explore', title: 'Explore this new world'},
+          {action: 'close', title: 'Close notification'},
+        ]
+      };
+      reg.showNotification('Hello world!', options);
+    });
+  }
+}
+  </script>
+</body>
+
+</html>
diff --git a/public/manifest.json b/public/manifest.json
@@ -0,0 +1,15 @@
+{
+  "short_name": "TV Guide",
+  "name": "Add TV Guide to home-screen",
+  "icons": [
+    {
+      "src": "favicon.ico",
+      "sizes": "192x192",
+      "type": "image/png"
+    }
+  ],
+  "start_url": "/?utm_source=homescreen",
+  "display": "standalone",
+  "theme_color": "#fff",
+  "background_color": "#fff"
+}
diff --git a/public/service-worker.js b/public/service-worker.js
@@ -0,0 +1,60 @@
+// Set this to true for production
+var doCache = true;
+
+// Name our cache
+var CACHE_NAME = 'my-pwa-cache-v1';
+
+// Delete old caches that are not our current one!
+self.addEventListener("activate", event => {
+  const cacheWhitelist = [CACHE_NAME];
+  event.waitUntil(
+    caches.keys()
+      .then(keyList =>
+        Promise.all(keyList.map(key => {
+          if (!cacheWhitelist.includes(key)) {
+            console.log('Deleting cache: ' + key)
+            return caches.delete(key);
+          }
+        }))
+      )
+  );
+});
+
+// The first time the user starts up the PWA, 'install' is triggered.
+self.addEventListener('install', function(event) {
+  if (doCache) {
+    event.waitUntil(
+      caches.open(CACHE_NAME)
+        .then(function(cache) {
+          // Get the assets manifest so we can see what our js file is named
+          // This is because webpack hashes it
+          fetch("asset-manifest.json")
+            .then(response => {
+              response.json()
+            })
+            .then(assets => {
+              // Open a cache and cache our files
+              // We want to cache the page and the main.js generated by webpack
+              // We could also cache any static assets like CSS or images
+              const urlsToCache = [
+                "/",
+                assets["main.js"]
+              ]
+              cache.addAll(urlsToCache)
+              console.log('cached');
+            })
+        })
+    );
+  }
+});
+
+// When the webpage goes to fetch files, we intercept that request and serve up the matching files
+// if we have them
+self.addEventListener('fetch', function(event) {
+    if (doCache) {
+      event.respondWith(
+          caches.match(event.request).then(function(response) {
+              return response || fetch(event.request);
+          })
+      );
+    }
diff --git a/src/App.css b/src/App.css
@@ -0,0 +1,4 @@
+@import url('https://fonts.googleapis.com/css?family=Roboto');
+body {
+   font-family: 'Roboto', sans-serif;
+  }
diff --git a/src/App.js b/src/App.js
@@ -0,0 +1,45 @@
+import React, { Component } from 'react';
+//import { Router, browserHistory, Route, Link } from 'react-router';
+import axios from 'axios';
+
+import logo from './logo.svg';
+//import './App.css';
+//import Routes from './routes.js';
+import Box from './component/box.js';
+
+class App extends Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      data: []
+    }
+  }
+
+  componentDidMount() {
+    axios.get('https://api.tvmaze.com/schedule/full').then(function (response) {
+      this.setState({ data: response.data.slice(0, 20) });
+    }.bind(this));
+  }
+
+  render() {
+    let data = this.state.data;
+    return (
+      <div>
+        <div className="navbar">
+          <h1>TV SCHEDULE</h1>
+        </div>
+
+        <h1>On TV tonight</h1>
+        <Box data={data} />
+
+        <div className="footer">
+          <h3>
+            created using <a href="https://www.tvmaze.com/"> TVMaze API</a>
+          </h3>
+        </div >
+      </div>
+    );
+  }
+}
+
+export default App;
diff --git a/src/App.test.js b/src/App.test.js
@@ -0,0 +1,8 @@
+import React from 'react';
+import ReactDOM from 'react-dom';
+import App from './App';
+
+it('renders without crashing', () => {
+  const div = document.createElement('div');
+  ReactDOM.render(<App />, div);
+});
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1 @@
		<!DOCTYPE html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><meta name="mobile-web-app-capable" content="yes"><meta name="apple-mobile-web-app-capable" content="yes"><meta name="theme-color" content="#536878"><link rel="manifest" href="/manifest.json"><link rel="shortcut icon" href="/favicon.ico"><link rel="stylesheet" href="bootstrap-grid.min.css"><title>On TV tonight..</title><style>body{background-color:#9b59b6!important;font-family:sans-serif}a{text-decoration:none;color:#e0cdcd}h1,h3{display:flex;justify-content:center;color:#e0cdcd!important}.footer,.navbar{background-color:#8e44ad}</style></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"><div class="navbar"><h1>TV SCHEDULE</h1></div><h1>On TV tonight</h1><div class="footer"><h3>created using <a href="https://www.tvmaze.com/">TVMaze API</a></h3></div></div><script>function displayNotification(){"granted"==Notification.permission&&navigator.serviceWorker.getRegistration().then(function(o){var i={body:"Here is a notification body!",icon:"favicon.ico",vibrate:[100,50,100],data:{dateOfArrival:Date.now(),primaryKey:1},actions:[{action:"explore",title:"Explore this new world"},{action:"close",title:"Close notification"}]};o.showNotification("Hello world!",i)})}"serviceWorker"in navigator?window.addEventListener("load",function(){navigator.serviceWorker.register("service-worker.js").then(function(o){console.log("ServiceWorker registration successful with scope: ",o.scope)},function(o){console.log("ServiceWorker registration failed: ",o)}).catch(function(o){console.log(o)})}):console.log("service worker is not supported"),Notification.requestPermission(function(o){console.log("Notification permission status:",o)})</script><script type="text/javascript" src="/static/js/main.ce242b9b.js"></script></body></html>