OceanSlim
/
SatWorth
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

selectTheme.js added, debugging theme-select

This commit is contained in:
0ceanSlim 2023-09-18 10:15:51 -04:00
parent 1b9fc58bde
commit 444601f0cb
3 changed files with 76 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
app/src/main/assets/app.html
View File

@ -2,9 +2,8 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="stylesheet" type="text/css" href="themes/*">
<link rel="stylesheet" type="text/css" href="styles/*">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="themes/Dark.css">
</head>
<body>
@ -13,10 +12,10 @@
<div class="theme-dropdown">
<label for="theme-select"> </label>
<select id="theme-select">
<option value="Dark">Dark</option>
<option value="Lava">Lava</option>
<option value="Midnight">Midnight</option>
<option value="Solar">Solar</option>
<option value="Dark.css">Dark</option>
<option value="Lava.css">Lava</option>
<option value="Midnight.css">Midnight</option>
<option value="Solar.css">Solar</option>
</select>
</div>
<div class="currency-dropdown">
@ -81,4 +80,5 @@
</div>
</body>
</html>

20
app/src/main/assets/scripts/selectTheme.js Normal file
View File

@ -0,0 +1,20 @@
// Function to change the theme based on the selected option
function changeTheme() {
console.log("changeTheme() called"); // Add this line
var themeSelect = document.getElementById("theme-select");
var selectedTheme = themeSelect.value;
// Construct the theme CSS file path based on the selected theme
var themeCSSFile = "themes/" + selectedTheme + ".css";
// Set the theme CSS file as the stylesheet link's href
var styleSheet = document.querySelector('link[href^="themes/"]');
styleSheet.href = themeCSSFile;
}
// Add an event listener to the theme dropdown to change the theme on selection change
document.getElementById("theme-select").addEventListener("change", changeTheme);
// Initial theme setup when the page loads
console.log("Initial theme setup"); // Add this line
changeTheme(); // This line was missing in your previous code

77
app/src/main/java/com/example/satworth/MainActivity.kt
View File

@ -10,6 +10,7 @@ import java.io.IOException
class MainActivity : AppCompatActivity() {
private lateinit var webView: WebView
private lateinit var currentThemeCSSCode: String
@SuppressLint("SetJavaScriptEnabled")
override fun onCreate(savedInstanceState: Bundle?) {
@ -26,17 +27,42 @@ class MainActivity : AppCompatActivity() {
// Clear the WebView cache (optional)
webView.clearCache(true)
// Load the HTML content from the "app.html" file
// Initialize with the default theme
currentThemeCSSCode = loadThemeCSS("themes/Dark.css")
loadWebViewWithTheme(currentThemeCSSCode)
}
// Function to load WebView with the specified CSS theme code
private fun loadWebViewWithTheme(cssCode: String) {
val assetManager = assets
// Load the HTML content
val htmlContent = try {
// Load the HTML content from the "app.html" file
assets.open("app.html").bufferedReader().use { it.readText() }
assetManager.open("app.html").bufferedReader().use { it.readText() }
} catch (e: IOException) {
e.printStackTrace()
// If loading HTML fails, set some default content
"<html><body><h1>Error loading HTML</h1></body></html>"
}
val assetManager = assets
// Load all styles from the 'styles' directory
val styleFiles = listOf(
"styles/settings.css",
"styles/bitcoinPrice.css",
"styles/exchange.css",
"styles/fiatToSats.css",
"styles/satsToFiat.css"
)
val styleContents = styleFiles.map { fileName ->
try {
assetManager.open(fileName).bufferedReader().use { it.readText() }
} catch (e: IOException) {
e.printStackTrace()
"/* Error loading style: $fileName */"
}
}
// Load the JavaScript code
val scriptFiles = listOf(
"scripts/selectTheme.js",
"scripts/viewBitcoinPrice.js",
@ -54,34 +80,16 @@ class MainActivity : AppCompatActivity() {
}
}
val cssFiles = listOf(
"themes/Dark.css",
//"themes/Midnight.css",
//"themes/Lava.css",
//"themes/Solar.css",
"styles/settings.css",
"styles/bitcoinPrice.css",
"styles/exchange.css",
"styles/fiatToSats.css",
"styles/satsToFiat.css"
) // List of your CSS files
val cssCode = cssFiles.joinToString("\n") { fileName ->
try {
assetManager.open(fileName).bufferedReader().use { it.readText() }
} catch (e: IOException) {
e.printStackTrace()
"/* Error loading $fileName */"
}
}
val javaScriptCode = scriptContents.joinToString("\n")
// Combine the HTML, CSS, and JavaScript code
val finalHtmlContent = """
<html>
<head>
<style type="text/css">$cssCode</style>
<style type="text/css">
${styleContents.joinToString("\n")}
$cssCode
</style>
</head>
<body>
$htmlContent
@ -93,6 +101,21 @@ class MainActivity : AppCompatActivity() {
// Define the base URL for resolving relative paths (e.g., image source)
val baseUrl = "file:///android_asset/"
// Load the WebView with the HTML content and selected theme
webView.loadDataWithBaseURL(null, finalHtmlContent, "text/html", "UTF-8", null)
// Update the current theme CSS code
currentThemeCSSCode = cssCode
}
// Function to load CSS content from a file
private fun loadThemeCSS(cssFile: String): String {
val assetManager = assets
return try {
assetManager.open(cssFile).bufferedReader().use { it.readText() }
} catch (e: IOException) {
e.printStackTrace()
"/* Error loading $cssFile */"
}
}
}