From d2f1ee9d70759452a61a09c5bf2b3ae878406db8 Mon Sep 17 00:00:00 2001
From: Khansa Kiasatina <kiasatina.k@gmail.com>
Date: Sat, 7 Mar 2020 11:15:01 -0500
Subject: [PATCH] change to only add if editing existing container, add initial
 logic for adding

---
 src/js/popup.js | 59 +++++++++++++++++++++++++++++++++++++++++++++++++
 src/popup.html  |  4 ++--
 2 files changed, 61 insertions(+), 2 deletions(-)

diff --git a/src/js/popup.js b/src/js/popup.js
index ec53006..2fd5559 100644
--- a/src/js/popup.js
+++ b/src/js/popup.js
@@ -1818,6 +1818,12 @@ Logic.registerPanel(P_CONTAINER_EDIT, {
     Utils.addEnterHandler(document.querySelector("#create-container-ok-link"), () => {
       this._submitForm();
     });
+
+    // Add new site to current container
+    const siteLink = document.querySelector("#edit-container-site-link");
+    Logic.addEnterHandler(siteLink, () => {
+      this._addSite();
+    });
   },
 
   async _submitForm() {
@@ -1860,6 +1866,57 @@ Logic.registerPanel(P_CONTAINER_EDIT, {
     return editedIdentity;
   },
 
+  async _addSite() {
+    const formValues = new FormData(this._editForm);
+    console.log(formValues.get("container-id"));
+    console.log(formValues.get("site-name"));
+  },
+
+  showAssignedContainers(assignments) {
+    const assignmentPanel = document.getElementById("edit-sites-assigned");
+    const assignmentKeys = Object.keys(assignments);
+    assignmentPanel.hidden = !(assignmentKeys.length > 0);
+    if (assignments) {
+      const tableElement = assignmentPanel.querySelector(".assigned-sites-list");
+      /* Remove previous assignment list,
+         after removing one we rerender the list */
+      while (tableElement.firstChild) {
+        tableElement.firstChild.remove();
+      }
+
+      assignmentKeys.forEach((siteKey) => {
+        const site = assignments[siteKey];
+        const trElement = document.createElement("div");
+        /* As we don't have the full or correct path the best we can assume is the path is HTTPS and then replace with a broken icon later if it doesn't load.
+           This is pending a better solution for favicons from web extensions */
+        const assumedUrl = `https://${site.hostname}/favicon.ico`;
+        trElement.innerHTML = escaped`
+        <div class="favicon"></div>
+        <div title="${site.hostname}" class="truncate-text hostname">
+          ${site.hostname}
+        </div>
+        <img
+          class="pop-button-image delete-assignment"
+          src="/img/container-delete.svg"
+        />`;
+        trElement.getElementsByClassName("favicon")[0].appendChild(Utils.createFavIconElement(assumedUrl));
+        const deleteButton = trElement.querySelector(".delete-assignment");
+        const that = this;
+        Logic.addEnterHandler(deleteButton, async () => {
+          const userContextId = Logic.currentUserContextId();
+          // Lets show the message to the current tab
+          // TODO remove then when firefox supports arrow fn async
+          const currentTab = await Logic.currentTab();
+          Logic.setOrRemoveAssignment(currentTab.id, assumedUrl, userContextId, true);
+          delete assignments[siteKey];
+          that.showAssignedContainers(assignments);
+        });
+        trElement.classList.add("container-info-tab-row", "clickable");
+        tableElement.appendChild(trElement);
+      });
+    }
+  },
+
   initializeRadioButtons() {
     const colorRadioTemplate = (containerColor) => {
       return Utils.escaped`<input type="radio" value="${containerColor}" name="container-color" id="edit-container-panel-choose-color-${containerColor}" />
@@ -1910,6 +1967,8 @@ Logic.registerPanel(P_CONTAINER_EDIT, {
     Utils.addEnterHandler(document.querySelector("#manage-assigned-sites-list"), () => {
       Logic.showPanel(P_CONTAINER_ASSIGNMENTS, this.getEditInProgressIdentity(), false, false);
     });
+    // Only show ability to add site if it's an existing container
+    document.querySelector("#edit-container-panel-add-site").hidden = !userContextId;
 
     document.querySelector("#edit-container-panel-name-input").value = identity.name || "";
     document.querySelector("#edit-container-panel-usercontext-input").value = userContextId || NEW_CONTAINER_ID;
diff --git a/src/popup.html b/src/popup.html
index acfad83..1406e9c 100644
--- a/src/popup.html
+++ b/src/popup.html
@@ -315,8 +315,8 @@
           <input type="text" class="proxies" name="country-code" id="country-code-input" maxlength="5" hidden/>
           <input type="text" class="proxies" name="city-name" id="city-name-input" maxlength="5" hidden/>
         </fieldset>
-        <fieldset id="edit-container-panel-add-site">
-          <legend class="form-header">Add site</legend>
+        <fieldset id="edit-container-panel-add-site" hidden>
+          <legend class="form-header">Assign site</legend>
           <input type="text" name="site-name" id="edit-container-panel-site-input"/>
           <a class="button secondary" id="edit-container-site-link">Add</a>
         </fieldset>