Add prominent share links if logged in or viewing

This commit is contained in:
Robbie Antenesse 2019-05-30 14:01:34 -06:00 committed by Robbie Antenesse
parent e9cf9653be
commit ce143be3f5
4 changed files with 30 additions and 3 deletions

View File

@ -36,7 +36,21 @@ export function renderDictionaryDetails() {
export function renderName() {
const dictionaryName = removeTags(window.currentDictionary.name) + ' ' + removeTags(window.currentDictionary.specification);
document.getElementById('dictionaryName').innerHTML = dictionaryName;
const name = document.getElementById('dictionaryName');
name.innerHTML = dictionaryName;
const isPublic = hasToken() && window.currentDictionary.settings.isPublic;
if (isPublic && !document.getElementById('dictionaryShare')) {
const shareLink = document.createElement('a');
shareLink.id = 'dictionaryShare';
shareLink.classList.add('button');
shareLink.style.float = 'right';
shareLink.href = window.location.pathname.match(new RegExp(window.currentDictionary.externalID + '$')) ? window.location.pathname
: window.location.pathname.substring(0, window.location.pathname.indexOf(window.currentDictionary.externalID)) + window.currentDictionary.externalID;
shareLink.target = '_blank';
shareLink.title = 'Public Link to Dictionary';
shareLink.innerHTML = '➦';
name.parentElement.insertBefore(shareLink, name);
}
}
export function renderDescription() {
@ -179,10 +193,10 @@ export function renderWords() {
<h4 class="word">${word.name}${homonymnNumber > 0 ? ' <sub>' + homonymnNumber.toString() + '</sub>' : ''}</h4>
<span class="pronunciation">${word.pronunciation}</span>
<span class="part-of-speech">${word.partOfSpeech}</span>
${isPublic ? `<a class="small button share-link" href="${shareLink}" target="_blank" title="Public Link to Word">&#10150;</a>` : ''}
<span class="small button word-option-button">Options</span>
<div class="word-option-list" style="display:none;">
<div class="word-option" id="edit_${word.wordId}">Edit</div>
${isPublic ? `<a class="word-option" href="${shareLink}" target="_blank">Share</a>` : ''}
<div class="word-option" id="delete_${word.wordId}">Delete</div>
</div>
</header>

View File

@ -26,6 +26,9 @@ export function renderDictionaryDetails() {
export function renderName() {
const dictionaryName = removeTags(window.currentDictionary.name) + ' ' + removeTags(window.currentDictionary.specification);
document.getElementById('dictionaryName').innerHTML = dictionaryName;
const shareLink = window.location.pathname.match(new RegExp(window.currentDictionary.externalID + '$')) ? window.location.pathname
: window.location.pathname.substring(0, window.location.pathname.indexOf(window.currentDictionary.externalID)) + window.currentDictionary.externalID;
document.getElementById('dictionaryShare').href = shareLink;
}
export function renderDescription() {
@ -145,11 +148,13 @@ export function renderWords() {
details: detailsMarkdown,
wordId: originalWord.wordId,
});
const shareLink = window.location.pathname + (window.location.pathname.match(new RegExp(word.wordId + '$')) ? '' : '/' + word.wordId);
wordsHTML += `<article class="entry" id="${word.wordId}">
<header>
<h4 class="word">${word.name}</h4>
<span class="pronunciation">${word.pronunciation}</span>
<span class="part-of-speech">${word.partOfSpeech}</span>
<a href="${shareLink}" target="_blank" class="small button word-option-button" title="Link to Word">&#10150;</a>
</header>
<dl>
<dt class="definition">${word.definition}</dt>

View File

@ -14,3 +14,9 @@
}
}
}
.share-link {
margin-left: $general-padding !important;
line-height: 16px !important;
padding: 1px 3px 3px !important;
}

View File

@ -109,7 +109,9 @@
<section id="mainColumn">
<section id="detailsSection">
<h2 id="dictionaryName">Dictionary Name</h2>
<a id="dictionaryShare" href="./" class="button" title="Link to Dictionary" style="float:right;">&#10150;</a>
<h2 id="dictionaryName">{{dict_name}}</h2>
<h4>Created by {{public_name}}</h4>
<nav>
<ul>
<li>Description</li><li>Details</li><li>Stats</li><!-- li id="editDictionaryButton">Edit</li -->