css split from html, accounted for in MainActivity and working
This commit is contained in:
parent
11a0c7beee
commit
05104acbe9
15
app/src/main/assets/index.html
Normal file
15
app/src/main/assets/index.html
Normal file
@ -0,0 +1,15 @@
|
||||
<!DOCTYPE html>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
|
||||
<head>
|
||||
<link rel="stylesheet" type="text/css" href="style.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="bitcointodollars">
|
||||
<h1>Bitcoin Price Tracker</h1>
|
||||
<div id="bitcoin-price"></div>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
</html>
|
10
app/src/main/assets/script.js
Normal file
10
app/src/main/assets/script.js
Normal file
@ -0,0 +1,10 @@
|
||||
// Fetch the Bitcoin price from the CoinGecko API
|
||||
fetch('https://api.coingecko.com/api/v3/simple/price?ids=bitcoin&vs_currencies=usd')
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
const bitcoinPrice = data['bitcoin']['usd'];
|
||||
// Update the Bitcoin price on the website
|
||||
const bitcoinPriceElement = document.getElementById('bitcoin-price');
|
||||
bitcoinPriceElement.textContent = '1 BTC = $' + bitcoinPrice.toFixed(2); // Display the Bitcoin price
|
||||
})
|
||||
.catch(error => console.error(error));
|
35
app/src/main/assets/style.css
Normal file
35
app/src/main/assets/style.css
Normal file
@ -0,0 +1,35 @@
|
||||
/* CSS styles for the Bitcoin Price Tracker */
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
background: #252525;
|
||||
color: #ffffff;
|
||||
font-family: monospace, Arial;
|
||||
font-size: 12px;
|
||||
font-feature-settings: normal;
|
||||
overflow-x: hidden;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.bitcointodollars {
|
||||
width: auto;
|
||||
margin-left: 20px;
|
||||
margin-right: 20px;
|
||||
margin-top: 20px;
|
||||
background-color: #252525;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 8px;
|
||||
padding: 10px;
|
||||
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
h1 {
|
||||
color: #ff7500;
|
||||
}
|
||||
|
||||
#bitcoin-price {
|
||||
font-size: 24px;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
margin: 10px;
|
||||
}
|
@ -24,7 +24,7 @@ class MainActivity : AppCompatActivity() {
|
||||
// Clear the WebView cache (optional)
|
||||
webView.clearCache(true)
|
||||
|
||||
// Load the HTML content from the "bitcoin_price_tracker.html" file
|
||||
// Load the HTML content from the "index.html" file
|
||||
val htmlContent = try {
|
||||
assets.open("index.html").bufferedReader().use { it.readText() }
|
||||
} catch (e: IOException) {
|
||||
@ -33,7 +33,7 @@ class MainActivity : AppCompatActivity() {
|
||||
"<html><body><h1>Error loading HTML</h1></body></html>"
|
||||
}
|
||||
|
||||
// Load the JavaScript code from the "bitcoin_price_tracker.js" file
|
||||
// Load the JavaScript code from the "script.js" file
|
||||
val javaScriptCode = try {
|
||||
assets.open("script.js").bufferedReader().use { it.readText() }
|
||||
} catch (e: IOException) {
|
||||
@ -42,8 +42,27 @@ class MainActivity : AppCompatActivity() {
|
||||
""
|
||||
}
|
||||
|
||||
// Inject the JavaScript code into the HTML content
|
||||
val finalHtmlContent = "$htmlContent<script>$javaScriptCode</script>"
|
||||
// Load the CSS code from the "style.css" file
|
||||
val cssCode = try {
|
||||
assets.open("style.css").bufferedReader().use { it.readText() }
|
||||
} catch (e: IOException) {
|
||||
e.printStackTrace()
|
||||
// If loading CSS fails, set an empty style
|
||||
""
|
||||
}
|
||||
|
||||
// Combine the HTML, CSS, and JavaScript code
|
||||
val finalHtmlContent = """
|
||||
<html>
|
||||
<head>
|
||||
<style type="text/css">$cssCode</style>
|
||||
</head>
|
||||
<body>
|
||||
$htmlContent
|
||||
<script>$javaScriptCode</script>
|
||||
</body>
|
||||
</html>
|
||||
""".trimIndent()
|
||||
|
||||
webView.loadDataWithBaseURL(null, finalHtmlContent, "text/html", "UTF-8", null)
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user