* Implement closed-by-default email list. #54 * reload on empty page * simple styling
This commit is contained in:
parent
eacc2c0f1c
commit
7d2b6eb0fb
4 changed files with 79 additions and 4 deletions
|
@ -6,6 +6,7 @@ The format is based on [Keep a Changelog](http://keepachangelog.com/).
|
|||
## [Unreleased]
|
||||
|
||||
### Changed
|
||||
- Show list of mails and show them only on click.
|
||||
- Removed Turbolinks to allow for simpler code in new features. Add new mail alert.
|
||||
- Rewrote to use mostly pure php. Uses Javascript only where it’s necessary.
|
||||
- fixed problem where only one domain is defined
|
||||
|
|
|
@ -44,7 +44,7 @@ Disposable-mailbox can be installed by copying the src directory to a webserver.
|
|||
2. download a [release](https://github.com/synox/disposable-mailbox/releases) or clone this repository
|
||||
3. copy the files in the `src` directory to your web server (not the whole repo!).
|
||||
4. rename `config.sample.php` to `config.php` and apply the imap settings. Move `config.php` to a safe location outside the `public_html`.
|
||||
5. edit `index.php` and set the new path to `config.php`.
|
||||
5. edit `index.php` and `json-api.php`: set the new path to `config.php`.
|
||||
6. open it in your browser, check your php error log for messages.
|
||||
|
||||
|
||||
|
|
|
@ -38,6 +38,9 @@ $mailIdsJoinedString = filter_var(join('|', $mailIds), FILTER_SANITIZE_SPECIAL_C
|
|||
<link rel="stylesheet" href="spinner.css">
|
||||
|
||||
<script>
|
||||
|
||||
var mailCount = <?php echo count($emails)?>;
|
||||
|
||||
function copyToClipboard(text) {
|
||||
var inp = document.createElement('input');
|
||||
document.body.appendChild(inp);
|
||||
|
@ -47,6 +50,21 @@ $mailIdsJoinedString = filter_var(join('|', $mailIds), FILTER_SANITIZE_SPECIAL_C
|
|||
inp.remove();
|
||||
}
|
||||
|
||||
function toggle_email_visibility(email_id) {
|
||||
var mailPreviewHeader = document.getElementById("email-preview-header-" + email_id);
|
||||
var mailFullHeader = document.getElementById("email-fullheader-" + email_id);
|
||||
var mailBody = document.getElementById("email-content-" + email_id);
|
||||
|
||||
if (mailPreviewHeader.style.display !== 'none') {
|
||||
mailPreviewHeader.style.display = 'none';
|
||||
mailFullHeader.style.display = 'block';
|
||||
mailBody.style.display = 'block';
|
||||
} else {
|
||||
mailPreviewHeader.style.display = 'block';
|
||||
mailFullHeader.style.display = 'none';
|
||||
mailBody.style.display = 'none';
|
||||
}
|
||||
}
|
||||
|
||||
setInterval(function () {
|
||||
var r = new XMLHttpRequest();
|
||||
|
@ -56,6 +74,11 @@ $mailIdsJoinedString = filter_var(join('|', $mailIds), FILTER_SANITIZE_SPECIAL_C
|
|||
if (r.responseText > 0) {
|
||||
console.log("There are", r.responseText, "new mails.");
|
||||
document.getElementById("new-content-avalable").style.display = 'block';
|
||||
|
||||
// If there are no emails displayed, we can reload the page without looing any state.
|
||||
if (mailCount === 0) {
|
||||
location.reload();
|
||||
}
|
||||
}
|
||||
};
|
||||
r.send();
|
||||
|
@ -157,7 +180,43 @@ $mailIdsJoinedString = filter_var(join('|', $mailIds), FILTER_SANITIZE_SPECIAL_C
|
|||
<div class="email-table">
|
||||
|
||||
<div class="card email">
|
||||
<div class="card-block header-shadow">
|
||||
|
||||
<!-- preview header -->
|
||||
<div class="card-block header-shadow email-preview-header"
|
||||
id="email-preview-header-<?php echo filter_var($email->id, FILTER_SANITIZE_SPECIAL_CHARS); ?>"
|
||||
onclick="toggle_email_visibility('<?php echo filter_var($email->id, FILTER_SANITIZE_SPECIAL_CHARS); ?>')">
|
||||
<div class="row">
|
||||
<div class="col-sm-12">
|
||||
<b class="card-title">
|
||||
<?php echo filter_var($email->subject, FILTER_SANITIZE_SPECIAL_CHARS); ?>
|
||||
</b>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-8">
|
||||
<h6 class="card-subtitle mt-1 text-muted">
|
||||
<?php
|
||||
echo filter_var($email->fromName, FILTER_SANITIZE_SPECIAL_CHARS);
|
||||
echo ' <';
|
||||
echo filter_var($email->fromAddress, FILTER_SANITIZE_SPECIAL_CHARS);
|
||||
echo '>';
|
||||
?>
|
||||
</h6>
|
||||
</div>
|
||||
<div class="col-sm-4">
|
||||
<h6 class="card-subtitle mt-1 text-muted"
|
||||
style="text-align: right">
|
||||
<?php echo filter_var($email->date, FILTER_SANITIZE_SPECIAL_CHARS); ?>
|
||||
</h6>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- full header -->
|
||||
<div class="card-block header-shadow email-fullheader"
|
||||
id="email-fullheader-<?php echo filter_var($email->id, FILTER_SANITIZE_SPECIAL_CHARS); ?>"
|
||||
onclick="toggle_email_visibility('<?php echo filter_var($email->id, FILTER_SANITIZE_SPECIAL_CHARS); ?>')">
|
||||
<div class="row">
|
||||
<div class="col-sm-8">
|
||||
<h3 class="card-title">
|
||||
|
@ -197,7 +256,10 @@ $mailIdsJoinedString = filter_var(join('|', $mailIds), FILTER_SANITIZE_SPECIAL_C
|
|||
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-block">
|
||||
|
||||
<!-- email content -->
|
||||
<div class="card-block email-content"
|
||||
id="email-content-<?php echo filter_var($email->id, FILTER_SANITIZE_SPECIAL_CHARS); ?>">
|
||||
<h6 class="card-subtitle text-muted">
|
||||
To: <?php echo filter_var($email->toString, FILTER_SANITIZE_SPECIAL_CHARS); ?></h6>
|
||||
|
||||
|
@ -249,4 +311,4 @@ $mailIdsJoinedString = filter_var(join('|', $mailIds), FILTER_SANITIZE_SPECIAL_C
|
|||
| <a href="https://github.com/synox/disposable-mailbox">Contribute to the development on Github.</a></p>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
@ -40,6 +40,18 @@ div.min-height {
|
|||
text-align: center;
|
||||
}
|
||||
|
||||
.email-fullheader {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.email-preview-header {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.email-content {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#new-content-avalable {
|
||||
display: none;
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue