You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
wownero-funding-system/funding/templates/proposal/proposal.html

302 lines
13 KiB

{% extends "base.html" %}
{% block content %}
<!-- Page Content -->
<div class="container" style="margin-bottom:140px;">
{% include 'messages.html' %}
<div class="row">
<!-- Post Content Column -->
<div class="col-lg-12">
<!-- Title -->
<h1 class="mt-4" style="margin-bottom: 0.1rem;">
{{ proposal.headline }}
</h1>
<p>
<span style="color:grey;">
Posted on {{ proposal.date_added.strftime('%Y-%m-%d') }} by <a href="/user/{{ proposal.user.username }}">{{ proposal.user.username}}</a>
</span>
<br>
<span>
Status:
{% if proposal.status == 0 %}
<span style="color:red;">Disabled</span>
{% elif proposal.status == 1 %}
Seeking community approval
{% elif proposal.status == 2 %}
Seeking funding
{% elif proposal.status == 3 %}
WIP / Help needed
{% elif proposal.status == 4 %}
Completed
{% endif %}
</span>
{% if proposal.status <= 1 %}
<br>
<span>
Target: <b>{{proposal.funds_target|round}}</b> WOW
{% if proposal.funds_target_usd %}
<small>➞ {{proposal.funds_target_usd}} USD</small>
{% endif %}
</span>
{% endif %}
</p>
<p>
{% if proposal.user.username == current_user.username or current_user.admin %}
<a href="/proposal/{{proposal.id}}/edit">
<button type="button" class="btn btn-success btn-sm">Edit</button>
</a>
{% endif %}
</p>
<hr>
{% if proposal.status >= 2 %}
<div class="row">
<div class="col-md-12">
<div class="card my-4">
<h5 class="card-header">Funds</h5>
<div class="card-body">
<div class="row the-bar">
<div class="col-lg-4">
<table class="table proposal-info-table">
<tbody>
<tr>
<td>Target</td>
<td>
<span class="badge">{{proposal.funds_target|round}} WOW
{% if proposal.funds_target_usd %}
<small>➞ {{proposal.funds_target_usd}} USD</small>
{% endif %}
</span>
</td>
</tr>
<tr>
<td>Funded</td>
<td><span class="badge">{{proposal.balance['pct'] | round or 0}} %</span></td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="row">
<div class="col-lg-8">
{{proposal.balance['txs'] | length}} individual contributions
{% if proposal.balance['txs'] %}
<small>
<a style="margin:4px;" href="#incoming_txs">Details...</a>
</small>
{% endif %}
<div class="progress">
<div class="progress-bar progress-monero progress-bar-striped" style="width: 100.0%;">
</div>
</div>
<hr>
</div>
<div class="col-lg-8">
{{proposal.balance['available']|round(3) or 0 }} WOW Raised
{% if (proposal.funds_target-proposal.balance['available']|float|round(3)) > 0 %}
({{ (proposal.funds_target-proposal.balance['available']|float|round(3)|int) }} WOW until goal)
{% else %}
({{ (proposal.balance['available']-proposal.funds_target|float|round(3)|int) }} WOW past goal!)
{% endif %}
<div class="progress">
<div class="progress-bar progress-warning progress-bar" style="width: {{proposal.balance['pct']}}%;">
</div>
</div>
<hr>
</div>
<br/>
<br/>
<div class="col-lg-8">
{{proposal.spends['spent']|round(3) or 0}} WOW Paid out
<div class="progress">
<div class="progress-bar progress-warning progress-bar" style="width: {{proposal.spends['spent_remaining_pct']}}%;">
</div>
</div>
<hr>
</div>
<div class="col-lg-8">
{{(proposal.balance['available']-proposal.spends['spent']) |round(3) or 0}} WOW Available to Payout
<div class="progress">
<div class="progress-bar progress-warning progress-bar" style="width: {{proposal.balance['remaining_pct']}}%;">
</div>
</div>
<hr>
</div>
<br/>
</div>
<div class="row" style="margin-top:16px;">
<div class="col-lg-12">
Donation address:
<pre class="proposal_address">{% if proposal.addr_donation %}{{ proposal.addr_donation }}{% else %}<small>None generated yet</small>{% endif %}</pre>
</div>
{% if proposal.addr_donation %}
<div class="col-lg-12">
<img class="proposal_qr" src="/api/1/qr?address={{ proposal.addr_donation }}">
</div>
{% endif %}
</div>
</div>
</div>
</div>
</div>
{% elif proposal.status == 0 %}
<div class="row">
<div class="col-lg-12">
<div class="alert alert-danger">
This proposal is disabled.
</div>
</div>
</div>
{% endif %}
<div class="proposal_content">
<!-- Post Content -->
{{proposal.html | safe}}
</div>
</div>
</div>
{% include 'comments.html' %}
<style>
#incoming_txs li.list-group-item {
padding-top: 4px;
padding-bottom: 4px;
}
</style>
{% if proposal.balance['txs'] %}
<div class="row">
<div class="col-md-12">
<div class="card my-6" id="incoming_txs">
<h5 class="card-header">Incoming transactions <small>({{proposal.balance['txs']|length}})</small></h5>
<div class="card-body">
<ul class="list-group">
{% for tx in proposal.balance['txs'] %}
<li class="list-group-item">
{{tx['datetime'].strftime('%Y-%m-%d %H:%M')}}
<span style="float:right"><b>Blockheight</b>: {{tx['height']}}</span>
<br>
<a target="_blank" href="https://explore.wownero.com/tx/{{tx['txid']}}">{{tx['txid'][:32]}}...</a>
<span style="float:right;color:#008926;font-weight:bold;">
+ {{tx['amount_human']|round(3)}} WOW
{% if 'amount_usd' in tx %}
<small style="color: black">
➞ $ {{tx['amount_usd']}}
</small>
{% endif %}
</span>
</li>
{% endfor %}
</ul>
</div>
</div>
</div>
</div>
<!-- /.row -->
{% endif %}
{% if proposal.spends['txs'] %}
<div class="row">
<div class="col-md-12">
<div class="card my-6" id="incoming_txs">
<h5 class="card-header">Outgoing transactions <small>({{proposal.spends['txs']|length}})</small></h5>
<div class="card-body">
<ul class="list-group">
{% for tx in proposal.spends['txs'] %}
<li class="list-group-item">
{{tx['datetime'].strftime('%Y-%m-%d %H:%M')}}
<span style="float:right"><b>Blockheight</b>: {{tx['height']}}</span>
<br>
<a target="_blank" href="https://explore.wownero.com/tx/{{tx['txid']}}">{{tx['txid'][:32]}}...</a>
<span style="float:right;color:#890000;font-weight:bold;">
- {{tx['amount_human']|round(3)}} WOW
{% if 'amount_usd' in tx %}
<small style="color: black">
➞ $ {{tx['amount_usd']}}
</small>
{% endif %}
</span>
</li>
{% endfor %}
</ul>
</div>
</div>
</div>
</div>
<!-- /.row -->
{% endif %}
</div>
<script>
$(document).ready(function(){
let regexp_xss = /^[a-zA-Z0-9.:\/]+$/;
let regexp_address = /(W[o|W][a-zA-Z0-9]{95})/g;
let regexp_imgur = /(https:\/\/i.imgur.com\/[a-zA-Z0-9]{0,7}.[jpg|png|gif|webm]+)/g;
let regexp_imgflip = /(https:\/\/i.imgflip.com\/[a-zA-Z0-9]{0,7}.[jpg|png|gif|webm]+)/g;
let truncated_addy = function(obj){ return `<span data-addy="${obj}" class="wow_addy">${obj.substring(0, 4)}...${obj.slice(-4)}</span>`; }
function rich_addy(obj) {
// richtext addy's
let html = obj.html();
var matches = html.match(regexp_address);
if(matches) {
matches.filter(function(value, index,self){ return self.indexOf(value) === index; }).forEach(function (obj) {
html = html.replace(new RegExp(obj, 'g'), truncated_addy(obj));
});
}
obj.html(html);
}
function rich_img(obj) {
// convert images to <img>
let html = obj.html();
let uid = obj.attr('data-id');
if(uid == 30){
debugger;
}
var matches = html.match(regexp_imgur) || [];
matches = matches.concat(html.match(regexp_imgflip));
if(matches) {
matches.filter(function (value, index, self) {
return self.indexOf(value) === index && typeof value === 'string';
}).forEach(function (obj) {
html = html.replace(new RegExp(obj, 'g'), `<br><img src="${obj}"/></a><br>`)
});
}
obj.html(html);
}
$(document).on('click', '.wow_addy', function(event){
let obj = $(this);
if(obj.attr('data-active') === "true"){
//obj.attr('data-active', 'false');
//obj.html(truncated_addy(obj.attr('data-addy')));
} else {
obj.attr('data-active', 'true');
obj.html(obj.attr('data-addy'));
}
});
$('.comments-panel .comment-container .media-body span.body').each(function (i, obj){
obj = $(obj);
// convert images to <img>
rich_img(obj);
// truncate addys
let html = rich_addy(obj);
});
});
</script>
<!-- /.container -->
{% endblock %}