diff --git a/src/UI/Settings/UITabAbout.js b/src/UI/Settings/UITabAbout.js index 8ef41ddee..8a6631b67 100644 --- a/src/UI/Settings/UITabAbout.js +++ b/src/UI/Settings/UITabAbout.js @@ -18,79 +18,109 @@ */ // About -function UITabAbout(){ - let h = ``; - - h += `
`; - h += `
` - h += `
- -

${i18n('puter_description')}

-

- hey@puter.com - • - ${i18n('developers')} - • - ${i18n('status')} - • - ${i18n('terms')} - • - ${i18n('privacy')} - • - ${i18n('credits')} -

- -
-
- - -
-

${i18n('oss_code_and_content')}

-
- +export default { + id: 'about', + title_i18n_key: 'about', + icon: 'logo-outline.svg', + html: () => { + return ` +
+
+ +

${i18n('puter_description')}

+

+ hey@puter.com + • + ${i18n('developers')} + • + ${i18n('status')} + • + ${i18n('terms')} + • + ${i18n('privacy')} + • + ${i18n('credits')} +

+
-
- `; - h += `
`; - h += `
`; +
+ + +
+

${i18n('oss_code_and_content')}

+
+ +
+
+ + `; + }, + init: ($el_window) => { + // version + $.ajax({ + url: api_origin + "/version", + type: 'GET', + async: true, + contentType: "application/json", + headers: { + "Authorization": "Bearer " + auth_token + }, + statusCode: { + 401: function () { + logout(); + }, + }, + success: function (res) { + var d = new Date(0); + $el_window.find('.version').html('Version: ' + res.version + ' • ' + 'Server: ' + res.location + ' • ' + 'Deployed: ' + new Date(res.deploy_timestamp)); + } + }); - return h; -} -export default UITabAbout; \ No newline at end of file + $el_window.find('.credits').on('click', function (e) { + if($(e.target).hasClass('credits')){ + $('.credits').get(0).close(); + } + }); + + $el_window.find('.show-credits').on('click', function (e) { + $('.credits').get(0).showModal(); + }) + + }, +}; diff --git a/src/UI/Settings/UIWindowSettings.js b/src/UI/Settings/UIWindowSettings.js index 1b2c9a231..3073f8b04 100644 --- a/src/UI/Settings/UIWindowSettings.js +++ b/src/UI/Settings/UIWindowSettings.js @@ -23,7 +23,7 @@ import UIWindowChangeEmail from './UIWindowChangeEmail.js' import UIWindowChangeUsername from '../UIWindowChangeUsername.js' import changeLanguage from "../../i18n/i18nChangeLanguage.js" import UIWindowConfirmUserDeletion from './UIWindowConfirmUserDeletion.js'; -import UITabAbout from './UITabAbout.js'; +import AboutTab from './UITabAbout.js'; import UIWindowThemeDialog from '../UIWindowThemeDialog.js'; import UIWindowManageSessions from '../UIWindowManageSessions.js'; @@ -31,13 +31,24 @@ async function UIWindowSettings(options){ return new Promise(async (resolve) => { options = options ?? {}; + const tabs = [ + AboutTab, + // UsageTab, + // AccountTab, + // PersonalizationTab, + // LanguageTab, + // ClockTab, + ]; + let h = ''; h += `
`; h += `
`; // side bar h += `
`; - h += `
${i18n('about')}
`; + tabs.forEach((tab, i) => { + h += `
${i18n(tab.title_i18n_key)}
`; + }); h += `
${i18n('usage')}
`; h += `
${i18n('account')}
`; h += `
${i18n('personalization')}
`; @@ -47,9 +58,12 @@ async function UIWindowSettings(options){ // content h += `
`; - - // About - h += UITabAbout(); + + tabs.forEach((tab, i) => { + h += `
+ ${tab.html()} +
`; + }); // Usage h += `
`; @@ -202,6 +216,8 @@ async function UIWindowSettings(options){ overflow: 'auto' } }); + const $el_window = $(el_window); + tabs.forEach(tab => tab.init($el_window)); $.ajax({ url: api_origin + "/drivers/usage", @@ -300,36 +316,6 @@ async function UIWindowSettings(options){ } }) - // version - $.ajax({ - url: api_origin + "/version", - type: 'GET', - async: true, - contentType: "application/json", - headers: { - "Authorization": "Bearer " + auth_token - }, - statusCode: { - 401: function () { - logout(); - }, - }, - success: function (res) { - var d = new Date(0); - $('.version').html('Version: ' + res.version + ' • ' + 'Server: ' + res.location + ' • ' + 'Deployed: ' + new Date(res.deploy_timestamp)); - } - }) - - $(el_window).find('.credits').on('click', function (e) { - if($(e.target).hasClass('credits')){ - $('.credits').get(0).close(); - } - }); - - $(el_window).find('.show-credits').on('click', function (e) { - $('.credits').get(0).showModal(); - }) - $(el_window).find('.change-password').on('click', function (e) { UIWindowChangePassword({ window_options:{