Set up change dictionary

src/js/account/dictionaryManagement.js

@@ -1,25 +1,27 @@
-import { saveEditModal } from "../dictionaryManagement";
-import { syncDetails } from "./sync";
+import { performSync } from "./sync";
+import { request } from "./helpers";
+import { saveToken } from "./utilities";
 import { addMessage } from "../utilities";
 
-export function saveEditModalAndSync() {
-  saveEditModal();
-  
-  return syncDetails().then(successful => {
-    if (successful) {
-      addMessage('Synced Successfully');
-    } else {
-      addMessage('Could Not Sync');
-    }
-  })
-  .catch(err => {
-    console.error(err);
-    addMessage('Could not connect');
-  });
+export function changeDictionary(dictionary) {
+  dictionary = typeof dictionary.target !== 'undefined' ? dictionary.target.value : dictionary;
+  if (dictionary !== window.currentDictionary.externalID) {
+    request({
+      action: 'change-dictionary',
+      dictionary,
+    }, successData => {
+      saveToken(successData.token);
+      performSync(successData.dictionary);
+      document.getElementById('settingsModal').style.display = 'none';
+    }, error => {
+      console.error(error);
+      addMessage(error, undefined, 'error');
+    });
+  }
 }
 
-export function saveAndCloseEditModalAndSync() {
-  saveEditModalAndSync().then(() => {
-    document.getElementById('editModal').style.display = 'none';
-  });
-}
+export function updateCurrentChangeDictionaryOption() {
+  const label = window.currentDictionary.name + ' ' + window.currentDictionary.specification;
+  document.getElementById('accountSettingsChangeDictionary')
+    .querySelector(`option[value=${window.currentDictionary.externalID}]`).innerText = label;
+}

src/js/account/index.js

@@ -10,6 +10,7 @@ import {
 } from './sync';
 import { saveDeletedWordLocally } from './utilities';
 import { addMessage } from '../utilities';
+import { updateCurrentChangeDictionaryOption } from './dictionaryManagement';
 
 export function showLoginForm() {
   renderLoginForm();
@@ -56,4 +57,8 @@ export function deleteWord(wordId) {
       deleteWord(wordId);
     }, 10000);
   });
+}
+
+export function updateChangeDictionaryOption() {
+  updateCurrentChangeDictionaryOption();
 }

src/js/account/render.js

@@ -1,4 +1,5 @@
-import { setupLoginModal } from "./setupListeners";
+import { setupLoginModal, setupChangeDictionary } from "./setupListeners";
+import { request } from "./helpers";
 
 export function renderLoginForm() {
   const loginModal = document.createElement('section');
@@ -55,9 +56,9 @@ export function renderLoginForm() {
 export function renderAccountSettings() {
   const accountSettingsColumn = document.getElementById('accountSettings');
   const accountSettingsHTML = `<h3>Account Settings</h3>
-  <label>Email Address<br><input id="accountSettingsEmail" required maxlength="100"></label>
-  <label>Public Name<br><input id="accountSettingsPublicName" placeholder="Someone" maxlength="50"></label>
-  <label>Allow Emails <input type="checkbox" id="accountSettingsAllowEmails"></label>
+  <label>Email Address<br><input id="accountSettingsEmail" required maxlength="100" value="${window.account.email}"></label>
+  <label>Public Name<br><input id="accountSettingsPublicName" placeholder="Someone" maxlength="50" value="${window.account.publicName}"></label>
+  <label>Allow Emails <input type="checkbox" id="accountSettingsAllowEmails"${window.account.allowEmails ? ' checked' : ''}></label>
   <label>Change Dictionary<br><select id="accountSettingsChangeDictionary"></select></label>
   <h4>Request Your Data</h4>
   <p>
@@ -73,4 +74,18 @@ export function renderAccountSettings() {
   </p>
   `;
   accountSettingsColumn.innerHTML = accountSettingsHTML;
+
+  renderChangeDictionaryOptions();
+}
+
+export function renderChangeDictionaryOptions() {
+  request({
+    action: 'get-all-dictionary-names',
+  }, dictionaries => {
+    const changeDictionarySelect = document.getElementById('accountSettingsChangeDictionary');
+    const optionsHTML = dictionaries.map(dictionary => `<option value="${dictionary.id}">${dictionary.name}</option>`).join('');
+    changeDictionarySelect.innerHTML = optionsHTML;
+    changeDictionarySelect.value = window.currentDictionary.externalID;
+    setupChangeDictionary();
+  }, error => console.error(error));
 }

src/js/account/setupListeners.js

@@ -1,5 +1,6 @@
 import { logIn, createAccount } from "./login";
 import { setCookie } from "../StackOverflow/cookie";
+import { changeDictionary } from "./dictionaryManagement";
 
 export function setupLoginModal(modal) {
   const closeElements = modal.querySelectorAll('.modal-background, .close-button');
@@ -19,3 +20,7 @@ export function setupLogoutButton(logoutButton) {
     window.location.reload();
   });
 }
+
+export function setupChangeDictionary() {
+  document.getElementById('accountSettingsChangeDictionary').addEventListener('change', changeDictionary);
+}

src/js/account/sync.js

@@ -5,6 +5,7 @@ import { saveToken } from "./utilities";
 import { renderAll } from "../render";
 import { sortWords } from "../wordManagement";
 import { getLocalDeletedWords, clearLocalDeletedWords, saveDeletedWordsLocally } from "./utilities";
+import { renderChangeDictionaryOptions } from "./render";
 
 /* Outline for syncing
 login
@@ -41,36 +42,39 @@ export function syncDictionary() {
     request({
       action: 'get-current-dictionary',
     }, remote => {
-      // console.log(remote);
-      if (remote.details.externalID !== window.currentDictionary.externalID) {
-        clearDictionary();
-      }
-      const detailsSynced = syncDetails(remote.details);
-      
-      if (detailsSynced === false) {
-        addMessage('Could not sync', 10000, 'error');
-      } else {
-        detailsSynced.then(success => {
-          renderAll();
-          if (success) {
-            syncWords(remote.words, remote.deletedWords).then(success => {
-              if (success) {
-                renderAll();
-              } else {
-                console.error('word sync failed');
-              }
-            });
-          } else {
-            console.error('details sync failed');
-          }
-        });
-      }
+      performSync(remote);
     }, error => {
       console.error(error);
     }).catch(err => console.error(err));
   }
 }
 
+export function performSync(remoteDictionary) {
+  if (remoteDictionary.details.externalID !== window.currentDictionary.externalID) {
+    clearDictionary();
+  }
+  const detailsSynced = syncDetails(remoteDictionary.details);
+
+  if (detailsSynced === false) {
+    addMessage('Could not sync', 10000, 'error');
+  } else {
+    detailsSynced.then(success => {
+      renderAll();
+      if (success) {
+        syncWords(remoteDictionary.words, remoteDictionary.deletedWords).then(success => {
+          if (success) {
+            renderAll();
+          } else {
+            console.error('word sync failed');
+          }
+        });
+      } else {
+        console.error('details sync failed');
+      }
+    });
+  }
+}
+
 export function uploadWholeDictionary(asNew = false) {
   let promise;
   if (asNew) {
@@ -97,6 +101,7 @@ export function uploadWholeDictionary(asNew = false) {
       window.currentDictionary.externalID = remoteId;
       saveDictionary(false);
       addMessage('Dictionary Uploaded Successfully');
+      renderChangeDictionaryOptions();
     }, errorData => {
       console.error(errorData);
       addMessage(errorData, 10000, 'error');

src/js/dictionaryManagement.js

@@ -72,6 +72,7 @@ export function saveEditModal() {
   if (hasToken()) {
     import('./account/index.js').then(account => {
       account.uploadDetailsDirect();
+      account.updateChangeDictionaryOption();
     })
   }
 }

src/php/api/User.php

@@ -149,9 +149,10 @@ VALUES (?, ?, ?, ?, ?)';
       if ($dictionary_id !== false) {
         $changed_dictionary = $this->dictionary->changeCurrent($id, $dictionary_id);
         if ($changed_dictionary !== false) {
+          $new_token = $this->generateUserToken($id, $changed_dictionary);
           return array(
-            'token' => $this->generateUserToken($id, $changed_dictionary),
-            'dictionary' => $this->getCurrentDictionary($token),
+            'token' => $new_token,
+            'dictionary' => $this->getCurrentDictionary($new_token),
           );
         }
       }

src/php/api/index.php

@@ -183,12 +183,12 @@ switch ($action) {
         ), 200);
       }
       return Response::json(array(
-        'data' => 'Could not create dictionary: incorrect data',
+        'data' => 'Could not change dictionary: incorrect data',
         'error' => true,
       ), 401);
     }
     return Response::json(array(
-      'data' => 'Could not create dictionary: no token provided',
+      'data' => 'Could not change dictionary: no token provided',
       'error' => true,
     ), 400);
   }