diff --git a/src/UI/Settings/UITabAbout.js b/src/UI/Settings/UITabAbout.js index 8ef41dde..8a6631b6 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/UITabAccount.js b/src/UI/Settings/UITabAccount.js new file mode 100644 index 00000000..398ff4f3 --- /dev/null +++ b/src/UI/Settings/UITabAccount.js @@ -0,0 +1,134 @@ +/** + * Copyright (C) 2024 Puter Technologies Inc. + * + * This file is part of Puter. + * + * Puter is free software: you can redistribute it and/or modify + * it under the terms of the GNU Affero General Public License as published + * by the Free Software Foundation, either version 3 of the License, or + * (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU Affero General Public License for more details. + * + * You should have received a copy of the GNU Affero General Public License + * along with this program. If not, see . + */ +import UIWindowChangePassword from '../UIWindowChangePassword.js'; +import UIWindowChangeEmail from './UIWindowChangeEmail.js'; +import UIWindowChangeUsername from '../UIWindowChangeUsername.js'; +import UIWindowConfirmUserDeletion from './UIWindowConfirmUserDeletion.js'; +import UIWindowManageSessions from '../UIWindowManageSessions.js'; + +// About +export default { + id: 'account', + title_i18n_key: 'account', + icon: 'user.svg', + html: () => { + let h = `

${i18n('account')}

`; + // change password button + h += `
`; + h += `${i18n('password')}`; + h += `
`; + h += ``; + h += `
`; + h += `
`; + + // change username button + h += `
`; + h += `
`; + h += `${i18n('username')}`; + h += `${user.username}`; + h += `
`; + h += `
`; + h += ``; + h += `
` + h += `
`; + + // change email button + if(user.email){ + h += `
`; + h += `
`; + h += `${i18n('email')}`; + h += `${user.email}`; + h += `
`; + h += `
`; + h += ``; + h += `
`; + h += `
`; + } + + // session manager + h += `
`; + h += `${i18n('sessions')}`; + h += `
`; + h += ``; + h += `
`; + h += `
`; + + // 'Delete Account' button + h += `
`; + h += `${i18n("delete_account")}`; + h += `
`; + h += ``; + h += `
`; + h += `
`; + + return h; + }, + init: ($el_window) => { + $el_window.find('.change-password').on('click', function (e) { + UIWindowChangePassword({ + window_options:{ + parent_uuid: $el_window.attr('data-element_uuid'), + disable_parent_window: true, + parent_center: true, + } + }); + }); + + $el_window.find('.change-username').on('click', function (e) { + UIWindowChangeUsername({ + window_options:{ + parent_uuid: $el_window.attr('data-element_uuid'), + disable_parent_window: true, + parent_center: true, + } + }); + }); + + $el_window.find('.change-email').on('click', function (e) { + console.log('change email', $el_window.attr('data-element_uuid')); + UIWindowChangeEmail({ + window_options:{ + parent_uuid: $el_window.attr('data-element_uuid'), + disable_parent_window: true, + parent_center: true, + } + }); + }); + + $el_window.find('.manage-sessions').on('click', function (e) { + UIWindowManageSessions({ + window_options:{ + parent_uuid: $el_window.attr('data-element_uuid'), + disable_parent_window: true, + parent_center: true, + } + }); + }); + + $el_window.find('.delete-account').on('click', function (e) { + UIWindowConfirmUserDeletion({ + window_options:{ + parent_uuid: $el_window.attr('data-element_uuid'), + disable_parent_window: true, + parent_center: true, + } + }); + }); + }, +}; diff --git a/src/UI/Settings/UITabClock.js b/src/UI/Settings/UITabClock.js new file mode 100644 index 00000000..03eb7be9 --- /dev/null +++ b/src/UI/Settings/UITabClock.js @@ -0,0 +1,45 @@ +/** + * Copyright (C) 2024 Puter Technologies Inc. + * + * This file is part of Puter. + * + * Puter is free software: you can redistribute it and/or modify + * it under the terms of the GNU Affero General Public License as published + * by the Free Software Foundation, either version 3 of the License, or + * (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU Affero General Public License for more details. + * + * You should have received a copy of the GNU Affero General Public License + * along with this program. If not, see . + */ +import UIWindowThemeDialog from '../UIWindowThemeDialog.js'; + +// About +export default { + id: 'clock', + title_i18n_key: 'clock', + icon: 'clock.svg', + html: () => { + return ` +

${i18n('clock')}

+
+ ${i18n('visibility')}: + +
`; + }, + init: ($el_window) => { + $el_window.on('change', 'select.change-clock-visible', function(e){ + window.change_clock_visible(this.value); + }); + + window.change_clock_visible(); + }, +}; diff --git a/src/UI/Settings/UITabLanguage.js b/src/UI/Settings/UITabLanguage.js new file mode 100644 index 00000000..c0c36df2 --- /dev/null +++ b/src/UI/Settings/UITabLanguage.js @@ -0,0 +1,83 @@ +/** + * Copyright (C) 2024 Puter Technologies Inc. + * + * This file is part of Puter. + * + * Puter is free software: you can redistribute it and/or modify + * it under the terms of the GNU Affero General Public License as published + * by the Free Software Foundation, either version 3 of the License, or + * (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU Affero General Public License for more details. + * + * You should have received a copy of the GNU Affero General Public License + * along with this program. If not, see . + */ +import UIWindowThemeDialog from '../UIWindowThemeDialog.js'; +import changeLanguage from '../../i18n/i18nChangeLanguage.js'; + +// About +export default { + id: 'language', + title_i18n_key: 'language', + icon: 'language.svg', + html: () => { + let h = `

${i18n('language')}

`; + + // search + h += `
+ +
`; + + // list of languages + const available_languages = listSupportedLanguages(); + h += `
`; + for (let lang of available_languages) { + h += `
${lang.name}
`; + } + h += `
`; + return h; + }, + init: ($el_window) => { + $el_window.on('click', '.language-item', function(){ + const $this = $(this); + const lang = $this.attr('data-lang'); + changeLanguage(lang); + $this.siblings().removeClass('active'); + $this.addClass('active'); + // make sure all other language items are visible + $this.closest('.language-list').find('.language-item').show(); + }); + + $el_window.on('input', '.search-language', function(){ + const $this = $(this); + const search = $this.val().toLowerCase(); + const $container = $this.closest('.settings').find('.settings-content-container'); + const $content = $container.find('.settings-content.active'); + const $list = $content.find('.language-list'); + const $items = $list.find('.language-item'); + $items.each(function(){ + const $item = $(this); + const lang = $item.attr('data-lang'); + const name = $item.text().toLowerCase(); + const english_name = $item.attr('data-english-name').toLowerCase(); + if(name.includes(search) || lang.includes(search) || english_name.includes(search)){ + $item.show(); + }else{ + $item.hide(); + } + }) + }); + }, + on_show: ($content) => { + // Focus on search + $content.find('.search').first().focus(); + // make sure all language items are visible + $content.find('.language-item').show(); + // empty search + $content.find('.search').val(''); + }, +}; diff --git a/src/UI/Settings/UITabPersonalization.js b/src/UI/Settings/UITabPersonalization.js new file mode 100644 index 00000000..036ddd42 --- /dev/null +++ b/src/UI/Settings/UITabPersonalization.js @@ -0,0 +1,63 @@ +/** + * Copyright (C) 2024 Puter Technologies Inc. + * + * This file is part of Puter. + * + * Puter is free software: you can redistribute it and/or modify + * it under the terms of the GNU Affero General Public License as published + * by the Free Software Foundation, either version 3 of the License, or + * (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU Affero General Public License for more details. + * + * You should have received a copy of the GNU Affero General Public License + * along with this program. If not, see . + */ +import UIWindowThemeDialog from '../UIWindowThemeDialog.js'; +import UIWindowDesktopBGSettings from '../UIWindowDesktopBGSettings.js'; + +// About +export default { + id: 'personalization', + title_i18n_key: 'personalization', + icon: 'palette-outline.svg', + html: () => { + return ` +

${i18n('personalization')}

+
+ ${i18n('ui_colors')} +
+ +
+
+
+ ${i18n('background')} +
+ +
+
`; + }, + init: ($el_window) => { + $el_window.find('.change-ui-colors').on('click', function (e) { + UIWindowThemeDialog({ + window_options:{ + parent_uuid: $el_window.attr('data-element_uuid'), + disable_parent_window: true, + parent_center: true, + } + }); + }); + $el_window.find('.change-background').on('click', function (e) { + UIWindowDesktopBGSettings({ + window_options:{ + parent_uuid: $el_window.attr('data-element_uuid'), + disable_parent_window: true, + parent_center: true, + } + }); + }); + }, +}; diff --git a/src/UI/Settings/UITabUsage.js b/src/UI/Settings/UITabUsage.js new file mode 100644 index 00000000..88f15b6f --- /dev/null +++ b/src/UI/Settings/UITabUsage.js @@ -0,0 +1,141 @@ +/** + * Copyright (C) 2024 Puter Technologies Inc. + * + * This file is part of Puter. + * + * Puter is free software: you can redistribute it and/or modify + * it under the terms of the GNU Affero General Public License as published + * by the Free Software Foundation, either version 3 of the License, or + * (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU Affero General Public License for more details. + * + * You should have received a copy of the GNU Affero General Public License + * along with this program. If not, see . + */ + +// About +export default { + id: 'usage', + title_i18n_key: 'usage', + icon: 'speedometer-outline.svg', + html: () => { + return ` +

Usage

+
+

${i18n('storage_usage')}

+
+ + used of + + +
+
+ +
+
+
+
`; + }, + init: ($el_window) => { + $.ajax({ + url: api_origin + "/drivers/usage", + type: 'GET', + async: true, + contentType: "application/json", + headers: { + "Authorization": "Bearer " + auth_token + }, + statusCode: { + 401: function () { + logout(); + }, + }, + success: function (res) { + let h = ''; // Initialize HTML string for driver usage bars + + // Loop through user services + res.user.forEach(service => { + const { monthly_limit, monthly_usage } = service; + let usageDisplay = ``; + + if (monthly_limit !== null) { + let usage_percentage = (monthly_usage / monthly_limit * 100).toFixed(0); + usage_percentage = usage_percentage > 100 ? 100 : usage_percentage; // Cap at 100% + usageDisplay = ` +
+

${service.service['driver.interface']} (${service.service['driver.method']}):

+ ${monthly_usage} used of ${monthly_limit} +
+
${usage_percentage}%
+
+
+ `; + } + else { + usageDisplay = ` +
+

${service.service['driver.interface']} (${service.service['driver.method']}):

+ ${i18n('usage')}: ${monthly_usage} (${i18n('unlimited')}) +
+ `; + } + h += usageDisplay; + }); + + // Append driver usage bars to the container + $('.settings-content[data-settings="usage"]').append(`
${h}
`); + } + }); + + // df + $.ajax({ + url: api_origin + "/df", + type: 'GET', + async: true, + contentType: "application/json", + headers: { + "Authorization": "Bearer " + auth_token + }, + statusCode: { + 401: function () { + logout(); + }, + }, + success: function (res) { + let usage_percentage = (res.used / res.capacity * 100).toFixed(0); + usage_percentage = usage_percentage > 100 ? 100 : usage_percentage; + + let general_used = res.used; + + let host_usage_percentage = 0; + if ( res.host_used ) { + $('#storage-puter-used').html(byte_format(res.used)); + $('#storage-puter-used-w').show(); + + general_used = res.host_used; + host_usage_percentage = ((res.host_used - res.used) / res.capacity * 100).toFixed(0); + } + + $('#storage-used').html(byte_format(general_used)); + $('#storage-capacity').html(byte_format(res.capacity)); + $('#storage-used-percent').html( + usage_percentage + '%' + + (host_usage_percentage > 0 + ? ' / ' + host_usage_percentage + '%' : '') + ); + $('#storage-bar').css('width', usage_percentage + '%'); + $('#storage-bar-host').css('width', host_usage_percentage + '%'); + if (usage_percentage >= 100) { + $('#storage-bar').css({ + 'border-top-right-radius': '3px', + 'border-bottom-right-radius': '3px', + }); + } + } + }); + }, +}; diff --git a/src/UI/Settings/UIWindowSettings.js b/src/UI/Settings/UIWindowSettings.js index 1b2c9a23..a1827401 100644 --- a/src/UI/Settings/UIWindowSettings.js +++ b/src/UI/Settings/UIWindowSettings.js @@ -23,7 +23,12 @@ 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 UsageTab from './UITabUsage.js'; +import AccountTab from './UITabAccount.js'; +import PersonalizationTab from './UITabPersonalization.js'; +import LanguageTab from './UITabLanguage.js'; +import ClockTab from './UITabClock.js'; import UIWindowThemeDialog from '../UIWindowThemeDialog.js'; import UIWindowManageSessions from '../UIWindowManageSessions.js'; @@ -31,138 +36,34 @@ 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')}
`; - h += `
${i18n('usage')}
`; - h += `
${i18n('account')}
`; - h += `
${i18n('personalization')}
`; - h += `
${i18n('language')}
`; - h += `
${i18n('clock')}
`; + tabs.forEach((tab, i) => { + h += `
${i18n(tab.title_i18n_key)}
`; + }); h += `
`; // content h += `
`; - - // About - h += UITabAbout(); - // Usage - h += `
`; - h += `

Usage

`; - h += `
-

${i18n('storage_usage')}

-
- - used of - - -
-
- -
-
-
-
` - h += `
`; - - // Account - h += `
`; - h += `

${i18n('account')}

`; - // change password button - h += `
`; - h += `${i18n('password')}`; - h += `
`; - h += ``; - h += `
`; - h += `
`; - - // change username button - h += `
`; - h += `
`; - h += `${i18n('username')}`; - h += `${user.username}`; - h += `
`; - h += `
`; - h += ``; - h += `
` - h += `
`; - - // change email button - if(user.email){ - h += `
`; - h += `
`; - h += `${i18n('email')}`; - h += `${user.email}`; - h += `
`; - h += `
`; - h += ``; - h += `
`; - h += `
`; - } - - // session manager - h += `
`; - h += `${i18n('sessions')}`; - h += `
`; - h += ``; - h += `
`; - h += `
`; - - // 'Delete Account' button - h += `
`; - h += `${i18n("delete_account")}`; - h += `
`; - h += ``; - h += `
`; - h += `
`; - - h += `
`; - - // Personalization - h += `
`; - h += `

${i18n('personalization')}

`; - // change password button - h += `
`; - h += `${i18n('ui_colors')}`; - h += `
`; - h += ``; - h += `
`; - h += `
`; - h += `
`; - - // Language - h += `
`; - h += `

${i18n('language')}

`; - // search - h += `
`; - h += ``; - h += `
`; - // list of languages - const available_languages = listSupportedLanguages(); - h += `
`; - for (let lang of available_languages) { - h += `
${lang.name}
`; - } - h += `
`; - h += `
`; - - // Clock - h += `
`; - h += `

${i18n('clock')}

`; - h += `
` - h += `${i18n('visibility')}:` - h += `` - h += `
` - h += `
`; + tabs.forEach((tab, i) => { + h += `
+ ${tab.html()} +
`; + }); h += `
`; h += `
`; @@ -202,194 +103,8 @@ async function UIWindowSettings(options){ overflow: 'auto' } }); - - $.ajax({ - url: api_origin + "/drivers/usage", - type: 'GET', - async: true, - contentType: "application/json", - headers: { - "Authorization": "Bearer " + auth_token - }, - statusCode: { - 401: function () { - logout(); - }, - }, - success: function (res) { - let h = ''; // Initialize HTML string for driver usage bars - - // Loop through user services - res.user.forEach(service => { - const { monthly_limit, monthly_usage } = service; - let usageDisplay = ``; - - if (monthly_limit !== null) { - let usage_percentage = (monthly_usage / monthly_limit * 100).toFixed(0); - usage_percentage = usage_percentage > 100 ? 100 : usage_percentage; // Cap at 100% - usageDisplay = ` -
-

${service.service['driver.interface']} (${service.service['driver.method']}):

- ${monthly_usage} used of ${monthly_limit} -
-
${usage_percentage}%
-
-
- `; - } - else { - usageDisplay = ` -
-

${service.service['driver.interface']} (${service.service['driver.method']}):

- ${i18n('usage')}: ${monthly_usage} (${i18n('unlimited')}) -
- `; - } - h += usageDisplay; - }); - - // Append driver usage bars to the container - $('.settings-content[data-settings="usage"]').append(`
${h}
`); - } - }) - - // df - $.ajax({ - url: api_origin + "/df", - type: 'GET', - async: true, - contentType: "application/json", - headers: { - "Authorization": "Bearer " + auth_token - }, - statusCode: { - 401: function () { - logout(); - }, - }, - success: function (res) { - let usage_percentage = (res.used / res.capacity * 100).toFixed(0); - usage_percentage = usage_percentage > 100 ? 100 : usage_percentage; - - let general_used = res.used; - - let host_usage_percentage = 0; - if ( res.host_used ) { - $('#storage-puter-used').html(byte_format(res.used)); - $('#storage-puter-used-w').show(); - - general_used = res.host_used; - host_usage_percentage = ((res.host_used - res.used) / res.capacity * 100).toFixed(0); - } - - $('#storage-used').html(byte_format(general_used)); - $('#storage-capacity').html(byte_format(res.capacity)); - $('#storage-used-percent').html( - usage_percentage + '%' + - (host_usage_percentage > 0 - ? ' / ' + host_usage_percentage + '%' : '') - ); - $('#storage-bar').css('width', usage_percentage + '%'); - $('#storage-bar-host').css('width', host_usage_percentage + '%'); - if (usage_percentage >= 100) { - $('#storage-bar').css({ - 'border-top-right-radius': '3px', - 'border-bottom-right-radius': '3px', - }); - } - } - }) - - // 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:{ - parent_uuid: $(el_window).attr('data-element_uuid'), - disable_parent_window: true, - parent_center: true, - } - }); - }) - - $(el_window).find('.change-email').on('click', function (e) { - console.log('change email', $(el_window).attr('data-element_uuid')); - UIWindowChangeEmail({ - window_options:{ - parent_uuid: $(el_window).attr('data-element_uuid'), - disable_parent_window: true, - parent_center: true, - } - }); - }) - - $(el_window).find('.delete-account').on('click', function (e) { - UIWindowConfirmUserDeletion({ - window_options:{ - parent_uuid: $(el_window).attr('data-element_uuid'), - disable_parent_window: true, - parent_center: true, - } - }); - }) - - $(el_window).find('.change-username').on('click', function (e) { - UIWindowChangeUsername({ - window_options:{ - parent_uuid: $(el_window).attr('data-element_uuid'), - disable_parent_window: true, - parent_center: true, - } - }); - }) - - $(el_window).find('.change-ui-colors').on('click', function (e) { - UIWindowThemeDialog({ - window_options:{ - parent_uuid: $(el_window).attr('data-element_uuid'), - disable_parent_window: true, - parent_center: true, - } - }); - }) - - $(el_window).find('.manage-sessions').on('click', function (e) { - UIWindowManageSessions({ - window_options:{ - parent_uuid: $(el_window).attr('data-element_uuid'), - disable_parent_window: true, - parent_center: true, - } - }); - }) + const $el_window = $(el_window); + tabs.forEach(tab => tab.init($el_window)); $(el_window).on('click', '.settings-sidebar-item', function(){ const $this = $(this); @@ -402,55 +117,14 @@ async function UIWindowSettings(options){ // add active class to content $container.find('.settings-content').removeClass('active'); $content.addClass('active'); - // if language, focus on search - if(settings === 'language'){ - $content.find('.search').first().focus(); - // make sure all language items are visible - $content.find('.language-item').show(); - // empty search - $content.find('.search').val(''); + + // Run on_show handlers + const tab = tabs.find((tab) => tab.id === settings); + if (tab.on_show) { + tab.on_show($content); } }) - $(el_window).on('click', '.language-item', function(){ - const $this = $(this); - const lang = $this.attr('data-lang'); - changeLanguage(lang); - $this.siblings().removeClass('active'); - $this.addClass('active'); - // make sure all other language items are visible - $this.closest('.language-list').find('.language-item').show(); - }) - - $(el_window).on('input', '.search', function(){ - const $this = $(this); - const search = $this.val().toLowerCase(); - const $container = $this.closest('.settings').find('.settings-content-container'); - const $content = $container.find('.settings-content.active'); - const $list = $content.find('.language-list'); - const $items = $list.find('.language-item'); - $items.each(function(){ - const $item = $(this); - const lang = $item.attr('data-lang'); - const name = $item.text().toLowerCase(); - const english_name = $item.attr('data-english-name').toLowerCase(); - if(name.includes(search) || lang.includes(search) || english_name.includes(search)){ - $item.show(); - }else{ - $item.hide(); - } - }) - }); - - $(el_window).on('change', 'select.change-clock-visible', function(e){ - const $this = $(this); - const value = $this.val(); - - window.change_clock_visible(value); - }) - - window.change_clock_visible(); - resolve(el_window); }); } diff --git a/src/UI/UIWindowDesktopBGSettings.js b/src/UI/UIWindowDesktopBGSettings.js index 3b0c9838..e8a18b4c 100644 --- a/src/UI/UIWindowDesktopBGSettings.js +++ b/src/UI/UIWindowDesktopBGSettings.js @@ -19,7 +19,9 @@ import UIWindow from './UIWindow.js' -async function UIWindowDesktopBGSettings(){ +async function UIWindowDesktopBGSettings(options){ + options = options ?? {}; + return new Promise(async (resolve) => { let h = ''; const original_background_css = $('body').attr('style'); @@ -103,7 +105,8 @@ async function UIWindowDesktopBGSettings(){ height: '100%', 'background-color': 'rgb(245 247 249)', 'backdrop-filter': 'blur(3px)', - } + }, + ...options.window_options, }) if(window.desktop_bg_url !== undefined && window.desktop_bg_url !== null){