Commit af5fea48 authored by Sébastiaan Versteeg's avatar Sébastiaan Versteeg Committed by Thom Wiggers
Browse files

Update Fancybox to version 3

parent 82feedda
$(function () {
$(".partner-image-card a").fancybox({
helpers: {
title: {
type: 'float'
}
},
padding: 0,
tpl: {
closeBtn: '<a title="Close" class="btn btn-primary fancybox-close" href="javascript:;"><i class="fas fa-times"></i></a>',
next: '<a title="Next" class="fancybox-nav fancybox-next" href="javascript:;"><span class="btn btn-primary"><i class="fas fa-arrow-right"></i></span></a>',
prev: '<a title="Previous" class="fancybox-nav fancybox-prev" href="javascript:;"><span class="btn btn-primary"><i class="fas fa-arrow-left"></i></span></a>'
}
buttons: [
"thumbs",
"close"
],
});
var windowhash = window.location.hash;
......
......@@ -36,7 +36,7 @@ def partner_image_card(image):
url=thumbnail(image, settings.THUMBNAIL_SIZES['large'], fit=False),
image_url=image_url,
class_name=class_name,
anchor_attrs='rel="gallery"'
anchor_attrs='data-fancybox="gallery"'
)
......
$(function() {
$(".photo-card a").fancybox({
helpers: {
title : {
type : 'float'
}
},
afterShow: function() {
var downloadUrl = $(this.element).attr('data-download');
if(downloadUrl !== undefined) {
$('<a class="btn btn-primary fancybox-download" href="' + downloadUrl + '"><i class="fas fa-download"></i></a>').appendTo(this.outer);
}
},
padding: 0,
tpl: {
closeBtn: '<a title="Close" class="btn btn-primary fancybox-close" href="javascript:;"><i class="fas fa-times"></i></a>',
next: '<a title="Next" class="fancybox-nav fancybox-next" href="javascript:;"><span class="btn btn-primary"><i class="fas fa-arrow-right"></i></span></a>',
prev: '<a title="Previous" class="fancybox-nav fancybox-prev" href="javascript:;"><span class="btn btn-primary"><i class="fas fa-arrow-left"></i></span></a>'
$(function () {
$(".photo-card a").fancybox({
buttons: [
"download",
"thumbs",
"close"
],
afterShow: function(instance, current) {
$(instance.$refs.container)
.find("[data-fancybox-download]")
.attr("href", current.opts.download);
}
});
});
});
......@@ -36,8 +36,8 @@ def album_card(album):
@register.inclusion_tag('includes/grid_item.html')
def photo_card(photo):
class_name = 'photo-card rotate{}'.format(photo.rotation)
anchor_attrs = 'data-fancybox-rotation="{}" rel="gallery"'.format(
photo.rotation)
anchor_attrs = (f'data-fancybox-rotation="{photo.rotation}" '
f'data-fancybox="gallery"')
if photo.album.shareable:
anchor_attrs += ' data-download={}'.format(
......
......@@ -7,23 +7,19 @@ $(function () {
$('#thabloid-index .thabloid-card .btn.open').click(function (e) {
e.preventDefault();
var downloadLink = $(this).next('.download').attr('href');
$.ajax(this.href).done(function (data) {
$.fancybox(data,
$.fancybox.open(data,
{
padding: 0,
tpl: {
closeBtn: '<a title="Close" class="btn btn-secondary fancybox-close" href="javascript:;"><i class="fas fa-times"></i></a>',
next: '<a title="Next" class="fancybox-nav fancybox-next" href="javascript:;"><span class="btn btn-secondary"><i class="fas fa-arrow-right"></i></span></a>',
prev: '<a title="Previous" class="fancybox-nav fancybox-prev" href="javascript:;"><span class="btn btn-secondary"><i class="fas fa-arrow-left"></i></span></a>'
},
loop: false,
openEffect: 'elastic',
closeEffect: 'elastic',
helpers: {
overlay: {
css: {'background-color': 'rgba(0, 0, 0, 0.9)'},
locked: true
}
buttons: [
"download",
"thumbs",
"close"
],
afterShow: function (instance, current) {
$(instance.$refs.container)
.find("[data-fancybox-download]")
.attr("href", downloadLink);
}
});
});
......
......@@ -32,5 +32,5 @@ def thabloid_card(year, thabloid):
meta_text=buttons,
url=None,
image_url=thumbnail(thabloid.cover, '255x360'),
class_name='thabloid-card mix {}'.format(class_name),
class_name=f'thabloid-card mix {class_name}',
)
......@@ -15,5 +15,6 @@ def index(request):
def pages(request, year, issue):
thabloid = get_object_or_404(Thabloid, year=int(year), issue=int(issue))
pages = ['{}{}'.format(settings.MEDIA_URL, p) for p in thabloid.pages]
pages = [{'src': '{}{}'.format(settings.MEDIA_URL, p)} for p in
thabloid.pages]
return JsonResponse(pages, safe=False)
......@@ -7,7 +7,7 @@ msgid ""
msgstr ""
"Project-Id-Version: \n"
"Report-Msgid-Bugs-To: \n"
"POT-Creation-Date: 2018-11-07 20:47+0100\n"
"POT-Creation-Date: 2018-11-11 19:17+0100\n"
"PO-Revision-Date: 2018-11-07 20:51+0100\n"
"Last-Translator: Sébastiaan Versteeg <se_bastiaan@outlook.com>\n"
"Language-Team: \n"
......@@ -1131,8 +1131,8 @@ msgid ""
"\">here</a>."
msgstr ""
"Templates voor presentaties vind je <a href=\"https://drive.google.com/drive/"
"folders/1CL4eVSqlvYcqP_u99y6mgGJpqWWG_q7Z\">hier</a> voor PowerPoint, Keynote "
"en LibreOffice."
"folders/1CL4eVSqlvYcqP_u99y6mgGJpqWWG_q7Z\">hier</a> voor PowerPoint, "
"Keynote en LibreOffice."
#: templates/singlepages/styleguide.html
msgid "Posters & Banners"
......@@ -1175,10 +1175,11 @@ msgid ""
"\">media@thalia.nu</a> to get yourself a sleek poster for your event."
msgstr ""
"Je kunt de templates <a href=\"https://drive.google.com/drive/"
"folders/1oPxLJ20AURaLjgYNSMuf9I-LarSQWjzC\">hier</a> vinden. Het is echter in "
"principe de taak van de Mediacommissie om deze posters & banners te maken. "
"Je kunt dus altijd een mailtje sturen naar <a href=\"mailto:media@thalia.nu"
"\">media@thalia.nu</a> voor een strakke afbeelding bij je evenement."
"folders/1oPxLJ20AURaLjgYNSMuf9I-LarSQWjzC\">hier</a> vinden. Het is echter "
"in principe de taak van de Mediacommissie om deze posters & banners te "
"maken. Je kunt dus altijd een mailtje sturen naar <a href=\"mailto:"
"media@thalia.nu\">media@thalia.nu</a> voor een strakke afbeelding bij je "
"evenement."
#: templates/singlepages/styleguide.html
msgid ""
......@@ -1267,8 +1268,8 @@ msgid ""
msgstr ""
"Op de website gebruiken we een ander lettertype voor de kopteksten en het "
"menu. Dit omdat we geen licentie hebben om Gill Sans MT Condensed online te "
"gebruiken. Dat lettertype is ‘Oswald’. Het is open-source en <a "
"href=\"https://github.com/googlefonts/OswaldFont\">hier</a> te downloaden."
"gebruiken. Dat lettertype is ‘Oswald’. Het is open-source en <a href="
"\"https://github.com/googlefonts/OswaldFont\">hier</a> te downloaden."
#: templates/singlepages/styleguide.html
msgid "Downloads"
......
# SOME DESCRIPTIVE TITLE.
# Copyright (C) YEAR THE PACKAGE'S COPYRIGHT HOLDER
# This file is distributed under the same license as the PACKAGE package.
# FIRST AUTHOR <EMAIL@ADDRESS>, YEAR.
#
msgid ""
msgstr ""
"Project-Id-Version: \n"
"Report-Msgid-Bugs-To: \n"
"POT-Creation-Date: 2018-11-11 19:18+0100\n"
"PO-Revision-Date: 2018-11-11 19:19+0100\n"
"Language: nl\n"
"MIME-Version: 1.0\n"
"Content-Type: text/plain; charset=UTF-8\n"
"Content-Transfer-Encoding: 8bit\n"
"Plural-Forms: nplurals=2; plural=(n != 1);\n"
"Last-Translator: \n"
"Language-Team: \n"
"X-Generator: Poedit 2.2\n"
#: static/js/main.js
msgid "Close"
msgstr "Sluiten"
#: static/js/main.js
msgid "Next"
msgstr "Volgende"
#: static/js/main.js
msgid "Previous"
msgstr "Vorige"
#: static/js/main.js
msgid "The requested content cannot be loaded. <br/> Please try again later."
msgstr "De opgevraagde inhoud kon niet worden geladen <br/> Probeer het later nog eens."
#: static/js/main.js
msgid "Start slideshow"
msgstr "Start slideshow"
#: static/js/main.js
msgid "Pause slideshow"
msgstr "Pauzeer slideshow"
#: static/js/main.js
msgid "Full screen"
msgstr "Volledig scherm"
#: static/js/main.js
msgid "Thumbnails"
msgstr "Thumbnails"
#: static/js/main.js
msgid "Download"
msgstr "Download"
#: static/js/main.js
msgid "Share"
msgstr "Delen"
#: static/js/main.js
msgid "Zoom"
msgstr "Zoom"
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
$(function () {
$('[data-toggle="tooltip"]').tooltip();
$("#language-switcher").click(function(e) {
$("#language-switcher").click(function (e) {
e.preventDefault();
$("#change-language-form").submit();
return false;
});
});
$.fancybox.defaults.btnTpl.close = '<a title="{{CLOSE}}" class="fancybox-button fancybox-button--close" data-fancybox-close href="javascript:;"><i class="fas fa-times"></i></a>';
$.fancybox.defaults.btnTpl.arrowRight = '<a title="{{NEXT}}" class="fancybox-button fancybox-button--arrow_right" data-fancybox-next href="javascript:;"><i class="fas fa-arrow-right"></i></a>';
$.fancybox.defaults.btnTpl.arrowLeft = '<a title="{{PREV}}" class="fancybox-button fancybox-button--arrow_left" data-fancybox-prev href="javascript:;"><i class="fas fa-arrow-left"></i></a>';
$.fancybox.defaults.btnTpl.thumbs = '<a title="{{THUMBS}}" class="fancybox-button fancybox-button--thumbs" data-fancybox-thumbs href="javascript:;"><i class="fas fa-th"></i></a>';
$.fancybox.defaults.btnTpl.download = '<a title="{{DOWNLOAD}}" class="fancybox-button fancybox-button--download" data-fancybox-download href="javascript:;"><i class="fas fa-download"></i></a>';
$.fancybox.defaults.i18n.django = {
CLOSE: gettext('Close'),
NEXT: gettext('Next'),
PREV: gettext('Previous'),
ERROR: gettext('The requested content cannot be loaded. <br/> Please try again later.'),
PLAY_START: gettext("Start slideshow"),
PLAY_STOP: gettext("Pause slideshow"),
FULL_SCREEN: gettext("Full screen"),
THUMBS: gettext("Thumbnails"),
DOWNLOAD: gettext("Download"),
SHARE: gettext("Share"),
ZOOM: gettext("Zoom")
};
$.fancybox.defaults.lang = 'django';
......@@ -185,7 +185,7 @@
<script type="text/javascript"
src="{% static "js/bootstrap.bundle.min.js" %}"></script>
<script type="text/javascript"
src="{% static "js/jquery.fancybox.js" %}"></script>
src="{% static "js/jquery.fancybox.min.js" %}"></script>
<script type="text/javascript"
src="{% static "js/main.js" %}"></script>
<script type="text/javascript"
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment