fixed navbar logout
This commit is contained in:
parent
0e8a45bdfc
commit
7979aabf85
7 changed files with 46 additions and 44 deletions
|
@ -109,8 +109,20 @@ function checkCookie() {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function clearCookies() {
|
function clearCookie(name) {
|
||||||
|
document.cookie = `${name}=; expires=Thu, 01-Jan-1970 00:00:01 GMT;`;
|
||||||
|
}
|
||||||
|
|
||||||
|
function setUserCookies(channelName, channelClaimId, shortChannelId) {
|
||||||
|
setCookie('channel_name', channelName)
|
||||||
|
setCookie('channel_claim_id', channelClaimId);
|
||||||
|
setCookie('short_channel_id', shortChannelId);
|
||||||
|
}
|
||||||
|
|
||||||
|
function clearUserCookies() {
|
||||||
|
clearCookie('channel_name')
|
||||||
|
clearCookie('channel_claim_id');
|
||||||
|
clearCookie('short_channel_id');
|
||||||
}
|
}
|
||||||
|
|
||||||
function copyToClipboard(event){
|
function copyToClipboard(event){
|
||||||
|
|
|
@ -1,10 +1,3 @@
|
||||||
|
|
||||||
function setUserCookies(channelName, channelClaimId, shortChannelId) {
|
|
||||||
setCookie('channel_name', channelName)
|
|
||||||
setCookie('channel_claim_id', channelClaimId);
|
|
||||||
setCookie('short_channel_id', shortChannelId);
|
|
||||||
}
|
|
||||||
|
|
||||||
function replaceChannelOptionInPublishChannelSelect() {
|
function replaceChannelOptionInPublishChannelSelect() {
|
||||||
// remove the old channel option
|
// remove the old channel option
|
||||||
const oldChannel = document.getElementById('publish-channel-select-channel-option')
|
const oldChannel = document.getElementById('publish-channel-select-channel-option')
|
||||||
|
@ -42,13 +35,16 @@ function replaceChannelOptionInNavBarChannelSelect () {
|
||||||
newChannelOption.innerText = loggedInChannel;
|
newChannelOption.innerText = loggedInChannel;
|
||||||
// add the new option
|
// add the new option
|
||||||
const channelSelect = document.getElementById('nav-bar-channel-select');
|
const channelSelect = document.getElementById('nav-bar-channel-select');
|
||||||
|
channelSelect.style.display = 'inline-block';
|
||||||
channelSelect.insertBefore(newChannelOption, channelSelect.firstChild);
|
channelSelect.insertBefore(newChannelOption, channelSelect.firstChild);
|
||||||
|
// hide login
|
||||||
|
const navBarLoginLink = document.getElementById('nav-bar-login-link');
|
||||||
|
navBarLoginLink.style.display = 'none';
|
||||||
}
|
}
|
||||||
|
|
||||||
function loginToChannel (event) {
|
function loginToChannel (event) {
|
||||||
const userName = document.getElementById('channel-login-name-input').value;
|
const userName = document.getElementById('channel-login-name-input').value;
|
||||||
const password = document.getElementById('channel-login-password-input').value;
|
const password = document.getElementById('channel-login-password-input').value;
|
||||||
const loginErrorDisplayElement = document.getElementById('login-error-display-element');
|
|
||||||
// prevent default
|
// prevent default
|
||||||
event.preventDefault()
|
event.preventDefault()
|
||||||
// send request
|
// send request
|
||||||
|
@ -59,15 +55,15 @@ function loginToChannel (event) {
|
||||||
return result;
|
return result;
|
||||||
})
|
})
|
||||||
// update channel selection
|
// update channel selection
|
||||||
.then(result => {
|
.then(() => {
|
||||||
// remove old channel and replace with new one & select it
|
// remove old channel and replace with new one & select it
|
||||||
replaceChannelOptionInPublishChannelSelect();
|
replaceChannelOptionInPublishChannelSelect();
|
||||||
// remove old channel and replace with new one & select it
|
// remove old channel and replace with new one & select it
|
||||||
replaceChannelOptionInNavBarChannelSelect();
|
replaceChannelOptionInNavBarChannelSelect();
|
||||||
})
|
})
|
||||||
.catch(error => {
|
.catch(error => {
|
||||||
|
const loginErrorDisplayElement = document.getElementById('login-error-display-element');
|
||||||
showError(loginErrorDisplayElement, error);
|
showError(loginErrorDisplayElement, error);
|
||||||
console.log('login failure:', error);
|
console.log('login failure:', error);
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
17
public/assets/js/navBarFunctions.js
Normal file
17
public/assets/js/navBarFunctions.js
Normal file
|
@ -0,0 +1,17 @@
|
||||||
|
function toggleNavBarSelection (value) {
|
||||||
|
const selectedOption = value;
|
||||||
|
if (selectedOption === 'LOGOUT') {
|
||||||
|
console.log('log out');
|
||||||
|
// remove session cookies
|
||||||
|
clearUserCookies();
|
||||||
|
// send logout request to server
|
||||||
|
window.location.href = '/logout';
|
||||||
|
} else if (selectedOption === 'VIEW') {
|
||||||
|
console.log('view channel');
|
||||||
|
// get channel info
|
||||||
|
const channelName = getCookie('channel_name');
|
||||||
|
const channelClaimId = getCookie('channel_claim_id');
|
||||||
|
// redirect to channel page
|
||||||
|
window.location.href = `/${channelName}:${channelClaimId}`;
|
||||||
|
}
|
||||||
|
}
|
|
@ -56,7 +56,7 @@ function previewAndStageFile(selectedFile){
|
||||||
stagedFiles = [selectedFile];
|
stagedFiles = [selectedFile];
|
||||||
}
|
}
|
||||||
|
|
||||||
// Validate the publish submission and then trigger publishing.
|
// Validate the publish submission and then trigger upload
|
||||||
function publishStagedFile(event) {
|
function publishStagedFile(event) {
|
||||||
// prevent default so this script can handle submission
|
// prevent default so this script can handle submission
|
||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
|
|
|
@ -25,6 +25,7 @@
|
||||||
<script src="/assets/js/publishFileFunctions.js"></script>
|
<script src="/assets/js/publishFileFunctions.js"></script>
|
||||||
<script src="/assets/js/authFunctions.js"></script>
|
<script src="/assets/js/authFunctions.js"></script>
|
||||||
<script src="/assets/js/loginFunctions.js"></script>
|
<script src="/assets/js/loginFunctions.js"></script>
|
||||||
|
<script src="/assets/js/navBarFunctions.js"></script>
|
||||||
{{{ body }}}
|
{{{ body }}}
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
|
@ -21,6 +21,7 @@
|
||||||
<script src="/assets/js/validationFunctions.js"></script>
|
<script src="/assets/js/validationFunctions.js"></script>
|
||||||
<script src="/assets/js/authFunctions.js"></script>
|
<script src="/assets/js/authFunctions.js"></script>
|
||||||
<script src="/assets/js/loginFunctions.js"></script>
|
<script src="/assets/js/loginFunctions.js"></script>
|
||||||
|
<script src="/assets/js/navBarFunctions.js"></script>
|
||||||
{{{ body }}}
|
{{{ body }}}
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
@ -6,37 +6,12 @@
|
||||||
<a class="nav-bar-link" href="/">Upload</a>
|
<a class="nav-bar-link" href="/">Upload</a>
|
||||||
<a class="nav-bar-link" href="/popular">Popular</a>
|
<a class="nav-bar-link" href="/popular">Popular</a>
|
||||||
<a class="nav-bar-link" href="/about">About</a>
|
<a class="nav-bar-link" href="/about">About</a>
|
||||||
{{#if user}}
|
<select type="text" id="nav-bar-channel-select" class="select select--no-arrow nav-bar-link" onchange="toggleNavBarSelection(event.target.selectedOptions[0].value)" {{#unless user}}style="display:none"{{/unless}}>
|
||||||
<select type="text" id="nav-bar-channel-select" class="select select--no-arrow nav-bar-link" onchange="toggleLogin(event.target.selectedOptions[0].value)">
|
<option id="nav-bar-channel-select-channel-option">@{{user.userName}}</option>
|
||||||
<option id="nav-bar-channel-select-channel-option">@{{user.userName}}</option>
|
<option value="VIEW">View</option>
|
||||||
<option value="VIEW">View</option>
|
<option value="LOGOUT">Logout</option>
|
||||||
<option value="LOGOUT">Logout</option>
|
</select>
|
||||||
</select>
|
<a id="nav-bar-login-link" class="nav-bar-link" href="/login" {{#if user}}style="display:none"{{/if}}>Channel</a>
|
||||||
{{else}}
|
|
||||||
<a class="nav-bar-link" href="/login">Login</a>
|
|
||||||
{{/if}}
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<script type="text/javascript">
|
|
||||||
function toggleLogin (value) {
|
|
||||||
const selectedOption = value;
|
|
||||||
if (selectedOption === 'LOGOUT') {
|
|
||||||
console.log('log out');
|
|
||||||
// remove session cookies
|
|
||||||
clearCookies();
|
|
||||||
// send logout request to server
|
|
||||||
window.location.href = '/logout';
|
|
||||||
} else if (selectedOption === 'VIEW') {
|
|
||||||
console.log('view channel');
|
|
||||||
// get channel info
|
|
||||||
const channelName = getCookie('channel_name');
|
|
||||||
const channelClaimId = getCookie('channel_claim_id');
|
|
||||||
// redirect to channel page
|
|
||||||
window.location.href = `/${channelName}:${channelClaimId}`;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
|
Loading…
Reference in a new issue