fipamo/public/assets/scripts/dash/app/controllers/SettingsIndex.js
ro 1e37580869
added front end scripting to recreate API
dropped in js from the old site to begin the process of wiring up the
API, but this time around, scripts will be served directly in browswer
rather than being transpiled through NPM/Babel, eliminating the need for
NPM.

also scripting will new modularized and served specifically for the
requirements of the page loading it. no more front loading everything.
only script that is needed for that page will be retrieved. if no
scripting is needed, none will be loaded.

The only casualty so far has been syntax highlighting due to prismjs
still being a common js module, but either this will be replaced with
another library or a custom syntax enginge will be created at a later
date
2024-03-06 11:53:40 -06:00

269 lines
7.9 KiB
JavaScript

import SettingsActions from '../actions/SettingsActions';
import Maintenance from './MaintenanceManager';
import FipamoAdminAPI, { TASK_SYNC_SETTNIGS } from '../../libraries/FipamoAdminAPI';
import * as DataEvent from '../../../src/com/events/DataEvent';
import Mailer from '../actions/Mailer';
import Notifications from '../ui/Notifications';
const notify = new Notifications();
export default class SettingsIndex {
//--------------------------
// constructor
//--------------------------
constructor() {
this.processing = false;
this.start();
this.admin = new FipamoAdminAPI(null);
this.mm = new Maintenance(null, null);
}
//--------------------------
// methods
//--------------------------
start() {
let self = this;
//handle save button
document.getElementById('save-toggle').addEventListener('click', () =>
new SettingsActions()
.getInfo()
.then(data => {
notify.alert('Saving Settings', null);
self.admin.sync(TASK_SYNC_SETTNIGS, data).then(r => {
if (r.type == DataEvent.SETTINGS_UPDATED) {
notify.alert(r.message, true);
} else {
notify.alert(r.message, true);
}
});
})
.catch(() => {
//console.log(err);
})
);
//handle set up image uploads
document.querySelector('.avatar').addEventListener('click', () => {
document.getElementById('avatar-upload').click();
});
document.querySelector('.background').addEventListener('click', () => {
document.getElementById('background-upload').click();
});
document.getElementById('avatar-upload').addEventListener(
'change',
e => {
self.handleImageUpload(e.target.id, e.target.files);
},
false
);
document.getElementById('background-upload').addEventListener(
'change',
e => {
self.handleImageUpload(e.target.id, e.target.files);
},
false
);
//handle api access toggle
var apiButton = document.getElementById('api-access-toggle');
var apiStatus = document.getElementById('api-status');
apiButton.addEventListener('click', e => {
e.stopPropagation();
e.preventDefault();
if (apiButton.getAttribute('data-enabled') == 'false') {
apiButton.setAttribute('data-enabled', 'true');
apiStatus.innerHTML = 'API ACCESS IS ENABLED';
} else {
apiButton.setAttribute('data-enabled', 'false');
apiStatus.innerHTML = 'API ACCESS IS DISABLED';
}
});
//handle dynamic page rendering
var dynamicRenderButton = document.getElementById('dynamic-render-toggle');
var dynamicRenderStatus = document.getElementById('dynamic-render-status');
dynamicRenderButton.addEventListener('click', e => {
e.stopPropagation();
e.preventDefault();
if (dynamicRenderButton.getAttribute('data-enabled') == 'false') {
dynamicRenderButton.setAttribute('data-enabled', 'true');
dynamicRenderStatus.innerHTML = 'DYNAMIC PAGE RENDERING';
} else {
dynamicRenderButton.setAttribute('data-enabled', 'false');
dynamicRenderStatus.innerHTML = 'STATIC PAGE RENDERING';
}
});
document
.getElementById('send-mail')
.addEventListener('click', e => this.handleMailer(e));
document
.getElementById('publish-pages')
.addEventListener('click', e => this.handlePublished(e));
//handle page render on save toggle
document
.getElementById('render-toggle')
.addEventListener('click', e => this.toggleRender(e));
//handle theme toggle
let themeBtns = document.querySelectorAll('.theme-select');
for (var i = 0, length = themeBtns.length; i < length; i++) {
themeBtns[i].addEventListener('click', e => this.handleThemes(e));
}
//handle mail options
let mailBtn = document.querySelectorAll('.mail-option');
for (i = 0, length = mailBtn.length; i < length; i++) {
mailBtn[i].addEventListener('click', e => this.handleMailOptions(e));
}
//handle backup from settings [disabled]
document
.getElementById('create-backup')
.addEventListener('click', e => this.handleBackup(e));
/*
document
.getElementById("reindex-pages")
.addEventListener("click", (e) => this.handleReindex(e));
*/
}
//--------------------------
// event handlers
//--------------------------
togglePrivacy(e) {
e.stopPropagation();
e.preventDefault();
if (e.target.getAttribute('data-private') == 'false') {
e.target.setAttribute('data-private', 'true');
e.target.innerHTML = 'SITE IS PUBLIC';
} else {
e.target.setAttribute('data-private', 'false');
e.target.innerHTML = 'SITE IS PRIVATE';
}
}
toggleRender(e) {
e.stopPropagation();
e.preventDefault();
let button = document.getElementById('render-toggle');
if (button.getAttribute('data-render') == 'false') {
button.setAttribute('data-render', 'true');
//e.target.innerHTML = 'RENDER PAGES ON SAVE';
} else {
button.setAttribute('data-render', 'false');
//e.target.innerHTML = "DON'T RENDER PAGES ON SAVE";
}
}
handleMailer() {
let mailer = new Mailer();
mailer.testMail();
//mailer.sendMail();
}
handleThemes(e) {
e.stopPropagation();
e.preventDefault();
let themes = document.querySelectorAll('.theme-select');
for (var i = 0, length = themes.length; i < length; i++) {
e.target.id == themes[i].id
? themes[i].setAttribute('data-enabled', 'true')
: themes[i].setAttribute('data-enabled', 'false');
}
}
handleMailOptions(e) {
e.preventDefault();
e.stopPropagation();
let smtp = document.getElementById('mail-smtp');
let mailgun = document.getElementById('mail-mg');
let mail = document.querySelectorAll('.mail-option');
for (var i = 0, length = mail.length; i < length; i++) {
if (e.target.id == mail[i].id) {
mail[i].setAttribute('data-enabled', 'true');
if (e.target.id == 'option-smtp') {
smtp.setAttribute('data-enabled', 'true');
mailgun.setAttribute('data-enabled', 'false');
} else if (e.target.id == 'option-none') {
smtp.setAttribute('data-enabled', 'false');
mailgun.setAttribute('data-enabled', 'false');
} else {
smtp.setAttribute('data-enabled', 'false');
mailgun.setAttribute('data-enabled', 'true');
}
} else {
mail[i].setAttribute('data-enabled', 'false');
}
}
}
handleImageUpload(type, files) {
notify.alert('Uploading Image... ', null);
let self = this;
notify.alert('Uploading Image', null);
let upload = new FormData();
upload.enctype = 'multipart/form-data';
upload.append('source', type);
upload.append('upload_files[]', files[0], files[0].name);
this.mm
.filesUpload(files[0].type, upload)
.then(r => {
if (type == 'avatar-upload') {
notify.alert(r.message, true);
document.querySelector('[role="avatar"]').style.background =
'url(' + r.filePath + ') no-repeat center center / cover';
} else {
notify.alert(r.message, true);
document.querySelector('[role="background"]').style.background =
'url(' + r.filePath + ') no-repeat center center / cover';
}
})
.catch(() => {
//console.log(err)
});
}
handlePublished(e) {
if (this.processing) return;
e.preventDefault();
e.stopPropagation();
let self = this;
let task = { task: 'PUBLISH_ALL' };
this.processing = true;
notify.alert('Publishing site...', null);
this.admin
.publish(task)
.then(r => {
self.processing = false;
notify.alert(r.message, true);
})
.catch(err => {
self.processing = false;
notify.alert(err, false);
});
}
handleBackup(e) {
e.preventDefault();
e.stopPropagation();
notify.alert('Creating backup', null);
this.mm
.backup()
.then(r => {
notify.alert(r.message, true);
})
.catch(err => {
notify.alert(err, false);
});
}
handleReindex(e) {
if (this.processing) return;
let self = this;
e.preventDefault();
e.stopPropagation();
let task = { task: 'cleanup pages indexes' };
this.processing = true;
notify.alert('Cleaning up page indexes', null);
this.admin
.handleReindex(task)
.then(r => {
self.processing = false;
notify.alert(r.message, true);
})
.catch(err => {
self.processing = false;
notify.alert(err, false);
});
}
}