Update

.firebase/hosting.cHVibGlj.cache

@@ -0,0 +1,2 @@
+404.html,1587671220032,05cbc6f94d7a69ce2e29646eab13be2c884e61ba93e3094df5028866876d18b3
+index.html,1587671220098,89410136268588b343001266cf117c5499ed741502df878fc690b154b4565de7

.firebaserc

@@ -0,0 +1,5 @@
+{
+  "projects": {
+    "default": "project-gg-3b754"
+  }
+}

.gitignore

@@ -8,8 +8,9 @@ secrets
 node_modules
 
 # Icon must end with two \r
-Icon
+Icon
 
+project-gg-3b754-firebase-adminsdk-4848h-5a5778b77b.json
 # Thumbnails
 ._*
 

firebase.json

@@ -0,0 +1,9 @@
+{
+  "hosting": {
+    "public": "public",
+    "rewrites": [{
+    	"source":"**",
+    	"function":"application"
+    }]
+  }
+}

functions/.gitignore

@@ -0,0 +1 @@
+node_modules/

functions/index.js

@@ -0,0 +1,76 @@
+const functions = require('firebase-functions');
+
+var express = require('express')
+var logger = require('morgan')
+var admin = require("firebase-admin");
+var serviceAccount = require("./project-gg-3b754-firebase-adminsdk-4848h-5a5778b77b.json");
+
+var firebaseadmin = admin.initializeApp({
+  credential: admin.credential.cert(serviceAccount),
+  databaseURL: "https://project-gg-3b754.firebaseio.com"
+});
+var database = firebaseadmin.database()
+
+var app = express()
+
+app.use(logger('dev'))
+app.use(express.static('views'))
+
+app.set('view engine', 'ejs')
+app.set('views', __dirname + '/views')
+
+
+
+app.get("/", function(request, responce) {
+	var dbRef = database.ref("/products")
+	dbRef.limitToFirst(5).once('value', function(snapshot){
+		var data = {}
+		data = snapshot.val()
+		var x = "none"
+		if (request.query.itemAdded == "true") {
+			x = 'block'
+		}
+		responce.render('home.ejs', {products: data, message: x})
+	})
+
+	// responce.render("home.ejs")
+})
+
+app.get("/home", function(request, responce) {
+	var dbRef = database.ref("/products")
+	dbRef.limitToFirst(5).once('value', function(snapshot){
+		var data = {}
+		data = snapshot.val()
+		var x = "none"
+		if (request.query.itemAdded == "true") {
+			x = 'block'
+		}
+		responce.render('home.ejs', {products: data, message: x})
+	})
+
+	// responce.render("home.ejs")
+})
+
+app.get('/additmpage', function(request, responce){
+	responce.render('add-item.ejs')
+})
+
+app.get('/product', function(request, responce){
+	if (request.query.productid) {
+		var dbRef = database.ref("/products/"+request.query.productid)
+		dbRef.once('value', function(snapshot){
+			data = snapshot.val()
+			if (data){
+				responce.render('product.ejs', {item:data})
+			}
+			else {
+				responce.render('404.ejs')
+			}
+		})
+	}
+	else {
+		responce.render('404.ejs')
+	}
+})
+
+exports.application = functions.https.onRequest(app)

functions/package.json

@@ -0,0 +1,25 @@
+{
+  "name": "functions",
+  "description": "Cloud Functions for Firebase",
+  "scripts": {
+    "serve": "firebase emulators:start --only functions",
+    "shell": "firebase functions:shell",
+    "start": "npm run shell",
+    "deploy": "firebase deploy --only functions",
+    "logs": "firebase functions:log"
+  },
+  "engines": {
+    "node": "8"
+  },
+  "dependencies": {
+    "ejs": "^3.0.2",
+    "express": "^4.17.1",
+    "firebase-admin": "^8.11.0",
+    "firebase-functions": "^3.6.0",
+    "morgan": "^1.10.0"
+  },
+  "devDependencies": {
+    "firebase-functions-test": "^0.2.0"
+  },
+  "private": true
+}

functions/views/add-item.ejs

@@ -25,7 +25,7 @@
 			<div class="navbar">
 				<div class="logon-crumbs">
 					<div id="uname-field" style="display: none;">
-						<a id="uname-dom" class="user-name" href="/">Unregistered user</a>
+						<a id="uname-dom" class="user-name" href="home">Unregistered user</a>
 						<div class="user-logout">
 							<a onclick={signout()}>Log out</a>
 						</div>

functions/views/home.ejs

@@ -24,7 +24,7 @@
 			<div class="navbar">
 				<div class="logon-crumbs">
 					<div id="uname-field" style="display: none;">
-						<a id="uname-dom" class="user-name" href="/">Unregistered user</a>
+						<a id="uname-dom" class="user-name" href="home">Unregistered user</a>
 						<div class="user-logout">
 							<a onclick={signout()}>Log out</a>
 						</div>
@@ -45,7 +45,7 @@
 						&#x1F6d2; | <%= 0%>
 					</div>
 					<div class="add-item">
-						<a href="/additmpage">⊕</a>
+						<a href="additmpage">⊕</a>
 					</div>
 				</div>
 			</div>
@@ -72,7 +72,7 @@
 				<% var keys = Object.keys(products) %>
 				<% keys.forEach(function(key){ %>
 					<div class="product-container">
-						<a href="/product?productid=<%=key%>">
+						<a href="product?productid=<%=key%>">
 							<img class="dyn-img" title="<%= products[key].img %>" alt="img">
 						</a>
 						<p class="l"><%= products[key].name%></p>

functions/views/js/fdb.js

@@ -46,7 +46,7 @@ function addItem(item){
 
 	itemRef.push(item)
 		.then(function(){
-			window.location.replace('/?itemAdded=true')
+			window.location.replace('home?itemAdded=true')
 		})
 		.catch(function(error){
 			console.log(error)

functions/views/product.ejs

@@ -24,7 +24,7 @@
 			<div class="navbar">
 				<div class="logon-crumbs">
 					<div id="uname-field" style="display: none;">
-						<a id="uname-dom" class="user-name" href="/">Unregistered user</a>
+						<a id="uname-dom" class="user-name" href="home">Unregistered user</a>
 						<div class="user-logout">
 							<a onclick={signout()}>Log out</a>
 						</div>
@@ -45,7 +45,7 @@
 						&#x1F6d2; | <%= 0%>
 					</div>
 					<div class="add-item">
-						<a href="/additmpage">⊕</a>
+						<a href="additmpage">⊕</a>
 					</div>
 				</div>
 			</div>

package.json

@@ -15,7 +15,8 @@
   "dependencies": {
     "ejs": "^3.0.2",
     "express": "^4.17.1",
-    "firebase-admin": "^8.10.0",
+    "firebase-admin": "^8.11.0",
+    "firebase-tools": "^8.1.1",
     "morgan": "^1.10.0"
   }
 }

public/404.html

@@ -0,0 +1,33 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <title>Page Not Found</title>
+
+    <style media="screen">
+      body { background: #ECEFF1; color: rgba(0,0,0,0.87); font-family: Roboto, Helvetica, Arial, sans-serif; margin: 0; padding: 0; }
+      #message { background: white; max-width: 360px; margin: 100px auto 16px; padding: 32px 24px 16px; border-radius: 3px; }
+      #message h3 { color: #888; font-weight: normal; font-size: 16px; margin: 16px 0 12px; }
+      #message h2 { color: #ffa100; font-weight: bold; font-size: 16px; margin: 0 0 8px; }
+      #message h1 { font-size: 22px; font-weight: 300; color: rgba(0,0,0,0.6); margin: 0 0 16px;}
+      #message p { line-height: 140%; margin: 16px 0 24px; font-size: 14px; }
+      #message a { display: block; text-align: center; background: #039be5; text-transform: uppercase; text-decoration: none; color: white; padding: 16px; border-radius: 4px; }
+      #message, #message a { box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24); }
+      #load { color: rgba(0,0,0,0.4); text-align: center; font-size: 13px; }
+      @media (max-width: 600px) {
+        body, #message { margin-top: 0; background: white; box-shadow: none; }
+        body { border-top: 16px solid #ffa100; }
+      }
+    </style>
+  </head>
+  <body>
+    <div id="message">
+      <h2>404</h2>
+      <h1>Page Not Found</h1>
+      <p>The specified file was not found on this website. Please check the URL for mistakes and try again.</p>
+      <h3>Why am I seeing this?</h3>
+      <p>This page was generated by the Firebase Command-Line Interface. To modify it, edit the <code>404.html</code> file in your project's configured <code>public</code> directory.</p>
+    </div>
+  </body>
+</html>

public/index.html

@@ -0,0 +1,66 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <title>Welcome to Firebase Hosting</title>
+
+    <!-- update the version number as needed -->
+    <script defer src="/__/firebase/7.14.1/firebase-app.js"></script>
+    <!-- include only the Firebase features as you need -->
+    <script defer src="/__/firebase/7.14.1/firebase-auth.js"></script>
+    <script defer src="/__/firebase/7.14.1/firebase-database.js"></script>
+    <script defer src="/__/firebase/7.14.1/firebase-messaging.js"></script>
+    <script defer src="/__/firebase/7.14.1/firebase-storage.js"></script>
+    <!-- initialize the SDK after all desired features are loaded -->
+    <script defer src="/__/firebase/init.js"></script>
+
+    <style media="screen">
+      body { background: #ECEFF1; color: rgba(0,0,0,0.87); font-family: Roboto, Helvetica, Arial, sans-serif; margin: 0; padding: 0; }
+      #message { background: white; max-width: 360px; margin: 100px auto 16px; padding: 32px 24px; border-radius: 3px; }
+      #message h2 { color: #ffa100; font-weight: bold; font-size: 16px; margin: 0 0 8px; }
+      #message h1 { font-size: 22px; font-weight: 300; color: rgba(0,0,0,0.6); margin: 0 0 16px;}
+      #message p { line-height: 140%; margin: 16px 0 24px; font-size: 14px; }
+      #message a { display: block; text-align: center; background: #039be5; text-transform: uppercase; text-decoration: none; color: white; padding: 16px; border-radius: 4px; }
+      #message, #message a { box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24); }
+      #load { color: rgba(0,0,0,0.4); text-align: center; font-size: 13px; }
+      @media (max-width: 600px) {
+        body, #message { margin-top: 0; background: white; box-shadow: none; }
+        body { border-top: 16px solid #ffa100; }
+      }
+    </style>
+  </head>
+  <body>
+    <h1>...It works, but it shouldn't</h1>
+    <div id="message">
+      <h2>Welcome</h2>
+      <h1>Firebase Hosting Setup Complete</h1>
+      <p>You're seeing this because you've successfully setup Firebase Hosting. Now it's time to go build something extraordinary!</p>
+      <a target="_blank" href="https://firebase.google.com/docs/hosting/">Open Hosting Documentation</a>
+    </div>
+    <p id="load">Firebase SDK Loading&hellip;</p>
+
+    <script>
+      document.addEventListener('DOMContentLoaded', function() {
+        // // 🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥
+        // // The Firebase SDK is initialized and available here!
+        //
+        // firebase.auth().onAuthStateChanged(user => { });
+        // firebase.database().ref('/path/to/ref').on('value', snapshot => { });
+        // firebase.messaging().requestPermission().then(() => { });
+        // firebase.storage().ref('/path/to/ref').getDownloadURL().then(() => { });
+        //
+        // // 🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥
+
+        try {
+          let app = firebase.app();
+          let features = ['auth', 'database', 'messaging', 'storage'].filter(feature => typeof app[feature] === 'function');
+          document.getElementById('load').innerHTML = `Firebase SDK loaded with ${features.join(', ')}`;
+        } catch (e) {
+          console.error(e);
+          document.getElementById('load').innerHTML = 'Error loading the Firebase SDK, check the console.';
+        }
+      });
+    </script>
+  </body>
+</html>