vacancies.html 6.38 KB
Newer Older
1
{% extends 'base.html' %}
2
{% load i18n bleach_tags %}
3

4
{% block title %}{% trans "Vacancies" %} — {% trans "Career" %} — {{ block.super }}{% endblock %}
5
{% block opengraph_title %}{% trans "Vacancies" %} — {% trans "Career" %} — {{ block.super }}{% endblock %}
6

7
8
{% block body %}
<h1>{% trans "Vacancies" %}</h1>
Joren Vrancken's avatar
Joren Vrancken committed
9
10
11
12
13
    <p class="tcenter">
        {% blocktrans trimmed %}
        If you want to work besides studying or when you are (almost) graduated you can look here for interesting vacancies. When you want to post a vacancy on this page as a company you can contact us at <a href="mailto:samenwerking@thalia.nu" target="_blank">samenwerking@thalia.nu</a>.
        {% endblocktrans %}
    </p>
14
15
16
17
18

<div class="isotope" id="vacanciespage">
    <!-- .portfolio-filter -->
    <div class="isotope-filter tabs-wrapper tabs-centered clearfix">
        <ul class="tabs">
19
            <li class="{% if not preselected_category %}current{% endif %}" id="tab-everything">
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
                <a href="#">{% trans "Everything" %}</a>
            </li>
            {% for category in categories %}
                <li
                        data-filter="category-{{ category.id }}"
                        class="{% if preselected_category and preselected_category.id == category.id %}current{% endif %}">
                    <a href="#">{{ category.name }}</a>
                </li>
            {% endfor %}
        </ul>
    </div>

    <!-- /.portfolio-filter -->
    <div class="row isotope-items">
        {% for vacancy in vacancies %}
            <div class="team span4 clearfix isotope-item"
36
37
38
                 data-filter="{% for cat in vacancy.categories.all %}category-{{ cat.id }} {% endfor %}"
                 data-vacancy="{{ vacancy.id }}"
            >
39
40
41
42
43
44
45
46
47
48
                <div class="team-header">
                    {% if vacancy.get_company_logo %}
                        <img src="{{ vacancy.get_company_logo.url }}" alt="">
                    {% endif %}
                </div>
                <div class="team-content">
                    <h5 class="tcenter">
                        {{ vacancy.get_company_name }}
                        <small>{{ vacancy.title }}</small>
                    </h5>
49
50
                    {# First do bleach to translate HTML entities, then strip all HTML tags since we're truncating this #}
                    <p>{{ vacancy.description|bleach|striptags|truncatechars:150 }}</p>
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
                    <div class="team-readmore">
                        {% if vacancy.partner %}
                             <a href="{% url 'partners:partner' slug=vacancy.partner.slug %}#vacancy-{{ vacancy.id }}">
                                 {% trans "Learn more" %}
                             </a>
                        {% else %}
                            <a href="#vacancy-{{ vacancy.id }}"
                               class="vacancy-external" data-vacancy="{{ vacancy.id }}">
                                {% trans "Learn more" %}
                            </a>
                        {% endif %}
                    </div>
                </div>
            </div>
        {% endfor %}
    </div>

    {% if vacancies|length > 0 %}
69
        <div>
70
71
72
73
74
75
76
77
78
79
80
81
82
83
            <h3>{% trans "All vacancies" %}</h3>

            <div class="row">
                <div class="span12">
                    <ul class="toggles">
                        {% for vacancy in vacancies %}
                             <li id="vacancy-{{ vacancy.id }}">
                                 <div class="toggle-title">
                                     <a href="#">
                                         <span></span>
                                         {{ vacancy.get_company_name }} | {{ vacancy.title }}
                                     </a>
                                 </div>
                                 <div class="toggle-content">
84
                                     {{ vacancy.description|bleach }}
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111

                                     {% if vacancy.link %}
                                         <br /><br />
                                         <a href="{{ vacancy.link }}" target="_blank" rel="noopener">
                                             <button type="button" class="btn-large btn-style2">
                                                 {% trans "Learn more" %}
                                             </button>
                                         </a>
                                     {% endif %}
                                 </div>
                             </li>
                        {% endfor %}
                    </ul>
                </div>
            </div>
        </div>
    {% endif %}
</div>

    <script type="text/javascript">
        $(document).ready(function(){
            var body = $('body');

            var isotope = body.find('.isotope'),
                    isotopeFilter = isotope.find('.isotope-filter'),
                    isotopePosts = isotope.find('.isotope-items');

112
113
            var windowhash = window.location.hash;

114
115
116
117
            if (jQuery().isotope) {
                isotopeFilter.delegate('li', 'click', function(e) {
                    var filter;

118
119
120
121
122
                    if (windowhash !== '' && windowhash.substr(0, 9) === '#vacancy-') {
                        filter = '[data-vacancy*="' + windowhash.replace('#vacancy-', '') + '"]';
                        $('#tab-everything').removeClass('current');
                        windowhash = '';
                    } else if ($(this).data('filter')==undefined) {
123
124
125
126
127
128
129
130
131
132
                        filter='*';
                    } else {
                        filter='[data-filter*="' + $(this).data('filter') + '"]';
                    }
                    setTimeout(function() {
                        isotopePosts.isotope({ filter: filter });
                    }, 100);
                });
            }

133
134
135
136
137
138
139
140
            $(window).on('load', function () {
                $(window).resize(function () {
                    if (isotopeFilter.find('li.current').length) {
                        isotopeFilter.find('li.current').trigger('click');
                    } else {
                        isotopeFilter.find('li:first').trigger('click');
                    }
                });
141
142
143
144
145
146
147
148
            });

            $('.vacancy-external').click(function() {
                var id = $(this).attr('data-vacancy');
                $('#vacancy-' + id).children('.toggle-title').click();
            });
        });
    </script>
149
{% endblock body %}