Merge pull request #3 from kumitterer/main

Server-side calculations for JavaScript-free environments
This commit is contained in:
rottenwheel 2024-08-11 19:34:42 +00:00 committed by GitHub
commit 2ecf7c6835
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 93 additions and 29 deletions

View file

@ -4,6 +4,10 @@ header("Cache-Control: no-store, no-cache, must-revalidate, max-age=0");
header("Cache-Control: post-check=0, pre-check=0", false);
header("Pragma: no-cache");
$protocol = (!empty($_SERVER['HTTPS']) && $_SERVER['HTTPS'] !== 'off' || $_SERVER['SERVER_PORT'] == 443) ? "https://" : "http://";
$currentUrl = $protocol . $_SERVER['HTTP_HOST'] . $_SERVER['REQUEST_URI'];
$parentUrl = dirname($currentUrl);
// Get currency data from JSON
$api_cg = json_decode(file_get_contents('coingecko.json'), true);
@ -52,9 +56,22 @@ $lang = strtolower($lang);
require_once "lang/{$lang}.php";
$xmr_in = isset($_GET["in"]) ? strtoupper(htmlspecialchars($_GET["in"])) : 'EUR';
$xmr_in_fiat = number_format($exchangeRates[$xmr_in], $xmr_in == 'BTC' || $xmr_in == 'LTC' || $xmr_in == 'ETH' || $xmr_in == 'XAG' || $xmr_in == 'XAU' ? 8 : 2);
$xmr_amount = isset($_GET["xmr"]) ? floatval($_GET["xmr"]) : 1;
$fiat_amount = isset($_GET["fiat"]) ? floatval($_GET["fiat"]) : '';
$conversion_direction = isset($_GET["direction"]) ? intval($_GET["direction"]) : 0;
$xmr_in_fiat = strtr($xmr_in_fiat, ",", " ");
if ($conversion_direction == 0) {
$fiat_value = $xmr_amount * $exchangeRates[$xmr_in];
$xmr_value = $xmr_amount;
} else {
$xmr_value = $fiat_amount / $exchangeRates[$xmr_in];
$fiat_value = $fiat_amount;
}
$fiat_value = number_format($fiat_value, ($xmr_in == 'BTC' || $xmr_in == 'LTC' || $xmr_in == 'ETH' || $xmr_in == 'XAG' || $xmr_in == 'XAU') ? 8 : 2);
$xmr_value = number_format($xmr_value, 12);
$fiat_value = strtr($fiat_value, ",", " ");
// Order preferred currencies to the top
foreach (array_reverse($preferred_currencies) as $currency) {
@ -81,7 +98,7 @@ foreach (array_reverse($preferred_currencies) as $currency) {
<meta property="og:title" content="<?php echo $page_title; ?>" />
<meta property="og:description" content="<?php echo $meta_description; ?>" />
<meta property="og:image" content="img/mstile-310x150.png" />
<meta property="og:image" content="<?php echo $parentUrl; ?>/img/mstile-310x150.png" />
<meta property="og:type" content="website" />
<link rel="apple-touch-icon-precomposed" sizes="57x57" href="img/apple-touch-icon-57x57.png" />
@ -143,29 +160,46 @@ foreach (array_reverse($preferred_currencies) as $currency) {
</div>
<hr class="gold" />
<div class="input-group">
<button id="copyXMRBtn" class="btn-outline-secondary input-group-text clipboard-copy" title="<?php echo $clipboard_copy_tooltip; ?>" data-toggle="tooltip" data-bs-html="true" data-placement="top">&#128203;</button>
<input class="form-control" id="xmrInput" type="text" spellcheck="false" autocorrect="off" inputmode="numeric" aria-label="<?php echo $l_xmrInput; ?>" aria-describedby="basic-addon-xmr" value="1">
<input class="input-group-text" id="basic-addon-xmr" type="text" value="XMR" aria-label="Monero" disabled>
</div>
<form method="get" action="">
<div class="input-group mb-3">
<button id="copyXMRBtn" class="btn-outline-secondary input-group-text clipboard-copy" title="<?php echo $clipboard_copy_tooltip; ?>" data-toggle="tooltip" data-bs-html="true" data-placement="top">&#128203;</button>
<input class="form-control" id="xmrInput" name="xmr" type="text" spellcheck="false" autocorrect="off" inputmode="numeric" aria-label="<?php echo $l_xmrInput; ?>" aria-describedby="basic-addon-xmr" value="<?php echo $xmr_value; ?>">
<input class="input-group-text" id="basic-addon-xmr" type="text" value="XMR" aria-label="Monero" disabled>
</div>
<div class="equals-box">
<span class="equals-text cursor-default">=</span>
</div>
<div class="equals-box mb-3">
<button id="convertXMRToFiat" type="submit" name="direction" value="0" class="btn btn-arrow">
<span class="equals-text">&darr;</span>
</button>
<button type="button" class="btn btn-equals">
<span class="equals-text cursor-default">=</span>
</button>
<button id="convertFiatToXMR" type="submit" name="direction" value="1" class="btn btn-arrow">
<span class="equals-text">&uarr;</span>
</button>
</div>
<div class="fiatDiv input-group">
<button id="copyFiatBtn" class="btn-outline-secondary input-group-text clipboard-copy" title="<?php echo $clipboard_copy_tooltip; ?>" data-toggle="tooltip" data-bs-html="true" data-placement="top">&#128203;</button>
<input class="form-control" id="fiatInput" type="text" spellcheck="false" autocorrect="off" inputmode="numeric" aria-label="<?php echo $l_fiatInput; ?>" value="<?php echo $xmr_in_fiat; ?>">
<select class="input-group-text cursor-pointer" id="selectBox" aria-label="<?php echo $l_fiatSelect; ?>">
<?php
foreach ($currencies as $currency) {
$selected = $currency == $xmr_in ? 'selected' : '';
$currencyName = isset(${"l_" . strtolower($currency)}) ? ${"l_" . strtolower($currency)} : $currency;
echo "<option {$selected} value=\"{$currency}\">{$currencyName}</option>";
}
?>
</select>
</div>
<div class="fiatDiv input-group mb-3">
<button id="copyFiatBtn" class="btn-outline-secondary input-group-text clipboard-copy" title="<?php echo $clipboard_copy_tooltip; ?>" data-toggle="tooltip" data-bs-html="true" data-placement="top">&#128203;</button>
<input class="form-control" id="fiatInput" name="fiat" type="text" spellcheck="false" autocorrect="off" inputmode="numeric" aria-label="<?php echo $l_fiatInput; ?>" value="<?php echo $fiat_value; ?>">
<select class="input-group-text cursor-pointer" id="selectBox" name="in" aria-label="<?php echo $l_fiatSelect; ?>">
<?php
foreach ($currencies as $currency) {
$selected = $currency == $xmr_in ? 'selected' : '';
$currencyName = isset(${"l_" . strtolower($currency)}) ? ${"l_" . strtolower($currency)} : $currency;
echo "<option {$selected} value=\"{$currency}\">{$currencyName}</option>";
}
?>
</select>
</div>
</form>
<noscript>
<div class="alert alert-warning" role="alert">
Looks like you have JavaScript disabled. You can still use this tool, but you won't be able to use the &#128203; buttons to automatically copy the results to your clipboard.<br />
Use the &darr; button to convert XMR to fiat, or the &uarr; button to convert fiat to XMR.
</div>
</noscript>
<hr class="gold" />
<small class="cursor-default text-white text-info" lang="<?php echo $lang_meta; ?>">
@ -195,11 +229,7 @@ foreach (array_reverse($preferred_currencies) as $currency) {
</div>
</div>
<script>
var exchangeRates = <?php echo json_encode($exchangeRates); ?>;
</script>
<script src="js/main.js"></script>
</body>
</html>

View file

@ -51,6 +51,32 @@ input.form-control {
color: #e9ecef;
font-weight: 800;
font-size: 42px;
padding-bottom: 1;
}
.btn-arrow {
border: 1px solid white;
border-radius: 10px;
font-size: 38px !important;
color: white;
padding: 0;
cursor: pointer;
}
.btn-arrow:hover {
border: 1px solid black;
color: black;
}
.btn-equals {
font-size: 38px !important;
color: white;
padding: 0;
cursor: default;
}
.btn-equals:hover {
color: black;
}
.equals-text {

View file

@ -14,12 +14,16 @@ console.log(tooltipList);
let lastModifiedField = 'xmr';
var exchangeRates = {};
document.addEventListener('DOMContentLoaded', function () {
const copyXMRBtn = document.getElementById('copyXMRBtn');
const copyFiatBtn = document.getElementById('copyFiatBtn');
const xmrInput = document.getElementById('xmrInput');
const fiatInput = document.getElementById('fiatInput');
const selectBox = document.getElementById('selectBox');
const convertXMRToFiatBtn = document.getElementById('convertXMRToFiat');
const convertFiatToXMRBtn = document.getElementById('convertFiatToXMR');
// Add event listeners for the copy buttons
copyXMRBtn.addEventListener('click', copyToClipBoardXMR);
@ -62,6 +66,10 @@ document.addEventListener('DOMContentLoaded', function () {
}
});
// Hide the conversion buttons if JavaScript is enabled
convertXMRToFiatBtn.style.display = 'none';
convertFiatToXMRBtn.style.display = 'none';
// Fetch updated exchange rates immediately, then every 5 seconds
fetchUpdatedExchangeRates();
setInterval(fetchUpdatedExchangeRates, 5000);

View file

@ -31,7 +31,7 @@ module.exports = {
paths: glob.sync([
path.join(__dirname, 'index.php')
]),
safelist: ['tooltip', 'fade', 'show', 'bs-tooltip-top', 'tooltip-inner', 'tooltip-arrow']
safelist: ['tooltip', 'fade', 'show', 'bs-tooltip-top', 'tooltip-inner', 'tooltip-arrow', 'btn-equals', 'btn-arrow', 'alert', 'alert-warning']
})
]
};