Copy amount to clipboard on click
This commit is contained in:
parent
6df8b58a89
commit
50c2522654
@ -286,20 +286,20 @@ def filter_amount(amt, link=None):
|
|||||||
return flask.Markup('<a href="{}"><span title="{}">({})</span></a>'.format(link, amt.tostr(False), amt_str))
|
return flask.Markup('<a href="{}"><span title="{}">({})</span></a>'.format(link, amt.tostr(False), amt_str))
|
||||||
else:
|
else:
|
||||||
if is_pos:
|
if is_pos:
|
||||||
return flask.Markup('<span title="{}">{}</span> '.format(amt.tostr(False), amt_str))
|
return flask.Markup('<span class="copyable-amount" title="{}">{}</span> '.format(amt.tostr(False), amt_str))
|
||||||
else:
|
else:
|
||||||
return flask.Markup('<span title="{}">({})</span>'.format(amt.tostr(False), amt_str))
|
return flask.Markup('<span class="copyable-amount" title="{}">({})</span>'.format(amt.tostr(False), amt_str))
|
||||||
|
|
||||||
@app.template_filter('b')
|
@app.template_filter('b')
|
||||||
def filter_amount_positive(amt):
|
def filter_amount_positive(amt):
|
||||||
return flask.Markup('<span title="{}">{:,.2f}</span>'.format(amt.tostr(False), amt.amount).replace(',', ' '))
|
return flask.Markup('<span class="copyable-amount" title="{}">{:,.2f}</span>'.format(amt.tostr(False), amt.amount).replace(',', ' '))
|
||||||
|
|
||||||
@app.template_filter('bc')
|
@app.template_filter('bc')
|
||||||
def filter_commodity_positive(amt):
|
def filter_commodity_positive(amt):
|
||||||
if amt.commodity.is_prefix:
|
if amt.commodity.is_prefix:
|
||||||
return flask.Markup('<span title="{}">{}{:,.2f}</span>'.format(amt.tostr(False), amt.commodity.name, amt.amount).replace(',', ' '))
|
return flask.Markup('<span class="copyable-amount" title="{}">{}{:,.2f}</span>'.format(amt.tostr(False), amt.commodity.name, amt.amount).replace(',', ' '))
|
||||||
else:
|
else:
|
||||||
return flask.Markup('<span title="{}">{:,.2f} {}</span>'.format(amt.tostr(False), amt.amount, amt.commodity.name).replace(',', ' '))
|
return flask.Markup('<span class="copyable-amount" title="{}">{:,.2f} {}</span>'.format(amt.tostr(False), amt.amount, amt.commodity.name).replace(',', ' '))
|
||||||
|
|
||||||
@app.template_filter('bt')
|
@app.template_filter('bt')
|
||||||
def filter_commodity_table_positive(amt, show_price, link=None):
|
def filter_commodity_table_positive(amt, show_price, link=None):
|
||||||
@ -313,12 +313,12 @@ def filter_commodity_table_positive(amt, show_price, link=None):
|
|||||||
|
|
||||||
amt_full = amt.tostr(False)
|
amt_full = amt.tostr(False)
|
||||||
|
|
||||||
result.append('<td style="text-align: right;"><a href="{}"><span title="{}">{}</span></a></td>'.format(link, amt_full, amt_str) if link else '<td style="text-align: right;"><span title="{}">{}</span></td>'.format(amt_full, amt_str))
|
result.append('<td style="text-align: right;"><a href="{}"><span class="copyable-amount" title="{}">{}</span></a></td>'.format(link, amt_full, amt_str) if link else '<td style="text-align: right;"><span class="copyable-amount" title="{}">{}</span></td>'.format(amt_full, amt_str))
|
||||||
result.append('<td><span title="{}">{}</span></td>'.format(amt_full, cur_str))
|
result.append('<td><span class="copyable-amount" title="{}">{}</span></td>'.format(amt_full, cur_str))
|
||||||
|
|
||||||
if show_price:
|
if show_price:
|
||||||
if amt.commodity.price:
|
if amt.commodity.price:
|
||||||
result.append('<td><span title="{}">{{{}}}</span></td>'.format(amt_full, filter_commodity_positive(amt.commodity.price)))
|
result.append('<td>{{{}}}</td>'.format(filter_commodity_positive(amt.commodity.price)))
|
||||||
else:
|
else:
|
||||||
result.append('<td></td>')
|
result.append('<td></td>')
|
||||||
|
|
||||||
|
@ -26,5 +26,9 @@
|
|||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
{% block body %}{% endblock %}
|
{% block body %}{% endblock %}
|
||||||
|
|
||||||
|
<script src="/static/toasts.js"></script>
|
||||||
|
<script src="/static/copyAmounts.js"></script>
|
||||||
|
<div class="toast"></div>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
35
ledger_pyreport/static/copyAmounts.js
Normal file
35
ledger_pyreport/static/copyAmounts.js
Normal file
@ -0,0 +1,35 @@
|
|||||||
|
/*
|
||||||
|
ledger-pyreport
|
||||||
|
Copyright © 2020 Lee Yingtong Li (RunasSudo)
|
||||||
|
|
||||||
|
This program is free software: you can redistribute it and/or modify
|
||||||
|
it under the terms of the GNU Affero General Public License as published by
|
||||||
|
the Free Software Foundation, either version 3 of the License, or
|
||||||
|
(at your option) any later version.
|
||||||
|
|
||||||
|
This program is distributed in the hope that it will be useful,
|
||||||
|
but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||||
|
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||||
|
GNU Affero General Public License for more details.
|
||||||
|
|
||||||
|
You should have received a copy of the GNU Affero General Public License
|
||||||
|
along with this program. If not, see <https://www.gnu.org/licenses/>.
|
||||||
|
*/
|
||||||
|
|
||||||
|
// Consider replacing this when the Clipboard API has better availability
|
||||||
|
function copyText(text) {
|
||||||
|
var ta = document.createElement('textarea');
|
||||||
|
ta.value = text;
|
||||||
|
ta.style = 'position: fixed; top: 0; left: 0;'; // Avoid scrolling
|
||||||
|
document.body.appendChild(ta);
|
||||||
|
ta.select();
|
||||||
|
document.execCommand('copy');
|
||||||
|
document.body.removeChild(ta);
|
||||||
|
}
|
||||||
|
|
||||||
|
document.querySelectorAll('.copyable-amount').forEach(function(el) {
|
||||||
|
el.addEventListener('click', function() {
|
||||||
|
copyText(el.getAttribute('title'));
|
||||||
|
showToast('Amount was copied to the clipboard');
|
||||||
|
});
|
||||||
|
});
|
@ -20,6 +20,8 @@ body {
|
|||||||
font-family: 'TeX Gyre Termes', 'Nimbus Roman', 'Times New Roman', 'Liberation Serif', Times, serif;
|
font-family: 'TeX Gyre Termes', 'Nimbus Roman', 'Times New Roman', 'Liberation Serif', Times, serif;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Tables */
|
||||||
|
|
||||||
h1 {
|
h1 {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
font-size: x-large;
|
font-size: x-large;
|
||||||
@ -73,6 +75,8 @@ table.ledger a:hover {
|
|||||||
text-decoration: underline;
|
text-decoration: underline;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Navigation bar */
|
||||||
|
|
||||||
.nav-header {
|
.nav-header {
|
||||||
color: #888;
|
color: #888;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
@ -86,6 +90,8 @@ table.ledger a:hover {
|
|||||||
color: #666;
|
color: #666;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Home page */
|
||||||
|
|
||||||
.index-group {
|
.index-group {
|
||||||
margin-bottom: 1em;
|
margin-bottom: 1em;
|
||||||
line-height: 2;
|
line-height: 2;
|
||||||
@ -95,6 +101,26 @@ label {
|
|||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Toasts */
|
||||||
|
|
||||||
|
.toast {
|
||||||
|
opacity: 0%;
|
||||||
|
transition: opacity 0.2s;
|
||||||
|
|
||||||
|
position: fixed;
|
||||||
|
bottom: 2em;
|
||||||
|
left: 50%;
|
||||||
|
transform: translateX(-50%);
|
||||||
|
|
||||||
|
background-color: #eee;
|
||||||
|
padding: 0.5em 1.5em;
|
||||||
|
border: 1px solid #666;
|
||||||
|
}
|
||||||
|
.toast.visible {
|
||||||
|
opacity: 100%;
|
||||||
|
transition: opacity 0s;
|
||||||
|
}
|
||||||
|
|
||||||
@media screen {
|
@media screen {
|
||||||
body {
|
body {
|
||||||
padding: 2em;
|
padding: 2em;
|
||||||
|
29
ledger_pyreport/static/toasts.js
Normal file
29
ledger_pyreport/static/toasts.js
Normal file
@ -0,0 +1,29 @@
|
|||||||
|
/*
|
||||||
|
ledger-pyreport
|
||||||
|
Copyright © 2020 Lee Yingtong Li (RunasSudo)
|
||||||
|
|
||||||
|
This program is free software: you can redistribute it and/or modify
|
||||||
|
it under the terms of the GNU Affero General Public License as published by
|
||||||
|
the Free Software Foundation, either version 3 of the License, or
|
||||||
|
(at your option) any later version.
|
||||||
|
|
||||||
|
This program is distributed in the hope that it will be useful,
|
||||||
|
but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||||
|
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||||
|
GNU Affero General Public License for more details.
|
||||||
|
|
||||||
|
You should have received a copy of the GNU Affero General Public License
|
||||||
|
along with this program. If not, see <https://www.gnu.org/licenses/>.
|
||||||
|
*/
|
||||||
|
|
||||||
|
var toastInterval;
|
||||||
|
|
||||||
|
function showToast(toastText) {
|
||||||
|
document.querySelector('.toast').innerText = toastText;
|
||||||
|
document.querySelector('.toast').classList.add('visible');
|
||||||
|
|
||||||
|
clearInterval(toastInterval);
|
||||||
|
toastInterval = setInterval(function() {
|
||||||
|
document.querySelector('.toast').classList.remove('visible');
|
||||||
|
}, 1000);
|
||||||
|
}
|
Reference in New Issue
Block a user