Handle UI for dangerous scopes

This commit is contained in:
Joseph Schorr 2014-08-05 21:21:22 -04:00
parent 02e47ed572
commit 05a1413153
4 changed files with 69 additions and 7 deletions

View file

@ -25,22 +25,33 @@
<div class="reason">This application would like permission to:</div>
<div class="panel-group">
{% for index, scope in enumerate(scopes) %}
<div class="scope panel panel-default">
<div class="scope panel panel-default {% if scope.dangerous %} dangerous {% endif %}">
<div class="panel-heading">
<h4 class="panel-title">
<div class="title-container">
<div class="title collapsed" data-toggle="collapse" data-parent="#scopeGroup" data-target="#description-{{ index }}">
<div class="title {% if not scope.dangerous %}collapsed{% endif %}" data-toggle="collapse"
data-parent="#scopeGroup" data-target="#description-{{ index }}">
<i class="fa arrow"></i>
<i class="fa {{ scope.icon }} fa-lg"></i>
<a data-toggle="collapse" href="#collapseOne">
{{ scope.title }}
{{ scope.title }}
</a>
{% if scope.dangerous %}
<i class="fa fa-lg fa-exclamation-triangle"
data-title="This scope grants a lot of power. Be careful when authorizing it!"
data-container="body" bs-tooltip></i>
{% endif %}
</div>
</div>
</h4>
</div>
<div id="description-{{ index }}" class="panel-collapse collapse out">
<div id="description-{{ index }}" class="panel-collapse {% if not scope.dangerous %} collapse {% else %} in {% endif %}">
<div class="panel-body">
{% if scope.dangerous %}
<div class="alert alert-warning">Warning! This scope grants a lot of power. Be careful when authorizing it!</div>
{% endif %}
{{ scope.description }}
</div>
</div>
@ -50,13 +61,18 @@
</div>
<div class="button-bar">
{% if has_dangerous_scopes %}
<button type="button" class="btn btn-warning" onclick="$('#confirmAuthorizeModal').modal()">Authorize Application</button>
{% else %}
<form method="post" action="/oauth/authorizeapp">
<input type="hidden" name="client_id" value="{{ client_id }}">
<input type="hidden" name="redirect_uri" value="{{ redirect_uri }}">
<input type="hidden" name="scope" value="{{ scope }}">
<input type="hidden" name="_csrf_token" value="{{ csrf_token_val }}">
<button type="submit" class="btn btn-success">Authorize Application</button>
</form><form method="post" action="/oauth/denyapp">
</form>
{% endif %}
<form method="post" action="/oauth/denyapp">
<input type="hidden" name="client_id" value="{{ client_id }}">
<input type="hidden" name="redirect_uri" value="{{ redirect_uri }}">
<input type="hidden" name="scope" value="{{ scope }}">
@ -65,4 +81,40 @@
</form>
</div>
</div>
<!-- Modal message dialog -->
<div class="modal fade" id="confirmAuthorizeModal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">Confirm Authorization</h4>
</div>
<div class="modal-body">
The application <strong>{{ application.name }}</strong> is requesting access to scopes with wide
permissions.
<br><br>
Really authorize?
</div>
<div class="modal-footer">
<form method="post" action="/oauth/authorizeapp" style="display: inline-block">
<input type="hidden" name="client_id" value="{{ client_id }}">
<input type="hidden" name="redirect_uri" value="{{ redirect_uri }}">
<input type="hidden" name="scope" value="{{ scope }}">
<input type="hidden" name="_csrf_token" value="{{ csrf_token_val }}">
<button type="submit" class="btn btn-success">Authorize Application</button>
</form>
<form method="post" action="/oauth/denyapp" style="display: inline-block">
<input type="hidden" name="client_id" value="{{ client_id }}">
<input type="hidden" name="redirect_uri" value="{{ redirect_uri }}">
<input type="hidden" name="scope" value="{{ scope }}">
<input type="hidden" name="_csrf_token" value="{{ csrf_token_val }}">
<button type="submit" class="btn btn-default">Deny</button>
</form>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
{% endblock %}