{% load i18n %}

<script type='text/javascript'>
    $(document).ajaxSend(function(event, xhr, settings) {
        function getCookie(name) {
            var cookieValue = null;
            if (document.cookie && document.cookie != '') {
                var cookies = document.cookie.split(';');
                for (var i = 0; i < cookies.length; i++) {
                    var cookie = jQuery.trim(cookies[i]);
                    // Does this cookie string begin with the name we want?
                    if (cookie.substring(0, name.length + 1) == (name + '=')) {
                        cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
                        break;
                    }
                }
            }
            return cookieValue;
        }
        function sameOrigin(url) {
            // url could be relative or scheme relative or absolute
            var host = document.location.host; // host + port
            var protocol = document.location.protocol;
            var sr_origin = '//' + host;
            var origin = protocol + sr_origin;
            // Allow absolute or scheme relative URLs to same origin
            return (url == origin || url.slice(0, origin.length + 1) == origin + '/') ||
                    (url == sr_origin || url.slice(0, sr_origin.length + 1) == sr_origin + '/') ||
                // or any other URL that isn't scheme relative or absolute i.e relative.
                    !(/^(\/\/|http:|https:).*/.test(url));
        }
        function safeMethod(method) {
            return (/^(GET|HEAD|OPTIONS|TRACE)$/.test(method));
        }

        if (!safeMethod(settings.type) && sameOrigin(settings.url)) {
            xhr.setRequestHeader("X-CSRFToken", getCookie('csrftoken'));
        }
    });

    function set_allow_cookies() {
        jQuery.post('{% url set_allow_cookies %}', function() {
            window.location.reload();
        })
    }

    jQuery(document).ready(function() {
        jQuery('#allow-cookies-button').click(function(event) {
            event.preventDefault();
            set_allow_cookies();
        })
    });

</script>

<style type="text/css">

    #allow-cookies-popup {
        font: 12px/1.4em "Helvetica Neue", Helvetica, arial, sans-serif;
        background-color: #333;
        background-image: -moz-linear-gradient(top, #5F6062, #333333);
        background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#5F6062), to(#333333));
        background-image: -webkit-linear-gradient(top, #5F6062, #333333);
        background-image: -o-linear-gradient(top, #5F6062, #333333);
        background-image: linear-gradient(to bottom, #5F6062, #333333);
        border: 1px solid #666;
        border-top-color: #999;
        color: #fff;
        padding: 7px 7px 7px 14px;
        position: relative;
        text-shadow: 0 1px 0 #000;
        -webkit-box-shadow: 0 0 4px rgba(0,0,0,.5);
        -moz-box-shadow: 0 0 4px rgba(0,0,0,.5)
        box-shadow: 0 0 4px rgba(0,0,0,.5);
        overflow: hidden;
    }
    #allow-cookies-popup #cookie-bar-text {
        padding: 5px 0 6px;
    }
    #allow-cookies-popup a.cookies-info-link {
        color: #fff;
        font-weight: bold;
        text-decoration: underline;
    }
    #allow-cookies-popup a.cookies-info-link:hover,
    #allow-cookies-popup a.cookies-info-link:focus {
        text-decoration: none;
    }
    #allow-cookies-popup #allow-cookies-button {
        float: right;
        padding: 4px 12px;
        margin:0 0 0 1em;
        font-size: 12px;
        line-height: 18px;
        color: white;
        text-align: center;
        text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
        text-decoration:none;
        font-weight: normal;
        font-style: normal;
        vertical-align: middle;
        cursor: pointer;
        background-color: #49AFCD;
        background-image: -moz-linear-gradient(top, #5BC0DE, #2F96B4);
        background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#5BC0DE), to(#2F96B4));
        background-image: -webkit-linear-gradient(top, #5BC0DE, #2F96B4);
        background-image: -o-linear-gradient(top, #5BC0DE, #2F96B4);
        background-image: linear-gradient(to bottom, #5BC0DE, #2F96B4);
        background-repeat: repeat-x;
        border: 1px solid #BBB;
        border-color: #2F96B4 #2F96B4 #1F6377;
        border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
        -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        border-radius: 4px;
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5bc0de', endColorstr='#ff2f96b4', GradientType=0);
        filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
    }
    #allow-cookies-popup a#allow-cookies-button:hover,
    #allow-cookies-popup a#allow-cookies-button:focus {
        background-color: #2f96b4;
        background-position: 0 -15px;
        text-decoration: none;
        -webkit-transition: background-position .1s linear;
        -moz-transition: background-position .1s linear;
        -ms-transition: background-position .1s linear;
        -o-transition: background-position .1s linear;
        transition: background-position .1s linear;
    }
</style>

{% if not request.COOKIES.allow_cookies == '1' %}
<div id="allow-cookies-popup">
    <a id="allow-cookies-button" class="btn primary" href="#">{{ bar.button_title }}</a>
    <div id="cookie-bar-text">{{ bar.text }} <a href="{{ bar.link }}" class="cookies-info-link">{{ bar.link_name }}</a></div>
</div>
{% endif %}