Make public link visible when public; copy on click

This commit is contained in:
Robbie Antenesse 2019-05-28 17:01:29 -06:00
parent 4ad86e31fa
commit 568fab0ac1
2 changed files with 22 additions and 2 deletions

View File

@ -1,4 +1,4 @@
import { setupLoginModal, setupChangeDictionary, setupCreateNewDictionary, setupDeletedDictionaryChangeModal } from "./setupListeners";
import { setupLoginModal, setupChangeDictionary, setupCreateNewDictionary, setupDeletedDictionaryChangeModal, setupMakePublic } from "./setupListeners";
import { request } from "./helpers";
export function renderLoginForm() {
@ -55,12 +55,20 @@ export function renderLoginForm() {
export function renderMakePublic() {
const editSettingsTab = document.getElementById('editSettingsTab');
const { isPublic } = window.currentDictionary.settings;
const editSettingsTabHTML = `<label>Make Public
<input type="checkbox" id="editIsPublic"><br>
<input type="checkbox" id="editIsPublic"${isPublic ? ' checked' : ''}><br>
<small>Checking this box will make this public via a link you can share with others.</small>
</label>
<p id="publicLinkDisplay" style="${!isPublic ? 'display:none;': ''}margin-left:20px;">
<strong>Public Link:</strong><br>
<input readonly id="publicLink" value="${window.location.href + window.currentDictionary.externalID.toString()}">
<a class="small button" id="publicLinkCopy">Copy</a>
</p>
`;
editSettingsTab.innerHTML += editSettingsTabHTML;
setupMakePublic();
}
export function renderAccountSettings() {

View File

@ -1,6 +1,7 @@
import { logIn, createAccount } from "./login";
import { setCookie } from "../StackOverflow/cookie";
import { changeDictionary, createNewDictionary } from "./dictionaryManagement";
import { addMessage } from "../utilities";
export function setupLoginModal(modal) {
const closeElements = modal.querySelectorAll('.modal-background, .close-button');
@ -60,3 +61,14 @@ export function setupDeletedDictionaryChangeModal() {
}
document.getElementById('createNewDictionaryAfterDelete').addEventListener('click', createNewDictionary);
}
export function setupMakePublic() {
document.getElementById('editIsPublic').addEventListener('change', function(event) {
document.getElementById('publicLinkDisplay').style.display = event.target.checked ? '' : 'none';
});
document.getElementById('publicLinkCopy').addEventListener('click', function() {
document.getElementById('publicLink').select();
document.execCommand('copy');
addMessage('Copied public link to clipboard', 3000);
});
}