basic styling added

removed old js scripts
app js working fully"
2024-03-28 13:57:39 -04:00 · 2024-03-28 13:09:17 -04:00 · 2024-03-28 13:08:22 -04:00 · 2024-03-28 12:44:15 -04:00
6 changed files with 204 additions and 182 deletions
--- a/app/src/main/assets/index.html
+++ b/app/src/main/assets/index.html
@ -1,27 +1,28 @@
 <!DOCTYPE html>
 <html xmlns="http://www.w3.org/1999/xhtml">
-  <head>
-    <script src="https://cdn.tailwindcss.com"></script>
+
+<head>
+  <!--<script src="https://cdn.tailwindcss.com"></script>-->
  <link rel="stylesheet" href="style/output.css" />
-    <script src="js/main.js"></script>
  <meta name="viewport" content="width=device-width, initial-scale=1" />
-  </head>
-  <body class="bg-primary grid-cols-1 text-center text-text">
-    <div class="container">
-      <div class="settings">
-        <img src="file:///android_asset/images/cog.png" alt="cog" />
-        <div class="theme-dropdown">
-          <label for="theme-select"> </label>
-          <select id="theme-select">
+</head>
+
+<body class="bg-bgPrimary text-text text-center">
+<div class="container border-solid border-1 border-bgInverted p-4">
+  <div class="settings rounded-md bg-bgSecondary p-1">
+    <img src="file:///android_asset/images/cog.png" alt="cog" class="w-16 h-8 w-8 t-2 l-2" />
+    <div class="theme-dropdown mt-4">
+      <label for="theme-select"></label>
+      <select id="theme-select" class="p-1 rounded-md bg-bgPrimary text-text">
        <option value="dark">Dark</option>
        <option value="lava">Lava</option>
        <option value="midnight">Midnight</option>
        <option value="solar">Solar</option>
      </select>
    </div>
-        <div class="currency-dropdown">
-          <label for="currency-select"> </label>
-          <select id="currency-select">
+    <div class="currency-dropdown mt-4">
+      <label for="currency-select"></label>
+      <select id="currency-select" class="p-1 rounded-md bg-bgPrimary text-text">
        <option value="usd">U.S. Dollar</option>
        <option value="ars">Argentine Peso</option>
        <option value="brl">Brazilian Real</option>
@ -41,50 +42,54 @@
      </select>
    </div>
  </div>
-    </div>
+</div>

-    <div class="container">
+<div class="container mt-8">
  <div class="price-display">
    <div class="bitcoin-logo">
-          <img src="file:///android_asset/images/logo.png" alt="BTC" />
-        </div>
-        <div id="bitcoin-price"></div>
+      <img src="file:///android_asset/images/logo.png" alt="BTC" class="w-16 mx-auto" />
    </div>
+    <div id="bitcoin-price" class="text-2xl font-semibold mt-4">Bitcoin Price: <span id="price-value">Loading...</span></div>
  </div>
+</div>

-    <div class="container">
-      <div id="dollars-to-sats"></div>
+<div class="container mt-8">
+  <div class="flex justify-center">
+    <div class="w-64">
+     <div id="dollars-to-sats" class="text-lg font-semibold"></div>
    </div>
+  </div>
+</div>

-    <div class="container">
+<div class="container mt-8">
  <div class="satstodollars">
-        <h2>Sats to fiat Calc</h2>
-        <label for="sats-input">Enter the amount of Bitcoin in satoshis:</label>
-        <br />
-        <input type="number" id="sats-input" />
-        <br />
-        <output id="dollars-output"></output>
-      </div>
+    <h2 class="text-xl font-semibold mb-4">Sats to Fiat Calculator</h2>
+    <label for="sats-input" class="block mb-2">Enter the amount of Bitcoin in satoshis:</label>
+    <input type="number" id="sats-input" class="w-3/4 p-2 border-2 border-bgSecondary rounded-md mb-4" placeholder="Enter amount in satoshis" />
+    <output id="dollars-output" class="block text-lg font-semibold">Converted Fiat: <span id="fiat-output">0</span></output>
  </div>
+</div>

+<div class="container mt-8 p-4">
  <div id="exchange">
-      <h2>Buy Bitcoin Here 👇</h2>
+    <h2 class="text-2xl font-semibold mb-4">Buy Bitcoin Here 👇</h2>
+    <div class="flex justify-around">
      <div class="app-image">
-        <a href="https://www.swanbitcoin.com/oceanslim"
-          ><img src="file:///android_asset/images/swan.png" alt="App 1"
-        /></a>
+        <a href="https://www.swanbitcoin.com/oceanslim"><img src="file:///android_asset/images/swan.png"
+                                                             alt="App 1" class="w-32 mx-auto rounded-3xl p-1" /></a>
      </div>
      <div class="app-image">
-        <a href="https://river.com/signup?r=5WLPVSJQ"
-          ><img src="file:///android_asset/images/river.png" alt="App 2"
-        /></a>
+        <a href="https://river.com/signup?r=5WLPVSJQ"><img src="file:///android_asset/images/river.png"
+                                                           alt="App 2" class="w-32 mx-auto rounded-3xl p-1" /></a>
      </div>
      <div class="app-image">
-        <a href="https://cash.app/app/HRPBCNS"
-          ><img src="file:///android_asset/images/cashapp.png" alt="App 3"
-        /></a>
+        <a href="https://cash.app/app/HRPBCNS"><img src="file:///android_asset/images/cashapp.png"
+                                                    alt="App 3" class="w-32 mx-auto rounded-3xl p-1" /></a>
      </div>
    </div>
-    <script type="module" src="js/main.js"></script>
-  </body>
+  </div>
+</div>
+<!--<script type="module" src="js/main.js"></script>-->
+</body>
+
 </html>
--- a/app/src/main/assets/js/calcSatsToFiat.js
+++ b/app/src/main/assets/js/calcSatsToFiat.js
@ -1,26 +0,0 @@
-// satsToDollarsCalc.js
-export function updateSatsToDollarsConversion() {
-    const satsInputElement = document.getElementById('sats-input');
-    const dollarsOutputElement = document.getElementById('dollars-output');
-
-    const satsValue = parseFloat(satsInputElement.value);
-
-    if (!isNaN(satsValue)) {
-        const currencySelect = document.getElementById('currency-select');
-        const selectedCurrency = currencySelect.value;
-
-        fetch(`https://api.coingecko.com/api/v3/simple/price?ids=bitcoin&vs_currencies=${selectedCurrency}`)
-            .then(response => response.json())
-            .then(data => {
-                const bitcoinPrice = data['bitcoin'][selectedCurrency];
-                const satsConversionFactor = 100000000; // 1 bitcoin = 100 million sats
-
-                const dollarsValue = (satsValue / satsConversionFactor) * bitcoinPrice;
-
-                dollarsOutputElement.textContent = `${dollarsValue.toFixed(2)} ${selectedCurrency.toUpperCase()}`;
-            })
-            .catch(error => console.error(error));
-    } else {
-        dollarsOutputElement.textContent = '';
-    }
-}
--- a/app/src/main/assets/js/main.js
+++ b/app/src/main/assets/js/main.js
@ -1,8 +1,8 @@
-import "/style/output.css";
+//import "/style/output.css";

-import { updateFiatToSatsConversion } from "./viewFiatToSats";
+//import { updateFiatToSatsConversion } from "./viewFiatToSats";
 //import { updateBitcoinPrice, refreshBitcoinPrice } from "./viewBitcoinPrice";
-import { updateSatsToDollarsConversion } from "./calcSatsToFiat";
+//import { updateSatsToDollarsConversion } from "./calcSatsToFiat";

 function updateBitcoinPrice(selectedCurrency) {
    fetch(`https://api.coingecko.com/api/v3/simple/price?ids=bitcoin&vs_currencies=${selectedCurrency}`)
@ -15,15 +15,58 @@ function updateBitcoinPrice(selectedCurrency) {
        })
        .catch(error => console.error(error));
 }
+//function refreshBitcoinPrice(selectedCurrency) {
+//    updateBitcoinPrice(selectedCurrency);
+//    setInterval(() => updateBitcoinPrice(selectedCurrency), 300000);
+//}

-updateBitcoinPrice('usd');
+function updateSatsToDollarsConversion() {
+    const satsInputElement = document.getElementById('sats-input');
+    const dollarsOutputElement = document.getElementById('dollars-output');
+
+    const satsValue = parseFloat(satsInputElement.value);
+
+    if (!isNaN(satsValue)) {
+        const currencySelect = document.getElementById('currency-select');
+        const selectedCurrency = currencySelect.value;
+
+        fetch(`https://api.coingecko.com/api/v3/simple/price?ids=bitcoin&vs_currencies=${selectedCurrency}`)
+            .then(response => response.json())
+            .then(data => {
+            const bitcoinPrice = data['bitcoin'][selectedCurrency];
+            const satsConversionFactor = 100000000; // 1 bitcoin = 100 million sats
+
+            const dollarsValue = (satsValue / satsConversionFactor) * bitcoinPrice;
+
+            dollarsOutputElement.textContent = `${dollarsValue.toFixed(2)} ${selectedCurrency.toUpperCase()}`;
+        })
+            .catch(error => console.error(error));
+    } else {
+        dollarsOutputElement.textContent = '';
+    }
+}
+
+function updateFiatToSatsConversion(selectedCurrency) {
+    fetch(`https://api.coingecko.com/api/v3/simple/price?ids=bitcoin&vs_currencies=${selectedCurrency}`)
+        .then(response => response.json())
+        .then(data => {
+        const bitcoinPrice = data['bitcoin'][selectedCurrency];
+        const satsConversionFactor = 100000000;
+        const currencyValue = 1;
+        const sats = (currencyValue / bitcoinPrice) * satsConversionFactor;
+        const currencyToSatsElement = document.getElementById('dollars-to-sats');
+        currencyToSatsElement.textContent = `1 ${selectedCurrency.toUpperCase()} = ${sats.toFixed(0)} sats`;
+    })
+        .catch(error => console.error(error));
+}

 document.addEventListener('DOMContentLoaded', () => {
    const satsInputElement = document.getElementById('sats-input');
    const currencySelect = document.getElementById('currency-select');
-
+    const selectedCurrency = currencySelect.value;
    // Initially fetch Bitcoin price in USD
-    updateBitcoinPrice('usd');
+    updateBitcoinPrice(selectedCurrency);
+    updateFiatToSatsConversion(selectedCurrency)

    satsInputElement.addEventListener('input', updateSatsToDollarsConversion);

@ -32,8 +75,8 @@ document.addEventListener('DOMContentLoaded', () => {
        updateBitcoinPrice(selectedCurrency);
        updateFiatToSatsConversion(selectedCurrency);
        updateSatsToDollarsConversion(selectedCurrency);
+        updateFiatToSatsConversion(selectedCurrency)
    });
-
-    refreshBitcoinPrice('usd'); // Refresh Bitcoin price in USD
-
 });
+
+
--- a/app/src/main/assets/js/viewBitcoinPrice.js
+++ b/app/src/main/assets/js/viewBitcoinPrice.js
@ -1,17 +0,0 @@
-// bitcoinPriceTracker.js
-export function updateBitcoinPrice(selectedCurrency) {
-    fetch(`https://api.coingecko.com/api/v3/simple/price?ids=bitcoin&vs_currencies=${selectedCurrency}`)
-        .then(response => response.json())
-        .then(data => {
-            const bitcoinPrice = data['bitcoin'][selectedCurrency];
-            const bitcoinPriceElement = document.getElementById('bitcoin-price');
-            const formattedPrice = `${selectedCurrency.toUpperCase()} ` + bitcoinPrice.toLocaleString(undefined, { minimumFractionDigits: 0, maximumFractionDigits: 0 });
-            bitcoinPriceElement.textContent = formattedPrice;
-        })
-        .catch(error => console.error(error));
-}
-
-export function refreshBitcoinPrice(selectedCurrency) {
-    updateBitcoinPrice(selectedCurrency);
-    setInterval(() => updateBitcoinPrice(selectedCurrency), 300000);
-}
--- a/app/src/main/assets/js/viewFiatToSats.js
+++ b/app/src/main/assets/js/viewFiatToSats.js
@ -1,14 +0,0 @@
-// fiatToSatsConverter.js
-export function updateFiatToSatsConversion(selectedCurrency) {
-    fetch(`https://api.coingecko.com/api/v3/simple/price?ids=bitcoin&vs_currencies=${selectedCurrency}`)
-        .then(response => response.json())
-        .then(data => {
-            const bitcoinPrice = data['bitcoin'][selectedCurrency];
-            const satsConversionFactor = 100000000;
-            const currencyValue = 1;
-            const sats = (currencyValue / bitcoinPrice) * satsConversionFactor;
-            const currencyToSatsElement = document.getElementById('dollars-to-sats');
-            currencyToSatsElement.textContent = `1 ${selectedCurrency.toUpperCase()} = ${sats.toFixed(0)} sats`;
-        })
-        .catch(error => console.error(error));
-}
--- a/app/src/main/java/com/example/satworth/MainActivity.kt
+++ b/app/src/main/java/com/example/satworth/MainActivity.kt
@ -1,69 +1,100 @@
 package com.example.satworth

 import android.annotation.SuppressLint
-import android.content.res.AssetManager
 import androidx.appcompat.app.AppCompatActivity
 import android.os.Bundle
-import android.webkit.WebChromeClient
-import android.webkit.WebResourceRequest
-import android.webkit.WebSettings
 import android.webkit.WebView
-import android.webkit.WebViewClient
+import android.webkit.WebSettings
 import java.io.IOException

 class MainActivity : AppCompatActivity() {
+
    private lateinit var webView: WebView

+    @SuppressLint("SetJavaScriptEnabled")
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

+        // Get the WebView reference from the layout
        webView = findViewById(R.id.webView)
-        setupWebView()
-        loadWebView()
-    }

-    @SuppressLint("SetJavaScriptEnabled")
-    private fun setupWebView() {
-        webView.settings.apply {
-            javaScriptEnabled = true
-            loadWithOverviewMode = true
-            useWideViewPort = true
-            domStorageEnabled = true
-            cacheMode = WebSettings.LOAD_NO_CACHE
-        }
+        // Enable JavaScript support
+        val webSettings: WebSettings = webView.settings
+        webSettings.javaScriptEnabled = true

-        webView.webViewClient = object : WebViewClient() {
-            override fun shouldOverrideUrlLoading(
-                view: WebView?,
-                request: WebResourceRequest?
-            ): Boolean {
-                view?.loadUrl(request?.url.toString())
-                return true
-            }
-        }
-
-        webView.webChromeClient = object : WebChromeClient() {
-            // You can override other WebChromeClient methods if needed
-        }
-    }
-
-
-    private fun loadScripts(assetManager: AssetManager) {
-        try {
-            assetManager.loadUrl("file:///android_asset/js/main.js")
+        // Clear the WebView cache (optional)
+        webView.clearCache(true)

+        // Load the HTML content from the "app.html" file
+        val htmlContent = try {
+            // Load the HTML content from the "app.html" file
+            assets.open("index.html").bufferedReader().use { it.readText() }
        } catch (e: IOException) {
            e.printStackTrace()
-            // Return placeholder for error cases
-            "/* Error loading scripts */"
+            // If loading HTML fails, set some default content
+            "<html><body><h1>Error loading HTML</h1></body></html>"
        }

+        val assetManager = assets
+        val scriptFiles = listOf(
+            "js/main.js",
+            //"scripts/selectTheme.js",
+            //"scripts/viewBitcoinPrice.js",
+            //"scripts/viewFiatToSats.js",
+            //"scripts/selectCurrency.js",
+            //"scripts/calcSatsToFiat.js"
+        )

+        val scriptContents = scriptFiles.map { fileName ->
+            try {
+                assetManager.open(fileName).bufferedReader().use { it.readText() }
+            } catch (e: IOException) {
+                e.printStackTrace()
+                "/* Error loading script: $fileName */"
            }
-    private fun loadWebView() {
-        loadScripts()
-        webView.loadUrl("file:///android_asset/index.html")
+        }
+
+        val cssFiles = listOf(
+            "style/output.css"
+            //"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>
+</head>
+<body>
+    $htmlContent
+    <script> type="module" $javaScriptCode</script>
+</body>
+</html>
+""".trimIndent()
+
+        // Define the base URL for resolving relative paths (e.g., image source)
+        val baseUrl = "file:///android_asset/"
+
+        webView.loadDataWithBaseURL(null, finalHtmlContent, "text/html", "UTF-8", null)
    }
 }
-
Author	SHA1	Message	Date
0ceanSlim	e5504fd8b6	basic styling added	2024-03-28 13:57:39 -04:00
0ceanSlim	ff8eaec590	removed old js scripts	2024-03-28 13:09:17 -04:00
0ceanSlim	33f3607c20	app js working fully"	2024-03-28 13:08:22 -04:00
0ceanSlim	3b142d20a4	basic price working	2024-03-28 12:44:15 -04:00