fix app layouts: remove style tags from content fragments, use component classes

This commit is contained in:
2026-01-20 17:40:38 +01:00
parent 4b47611902
commit 82bc0c78fe
25 changed files with 5350 additions and 537 deletions

View File

@@ -0,0 +1,288 @@
-- settings.lua - Settings app functionality
-- Handles toggles, navigation, and system settings
local settings_doc = nil
-- Settings state
local settings_state = {
wifi = true,
wifi_network = "MosisNetwork",
bluetooth = false,
airplane_mode = false,
location = true,
location_mode = "High accuracy",
brightness = 80,
auto_brightness = true,
dark_mode = true,
font_size = "Default",
sleep_timeout = "5 minutes",
sound_volume = 70,
ring_volume = 80,
vibration = true,
dnd = false,
battery_percent = 85,
battery_status = "Not charging",
storage_used = 32,
storage_total = 128
}
-- Initialize settings
function initSettings(doc)
print("[Settings] Initializing...")
settings_doc = doc
updateAllToggles()
updateAllSubtitles()
end
-- Update all toggle states
function updateAllToggles()
updateToggle("wifi", settings_state.wifi)
updateToggle("bluetooth", settings_state.bluetooth)
updateToggle("airplane", settings_state.airplane_mode)
updateToggle("location", settings_state.location)
end
-- Update a single toggle
function updateToggle(name, state)
if not settings_doc then return end
local toggle = settings_doc:GetElementById("toggle-" .. name)
if toggle then
if state then
toggle:SetClass("active", true)
else
toggle:SetClass("active", false)
end
end
end
-- Update all subtitles
function updateAllSubtitles()
if not settings_doc then return end
-- WiFi
local wifi_sub = settings_doc:GetElementById("subtitle-wifi")
if wifi_sub then
if settings_state.wifi then
wifi_sub.inner_rml = "Connected to " .. settings_state.wifi_network
else
wifi_sub.inner_rml = "Off"
end
end
-- Bluetooth
local bt_sub = settings_doc:GetElementById("subtitle-bluetooth")
if bt_sub then
bt_sub.inner_rml = settings_state.bluetooth and "On" or "Off"
end
-- Battery
local bat_sub = settings_doc:GetElementById("subtitle-battery")
if bat_sub then
bat_sub.inner_rml = settings_state.battery_percent .. "% - " .. settings_state.battery_status
end
-- Storage
local storage_sub = settings_doc:GetElementById("subtitle-storage")
if storage_sub then
storage_sub.inner_rml = settings_state.storage_used .. " GB of " .. settings_state.storage_total .. " GB used"
end
-- Location
local loc_sub = settings_doc:GetElementById("subtitle-location")
if loc_sub then
if settings_state.location then
loc_sub.inner_rml = "On - " .. settings_state.location_mode
else
loc_sub.inner_rml = "Off"
end
end
end
-- Toggle WiFi
function toggleWifi()
settings_state.wifi = not settings_state.wifi
print("[Settings] WiFi: " .. tostring(settings_state.wifi))
updateToggle("wifi", settings_state.wifi)
updateAllSubtitles()
if showToast then
showToast(settings_state.wifi and "WiFi enabled" or "WiFi disabled")
end
end
-- Toggle Bluetooth
function toggleBluetooth()
settings_state.bluetooth = not settings_state.bluetooth
print("[Settings] Bluetooth: " .. tostring(settings_state.bluetooth))
updateToggle("bluetooth", settings_state.bluetooth)
updateAllSubtitles()
if showToast then
showToast(settings_state.bluetooth and "Bluetooth enabled" or "Bluetooth disabled")
end
end
-- Toggle Airplane Mode
function toggleAirplaneMode()
settings_state.airplane_mode = not settings_state.airplane_mode
print("[Settings] Airplane mode: " .. tostring(settings_state.airplane_mode))
if settings_state.airplane_mode then
-- Disable wireless when airplane mode is on
settings_state.wifi = false
settings_state.bluetooth = false
updateToggle("wifi", false)
updateToggle("bluetooth", false)
end
updateToggle("airplane", settings_state.airplane_mode)
updateAllSubtitles()
if showToast then
showToast(settings_state.airplane_mode and "Airplane mode on" or "Airplane mode off")
end
end
-- Toggle Location
function toggleLocation()
settings_state.location = not settings_state.location
print("[Settings] Location: " .. tostring(settings_state.location))
updateToggle("location", settings_state.location)
updateAllSubtitles()
if showToast then
showToast(settings_state.location and "Location enabled" or "Location disabled")
end
end
-- Open WiFi settings
function openWifiSettings()
print("[Settings] Opening WiFi settings...")
if navigateTo then
navigateTo("wifi_settings")
else
if showToast then
showToast("WiFi settings")
end
end
end
-- Open Bluetooth settings
function openBluetoothSettings()
print("[Settings] Opening Bluetooth settings...")
if showToast then
showToast("Bluetooth settings")
end
end
-- Open Display settings
function openDisplaySettings()
print("[Settings] Opening Display settings...")
if navigateTo then
navigateTo("display_settings")
else
if showToast then
showToast("Display settings")
end
end
end
-- Open Sound settings
function openSoundSettings()
print("[Settings] Opening Sound settings...")
if showToast then
showToast("Sound settings")
end
end
-- Open Notifications settings
function openNotificationsSettings()
print("[Settings] Opening Notifications settings...")
if showToast then
showToast("Notification settings")
end
end
-- Open Battery settings
function openBatterySettings()
print("[Settings] Opening Battery settings...")
if showToast then
showToast("Battery: " .. settings_state.battery_percent .. "%")
end
end
-- Open Storage settings
function openStorageSettings()
print("[Settings] Opening Storage settings...")
if showToast then
local used_percent = math.floor(settings_state.storage_used / settings_state.storage_total * 100)
showToast("Storage: " .. used_percent .. "% used")
end
end
-- Open Lock Screen settings
function openLockScreenSettings()
print("[Settings] Opening Lock Screen settings...")
if showToast then
showToast("Lock screen settings")
end
end
-- Open Privacy settings
function openPrivacySettings()
print("[Settings] Opening Privacy settings...")
if showToast then
showToast("Privacy settings")
end
end
-- Open Location settings
function openLocationSettings()
print("[Settings] Opening Location settings...")
if showToast then
showToast("Location settings")
end
end
-- Open About Phone
function openAboutPhone()
print("[Settings] Opening About Phone...")
if navigateTo then
navigateTo("about_phone")
else
if showToast then
showToast("Mosis Virtual Phone v1.0")
end
end
end
-- Open User Profile
function openUserProfile()
print("[Settings] Opening User Profile...")
if showToast then
showToast("User profile")
end
end
-- Search settings
function searchSettings(query)
print("[Settings] Searching: " .. query)
-- TODO: Implement settings search
end
-- Get setting value
function getSetting(key)
return settings_state[key]
end
-- Set setting value
function setSetting(key, value)
settings_state[key] = value
print("[Settings] Set " .. key .. " = " .. tostring(value))
updateAllToggles()
updateAllSubtitles()
end

View File

@@ -6,6 +6,7 @@
<link type="text/rcss" href="../../ui/layout.rcss"/>
<script src="../../scripts/navigation.lua"></script>
<script src="../../scripts/layout.lua"></script>
<script src="settings.lua"></script>
<title>Settings</title>
<style>
.settings-list {
@@ -46,6 +47,10 @@
background-color: #252525;
}
.settings-item:active {
background-color: #2A2A2A;
}
.settings-item + .settings-item {
border-top: 1px #333333;
}
@@ -63,6 +68,7 @@
width: 32px;
height: 32px;
opacity: 0.7;
pointer-events: none;
}
.settings-content {
@@ -95,6 +101,10 @@
position: relative;
}
.settings-toggle:hover {
background-color: #777777;
}
.settings-toggle.active {
background-color: rgba(187, 134, 252, 0.5);
}
@@ -160,7 +170,7 @@
}
</style>
</head>
<body class="app-screen" onload="initLayout(document)">
<body class="app-screen" onload="initLayout(document); initSettings(document)">
<!-- System Status Bar -->
<div class="system-status-bar">
<span id="status-time" class="system-status-time">12:30</span>
@@ -188,7 +198,7 @@
<div class="app-content with-nav">
<div class="settings-list">
<!-- User Card -->
<div class="user-card">
<div class="user-card" onclick="openUserProfile()">
<div class="user-avatar">U</div>
<div class="user-info">
<div class="user-name">User</div>
@@ -200,38 +210,38 @@
<!-- Network Section -->
<div class="settings-section">
<div class="settings-header">Network</div>
<div class="settings-item">
<div class="settings-item" onclick="openWifiSettings()">
<div class="settings-icon">
<img src="../../icons/wifi.tga"/>
</div>
<div class="settings-content">
<div class="settings-title">Wi-Fi</div>
<div class="settings-subtitle">Connected to MosisNetwork</div>
<div class="settings-subtitle" id="subtitle-wifi">Connected to MosisNetwork</div>
</div>
<div class="settings-toggle active">
<div id="toggle-wifi" class="settings-toggle active" onclick="toggleWifi(); event.stopPropagation();">
<div class="settings-toggle-thumb"></div>
</div>
</div>
<div class="settings-item">
<div class="settings-item" onclick="openBluetoothSettings()">
<div class="settings-icon">
<img src="../../icons/signal.tga"/>
<img src="../../icons/bluetooth.tga"/>
</div>
<div class="settings-content">
<div class="settings-title">Bluetooth</div>
<div class="settings-subtitle">Off</div>
<div class="settings-subtitle" id="subtitle-bluetooth">Off</div>
</div>
<div class="settings-toggle">
<div id="toggle-bluetooth" class="settings-toggle" onclick="toggleBluetooth(); event.stopPropagation();">
<div class="settings-toggle-thumb"></div>
</div>
</div>
<div class="settings-item">
<div class="settings-icon">
<img src="../../icons/signal.tga"/>
<img src="../../icons/airplane.tga"/>
</div>
<div class="settings-content">
<div class="settings-title">Airplane Mode</div>
</div>
<div class="settings-toggle">
<div id="toggle-airplane" class="settings-toggle" onclick="toggleAirplaneMode()">
<div class="settings-toggle-thumb"></div>
</div>
</div>
@@ -240,9 +250,9 @@
<!-- Device Section -->
<div class="settings-section">
<div class="settings-header">Device</div>
<div class="settings-item">
<div class="settings-item" onclick="openDisplaySettings()">
<div class="settings-icon">
<img src="../../icons/settings.tga"/>
<img src="../../icons/brightness.tga"/>
</div>
<div class="settings-content">
<div class="settings-title">Display</div>
@@ -250,9 +260,9 @@
</div>
<span class="settings-action">></span>
</div>
<div class="settings-item">
<div class="settings-item" onclick="openSoundSettings()">
<div class="settings-icon">
<img src="../../icons/music.tga"/>
<img src="../../icons/volume.tga"/>
</div>
<div class="settings-content">
<div class="settings-title">Sound</div>
@@ -260,9 +270,9 @@
</div>
<span class="settings-action">></span>
</div>
<div class="settings-item">
<div class="settings-item" onclick="openNotificationsSettings()">
<div class="settings-icon">
<img src="../../icons/message.tga"/>
<img src="../../icons/notifications.tga"/>
</div>
<div class="settings-content">
<div class="settings-title">Notifications</div>
@@ -270,23 +280,23 @@
</div>
<span class="settings-action">></span>
</div>
<div class="settings-item">
<div class="settings-item" onclick="openBatterySettings()">
<div class="settings-icon">
<img src="../../icons/battery.tga"/>
</div>
<div class="settings-content">
<div class="settings-title">Battery</div>
<div class="settings-subtitle">85% - 4h 30m remaining</div>
<div class="settings-subtitle" id="subtitle-battery">85% - Not charging</div>
</div>
<span class="settings-action">></span>
</div>
<div class="settings-item">
<div class="settings-item" onclick="openStorageSettings()">
<div class="settings-icon">
<img src="../../icons/files.tga"/>
<img src="../../icons/storage.tga"/>
</div>
<div class="settings-content">
<div class="settings-title">Storage</div>
<div class="settings-subtitle">32 GB of 128 GB used</div>
<div class="settings-subtitle" id="subtitle-storage">32 GB of 128 GB used</div>
</div>
<span class="settings-action">></span>
</div>
@@ -295,9 +305,9 @@
<!-- Privacy Section -->
<div class="settings-section">
<div class="settings-header">Privacy &amp; Security</div>
<div class="settings-item">
<div class="settings-item" onclick="openLockScreenSettings()">
<div class="settings-icon">
<img src="../../icons/account.tga"/>
<img src="../../icons/lock.tga"/>
</div>
<div class="settings-content">
<div class="settings-title">Lock Screen</div>
@@ -305,9 +315,9 @@
</div>
<span class="settings-action">></span>
</div>
<div class="settings-item">
<div class="settings-item" onclick="openPrivacySettings()">
<div class="settings-icon">
<img src="../../icons/account.tga"/>
<img src="../../icons/privacy.tga"/>
</div>
<div class="settings-content">
<div class="settings-title">Privacy</div>
@@ -315,15 +325,15 @@
</div>
<span class="settings-action">></span>
</div>
<div class="settings-item">
<div class="settings-item" onclick="openLocationSettings()">
<div class="settings-icon">
<img src="../../icons/maps.tga"/>
<img src="../../icons/location.tga"/>
</div>
<div class="settings-content">
<div class="settings-title">Location</div>
<div class="settings-subtitle">On - High accuracy</div>
<div class="settings-subtitle" id="subtitle-location">On - High accuracy</div>
</div>
<div class="settings-toggle active">
<div id="toggle-location" class="settings-toggle active" onclick="toggleLocation(); event.stopPropagation();">
<div class="settings-toggle-thumb"></div>
</div>
</div>
@@ -332,7 +342,7 @@
<!-- About Section -->
<div class="settings-section">
<div class="settings-header">About</div>
<div class="settings-item">
<div class="settings-item" onclick="openAboutPhone()">
<div class="settings-icon">
<img src="../../icons/phone.tga"/>
</div>