Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

chore: grant/details cleanup #4720

Merged
merged 4 commits into from
Jul 3, 2019
Merged

chore: grant/details cleanup #4720

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
8e944c2
chore: grant/details cleanup
thelostone-mc Jun 30, 2019
683f265
chore: cleaned up UX for summary section
thelostone-mc Jul 1, 2019
87f8bd7
ux: disable cancel button if you are not contract owner
thelostone-mc Jul 2, 2019
eaf4251
Merge branch 'master' into grant_owner_change
thelostone-mc Jul 3, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 6 additions & 0 deletions app/assets/v2/css/buttons.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -173,6 +173,12 @@ button:focus {
background-color: var(--gc-purple);
}

.btn-outline-black {
border: 1px solid #000;
background: white;
color: #000;
}

.btn-gc-purple:hover {
background-color: var(--gc-purple-hover);
color: white;
Expand Down
27 changes: 26 additions & 1 deletion app/assets/v2/css/grants/detail.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -209,6 +209,20 @@ textarea.editable {
padding-bottom: 0 !important;
}

#contract_owner_button-container {
outline: none;
}

.disable-tooltip {
pointer-events: none;
}

.disable-btn {
border: none;
background-color: whitesmoke;
color: #999;
}

@keyframes rotation {
from {
transform: rotate(0deg);
Expand All @@ -228,8 +242,13 @@ textarea.editable {
}

@media (max-width: 991.98px) {
.summary,
.summary textarea,
.summary input {
text-align: center;
}

.summary-info i {
float: left;
position: relative;
top: 2px;
}
Expand All @@ -239,6 +258,12 @@ textarea.editable {
}
}

@media (min-width:767.98px) and (max-width: 991.98px) {
.summary-info i {
float: left;
}
}

@media (max-width: 767.98px) {

#tabs ul {
Expand Down
27 changes: 25 additions & 2 deletions app/assets/v2/js/grants/detail.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,10 +14,33 @@ $(document).ready(function() {
setInterval (() => {
notifyOwnerAddressMismatch(
$('#grant-admin').val(),
$('#contract_owner_address').val(),
$('#grant_contract_owner_address').text(),
'#cancel_grant',
'Looks like your grant has been created with ' + $('#contract_owner_address').val() + '. Switch to take action on your grant.'
'Looks like your grant has been created with ' +
$('#grant_contract_owner_address').text() + '. Switch to take action on your grant.'
);

if ($('#cancel_grant').attr('disabled')) {
$('#cancel_grant').addClass('disable-btn').addClass('disable-tooltip');
$('#cancel_grant_tooltip').attr(
'data-original-title', 'switch to below contract owner address to cancel grant.'
);
} else {
$('#cancel_grant').removeClass('disable-btn').removeClass('disable-tooltip');
$('#cancel_grant_tooltip').attr('data-original-title', '');
}

if ($('#contract_owner_address').val() === $('#grant_contract_owner_address').text()) {
$('#contract_owner_button').attr('disabled', true);
$('#contract_owner_button').addClass('disable-btn').addClass('disable-tooltip');
$('#contract_owner_button-container').attr(
'data-original-title', 'Grant owner address hasn\'t changed. Update the above field to enable this.'
);
} else {
$('#contract_owner_button').attr('disabled', false);
$('#contract_owner_button').removeClass('disable-btn').removeClass('disable-tooltip');
$('#contract_owner_button-container').attr('data-original-title', '');
}
}, 1000);

let _text = grant_description.getContents();
Expand Down
4 changes: 4 additions & 0 deletions app/grants/templates/grants/detail/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -91,6 +91,10 @@
<script src="{% static "v2/js/grants/detail.js" %}"></script>
<script src="{% static "v2/js/waiting_room_entertainment.js" %}"></script>
<script>
$('#wallet-address').attr(
'href', etherscan_tx_url($('#wallet-address').text().trim(), '{{ grant.network }}')
);

{% if change_ownership == 'Y' %}
_alert({ message: gettext('You are now the owner of this grant.') }, 'success');
{% elif change_ownership == 'N' %}
Expand Down
113 changes: 63 additions & 50 deletions app/grants/templates/grants/detail/info.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@
along with this program. If not, see <http://www.gnu.org/licenses/>.
{% endcomment %}
{% load static humanize i18n grants_extra %}
<div class="summary p-5 px-md-3 px-lg-5">
<div class="summary p-5 px-md-3">
<!-- GRANT LOGO -->
<div class="grant-logo pb-2">
{% if is_admin and not grant_is_inactive %}
Expand Down Expand Up @@ -81,7 +81,7 @@ <h1 class="font-title-xl my-4 font-weight-bold">

<div class="mb-2">
<i style="width: 14px;" class="fab fa-ethereum mr-2 text-center"></i>
<a class="wallet-address" href="https://etherscan.io/address/{{ grant.admin_address }}"
<a id="wallet-address" class="wallet-address"
danlipert marked this conversation as resolved.
Show resolved Hide resolved
target="_blank" data-toggle="tooltip" data-placement="top" title="Recipient Funding Address">
{{ grant.admin_address }}
</a>
Expand Down Expand Up @@ -141,7 +141,7 @@ <h1 class="font-title-xl my-4 font-weight-bold">
</div>
{% endif %}

<div class="row progress-container {% if not is_admin %} mt-4 {% endif %} mb-5">
<div class="row progress-container {% if not is_admin %} mt-4 {% endif %}">
<div class="offset-2 col-8 text-center text-xl-left offset-xl-0 col-xl-6 mb-4 mb-xl-0 ">
<p class="sub-title mb-0 font-caption">MONTHLY RECURRING</p>
<p class="font-title-xl mb-0 font-weight-bold">
Expand All @@ -167,50 +167,81 @@ <h1 class="font-title-xl my-4 font-weight-bold">

{% if is_admin and not grant_is_inactive %}
<!-- OWNER ACTIONS -->
<div class="font-body grant-item__owner my-4">
<p class="sub-title mb-0" style="font-size: 16px;">GRANT OWNER</p>
<div class="font-body grant-item__owner mb-4 mt-2">
<p class="sub-title mb-0" data-toggle="tooltip" data-placement="bottom" title="This owner can update grant data , milestones and description">GRANT OWNER</p>
<div class="form__select2">
<select id="grant-admin" class="form__input" name="grant-admin" disabled>
<option selected="selected">{{ grant.admin_profile.handle|default:'anonymous' }}</option>
</select>
</div>
</div>
{% endif %}

<div class="grant-item__owner my-4">
<div class="font-body">
<p class="sub-title mb-0">OWNER ADDRESS</p>
<input id="contract_owner_address" class="p-0 m-0 inline-edit" name="contract_owner_address" value="{{ grant.contract_owner_address }}" disabled data-toggle="tooltip" data-placement="bottom" title="Beware! Please do not change this to an address you do NOT own.">
<button id="contract_owner_button" class="mt-2 button button--primary button--full hidden shadow-none font-weight-bold">
{% trans "Change Contract Owner" %}
</button>
<!-- TEAM MEMBERS -->
<div class="grant-item__member my-4 font-body">
<p class="sub-title {% if is_admin %} mb-0 {% else %} mb-3 {% endif %}">
TEAM
</p>
{% if is_admin and not grant_is_inactive %}
<div>
<div class="form__select2">
<select id="grant-members" class="form__input" name="grant-members" name="members" multiple="multiple" disabled>
{% for team_member in grant.team_members.all %}
<option selected="selected" value="{{ team_member.id }}">{{ team_member }}</option>
{% endfor %}
</select>
</div>
</div>
</div>
{% else %}
{% if grant.team_members %}
<div class="grant-item__members d-flex flex-wrap">
{% for team_member in grant.team_members.all %}
<a class="grant-item__member-handle mb-3" href="{% url 'profile' team_member %}">
<div class="grant-item__member mr-5">
<div class="mr-2 d-inline-block">
<img src="{{ team_member.avatar_url }}">
</div>
<div class="mt-1 d-inline-block">
<span class="grant-profile font-weight-semibold">{{ team_member }}</span>
</div>
</div>
</a>
{% endfor %}
</div>
{% endif %}
{% endif %}
</div>

{% if is_admin and not grant_is_inactive %}
<div class="mt-4">
<button id="edit-details" class="button btn-gc-blue button--full shadow-none font-weight-bold py-3">
<i class="fas fa-edit mr-2"></i> {% trans "Edit Info" %}
</button>
</div>
<div class="row mx-0">
<div class="col-12 col-lg-6 pl-0 pr-1">
<div class="col-12 col-lg-6 px-0 pr-lg-1 mb-2">
<button id="save-details" class="button btn-gc-blue button--full hidden shadow-none font-weight-bold py-3">
<i class="fas fa-save mr-2"></i> {% trans "Save Info" %}
</button>
</div>
<div class="col-12 col-lg-6 pl-1 pr-0">
<div class="col-12 col-lg-6 px-0 pl-lg-1">
<button id="cancel-details" class="button button--warning button--full hidden shadow-none font-weight-bold py-3">
<i class="fas fa-times mr-2"></i> {% trans "Cancel Edit" %}
</button>
</div>
</div>

{% csrf_token %}
<div id="js-cancel_grant" class="mt-4">
<div id="js-cancel_grant" class="mt-3">
<input type="hidden" id="contract_address" name="contract_address" value="{{ grant.contract_address }}">
<input type="hidden" id="contract_version" name="contract_version" value="{{ grant.contract_version }}">
<input type="hidden" id="grant_cancel_tx_id" name="grant_cancel_tx_id" value="">
<button type="button" class="button button--primary button--full button--warning shadow-none font-weight-bold py-3" data-toggle="modal" data-target="#cancelModal" id="cancel_grant">{% trans "Cancel this Grant" %}
</button>
<div id="cancel_grant_tooltip" data-toggle="tooltip" data-placement="bottom">
<button type="button" data-toggle="modal" data-target="#cancelModal" id="cancel_grant"
class="button button--primary button--full button--warning shadow-none font-weight-bold py-3">
{% trans "Cancel this Grant" %}
</button>
</div>

<div id="cancelModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="cancelGrantModal" aria-hidden="true">
<div class="modal-dialog modal-lg">
Expand Down Expand Up @@ -254,40 +285,22 @@ <h5 class="font-subheader pb-2">{% trans "Gas Settings" %}</h5>
</div>
</div>

{% endif %}

<!-- TEAM MEMBERS -->
<div class="grant-item__member my-4 font-body">
<p class="sub-title mb-3">Team member{% if grant.team_members.all|length > 1 %}s{% endif %}</p>
{% if is_admin and not grant_is_inactive %}
<div>
<div class="form__select2">
<select id="grant-members" class="form__input" name="grant-members" name="members" multiple="multiple" disabled>
{% for team_member in grant.team_members.all %}
<option selected="selected" value="{{ team_member.id }}">{{ team_member }}</option>
{% endfor %}
</select>
<div class="grant-item__owner my-4">
<div class="font-body">
<p class="sub-title mb-0" data-toggle="tooltip" data-placement="bottom" title="This address can cancel the grant.">Contract Owner Address</p>
<input id="contract_owner_address" class="p-0 m-0 inline-edit font-caption" name="contract_owner_address" value="{{ grant.contract_owner_address }}" disabled>
<div id="contract_owner_button-container" tabindex="0" data-toggle="tooltip" data-placement="bottom" title="Contract Owner address hasn't changed. Update the above field to enable this.">
<button id="contract_owner_button" data-toggle="tooltip" data-placement="bottom" title='Clicking this will trigger a metamask confirmation' class="mt-2 disable-tooltip btn btn-outline-black button--full hidden shadow-none font-weight-semibold font-body">
<i class="fas fa-user mr-2"></i>
{% trans "Change Contract Owner" %}
</button>
</div>
</div>
{% else %}
{% if grant.team_members %}
<div class="grant-item__members d-flex flex-wrap">
{% for team_member in grant.team_members.all %}
<a class="grant-item__member-handle mb-3" href="{% url 'profile' team_member %}">
<div class="grant-item__member mr-5">
<div class="mr-2 d-inline-block">
<img src="{{ team_member.avatar_url }}">
</div>
<div class="mt-1 d-inline-block">
<span class="grant-profile font-weight-semibold">{{ team_member }}</span>
</div>
</div>
</a>
{% endfor %}
</div>
{% endif %}
{% endif %}
</div>
</div>

{% endif %}

<span id="grant_contract_owner_address" class="hidden">{{ grant.contract_owner_address }}</span>

{% include 'grants/detail/matching.html' %}

Expand Down