diff --git a/README.md b/README.md
index 93c09c33..9c47377b 100644
--- a/README.md
+++ b/README.md
@@ -33,28 +33,32 @@ It looks great on mobile too!
 Here we will cover how to add your own information to the auctions themselves, then how to most a local server to see your changes and finally how to connect it all to Firebase to enable user login and bidding.
 
 ### Adding auction information
-First, set `demoAuction=False` (this will keep the cats at bay).
+First, set `demoAuction=False` in `js/auctions.js` (this will keep the cats at bay).
 
-Then, populate all of the arrays at the top of `js/auctions.js` with the information for of the items you'll be putting up for auction.
-
-The only complicated option is `endTimes`, which is a list of times (relative to epoch) **in milliseconds**. See [JavaScript's `Date` class](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date) for more information.
+Then, populate the `Object` at the bottom of `js/firebase.js` with the information for of the items you'll be putting up for auction. The fields are:
+- `primaryImage` (`String`): path or URL to the primary image
+- `title` (`String`): auction title
+- `subtitle` (`String`): auction subtitle
+- `detail` (`String`): auction detail text
+- `secondaryImage` (`String`): path or URL to the secondary image
+- `startingPrice` (`Number`): auction price,
+- `endTime` (`Number`): auction end time relative to epoch **in milliseconds**. (See [JavaScript's `Date` class](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date) for more information.)
 
 ### Firebase setup
 Here we will cover how to set up your Firebase project and then how to enable the Firebase authentication and database respectively.
 
 #### Creating a project
 You can create a project using the following steps:
-- Head to the [Firebase website](https://console.firebase.google.com/) where you can manage your projects.
-- Click `Add project` and choose your project's name.
+- Head to the [Firebase console](https://console.firebase.google.com/) where you can manage your projects.
+- Click `Add project` and name your project.
 - Then you may enable or disable Google Analytics at your discretion.
-- You will then be taken to your project's console (https://console.firebase.google.com/project/your-project-name/overview) where you will add a web app to your project by clicking on the relevant button and chosing a name for the app (this is arbitrary and only to identify your app within the project if, for example, you had multiple apps).
-- Now that you have created an app you should be shown a code snipped containing `firebaseConfig`. Copy everything inside `firebaseConfig` to the `firebaseConfig` variable in `index.html`.
-- Finally you will want to update the version of the Firebase SDKs that are imported after [line 33 of `index.html`](https://github.com/HMellor/auction-website/blob/master/index.html#L33). The most recent version will be shown in the script tag above `firebaseConfig` when you create your project.
+- You will then be taken to your project's overview where you will add a web app to your project by clicking `Add app` and selecting the web app icon (the app's name is arbitrary and is only used to identify the app within your project if, for example, you had multiple apps in the same project).
+- Now that you have created an app you should be shown a code snippet containing `firebaseConfig`. Copy everything inside `firebaseConfig` to the `firebaseConfig` variable in `index.html`.
 
-(The code snippet containing `firebaseConfig` and the current version can be found in general project settings if you missed it earlier)
+> The code snippet containing `firebaseConfig` and the current version can be found in `Project settings` if you need to refer to it later.
 
 #### Authentication
-Setting up authentication is very simple. Head to your project's console and click on Authentication in the menu on the left. Then go to the Sign-in method tab and enable toggle switch for the Anonymous sign-in provider.
+Head to your project's console and click on Authentication in the menu on the left. Then go to the Sign-in method tab and enable toggle switch for the Anonymous sign-in provider.
 
 #### Database
 Setting up the database is a little more involved so here are the steps you must take:
@@ -107,7 +111,7 @@ To create an admin account:
 - Host your website either locally or on GitHub Pages and log in to your website.
 - Then go to your Firestore console and find the document for the user you just created.
 - There should be a field in the document called `admin` which has the value `"false"`. You must now create a password (or hash) that enables admin access and set the `admin` field to this value.
-- With your admin password chosen, go to your Firestore rules and replace `"insert long random secret string"` with it.
+- Go to your Firestore rules and replace `"insert long random secret string"` with your admin password.
 - You have now created your admin account.
 
 To initialise the auctions:
@@ -117,4 +121,4 @@ To initialise the auctions:
 resetAll()
 ```
 - This will wipe all documents in the `auction-live` and `auction-store` collections and create auctions with the titles, info and reserve prices you defined earlier (as long as you are admin).
-- Your auction is now ready for your event.
+- Your auction is now ready.
diff --git a/index.html b/index.html
index 73a56d78..db4722b0 100644
--- a/index.html
+++ b/index.html
@@ -28,28 +28,6 @@
 </head>
 
 <body>
-
-  <!-- The core Firebase JS SDK is always required and must be listed first -->
-  <script src="https://www.gstatic.com/firebasejs/6.5.0/firebase-app.js"></script>
-  <script src="https://www.gstatic.com/firebasejs/6.5.0/firebase-auth.js"></script>
-  <script src="https://www.gstatic.com/firebasejs/6.5.0/firebase-firestore.js"></script>
-
-  <script>
-    // Your web app's Firebase configuration
-    const firebaseConfig = {
-      apiKey: "AIzaSyCAYOYDuMKGGjTSJL5uDzG5hjQ6y_vYPiI",
-      authDomain: "auction-website-b12fc.firebaseapp.com",
-      databaseURL: "https://auction-website-b12fc.firebaseio.com",
-      projectId: "auction-website-b12fc",
-      storageBucket: "auction-website-b12fc.appspot.com",
-      messagingSenderId: "791747024664",
-      appId: "1:791747024664:web:215a222a81c6d0c2aeb06d"
-    };
-    // Initialize Firebase
-    firebase.initializeApp(firebaseConfig);
-    var db = firebase.firestore();
-    var auth = firebase.auth();
-  </script>
   <!-- Navbar -->
   <nav class="navbar navbar-dark bg-primary">
     <div class="container-fluid">
@@ -151,10 +129,12 @@ <h5 id="bid-modal-title" class="modal-title">Place your bid</h5>
   </div>
   <!-- Custom JS -->
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
-  <script src="./js/auctions.js"></script>
-  <script src="./js/popups.js"></script>
+  <script type="module" src="./js/auctions.js"></script>
+  <script type="module" src="./js/popups.js"></script>
   <!-- Create anonymous account -->
-  <script>
+  <script type="module">
+    import { populateAuctionGrid, setClocks, dataListener } from "./js/auctions.js";
+    import { autoLogin } from "./js/popups.js";
     populateAuctionGrid();
     setClocks();
     dataListener()
diff --git a/js/auctions.js b/js/auctions.js
index f3c75a8a..efd37797 100644
--- a/js/auctions.js
+++ b/js/auctions.js
@@ -1,63 +1,49 @@
+// Imports
+import { auth, db, auctions } from "./firebase.js";
+import { bidModal } from "./popups.js";
+import { doc, getDoc, setDoc, updateDoc, writeBatch, onSnapshot } from "https://www.gstatic.com/firebasejs/9.20.0/firebase-firestore.js";
+
 // For a real auction, set this to false
 let demoAuction = true;
-// For a real auction, populate these arrays
-let primaryImages = [];
-let titles = [];
-let subtitles = [];
-let details = [];
-let secondaryImages = [];
-let startingPrices = [55, 60, 20, 0, 4, 0, 99, 0, 12, 6, 3, 7];
-let endTimes = []; // Make sure to fix these to UTC time so they don't change with the users timezone
 
 // Random auction information
 function generateRandomAuctions() {
   // Random cat images
-  document.querySelectorAll(".card > img").forEach(img => {
-    img.src = "https://cataas.com/cat/cute?random=" + Math.random();
-    primaryImages.push(img.src);
-    secondaryImages.push(img.src);
+  document.querySelectorAll(".card > img").forEach((img, idx) => {
+    img.src = "https://cataas.com/cat/cute?random=" + idx;
+    auctions[idx].primaryImage = img.src;
+    auctions[idx].secondaryImage = img.src;
   });
   // Random cat names
   $.getJSON(
     "https://random-data-api.com/api/name/random_name",
-    { size: startingPrices.length },
+    { size: auctions.length },
     function (data) {
       data.forEach((elem, idx) => {
         document.querySelector("#auction-" + idx + " > div > h5").innerHTML = elem.name;
-        titles.push(elem.name);
+        auctions[idx].title = elem.name;
       });
     }
   );
   // Random lorem ipsum cat descriptions
   $.getJSON(
     "https://random-data-api.com/api/lorem_ipsum/random_lorem_ipsum",
-    { size: startingPrices.length },
+    { size: auctions.length },
     function (data) {
       data.forEach((elem, idx) => {
         document.querySelector("#auction-" + idx + " > div > p").innerHTML = elem.short_sentence;
-        subtitles.push(elem.short_sentence);
-        details.push(elem.very_long_sentence);
+        auctions[idx].subtitle = elem.short_sentence;
+        auctions[idx].detail = elem.very_long_sentence;
       });
     }
   );
-}
-
-// Initial state of auction, used for resetting database
-let startPrices = [];
-for (let i = 0; i < startingPrices.length; i++) {
-  if (demoAuction) {
+  // Random end times
+  for (let i = 0; i < auctions.length; i++) {
     let now = new Date();
     let endTime = new Date().setHours(8 + i, 0, 0, 0)
     if (endTime - now < 0) { endTime = new Date(endTime).setDate(now.getDate() + 1) }
-    endTimes.push(endTime)
+    auctions[i].endTime = endTime
   }
-  startPrices.push({
-    bid0: {
-      bidder: String(i),
-      amount: startingPrices[i],
-      time: Date().substring(0, 24)
-    }
-  })
 }
 
 // Convert time to string for HTML clocks
@@ -76,16 +62,16 @@ function timeBetween(start, end) {
 }
 
 // Set time on HTML clocks
-function setClocks() {
+export function setClocks() {
   let now = new Date();
   let nowTime = now.getTime();
-  for (i = 0; i < startingPrices.length; i++) {
+  for (let i = 0; i < auctions.length; i++) {
     let timer = document.getElementById("time-left-" + i)
     // remove finished auction after 5 minutes
-    if (endTimes[i] - nowTime < -300) {
+    if (auctions[i].endTime - nowTime < -300) {
       document.getElementById("auction-" + i).parentElement.style.display = "none"
       if (demoAuction) {
-        endTimes[i] = new Date(endTimes[i]).setDate(now.getDate() + 1) // add 1 day
+        auctions[i].endTime = new Date(auctions[i].endTime).setDate(now.getDate() + 1) // add 1 day
         document.getElementById("auction-" + i).parentElement.remove()
         resetLive(i);
         resetStore(i);
@@ -94,11 +80,11 @@ function setClocks() {
         auctionGrid.appendChild(auctionCard);
       }
       // disable bidding on finished auctions
-    } else if (endTimes[i] - nowTime < 0) {
+    } else if (auctions[i].endTime - nowTime < 0) {
       timer.innerHTML = "Auction Complete";
       document.getElementById("bid-button-" + i).setAttribute('disabled', '')
     } else {
-      timer.innerHTML = timeBetween(nowTime, endTimes[i]);
+      timer.innerHTML = timeBetween(nowTime, auctions[i].endTime);
     }
   }
   setTimeout(setClocks, 1000);
@@ -114,7 +100,7 @@ function placeBid() {
   // Cleanse input
   let amountElement = document.getElementById("amount-input")
   let amount = Number(amountElement.value)
-  if (endTimes[i] - nowTime < 0) {
+  if (auctions[i].endTime - nowTime < 0) {
     feedback.innerText = "The auction is already over!"
     amountElement.classList.add("is-invalid")
     setTimeout(() => {
@@ -138,23 +124,23 @@ function placeBid() {
     let user = auth.currentUser;
     let itemId = i.toString().padStart(5, "0")
     // Documents to check and write to
-    let liveRef = db.collection("auction-live").doc("items")
-    let storeRef = db.collection("auction-store").doc(itemId)
+    const liveRef = doc(db, "auction-live", "items");
+    const storeRef = doc(db, "auction-store", itemId);
     // Check live document
-    liveRef.get().then(function (doc) {
+    getDoc(liveRef).then(function (doc) {
       console.log("Database read from placeBid()")
       let thisItem = doc.data()[itemId];
       let bids = (Object.keys(thisItem).length - 1) / 2
       let currentBid = thisItem["bid" + bids]
       if (amount >= 1 + currentBid) {
-        keyStem = itemId + ".bid" + (bids + 1)
-        liveRef.update({
+        let keyStem = itemId + ".bid" + (bids + 1)
+        updateDoc(liveRef, {
           [keyStem + "-uid"]: user.uid,
           [keyStem]: amount,
         })
         console.log("Database write from placeBid()")
-        storeKey = "bid" + (bids + 1)
-        storeRef.update({
+        let storeKey = "bid" + (bids + 1)
+        updateDoc(storeRef, {
           [storeKey]: {
             "bidder-username": user.displayName,
             "bidder-uid": user.uid,
@@ -179,25 +165,24 @@ function placeBid() {
   }
 }
 
-function argsort(array) {
+function argsort(array, key) {
   const arrayObject = array.map((value, idx) => { return { value, idx }; });
-  arrayObject.sort((a, b) => (a.value - b.value))
-  return arrayObject.map(data => data.idx);;
+  return arrayObject.sort((a, b) => (a.value[key] - b.value[key]));
 }
 
-function generateAuctionCard(i) {
+function generateAuctionCard(auction) {
   // create auction card
   let col = document.createElement("div");
   col.classList.add("col");
 
   let card = document.createElement("div");
   card.classList.add("card");
-  card.id = "auction-" + i
+  card.id = "auction-" + auction.idx
   col.appendChild(card);
 
   let image = document.createElement("img");
   image.classList.add("card-img-top");
-  image.src = primaryImages[i];
+  image.src = auction.value.primaryImage;
   card.appendChild(image);
 
   let body = document.createElement("div");
@@ -206,12 +191,12 @@ function generateAuctionCard(i) {
 
   let title = document.createElement("h5");
   title.classList.add("title");
-  title.innerText = titles[i];
+  title.innerText = auction.value.title;
   body.appendChild(title);
 
   let subtitle = document.createElement("p");
   subtitle.classList.add("card-subtitle");
-  subtitle.innerText = subtitles[i];
+  subtitle.innerText = auction.value.subtitle;
   body.appendChild(subtitle);
 
   // Auction status
@@ -232,7 +217,7 @@ function generateAuctionCard(i) {
 
   let bid = document.createElement("td");
   bid.innerHTML = "£-.-- [- bids]"
-  bid.id = "current-bid-" + i
+  bid.id = "current-bid-" + auction.idx
   bidRow.appendChild(bid);
 
   let timeRow = document.createElement("tr");
@@ -244,7 +229,7 @@ function generateAuctionCard(i) {
   timeRow.appendChild(timeTitle);
 
   let time = document.createElement("td");
-  time.id = "time-left-" + i
+  time.id = "time-left-" + auction.idx
   timeRow.appendChild(time);
 
   // Auction actions
@@ -258,7 +243,7 @@ function generateAuctionCard(i) {
   infoButton.classList.add("btn", "btn-secondary")
   infoButton.innerText = "Info";
   infoButton.onclick = function () { openInfo(this.id); }
-  infoButton.id = "info-button-" + i
+  infoButton.id = "info-button-" + auction.idx
   buttonGroup.appendChild(infoButton);
 
   let bidButton = document.createElement("button");
@@ -267,18 +252,18 @@ function generateAuctionCard(i) {
   bidButton.classList.add("btn", "btn-primary")
   bidButton.innerText = "Submit bid";
   bidButton.onclick = function () { openBid(this.id); }
-  bidButton.id = "bid-button-" + i
+  bidButton.id = "bid-button-" + auction.idx
   buttonGroup.appendChild(bidButton);
 
   return col
 }
 
-// Generatively populate the websire with auctions
-function populateAuctionGrid() {
-  auctionGrid = document.getElementById("auction-grid");
-  let endingSoonest = argsort(endTimes);
-  endingSoonest.forEach((i) => {
-    auctionCard = generateAuctionCard(i);
+// Generatively populate the website with auctions
+export function populateAuctionGrid() {
+  let auctionGrid = document.getElementById("auction-grid");
+  let auctionsSorted = argsort(auctions, "endTime");
+  auctionsSorted.forEach((auction) => {
+    let auctionCard = generateAuctionCard(auction);
     auctionGrid.appendChild(auctionCard);
   });
   if (demoAuction) { generateRandomAuctions() };
@@ -288,12 +273,12 @@ function numberWithCommas(x) {
   return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
 }
 
-function dataListener() {
+export function dataListener() {
   // Listen for updates in active auctions
-  db.collection("auction-live").doc("items").onSnapshot(function (doc) {
+  onSnapshot(doc(db, "auction-live", "items"), (doc) => {
     console.log("Database read from dataListener()")
     let data = doc.data()
-    for (key in data) {
+    for (let key in data) {
       let cb = document.getElementById("current-bid-" + Number(key))
       let bids = data[key]
       // Extract bid data
@@ -310,11 +295,11 @@ function dataListener() {
 }
 
 function resetLive(i) {
-  let docRef = db.collection("auction-live").doc("items");
+  const docRef = doc(db, "auction-live", "items");
   let itemId = i.toString().padStart(5, "0")
-  docRef.update({
+  updateDoc(docRef, {
     [itemId]: {
-      bid0: startPrices[i]["bid0"]["amount"],
+      bid0: auctions[i].startingPrice,
     }
   })
   console.log("Database write from resetLive()")
@@ -322,31 +307,48 @@ function resetLive(i) {
 
 function resetAllLive() {
   console.log("Resetting live tracker")
-  for (i = 0; i < startingPrices.length; i++) {
+  for (let i = 0; i < auctions.length; i++) {
     resetLive(i);
   }
 }
 
 function resetStore(i) {
   let itemId = i.toString().padStart(5, "0")
-  let docRef = db.collection("auction-store").doc(itemId);
-  docRef.set(startPrices[i])
+  const docRef = doc(db, "auction-store", itemId);
+  setDoc(docRef, {
+    bid0: {
+      bidder: String(i),
+      amount: auctions[i].startingPrice,
+      time: Date().substring(0, 24)
+    }
+  })
   console.log("Database write from resetStore()")
 }
 
 function resetAllStore() {
   console.log("Resetting auction storage")
-  let batch = db.batch();
-  for (i = 0; i < startingPrices.length; i++) {
+  const batch = writeBatch(db);
+  for (let i = 0; i < auctions.length; i++) {
     let itemId = i.toString().padStart(5, "0")
-    let currentItem = db.collection("auction-store").doc(itemId);
-    batch.set(currentItem, startPrices[i])
+    let currentItem = doc(db, "auction-store", itemId);
+    batch.set(currentItem, {
+      bid0: {
+        bidder: String(i),
+        amount: auctions[i].startingPrice,
+        time: Date().substring(0, 24)
+      }
+    })
   }
   batch.commit()
-  console.log(startingPrices.length + " database writes from resetAllStore()")
+  console.log(auctions.length + " database writes from resetAllStore()")
 }
 
 function resetAll() {
   resetAllLive();
   resetAllStore();
 }
+
+window.placeBid = placeBid
+window.resetAll = resetAll
+window.resetAllLive = resetAllLive
+window.resetAllStore = resetAllStore
diff --git a/js/firebase.js b/js/firebase.js
new file mode 100644
index 00000000..70ed5995
--- /dev/null
+++ b/js/firebase.js
@@ -0,0 +1,120 @@
+// Import the functions you need from the SDKs you need
+import { initializeApp } from "https://www.gstatic.com/firebasejs/9.20.0/firebase-app.js";
+import { getAuth } from "https://www.gstatic.com/firebasejs/9.20.0/firebase-auth.js";
+import { getFirestore } from "https://www.gstatic.com/firebasejs/9.20.0/firebase-firestore.js";
+// TODO: Add SDKs for Firebase products that you want to use
+// https://firebase.google.com/docs/web/setup#available-libraries
+
+// Your web app's Firebase configuration
+const firebaseConfig = {
+    apiKey: "AIzaSyCAYOYDuMKGGjTSJL5uDzG5hjQ6y_vYPiI",
+    authDomain: "auction-website-b12fc.firebaseapp.com",
+    databaseURL: "https://auction-website-b12fc.firebaseio.com",
+    projectId: "auction-website-b12fc",
+    storageBucket: "auction-website-b12fc.appspot.com",
+    messagingSenderId: "791747024664",
+    appId: "1:791747024664:web:215a222a81c6d0c2aeb06d"
+};
+// Initialize Firebase
+const app = initializeApp(firebaseConfig);
+export const db = getFirestore(app);
+export const auth = getAuth(app);
+
+export const auctions = [
+    {
+        primaryImage: "",
+        title: "",
+        subtitle: "",
+        detail: "",
+        secondaryImage: "",
+        startingPrice: 55,
+        endTime: 0
+    }, {
+        primaryImage: "",
+        title: "",
+        subtitle: "",
+        detail: "",
+        secondaryImage: "",
+        startingPrice: 60,
+        endTime: 0
+    }, {
+        primaryImage: "",
+        title: "",
+        subtitle: "",
+        detail: "",
+        secondaryImage: "",
+        startingPrice: 20,
+        endTime: 0
+    }, {
+        rimaryImage: "",
+        title: "",
+        subtitle: "",
+        detail: "",
+        secondaryImage: "",
+        startingPrice: 0,
+        endTime: 0
+    }, {
+        primaryImage: "",
+        title: "",
+        subtitle: "",
+        detail: "",
+        secondaryImage: "",
+        startingPrice: 4,
+        endTime: 0
+    }, {
+        primaryImage: "",
+        title: "",
+        subtitle: "",
+        detail: "",
+        secondaryImage: "",
+        startingPrice: 0,
+        endTime: 0
+    }, {
+        primaryImage: "",
+        title: "",
+        subtitle: "",
+        detail: "",
+        secondaryImage: "",
+        startingPrice: 99,
+        endTime: 0
+    }, {
+        primaryImage: "",
+        title: "",
+        subtitle: "",
+        detail: "",
+        secondaryImage: "",
+        startingPrice: 0,
+        endTime: 0
+    }, {
+        primaryImage: "",
+        title: "",
+        subtitle: "",
+        detail: "",
+        secondaryImage: "",
+        startingPrice: 12,
+        endTime: 0
+    }, {
+        primaryImage: "",
+        title: "",
+        subtitle: "",
+        detail: "",
+        secondaryImage: "",
+        startingPrice: 6,
+        endTime: 0
+    }, {
+        primaryImage: "",
+        title: "",
+        subtitle: "",
+        detail: "",
+        secondaryImage: "",
+        startingPrice: 3,
+        endTime: 0
+    }, {
+        primaryImage: "",
+        title: "",
+        subtitle: "",
+        detail: "",
+        secondaryImage: "",
+        startingPrice: 7,
+        endTime: 0
+    }]
\ No newline at end of file
diff --git a/js/popups.js b/js/popups.js
index 9c398f76..29805557 100644
--- a/js/popups.js
+++ b/js/popups.js
@@ -1,12 +1,16 @@
-loginModal = new bootstrap.Modal(document.getElementById('login-modal'))
-infoModal = new bootstrap.Modal(document.getElementById('info-modal'))
-bidModal = new bootstrap.Modal(document.getElementById('bid-modal'))
+// Imports
+import { auth, db, auctions } from "./firebase.js";
+import { doc, setDoc } from "https://www.gstatic.com/firebasejs/9.20.0/firebase-firestore.js";
+
+const loginModal = new bootstrap.Modal(document.getElementById('login-modal'))
+const infoModal = new bootstrap.Modal(document.getElementById('info-modal'))
+export const bidModal = new bootstrap.Modal(document.getElementById('bid-modal'))
 
 function openInfo(id) {
   let i = id.match("[0-9]+");
-  document.getElementById('info-modal-title').innerText = titles[i]
-  document.getElementById('info-modal-desc').innerHTML = details[i]
-  document.getElementById('info-modal-img').src = secondaryImages[i];
+  document.getElementById('info-modal-title').innerText = auctions[i].title
+  document.getElementById('info-modal-desc').innerHTML = auctions[i].detail
+  document.getElementById('info-modal-img').src = auctions[i].secondaryImage;
   document.querySelector("#info-modal > div > div > div.modal-footer > button.btn.btn-primary").id = "info-modal-submit-bid-btn-" + i
   infoModal.show()
 }
@@ -15,9 +19,9 @@ function openBid(id) {
   let i = id.match('[0-9]+');
   document.getElementById("amount-input").value = ""
   document.getElementById("amount-input").classList.remove("is-invalid")
-  document.getElementById('bid-modal-subtitle').innerText = titles[i]
+  document.getElementById('bid-modal-subtitle').innerText = auctions[i].title
   document.querySelector("#bid-modal > div > div > div.modal-footer > button.btn.btn-primary").id = "bid-modal-submit-bid-btn-" + i
-  loggedIn = auth.currentUser && auth.currentUser.displayName
+  let loggedIn = auth.currentUser && auth.currentUser.displayName
   if (loggedIn) {
     bidModal.show()
     document.getElementById("amount-input").focus()
@@ -27,23 +31,23 @@ function openBid(id) {
 }
 
 function openLogin() {
-  loggedIn = auth.currentUser && auth.currentUser.displayName
+  let loggedIn = auth.currentUser && auth.currentUser.displayName
   if (!loggedIn) { loginModal.show(); document.getElementById('username-input').focus() }
 }
 
 function newUserLogin() {
-  loggedIn = auth.currentUser && auth.currentUser.displayName
+  let loggedIn = auth.currentUser && auth.currentUser.displayName
   if (!loggedIn) {
     let username = document.getElementById('username-input').value
     let user = auth.currentUser;
     user.updateProfile({ displayName: username })
-    db.collection("users").doc(user.uid).set({ name: username, admin: false })
+    setDoc(doc(db, "users", user.uid), { name: username, admin: false })
     loginModal.hide()
     replaceSignupButton(username)
   }
 }
 
-function autoLogin() {
+export function autoLogin() {
   auth.onAuthStateChanged(function (user) {
     if (user && user.displayName != null) {
       replaceSignupButton(user.displayName)
@@ -57,3 +61,8 @@ function replaceSignupButton(name) {
   document.getElementById('signup-button').style.display = "none"
   document.getElementById('username-display').innerText = "Hi " + name
 }
+
+window.openLogin = openLogin
+window.newUserLogin = newUserLogin
+window.openBid = openBid
+window.openInfo = openInfo