Skip to content

Commit

Permalink
Moving dashboard js function calls to the welcome page inline script (#…
Browse files Browse the repository at this point in the history 
…1064)

* restricting dashstyle function to the home page

* calling the dashboard tab js functions from within the welcome page
exclusively utilizing the rails session to update the dashboard state

* relocating dashboard tab js code to its own file
js linting

* code comments
  • Loading branch information
@JaymeeH
JaymeeH authored Nov 21, 2024
1 parent 477b3ab commit 90ea392
Show file tree
Hide file tree
Showing 3 changed files with 224 additions and 225 deletions.
229 changes: 4 additions & 225 deletions app/javascript/entrypoints/application.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,10 +18,13 @@ import '../channels';
import { setTargetHtml } from './helper';
import { displayMediafluxVersion } from './mediafluxVersion';
import { showCreateScript } from './atermScripts';
import { dashStyle, dashTab } from './dashboardTabs';

window.bootstrap = bootstrap;
window.displayMediafluxVersion = displayMediafluxVersion;
window.showCreateScript = showCreateScript;
window.dashStyle = dashStyle;
window.dashTab = dashTab;

function initDataUsers() {
function counterIncrement(counterId) {
Expand Down Expand Up @@ -151,6 +154,7 @@ function initListContentsModal() {
}
}

// delete these two functions when new dashboard is fully implemented
function showMoreLessContent() {
$('#show-more').on('click', (el) => {
const element = el;
Expand Down Expand Up @@ -240,229 +244,6 @@ function showValidationError() {
});
}

function dashStyle() {
const classic = document.getElementById('dash-classic');
const project = document.getElementById('dash-project');
const activity = document.getElementById('dash-activity');
const admin = document.getElementById('dash-admin');
const session = sessionStorage.getItem('dashtab');
const home = document.getElementById('welcome');

// Check the session to see which tab should start as active be active
if (home) {
switch (session) {
case 'classic':
classic.style.borderBottom = 'solid';
classic.style.borderColor = '#E77500';
classic.classList.add('active');
break;
case 'project':
project.style.borderBottom = 'solid';
project.style.borderColor = '#E77500';
project.classList.add('active');
break;
case 'activity':
activity.style.borderBottom = 'solid';
activity.style.borderColor = '#E77500';
activity.classList.add('active');
break;
case 'admin':
admin.style.borderBottom = 'solid';
admin.style.borderColor = '#E77500';
admin.classList.add('active');
break;
default:
classic.style.borderBottom = 'solid';
classic.style.borderColor = '#E77500';
classic.classList.add('active');
break;
}
}

$('#dash-classic').on('mouseenter', (el) => {
const element = el;
element.preventDefault();
// const tab = document.getElementById('tab-nav');

if (!classic.classList.contains('active')) {
classic.style.borderBottom = 'solid';
classic.style.borderColor = '#121212';
}
});

$('#dash-classic').on('mouseleave', (el) => {
const element = el;
element.preventDefault();
// const tab = document.getElementById('tab-nav');

if (!classic.classList.contains('active')) {
classic.style.border = 'none';
}
});

$('#dash-classic').on('click', (el) => {
const element = el;
element.preventDefault();
// const tab = document.getElementById('tab-nav');
// change background color to red
classic.style.borderBottom = 'solid';
classic.style.borderColor = '#E77500';
classic.classList.add('active');
});

$('#dash-project').on('mouseenter', (el) => {
const element = el;
element.preventDefault();
// const tab = document.getElementById('tab-nav');

if (!project.classList.contains('active')) {
project.style.borderBottom = 'solid';
project.style.borderColor = '#121212';
}
});

$('#dash-project').on('mouseleave', (el) => {
const element = el;
element.preventDefault();
// const tab = document.getElementById('tab-nav');

if (!project.classList.contains('active')) {
project.style.border = 'none';
}
});

$('#dash-project').on('click', (el) => {
const element = el;
element.preventDefault();
// const tab = document.getElementById('tab-nav');
// change background color to red
project.style.borderBottom = 'solid';
project.style.borderColor = '#E77500';
project.classList.add('active');
});

$('#dash-activity').on('mouseenter', (el) => {
const element = el;
element.preventDefault();
// const tab = document.getElementById('tab-nav');

if (!activity.classList.contains('active')) {
activity.style.borderBottom = 'solid';
activity.style.borderColor = '#121212';
}
});

$('#dash-activity').on('mouseleave', (el) => {
const element = el;
element.preventDefault();
// const tab = document.getElementById('tab-nav');

if (!activity.classList.contains('active')) {
activity.style.border = 'none';
}
});

$('#dash-activity').on('click', (el) => {
const element = el;
element.preventDefault();
// const tab = document.getElementById('tab-nav');
// change background color to red
activity.style.borderBottom = 'solid';
activity.style.borderColor = '#E77500';
activity.classList.add('active');
});

$('#dash-admin').on('mouseenter', (el) => {
const element = el;
element.preventDefault();
// const tab = document.getElementById('tab-nav');

if (!admin.classList.contains('active')) {
admin.style.borderBottom = 'solid';
admin.style.borderColor = '#121212';
}
});

$('#dash-admin').on('mouseleave', (el) => {
const element = el;
element.preventDefault();
// const tab = document.getElementById('tab-nav');

if (!admin.classList.contains('active')) {
admin.style.border = 'none';
}
});

$('#dash-admin').on('click', (el) => {
const element = el;
element.preventDefault();
// const tab = document.getElementById('tab-nav');
// change background color to red
admin.style.borderBottom = 'solid';
admin.style.borderColor = '#E77500';
admin.classList.add('active');
});
}

function dashTab() {
const url = window.location.href;
$('#dash-classic').on('click', (inv) => {
const element = inv;
element.preventDefault();
$.ajax({
type: 'POST',
url: `${url}dash_classic`,
data: { dashtab: 'classic' },
success() { // on success..
window.location = url; // update the DIV
sessionStorage.setItem('dashtab', 'classic');
},
});
});

$('#dash-project').on('click', (inv) => {
const element = inv;
element.preventDefault();
$.ajax({
type: 'POST',
url: `${url}dash_project`,
data: { dashtab: 'project' },
success() { // on success..
sessionStorage.setItem('dashtab', 'project');
window.location.reload(); // update the DIV
},
});
});

$('#dash-activity').on('click', (inv) => {
const element = inv;
element.preventDefault();
$.ajax({
type: 'POST',
url: `${url}dash_activity`,
data: { dashtab: 'activity' },
success() { // on success..
sessionStorage.setItem('dashtab', 'activity');
window.location.reload(); // update the DIV
},
});
});

$('#dash-admin').on('click', (inv) => {
const element = inv;
element.preventDefault();
$.ajax({
type: 'POST',
url: `${url}dash_admin`,
data: { dashtab: 'admin' },
success() { // on success..
sessionStorage.setItem('dashtab', 'admin');
window.location.reload(); // update the DIV
},
});
});
}

function initPage() {
$('#test-jquery').click((event) => {
setTargetHtml(event, 'jQuery works!');
Expand All @@ -473,8 +254,6 @@ function initPage() {
showMoreLessSysAdmin();
emulate();
showValidationError();
dashStyle();
dashTab();
}

window.addEventListener('load', () => initPage());
Expand Down
Loading

0 comments on commit 90ea392

Please sign in to comment.