{% extends "exercise_base.html" %}

{% block title %}{{ block.super }}XSS via URL Path Variables{% endblock %}

{% block header %}
    <h1>XSS via URL Path Variables</h1>
{% endblock %}

{% block content %}
<p>Many URL dispatching schemes give you the ability to pull data from
the path and have it passed into your code. This allows you to set up
URLs like <code>/category/{id}</code>, extract the "id" value,
and pass it into the view. Since the path is provided by the user we must
make sure it doesn't contain anything malicious.</p>

<p>In this exercise, manipulate the URL path to inject
JavaScript that will change this page's title to <code>PLZ HACK MY USERS</code>.</p>

<div id="result"></div>

<div class="hints panel">
    <p>Helpful hints:</p>
    <ul>
        <li>Look at the HTML and compare it to the browser path.</li>
        <li><code>document.title</code> is the property that you want to modify.</li>
    </ul>
</div>

{% if path != "your-path-here" %}
    <a class="tiny button" id="show_solution">show solution</a>
{% endif %}
<div class="solution panel"></div>
{% endblock %}

{% block extra_topnav %}
<li><a href="{% url 'xss' %}">Prev</a></li>
<li><a href="{% url 'xss-query' %}?qs=awesome">Next</a></li>
{% endblock %}

{% block extra_botnav %}
<li><a href="{% url 'xss' %}">Prev</a></li>
<li><a href="{% url 'xss-query' %}?qs=awesome">Next</a></li>
{% endblock %}

{% block extra_js %}
{{ block.super }}
<script src="{{STATIC_URL}}js/exercises/xss-path.js"></script>
<script type="text/javascript">
var myvar = "{{path|safe}}";
</script>
{% endblock %}
