replace PHP in html with js & bugfixes

This commit is contained in:
2022-11-20 03:06:08 +01:00
parent 728b12107f
commit 0d3526221d
22 changed files with 634 additions and 233 deletions

View File

@@ -247,4 +247,8 @@ pre, pre span
{
font-family: Menlo, Consolas, monospace;
background: #F9F9F9;;
}
.display_none {
display: none;
}

View File

@@ -28,33 +28,33 @@
<div class="row responsive-label">
<div class="col-sm-12 col-md-3"><label for="uid" class="doc">UserID</label></div>
<div class="col-sm-12 col-md"><input placeholder="UserID" id="uid" class="doc" <?php echo (isset($_GET['preset_user_id']) ? (' value="'.$_GET['preset_user_id'].'" '):(''));?> type="number"></div>
<div class="col-sm-12 col-md"><input placeholder="UserID" id="uid" class="doc" type="number"></div>
</div>
<div class="row responsive-label">
<div class="col-sm-12 col-md-3"><label for="ukey" class="doc">Authentification Key</label></div>
<div class="col-sm-12 col-md"><input placeholder="Key" id="ukey" class="doc" <?php echo (isset($_GET['preset_user_key']) ? (' value="'.$_GET['preset_user_key'].'" '):(''));?> type="text" maxlength="64"></div>
<div class="col-sm-12 col-md"><input placeholder="Key" id="ukey" class="doc" type="text" maxlength="64"></div>
</div>
<div class="row responsive-label">
<div class="col-sm-12 col-md-3"><label for="prio" class="doc">Priority</label></div>
<div class="col-sm-12 col-md">
<select id="prio" class="doc" type="text" style="width:100%;">
<option value="0" <?php echo (( isset($_GET['preset_priority'])&&$_GET['preset_priority']==='0') ? 'selected':'');?>>Low</option>
<option value="1" <?php echo ((!isset($_GET['preset_priority'])||$_GET['preset_priority']==='1') ? 'selected':'');?>>Normal</option>
<option value="2" <?php echo (( isset($_GET['preset_priority'])&&$_GET['preset_priority']==='2') ? 'selected':'');?>>High</option>
<option value="0" >Low</option>
<option value="1" selected>Normal</option>
<option value="2" >High</option>
</select>
</div>
</div>
<div class="row responsive-label">
<div class="col-sm-12 col-md-3"><label for="msg" class="doc">Message Title</label></div>
<div class="col-sm-12 col-md"><input placeholder="Message" id="msg" class="doc" <?php echo (isset($_GET['preset_title']) ? (' value="'.$_GET['preset_title'].'" '):(''));?> type="text" maxlength="80"></div>
<div class="col-sm-12 col-md"><input placeholder="Message" id="msg" class="doc" type="text" maxlength="80"></div>
</div>
<div class="row responsive-label">
<div class="col-sm-12 col-md-3"><label for="txt" class="doc">Message Content</label></div>
<div class="col-sm-12 col-md"><textarea id="txt" class="doc" <?php echo (isset($_GET['preset_content']) ? (' value="'.$_GET['preset_content'].'" '):(''));?> rows="8" maxlength="2048"></textarea></div>
<div class="col-sm-12 col-md"><textarea id="txt" class="doc" rows="8" maxlength="2048"></textarea></div>
</div>
<div class="row">

View File

@@ -28,7 +28,7 @@ function send()
data.append('priority', pio.value);
let xhr = new XMLHttpRequest();
xhr.open('POST', '/', true);
xhr.open('POST', '/send.php', true);
xhr.onreadystatechange = function ()
{
if (xhr.readyState !== 4) return;
@@ -81,10 +81,27 @@ function send()
xhr.send(data);
}
window.addEventListener("load",function ()
window.addEventListener("load", function ()
{
let btnSend = document.getElementById("btnSend");
const qp = new URLSearchParams(window.location.search);
if (btnSend !== undefined) btnSend.onclick = function () { send(); return false; };
const btnSend = document.getElementById("btnSend");
const selPrio = document.getElementById("prio");
const txtKey = document.getElementById("ukey");
const txtUID = document.getElementById("uid");
const txtTitl = document.getElementById("msg");
const txtCont = document.getElementById("txt");
},false);
btnSend.onclick = function () { send(); return false; };
if (qp.has('preset_priority')) selPrio.selectedIndex = parseInt(qp.get("preset_priority"));
if (qp.has('preset_user_key')) txtKey.value = qp.get("preset_user_key");
if (qp.has('preset_user_id')) txtUID.value = qp.get("preset_user_id");
if (qp.has('preset_title')) txtTitl.value = qp.get("preset_title");
if (qp.has('preset_content')) txtCont.value = qp.get("preset_content");
}, false);

View File

@@ -0,0 +1,31 @@
window.addEventListener("load", function ()
{
const qp = new URLSearchParams(window.location.search);
const spanQuota1 = document.getElementById("insQuota1");
const spanQuota2 = document.getElementById("insQuota2");
const linkSucc = document.getElementById("succ_link");
const linkErr = document.getElementById("err_link");
spanQuota1.innerText = qp.get('quota_remain') ?? 'ERR';
spanQuota2.innerText = qp.get('quota_max') ?? 'ERR';
const preset_user_id = qp.get('preset_user_id') ?? 'ERR';
const preset_user_key = qp.get('preset_user_key') ?? 'ERR';
linkSucc.setAttribute("href", "/?preset_user_id="+preset_user_id+"&preset_user_key="+preset_user_key);
if (qp.get("ok") === "1") {
linkSucc.classList.remove('display_none');
linkErr.classList.add('display_none');
} else {
linkSucc.classList.add('display_none');
linkErr.classList.remove('display_none');
}
}, false);

View File

@@ -22,35 +22,31 @@
<div class="fullcenterflex">
<?php if (isset($_GET['ok']) && $_GET['ok'] === "1" ): ?>
<a id="succ_link" class="display_none card success" href="/?preset_user_id=<?php echo isset($_GET['preset_user_id'])?$_GET['preset_user_id']:'ERR';?>&preset_user_key=<?php echo isset($_GET['preset_user_key'])?$_GET['preset_user_key']:'ERR';?>">
<div class="section">
<h3 class="doc">Message sent</h3>
<p class="doc">Message succesfully sent<br>
<span id="insQuota1">ERR</span>/<span id="insQuota2">ERR</span> remaining</p>
</div>
</a>
<a class="card success" href="/index.php?preset_user_id=<?php echo isset($_GET['preset_user_id'])?$_GET['preset_user_id']:'ERR';?>&preset_user_key=<?php echo isset($_GET['preset_user_key'])?$_GET['preset_user_key']:'ERR';?>">
<div class="section">
<h3 class="doc">Message sent</h3>
<p class="doc">Message succesfully sent<br>
<?php echo isset($_GET['quota_remain'])?$_GET['quota_remain']:'ERR';?>/<?php echo isset($_GET['quota_max'])?$_GET['quota_max']:'ERR';?> remaining</p>
</div>
</a>
<?php else: ?>
<a class="card error" href="/index.php">
<div class="section">
<h3 class="doc">Failure</h3>
<p class="doc">Unknown error</p>
</div>
</a>
<?php endif; ?>
<a id="err_link" class="card error" href="/">
<div class="section">
<h3 class="doc">Failure</h3>
<p class="doc">Unknown error</p>
</div>
</a>
</div>
<a tabindex="-1" href="https://play.google.com/store/apps/details?id=com.blackforestbytes.simplecloudnotifier" class="button bordered" id="tl_link"><span class="icn-google-play"></span></a>
<a tabindex="-1" href="/index.php" class="button bordered" id="tr_link">Send</a>
<a tabindex="-1" href="/" class="button bordered" id="tr_link">Send</a>
<a tabindex="-1" href="/" class="linkcaption"><h1>Simple Cloud Notifier</h1></a>
</div>
<script src="/js/message_sent.js" type="text/javascript" ></script>
</body>
</html>