fix js integrations

Signed-off-by: Michael Kaufmann <[email protected]>
froxlor · Oct 18, 2023 · a11d265 · a11d265
1 parent 462a798
commit a11d265
Show file tree

Hide file tree

Showing 23 changed files with 586 additions and 573 deletions.
diff --git a/install/froxlor.sql.php b/install/froxlor.sql.php
@@ -356,23 +356,6 @@
 ) ENGINE=InnoDB CHARSET=utf8 COLLATE=utf8_general_ci;
 
 
-DROP TABLE IF EXISTS `panel_sessions`;
-CREATE TABLE `panel_sessions` (
-  `hash` varchar(32) NOT NULL default '',
-  `userid` int(11) unsigned NOT NULL default '0',
-  `ipaddress` varchar(255) NOT NULL default '',
-  `useragent` varchar(255) NOT NULL default '',
-  `lastactivity` int(11) unsigned NOT NULL default '0',
-  `lastpaging` varchar(255) NOT NULL default '',
-  `formtoken` char(32) NOT NULL default '',
-  `language` varchar(64) NOT NULL default '',
-  `adminsession` tinyint(1) unsigned NOT NULL default '0',
-  `theme` varchar(255) NOT NULL default '',
-  PRIMARY KEY  (`hash`),
-  KEY `userid` (`userid`)
-) ENGINE=HEAP;
-
-
 DROP TABLE IF EXISTS `panel_settings`;
 CREATE TABLE `panel_settings` (
   `settingid` int(11) unsigned NOT NULL auto_increment,

diff --git a/templates/Froxlor/assets/js/app.js b/templates/Froxlor/assets/js/app.js
@@ -1,33 +1,14 @@
 import '@fortawesome/fontawesome-free';
-
-import jQuery from 'jquery';
-window.$ = jQuery;
-
-import 'jquery-validation';
-import 'bootstrap';
-import 'chart.js/auto';
-
-// Axios
-import axios from 'axios';
-window.axios = axios;
-window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
+import './bootstrap';
 
 // Vue
-import { createApp } from 'vue';
-const app = createApp({});
-
-// import ExampleComponent from './components/ExampleComponent.vue';
-// app.component('example-component', ExampleComponent);
-//
-// or
-//
-// Object.entries(import.meta.glob('./**/*.vue', { eager: true })).forEach(([path, definition]) => {
-//     app.component(path.split('/').pop().replace(/\.\w+$/, ''), definition.default);
-// });
+import {createApp} from 'vue';
 
-app.mount('#app');
+const app = createApp({});
 
 // Load jquery components
-Object.entries(import.meta.glob('./jquery/*.js', { eager: true })).forEach(([path, definition]) => {
+Object.entries(import.meta.glob('./jquery/*.js', {eager: true})).forEach(([path, definition]) => {
 	definition.default();
 });
+
+app.mount('#app');
diff --git a/templates/Froxlor/assets/js/bootstrap.js b/templates/Froxlor/assets/js/bootstrap.js
@@ -0,0 +1,20 @@
+import _ from 'lodash';
+window._ = _;
+
+// jQuery
+import jQuery from 'jquery';
+window.$ = jQuery;
+import 'jquery-validation';
+
+// Bootstrap
+import * as bootstrap from 'bootstrap';
+window.bootstrap = bootstrap;
+
+// ChartJS
+import Chart from 'chart.js/auto';
+window.Chart = Chart;
+
+// Axios
+import axios from 'axios';
+window.axios = axios;
+window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
diff --git a/templates/Froxlor/assets/js/jquery/apikeys.js b/templates/Froxlor/assets/js/jquery/apikeys.js
@@ -1,60 +1,68 @@
-export default function() {
-
-	var timer, delay = 500;
-	$('div[data-action="apikeys"] #allowed_from').on('keyup change', function () {
-		var _this = $(this);
-		clearTimeout(timer);
-		timer = setTimeout(function () {
-			var akid = _this.closest('div[data-action="apikeys"]').data('entry');
-			$.ajax({
-				url: "lib/ajax.php?action=editapikey",
-				type: "POST",
-				dataType: "json",
-				data: { id: akid, allowed_from: _this.val(), valid_until: $('div[data-entry="' + akid + '"] #valid_until').val() },
-				success: function (data) {
-					if (data.message) {
+export default function () {
+	$(function () {
+		var timer, delay = 500;
+		$('div[data-action="apikeys"] #allowed_from').on('keyup change', function () {
+			var _this = $(this);
+			clearTimeout(timer);
+			timer = setTimeout(function () {
+				var akid = _this.closest('div[data-action="apikeys"]').data('entry');
+				$.ajax({
+					url: "lib/ajax.php?action=editapikey",
+					type: "POST",
+					dataType: "json",
+					data: {
+						id: akid,
+						allowed_from: _this.val(),
+						valid_until: $('div[data-entry="' + akid + '"] #valid_until').val()
+					},
+					success: function (data) {
+						if (data.message) {
+							_this.removeClass('is-valid');
+							_this.addClass('is-invalid');
+						} else {
+							_this.removeClass('is-invalid');
+							_this.addClass('is-valid');
+							_this.val(data.allowed_from);
+						}
+					},
+					error: function (request, status, error) {
 						_this.removeClass('is-valid');
 						_this.addClass('is-invalid');
-					} else {
-						_this.removeClass('is-invalid');
-						_this.addClass('is-valid');
-						_this.val(data.allowed_from);
 					}
-				},
-				error: function (request, status, error) {
-					_this.removeClass('is-valid');
-					_this.addClass('is-invalid');
-				}
-			});
-		}, delay);
-	});
+				});
+			}, delay);
+		});
 
-	$('div[data-action="apikeys"] #valid_until').on('keyup change', function () {
-		var _this = $(this);
-		clearTimeout(timer);
-		timer = setTimeout(function () {
-			var akid = _this.closest('div[data-action="apikeys"]').data('entry');
-			$.ajax({
-				url: "lib/ajax.php?action=editapikey",
-				type: "POST",
-				dataType: "json",
-				data: { id: akid, valid_until: _this.val(), allowed_from: $('div[data-entry="' + akid + '"] #allowed_from').val() },
-				success: function (data) {
-					if (data.message) {
+		$('div[data-action="apikeys"] #valid_until').on('keyup change', function () {
+			var _this = $(this);
+			clearTimeout(timer);
+			timer = setTimeout(function () {
+				var akid = _this.closest('div[data-action="apikeys"]').data('entry');
+				$.ajax({
+					url: "lib/ajax.php?action=editapikey",
+					type: "POST",
+					dataType: "json",
+					data: {
+						id: akid,
+						valid_until: _this.val(),
+						allowed_from: $('div[data-entry="' + akid + '"] #allowed_from').val()
+					},
+					success: function (data) {
+						if (data.message) {
+							_this.removeClass('is-valid');
+							_this.addClass('is-invalid');
+						} else {
+							_this.removeClass('is-invalid');
+							_this.addClass('is-valid');
+							_this.val(data.valid_until);
+						}
+					},
+					error: function (request, status, error) {
 						_this.removeClass('is-valid');
 						_this.addClass('is-invalid');
-					} else {
-						_this.removeClass('is-invalid');
-						_this.addClass('is-valid');
-						_this.val(data.valid_until);
 					}
-				},
-				error: function (request, status, error) {
-					_this.removeClass('is-valid');
-					_this.addClass('is-invalid');
-				}
-			});
-		}, delay);
+				});
+			}, delay);
+		});
 	});
-
 }
diff --git a/templates/Froxlor/assets/js/jquery/configfiles.js b/templates/Froxlor/assets/js/jquery/configfiles.js
@@ -1,52 +1,54 @@
-export default function() {
-	/*
-	 * config files - select all recommended
-	 */
-	$('#selectRecommendedConfig').on('click', function () {
-		$('input[data-recommended]').each(function () {
-			if ($(this).data('recommended') == 1) {
-				$(this).prop('checked', true);
-			} else {
-				$(this).prop('checked', false);
-			}
-		})
-	});
+export default function () {
+	$(function () {
+		/*
+		 * config files - select all recommended
+		 */
+		$('#selectRecommendedConfig').on('click', function () {
+			$('input[data-recommended]').each(function () {
+				if ($(this).data('recommended') == 1) {
+					$(this).prop('checked', true);
+				} else {
+					$(this).prop('checked', false);
+				}
+			})
+		});
 
-	/*
-	 * export/download JSON file (e.g. for usage with config-services)
-	 */
-	$('#downloadSelectionAsJson').on('click', function () {
-		var formData = $(this).closest('form').serialize();
-		window.location = "lib/ajax.php?action=getConfigJsonExport&" + formData;
-	});
+		/*
+		 * export/download JSON file (e.g. for usage with config-services)
+		 */
+		$('#downloadSelectionAsJson').on('click', function () {
+			var formData = $(this).closest('form').serialize();
+			window.location = "lib/ajax.php?action=getConfigJsonExport&" + formData;
+		});
 
-	/*
-	 * open modal window to show selected config-commands/files
-	 * for selected daemon
-	 */
-	$('.show-config').on('click', function () {
-		var distro = $(this).data('dist');
-		var section = $(this).data('section');
-		var daemon = $(this).data('daemon');
+		/*
+		 * open modal window to show selected config-commands/files
+		 * for selected daemon
+		 */
+		$('.show-config').on('click', function () {
+			const distro = $(this).data('dist');
+			const section = $(this).data('section');
+			const daemon = $(this).data('daemon');
 
-		$.ajax({
-			url: "lib/ajax.php?action=getConfigDetails",
-			type: "POST",
-			dataType: "json",
-			data: { distro: distro, section: section, daemon: daemon },
-			success: function (data) {
-				$('#configTplShowLabel').html(data.title);
-				$('#configTplShow .modal-body').html(data.content);
-				var myModal = new bootstrap.Modal(document.getElementById('configTplShow'));
-				myModal.show();
-			},
-			error: function (request, status, error) {
-				$('#configTplShowLabel').html('Error');
-				$('#configTplShow .modal-body').html('<div class="alert alert-danger" role="alert">' + request.responseJSON.message + '</div>');
-				var myModal = new bootstrap.Modal(document.getElementById('configTplShow'));
-				myModal.show();
-			}
-		});
+			$.ajax({
+				url: "lib/ajax.php?action=getConfigDetails",
+				type: "POST",
+				dataType: "json",
+				data: {distro: distro, section: section, daemon: daemon},
+				success: function (data) {
+					$('#configTplShowLabel').html(data.title);
+					$('#configTplShow .modal-body').html(data.content);
+					const myModal = new bootstrap.Modal(document.getElementById('configTplShow'));
+					myModal.show();
+				},
+				error: function (request, status, error) {
+					$('#configTplShowLabel').html('Error');
+					$('#configTplShow .modal-body').html('<div class="alert alert-danger" role="alert">' + request.responseJSON.message + '</div>');
+					const myModal = new bootstrap.Modal(document.getElementById('configTplShow'));
+					myModal.show();
+				}
+			});
 
+		});
 	});
 }